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


 h2{display: inline-block; padding:0 20px}
 
/*--------------------------------------------------------------------

headBox

--------------------------------------------------------------------*/
.headBox{text-align: center}
.headBox dl{background: url("../img/bg_sen.png") no-repeat bottom left; background-size: contain }
.headBox dt{padding: 0 5%; position: relative}
.headBox dt .user{width:30%;  max-width:232px; position:absolute; right: 2%; bottom: -3px; }
.headBox dt a{transform: rotate(0deg); display: inline-block}
.headBox dt a:hover{transform: rotate(10deg);}
.headBox dd{padding-top: 10px; font-size:clamp(1rem, 0.125rem + 4.38vw, 1.875rem)}/*16-30*/
.headBox dd .text02{margin: 0 18%}
.headBox dd img{max-width:329px; padding: 30px 0 }
.headBox dd span{font-size:clamp(0.875rem, 0.25rem + 3.13vw, 1.5rem)}/*14-24*/
/*--------------------------------------------------------------------

.info

--------------------------------------------------------------------*/
.info{margin: 30px 8% 50px; background:#fff3e2; border-radius: 10px; padding: 5%; position: relative}
.info h2{display: inline-block; font-size: clamp(1.125rem, 0.25rem + 4.38vw, 2rem)}/*18-32*/
.info .morebtn{position: absolute; right: 5%; top: 5%; }
.info date{font-size: 12px}
.info li a{color: #22201e; display: block; border-bottom: 1px dashed #ffb423; padding-bottom: 10px; margin-bottom: 10px}
.info li .tit{line-height: 1.5; font-size:clamp(0.875rem, 0.813rem + 0.31vw, 0.938rem)}/*14-15*/
/*--------------------------------------------------------------------

大切

--------------------------------------------------------------------*/
.inpBox{padding: 0 0 0 8%; background: url("../img/bg_dodo.png") no-repeat bottom center; background-size:contain }
.inpBox .text01{line-height: 1.4; padding-bottom: 20px; font-size: clamp(1.5rem, 1rem + 2.5vw, 2rem)}/*24-32*/
.inpBox .text01 span{font-size: clamp(1.875rem, 0.625rem + 6.25vw, 3.125rem)}/*35-50*/
.inpBox .text02 {padding-bottom: 20px; font-size:clamp(1.063rem, 0.875rem + 0.94vw, 1.25rem)}/*17-20*/

.inpBox .inpr{position: relative; min-height: 300px; max-width: 465px; margin: 0 auto}
.inpBox .inpr img{max-width: 202px; width:50%; position: absolute; left: 0; bottom: -80px }
.inpBox .inpr img:nth-last-of-type(2){max-width: 131px; width: 50%; position: absolute; left: 30%; top: 0 }
.inpBox .inpr img:last-of-type{max-width: 165px; width: 43%; position: absolute; right: 5%; bottom: -10px ; left: auto}


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

ドクターとして

--------------------------------------------------------------------*/
.sup-t{padding: 30% 0 0px; text-align: center; font-size: clamp(1.375rem, 0.375rem + 5vw, 2.375rem)}/*22-38*/
.sup-t .text{padding-bottom: 20px; letter-spacing: 1px}
.sup-t .text span{font-weight: 800; letter-spacing: normal}
.sup-t ul{max-width: 500px; padding: 0 6%; margin: 0 auto}
.sup-t li{margin-bottom: 15px}
.sup-t .morebtn a{display: block; letter-spacing: 1px}
.sup-t .morebtn a:before{
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  bottom: 0;
  content: "";
  height: 8px;
  margin: auto;
  position: absolute;
  right: 20px;
  top: 2px;
  transform: rotate(135deg);
  width: 8px;}

.sup-t li:nth-child(2) a{background:#85cbc0; box-shadow: 5px 5px 0px #68b2a6; }
.sup-t li:nth-child(3) a{background:#f57e54 ; box-shadow: 5px 5px 0px #e1663a;}
/*--------------------------------------------------------------------

診察案内　supBox

--------------------------------------------------------------------*/
.supBox{  display: flex;
  align-items: flex-start; justify-content: space-between; width: 97%;
  max-width: 1100px;
  margin: 0 3% 0 0; padding-top: 80px}
.supBox h2.widget--sticky{background: #fff; border-radius:0 10px 10px 0; position: sticky; top: 0; width: 13% ; padding:0 1% 5%; border: 2px solid #ffb423; letter-spacing: 2px; text-align: center ;z-index: 4 ; color:#ffb423; font-size:clamp(1.375rem, 0.875rem + 2.5vw, 1.875rem)  }/*22-30*/
.supBox h2 img{max-width:67px; position: relative; }
.supBox h2 span{font-weight: 900; margin-left: -15%;  padding-top: 10px}
#sup2 .supBox h2.widget--sticky{ border: 2px solid #85cbc0; color: #85cbc0}
#sup3 .supBox h2.widget--sticky{ border: 2px solid #f57e54; color: #f57e54}

.supBox .supCont{padding:70px 0 7%; position: relative; width: calc(100% - 16%); background:#fff1da; border-radius: 20px }
.supBox .supCont:before{    position: absolute;
    border: 2px solid #fff; border-radius: 20px;
    content: "";
    top: 4px;
    bottom: 4px;
    left: 4px;
    right: 4px;}
#sup2 .supBox .supCont{ background:#ceebe6 }
#sup3 .supBox .supCont{ background:#ffded2 }

.supBox .text01{margin-bottom: 20px; padding: 0 5% 0 7%; font-size: clamp(1rem, 0.625rem + 1.88vw, 1.375rem)}/*16-22*/
.supBox .text02{margin-bottom: 20px; padding: 0 5% 0 7%}
.supBox .pic02{text-align: center}
.supBox .pic02 img{max-width:498; width: 80% }
.supBox .pic03{position: absolute; left: -80px; top: -15px; width: 100px; z-index: 3 }

#sup1 .supBox .flel ul{position: relative; display: flex; justify-content: space-between; flex-flow: wrap; padding: 20px 3% 0; margin-top: -40px}
#sup1 .supBox .flel li{width: 49%;}
#sup1 .supBox .flel li:first-child{margin-top: 15px}
#sup1 .supBox .flel li:nth-child(2){margin-top: -30px}
#sup1 .supBox .flel li:nth-child(3){width: 100%; padding:0 5% 0 49%; margin-top: -65px  }
#sup1 .supBox .flel li:nth-child(4){width: 100%; padding:0 31% 0 0; margin-top: -40px  }
#sup1 .supBox .flel li:nth-child(5){width: 45%; margin: -70px -2% 0 54% }
#sup1 .supBox .fleCont .pic{margin:0 5% 30px; text-align: center}
#sup1 .supBox .fleCont .pic img{max-width:408px }
.supBox .supCont .hand{width:88px; position: absolute; top: -44px; left:50%; margin-left: -44px ;z-index: 1}

.supBox .menuInfo{margin: 0 auto 5%;width: 90%; display: flex; justify-content: space-between; flex-flow: wrap}
.supBox .menuInfo .morebtn{margin: 0 0 10px; width: 48% }
.supBox .menuInfo .morebtn:first-child{width: 100%}
.supBox .menuInfo .morebtn:last-child{width: 100%}

.supBox .menuInfo .morebtn a{ text-align: left; display: block; border:1px solid #ff9000; line-height: 1.2;
color:#ff9000; padding: 20px 0px 20px 35px; background:#fff url("../img/top/s01_i01.png") no-repeat 10px 50%;
background-size:18px 17px; font-size: clamp(1.063rem, 1rem + 0.31vw, 1.125rem)}/*17-18*/
.supBox .menuInfo .morebtn a:before{border-right: 2px solid #ff9000; border-top: 2px solid #ff9000;}




.supBox .menuInfo .morebtn:nth-child(2) a{ background:#fff url("../img/top/s01_i02.png") no-repeat 10px 50%;
background-size:18px 17px;  }
.supBox .menuInfo .morebtn:nth-child(3) a{ background:#fff url("../img/top/s01_i03.png") no-repeat 10px 50%;
background-size:18px 17px;  }
.supBox .menuInfo .morebtn:nth-child(4) a{ background:#fff url("../img/top/s01_i04.png") no-repeat 10px 50%;
background-size:18px 17px; }
.supBox .menuInfo .morebtn:nth-child(5) a{ background:#fff url("../img/top/s01_i06.png") no-repeat 10px 50%;
background-size:18px 17px ;}
.supBox .menuInfo .morebtn:nth-child(6) a{ background:#fff url("../img/top/s01_i05.png") no-repeat 10px 50%;
background-size:18px 17px ;}
.supBox .menuInfo .morebtn:nth-child(7) a{ background:#fff url("../img/top/s01_i07.png") no-repeat 10px 50%;
background-size:18px 17px ; }
.supBox .menuInfo .morebtn:nth-child(8) a{ background:#fff url("../img/top/usa.png") no-repeat 10px 50%;
background-size:30px 37px; padding: 20px 30px 20px 40px }


.supBox .menuInfo .morebtn img{width:20px; margin-right: 5px; vertical-align: middle}
.supBox .att{margin-bottom: 30px; line-height: 1.5; padding: 0 5% 0 7%; font-size:clamp(0.813rem, 0.75rem + 0.31vw, 0.875rem) }/*13-14*/

.supBox .bttCont{padding: 0 5% 30px}
.supBox .bttCont .morebtn a{letter-spacing: 1px; display: block; padding: 10px 0; font-size: clamp(1.25rem, 0.625rem + 3.13vw, 1.875rem)}/*20-30*/
.supBox .bttCont .morebtn a span{font-size: clamp(1rem, 0.75rem + 1.25vw, 1.25rem)}/*16-20*/


#sup2 .supBox{padding-top: 120px}
#sup2 .supBox .bttCont{padding-bottom: 20px}
#sup2 .supBox .bttCont .morebtn a{background-color: #85cbc0; box-shadow: 5px 5px 0px #68b2a6; display: block; padding: 10px 0; font-size: clamp(1.125rem, 0.375rem + 3.75vw, 1.875rem)}/*18-30*/
#sup2 .supBox .bttCont .morebtn a span{font-size: clamp(1rem, 0.75rem + 1.25vw, 1.25rem)}/*16-20*/
#sup2 .supBox .pic02{padding-bottom: 40px}
#sup2 .supBox dd{padding: 0 5% 0 7%; margin-bottom: 30px}
#sup2 .supBox .menuInfo2{margin:-15px 5% 0; width: 90%; }
#sup2 .supBox .menuInfo2 .morebtn{margin-bottom: 10px}
#sup2 .supBox .menuInfo2 .morebtn a{ text-align: left; display: block; border:1px solid #68b2a6; line-height: 1.2;
color:#68b2a6; padding: 20px 30px 20px 35px; background:#fff url("../img/top/s02_i01.png") no-repeat 10px 50%;
background-size:18px 17px ; box-shadow: 5px 5px 0px #68b2a6 ; letter-spacing:-1px; font-size: clamp(1.063rem, 1rem + 0.31vw, 1.125rem)}/*17-18*/
#sup2 .supBox .menuInfo2 .morebtn:nth-child(2) a{ background:#fff url("../img/top/s02_i02.png") no-repeat 10px 50%;
background-size:18px 17px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(3) a{ background:#fff url("../img/top/s02_i03.png") no-repeat 10px 50%;
background-size:18px 17px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(4) a{ background:#fff url("../img/top/s02_i04.png") no-repeat 10px 50%;
background-size:18px 17px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(5) a{ background:#fff url("../img/top/s02_i05.png") no-repeat 10px 50%;
background-size:18px 17px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(6) a{ background:#fff url("../img/top/s02_i06.png") no-repeat 10px 50%;
background-size:18px 17px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(7) a{position: relative; background:#fff url("../img/top/s02_i07.png") no-repeat 10px 50%;
background-size:18px 17px ; }
#sup2 .supBox .menuInfo2 .morebtn a:before{border-right: 2px solid #68b2a6; border-top: 2px solid #68b2a6;}
#sup2 .supBox .menuInfo2 .morebtn:nth-child(7) a span{padding-top: 5px;  display: block; font-size: 12px; letter-spacing: -1px}

#sup3 .supBox .text01 {font-size: 14px; line-height: 1.5}
#sup3 .supBox .menu-sup{width: 90%; margin: 0 auto}
#sup3 .supBox .morebtn a{background-color: #f57e54; box-shadow: 5px 5px 0px #e1663a; display: block; padding: 20px 0; font-size: clamp(1.125rem, 0.375rem + 3.75vw, 1.875rem)}/*18-30*/
#sup3 .supBox .morebtn a:before{ border-right: 2px solid #f57e54; border-top: 2px solid #f57e54}
#sup3 .supBox .morebtn{margin-bottom: 20px}
#sup3 .supBox .morebtn a span{font-size: clamp(1rem, 0.75rem + 1.25vw, 1.25rem)}/*16-20*/
#sup3 .supBox h3{line-height: 1.3; font-weight: 700; font-size:clamp(1.375rem, 0.875rem + 2.5vw, 1.875rem)}/*24-30*/

#sup3 .supBox li:nth-child(3) a,
#sup3 .supBox li:nth-child(4) a,
#sup3 .supBox li:nth-child(5) a{text-align: left} 
#sup3 .supBox li:nth-child(3) h3, #sup3 .supBox li:nth-child(4) h3,
#sup3 .supBox li:nth-child(5) h3{margin-left: 20px; line-height: 1.4; font-weight: 700; font-size:clamp(1.125rem, 1rem + 0.63vw, 1.25rem)}/*18-20*/
#sup3 .supBox h3 img{width: 18px ; vertical-align: middle;}
#sup3 .supBox li:nth-child(3) .art2 p,
#sup3 .supBox li:nth-child(4) .art2 p,
#sup3 .supBox li:nth-child(5) .art2 p{padding-left: 20px}

#sup3 .supBox li:last-child{position: relative; z-index: 5}

#sup3 .supBox .art .text{ font-size: 15px; color:#22201e; line-height: 1.5 ; padding: 5px 0 10px}
#sup3 .supBox .art .pic {padding: 0 5%; }
#sup3 .supBox .art .pic img{ border-radius: 10px}

#sup3 .supBox li:nth-child(5){position: relative}
#sup3 .supBox li:nth-child(5) dt img{position:absolute; width: 25%; top: -10px; right: -5%; max-width:71px }
#sup3 .supBox li:nth-child(5) dd{text-align: center; padding-top: 10px}
#sup3 .supBox li:nth-child(5) dd img{max-width: 180px}

#sup3 .supBox .morebtn:nth-child(3) a,
#sup3 .supBox .morebtn:nth-child(4) a,
#sup3 .supBox .morebtn:nth-child(5) a{color:#f57e54 ; background-color: #fff; box-shadow: 5px 5px 0px #e1663a; display: block; padding: 20px 0; font-size: clamp(1.125rem, 0.375rem + 3.75vw, 1.875rem)}/*18-30*/
#sup3 .supBox .art2 p{ font-size: 14px; color:#f57e54; line-height: 1.5 ; padding: 5px 0 0 ;letter-spacing: -1px;}
#sup3 .supBox .item{position: absolute; bottom: -10%; right: -2%; width: 65%; max-width:294px; z-index: 1}

#sup3 .supBox li:last-child a{display: block ; transition: transform 0.3s ease;}
#sup3 .supBox li:last-child a:hover{transform: translateY(-10px);}


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

rec
--------------------------------------------------------------------*/
.recruit{margin: 130px auto; width: 90%; padding: 0 5%; text-align: center}
.recruit .morebtn a{background: #fff; border: 2px solid #ff9000; padding: 30px 0 0 ; color:#22201e }
.recruit .morebtn dt img{ width: 20%; max-width:77px; position: absolute; right: -3%; bottom: 30%}
.recruit .morebtn dt .text01{line-height: 1.4; font-size:clamp(1.75rem, 1.438rem + 1.56vw, 2.063rem) }/*28-33*/
.recruit .morebtn dt .text01 span{font-size:clamp(1.125rem, 0.875rem + 1.25vw, 1.375rem)}/*18-22*/
.recruit .morebtn dt .text02{font-size:clamp(1.25rem, 0.875rem + 1.88vw, 1.625rem) }/*20-26*/
.recruit .morebtn dd img{margin-top: 30px; width: 80%; max-width:486px }


.scroll{margin:120px 0 20px}


.aboutL{text-align: center; letter-spacing: 1px}
.aboutL .morebtn a{padding: 10px 30px 10px 20px}

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

診療カレンダー

--------------------------------------------------------------------*/
.cal {text-align: center; padding: 100px 5% 0}
.cal h2.plas{font-size: clamp(1.625rem, 0.75rem + 4.38vw, 2.5rem)}/*26-40*/
.cal iframe {margin-bottom: 10px;
width:100%;
max-width:650px;
height:650px;
}
.cal .text1{margin-top: 10px; text-align: left; font-size: 18px; font-weight: 800}
.cal .text2{border-bottom: 2px dashed #22201e; padding-bottom: 20px}
.cal .text2,.cal .text3 ,.cal .text4 {text-align: left}
.cal .text3{line-height: 1.5}
.cal .text3 a{display: block ; transition: transform 0.3s ease;}
.cal .text3 a:hover{transform: translateY(-10px);}
.cal .text3 a img{width: 234px; margin-top: 10px}
.cal .text4 a{color: #22201e}
.cal .text4 a:hover{color: #ffb423}








@media (min-width: 640px){
.headBox{    background: url(../img/bg_sen.png) no-repeat bottom left;
    background-size:704px 429px;}
.headBox dl {min-width: 1100px; position: relative; margin: 0 auto; background:none; }
.headBox dt{padding: 0; width:727px; text-align: right; margin: 0 0 0 auto; padding-bottom: 30px}
.headBox dd { width: 580px; padding-top: 10px; text-align: left; top: 10px; position:absolute; left: 50%; margin-left: -540px; z-index: 5}
.headBox dd .text01{  text-shadow:
    -1px -1px 0 white,
     1px -1px 0 white,
    -1px  1px 0 white,
     1px  1px 0 white;
}
.headBox dd .text02{margin: 0 0 30px}


.info {margin: 30px auto 50px; width: 1100px; padding:50px; border-radius: 20px; display: flex; justify-content: space-between}
.info .infobox{width:180px }
.info h2{line-height: 1; margin-bottom: 20px}
.info ul{width:770px; display: flex; justify-content: space-between}
.info .morebtn { position: relative; right: 5%; top: 0;}
.info .morebtn a{display: block}
.info li{width: 33%; border-right: 1px dashed #ffb423;}
.info li:last-child{border: none}
.info li a{border-bottom: none !important; margin: 0; padding: 0 10px 0 10px}
.info li a:hover{color: #ffb423}
.info li:last-child a{padding-right: 0}


.inpBox{ background: url(../img/bg_dodo.png) no-repeat 90% 10px; background-size: 704px 429px; padding: 0}
.inpBox .inpl{width: 1100px; position: relative; margin: 0 auto; padding: 50px 0 120px 80px }
.inpBox .inpl .inpr{width:450px; position: absolute; right: 0; top: 30px}
.inpBox .inpr img:nth-last-of-type(2){ left: 36%;}

.sup-t{padding: 0}
.sup-t ul{max-width:920px; padding: 0; display: flex; justify-content:space-between }
.sup-t ul li{width: 32% ;font-size: 30px}

.supBox{width: 100%; margin: 0 auto; }
.supBox h2.widget--sticky{width: 100px; border-radius: 20px}
.supBox h2 span{margin-left: -3px}
.supBox .supCont{width: 980px; text-align: center ; padding: 60px 50px 70px;}
.supBox .supCont:before{top: 6px; left: 6px; right: 6px; bottom: 6px; }
.supBox .pic02{width:293px; position: absolute; right: -20px; top: -60px; }
.supBox .menuInfo{margin: 30px 0 0px; width: 100%}
.supBox .bttCont {padding: 0; width: 450px; margin: 0 auto;}
.supBox .text01{padding: 0; margin-bottom: 30px}
.supBox .menuInfo .morebtn{width: 23%; margin-bottom: 20px}
.supBox .menuInfo .morebtn:first-child , .supBox .menuInfo .morebtn:last-child{width: 23%}
.supBox .menuInfo .morebtn:nth-child(8) a{padding: 30px 30px 30px 40px;}
.supBox .att{text-align: left; padding: 0 ; margin-bottom: 40px;}
.supBox .menuInfo .morebtn a{padding: 20px 0px 20px 35px; background: #fff url("../img/top/s01_i01.png") no-repeat 10px 50%; background-size:20px 19px}
.supBox .menuInfo .morebtn a:before{border-right: 2px solid #ff9000; border-top: 2px solid #ff9000;}

.supBox .menuInfo .morebtn:nth-child(2) a{ background:#fff url("../img/top/s01_i02.png") no-repeat 10px 50%;
background-size:20px 19px }
.supBox .menuInfo .morebtn:nth-child(3) a{ background:#fff url("../img/top/s01_i03.png") no-repeat 10px 50%;
background-size:20px 19px }
.supBox .menuInfo .morebtn:nth-child(4) a{ background:#fff url("../img/top/s01_i04.png") no-repeat 10px 50%;
background-size:20px 19px }
.supBox .menuInfo .morebtn:nth-child(5) a{ background:#fff url("../img/top/s01_i06.png") no-repeat 10px 50%;
background-size:20px 19px}
.supBox .menuInfo .morebtn:nth-child(6) a{ background:#fff url("../img/top/s01_i05.png") no-repeat 10px 50%;
background-size:20px 19px }
.supBox .menuInfo .morebtn:nth-child(7) a{ background:#fff url("../img/top/s01_i07.png") no-repeat 10px 50%;
background-size:20px 19px }
.supBox .menuInfo .morebtn:nth-child(8) a{ background:#fff url("../img/top/usa.png") no-repeat 15px 50%;
background-size:30px 37px; padding: 30px 30px 30px 50px }

#sup1 .fleCont{display: flex; justify-content: space-between; flex-direction: row-reverse  }
#sup1 .fleCont .flel{width:500px}
#sup1 .fleCont .fler{width:408px }
#sup1 .supBox .fleCont .pic { margin: 0 0 30px;}

#sup1 .supBox .flel ul{ padding: 0; margin-top:0}
#sup1 .supBox .flel li{width: 159px;}
#sup1 .supBox .flel li:first-child{margin-top: 0}
#sup1 .supBox .flel li:nth-child(2){margin-top:20px; width: 158px ; margin-left: -8px}
#sup1 .supBox .flel li:nth-child(3){width: 155px; padding:0; margin-top:0 }
#sup1 .supBox .flel li:nth-child(4){width: 229px; padding:0; margin-top:0; margin-left: 50px; }
#sup1 .supBox .flel li:nth-child(5){width: 140px; margin:-10px 50px 0 0 }
#sup1 .supBox .text02 { font-size: 20px; margin-bottom: 0px; padding: 20px 0 50px; width: 680px; margin-left: -320px;}

#sup2 .supBox .supCont{padding-bottom: 50px}
#sup2 .supBox .menuInfo2 { margin: 0; width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap}
#sup2 .supBox .menuInfo2 .morebtn{margin-bottom: 20px; width: 31.5%}
#sup2 .supBox .menuInfo2 .morebtn:nth-child(7) a .nomi{width: 20%; max-width:67px ; position: absolute; right: -2%;top:0}

#sup2 .supBox dl{padding: 30px 0 20px; margin: 30px 0 10px; display: flex; justify-content: space-between; border-top: 2px dashed #fff; border-bottom: 2px dashed #fff;}
#sup2 .supBox dl:last-of-type{ border-top: none; border-bottom: none; margin-top: 0; margin-bottom: 0px}

#sup2 .supBox dt{padding: 0; width:317px }
#sup2 .supBox dd{padding: 0; width:500px; margin: 0; text-align: left}
#sup2 .supBox .bttCont{width: 350px}

#sup2 .supBox .menuInfo2 .morebtn a{padding: 20px 0px 20px 50px; background:#fff url("../img/top/s02_i01.png") no-repeat 15px 50%; background-size:29px 28px ;}
#sup2 .supBox .menuInfo2 .morebtn:nth-child(2) a span{display: block}
#sup2 .supBox .menuInfo2 .morebtn:nth-child(2) a{ background:#fff url("../img/top/s02_i02.png") no-repeat 15px 50%;
background-size:29px 28px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(3) a{ background:#fff url("../img/top/s02_i03.png") no-repeat 15px 50%;
background-size:29px 28px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(4) a{ background:#fff url("../img/top/s02_i04.png") no-repeat 15px 50%;
background-size:29px 28px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(5) a{ background:#fff url("../img/top/s02_i05.png") no-repeat 15px 50%;
background-size:29px 28px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(6) a{ background:#fff url("../img/top/s02_i06.png") no-repeat 15px 50%;
background-size:29px 28px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(7) a{position: relative; background:#fff url("../img/top/s02_i07.png") no-repeat 10px 50%; background-size:29px 28px ; }
#sup2 .supBox .menuInfo2 .morebtn:nth-child(7) a .nomi{width: 100% ; right: -50px; top: -50px;}
#sup2 .supBox .menuInfo2 .morebtn:nth-child(7) a span{line-height: 1.5}

#sup3 .supBox .supCont{padding-bottom: 50px}
#sup3 .supBox .menu-sup { width: 100%; margin: 0; display: flex; justify-content: space-between; flex-wrap: wrap ; align-items: stretch;}
#sup3 .supBox .morebtn{width: 48.5%; margin-bottom: 30px}
#sup3 .supBox li{width: 48.5%;}
#sup3 .supBox .morebtn a{padding: 20px ; text-align: left}
#sup3 .supBox .art{display: flex; justify-content: space-between; }
#sup3 .supBox .art .artl{width: 166px}
#sup3 .supBox .art .pic{width:186px ; padding: 0 ; margin-top: -30px;}
#sup3 .supBox h3 img{width:28px }
#sup3 .supBox .art2 p{letter-spacing: normal}
#sup3 .supBox  li:nth-child(4) .art2 p{letter-spacing: -1px}

#sup3 .supBox .morebtn:nth-child(3) a{height: 140px}
 #sup3 .supBox .morebtn:nth-child(5) a{padding: 30px 0}
#sup3 .supBox li:nth-child(5) dl{display: flex; justify-content: space-between ; align-items: stretch; align-items: center}
#sup3 .supBox li:nth-child(5) dt{width:200px ; }
#sup3 .supBox li:nth-child(5) dt h3{font-size: 16px }
#sup3 .supBox li:nth-child(5) dd{width:240px; text-align: left; padding: 0}
#sup3 .supBox li:last-child{text-align: left}
#sup3 .supBox li:last-child a{display:inline-block}
#sup3 .supBox li:last-child img{width: 290px; transition: transform 0.3s ease; }
#sup3 .supBox li:last-child img:hover{transform: translateY(-10px);}
#sup3 .supBox .item{bottom: -150px}

.recruit { margin: 130px auto; width: 672px; padding: 0;}
.recruit .morebtn a{width: 672px; padding: 10px 50px 0 30px; }
.recruit .morebtn dl{display: flex; justify-content: space-between}
.recruit .morebtn dt{width:305px; text-align: left; padding-top: 10px}
.recruit .morebtn dd{width:286px }
.recruit .morebtn dd img { margin-top: 0; width: 100%;}

.aboutL{font-size: 22px}
.aboutL .morebtn a {padding: 10px 40px 10px 30px;}


.cal {width: 1100px; margin: 0 auto;
    text-align: center;
    padding: 100px 0 0;
}
.cal dl {display: flex; justify-content: space-between}
.cal dt{width:655px }
.cal dd{width:408px }



}



@media (min-width: 1400px){
.headBox dt{ margin-left: calc(50% - 90px);}
}