@charset "utf-8";

section img{
 width: auto;
 max-width: 100%;
}
/* service */
.serviceNav{
 background: #fff;
 display: flex;
 flex-flow: row wrap;
 padding-inline:min(80px, calc(80 / 1400 * 100%));
 gap:10px 4%;
}
.serviceNav li{
  display: flex;
 width: 48%;
}
.serviceNav li a{
    display: grid;
    align-items: center;
    width: 100%;
 border-bottom: 1px #C3C3C3 solid;
 padding-block-end: 14px;
 font-size: 1.4rem;
 line-height: 1.2;
 letter-spacing: 0.1em;
 text-align: center;
}

@media screen and (min-width: 769px) {
 .serviceNav{
  padding-inline:min(100px, calc(100 / 1400 * 100%));
  gap:20px 33px;
 } 
 .serviceNav li{
  width: calc((100% - 33px*5)/6);
 }

}/*-PC only-*/

/****/

main section{
 padding-block:min(150px, calc(150 / 1400 * 100%));
 padding-inline:min(80px, calc(80 / 1400 * 100%));
}
section h2{
 margin-block-end: 20px;
 font-size: min(10vw,5.4rem);
 font-weight: 400;
 line-height: 1.4;
 letter-spacing: 0.1em;
}
section h2 .num{
 display: block;
 margin-block-end: 2px;
 font-size: 1rem;
 letter-spacing: 0.2em;
}
section .secCatch{
 margin-block-end: 60px;
 font-size: 3.6rem;
 text-align: center;
 line-height: 1.4;
 letter-spacing: 0;
}
section h3{
 margin-block-end: 15px;
 font-size: 2.6rem;
 line-height: 1.77;
}
.ttlDot{
 position: relative;
 margin-block-start:64px; 
 margin-block-end: 35px;
 padding-inline-start: 29px;
}
.ttlDot::before{
 content: "";
 display: block;
 border-radius: 50%;
 background: #C3181F;
 width: 19px;
 height: 19px;
 position: absolute;
 top: 0.62em;
 left: 0;
}

section p{
 font-size: 1.4rem;
 line-height: 2.1;
}
.red{color: #C3181F;}
.price{
 margin-block-end: 23px;
 color: #C3181F;
 font-size: 3.6rem;
 line-height: 1.4;
}
.price span{
 color: #000;
 font-size: 1.6rem;
}

@media screen and (min-width: 769px) {
main section{
 padding-block:min(150px, calc(150 / 1400 * 100%));
 padding-inline:min(100px, calc(100 / 1400 * 100%));
}
section h2{
 margin-block-end: 14px;
 font-size: 5.4rem;
}

section .secCatch{
 margin-block-end: 60px;
 font-size: 3.6rem;
}
section p{
 font-size: 1.4rem;
 line-height: 2.1;
}
 section > p{
  max-width: 871px;
 }
 .pcFlex:has(.price){
  align-items: flex-end;
 }
}/*-PC only-*/

.mv{
 margin-block-end:min(107px,calc(107 / 1400 * 100%)) ;
}
.mv img{
 border-radius: 5px;
}

.icList{
 display: flex;
 flex-flow: column;
 gap:15px 0;
}
.icList li{
 position: relative;
 border-radius: 5px;
 background: #F3F3F3;
 padding: 16px 26px 20px 86px;
 font-size: 1.6rem;
 line-height: 1.625;
}
.icList li >img{
 position: absolute;
 top: 50%;
 left: 43px;
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
}
.icList li h4{
 margin-block-end: 5px;
 font-size: 2.2rem;
 line-height: 1.2;
}
.icList li p{
 font-size: 1.6rem;
 line-height: 1.625;
}

@media screen and (min-width: 769px) {
.icList{
 flex-flow: row wrap;
 gap:15px 41px;
}
.icList li{
 width: calc((100% - 41px)/2);
 padding: 16px 46px 20px 106px;
}
 .icList li >img{
 left: 53px;
}

}/*-PC only-*/

.column3{
 display: flex;
 flex-flow: column;
 gap:20px 0;
}
p + .column3{
 margin-block-start: 53px;
}
.column3 li{
 border-radius: 5px;
 background: #F3F3F3; 
 padding-block-end: 28px;
 font-size: 1.4rem;
 line-height: 1.85;
}
.column3 li figure{
 margin-block-end: 25px;
}
.column3 li figure img{
 border-radius: 5px 5px 0 0;
 object-fit: cover;
 width: 100%;
 height: 100%;
 aspect-ratio:355/151;
}
.column3 li h4{
 margin: 0 8px 13px 35px;
 font-size: 1.8rem;
 line-height: 1.44;
}
.column3 li p{
 margin: 0 34px 0 35px;
 font-size: 1.4rem;
 line-height: 1.85;
}

@media screen and (min-width: 769px) {
.column3{
 flex-flow: row wrap;
 gap:20px 51px;
}
.column3 li{
 width: calc((100% - 51px*2)/3);
}

}/*-PC only-*/

.planList{
 display: flex;
 flex-flow: column;
 gap:20px 0;
}
.planList >li{
 border-radius: 5px;
 background: #F3F3F3; 
 padding:16px 25px 30px;
 font-size: 1.4rem;
 line-height: 1.7;
}
.planList h4{
 display: flex;
 align-items: center;
 justify-content: center;
 border-radius: 5px;
 background: #C3181F;
 margin-block-end: 13px;
 color: #fff;
 font-size: 2.6rem;
 font-weight: 600;
 text-align: center;
 line-height: 1.7;
}
.planList h4 span{
 display: inline-block;
 background: #fff;
 border-radius: 5px;
 margin-inline-end:15px;
 padding: 3px 11px 4px;
 color:#C3181F ;
 font-size: 1.6rem;
 font-weight: 700;
 line-height: 1.4;
}
.planList .option h4{
 background: #fff;
 color: #000;
}
.planList .price{
 margin-block-end: 13px;
 text-align: center;
}
.planList .disc{
 margin-inline-start: 35px;
}
.disc >li{
 position: relative;
 padding-inline-start: 15px;
 font-size: 1.4rem;
 line-height: 1.7;
}
.disc >li::before{
 content: "";
 display: block;
 border-radius: 50%;
 background: #C3181F;
 width: 7px;
 height: 7px;
 position: absolute;
 top: 0.5em;
 left: 0;
}

@media screen and (min-width: 769px) {
.planList{
 flex-flow: row wrap;
 gap:20px 51px;
}
.planList >li{
 width: calc((100% - 51px*2)/3);
}
}/*-PC only-*/


#service01 > p:not(.price){
 font-size: 1.8rem;
 line-height: 2.2;
}

