/* sectionTitle */
.sectionTitle{display:flex; flex-direction:column; gap:1rem; margin-bottom:4.5rem;}
.sectionTitle .tit{font-size:3.25rem; font-weight: 600; line-height: 1.3;}
.sectionTitle .desc{font-size:1.25rem; line-height: 1.5; color: var(--textBody);}
.text{line-height: 1.3;}
.sub .sectionTitle .tit{font-size:3rem;}

/* Btn */
.linkBtn{display:flex;align-items:center;gap:.75rem;width:fit-content;height:fit-content;padding:1rem 1.5rem;border:1px solid var(--black);border-radius:100px;font-size:1rem;font-weight:500;color:var(--black);transition:var(--transition);}
.linkBtn svg{transition:var(--transition);fill:var(--black);}
.linkBtn:hover{background-color:var(--pointBase);border:1px solid var(--pointBase);color:var(--white);}
.linkBtn:hover svg{fill:var(--white);}


@media (max-width:1620px){
    .layoutContainer,.containerSub{padding:0 var(--layoutPadding);}
    .leftBleed,.rightBleed{width:100%;margin:0;padding-left:20px;padding-right:20px;}
}
@media (max-width:1440px){
    #main section{padding:9rem 0;}
}
@media (max-width:1280px){
    #main section{padding:8rem 0;}
    .sectionTitle{margin-bottom:4rem;}
    .sectionTitle .tit,.sub .sectionTitle .tit{font-size: 2.75rem;}
}
@media (max-width:1024px){
    #main section{padding:6rem 0;}
    .sectionTitle{margin-bottom:3rem;}
    .sectionTitle .tit,.sub .sectionTitle .tit{font-size: 2.275rem;}
    .sectionTitle .desc{font-size:1.125rem;}
}
@media (max-width:768px){
    #main section,.sub section{padding:4rem 0;}
    .sectionTitle{margin-bottom:2rem;gap:.5rem;}
    .sectionTitle .tit,.sub .sectionTitle .tit{font-size: 1.75rem;}
    .linkBtn{padding:.8rem 1.25rem;}
    .linkBtn svg{width:12px;}
}


/* =========================
  visual
========================= */
#visual {position:relative;width:100%;height:calc(100vh - 5rem);overflow:hidden;}
#visual .layoutContainer {height:calc(100vh - 7.5rem);}
#visual .visualSwiper{position:relative; width:100%; height:100%; border-radius:2rem; overflow:hidden;}
#visual .swiper-wrapper{position:relative; width:100%; height:100%; z-index:1;}
#visual .swiper-slide{position:relative; display:flex; align-items: flex-end; width:100%; height:100%; background:no-repeat center / cover;}
#visual .swiper-slide::after{content:""; position:absolute; left: 0; top: 0; width: 100%; height: 100%;  z-index:0;}/* background: linear-gradient(260deg, rgba(255, 255, 255, 0.00) 0%, rgba(0, 0, 0, 0.50) 100%); */
#visual .swiper-slide.visualSlide01 {background-image:url('/img/main/mainvisual01.jpg');}
#visual .swiper-slide.visualSlide02 {background-image:url('/img/main/mainvisual02.jpg');background-position-x:80%;}
#visual .swiper-slide.visualSlide03 {background-image:url('/img/main/mainvisual03.jpg');background-position-x: 25%;}
#visual .swiper-slide.visualSlide04 {background-image:url('/img/main/mainvisual04.jpg');}

#visual .swiper-slide .sectionTitle {width:90%;margin:0 auto 7.5rem; z-index:1;}
#visual .swiper-slide .sectionTitle .tit{font-size:3.5rem;font-weight:400;color:var(--white)}
#visual .swiper-slide .sectionTitle .desc{font-size: 1.25rem; color:var(--textWhiteBody);}

