@charset "utf-8";
/* CSS Document */


.headslid .menubox{margin-left: 8%}
.headslid .menu01{padding:0px 4% 80px 0 ; position: relative; z-index: 20}
.headslid .menu01 a{color:#dc0032 }
.headslid .menu01 .me012 a{color:#2cb8ac }

.headslid .menu01 dl{display: flex; justify-content: space-between}
.headslid .menu01 dt{width: 5%; background:#dc0032; color: #fff ; line-height: 1.1;
        font-size: 10px;
        letter-spacing: 1px;
        padding: 10px 1%; border-radius: 0 0 5px 5px}
.headslid .menu01 .me012{margin: 20px 0}
.headslid .menu01 .me012 a dt{background:#2cb8ac; }
.headslid .menu01 dd{width: 90%; font-size: 14px; margin-top: -5px}
.headslid .menu01 dd span{ font-size: 12px; display:block}
.headslid .menu01 dd .min{font-size:clamp(1.5rem, 0.875rem + 3.13vw, 2.125rem)}/*24-34*/
.headslid .menu01 dd li{line-height: 1.4 ; position: relative; padding-left: 15px ; font-weight: 600; font-size:clamp(0.875rem, 0.375rem + 2.5vw, 1.375rem) }/*14-22*/
.headslid .menu01 dd li::before {
	content: "+";
	color: #dc0032;
	font-size: 10px; position: absolute;
        left: 1px;
        top: 4px;
}

.headslid .menu01 a:first-of-type dd ul{list-style-position: 1.4}

.headslid .menu01 dd li.ltsn{letter-spacing: normal}

.headslid .menu01 .me012 a dd li::before{ color: #2cb8ac}

.headslid .menu02{font-size: 16px}
.headslid .menu02 span.mini{font-size: 12px; display:block; margin-top: -5px; margin-bottom:10px }
.headslid .menu02 img{margin-top: -5px; max-width: 220px}
.headslid .bono{line-height: 1.4}

.headslid .menu01 .btnripple3:hover::before{top: 35%}
.headslid .bono .btnripple3:hover::before{top: 35%}

.headslid .serpic{position: relative}
.headslid .serpic img{width: 20%;  max-width:355px; transform: rotate( 90deg ); position: absolute; left: -2%; top: 28px}



.firstbox{text-align: center; padding:50px 0 40px; }
.firstbox h3{margin-bottom: 20px;  position: relative; color: #dc0032; font-size:clamp(1.875rem, 1.125rem + 3.75vw, 2.625rem)}/*30-42*/
.firstbox h3 img {
    width: 15%;
    position: absolute;
    bottom: -2px;
    left:26%;
}
.firstbox .fir01{line-height: 2.1 ;font-size:clamp(1rem, 0.5rem + 2.5vw, 1.5rem)}/*16-24*/
.firstbox .fir01 span{font-size: 11px ; letter-spacing: normal}
.firstbox .pctit{position: relative}
.firstbox .pctit .door{position: absolute; top: -130px; left: 50%; width: 96px;  z-index: -1; margin-left: -48px  }
.firstbox .pctit .openll{position: absolute; top: -130px; left: 50%; width: 40px; z-index: -1; margin-left: -48px  }
.firstbox .pctit .openrr{position: absolute; top: -130px; left: 50%; width: 40px; z-index: -1; margin-left: 8px}
/*--------------------------------------------------------------------

.sem

--------------------------------------------------------------------*/
.sem{background: #fff; padding-bottom: 50px; position: relative; padding-top: 90px}

        
.sem .btn-border{position: absolute; right: 6%; top: 60px;}
.sem h2{top: -40px; position: relative; padding-left: 8%; display: inline-block ; color: #dc0032; font-size:clamp(1.563rem, 1.112rem + 2.25vw, 2.188rem) }/*25-35*/
.sem ul a{ color: #000}
.sem ul a:hover{color:#b08a2a }
.sem li{position: relative; padding: 0 8%}
.sem .slick-dots li{ padding: 0 2%}

.sem li .date{font-size: 13px}
.sem li .pot{font-size: 10px; position: absolute; right: 8%; top: 0; border-radius: 5px; border: 1px solid #ccc; padding: 0 10px}
.sem li h3{font-size: clamp(1rem, 0.5rem + 2.5vw, 1.5rem)}/*16-24*/
.sem li h3 i{    position: relative;
    top: -2px;font-size: clamp(0.625rem, 0.535rem + 0.45vw, 0.75rem)}/*10-12*/
.sem .slic{padding-top:-20px}
.sem .slick-prev,.sem .slick-next {
  z-index: 1;
}
.sem .slick-prev:before,.sem .slick-next:before {
  color: #c0aa72;
}
.sem .slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.sem .slick-active {
  opacity: 1;
}
.sem .slick-current {
  opacity: 1;
}


/*--------------------------------------------------------------------

.voice

--------------------------------------------------------------------*/
.voice{text-align: center; /*background: url("../img/service/rev.png") no-repeat center 20px;*/ padding: 0 0 70px;
background-size: 80% ;}
.voice .voiin{margin: 0 10px}
.voice h2{font-size: clamp(1.625rem, 1rem + 3.13vw, 2.25rem)}/*26-36*/
.voice h2 span{color:#dc0032;  font-size:clamp(2.5rem, 1.25rem + 6.25vw, 3.75rem)}/*40-60*/
.voice h2 i{color:#dc0032; font-size: clamp(0.75rem, -0.25rem + 5vw, 1.75rem)}/*12-28*/
.voice .tright{text-align: right; font-size: 13px; margin: -30px 8% 10px 0}
.voice .ach{background:#dc0032; color: #fff; display: inline-block; padding: 0 20px; border-radius: 5px; position: relative; z-index: 1}
.dopen2{margin-top: -10px; position: relative}
.voice dl{background: #fff; display: flex; justify-content: space-between; flex-flow: row-reverse} 
.voice dt{position: relative ; width: 25%; padding: 5% 5% 5% 0}
.voice dt p{position: absolute; right: 8%; bottom: 20px; width: 280px;text-align: right; font-size:clamp(0.625rem, 0.313rem + 1.56vw, 0.938rem) }/*10-15*/
.voice dd{padding: 5% 0 5% 5%; width: 75%; position: relative}
.voice dd{text-align: left}
.voice dd h3{font-size: clamp(1.25rem, 0.625rem + 3.13vw, 1.875rem)}/*20-30*/
.voice .nega{padding: 5%; text-align: left; position: relative; background:#e1dcd6 ; font-size: clamp(0.75rem, 0.25rem + 2.5vw, 1.25rem)}/*12-20*/
.voice .nega:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #e1dcd6;
}
.voice .chenge{padding: 5% 5% 7%; text-align: left; background: #fff; font-size: clamp(0.813rem, 0.25rem + 2.81vw, 1.375rem)}/*13-22*/
.voice .chenge .line{display:inline}
.star{color:#ffc000 }

 .voice .prev-arrow{
border: none; position: absolute; right: 5%; top: 50%; z-index: 1;
  text-align: center;
  font-size: 50px;
  background: url("../img/service/yar.png")no-repeat ;height: 58px; width:35px; background-size: 35px 58px
}
 .voice .next-arrow{border: none; position: absolute; left: 5%; top: 50%; z-index: 1;
  text-align: center;
  font-size: 50px;
  background: url("../img/service/yal.png")no-repeat ;height: 58px; width:35px; background-size: 35px 58px}

.voice .mmdashi{font-size: 11px; letter-spacing: normal; position: absolute; top: 15px; left: 8%; width: 280px}
.voice .top10{line-height: 1.5; padding-top: 15px; letter-spacing: normal; font-size: clamp(1.125rem, 0.375rem + 3.75vw, 1.875rem)}/*18-30*/


/*--------------------------------------------------------------------

.ass

--------------------------------------------------------------------*/
.ass{position: relative; text-align: center; padding-top:60px; padding-bottom: 60px; background: url("../img/top/ass.png") no-repeat center 150px; background-size:90% }
.ass .tit img{width: 40%; max-width:108px; margin-bottom: 30px }
.ass .test{padding-left: 8%}


.ass em{  color:#dc0032; font-size: clamp(3.75rem, 2.5rem + 6.25vw, 5rem)}/*60-80*/
.ass h2{color:#dc0032 }
.ass .midashi{line-height: 1.5 ; color:#dc0032; font-size:clamp(1.25rem, 0.25rem + 5vw, 2.25rem)}/*20-36*/

.ass .ass0 {margin-top: 20px}
.ass .ass0 dl{display: flex; justify-content: space-between}
.ass .ass0 dt{width: 80%; position: absolute; z-index: 1; padding-left: 8% ; padding-top: 40px}
.ass .ass0 dd{width: 55%; margin-left: 45%}
.ass .ass0 em {line-height: 1 ;}
.ass .ass0 img{border-radius: 5px 0 0 5px ; }
.ass .ass0 .bgred{background:#dc0032; color: #fff; padding: 5px 10px; display: inline-block ; border-radius: 5px ; line-height: 1.3 }
.ass .ass0 h2{line-height: 1.5 ; color:#dc0032; font-size:clamp(1.25rem, 0.25rem + 5vw, 2.25rem)}/*20-36*/
.ass .ass0 .texta1{padding: 20px 8%}
.ass .ass0 .texta2{padding: 0 8%}

.ass .ass0 , .ass .ass3,.ass .ass4,.ass .ass5,.ass .ass6{text-align: left}
.ass .ass3 dl{display: flex; justify-content: space-between}
.ass .ass3 dt{width: 80%; position: absolute; z-index: 1; padding-left: 8%}
.ass .ass3 dd{width: 55%; margin-left: 45%}
.ass .ass3 .midashi span{ display: inline-block; margin-left: -15px;}
.ass .ass3  em{line-height: 1 ; margin-top: -30px; display: inline-block;}
.ass .ass3 .text01{padding: 20px 8% 0 0}
.ass .ass3 img{border-radius: 5px 0 0 5px}
.ass .ass3 .pic{width: 38%; margin-top: -160px}
.ass .ass3 .pic img{border-radius: 0 5px 5px 0}
.ass .ass3 .text02{margin-top: 30px ; padding: 10% 0 20px 8%; background: url("../img/top/ass05.png") no-repeat right top; background-size: 60% }
.ass .ass3 .sm100 img{width:70%; max-width:489px; margin: -15px 0 0 8%  }

.ass .ass4{padding-bottom: 60px}
.ass .ass4  em{line-height: 1}
.ass .ass4 .midashi{padding-left: 8%; padding-bottom: 20px ; padding-top: 20px}
.ass .ass4 .tright{text-align: right; padding-right: 6% ; padding-top: 5px; font-size: 13px}
.ass .ass4 .text01{margin: 0 6% 0 8% }

.ass .ass5{padding-bottom: 50px}
.ass .ass5 .midashi{padding-left: 8%; padding-bottom: 20px; display: flex ;justify-content: space-between}
.ass .ass5 .midashi em{width: 10% ; line-height: 0.5}
.ass .ass5 .midashi i{width: 89%}
.ass .ass5 .text01{margin: 0 6% 20px 8% }

.ass .ass6 .midashi{padding-left: 8%; padding-bottom: 20px; display: flex ;justify-content: space-between}
.ass .ass6 .midashi em{width: 10% ; line-height: 0.5}
.ass .ass6 .midashi i{width: 89%; letter-spacing: normal}

/*--------------------------------------------------------------------

.consu

--------------------------------------------------------------------*/
.consu{background: #fff; text-align: center ; position: relative; padding-top: 270px}
.consu .titen{ position: absolute; right:8%; top: 100px; width:20%; max-width:154px; z-index: 5 }
.consu .sec{line-height: 1.5; z-index: 2; position: relative;width: 100%; color: #dc0032; font-size: clamp(2.625rem, 1.875rem + 3.75vw, 3.375rem);}
.consu .sec span{position: absolute; left: 50%; top: -140px; min-height: 350px; margin-left: -70px; line-height: 1.3}



.consu .headbox{padding: 20px 0 0 8% ; text-align: left}
.consu .headbox .text01 span{letter-spacing: 1px; border-radius: 5px; margin-right: 15px; display: inline-block; padding: 0 10px; background:#dc0032; color: #fff; font-size: clamp(1.125rem, 0.75rem + 1.88vw, 1.5rem) }/*18-24*/
.consu .headbox .text01 i{ font-size: clamp(0.75rem, 0.625rem + 0.63vw, 0.875rem)}/*12-14*/
.consu .headbox .text02{margin-top: 10px}
.consu .headbox .text02, .consu h3{color: #dc0032; font-size:clamp(1.375rem, 1.057rem + 1.59vw, 2.25rem)}/*22-36*/
.consu .headbox .text02 img{width: 30%; max-width: 33px ; position: relative; top: -8px; }
.consu .headbox h3{position: relative; padding: 5px 0 30px ;display: inline-block}
.consu .headbox h3 img{width: 15%; position: absolute; top: 5px; left: 54%}



.consu .midshi{z-index: 2; width: 5%; background:#dc0032; color: #fff ; line-height: 1.1;
        font-size: 10px;
        letter-spacing: 1px;
        padding: 10px 4px 10px 1px; border-radius: 0 5px 5px 0px; position: absolute; top: 30px; left: -3px}

.consu .waku{background:#fbf1e6; margin-left: 4%; position: relative; border-radius: 5px 0 0 5px}
.consu .wakuin{position: relative; z-index: 1; text-align: left;padding:35px 0 0px 8%;  }
.consu .wakuin .textsub{color: #dc0032;font-weight: 600;}
.consu .wakuin .textsub img{width: 18px}
.consu .wakuin h2{letter-spacing: normal; color: #dc0032; font-size:clamp(1.438rem, 0.625rem + 4.06vw, 2.25rem)}/*23-36*/


.consu .wakuin .pic{margin-bottom: 20px}
.consu .wakuin .text01{font-size: clamp(0.688rem, -0.125rem + 4.06vw, 1.5rem)}/*11-24*/
.consu .wakuin .text01 .mini{font-size: 14px; display: block; }
.consu .wakuin .att{ border-radius: 5px; margin: 20px 8% 0 0; background: #fff; padding: 8px 15px; font-size:clamp(0.625rem, 0.313rem + 1.56vw, 0.938rem)}/*10-15*/

.consu #w02 .wakuin{padding-bottom: 80px}
.consu #w02 .wakuin .textsub{letter-spacing: normal}
.consu #w02 .wakuin dl{padding: 20px 0 ; display: flex; justify-content: space-between}
.consu #w02 .wakuin dt{width: 40%; text-align: left}
.consu #w02 .wakuin dt img{width: 90%;}
.consu #w02 .wakuin dd{letter-spacing: normal; width:  60%; font-size:clamp(0.688rem, 0.375rem + 1.56vw, 1.125rem) }/*11-18*/
.consu #w02 .wakuin .text02{margin-bottom: 30px ; margin-right: 8%}
.consu #w02 .wakuin a{padding: 20px 0 ; text-align: center; display: block; margin-right: 8%}
.consu #w02 .wakuin a span{ font-size: clamp(1.5rem, 0.875rem + 3.13vw, 2.125rem)}/*24-34*/

#c02 .consu{padding-top: 260px}
#c02 .consu .headbox .text01 span{background: #2cb8ac}
#c02 .consu .headbox .text02 , #c02 .consu .headbox h3{ color: #2cb8ac; font-size:clamp(0.938rem, -0.125rem + 5.31vw, 2rem)}/*15-32*/
#c02 .consu .headbox h3 img{bottom: 25px; left: 34%; top: auto}
#c02 .hdpic{margin-bottom: 15px}
#c02 .consu .midshi{background:#2cb8ac }
#c02 .consu .wakuin{padding-bottom: 80px; padding-top: 27px}
#c02 .consu .wakuin h2{color: #2cb8ac}
#c02 .consu .waku{background: #fff}
#c02 .consu .wakuin .text01{ margin: 20px 8% 40px 0; font-size:clamp(0.875rem, 0.784rem + 0.45vw, 1.125rem)}/*14-18*/
#c02 .consu .sec{color:#2cb8ac }
#c02 .consu .titen{top: 65px}
#c02 .bgcolor{background:#fbf1e6 }
#c02 .consu .wakuin a{padding: 20px 0 ; text-align: center; display: block; margin-right: 8%}
#c02 .consu .wakuin a span{ font-size: clamp(1.5rem, 0.875rem + 3.13vw, 2.125rem)}/*24-34*/


.omoi{ text-align: center; padding: 120px 0 50px ; background: #fff ; margin: 50px 0 0}
.omoi .text{text-align: left; margin: 20px 8% 0px}
.omoi .text01 , .omoi .text02 {margin-bottom: 20px}
.omoi .min{padding: 20px 0; display: block; color:#dc0032 ; font-size:clamp(1.375rem, 0.661rem + 3.57vw, 2.375rem)}/*22-38*/
.insta{margin: 50px 8% 90px; }


/*--------------------------------------------------------------------

.company

--------------------------------------------------------------------*/
.company{position: relative}
.company h2{position: absolute; left: 8%; top: -40px; z-index: 5; color: #dc0032; font-size: clamp(2.625rem, 1.875rem + 3.75vw, 3.375rem);}
.company .titen{ position: absolute; right:8%; top: -10px; width:20%; max-width:129px; z-index: 5 }
.company .comp{background: url("../img/top/touka.png") repeat; padding: 30px 0 ; margin: -50px 4% 0 0; border-radius: 0 5px 5px 0 ; position: relative; z-index: 3}
.company .comp dl{box-sizing: content-box; display: flex; justify-content: space-between ; margin-bottom: 10px}
.company .comp dt{ border-radius: 0 5px 5px 0; box-sizing: content-box; width: 20%; padding: 5px 2% 5px 8%; background:#dc0032; color: #fff; font-size:clamp(0.688rem, 0.438rem + 1.25vw, 0.938rem)}/*11-15*/
.company .comp dd{letter-spacing: normal; width: 75% ; box-sizing: content-box; padding-left: 3% ; font-size:clamp(0.813rem, 0.375rem + 2.19vw, 1.25rem) }/*13-20*/
.company .comp dd .en{ font-weight: 700; display: inline-block; font-size:clamp(1.25rem, 1.125rem + 0.63vw, 1.375rem) }/*20-22*/
.company .comp dd .mini{display: inline-block; line-height: 1.8 ; font-size:clamp(0.625rem, 0.313rem + 1.56vw, 0.938rem)}/*10-15*/


@media screen and (min-width: 500px) {
.consu .midshi{line-height: 2}


}

@media screen and (min-width: 640px) {
.headslid .serpic img{top:38px }
.headslid .menu01 dd span{display: inline-block}
.firstbox h3 img {
    width: 15%;
    bottom: -5px;
    left: 30%;
}

.ass .ass3 .sm100 img{width: 489px}
.ass .ass3 .pic{ margin-top: -300px;}
.ass .ass5 .midashi em , .ass .ass6 .midashi em{width: 10%}
.ass .ass5 .midashi i , .ass .ass6 .midashi i{width: 90%}

}




