.sub {background: #fff; position: relative;}
.sub p {line-height: 1.6;}

.visible-pc {display: none;}
.hidden-pc {display: block;}

@media(max-width:1440px) {
    .visible-pc {display: block;}
    .hidden-pc {display: none;}
}

@media(max-width: 990px) {
    .sub .container {padding: 0 7.5rem;}
}

@media(max-width: 768px) {
    .sub .container {padding: 0 6.25rem;}
}

@media(max-width: 500px) {
    .sub .container {padding: 0 4.5rem;}
}

@media(max-width: 425px) {
    .sub .container {padding: 0 3rem;}
}

/* 인트로 */
.sub #intro .txtbox {padding-left: 7.5rem;}
.sub #intro .point-img {display: flex; justify-content: end; position: absolute; right: 0; top: 0;}
.sub #intro .point-img img {width: 15rem;}

.sub #intro .txtbox .tit br.mo {display: none !important;}

@media(max-width:1440px) {
    .sub #intro .imgbox {width: 55%;}
    .sub #intro .txtbox {width: 45%;}

    .sub #intro .point-img img {width: 13rem;}
}

@media(max-width:1240px) {
    .sub #intro .imgbox {width: 50%;}
    .sub #intro .txtbox {width: 50%; padding-left: 5rem; padding-bottom: 0;}
    .sub #intro .point-img img {width: 12rem;}
}

@media(max-width:990px) {
    .sub #intro .wrap > .flex {flex-direction: column;}
    .sub #intro .imgbox {width: 100%; order: 2;}
    .sub #intro .txtbox {width: 100%; padding-left: 7.5rem; padding-bottom: 3.5rem;}
    .sub #intro .point-img {position: relative; right: 2.5%;}
}

@media(max-width:768px) {
    .sub #intro .txtbox {padding-left: 0rem;}
    .sub #intro .txtbox .tit {padding: 0 6.25rem;}
}

@media(max-width:500px) {
    .sub #intro .txtbox .tit {padding: 0 4.5rem;}
}

@media(max-width:480px) {
    .sub #intro .txtbox .tit {padding: 0 3rem;}
    .sub #intro .txtbox .tit br {display: none !important;}
    .sub #intro .txtbox .tit br.no {display: block !important;}
    .sub #intro .txtbox .tit br.mo {display: block !important;}
}

/* tab내용 */
.sub #type .tabs {padding: 2rem; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; cursor: pointer; margin-top: -1px;}
.sub #type .openBtn {display: flex; align-items: center; gap: 1rem; position: absolute; right: 6rem; top: 50%; transform: translateY(-50%);}
.sub #type .openBtn span {width: 0.8125rem; height: 0.8125rem; position: relative;}
.sub #type .openBtn span:after {position: absolute; left: 50%; top: 50%; transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); width: 100%; height: 1px; content: ""; background: var(--pointcolor);}
.sub #type .openBtn span::before {position: absolute; left: 50%; top: 50%; transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); height: 100%; width: 1px; content: ""; background: var(--pointcolor);}

.sub #type .tabs-contents {background: #fcfbfb; padding: 6.25rem; border-bottom: 1px solid #e5e5e5;}
.sub #type .keyword {display:flex; flex-wrap: wrap; gap: 1rem;}
.sub #type .keyword p {padding: 0.5rem 1.5rem; border: 1px solid var(--pointcolor); border-radius: 100px; color: var(--pointcolor);}

.sub #type .tabs-contents p.desc {position: relative; padding-left: 15px; font-size: 0.9375rem; color: #383838; font-weight: 300;}
.sub #type .tabs-contents p.desc:after {position: absolute; left: 0; top: 0; content: "※";}

.sub #type .principle {margin-top: -3rem;}
.sub #type .principle.mt-3 {margin-top: 3rem;}
.sub #type .principle .line {width: 2rem; height: 2px; background: var(--pointcolor); display: block;}
.sub #type .principle .flexList {--x-gap: 0.5rem; --y-gap: 0.5rem;}

.sub #type .cont.on .tabs {background: #f6f8f5;}
.sub #type .cont.on .openBtn span::before {opacity: 0;}

.sub #type a.moreBtn {width: fit-content; gap: 1rem;}

@media(max-width:990px) {
    .sub #type .container {width: 95%; margin: auto; padding: 0;}
    .sub #type .tit {padding: 0 7.5rem;}
    .sub #type .intro > .flex {flex-direction: column;}
    .sub #type .intro .box {width: 100%;}
    .sub #type .intro .box.imgbox {order: -1;}
    .sub #type .intro .box.imgbox img {margin: auto;}

    .sub #type .openBtn {right: 3rem;}
    .sub #type .openBtn p {display: none;}
    .sub #type .openBtn span {width: 1.8rem; height: 1.8rem;}
    .sub #type .openBtn span:after {height: 3px;}
    .sub #type .openBtn span::before {width: 3px;}
    
    .sub #type .principle {margin-top: 7.5rem !important;}
    .sub #type .tabs-contents p.desc {font-size: 1.25rem;}
}

@media(max-width:768px) {
    .sub #type .tit {padding: 0 6.25rem;}
}

@media(max-width:600px) {
    .sub #type .tabs-contents p.desc br {display: none;}
}

@media(max-width:500px) {
    .sub #type .tit {padding: 0 4.5rem;}
    .sub #type .tabs-contents {padding: 6.25rem 5rem;}
    .sub #type .txtbox p br {display: none !important;}
    .sub #type .principle p br {display: none !important;}
}

@media(max-width:425px) {
    .sub #type .tit {padding: 0 3rem;}
    .sub #type .tabs-contents {padding: 6.25rem 3.5rem;}
    .sub #type .tabs-contents p br.visible-pc {display: none;}
    .sub #type .openBtn span {width: 1.5rem; height: 1.5rem;}
    .sub #type .openBtn span:after {height: 2px;}
    .sub #type .openBtn span::before {width: 2px;}
}

/* @media(max-width:460px) {
    .sub #type .tit br {display: none;}
} */

@media(max-width:325px) {
    .sub #type .openBtn {display: none;}
}

/* 스페셜 */
.sub #special .flexList {--x-gap: 0rem; --y-gap: 0rem;}
.sub #special .txtbox {padding: 0 7.5rem;}
.sub #special .box {background-size: cover;}
.sub #special .box:nth-child(2) {background-image: url("/img/sub/special_bg01.jpg");}
.sub #special .box:nth-child(3) {background-image: url("/img/sub/special_bg02.jpg");}

@media(max-width:990px) {
    .sub #special .box:nth-child(3) {order: 4;}
    .sub #special .txtbox {padding: 5rem 7.5rem;}
    .sub #special .txtbox h2 br.visible-md {display: none !important;}
}

@media(max-width:768px) {
    .sub #special .txtbox {padding: 5rem 6.25rem;}
}

@media(max-width:500px) {
    .sub #special .txtbox {padding: 5rem 4.5rem;}
}

@media(max-width:425px) {
    .sub #special .txtbox {padding: 5rem 3rem;}
}

@media(max-width:375px) {
    .sub #special .txtbox h2 br.visible-md {display: block !important;}
}

@media(max-width:360px) {
    .sub #special .txtbox p br {display: none;}
}

/* 시술과정 */
.sub #process .box {display: flex; align-items: center; gap: 5.625rem; padding-right: 2.5rem; padding-left: 2.5rem;}
.sub #process .box.subject {background-image: url("/img/sub/process_bg.jpg"); background-size: cover; border-radius: 200px;}
.sub #process .box p {width: calc(100% / var(--count)); padding: 2.5rem;}
.sub #process .box.subject p {position: relative;}
.sub #process .box.subject p:after {position: absolute; right: -5rem; top: 50%; transform: translateY(-50%); content: url("/img/sub/process-arrow.png");}
.sub #process .box.subject p:nth-child(3):after {right: -5.5rem;}
.sub #process .box.subject p:last-child:after {display: none;}


@media(max-width:1240px) {
.sub #process .box.subject p:after {transform: translateY(-50%) scale(0.8); }
.sub #process .box.subject p:nth-child(2):after {right: -6rem;}
.sub #process .box.subject p:nth-child(3):after {right: -6rem;}
}

@media(max-width:990px) {
    .sub #process .cont {display: flex; justify-content: center; gap: 4rem;}
    .sub #process .box {flex-direction: column; padding-right: 0; padding: 3.5rem 0; gap: 6.25rem;}
    .sub #process .box.subject {background-image: url("/img/sub/process_bg_m.jpg");}
    .sub #process .box.subject p:after {transform: translateX(-50%) scale(0.6) rotate(90deg); right: auto; left: 50%; top: 9.5rem;}
    .sub #process .box p {width: 100%; height: calc(100% / var(--count));}
    .sub #process .box.step p {text-align: left; padding-left: 0;}

    .sub #process .box p[data-aos="fade-right2"] {transform: translate3d(0, -30px, 0);}
    .sub #process .box p[data-aos="fade-right2"].aos-animate {transform: translateZ(0);}
}

@media(max-width:500px) {
    .sub #process .box.step p {padding-right: 0;}
    .sub #process .box.subject  {padding: 3.5rem 1rem;}
    .sub #process .box.subject p:first-child:after {top: 10rem;}
    .sub #process .box.subject p:after {top: 12rem;}
}

@media(max-width: 365px) {
    .sub #process .box.step {display: none;}
}

/* 서브 공통 */
.sub #common .box {background-position: center; background-size: cover; color: #fff; aspect-ratio: 2 / 3;}
.sub #common .box:nth-child(1) {background-image: url("/img/sub/common01.jpg");}
.sub #common .box:nth-child(2) {background-image: url("/img/sub/common02.jpg");}
.sub #common .box:nth-child(3) {background-image: url("/img/sub/common03.jpg");}
.sub #common .box:nth-child(4) {background-image: url("/img/sub/common04.jpg");}
.sub #common .box .txt {position: absolute; width: 80%; left: 50%; transform: translateX(-50%);}
.sub #common .box:nth-child(odd) .txt {top: 3.5rem;}
.sub #common .box:nth-child(even) .txt {bottom: 3.5rem;}

@media(max-width:1700px) {
    .sub #common .box .txt p br {display: none;}
}

@media(max-width:1240px) {
    .sub #common .box {aspect-ratio: 4 / 5;}
    .sub #common .box .txt p br {display: block;}
}

@media(max-width:768px) {
    .sub #common .font-18 {font-size: 1.625rem;}
}

.sub #common.about {background: rgba(234,242,231,0.3);}

/* 하단 카테고리 바로가기 */
.sub #subject {overflow: hidden;}
.sub #subject .bg {position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: 150%; height: 20rem; background: linear-gradient(to bottom, #f4f8f2 60%, transparent 100%); transition: 5s;}
.sub #subject .bg.aos-animate {border-radius: 100% 100% 0 0;}

.sub #subject .container {position: relative; z-index: 1;}
.sub #subject .box.imgbox {padding-left: 5rem;}
.sub #subject .contbox li {cursor: pointer; transition: 0.45s; padding: 2rem 0; border-top: 1px solid #e5e5e5;}
.sub #subject .contbox li:first-child {padding-top: 0; border-top: 0;}
.sub #subject .contbox li .txt {width: 17rem;}
.sub #subject .contbox li .arrow:after {position: absolute; right: 0; top: 26%; transform: translateY(-50%); background: var(--pointcolor); content: ""; border-radius: 50%; width: 3.5rem; height: 3.5rem; opacity: 0; transition: 0.45s;}
.sub #subject .contbox li .arrow img {filter: grayscale(100%) brightness(0); position: relative; z-index: 1; transition: 0.45s; width: 1.5rem;}

.sub #subject .contbox li.on {color: var(--pointcolor);}
.sub #subject .contbox li.on .arrow:after {opacity: 1;}
.sub #subject .contbox li.on .arrow img {filter: brightness(0) invert(1); transform: translateX(-0.9rem);}

@media(max-width:990px) {
    .sub #subject .bg {width: 250%;}
    .sub #subject .container .flex {flex-direction: column; gap: 1rem;}

    .sub #subject .box {width: 100%;}
    .sub #subject .box.imgbox {padding-left: 0;}
    .sub #subject .contbox li {justify-content: flex-start; gap: 4rem;}
    .sub #subject .contbox li .txt {width: 75%;}
}

@media(max-width:500px) {
    .sub #subject .bg {width: 350%;}
    .sub #subject .contbox li {gap: 2rem;}
    .sub #subject .contbox li .txt {width: 75%;}
}

@media(max-width:365px) {
    .sub #subject .contbox li .arrow {display: none;}
}

.sub .about .container {padding: 0;}

/* 소개페이지 */
.sub #about .imgbox {background: url("/img/sub/yourskin/about_bg.jpg"); background-size: cover;}
.sub #about .txtbox {background: #ebeee9; padding: 150px 0;}
.sub #about .txtbox:after {position: absolute; right: 15%; top: 0; width: 1px; height: 100%; background: #d6dccf; content: ""; z-index: 1;}
.sub #about .txtbox .line {width: 100%; height: 1px; background: #d6dccf;}
.sub #about .txtbox p.font_serif {color: #233117;}
.sub #about .txt {position: relative; z-index: 3;}
.sub #about .point-img {position: absolute; right: 0; bottom: 0; z-index: 2;}
.sub #about .point-img img {width: 23.75rem;}

@media(max-width:1680px) {
    .sub #about .point-img img {width: 20rem;}
}

@media(max-width:1440px) {
    .sub #about .point-img img {width: 18rem;}
}

/* @media(max-width:1240px) {
    .sub #about .txt {margin-left: 6.25rem;}
} */

@media(max-width:1240px) {
    .sub #about .imgbox {width: 40%;}
    .sub #about .txtbox {width: 60%;}
    .sub #about .txt {margin-left: 6.25rem;}
}

@media(max-width:990px) {
    .sub #about .wrap {flex-direction: column;}
    .sub #about .imgbox {width: 100%; aspect-ratio: 4 / 3;}
    .sub #about .txtbox {width: 100%; padding: 100px 0;}
    .sub #about .txt {margin-left: 10%; margin-right: 10%;}
}

@media(max-width:768px) {
    .sub #about .txtbox {padding:80px 0;}
    .sub #about .txt {margin-left: 5%; margin-right: 5%;}
}

@media(max-width:360px) {
    .sub #about .txt br {display: none;}
}

/* 스페셜 */
.sub #scroll {background: linear-gradient(to bottom, #fff 1%, rgba(234,242,231,0.3) 99%);}
.sub #scroll .flexList {flex-wrap: nowrap;}
.sub #scroll .arrow {background: url("/img/sub/arrow_bg.png"); background-size: cover; background-position: bottom; width: 5rem; height: 5rem; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.sub #scroll .arrow img {filter: brightness(0) invert(1);}
.sub #scroll .cont-wrap {display: flex; gap: 2rem; margin-top: 5rem;}
.sub #scroll .cont-wrap:nth-child(odd) img {border-radius: 0 2rem 0 0;}
.sub #scroll .cont-wrap:nth-child(even) img {border-radius: 2rem 0 0 0;}

.sub #scroll .cont {border-bottom: 1px solid #ebeee9; padding-bottom: 5rem;}
.sub #scroll .cont:last-child {border-bottom: none;}

@media(max-width:990px) {
    .sub #scroll .flexList {flex-wrap: wrap;}
}

/* 진료시간 */
.sub #guide .bg_wrap {clip: rect(0, auto, auto, 0); position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.sub #guide .bg_wrap .bg {position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100vh; background-repeat: no-repeat; background-position: center top; background-size: cover; transform: translateZ(0); will-change: transform; background-image: url("/img/sub/yourskin/guide_bg.jpg");}

.sub #guide .cont {padding: 3.5rem; background: rgba(0,0,0,0.3); border-radius: 100px;}
.sub #guide .box {position: relative; width: calc(100% / 4);}
.sub #guide .box::after {position: absolute; right: 0; top: 0;  width: 1px; height: 6.25rem; background: #fff; opacity: 0.5; content: "";}
.sub #guide .box:last-child:after {display: none;}

.sub #guide .moreBtn {gap: 2.5rem; background: var(--pointcolor); border-color: var(--pointcolor);}

@media(max-width:1880px) {
   .sub #guide .wrap {width: 90%;}
}

@media(max-width:990px) {
    .sub #guide .font-16 {font-size: 1.25rem;}
    
    .sub #guide .cont {flex-direction: column; width: fit-content; margin: auto;  border-radius: 200px; padding: 5rem 0;}
    .sub #guide .box {width: 100%; padding: 5rem 4rem;}
    .sub #guide .box:after {display: block; width: 50%; height: 1px; right: auto; left: 50%; transform: translateX(-50%); top: auto; bottom: 0;}
    .sub #guide .flexList {width: fit-content; margin: auto;}

    .sub #guide .box[data-aos="fade-right2"] {transform: translate3d(0, -30px, 0);}
    .sub #guide .box[data-aos="fade-right2"].aos-animate {transform: translateZ(0);}
}

/* 지도 */
.sub #map {background-image: url("/img/sub/yourskin/map_bg.jpg"); background-repeat: no-repeat; background-size: cover;}

.sub #map .button-wrap {gap: 1.5rem;}
.sub #map .button-wrap.mo {display: none !important;}
.sub #map .button-wrap a {width: 14rem; border-radius: 100px; padding: 1rem;}
.sub #map .kakao {background: #f7e409; color: #381e1f;}
.sub #map .naver {background: #3bab36; color: #fff;}

.sub #map .tel img {filter: grayscale(100%) brightness(0); width: 3rem; margin-top: .5rem;}

.sub #map .mapbox > div {width: 100%; z-index: 1;}
.sub #map .root_daum_roughmap .wrap_map {height: 30rem;}

@media(max-width:990px) {
    .sub #map .button-wrap a {width: 16rem;}
}

@media(max-width:768px) {
    .sub #map .contbox {flex-direction: column; gap: 3.5rem;}
    .sub #map .contbox .box {width: 100%; text-align: left;}
    .sub #map .tel {justify-content: flex-start;}
}

@media(max-width:500px) {
    .sub #map .button-wrap {flex-direction: column;}
    .sub #map .button-wrap a {width: 100%;}
}

/* 장비 */
.sub #equip .flexList {--y-gap: 5rem;}
.sub #equip .box {cursor: pointer;}
.sub #equip .box .imgbox {overflow: hidden;}
.sub #equip .box .imgbox:before {position: absolute; left: 50%; top: 180%; transform: translateX(-50%) scaleY(1) scaleX(1.45);  width: 140%; height: 190%; background-color: rgba(0, 0, 0, 0.05); content: ""; transition: all 0.8s 0.1s cubic-bezier(0.0, 0, 0.1, 1)}
.sub #equip .box .imgbox:after {position: absolute; left: 50%; top: 180%; transform: translateX(-50%) scaleY(1) scaleX(1.45); width: 140%; height: 190%; background: rgba(35,49,23,0.8); content: ""; transition: all 0.8s 0.1s cubic-bezier(0.55, 0, 0.1, 1);}
.sub #equip .box:hover .imgbox:before {top: -35%; transform: translateX(-50%) scaleY(1.3) scaleX(0.8);}
.sub #equip .box:hover .imgbox:after {top: -45%; transform: translateX(-50%) scaleY(1.3) scaleX(0.8);}

.sub #equip .box.active .imgbox:before {top: -35%; transform: translateX(-50%) scaleY(1.3) scaleX(0.8);}
.sub #equip .box.active .imgbox:after {top: -45%; transform: translateX(-50%) scaleY(1.3) scaleX(0.8);}

.sub #equip .box .moreBtn {position: absolute; left: 50%; top: 100%; transform: translate(-50%, -50%); width: 100%; z-index: 1; transition: all 0.8s 0.1s cubic-bezier(0.0, 0, 0.1, 1); opacity: 0;}
.sub #equip .box:hover .moreBtn {opacity: 1; top: 50%;}
.sub #equip .box.active .moreBtn {opacity: 1; top: 50%;}

.sub #equip ul {flex-wrap: wrap; column-gap: 1rem; row-gap: 0.5rem; margin-top: 0.625rem;}

@media(max-width:360px) {
    .sub #equip .flexList {--count: "1";}
}

/* 팝업 */
.sub .equip-pop {position: fixed; left: 50%; top: 15%; transform: translatex(-50%); z-index: 61; max-width: 82.5rem; width: 100%;}
.sub .equip-pop .close {position: absolute; left: 2rem; top: 2rem; cursor: pointer;}
.sub .equip-pop .box {background: #fff; height: 100%; aspect-ratio: 616 / 600;}
.sub .equip-pop .box.txtbox {padding: 0 7.5rem;} 
.sub .equip-pop ul {flex-wrap: wrap; column-gap: 1rem; row-gap: 0.5rem; margin-top: 1rem;}

@media(max-width:1240px) {
    .sub .equip-pop {width: 90%;}
    .sub .equip-pop .box.txtbox p br {display: none;}
}

@media(max-width:990px) {
    .sub .equip-pop {width: 40rem; top: 10%; transform: translateX(-50%);}
    .sub .equip-pop .wrap {flex-direction: column;}
    .sub .equip-pop .box {aspect-ratio: auto; width: 100%;}
    .sub .equip-pop .box.txtbox {padding: 3rem 5rem;}
    .sub .equip-pop h3 {margin-top: 3rem;}
    .sub .equip-pop .font-20 {font-size: 1.5rem;}
    .sub .equip-pop p.font-18 {margin-top: 1.5rem;}
}

@media(max-width:500px) {
    .sub .equip-pop {width: 90%;}
    .sub .equip-pop .close img {width: 15px;}
}

/* 유형 슬라이드 */
.sub #typeSlide {overflow: hidden;}
.sub #typeSlide .bg {position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; width: 150%; height: 100%; background: linear-gradient(to top, #f4f8f2 30%, transparent 100%); transition: 5s;}
.sub #typeSlide .bg.aos-animate {border-radius: 0 0 100% 100% ;}

.sub #typeSlide .flexList {--x-gap: 5rem; --y-gap: 3.5rem;}

.sub #typeSlide .swiper {margin: 0;}
.sub #typeSlide .txtbox {display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 56 / 50;}
.sub #typeSlide .typeSwiper2 .swiper-slide {cursor: pointer;}
.sub #typeSlide .typeSwiper2 .swiper-slide-thumb-active {filter: grayscale(10);}

.sub #typeSlide .swiper-pagination {text-align: left;}
.sub #typeSlide a.moreBtn {width: fit-content; padding: 0.625rem 2.5rem;}
.sub #typeSlide a.moreBtn:nth-child(n+2) {margin-top: 1.5rem;}
.sub #typeSlide .swiper-pagination-clickable .swiper-pagination-bullet {margin: 0;}
.sub #typeSlide .swiper-pagination-bullet {background: transparent; opacity: 1; width: fit-content; height: auto; border-radius: 100px; transition: none;}
.sub #typeSlide .swiper-pagination-bullet img {transition: none;}
.sub #typeSlide .swiper-pagination-bullet:hover {transition: all 0.8s 0.1s cubic-bezier(0.55, 0, 0.1, 1);}
.sub #typeSlide .swiper-pagination-bullet:hover img {transition: all 0.8s 0.1s cubic-bezier(0.55, 0, 0.1, 1);}
.sub #typeSlide .swiper-pagination-bullet-active {background: var(--pointcolor); }
.sub #typeSlide .swiper-pagination-bullet-active span {color: #fff;}
.sub #typeSlide .swiper-pagination-bullet-active img {filter: brightness(0) invert(1);}
.sub #typeSlide a.moreBtn.point-bg span {color: #fff;}
.sub #typeSlide a.moreBtn.point-bg img {filter: brightness(0) invert(1);}

@media(max-width:1240px) {
    .sub #typeSlide .cont_wrap {flex-direction: column; gap: 3.5rem;}
    .sub #typeSlide .cont_wrap > .box {width: 100%;}

    .sub #typeSlide .swiper-pagination {display: flex; align-items: center; justify-content: center; margin: auto; gap: 1.5rem;}
    .sub #typeSlide .swiper-pagination a.moreBtn:nth-child(n+2) {margin-top: 0;}
}

@media(max-width:990px) {
    .sub #typeSlide .bg {width: 250%;}
    .sub #typeSlide .container {padding: 0;}
    .sub #typeSlide .tit {text-align: center;}
    .sub #typeSlide .cont {flex-direction: column; gap: 3.125rem;}
    .sub #typeSlide .cont > .box {width: 100%;}
    .sub #typeSlide .txtbox {aspect-ratio: auto; gap: 6.25rem; padding-left: 0;}
}

@media(max-width:768px) {
    .sub #typeSlide.box2 .swiper-pagination {width: 40rem !important;}
    .sub #typeSlide .swiper-pagination {flex-wrap: wrap;}
    .sub #typeSlide .swiper-pagination-bullet {border: 1px solid var(--pointcolor) !important;}
    .sub #typeSlide .swiper-pagination-bullet span {color: var(--pointcolor);}
    .sub #typeSlide .swiper-pagination-bullet img {filter: none;}
    .sub #typeSlide .swiper-pagination-bullet-active span {color: #fff;}
    .sub #typeSlide .swiper-pagination-bullet-active img {filter: brightness(0) invert(1);}
    .sub #typeSlide a.moreBtn.point-bg {background: var(--pointcolor); margin: auto;}
}

@media(max-width:500px) {
    .sub #typeSlide .bg {width: 350%;}
    .sub #typeSlide .txtbox br {display: none;}
    .sub #typeSlide.box2 .swiper-pagination {width: 100% !important;}
}

/* 서브포인트 */
.sub #point h3 {font-size: 12.5rem; width: 100%; font-weight: 600; line-height: 1; opacity: 0.05; position: absolute; left: 0; width: 100%; top: -2rem;}
.sub #point h3.two {top: 1rem;}
.sub #point .cont {background-size: cover; background-repeat: no-repeat; background-position: center;}


@media(max-width:1440px) {
    .sub #point h3 {font-size: 9rem; top: 1rem;}
    .sub #point h3.two {top: 4rem;}
}

@media(max-width:768px) {
    .sub #point h3 {font-size: 6.25rem; top: 6rem;}
    .sub #point h3.two {top: 6.5rem;}
}

@media(max-width:500px) {
    .sub #point h3 span:nth-child(n+11) {display: none;}
    .sub #point h3.two {top: 9.5rem;}
}

@media(max-width:440px) {
    .sub #point p br {display: none !important;} 
    .sub #point p br.no {display: block !important;} 
    .sub #point h3 {font-size: 4.5rem; top: 7.5rem;}
    
}

@media(max-width:350px) {
    .sub #point .tit br {display: none !important;} 
    .sub #point h3.two {top: 11rem;}
}

/* 증상 진료 추천 */
.sub #recommend {background-size: cover; background-position: center; padding: 6.25rem;}
.sub #recommend.dermatology {background-image: url("/img/sub/dermatology/recommend_bg.jpg"); }
.sub #recommend.skin {background-image: url("/img/sub/skin/recommend_bg.jpg"); }
.sub #recommend.wellBeing {background-image: url("/img/sub/wellBeing/recommend_bg.jpg"); }
.sub #recommend .wrap {background: #fff; padding: 6.25rem 3.5rem;}
.sub #recommend .flexList {--y-gap: 2.5rem}
.sub #recommend .box {padding: 1.5rem 2rem; background: #f4f8f2;}
.sub #recommend .box img {width: 1.5625rem;}
.sub #recommend .container {padding: 0;}

@media(max-width:1680px) {
    .sub #recommend .flexList {--count: 2;}
}

@media(max-width:1024px) {
    .sub #recommend {padding: 3.5rem;}
}

@media(max-width:990px) {
    .sub #recommend .flexList {--count: 1;}
    .sub #recommend .box img {width: 2rem;}
}

@media(max-width:500px) {
    .sub #recommend {padding: 5%;}
    .sub #recommend .wrap {padding: 6.25rem 0;}
}

/* 장비슬라이드 */
.sub #equipSlide .container {padding: 0;}
.sub #equipSlide .swiper-slide {width: 22.5rem; cursor: pointer;}
.sub #equipSlide .imgbox {overflow: hidden;}

.sub #equipSlide .imgbox::after {position: absolute; left: 0; top: 0; background-image: url("/img/sub/equip/equipSlide_bg.jpg"); background-size: cover; width: 100%; height: 100%; content: ""; background-position: right bottom; opacity: 0; transition: 0.45s;}
.sub #equipSlide .imgbox p.desc {position: absolute; left: 2.5rem; right: 2.5rem; top: 3rem; z-index: 1; opacity: 0; transition: 0.5s;}
.sub #equipSlide .swiper-slide:hover .imgbox::after {opacity: 1;}
.sub #equipSlide .swiper-slide:hover p.desc { opacity: 1;}

.sub #equipSlide .swiper-pagination {width: 22.5rem !important; height: 2px; position: absolute; left: calc((100% - var(--layoutwidth)) / 2); top: auto; bottom: 0;}

@media(max-width:1550px) {
    .sub #equipSlide .swiper-pagination {left: 2.5%;}
    .sub #equipSlide .section-left {padding-left: 2.5%;}
    .sub #equipSlide .container {width: 95%;}
}

@media(max-width: 990px) {
    .sub #equipSlide .tit {padding: 0 7.5rem;}
    .sub #equipSlide .cont {flex-direction: column; gap: 4.375rem;}
    .sub #equipSlide .cont .box {width: 100%;}
    .sub #equipSlide .swiper-slide {width: 30rem;}
    .sub #equipSlide .font-15 {font-size: 1.25rem;}
    .sub #equipSlide .swiper-pagination {margin-top: 5rem; position: inherit; width: 95% !important;}
}

@media(max-width:768px) {
    .sub #equipSlide .tit {padding: 0 6.25rem;}
}

@media(max-width:500px) {
    .sub #equipSlide .tit {padding: 0 4.5rem;}
}

@media(max-width:425px) {
    .sub #equipSlide .tit {padding: 0 3rem;}
}

@media(max-width:360px) {
    .sub #equipSlide .section-left {padding-right: 5%;}
    .sub #equipSlide .swiper-slide {width: 100%;}
    .sub #equipSlide .swiper-pagination {width: 100% !important;}
}

@media(max-width:320px) {
    .sub #equipSlide .swiper-slide p.desc br {display: none;}
}

/* 박스유형 */
.sub #box .flexList {--y-gap: 3.5rem}

/* 박스유형 */
.sub #box2 {background: #f6f8f5;}
.sub #box2 .flexList {--x-gap: 4.5rem; --y-gap: 3.5rem}
.sub #box2 .box {display: flex; flex-direction: column; justify-content: space-between;}
.sub #box2 .txt {background: var(--pointcolor); color: #fff; padding: 1rem 2rem;}
.sub #box2 .desc p {padding: 2rem 0;}

@media(max-width:1240px) {
    .sub #box2 .flexList {--x-gap: 1.5rem;}
}

/* 표유형 */
.sub #table .container {padding: 0;}
.sub #table .item {border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5;}
.sub #table .item:first-child:after {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 5rem; height: 5rem; border-radius: 50%; background: #c1a460; content: "VS"; font-size: 1.875rem; color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--pointfont); font-weight: 600;}
.sub #table .item img {height: 100%;}
.sub #table .item h3 {padding: 1rem; color: #fff; font-weight: 600;}
.sub #table .item h3:nth-child(1) {background: var(--pointcolor); padding-right: calc(4% + 1.5rem);}
.sub #table .item h3:nth-child(2) {background: #233117; padding-left: calc(4% + 1.5rem);}
.sub #table .item p {padding: 1.5rem; vertical-align: middle; display: flex; align-items: center; justify-content: center;}
.sub #table .item p:nth-child(1),
.sub #table .item p:nth-child(3) {width: 46%;}
.sub #table .item p:nth-child(2) {background: #f4f8f2; font-weight: 600; width: 8%;}

@media(max-width:680px) {
    .sub #table .cont {overflow: auto; padding-bottom: 3.5rem;}
    .sub #table .table_wrap {width: 800px;}
    .sub #table ::-webkit-scrollbar {height: 3px;}
}

.bg-overlay {width: 100%; height: 100vh; position: fixed; left: 0%; top: 0%;background: rgba(0,0,0,0.3); z-index: 60;}

br.no {display: block !important;}

[data-aos="custom-blur-scale"] {
  opacity: 0;
  filter: blur(10px);
  transform: scale(0.6);
  transition-property: filter, opacity, transform !important;
}

[data-aos="custom-blur-scale"].aos-animate {
  opacity: 1;
  filter: blur(0px);
  transform: scale(1);
}