#visual .container {width:90%;max-width:inherit;}
#visual .controls { display:flex; align-items:center; position:absolute; left:0; bottom:3.5rem; z-index:2; font-size:1rem;}
#visual .controls .swiper-pagination-bullet {margin:0; background-color:#fff; opacity:0.4; transition:0.3s ease-in-out; border-radius: 100px;}
#visual .controls .swiper-pagination-bullet-active {opacity:1; width:4rem;}
#visual .controls .total,
#visual .controls .current {margin:0 1.25em; color: #fff; font-weight: 700; min-width: 0.8em; text-align: center;}
#visual .controls .pagination {display:flex; gap:.75rem; width:auto;}
#visual .swiper-button-prev,
#visual .swiper-button-next{position: static; width:1.5rem; height:1.5rem; margin-top: 0; opacity: 0.3 ;transition:opacity 0.3s ease-in-out;}
#visual .swiper-button-prev{background: url('/img/main/pagination.png') no-repeat center / contain;}
#visual .swiper-button-next{background: url('/img/main/pagination.png') no-repeat center / contain; transform: rotate(180deg);}
#visual .swiper-button-prev:hover {opacity: 1;}
#visual .swiper-button-next:hover {opacity: 1;}

#visual .scroll{position:absolute; right:0; bottom:0; transform:translateX(0%); z-index:3; color:#fff; display:flex; flex-direction:column; align-items:center;}
#visual .scroll .text{font-weight:700; font-size:.875rem; margin-bottom:.5rem;}
#visual .scroll .line{ position: relative; width: 1px; height: 6.25rem;  background-color: rgba(255, 255, 255, 0.3); overflow: hidden;}
#visual .scroll .line::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#fff; transform:scaleY(0); transform-origin:top; animation: growLine 1.5s ease-in-out infinite;}

@keyframes growLine {
    0% {
        transform: scaleY(0);
        opacity: 1;
    }
    80% {
        transform: scaleY(1);
        opacity: 1;
    }
    100% {
        transform: scaleY(1);
        opacity: 0;
    }
}
@media(max-width:1024px) {
    #visual .scroll{display:none;}
    #visual .swiper-slide .sectionTitle .tit{font-size:3rem;}
}
@media(max-width:768px) {
    #visual .swiper-slide .sectionTitle .tit{font-size: 2.25rem;}

}

/* =========================
  goodVision 
========================= */
/* .goodVision{height:100vh;} */
.goodVision .container{display:flex;flex-direction:row-reverse;justify-content:center;align-items:center;gap:10rem;}

.goodVision .left ul{display:grid;gap:2rem;width:fit-content;}
.goodVision .left ul li{display:flex;justify-content:center;gap:2rem}
.goodVision .left ul li:nth-child(2){justify-content:flex-end;}
.goodVision .left ul li div div{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;overflow:hidden;position:relative;height:100%;background:var(--bgSoft);color:var(--white);border-radius:5em;text-align:center;}
.goodVision .left ul li .txt {white-space:nowrap;}
.goodVision .left ul li .txt div{padding:0 4rem;}
.goodVision .left ul li .img div{width:8rem;height:8rem;}
.goodVision .left ul li .img div img{position:relative;height:100%;max-height:55%;object-fit:contain;}
.goodVision .left ul li strong{position:relative;font-size:2.5rem;}
.goodVision .left ul li p{position:relative;font-size:1.125rem;}
.goodVision .left ul li span.fillBg{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:5em;}
.goodVision .left ul li:nth-child(1) span.fillBg{transform: translateX(-100%); background: var(--pointLight)}
.goodVision .left ul li:nth-child(2) span.fillBg{transform: translateX(101%); background: var(--pointBase)}
.goodVision .left ul li:nth-child(3) span.fillBg{transform: translateX(-100%); background: var(--pointDark)}