#service01 .column3 li figure{
 margin-block-end: 15px;
}
#service01 .column3 li h4{
 font-size: 1.4rem;
}
#service01 .column3 li h4 span{
 margin-inline-end: 4px;
 font-size: 2.8rem;
}
#service01 .column3 li p span.red{
 font-size: 1.8rem;
}
.planList h5{
 margin-block-end: 16px;
 font-size: 2rem;
 text-align: center;
 line-height: 1.3;
}
.planList h6{
 border-radius: 5px;
 background: #EAEAEA;
 margin:0 20px 16px;
 font-size: 1.4rem;
 line-height: 2;
 text-align: center;
}
 .option dl dt{
  font-size: 2.2rem;
  line-height: 1.2;
 }
.option dl dt span{
 display: block;
 margin-block-start: 4px;
 font-size: 1.6rem;
 line-height: 1.6;
}
 .option dl dd{
  color: #C3181F;
  font-size: 2.4rem;
 }
 .option dl dd span{
  color: #000;
  font-size: 1.6rem;
 }
@media screen and (max-width: 768px) {/* SP */
 .option dl{
 margin-block-start: 20px;
 }
.option dl dd + dt{
  border-top: 1px #C3C3C3 solid;
 padding-block-start: 20px;
 margin-block-start: 20px;
}
}/*-SP only-*/

@media screen and (min-width: 769px) {
 #service01 .planList{
  gap:0 41px;
 }
#service01 .planList > li{
 width: calc((100% - 41px)/2);
 }
.planList h6{
 margin:0 40px 16px;
}
 #service01 .disc{
  margin-inline-start: 77px;
 }
.option dl{
 display: flex;
 flex-flow: row wrap;
}
 .option dl dt{
  border-bottom: 1px #C3C3C3 solid;
  width: calc(100% - 170px);
  padding-block-start: 21px;
  padding-block-end: 18px;
  font-size: 2.2rem;
 }
 .option dl dd{
  border-bottom: 1px #C3C3C3 solid;
  width: 170px;
  padding-block-start: 21px;
  padding-block-end: 18px;
  text-align: right;
 }
 .option dl dt:last-of-type,
 .option dl dd:last-of-type{
  border-bottom: none;
 }
}/*-PC only-*/

#service02{
 background: #F3F3F3;
}
.cat{
 display: flex;
 flex-flow: row wrap;
 gap:10px 16px;
 margin-block-start: 14px;
 font-size: 1.4rem;
 line-height: 1.57;
}
.cat span{
 border-radius: 5px;
 background: #F3F3F3;
 padding-inline: 8px;
 mix-blend-mode: multiply; 
}
#service02 .column3 li,
#service03 .column3 li{
 background: #fff;
}
#service02{
 position: relative;
}
#service03{
 background: #F3F3F3;
}
#service02::before{
 content: "";
 display: block;
 background: #C3C3C3;
 width:auto;
 height: 1px;
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 margin-inline: min(80px, calc(80 / 1400 * 100%));
}

@media screen and (min-width: 769px) {
#service02::before{
 margin-inline: min(100px, calc(100 / 1400 * 100%));
}
}/*-PC only-*/
/*
#service06 .pcFlex .price{
 font-size: 1.8rem;
}*/

@media screen and (min-width: 769px) {

}/*-PC only-*/


