.pt-privacy {background-image: url(../img/pagetitle/privacy.jpg);}
.pt-contact {background-image: url(../img/pagetitle/contact.jpg);}
.pt-recruit {background-image: url(../img/pagetitle/recruit.jpg);}
.pt-agent {background-image: url(../img/pagetitle/agent.jpg);}
.pt-service {background-image: url(../img/pagetitle/service.jpg);}
.pt-service_led {background-image: url(../img/pagetitle/service_led.jpg);}
.pt-service_jel_control {background-image: url(../img/pagetitle/service_jel_control.jpg);}
.pt-service_laundry {background-image: url(../img/pagetitle/service_laundry.jpg);}
.pt-service_vacuum {background-image: url(../img/pagetitle/service_vacuum.jpg);}
.pt-service_bio_friend {background-image: url(../img/pagetitle/service_bio_friend.jpg);}
.pt-service_pos {background-image: url(../img/pagetitle/service_pos.jpg);}
.pt-service_debit {background-image: url(../img/pagetitle/service_debit.jpg);}
.pt-service_interior {background-image: url(../img/pagetitle/service_interior.jpg);}
.pt-service_lease_rental {background-image: url(../img/pagetitle/service_lease_rental.jpg);}
.pt-service_equipment {background-image: url(../img/pagetitle/service_equipment.jpg);}
.pt-service_finance {background-image: url(../img/pagetitle/service_finance.jpg);}
.pt-outline {background-image: url(../img/pagetitle/outline.jpg);}


/* Style for PCs */
@media screen and (min-width: 1025px) {

/* header layout
----------------------------------------------------------------*/
header {
  top:30px;
}
header h1 {
  top:30px;
}
nav.globalmenu {
  top:30px;
}

/* Pagetitle
----------------------------------------------------------------*/
.pagetitle {
  width:100%;
  height: auto;
  display:flex;
  justify-content: space-between;
  padding:120px 0 13% 0;
  background-repeat: no-repeat;
  background-position: 0 bottom;
  background-size: 100% auto;
}
.ptbody {
  width:fit-content;
  height: auto;
  display: block;
  background-color: var(--color-f8);
  padding:30px 10% 20px 5%;
}
.ptbody h2 {
  font-size:28px;
  font-weight: 700;
  line-height: 1.2em;
  color:var(--color-black);
  margin-bottom: 15px;
}
.ptbody p {
  font-size:14px;
  font-weight: 400;
  line-height: 1.2em;
  color:var(--color-1st);
  margin-bottom: 0px;
}
.pankuzu {
  width:50%;
  height: 40px;
  display: block;
  margin-left: auto;
  text-align: right;
  padding:30px 5% 0 0;
}
.pankuzu li {
  display: inline-block;
  font-size:12px;
  line-height: 40px;
}
.pankuzu li:after {
  content:" >";
}
.pankuzu li:last-child:after {
  content:"";
}
.pankuzu li a {
  color:var(--color-5th);
}
.pankuzu li a:hover {
  color:var(--color-1st);
  text-decoration: none;
}

/* Main
----------------------------------------------------------------*/
main {
  width:100%;
  height: auto;
  display: block;
}

.mmcc {
  width:100%;
  height: auto;
  display: block;
  padding:80px 5%;
}
.mmcc p {
  font-size:14px;
  line-height: 2em;
  margin-bottom: 2em;
}
.mmcc p.pnom {
  margin-bottom: 0;
}
.mmcc p.pnom1 {
  margin-bottom: 0.5em;
}
.mmcc h2 {
  font-size:clamp(24px, 2vw, 42px);
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-black);
  margin-bottom: 0.5em;
}
.mmcc h3 {
  font-size:clamp(20px, 1vw, 32px);
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  margin-bottom: 0.5em;
}
.mmcc h4 {
  font-size:clamp(14px, 1vw, 20px);
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  padding-bottom: 5px;
  border-bottom: 1px solid var(--color-5th);
  margin-bottom: 10px;
}
.mmcc h5 {
  font-size:14px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  margin-bottom: 10px;
}

.mmcc h6 {
  font-size:14px;
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-white);
  padding:3px;
  background-color: var(--color-5th);
  margin-bottom: 8px;
}