.goodVision .right{width:50%;}
.goodVision .right .sectionTitle{margin-bottom:2rem;}
.goodVision .right .text {margin-bottom:4.5rem;font-size:1.125rem;color:var(--textBody);line-height:1.5;}
.goodVision .right .text strong{display:block;margin-bottom:1rem;}
@media (max-width:1600px){
    .goodVision .container{gap:5rem;}
    .goodVision .left ul li strong{font-size:2.25rem;}
}
@media (max-width:1280px){
    .goodVision .container{gap:4rem;}
    .goodVision .left ul li .txt {white-space:normal;}
    .goodVision .left ul li strong{font-size:1.725rem;}
    .goodVision .left ul li .txt div{padding:0 3rem;}
    .goodVision .right .text{margin-bottom:4rem;}
}
@media(max-width:1024px) {
    .goodVision .container{gap:3rem;}
    .goodVision .left ul{gap:1.5rem;}
    .goodVision .left ul li{gap:1.5rem;}
    .goodVision .left ul li .txt div{padding:0 2rem;}
    .goodVision .right .text{margin-bottom:3rem;}

}
@media(max-width:768px) {
    .goodVision .container{flex-direction:column;align-items:flex-start;gap:2.5rem;}
    .goodVision .left {width:100%;}
    .goodVision .left ul{width:100%;gap:1rem;}
    .goodVision .left ul li{gap:1rem;justify-content: flex-start;}
    .goodVision .left ul li .img div{width:6rem;height:6rem;}
    .goodVision .left ul li .txt div{padding:0 1.5rem;width:55vw;}
    .goodVision .left ul li div div{gap:.5rem;}
    .goodVision .left ul li strong{font-size:1.25rem;}


    .goodVision .left ul li:nth-child(1) .txt span.fillBg { transition: transform 1s; }
    .goodVision .left ul li:nth-child(1) .img span.fillBg { transition: transform 0.5s; transition-delay: 0.8s }
    .goodVision .left ul li:nth-child(2) .txt span.fillBg { transition: transform 1s; transition-delay: 1.5s }
    .goodVision .left ul li:nth-child(2) .img span.fillBg { transition: transform 0.5s; transition-delay: 2.3s }
    .goodVision .left ul li:nth-child(3) .txt span.fillBg { transition: transform 1s; transition-delay: 3s }
    .goodVision .left ul li:nth-child(3) .img span.fillBg { transition: transform 0.5s; transition-delay: 3.7s }

    .goodVision.on .left ul li:nth-child(1) .txt span.fillBg{transform: translateX(0);}
    .goodVision.on .left ul li:nth-child(1) .img span.fillBg{transform: translateX(0);}
    .goodVision.on .left ul li:nth-child(2) .txt span.fillBg{transform: translateX(0);}
    .goodVision.on .left ul li:nth-child(2) .img span.fillBg{transform: translateX(0);}
    .goodVision.on .left ul li:nth-child(3) .txt span.fillBg{transform: translateX(0);}
    .goodVision.on .left ul li:nth-child(3) .img span.fillBg{transform: translateX(0);}

    .goodVision .right{width:100%;}
    .goodVision .right .text{margin-bottom:2rem;}
}
/* =========================
  stats
========================= */
.stats{position:relative;background:url(/img/main/countingBg.jpg) no-repeat center/cover;}
.stats::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(4,11,16,.5);z-index:0;}
.stats .sectionTitle .desc{color:var(--textWhiteBody);}
.stats .statsList{display:flex;width:100%;margin:0 auto;}
.stats .statItem{position:relative;display:flex;flex-direction:column;align-items:center;width:calc(100% / 4);gap:2.5rem;padding:2.5rem 0;text-align:center;color:var(--textWhiteBody);}
.stats .statItem:not(:last-child)::after{content:"";position:absolute;top:0;right:0;width:1px;height:100%;background:var(--borderBase);}
.stats .statsIcon{width:8rem;height:8rem;}
.stats .statsLabel{font-size:1.25rem;font-weight:600;}
.stats .statsNumber{display:block;margin:1rem 0;font-size:3rem;font-weight:700;}
.stats .statsUnit{font-size:1.125rem;}

@media (max-width:1280px){
    .stats .statItem{padding:2rem 0;}
}
@media (max-width:1024px){
    .stats .statsList{flex-wrap:wrap;}
    .stats .statItem{width:calc(100% / 2);gap:2rem;}
    .stats .statItem:nth-child(2)::after{display:none;}
    .stats .statItem:nth-child(3)::before,.stats .statsList li:last-child::before{content:"";position:absolute;top:0;right:0;width:100%;height:1px;background:var(--borderBase);}
}
@media (max-width:768px){
    .stats .statItem{padding:1rem 0;}
    .stats .statsIcon{width:5rem;height:5rem;}
    .stats .statsNumber{font-size:2rem;}
}
/* =========================
  doctorAll
========================= */
.doctorAll .doctorAllTop {background: linear-gradient(0deg,rgba(52, 122, 178, 0.09) 0%, rgba(255, 255, 255, 0.00) 100%);}
.doctorAll .titBox {display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:4.5rem;}
.doctorAll .sectionTitle {margin-bottom:0;}

.doctorAll .marquee {width:100%;overflow:hidden;margin-top:2.5rem;}
.doctorAll .marquee .track{display:flex;width:max-content;animation:marquee 20s linear infinite;}
.doctorAll .marquee .track span {flex-shrink:0;font-size:6rem;opacity:.1;white-space:nowrap;font-weight:700;color:var(--pointBase);}

