:root{--ani:cubic-bezier(.32,.94,.6,1)}

.landing_header {
    position: relative;
}
.landing_nav {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 55px;
}

.landing_nav a {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}

@media (max-width: 768px) {
    .landing_nav {
        display: none;
    }
}



.centumBtn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    border-radius: 1.5938rem;
    background-color: var(--pointcolor);
    padding: .5rem;
    color: transparent;
    width: 16.3rem;
    transition-property: all;
    transition-duration: 0.6s;
    z-index: 9;
    overflow: hidden;
    text-shadow: -50px 0 0 transparent, 0 0 0 #fff;
    transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
}

.centumBtn:before {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #000;
    transform: translate(-100%, 0);
    content: "";
    position: absolute;
    z-index: -3;
    transition-property: inherit;
    transition-duration: inherit;
    transition-timing-function: inherit;
}

.centumBtn:hover {
    text-shadow: 0 0 0 #fff, 50px 0 0 transparent;
}

.centumBtn:hover:before {
    transform: translate(0, 0);
}

.centumBtn.color {
    background-color: transparent;
    text-shadow: -50px 0 0 transparent, 0 0 0 #000;
    width: 9.3rem;
    font-weight: 500;
}

.centumBtn.color:before {
    background-color: var(--pointcolor);
}

.centumBtn.BL {
    background-color: #000;
    text-shadow: -50px 0 0 transparent, 0 0 0 #fff;
    font-weight: 500;
}

.centumBtn.BL:hover {
    text-shadow: 0 0 0 var(--pointcolor), 50px 0 0 transparent;
}

.centumBtn.BL:before {
    background-color: #fff;
}


.main_en {font-family: var(--pointfont); /*margin-left: 2rem;*/}

.main .cont_box {margin-top: 5rem;}

.swiper .swiper-button-next:after, .swiper .swiper-button-prev:after {content:'';}
.swiper .swiper-button-next, .swiper .swiper-button-prev {width: 3.1875rem; height: 3.1875rem; border-radius: 50%; background-color: var(--pointcolor); transition: .3s;}
.swiper .swiper-button-next:hover, .swiper .swiper-button-prev:hover {background-color: #000;}
.swiper .swiper-button-prev img {transform: rotate(180deg);}
.swiper .arrow {width: 2.0625rem;}



#mainSlide {overflow:hidden;position:relative;width:100%;aspect-ratio: 16/8; transition:transform .6s var(--ani)}

#mainSlide .mainSwiper {opacity:0;transform:scale(1.05);width:100%;height:100%;transition:all 2s var(--ani)}
#mainSlide .mainSwiper.on {opacity:1;transform:scale(1)}
#mainSlide .mainSwiper .swiper-slide {height:100%;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .3s}
#mainSlide .mainSwiper .swiper-slide-active {transform:skew(0)}
#mainSlide .mainSwiper .swiper-slide .text {position:absolute; top: 50%; left: 0; z-index: 1; width: 100%; transform: translateY(-50%); box-sizing: border-box; padding: 0 18%}
#mainSlide .mainSwiper .swiper-slide .text h2 {color: #fff; font-weight: 800;}
#mainSlide .mainSwiper .swiper-slide .text p {font-size: 1.250rem; line-height: 1.7; color: #fff;}

#mainSlide .bg {position:absolute;left:0;top:0;width:100%;height:100%;background:center no-repeat;background-size:cover}
#mainSlide .bg.bg-1 {background-image:url('../img/main/mainSlide01.png')}
#mainSlide .bg.bg-2 {background-image:url('../img/main/mainSlide02.jpg')}



#mainSlide .swiper-pagination {bottom:15rem; left: 18%; width: fit-content;}
#mainSlide .swiper-pagination-bullet {background-color:transparent; width: 0; height: 0; margin-right: 2rem; opacity:.5;}
#mainSlide .swiper-pagination-bullet-active .path {display: inline-block !important; stroke-dasharray: 1000; stroke-dashoffset: 0; animation: dash linear 20s; animation-iteration-count: unset;}
#mainSlide .path {display: none;}
#mainSlide .swiper-pagination-bullet-active .path2 {fill: transparent;}

@media(max-width:768px){
    
    #mainSlide {aspect-ratio: 125 / 163;}
	#mainSlide .bg {aspect-ratio: 125 / 163;}
    #mainSlide .bg.bg-1 {background-image:url('../img/main/mainSlide_m_01.png')}
    #mainSlide .bg.bg-2 {background-image:url('../img/main/mainSlide_m_02.jpg')}


    #mainSlide .swiper-pagination {bottom:5rem; left: 30px;}
    #mainSlide .mainSwiper .swiper-slide .text {padding: 0 30px; top:auto; bottom: 30px; transform: none;}
    #mainSlide .mainSwiper .swiper-slide .text h2 {line-height: 1.3;}
	
	#mainSlide .flex {display: block;}
}

@keyframes dash {
  from {stroke-dashoffset: 1000;}
  to {stroke-dashoffset: 0;}
}


/* width */
.main .width .width_wrap {display: flex; z-index: 3; position: relative;}
.main .width .logo_one {position: absolute; z-index: 1; width: 14.0625rem; right: 0; top:-30px; animation: spinCircle 6s linear infinite;transform-origin: 50% 50%;}
.main .width .Deco {position: absolute; bottom:0; animation: swing ease-in-out 1s infinite alternate; transform-origin: bottom -20px;}
.main .width .Deco.left {left: -5rem; width: 30.1875rem;}
.main .width .Deco.right {right:-5rem; width: 22.3125rem;}
@keyframes swing {
    0% { transform: rotate(3deg); }
    100% { transform: rotate(-3deg); }
}
@keyframes spinCircle{100% {transform: rotate(360deg);}}
@media(max-width:1240px) {
    .main .width .box {width:100%;}
 }
@media(max-width:500px) {
    .main .width .logo_one {width: 10rem;}
 }


 /* why */
 :root{--size: 14.375rem; }
.main .why {background: no-repeat center url('../img/main/whyBg.jpg'); background-size: cover;}
.main .why .why_wrap {max-width: 1040px; margin: auto; padding: 0 1.25rem;}

.main .why .tit {align-items: flex-end;justify-content: space-between;}
.main .why .tit .bar {width: var(--layoutwidth);height: 10px;background: var(--text);margin: 0 30px 30px;}
.main .why .num {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);font-size: 1.875rem;}
.main .why .num .count{font-family: var(--pointfont),sans-serif;font-size:3.125rem;}