/* Outline */
p.p_sign {
  font-size:16px;
  font-weight: 700;
  line-height: 2.5em;
  text-align: right;
  color: var(--color-black);
  margin-bottom: 0px;
}
p.p_sign strong {
  font-size:32px;
  margin-left:10px;
}
.mapmm, .mapmm iframe {
  width: 100%;
  height: 500px;
}
.ccbox01 {
  background-color: var(--color-white);
  border-radius: 5px;
  padding:45px;
  box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
}


/* Contents Tab */
.contentstab {
  width:100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.contentstab:first-child {
  margin-bottom: 50px;
}
.contentstab:last-child {
  margin-top: 50px;
}
.contentstab li {
  width:49%;
  font-size:14px;
  font-weight: 700;
  line-height: 1.25em;
  text-align: center;
  margin:0 0.5% 5px;
}
.contentstab li.ct_bn_selected {
  width:49%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10px 0px;
  color:var(--color-white);
  background-color: var(--color-2nd);
}
.contentstab li a {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10px 0px;
  color:var(--color-white);
  background-color: var(--color-5th);
  transition: .4s all;
  border-radius: 3px;
}
.contentstab li a:hover {
  background-color: var(--color-3rd);
}

/* Contents title */
.cctitle {
  font-size:45px!important;
  font-weight: 100!important;
  line-height: 1.25em!important;
  color:var(--color-5th)!important;
  margin-bottom: 20px!important;
}


/* Q and A */
dl.qalist {
  width:100%;
  height: auto;
  display: block;
}
dl.qalist dt {
  width:100%;
  height: auto;
  min-height: 50px;
  display: block;
  font-size:clamp(18px, 1vw, 24px);
  font-weight: 700;
  color:var(--color-5th);
  line-height: 1.25em;
  padding:12.5px 0 0 60px;
  margin-bottom: 0px;
  background-image: url(../img/service/biofriend/ic-q.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 50px;
}
dl.qalist dd {
  width:100%;
  height: auto;
  min-height: 50px;
  display: block;
  font-size:clamp(14px, 1vw, 16px);
  font-weight: 400;
  line-height: 2em;
  padding:11px 0 0 60px;
  margin-bottom: 25px;
  background-image: url(../img/service/biofriend/ic-a.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 50px;
}


/* Cresit card Logo */
.cresitlogo {
  width:60%;
  height:auto;
  display: flex;
  justify-content: space-between;
  align-items:center;
  margin:0 auto 40px;
}
.cresitlogo li {
  flex:1;
  margin:0 5%;
}

}


/* Style for iPad Pro */
@media screen and (min-width: 769px) and (max-width: 1024px) {

  /* Pagetitle
----------------------------------------------------------------*/
.pagetitle {
  width:100%;
  height: auto;
  display:flex;
  justify-content: space-between;
  padding:80px 0 13% 0;
  background-repeat: no-repeat;
  background-position: 0 bottom;
  background-size: 100% auto;
}
.ptbody {
  width:fit-content;
  height: auto;
  display: block;
  background-color: var(--color-f8);
  padding:30px 10% 20px 5%;
}
.ptbody h2 {
  font-size:28px;
  font-weight: 700;
  line-height: 1.2em;
  color:var(--color-black);
  margin-bottom: 15px;
}
.ptbody p {
  font-size:14px;
  font-weight: 400;
  line-height: 1.2em;
  color:var(--color-1st);
  margin-bottom: 0px;
}
.pankuzu {
  width:50%;
  height: 40px;
  display: block;
  margin-left: auto;
  text-align: right;
  padding:30px 5% 0 0;
}
.pankuzu li {
  display: inline-block;
  font-size:12px;
  line-height: 40px;
}
.pankuzu li:after {
  content:" >";
}
.pankuzu li:last-child:after {
  content:"";
}
.pankuzu li a {
  color:var(--color-5th);
}
.pankuzu li a:hover {
  color:var(--color-1st);
  text-decoration: none;
}

/* Main
----------------------------------------------------------------*/
main {
  width:100%;
  height: auto;
  display: block;
}

.mmcc {
  width:100%;
  height: auto;
  display: block;
  padding:80px 5%;
}
.mmcc p {
  font-size:14px;
  line-height: 2em;
  margin-bottom: 2em;
}
.mmcc p.pnom {
  margin-bottom: 0;
}
.mmcc p.pnom1 {
  margin-bottom: 1em;
}
.mmcc h2 {
  font-size:28px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-black);
  margin-bottom: 20px;
}
.mmcc h3 {
  font-size:22px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 15px;
}
.mmcc h4 {
  font-size:18px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  padding-bottom: 5px;
  border-bottom: 1px solid var(--color-ccc);
  margin-bottom: 5px;
}
.mmcc h5 {
  font-size:14px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  margin-bottom: 5px;
}
.mmcc h6 {
  font-size:14px;
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-white);
  padding:3px;
  background-color: var(--color-5th);
  margin-bottom: 8px;
}


/* Outline */
p.p_sign {
  font-size:16px;
  font-weight: 700;
  line-height: 2.5em;
  text-align: right;
  color: var(--color-black);
  margin-bottom: 0px;
}
p.p_sign strong {
  font-size:32px;
  margin-left:10px;
}
.mapmm, .mapmm iframe {
  width: 100%;
  height: 500px;
}
.ccbox01 {
  background-color: var(--color-white);
  border-radius: 5px;
  padding:45px;
  box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
}


/* Contents Tab */
.contentstab {
  width:100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.contentstab:first-child {
  margin-bottom: 50px;
}
.contentstab:last-child {
  margin-top: 50px;
}
.contentstab li {
  width:49%;
  font-size:14px;
  font-weight: 700;
  line-height: 1.25em;
  text-align: center;
  margin:0 0.5% 5px;
}
.contentstab li.ct_bn_selected {
  width:49%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10px 0px;
  color:var(--color-white);
  background-color: var(--color-2nd);
}
.contentstab li a {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10px 0px;
  color:var(--color-white);
  background-color: var(--color-5th);
  transition: .4s all;
  border-radius: 3px;
}
.contentstab li a:hover {
  background-color: var(--color-3rd);
}

/* Contents title */
.cctitle {
  font-size:45px!important;
  font-weight: 100!important;
  line-height: 1.25em!important;
  color:var(--color-5th)!important;
  margin-bottom: 20px!important;
}


/* Q and A */
dl.qalist {
  width:100%;
  height: auto;
  display: block;
}
dl.qalist dt {
  width:100%;
  height: auto;
  min-height: 50px;
  display: block;
  font-size:18px;
  font-weight: 700;
  color:var(--color-5th);
  line-height: 1.25em;
  padding:12.5px 0 0 60px;
  margin-bottom: 0px;
  background-image: url(../img/service/biofriend/ic-q.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 50px;
}
dl.qalist dd {
  width:100%;
  height: auto;
  min-height: 50px;
  display: block;
  font-size:14px;
  font-weight: 400;
  line-height: 2em;
  padding:11px 0 0 60px;
  margin-bottom: 25px;
  background-image: url(../img/service/biofriend/ic-a.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 50px;
}


/* Cresit card Logo */
.cresitlogo {
  width:60%;
  height:auto;
  display: flex;
  justify-content: space-between;
  align-items:center;
  margin:0 auto 40px;
}
.cresitlogo li {
  flex:1;
  margin:0 5%;
}

/* Cresit card Logo */
.cresitlogo {
  width:80%;
  height:auto;
  display: flex;
  justify-content: space-between;
  align-items:center;
  margin:0 auto 40px;
}
.cresitlogo li {
  flex:1;
  margin:0 5%;
}

}

/* Style for Smartphone */
@media screen and (max-width: 768px) {

  /* Pagetitle
----------------------------------------------------------------*/
.pagetitle {
  width:100%;
  height: auto;
  display:flex;
  flex-direction: column;
  justify-content: space-between;
  padding:100px 0 20% 0;
  background-repeat: no-repeat;
  background-position: 0 bottom;
  background-size: 100% auto;
}
.ptbody {
  width:fit-content;
  height: auto;
  display: block;
  background-color: var(--color-f8);
  padding:0px 5% 10px 5%;
}
.ptbody h2 {
  font-size:24px;
  font-weight: 700;
  line-height: 1.2em;
  color:var(--color-black);
  margin-bottom: 10px;
}
.ptbody p {
  font-size:12px;
  font-weight: 400;
  line-height: 1.2em;
  color:var(--color-1st);
  margin-bottom: 0px;
}
.pankuzu {
  width:100%;
  height: auto;
  display: block;
  text-align: left;
  padding:0 5% 0 5%;
}
.pankuzu li {
  display: inline-block;
  font-size:12px;
  line-height: 30px;
}
.pankuzu li:after {
  content:" >";
}
.pankuzu li:last-child:after {
  content:"";
}
.pankuzu li a {
  color:var(--color-5th);
}
.pankuzu li a:hover {
  color:var(--color-1st);
  text-decoration: none;
}

/* Main
----------------------------------------------------------------*/
main {
  width:100%;
  height: auto;
  display: block;
}

.mmcc {
  width:100%;
  height: auto;
  display: block;
  padding:50px 5%;
}
.mmcc p {
  font-size:14px;
  line-height: 2em;
  margin-bottom: 2em;
}
.mmcc p.pnom {
  margin-bottom: 0;
}
.mmcc p.pnom1 {
  margin-bottom: 1em;
}
.mmcc h2 {
  font-size:26px;
  font-weight: 700;
  line-height: 1.4em;
  color:var(--color-black);
  margin-bottom: 20px;
}
.mmcc h3 {
  font-size:18px;
  font-weight: 700;
  line-height: 1.4em;
  color:var(--color-5th);
  margin-bottom: 15px;
}
.mmcc h4 {
  font-size:16px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  padding-bottom: 5px;
  border-bottom: 1px solid var(--color-ccc);
  margin-bottom: 5px;
}
.mmcc h5 {
  font-size:14px;
  font-weight: 700;
  line-height: 1.25em;
  color:var(--color-5th);
  margin-bottom: 5px;
}

.mmcc h6 {
  font-size:14px;
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-white);
  padding:3px;
  background-color: var(--color-5th);
  margin-bottom: 8px;
}
.nbr {
  display: none;
}

/* Outline */
p.p_sign {
  font-size:16px;
  font-weight: 700;
  line-height: 2.5em;
  text-align: right;
  color: var(--color-black);
  margin-bottom: 0px;
}
p.p_sign strong {
  font-size:32px;
  margin-left:10px;
}
.mapmm, .mapmm iframe {
  width: 100%;
  height: 500px;
}
.ccbox01 {
  background-color: var(--color-white);
  border-radius: 5px;
  padding:45px;
  box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
}


/* Contents Tab */
.contentstab {
  width:100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.contentstab:first-child {
  margin-bottom: 50px;
}
.contentstab:last-child {
  margin-top: 50px;
}
.contentstab li {
  width:100%;
  font-size:12px;
  font-weight: 700;
  line-height: 1.25em;
  text-align: center;
  margin:0 0.5% 5px;
}
.contentstab li.ct_bn_selected {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10px 0px;
  color:var(--color-white);
  background-color: var(--color-2nd);
}
.contentstab li a {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding:10px 5%;
  color:var(--color-white);
  background-color: var(--color-5th);
  transition: .4s all;
  border-radius: 3px;
}
.contentstab li a:hover {
  background-color: var(--color-3rd);
}

/* Contents title */
.cctitle {
  font-size:30px!important;
  font-weight: 100!important;
  line-height: 1.25em!important;
  color:var(--color-5th)!important;
  margin-bottom: 20px!important;
}


/* Q and A */
dl.qalist {
  width:100%;
  height: auto;
  display: block;
}
dl.qalist dt {
  width:100%;
  height: auto;
  min-height: 40px;
  display: block;
  font-size:16px;
  font-weight: 700;
  color:var(--color-5th);
  line-height: 1.25em;
  padding:10px 0 0 50px;
  margin-bottom: 5px;
  background-image: url(../img/service/biofriend/ic-q.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 40px;
}
dl.qalist dd {
  width:100%;
  height: auto;
  min-height: 40px;
  display: block;
  font-size:14px;
  font-weight: 400;
  line-height: 2em;
  padding:7px 0 0 50px;
  margin-bottom: 25px;
  background-image: url(../img/service/biofriend/ic-a.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 40px;
}


/* Cresit card Logo */
.cresitlogo {
  width:100%;
  height:auto;
  display: flex;
  justify-content: space-between;
  align-items:center;
  margin:0 auto 40px;
}
.cresitlogo li {
  flex:1;
  margin:0 5%;
}


}