@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (max-width:1280px){.doctorAll .titBox{margin-bottom:4rem;}}
@media (max-width:1024px){.doctorAll .titBox{flex-direction:column;align-items:flex-start;gap:2rem;margin-bottom:3rem;}}
@media (max-width:768px){
    .doctorAll .titBox{margin-bottom:2rem;}
    .doctorAll .marquee{margin-top:1.5rem;}
    .doctorAll .marquee .track span{font-size:2.5rem;}
}
/* =========================
  surgery
========================= */ 
#main .surgery::before{content:"";position:absolute;bottom:0;left:0;width:100%;height:19rem;background:var(--pointBase);z-index:0;}
.surgery ul.surgeryList {display:flex;flex-wrap:wrap;align-items: stretch;gap:1.5rem;max-width:1240px;margin:0 auto;}
.surgery .surgeryItem {position:relative;width:calc((100% - 3rem) / 3);aspect-ratio: 4/3;border-radius:1rem;overflow:hidden;cursor:pointer;background:no-repeat center/cover;transition:var(--transition);}
.surgery .surgeryItem:nth-child(1){background-image:url(/img/main/surgeryItem01.jpg);}
.surgery .surgeryItem:nth-child(2){background-image:url(/img/main/surgeryItem02.jpg);}
.surgery .surgeryItem:nth-child(3){background-image:url(/img/main/surgeryItem03.jpg);}
.surgery .surgeryItem:nth-child(4){background-image:url(/img/main/surgeryItem04.jpg);}
.surgery .surgeryItem:nth-child(5){background-image:url(/img/main/surgeryItem05.jpg);}
.surgery .surgeryItem:nth-child(6){background-image:url(/img/main/surgeryItem06.jpg);}
.surgery .surgeryItem::after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(0deg, rgba(4, 11, 16, 0.30) 0%, rgba(4, 11, 16, 0.00) 100%);z-index:0;}
.surgery .surgeryItem a{position:relative;display:flex;flex-direction: column;align-items:flex-start;justify-content: flex-end;width:100%;height:100%;z-index:1;padding:1.5rem;}
.surgery .surgeryLabel {color:var(--textWhiteBody);}
.surgery .surgeryTitle {margin-top:.5rem;font-size:1.5rem;font-weight:600;color:var(--white);}

@media (max-width:768px){
    .surgery ul.surgeryList{gap:1rem;}
    .surgery .surgeryItem{width:calc((100% - 1rem) / 2);border-radius:.5rem;}
    .surgery .surgeryItem a {padding:1rem;}
}

/* =========================
  subject - 진료과목
========================= */
.subjectTab {display:flex;max-width:1240px;margin:0 auto 4rem;}
.subjectTab button{position:relative;flex:1;padding:0 0 1.5rem;font-size:1.5rem;font-weight:600;transition:var(--transition);}
.subjectTab button::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--borderBase);transition:var(--transition);}
.subjectTab button.active::after{height:2px;background:var(--pointBase);}

.subjectSwiper .swiper-slide{display:flex;flex-direction:row;align-items:center;gap:5rem;}
.subjectSwiper .swiper-slide .imgBox{width:50%;aspect-ratio:4/3; border-radius:16rem;overflow:hidden;transition:all 1s ease;}
.subjectSwiper .swiper-slide.swiper-slide-active .imgBox{border-radius:1.5rem;}
.subjectSwiper .swiper-slide .imgBox img {height:100%;object-fit:cover;}
.subjectSwiper .swiper-slide .textBox .tit{font-size:2.5rem;font-weight:600;}
.subjectSwiper .swiper-slide .textBox .text{margin: 2rem 0 4.5rem; font-size: 1.125rem;}
@media (max-width:1280px){
    .subjectSwiper .swiper-slide{gap:4rem;}
    .subjectSwiper .swiper-slide .textBox .tit{font-size:2rem;}
}
@media (max-width:1024px){
    .subjectTab{margin:0 auto 2.5rem;}
    .subjectSwiper .swiper-slide{gap:2.5rem;}
    .subjectSwiper .swiper-slide .imgBox {width:45%;}
    .subjectSwiper .swiper-slide .textBox .tit{font-size:1.75rem;}
    .subjectSwiper .swiper-slide .textBox .text{margin:1rem 0 2rem;}
}
@media (max-width:768px){
    .subjectTab button{font-size:1.25rem;}
    .subjectSwiper .swiper-slide{flex-direction:column;align-items:flex-start;gap:1rem;}
    .subjectSwiper .swiper-slide .imgBox {width:100%;}
    .subjectSwiper .swiper-slide .textBox .tit{font-size:1.5rem;}
    .subjectSwiper .swiper-slide .textBox .text{white-space:normal;}
}