.main .why .circle_progress {position: relative;width: var(--size);height:var(--size);margin:auto;}
.main .why .circle_progress:after {position: absolute;    border-radius: 50%;border: 5px solid;border-color:#dfc1b0;box-sizing: border-box;content: "";width: 99.5%;height: 99.5%;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.main .why .circle_progress .left, .main .why .circle_progress .right {position: absolute;top: 0;width:calc( var(--size)/2) ;height:var(--size);overflow: hidden;z-index: 10;}
.main .why .circle_progress .bar {transition: none ;transform: rotate(0deg);position: absolute;top: 0;width: calc( var(--size)/2);height:var(--size);border:6px solid var(--pointcolor);box-sizing: border-box;}
.main .why .circle_progress .left {left: 0;}
.main .why .circle_progress .left .bar {left: calc( var(--size)/2);border-top-right-radius: var(--size);border-bottom-right-radius:var(--size);border-left: 0;transform-origin: center left;}
.main .why .circle_progress .right {right: 0;}
.main .why .circle_progress .right .bar {right: calc( var(--size)/2);border-top-left-radius:var(--size);border-bottom-left-radius:var(--size);border-right: 0;transform-origin: center right;} 

.main .why .circle_progress.aos-animate .bar{transition: 1s all linear; }
.main .why .circle_progress.aos-animate .left .bar {transition-delay: 1s;transition-timing-function: ease-out;}


/* solution */
.main .solution .box:nth-child(2n) {margin-top: 7rem;}
.main .solution .box_wrap {max-width: 18rem;}
.main .solution .box:nth-child(2n) .box_wrap {margin-left: auto;}
.main .solution .material-symbols-outlined {font-size: 1.25rem;}
.main .solution .box_wrap span {display:block}
@media(max-width:500px) {
    .main .solution .flexList {--y-gap:3.5rem;}
    .main .solution .box .box_wrap {margin: auto;}
    .main .solution .box:nth-child(2n) {margin-top: 0;}
}


/* equipment */
.main .equipment  {background: no-repeat center url('../img/main/whyBg.jpg'); background-size: cover;}
.main .equipment .equipmentSwiper {height: 35.5625rem; }
.main .equipment .swiper-wrapper {align-items: center;}
.main .equipment .equipmentSwiper .swiper-slide img {opacity: .5;}
.main .equipment .equipmentSwiper .swiper-slide-active {transform: scale(1); position: relative;}
.main .equipment .equipmentSwiper .swiper-slide-active img {opacity: 1;}
.main .equipment .equipmentSwiper .swiper-slide-active .imgBox {background-color: var(--pointcolor); position: relative;}
.main .equipment .equipmentSwiper .swiper-slide-active .imgBox img {mix-blend-mode: multiply;}
.main .equipment .equipmentSwiper .swiper-slide .activeTxt {opacity: 0;}
.main .equipment .equipmentSwiper .swiper-slide-active .activeTxt {position: absolute; opacity: 1; z-index: 3; width:fit-content; height:fit-content; top:0; bottom:0; left:0; right:0; margin: 80px auto 0;}
.main .equipment .swiper-slide {height: fit-content; transform: scale(.65); transition: .3s;}
.main .equipment .imgBox {width: 27.25rem; height: 30rem; border-radius: 5%; overflow: hidden; padding-top: 0; margin: 1rem auto;}

.main .equipment .slideBtn {color:#a2a59c; transition: .3s; font-family: var(--pointfont); background-color: #fff; border-radius: 1.0938rem; padding: .5rem 1.7rem;}
.main .equipment .slideBtn:hover {color:#000;}
.main .equipment .logo_one_lg {position: absolute; top:0; bottom:0; left:0; right:0; margin: auto; width: 35rem; animation: spinCircle 30s linear infinite;transform-origin: 50% 50%;}

.main .equipment .swiper-button-next {left:70%; right: auto;}
.main .equipment .swiper-button-prev {right:70%; left: auto;}
@media(max-width:768px) {
    .main .equipment .swiper-button-next {left:auto; right: 3rem;}
    .main .equipment .swiper-button-prev {right:auto; left: 3rem;}
}
@media(max-width:500px) {
    .main .equipment .swiper-button-next {left:auto; right: 0;}
    .main .equipment .swiper-button-prev {right:auto; left: 0;}
}


/* Philosophy */
.main .Philosophy {position: relative; z-index: 3;}
.main .Philosophy .img {position: absolute; width: 37.9375rem; height: fit-content; top:0; bottom:0; margin: auto;}
.main .Philosophy .img .text {position: absolute; top: 50%; transform: translateY(-50%); left: 0; z-index: 1;  width: 100%; box-sizing: border-box; padding: 50px 60px;}
.main .Philosophy .img .text p {color: #fff;}

.main .Philosophy .Desc {max-width: 79.75rem; aspect-ratio: 4/4.5; margin-left: auto; background: no-repeat right url('/img/main/pure_bg.jpg'); display: flex; align-items: center; justify-content: center;}

@media(max-width:1520px) {
    .main .Philosophy .Desc {justify-content: flex-end;}
    .main .Philosophy .Desc_inner {padding-right: 10rem;}
}
@media(max-width:1240px) {
    .main .Philosophy .section-left {padding-left:0;}
    .main .Philosophy .img {max-width: 70%;} 
}
@media(max-width:1100px) {    
    .main .Philosophy .Philosophy_inner {display: flex; flex-direction: column;}
    .main .Philosophy .box {position: relative; width: 100%;}
    .main .Philosophy .Desc {justify-content: center; max-width: 100%; padding-bottom: 15rem;}
    .main .Philosophy .Desc_inner {padding-right: 0;}
    .main .Philosophy .img {order:2; z-index: 3; margin-top: -17rem; max-width: 90%;}
    .main .Philosophy .img img {margin: auto;}
}
@media(max-width:500px) {
    .main .Philosophy .Desc {aspect-ratio: 4/7;}
    .main .Philosophy .Desc_inner {padding: 0 1rem;}
}

/* special */
.main .special .Tit {width: 20%; padding-left: 1rem;}
.main .special .slide {width: 80%;}
.main .special .slide_wrap {display: flex; justify-content: space-between; align-items: center;}
.main .special .specialSwiper .Desc {position:absolute; bottom:5rem; left: 5rem;}

.main .special .Line {border-bottom: 1px solid #fff; display: inline-block;}

.main .special .swiper-pagination {position: relative; bottom:0; height: 100%; display: flex; flex-direction: column;}
.main .special .swiper-pagination .swiper-pagination-bullet {width: 18.75rem; height: auto; color:#7b7b7b; letter-spacing: 0; margin: 3.7rem 0 0; background-color: transparent; opacity: 1; border-radius: 0; display: flex; justify-content: space-between; align-items: center;}
.main .special .swiper-pagination .swiper-pagination-bullet-active {color: #000;}
.main .special .swiper-pagination .swiper-pagination-bullet span {opacity: 0;}
.main .special .swiper-pagination .swiper-pagination-bullet-active span {opacity: 1;}
.main .special .swiper-pagination .swiper-pagination-bullet-active p {border-bottom: 1px solid #000; line-height: 1.2;}

@media(max-width:1600px) {  
    .main .special .Tit {width: 100%; padding-left: 0;}  
    .main .special .slide {width: 100%; margin-top: 3rem;}
}
@media(max-width:990px) {    
    .main .special .slideBox {width: 100%;}
    .main .special .width70 {order: -1; margin-bottom: 1rem;}
    .main .special .swiper-pagination {flex-direction: row; flex-wrap: wrap;}
    .main .special .swiper-pagination .swiper-pagination-bullet {margin-right: 1rem; margin-top: .5rem; width: fit-content;}
}
@media(max-width:500px) {
    .main .special .specialSwiper .Desc {bottom:2rem; left:2rem;}
}


/* doctor */
.main .doctor img {width: 29.3125rem;}
.main .doctor .one_plus {position: absolute; top:15rem; right: 23rem; width: 2.3125rem; height: 2.3125rem; border-radius: 50%; background-color: var(--pointcolor); display: flex; align-items: center; justify-content: center; transition: .3s;}
.main .doctor .one_plus:hover {background-color: #000; transform: scale(1.1);}
.main .doctor .rollig-wrap {white-space: nowrap;}
.main .doctor .rolling-text_text { display: inline-block; color: var(--pointcolor); opacity: .5;}
@media(max-width:500px) {
    .main .doctor img {margin-right: auto;}
}






/* promotion */
.main .promotion .arrow {width: 3.1875rem; height: 3.1875rem; border-radius: 50%; background-color: var(--pointcolor); transition: .3s;}
.main .promotion .arrow img {width: 2.0625rem;}
.main .promotion .arrow:hover {background-color: #000;}
.main .promotion .promotionSwiper {padding: .5rem 0;}
.main .promotion .swiper-slide img {transition: .3s;}
.main .promotion .swiper-slide:hover img{filter: brightness(0.8);}



/* result */
.main .Tit_wrap {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;}
.main .result .tab_menu li {width:9.375rem; padding: .5rem; background-color: #fff; color:#a2a59c; border-radius: 1.5938rem; text-align: center; transition: .3s; cursor: pointer; margin-right: 2rem;}
.main .result .tab_menu li:last-child {margin-right: 0;}
.main .result .tab_menu li.active {background-color: var(--pointcolor); color:#fff;}
.main .result .tabWrap .tab_inner .tab{visibility: hidden;position: absolute;width: 100%;top: 0;left: 0;}
.main .result .tabWrap .tab_inner .tab.active{visibility: visible;position:relative}

.main .result .swiper .Tit {text-align: center; color:#fff; font-family: var(--pointfont); padding: .5rem; z-index: 3; position: relative;}
.main .result .swiper .LoginBox {position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,.7); text-align: center; color:#fff; top:0; left:0; display: flex; align-items: center; justify-content: center;}
.main .result .swiper .logBtn {padding: .3rem 1.3rem; display: inline-block; margin-top: 1rem; font-family: var(--pointfont); color:#fff; border-radius: 1.125rem; border:1px solid #fff; transition: .3s;}
.main .result .swiper .logBtn:hover {background-color: #000; border-color:#000;}

.main .result .swiper-scrollbar {opacity: 1 !important; bottom:0; width: 100%; position: relative; margin-top: 3rem; left: 0; border-radius: 0; background-color: #fff;}
.main .result .swiper-scrollbar-drag {background-color: var(--pointcolor); border-radius:0;}
@media(max-width:1400px) {
    .main .result .tab_menu {width: 100%; margin-top: 1rem;}
}
@media(max-width:500px) {
    .main .result .tab_menu {flex-wrap: wrap;}
    .main .result .tab_menu li {margin-top: 1rem; margin-right: .7rem; width: 30%;}
}


/* place */
.main .place .flexList {--y-gap:0;}
.main .place .box {position: relative; color:#fff;}
.main .place .box img {opacity: .5; transition: ease-in .3s;}
.main .place .box.on img {opacity: 1;}
.main .place .box .TxtBox {position: absolute; top:46%; bottom:0; right:0; left:0; margin: auto; transition: ease-in .3s; opacity: 1;}
.main .place .box.on .TxtBox {top:43%; opacity: .7;}
@media(max-width:500px) {
    .main .place .font-40 {font-size: 1.875rem;}
}


/* info */
.main .info .flexList {--y-gap:3rem;}
.main .info .mapBox {height: 44.75rem;}
.main .info .root_daum_roughmap, .main .info .wrap_map {width: 100%; height: 44.75rem;}
.main .info .DescBox {display: flex; align-items: center;}
.main .info .DescBox > div {margin-left: 6.5rem; max-width: 35.625rem; margin-right: auto;}
.main .info table {width: 100%; max-width: 39.375rem;}
.main .info table td {padding:0 .5rem;}

.main .info img {width: 1.5rem;}
.main .info .TbTit {width: 8rem; text-align: justify; padding-right: 1rem;}
.main .info .TbTit:after {content:''; display: inline-block; width: 100%;}

.main .info .infoBtn {width: 10.8125rem; padding:1rem .5rem; text-align: center; transition: .3s; border-radius: 0;}
.main .info .infoBtn.nBtn {background-color: #00c73c; margin-right: 1rem;}
.main .info .infoBtn.kBtn {background-color: #f7ce2c; text-shadow: 0 0 0 #000, 50px 0 0 transparent;}
.main .info .infoBtn.kBtn:hover {text-shadow: 0 0 0 #fff, 50px 0 0 transparent;}
@media(max-width:500px) {
    .main .info .DescBox > div {margin-left: 1rem;}
}


footer  {color:#c6c6c6;}
footer ul li {position: relative; padding-right: 2.5rem;}
footer ul li:after {content:'|'; color:#c6c6c6; right: 1.25rem;position: absolute;}
footer ul li:last-child:after {content:'';}
footer ul li a {color:#c6c6c6;}
footer ul li a:hover {color:#efb9a1;}
footer .Line {width: 100%; height: 1px; background-color:#c6c6c6; margin: 2rem 0;}
footer .DescWrap {display: flex; align-items: end; justify-content: space-between;}
footer .width70 {letter-spacing: .0938rem;}
footer .width30 img {width: 13.6875rem;}
@media(max-width:768px) {
    footer .DescWrap {flex-wrap: wrap;}
    footer .Desc {width: 100%;}
    footer .width30 img {margin-top: 3rem; margin-left: 0;}
}


/* storyDoctor */
.storyDoctor .Tit_flex {
    display: flex;
    align-items: center;
}

.storyDoctor .H_line {
    width: 2px;
    height: 4.1875rem;
    background-color: var(--pointcolor);
    margin: 0 2rem;
}

.storyDoctor .R_Titi {
    width: fit-content;
    background-color: #000;
    border-radius: 1.5rem;
    color: #fff;
    padding: .3rem 1.5rem;
}

.storyDoctor .Img {
    background: linear-gradient(360deg, #f1e3d6 67%, #f7f6f2 33%);
}

.storyDoctor .doctorImg {
    width: 29.8125rem;
}

@media(max-width:768px) {
    .storyDoctor .Tit_flex {
        flex-direction: column;
        align-items: flex-start;
    }

    .storyDoctor .H_line {
        width: 4.1875rem;
        height: 2px;
        margin: 2rem 0;
    }
}


/* storyPoint */
.storyPoint .Title {
    position: absolute;
    width: max-content;
    text-align: right;
    transform: rotate(270deg);
    font-weight: 200;
    border-bottom: 2px solid #fff;
    padding-bottom: 2rem;
    bottom: -5rem;
}

.PointSwiper .swiper-pagination {
    bottom: 2rem;
}

.PointSwiper .swiper-pagination-bullet {
    background-color: #fff;
    opacity: 1;
    margin: 0 1rem;
    position: relative;
}

.PointSwiper .swiper-pagination-bullet:after {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .3);
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    transition: .3s;
}

.PointSwiper .swiper-pagination-bullet-active:after {
    transform: scale(3);
}

@media(max-width:1360px) {
    .storyPoint {
        padding-top: 100px;
    }

    .storyPoint .flex {
        flex-wrap: wrap;
    }

    .storyPoint .Tit {
        width: 100%;
    }

    .storyPoint .Title {
        position: relative;
        transform: rotate(0deg);
        bottom: 0;
    }

    .storyPoint .width40 {
        width: 50%;
    }
}

@media(max-width:768px) {
    .storyPoint .section-left {
        padding-left: 0;
    }

    .storyPoint .Tit {
        padding: 1%;
        width: 30%;
    }

    .storyPoint .Title {
        right: -7rem;
        bottom: -1rem;
        transform: rotate(270deg);
        position: absolute;
    }

    .storyPoint .Img {
        width: 100%;
    }

    .storyPoint .Desc {
        padding: 3rem 4rem;
        width: 70%;
    }

    .storySwiper .swiper-slide {
        justify-content: flex-start;
    }
}

@media(max-width:500px) {

    .storyPoint .Tit,
    .storyPoint .Desc {
        width: 100%;
    }

    .storyPoint .Title {
        position: relative;
        transform: rotate(0deg);
        bottom: 0;
        right: 0;
        margin: auto;
    }
}

.Special {
    background-image: url('../img/main/SpecialBg.jpg');
}


.Special.WidthBox .Tit {
    width: 60%;
}

.Special.WidthBox .Slide {
    width: 30%;
}


.Special .SpecialSwiper {
    max-width: 36.5rem;
    width: 100%;
    margin-left: auto;
    margin-right: 0;
}

.Special .swiper-pagination {
    position: relative;
    text-align: left;
    font-size: 2.5rem;
    font-family: var(--pointfont);
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 7rem;
}

.Special .swiper-pagination-bullet {
    width: 100%;
    bottom: 0;
    height: auto;
    border-radius: 0;
    background-color: transparent;
    margin: .3rem 0;
}

.Special .swiper-pagination-bullet .hyphen {
    position: relative;
    padding-left: 4.5rem;
}

.Special .swiper-pagination-bullet .hyphen:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 2rem;
    height: 1px;
    background-color: #fff;
    transition: width .3s;
}

.Special .swiper-pagination-bullet-active .hyphen:after {
    width: 3.5rem;
}

@media(max-width:990px) {
    .Special.WidthBox .box {
        width: 100%;
    }

    .Special .swiper-pagination-bullet .hyphen {
        position: relative;
        padding-left: 3.5rem;
    }

    .Special .swiper-pagination-bullet .hyphen:after {
        width: 1.2rem;
    }

    .Special .swiper-pagination-bullet-active .hyphen:after {
        width: 2.3rem;
    }

    .Special .SpecialSwiper {
        margin-left: 3.5rem;
    }
}

@media(max-width:500px) {
    .Special .swiper-pagination {
        font-size: 2rem;
        margin-bottom: 2rem;
    }

    .Special .SpecialSwiper {
        margin-left: 1.5rem;
    }
}



.subTit_en {
    font-size: 2.1875rem;
    font-family: var(--pointfont);
    color: var(--pointcolor)
}

.subTit_en.Wh {
    color: #fff;
}

.subTit {
    font-size: 3.125rem;
    line-height: 1.2;
}

.subTit_Line {
    width: 100%;
    margin: 1rem auto;
    height: 1px;
    background-color: var(--pointcolor2);
}

#clinic {
    background-image: url('../img/main/bg1.png');
    background-repeat: no-repeat;
    background-position: right 260px bottom;
  
   
}



@media (max-width: 768px) {
    #clinic {
        background-image: none;
        min-height: auto;
    }
}


#info{background:#fff}


.reservation_section {
    padding: 130px 0 120px;
    text-align: center;
}

.reservation_inner {
    max-width: 1050px;
    margin: 0 auto;
}

.reservation_en {
    margin-bottom: 20px;
    color: #777;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 3px;
}

.reservation_title {
    margin: 0;
    color: #222;
    font-size: 46px;
    font-weight: 700;
    line-height: 1.35;
}

.reservation_desc {
    margin-top: 28px;
    color: #666;
    font-size: 20px;
    line-height: 1.7;
}

.reservation_btns {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 45px;
}

.reservation_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;

    width: 280px;
    height: 72px;

    font-size: 19px;
    font-weight: 600;
    text-decoration: none;

    transition: all .3s ease;
}

.reservation_btn.naver {
    background: #222;
    color: #fff;
}

.reservation_btn.tel {
    background: #fff;
    color: #222;
    border: 1px solid #ddd;
}

.reservation_btn .btn_small {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: .6;
}

.reservation_btn:hover {
    transform: translateY(-3px);
}

.reservation_btn.naver:hover {
    background: #333;
}

.reservation_btn.tel:hover {
    border-color: #222;
}

.reservation_info {
    margin-top: 55px;
    padding-top: 35px;
    border-top: 1px solid #ddd;

    color: #777;
    font-size: 16px;
    line-height: 1.9;
}


/* mobile */
@media (max-width: 768px) {

    .reservation_section {
        padding: 80px 20px 70px;
    }

    .reservation_title {
        font-size: 32px;
    }

    .reservation_desc {
        margin-top: 20px;
        font-size: 17px;
    }

    .reservation_btns {
        flex-direction: column;
        gap: 10px;
        margin-top: 35px;
    }

    .reservation_btn {
        width: 100%;
        height: 64px;
    }

    .reservation_info {
        margin-top: 40px;
        padding-top: 30px;
        font-size: 15px;
        line-height: 1.8;
        word-break: keep-all;
    }
}
/* =========================================================
   Mobile typography normalization
   - desktop styles untouched
   - keeps section/title/body hierarchy consistent on mobile
========================================================= */
@media (max-width: 768px) {
    /* 기본 본문/보조문구 */
    .main .font-15 { font-size: 14px; }
    .main .font-18 { font-size: 15px; }
    .main .font-20 { font-size: 16px; }
    .main .font-22 { font-size: 16px; line-height: 1.75; }
    .main .font-24,
    .main .font-25,
    .main .font-26 { font-size: 17px; }

    /* 소제목 */
    .main .font-28,
    .main .font-30 { font-size: 20px; }
    .main .font-32 { font-size: 22px; line-height: 1.4; }
    .main .font-34,
    .main .font-35,
    .main .font-36,
    .main .font-38 { font-size: 26px; line-height: 1.35; }

    /* 섹션/콘텐츠 타이틀 */
    .main .font-40,
    .main .font-42,
    .main .font-44,
    .main .font-45,
    .main .font-46,
    .main .font-48 { font-size: 28px; line-height: 1.3; }
    .main .font-50,
    .main .font-55,
    .main .font-60,
    .main .font-65 { font-size: 30px; line-height: 1.25; }

    /* 메인 비주얼은 별도 비율 유지 */
    #mainSlide .font-70 { font-size: 38px; }
    #mainSlide .font-50 { font-size: 28px; }

    /* 병원소개 */
    #clinic .font-35 { font-size: 28px; }
    #clinic .main_en.font-30 { font-size: 19px; }
    #clinic .font-22 { font-size: 16px; line-height: 1.8; }

    /* 진료원칙 */
    #principle .font-32 { font-size: 22px; }
    #principle .font-22 { font-size: 16px; line-height: 1.75; }

    /* 주요진료 */
    #treatment > .container > .font-50 { font-size: 30px; }
    #treatment .font-40 { font-size: 24px; }
    #treatment .font-22 { font-size: 16px; line-height: 1.7; }

    /* 의료진 */
    #doctor .point-font.font-30 { font-size: 18px; }
    #doctor .point-font .font-40 { font-size: 24px; }
    #doctor .font-30 { font-size: 18px; }
    #doctor .font-30 .font-50 { font-size: 30px; }
    #doctor .font-22 { font-size: 16px; line-height: 1.75; }

    /* 진료안내 */
    #info .font-45 { font-size: 30px; }
    #info table.font-22 { font-size: 16px; line-height: 1.6; }
    #info .font-40 { font-size: 26px; }
    #info .font-15 { font-size: 13px; line-height: 1.6; }
    #info .font-18 { font-size: 15px; }

    /* 예약 */
    .reservation_en { font-size: 12px; }
    .reservation_title { font-size: 30px; line-height: 1.35; }
    .reservation_desc { font-size: 16px; }
    .reservation_btn { font-size: 16px; }
    .reservation_btn .btn_small { font-size: 10px; }
    .reservation_info { font-size: 15px; line-height: 1.8; }


    /* 푸터 */
    footer .font-18 { font-size: 14px; line-height: 1.7; }
}

@media (max-width: 500px) {
    #mainSlide .font-70 { font-size: 34px; }
    #mainSlide .font-50 { font-size: 25px; }

    #clinic .font-35 { font-size: 26px; }
    #treatment > .container > .font-50,
    #info .font-45,
    .reservation_title { font-size: 28px; }
}