@charset "utf-8";

/*공통*/
.c-white {color:#fff !important;}
.c-main {color:var(--color-primary) !important;}
.c-2 {color:var(--color-secondary) !important;}
.c-3 {color:var(--color-third) !important;}

.doc-tit {margin-bottom:1em; font-size:clamp(20px, calc(50/ var(--inner) * 100vw ),50px); line-height:1.4; font-weight:500; color:#242424; text-align:center;}
.doc-txt {position:relative; margin-top:-1em; margin-bottom:var(--size60); font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.5; color:#454545; text-align:center;}
.doc-txt.type2 {font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px);}

.content-margin {margin-bottom:clamp(40px, calc(150/ var(--inner) * 100vw ),150px);}
.content-padding {padding:clamp(40px, calc(150/ var(--inner) * 100vw ),150px) 0;}

.bg-blue {position:relative;}
.bg-blue:before {content:''; position:absolute; left:50%; top:0; width:100vw; height:100%; background:#f2f4f8; z-index:-1; transform:translateX(-50%);}

.table-wrap table {width:100%; border-collapse:collapse; border-spacing:0px;}

.root_daum_roughmap {width:100% !important; height:clamp(270px, calc(500/ var(--inner) * 100vw ),500px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(270px, calc(500/ var(--inner) * 100vw ),500px) !important;}
.root_daum_roughmap .cont {display:none;}


/* 본원·의료진소개 */
.greetings {background:url('/images/sub/about-bg.png') no-repeat right bottom;}
.greetings .tit {margin-bottom:var(--size40); font-size:clamp(20px, calc(60/ var(--inner) * 100vw ),60px); line-height:1.2; font-weight:700; color:var(--color-primary);}
.greetings .tt {margin-bottom:var(--size30); font-size:clamp(16px, calc(28/ var(--inner) * 100vw ),28px); line-height:1.36; font-weight:600; color:#242424;}
.greetings .tx {margin-bottom:var(--size30); font-size:clamp(14px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.5;}
.greetings .tx:last-child {margin-bottom:0;}

.staff-info {display:flex; gap:var(--size80);}
.staff-info:after {content:''; position:absolute; left:50%; top:0; width:100vw; height:100%; background:url('/images/sub/staff-bg.png') no-repeat right bottom; z-index:-1; transform:translateX(-50%);}
.staff-info .cnt {flex:1 1 auto; min-width:0; width:1%;}
.staff-info .name {margin-bottom:var(--size40); padding-bottom:var(--size40); font-size:clamp(20px, calc(54/ var(--inner) * 100vw ),54px); line-height:1.2; font-weight:800; color:#242424; border-bottom:1px solid #ddd;}
.staff-info .name span {font-size:clamp(16px, calc(28/ var(--inner) * 100vw ),28px); line-height:1.2; font-weight:600; color:#454545;}
.staff-info .career h3 {display:inline-block; margin-bottom:1.5em; padding:0.4em 0.8em; background:var(--color-primary); border-radius:100vh; font-size:clamp(14px, calc(20/ var(--inner) * 100vw ),20px); line-height:1; font-weight:700; color:#fff;}
.bullet-check li {position:relative; padding-left:1.5em; margin-bottom:1em; font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.2; font-weight:500; color:#454545;}
.bullet-check li:before {content:''; position:absolute; left:0; top:0.15em; width:0.89em; height:0.89em; background:url('/images/sub/bullet01.png') no-repeat 50% 50%/contain;}
.bullet-check li:last-child {margin-bottom:0;}

.promise {text-align:center;}
.promise .icon {margin-bottom:var(--size55);}
.promise h3 {position:relative; padding-bottom:1em; margin-bottom:0.5em; font-size:clamp(20px, calc(40/ var(--inner) * 100vw ),40px); line-height:1.2; font-weight:700; color:#242424;}
.promise h3:before {content:''; position:absolute; left:50%; bottom:0; margin-left:-0.15em; width:0.3em; height:0.3em; background:var(--color-primary); transform:rotate(45deg);}
.promise .tt {margin-bottom:1em; font-size:clamp(14px, calc(20/ var(--inner) * 100vw ),20px); line-height:1.7; color:#454545;}
.promise .tx {font-size:clamp(15px, calc(26/ var(--inner) * 100vw ),26px); line-height:1.5; font-weight:600; color:#242424;}

/* 진료안내 */
.treatment-cate .items {display:flex; gap:var(--size30);}
.treatment-cate .item {flex:1; border-radius:1em; overflow:hidden;}
.treatment-cate .item h4 {display:flex; align-items:center; justify-content:center; height:var(--lnb-size); background:var(--color-primary); font-size:clamp(15px, calc(24/ var(--inner) * 100vw ),24px); line-height:1; font-weight:700; color:#fff;}
.treatment-cate .item .cnt {display:flex; align-items:center; justify-content:center; height:calc(100% - var(--lnb-size)); padding:var(--size40) 20px; background:#fff url('/images/sub/treatment-icon1.png') no-repeat right bottom; text-align:center;}
.treatment-cate .item .cnt ul li {margin-bottom:0.6em; font-size:clamp(14px, calc(20/ var(--inner) * 100vw ),20px); line-height:1.2; font-weight:500; color:#454545;}
.treatment-cate .item .cnt ul li:last-child {margin-bottom:0;}

.treatment-cate .item:nth-child(2) h4 {background:var(--color-third);}
.treatment-cate .item:nth-child(2) .cnt {background-image:url('/images/sub/treatment-icon2.png');}
.treatment-cate p {margin-top:2em; font-size:clamp(14px, calc(28/ var(--inner) * 100vw ),28px); line-height:1.4; font-weight:500; color:#242424; text-align:center;}

.clinic-hours {text-align:center;}
.clinic-hours .items {display:flex; gap:var(--size30);}
.clinic-hours .item {flex:1;}
.clinic-hours .item .inner {height:100%; padding:var(--size35) 20px; border-radius:1em; border:2px solid #9babc5;}
.clinic-hours .item .inner .icon {margin-bottom:var(--size30);}
.clinic-hours .item .inner h4 {margin-bottom:0.5em; font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.2; color:#686868;}
.clinic-hours .item .inner p {margin-top:0.5em; font-size:clamp(15px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.2; font-weight:600; color:#454545;}
.clinic-hours .txt {display:inline-block; position:relative; padding-left:1.4em; margin-top:var(--size40); font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.2; font-weight:600; color:var(--color-primary);}
.clinic-hours .txt:before {content:''; position:absolute; left:0; top:0; width:1.17em; height:1.17em; background:url('/images/sub/bullet02.png') no-repeat 50% 50%/contain;}

.direct-info .items {display:flex;}
.direct-info .item {flex:1; padding:var(--size30) 15px; border-right:1px dashed #ddd; background:#fff; padding:var(--size30); text-align:center;}
.direct-info .item:last-child {border-right:none;}
.direct-info .item .icon {margin-bottom:var(--size30);}
.direct-info .item dl {margin-bottom:0.5em; font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.2; color:#686868;}
.direct-info .item dl:last-child {margin-bottom:0;}
.direct-info .item dl dt {margin-bottom:1em; font-weight:600; line-height:1.2; color:var(--color-primary);}
.direct-info .item dl dd {font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); font-weight:600; line-height:1.2; color:#454545;}

.use-info {margin-top:var(--size60);}
.use-info h4 {position:relative; padding-left:1.3em; padding-bottom:0.7em; margin-bottom:0.7em; border-bottom:1px solid #ddd; font-size:clamp(18px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.2; font-weight:600; color:#242424;}
.use-info h4:before {content:''; position:absolute; left:0; top:0.1em; width:0.9em; height:0.9em; background:url('/images/sub/bullet03.png') no-repeat 50% 50%/contain;}
.use-info .dot-list {padding-left:var(--size30);}
.dot-list li {position:relative; padding-left:0.8em; margin-bottom:0.5em; font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.2; color:#454545;}
.dot-list li:before {content:''; position:absolute; left:0; top:0.5em; width:0.28em; height:0.28em; background:var(--color-primary); border-radius:100vh;}
.dot-list li:last-child {margin-bottom:0;}
.dot-list li strong {font-weight:600; color:#242424;}

/* 네오빔 레이저 */
.highlight {position:relative;}
.highlight:before {content:''; position:absolute; z-index:-1; left:0; bottom:0; width:100%; height:0.3em; background:#e5eaf0;}
.product-info-content h3 {margin-bottom:1em; font-size:clamp(20px, calc(60/ var(--inner) * 100vw ),60px); line-height:1.2; font-weight:500; color:#242424; text-align:center;}
.product-info-content .wrap {display:flex; align-items:center; gap:var(--size80);}
.product-info-content .cnt {flex:1 1 auto; min-width:0; width:1%;}
.product-info-content .txt {margin-bottom:1em; font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; color:#454545;}
.product-info-content .txt:last-child {margin-bottom:0;}

.principle .items {display:flex; margin:0 calc(0px - var(--size30));}
.principle .item {position:relative; flex:1; text-align:center; padding:0 var(--size30);}
.principle .item p {margin-top:var(--size35); font-size:clamp(14px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.3; font-weight:600; color:#242424;}
.principle .item:before {content:''; position:absolute; right:0; top:50%; margin-top:-13.5px; margin-right:-11.25px; width:15px; height:27px; background:url('/images/sub/icon-arw.png') no-repeat 50% 50%/contain;}
.principle .item:last-child:before {display:none;}
.principle.type2 .item:before {width:67px; height:22px; margin-top:-11px; margin-right:-33.5px; background:url('/images/sub/bullet-arw.png') no-repeat 50% 50%/contain;}

.features .wrap {max-width:640px; margin:0 auto;}
.features .wrap p {margin-bottom:var(--size35); background:var(--color-primary); border-radius:100vh; padding:var(--size15); text-align:center;}
.features .wrap p:last-child {margin-bottom:0;}
.features .wrap p span {display:inline-block; position:relative; padding-left:1.4em; font-size:clamp(14px, calc(26/ var(--inner) * 100vw ),26px); line-height:1.4; font-weight:600; color:#fff;}
.features .wrap p span:before {content:''; position:absolute; left:0; top:0.1em; width:1.08em; height:1.08em; background:url('/images/sub/bullet04.png') no-repeat 50% 50%/contain;}
.features.type2 .wrap {max-width:850px;}
.features.type3 .wrap {max-width:950px;}

.need-bg {position:relative;}
.need-bg:before {content:''; position:absolute; left:50%; top:0; width:100vw; height:100%; background:url('/images/sub/need-bg1.jpg') no-repeat 50% 50%/cover; z-index:-1; transform:translateX(-50%);}
.need-bg.bg1:before {background-image:url('/images/sub/need-bg1.jpg');}

.need-bg .wrap .items {display:flex;}
.need-bg .item {flex:1; text-align:center;}
.need-bg .item .icon {margin-bottom:var(--size35);}
.need-bg .item p {font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.3; font-weight:600; color:#fff;}

.need-bg.type2 .wrap .items {flex-wrap:wrap; margin-bottom:calc(0px - var(--size50));}
.need-bg.type2 .item {flex:1 0 auto; width:33.333%; margin-bottom:var(--size50);}

.interval-time .items {display:flex; justify-content:center;}
.interval-time .item {width:33.333%; padding:0 var(--size30);}
.interval-time .item .in .num {position:relative; z-index:2; margin:0 auto -1.1em; width:2.25em; height:2.25em; line-height:2.25em; background:var(--color-primary); border-radius:100vh; font-size:clamp(14px, calc(32/ var(--inner) * 100vw ),32px); font-weight:700; color:#fff; text-align:center;}
.interval-time .item .in .circle {position:relative;}
.interval-time .item .in .circle p {position:absolute; width:100%; left:50%; top:50%; transform:translate(-50%, -50%); font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; font-weight:600; color:#242424; text-align:center;}
.interval-time .item .in .circle small {display:block; font-size:0.75em; line-height:1.4; font-weight:600;}

.effect .items {display:flex; justify-content:center;}
.effect .item {width:25%; text-align:center; padding:0 5px;}
.effect .item .icon {margin-bottom:var(--size30);}
.effect .item p {font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.3; font-weight:600; color:#242424;}
.effect .item p small {display:block; font-size:0.75em; line-height:1.3; font-weight:400;}

.fraxel-principle {display:flex; align-items:center; gap:var(--size20);}
.fraxel-principle .cnt {flex:1 1 auto; min-width:0; width:1%;}
.fraxel-principle .img.mr {margin-right:-35px;}
.fraxel-principle .cnt .tt {margin-bottom:1em; font-size:clamp(15px, calc(28/ var(--inner) * 100vw ),28px); line-height:1.3; font-weight:600; color:#242424;}
.fraxel-principle .cnt .tx {margin-bottom:1em; font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; color:#454545;}
.fraxel-principle .cnt .tx:last-child {margin-bottom:0;}

.fraxel-ad .items {display:flex; gap:var(--size30);}
.fraxel-ad .item {flex:1;}
.fraxel-ad .item .in {height:100%; border-radius:1em; overflow:hidden; text-align:center;}
.fraxel-ad .item h3 {display:flex; flex-direction:column; align-items:center; justify-content:center; height:var(--lnb-size); background:var(--color-primary); font-size:clamp(14px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.2; font-weight:700; color:#fff;}
.fraxel-ad .item h3 span {font-size:0.82em; font-weight:400;}
.fraxel-ad .item .img {position:relative;}
.fraxel-ad .item .img:before {content:''; position:absolute; left:0; top:0; border:1px solid #ddd; border-radius:0 0 1em 1em; width:100%; height:100%;}
.fraxel-ad .item p {margin-top:var(--size35); font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.5; color:#454545;}
.ad-txt {margin-top:var(--size60); font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.3; font-weight:600; color:#242424; text-align:center;}

/* 아쿠아필 */
.aqua-principle .items {display:flex; gap:var(--size30);}
.aqua-principle .item {flex:1; text-align:center;}
.aqua-principle .item .img {margin-bottom:var(--size40);}
.aqua-principle .item .tt {font-size:clamp(15px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.3; font-weight:600; color:#242424;}
.aqua-principle .item .tx {margin-top:0.5em;font-size:clamp(14px, calc(18/ var(--inner) * 100vw ),18px); line-height:1.4; color:#454545;}

/* 여드름 스케일링 */
.acne-scaling-principle .items {display:flex; flex-wrap:wrap; margin:0 calc(0px - var(--size15)) calc(0px - var(--size50));}
.acne-scaling-principle .item {width:33.333%; padding:0 var(--size15); margin-bottom:var(--size50);}
.acne-scaling-principle .item.wide {width:100%;}
.acne-scaling-principle .item .img {margin-bottom:var(--size40);}
.acne-scaling-principle .item .cnt {display:flex; justify-content:center;}
.acne-scaling-principle .item .cnt p {position:relative; padding-left:1.9em; font-size:clamp(14px, calc(22/ var(--inner) * 100vw ),22px); line-height:1.4; font-weight:600; letter-spacing:-0.04em; color:#242424;}
.acne-scaling-principle .item .cnt p .num {display:block; position:absolute; left:0; top:0; width:1.4em; height:1.4em; line-height:1.4em; background:var(--color-primary); border-radius:100vh; font-weight:600; color:#fff; text-align:center;}

.acne-scaling-principle .item.wide .cnt {gap:clamp(20px, calc(160/ var(--inner) * 100vw ),160px);}

/* 점잡티제거 */
.pigment-disease .items {display:flex;}
.pigment-disease .item {position:relative; flex:1; border:1px solid #ddd; margin-left:-1px;}
.pigment-disease .item:first-child {margin-left:0;}
.pigment-disease .in {height:100%; padding:var(--size60) 1em; text-align:center;}
.pigment-disease .item:nth-child(2n) .in {background:#f2f4f8;}
.pigment-disease .num {display:inline-block; margin-bottom:1.13em; padding:0.19em 1.3em; background:var(--color-primary); border-radius:100vh; font-weight:600; line-height:1; color:#fff;}
.pigment-disease .tit {font-size:clamp(15px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.3; font-weight:600; color:#242424;}
.pigment-disease .txt {margin-top:0.8em; line-height:1.5; color:#454545;}
.pigment-txt {margin-top:var(--size60); font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.3; font-weight:500; color:#242424; text-align:center;}

/* 아이스제모 */
.ice-hair-principle .items {display:flex; margin:0 calc(0px - var(--size15));}
.ice-hair-principle .item {width:25%; padding:0 var(--size15); text-align:center;}
.ice-hair-principle .item p {margin-top:1em; font-size:clamp(14px, calc(20/ var(--inner) * 100vw ),20px); line-height:1.3; font-weight:500; color:#242424;}

/* 올리지오 */
.oligio-features .items {display:flex; flex-wrap:wrap; margin:calc(0px - var(--size25));}
.oligio-features .item {width:50%; padding:var(--size25);}
.oligio-features .in {display:flex; align-items:center; gap:var(--size30);}
.oligio-features .cnt {flex:1 1 auto; min-width:0; width:1%;}
.oligio-features .cnt .tt {margin-bottom:0.3em; font-size:clamp(15px, calc(30/ var(--inner) * 100vw ),30px); line-height:1.3; font-weight:600; color:#242424;}
.oligio-features .cnt .tx {font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.3; color:#454545;}
.oligio-features .cnt .tx small {display:block; font-size:0.75em; line-height:1.3; font-weight:400; color:#6a6a6a;}

.content-table {position:relative; overflow:hidden; border-radius:0.6em;}
.content-table:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; border-radius:0.6em;}
.content-table table {text-align:center;}
.content-table th {padding:1em; background:var(--color-primary); font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; font-weight:600; color:#fff;}
.content-table td {border:1px solid #ddd; padding:1em; font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; color:#242424;}
.content-table td.bg {background:#f2f4f8; font-weight:700; color:#242424;}

/* 브이올렛 */
.violet-principle .item {margin-bottom:var(--size50); text-align:center;}
.violet-principle .item .image {position:relative; border-radius:5px; overflow:hidden;}
.violet-principle .item .image:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; border-radius:5px;}
.violet-principle .item .image h3 {padding:0.7em; background:var(--color-primary); font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.2; font-weight:700; color:#fff;}
.violet-principle .item p {margin-top:1.4em; font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; font-weight:500; color:#242424;}

/* 피부질환 */
.treatment-field .items {display:flex; flex-wrap:wrap; margin:0 calc(0px - var(--size25)) calc(0px - var(--size50));}
.treatment-field .item {width:50%; padding:0 var(--size25); margin-bottom:var(--size50);}
.treatment-field .item .img {margin-bottom:var(--size35);}
.treatment-field .item .tit {font-size:clamp(16px, calc(30/ var(--inner) * 100vw ),30px); line-height:1.3; font-weight:700; color:#242424;}
.treatment-field .item .txt {margin-top:0.6em; font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; color:#454545;}

.treat-promise {padding:clamp(20px, calc(85/ var(--inner) * 100vw ),85px) 20px; background:url('/images/sub/treat-promise.jpg') no-repeat 50% 50%/cover; border-radius:0.6em; text-align:center;}
.treat-promise h3 {position:relative; padding-bottom:var(--size35); margin-bottom:var(--size35); font-size:clamp(18px, calc(45/ var(--inner) * 100vw ),45px); line-height:1.3; font-weight:500; color:#fff;}
.treat-promise h3:before {content:''; position:absolute; left:50%; bottom:0; margin-left:-1em; width:2em; height:1px; background:#fff; opacity:0.4;}
.treat-promise h3:after {content:''; position:absolute; left:50%; bottom:-0.09em; margin-left:-0.09em; width:0.18em; height:0.18em; background:#fcce3d; border-radius:100vh;}
.treat-promise .txt {margin-bottom:0.75em; font-size:clamp(14px, calc(24/ var(--inner) * 100vw ),24px); line-height:1.4; color:#fff; opacity:0.8;}
.treat-promise .txt:last-child {margin-bottom:0;}