/* =========================
  example - 진료 후기
========================= */
.example{background: var(--bgBase);}
.example .titBox{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:4.5rem;}
.example .sectionTitle{margin-bottom:0;}

.exampleSwiper .swiper-wrapper{align-items:stretch;}
.exampleSwiper .swiper-slide{height:auto;display:flex;flex-direction:column;}
.exampleSwiper .textBox{display:flex;flex-direction:column;flex:1;}
.example .imgBox{overflow:hidden;border-radius:1rem;aspect-ratio:1/1;}
.example .imgBox img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.example .swiper-slide:hover .imgBox img{transform:scale(1.05);}
.boardSubject {margin:1rem 0 .5rem;font-size:1.125rem;font-weight:600;width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;line-height:1.5;}
.boardDate {font-size:.9375rem;color:var(--textDesc);}
@media (max-width:1280px){.example .titBox{margin-bottom:4rem;}}
@media (max-width:1024px){.example .titBox{margin-bottom:3rem;}}
@media (max-width:768px){.example .titBox{flex-direction:column;align-items:flex-start;gap:2rem;margin-bottom:2rem;}}

/* =========================
  banner - 치료의 순간들
========================= */
.banner {background:url(/img/main/banner.jpg) no-repeat 12% center; margin:2.5rem 2.5rem 0;border-radius:2rem;overflow:hidden;}
.banner::after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:#040b1050;z-index:0;}
.banner .sectionTitle {margin-bottom: 2rem;}
.banner .tit {color:var(--white);}
.banner .desc {color:var(--textWhiteBody);}
.banner .linkBtn {color:var(--white);border: 1px solid var(--white);}
.banner .linkBtn:hover{border: 1px solid var(--pointBase);}
.banner .linkBtn svg {fill: var(--white);}
@media (max-width:1280px){.banner{margin:2.5rem 20px 0;}}

/* =========================
  location - 오시는 길
========================= */
.location .container{display:flex;justify-content:space-between;align-items:flex-start;}

.location .locationLeft{width: calc(50% - 5rem);}
.location .locationLeft .sectionTitle {margin-bottom:2rem;}

.locationInfo .infoItem {display:flex;align-items:center;gap:1.5rem;font-size:1.125rem;}
.locationInfo .infoItem > span {font-weight:700;white-space: nowrap;}
.locationInfo .phoneLink {padding:1.5rem 0;border-top:1px solid var(--borderBase);border-bottom:1px solid var(--borderBase);}
.locationInfo .phoneLink a{font-size:1.5rem;font-weight:600;}
.locationInfo .clinicHours{padding:1.5rem 0;display:flex;flex-direction:column;gap:1rem;}
.locationInfo .clinicHours li:first-child {margin-bottom:0.25rem;}
.locationInfo .clinicHours .time span:not(:first-child)::before{content:" / ";}

.location .locationRight{width: 50%;}
.locationRight address strong{font-size:1.5rem;}
.locationRight address span{display:block;margin-top:.5rem;font-size: 1.125rem;}

.mapBox {margin: 1.5rem 0;border-radius:1rem;overflow:hidden;}
.mapLinks {display:flex;align-items:center;}
.mapLinks .mapLink{display:flex;align-items:center;justify-content:center;gap:.75rem;position:relative;flex:1;font-size:1.125rem;}
.mapLinks .mapLink:not(:first-child)::after{content:'';display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:1rem;background:var(--borderBase);}
.mapLinks .mapLink .mapIcon {width: 1.25rem;}
@media (max-width:1280px){
    .location .locationLeft{width: calc(50% - 4rem);}
}
@media (max-width:1024px){
    .location .locationLeft{width: calc(50% - 3rem);}
}
@media (max-width:768px){
    .location .container{flex-direction:column;gap:2.5rem;}
    .location .locationLeft{width:100%;}
    .locationInfo .clinicHours{padding:1.5rem 0 0;}
    .location .locationRight{width:100%;}
    .mapBox .wrap_map{height:40vh !important;}
}
@media (max-width:480px){
    .mapBox .wrap_map{height:200px !important;}
    .mapLinks .mapLink{gap:.5rem;}
}