.visual .bg{background-image: url(../img/sub06/visual-bg.png);}
@media all and (max-width:1200px){

}
@media all and (max-width:1024px){

}
@media all and (max-width:768px){

}
@media all and (max-width:500px){

}


.sec01{}
.sec01 .inner{padding: 13vw 20px 9vw; display: flex; gap: 3rem; justify-content: space-between; position: relative;}
.sec01 h2{}
.sec01 h3{}
@media all and (max-width:1200px){

}
@media all and (max-width:1024px){
    .sec01 .inner{padding: 80px 20px;}
}
@media all and (max-width:768px){
    .sec01 .inner{flex-direction: column; gap: 20px;}
}
@media all and (max-width:500px){

}



.sec02{padding: 14vw 0; background: linear-gradient(90deg,#086162 0%, #025051 100%); color: #fff; text-align: center;}
.sec02 .inner{max-width: 1100px;}
.sec02 h2{margin-bottom: 7rem; color: #fff;}
.sec02 ul{display: flex; flex-wrap: wrap; gap: 3.5rem; justify-content: center;}
.sec02 ul li{width: calc((100% - 7rem) / 3); max-width: 320px; font-size: 3.5rem; font-weight: 500; background: #0c7677; border-radius: 4rem; min-height: 30rem; display: flex; align-items: center; justify-content: center; padding: 2rem;}
@media all and (max-width:1200px){

}
@media all and (max-width:1024px){
    .sec02{padding: 80px 0;}
    .sec02 h2{margin-bottom: 40px;}
    .sec02 ul{}
    .sec02 ul li{font-size: 24px; min-height: 200px;}
}
@media all and (max-width:768px){
    .sec02 h2{margin-bottom: 20px;}
    .sec02 ul{gap: 20px;}
    .sec02 ul li{width: calc((100% - 20px) / 2); font-size: 18px; min-height: 150px;}
}
@media all and (max-width:500px){
    
}

.sec03{padding-top: 16vw;}
@media all and (max-width:1200px){

}
@media all and (max-width:1024px){
    .sec03{padding-top: 80px;}
}
@media all and (max-width:768px){
    
}
@media all and (max-width:500px){
    
}


/* sec02 청력검사 */
.sec04{padding-bottom: 13vw; text-align: center;}
.sec04 h2{margin-bottom: 7rem;}
.sec04 .cont-wrap{display: flex; align-items: center; justify-content: center; gap: 4rem;}
.sec04 .slide-prev,
.sec04 .slide-next{flex: 0 0 auto; width: 7rem; height: 7rem; border-radius: 1.4rem; background: #0a6566; color: #fff; font-size: 4rem; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.sec04 .sec04-swiper{}
.sec04 .cont{display: flex; align-items: center; gap: 6rem; justify-content: center;}
.sec04 .cont .imgbox{width: 46rem; border-radius: 1000px; overflow: hidden;}
.sec04 .cont .imgbox img{width: 100%; }
.sec04 .cont .txt{text-align: left; max-width: 500px;}
.sec04 .cont .txt h4{font-size: 3.5rem; font-weight: 700; color: #0a6566; margin-bottom: 1.5rem;}
.sec04 .cont .txt p{font-size: 2rem;}
.sec04 .tab-wrap{margin-top: 8rem; display: flex; justify-content: center; gap: 1.6rem; font-size: 2.5rem; position: relative;}
.sec04 .tab-wrap .swiper-pagination-bullet{width: 25rem; height: 14rem; border-radius: 1.4rem; background: #f2f2f2; margin: 0; opacity: 1; display: flex; align-items: center; justify-content: center; text-align: center; padding: 1rem; cursor: pointer; color: #626262;}
.sec04 .tab-wrap .swiper-pagination-bullet-active{background: #0a6566; color: #fff; font-weight: 700;}
@media all and (max-width:1024px){
    .sec04{padding-bottom: 80px;}
    .sec04 h2{margin-bottom: 40px;}
    .sec04 .cont-wrap{gap: 20px;}
    .sec04 .slide-prev,
    .sec04 .slide-next{width: 40px; height: 40px; font-size: 20px;}
    .sec04 .cont{gap: 20px;}
    
    .sec04 .cont .txt h4{font-size: 20px;}
    .sec04 .cont .txt p{font-size: 15px;}
    .sec04 .tab-wrap{flex-wrap: wrap; margin-top: 40px;}
    .sec04 .tab-wrap .swiper-pagination-bullet{flex: 1;}
}
@media all and (max-width:768px){
    .sec04 .cont-wrap{gap: 5px;}
    .sec04 .slide-prev,
    .sec04 .slide-next{display: none;}
    .sec04 .cont{flex-direction: column;}
    .sec04 .cont .imgbox{width: 100%;}
    .sec04 .cont .txt{text-align: center;}
    .sec04 .tab-wrap{font-size: 18px; margin-top: 30px;}
}
@media all and (max-width:500px){

}


/* sec04 검사 결과에 따른 맞춤형 치료 진행 */
.sec05{padding-bottom: 15vw; }
.sec05 .inner{display: flex; justify-content: space-between; gap: 7vw;}
.sec05 .left{}
.sec05 .left h2{margin-bottom: 5vw; width: max-content;}
.sec05 .left ul{margin-bottom: 5rem;}
.sec05 .left ul li{cursor: pointer; margin-bottom: 3rem;}
.sec05 .left ul li .top{border-bottom: 1px solid #726b68; margin-bottom: 2rem; padding-bottom: 2rem; display: flex; gap: 4rem; align-items: center;}
.sec05 .left ul li .top span{font-family: 'GmarketSansMedium'; font-size: 2.3rem;}
.sec05 .left ul li .top h4{font-size: 2.8rem;}
.sec05 .left ul li .desc{width: 100%; max-height: 0; overflow: hidden; transition: max-height .3s; font-size: 1.8rem; line-height: 1.7; padding-left: 6rem; margin-bottom: 2rem;}
.sec05 .left ul li.on{color: #0a6566; }
.sec05 .left ul li.on .top span{font-family: 'GmarketSansBold';}
.sec05 .left ul li.on .top h4{font-weight: 700;}
.sec05 .left ul li.on .desc{max-height: 20rem;}
.sec05 .btn-more{justify-content: flex-start;}
.sec05 .right{max-width: 740px;}
.sec05 .right ul li{display: none; border-radius: 2rem; overflow: hidden; font-size: 0;}
.sec05 .right ul li.on{display: block;}
.sec05 .right ul li img{}
@media all and (max-width:1024px){
    .sec05{padding-bottom: 80px;}
    .sec05 .inner{}
    .sec05 .left h2{margin-bottom: 40px;}
    .sec05 .left ul li{margin-bottom: 10px;}
    .sec05 .left ul li .top{gap: 20px; padding-bottom: 10px; margin-bottom: 10px;}
    .sec05 .left ul li .top span{font-size: 18px;}
    .sec05 .left ul li .top h4{font-size: 20px;}
    .sec05 .left ul li .desc{padding-left: 0;}
}
@media all and (max-width:768px){
    .sec05 .inner{gap: 20px; flex-direction: column;}
    .sec05 .left h2{margin-bottom: 20px;}
    .sec05 .left ul{margin-bottom: 20px;}
    .sec05 .left ul li .desc{font-size: 16px;}
    .sec05 .right ul li{max-width: 400px;}
}
@media all and (max-width:500px){

}


.sec07{padding: 10vw 0; background: url(../img/sub06/sec07-bg.png) no-repeat center / cover; color: #fff;}
.sec07 .inner{max-width: 1620px; justify-content: space-between; display: flex; align-items: center; gap: 3rem;}
.sec07 .leaf{padding: 0 8rem; position: relative; }
.sec07 .leaf img{position: absolute; width: 11rem; top: 50%; transform: translateY(-50%);}
.sec07 .leaf img:nth-of-type(1){left: 0;}
.sec07 .leaf img:nth-of-type(2){right: 0;}
.sec07 .leaf .txt{text-align: center; }
.sec07 .leaf .txt p{font-size: 3.4rem; margin-bottom: 1rem;}
.sec07 .leaf .txt h3{font-size: 5.4rem; font-weight: 700; width: max-content;}
.sec07 .right h3{font-size: 5rem; font-weight: 700; margin-bottom: 4rem;}
.sec07 .right h3 b{color: #fec93b;}
.sec07 .right p{font-size: 2.6rem; }
@media all and (max-width:1300px){
    .sec07 .inner{flex-direction: column; align-items: flex-start;}
    .sec07 .leaf{margin-bottom: 8rem;}
}
@media all and (max-width:1024px){
    .sec07{padding: 100px 0 80px 0;}
    .sec07 .inner{flex-direction: column; align-items: flex-start; gap: 40px;}
    .sec07 .leaf{padding: 0 60px; margin-bottom: 40px;}
    .sec07 .leaf img{width: 70px;}
    .sec07 .leaf .txt p{font-size: 20px;}
    .sec07 .leaf .txt h3{font-size: 28px;}
    .sec07 .right h3{font-size: 28px; margin-bottom: 15px;}
    .sec07 .right p{font-size: 18px;}
}
@media all and (max-width:768px){
    .sec07 .leaf{padding: 0 45px;}
    .sec07 .leaf .txt p{font-size: 18px;}
    .sec07 .leaf .txt h3{font-size: 24px;}
    .sec07 .right h3{font-size: 24px;}
    .sec07 .right p{font-size: 16px;}
}
@media all and (max-width:500px){
    .sec07 .leaf{margin: 0 auto 40px;}
}

.sec08{padding-top: 13vw;}
.sec08 .review-card .thumb img{object-position: top;}
@media all and (max-width:1024px){
    .sec08{padding-top: 80px;}
}