@charset "utf-8";
.space-top {padding-top: var(--space-150);}
.space-bottom {padding-bottom: var(--space-150);}
.sec-tit {line-height: 1.7778em;}
.sec-tit .tag {margin-bottom: var(--space-15); font-size: var(--font-size-16); line-height: 1.3em; color: var(--primary-color); letter-spacing: .3em; font-family: 'NanumMyeongjo';}
.sec-tit h2 {font-size: var(--font-size-40); line-height: 1.4em; color: var(--dark-color);  font-family: 'NanumMyeongjo';}
.dot-list li {text-indent: -.5em; padding-left: .5em;}
.dot-list li:before {content:'·'; margin-right: 5px;}

#greetings {position: relative;}
#greetings:before {content:''; z-index: -1; position: absolute; left: 0; bottom: 0; right: 0; height: 75%; background: #f4f4f4;}
#greetings .contain {max-width: calc(50% + 700px); padding-left: 0; margin-left: 0; gap: 25px var(--space-80);}
.greeting-txt {width: 37.31%; padding-top: var(--space-80);}
.greeting-txt h2 {margin-bottom: clamp(40px, calc(112 / var(--inner) * 100vw), 112px);}
.greeting-img {position: relative; height: fit-content; padding-right: var(--space-60); padding-bottom: var(--space-60); text-align: right;}
.greeting-img:before {content: ''; z-index: -1; position: absolute; left: 0; bottom: 0; right: 0; height: calc(100% - var(--space-60)); background: var(--primary-color);}

.one-page .section:first-child {padding-top: var(--space-150); margin-top: calc(var(--space-150) * -1);}
.doctor-head-gallery {gap: 20px; padding-bottom: var(--space-150); margin-bottom: var(--space-150); border-bottom: 1px solid var(--dark-color);}
.doctor-introduction-item {display: flex; gap: 20px var(--space-80);}
.doctor-introduction-item:not(:last-child) {margin-bottom: var(--space-80);}
.doctor-img {width: 47.1429%;}
.doctor-profile {flex: 1; padding-top: var(--space-20);}
.doctor-profile .wrap {position: relative; padding-bottom: var(--space-30); margin-bottom: var(--space-40); border-bottom: 1px solid #D9D9D9;}
.doctor-profile .wrap:before {content: ''; position: absolute; left: 0; bottom: -1px; width: 94px; height: 2px; background: var(--primary-color);}
.doctor-tag {width: fit-content; margin-bottom: var(--space-20); padding: 5px 10px; background: var(--primary-color); color: #fff; font-size: var(--font-size-16); line-height: 1em; font-weight: 700;}
.doctor-name {font-size: var(--font-size-32); font-weight: 700; line-height: 1.2em; font-weight: 400;}
.doctor-name strong {margin-right: 10px; color: var(--dark-color);}
.doctor-profile ul {display: flex; flex-wrap: wrap; gap:var(--space-15) 10px;}
.doctor-profile li {flex: 1 1 auto; width: calc(50% - 5px); min-width: max-content; font-size: var(--font-size-16); line-height: 1.2em;}

#view {background: #f4f4f4; overflow: hidden;}
.interior-items {position: relative; width: fit-content; max-width: 100%; margin: 0 auto;}
.interior-items .swiper {max-width: calc(900px + clamp(40px, calc(88 / var(--inner) * 100vw), 88px) * 2); width: 100%; overflow: visible;}
.interior-item {padding: 0 clamp(40px, calc(88 / var(--inner) * 100vw), 88px);}
.interior-items .swiper-pagination {position: relative; width: calc(100% - clamp(40px, calc(88 / var(--inner) * 100vw), 88px) * 2); height: 2px; margin-top: var(--space-60); margin-left: clamp(40px, calc(88 / var(--inner) * 100vw), 88px); background: #ccc;}
.interior-items .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: var(--primary-color);}
.interior-arrow {z-index:4; right: 0; display: flex; align-items: center; justify-content: center; width: clamp(40px, calc(56 / var(--inner) * 100vw), 56px); height: clamp(40px, calc(56 / var(--inner) * 100vw), 56px); border-radius: 100%; background: #fff; border: 1px solid #ddd; transform: translate(50%, -50%); transition: .2s;}
.interior-arrow.swiper-button-prev {right: auto; left: 0; transform: translate(-50%, -50%);}
.interior-arrow:after {font-size: 20px; font-weight: 700; color: #505050;}
.interior-arrow:hover:after {color: var(--primary-color)}

#doctor {overflow: hidden;}
.doctor-special-items {max-width: 1220px;}
.doctor-special-items .slick-list {overflow: visible; margin: 0 -10px;}
.doctor-special-items .slick-slide {padding: 0 10px;}

#program {background: #f4f4f4; overflow: hidden;}
.pain-reduce-programs {display: flex; gap: 0 var(--space-40);}
.pain-reduce-program .txt {margin-top: var(--space-20);}
.pain-reduce-program h3 {padding: 15px; margin-bottom: var(--space-20); background: #7FDCDA; color: #fff; font-size: var(--font-size-18); line-height: 1em; text-align: center;}
.pain-reduce-program:nth-child(2) h3 {background: #22C3BF;}
.pain-reduce-program:nth-child(3) h3 {background: #008F8C;}
.pain-reduce-program .wrap {margin-top: var(--space-20);}
.small-list h4 {width: fit-content; padding: 10px 20px; margin-bottom: 10px; background: var(--secondary-color); color: #fff; font-size: var(--font-size-16); line-height: 1em;}
.small-list li {font-size: var(--font-size-14); line-height: 1.4286em;}
.small-list li:not(:last-child) {margin-bottom: 6px;}
.pain-reduce-program {position: relative;}
.type2 .pain-reduce-program h4 {position: absolute; left: 0; bottom: 0; background: var(--primary-color); padding: 5px 20px; margin-bottom: 0; color: #fff;} 

#management {background: url('/images/sub/bg-management.jpg') no-repeat center center / cover;}
#management .contain {gap: 20px 35px;}
#management .txt {max-width: 50%;}
#management .img {width: 39.2857%;}
.help-txt {margin-top: 20px; text-align: right; color: var(--gray-color); font-weight: 600; font-size: var(--font-size-14); line-height: 1.57143em;}
.help-txt span {color: #E32323;}

.implant-banner {padding:clamp(60px, calc(305 / var(--inner) * 100vw), 305px) var(--space-60) var(--space-60); background: url('/images/sub/bg-implant-banner.jpg') no-repeat center center / cover;}

#simulation {position: relative; background: #f4f4f4;}
#simulation .txt {max-width: 50%;}
.simulation-img {position: absolute; right: 0; top: 0; bottom: 0; width: 50%;}
.simulation-img img {width: 100%; height: 100%; object-fit: cover;}

#center .txt {width: 50%;}
.center-cnt {gap: 0 35px;}

.page-direction {gap: 25px 35px;}
.page-direction .txt {padding: 20px 0; gap: var(--space-60);}
.page-direction li {display: flex;}
.page-direction li:not(:last-child) {margin-bottom: 10px;}
.page-direction li strong {min-width: 108px; font-weight: 600; color: var(--dark-color);}
.direction-map {width: 50%;}
.page-direction .btn-pack {width: fit-content; border: 1px solid var(--dark-color); color: var(--dark-color); background: #fff;}

.welcome-txt .desc {width: 50%;}
.sec-gum-specialist, .page-sleep .sec-ability.sec-bls {background: url('/images/sub/bg-gum-specialist.jpg') no-repeat center center / cover;}
.gum-specialist-logos {display: flex; justify-content: center; gap: 20px clamp(10px, calc(27 / var(--inner) * 100vw), 27px);}

.flex-item {display: flex; gap: 20px var(--space-80);}
.flex-item:not(:last-child) {margin-bottom: var(--space-80);}
.flex-item .flex-txt {display: flex; flex-direction: column; justify-content: center; flex: 1;}
.flex-item .flex-img {width: 47.1429%;}
.flex-item .num {margin-bottom: var(--space-15); color: var(--dark-color); font-weight: 700; text-decoration: underline; text-underline-offset: 3px;}
.flex-item h3 {font-size: var(--font-size-24); line-height: 1.3333em; font-weight: 400; color: var(--dark-color);}
.flex-item .txt {margin-top: var(--space-30); font-size: var(--font-size-16); line-height: 1.625em;}

.page-gum .flex-txt {background: url('/images/sub/gum-professional-bg.jpg') no-repeat right top;}
.page-gum .sec-txt {background: url('/images/sub/bg-gum-txt.jpg') no-repeat center center / cover;}
.page-gum .sec-txt h2 {opacity: .7;}

.sec-ability, .sec-icdas-steps {background: #f4f4f4;}
.sec-ability .contain {display: flex; justify-content: space-between; gap: 20px 35px;}
.ability-txt {max-width:47%; display: flex; flex-direction: column; justify-content: center;}
.ability-img {width: 46.4287%;}
.type2 .ability-img {width: 39.286%;}

.case-item {display: flex; gap: 20px 35px;}
.case-item:not(:last-child) {margin-bottom: clamp(40px, calc(60 / var(--inner) * 100vw), 60px);}
.case-img {flex: 1;}
.case-txt {width: 50%; display: flex; flex-direction: column; justify-content: center; font-weight: 700; color: var(--dark-color);}
.case-txt .num {margin-bottom: var(--space-15); font-size: var(--font-size-20); line-height: 1em; color: var(--primary-color);}
.case-txt h3 {font-size: var(--font-size-32); line-height: 1.2em;}
.case-txt p {margin-top: var(--space-30);}
.type2 .case-txt p {font-weight: 400; color: #505050;}

.sec-procedure {background: url('/images/sub/bg-highall-procedure.jpg') no-repeat center center / cover;}
.procedure-item {display: flex; gap: 10px var(--space-40); padding: var(--space-30); background: rgba(255, 255, 255, 0.20);}
.procedure-item:not(:last-child) {margin-bottom: 10px;}
.procedure-item .step {display: flex; align-items: center; justify-content: center; width: 80px; height: 30px; border-radius: 30px; background: var(--primary-color); color: #fff; font-size: var(--font-size-14); line-height: 1em;}
.procedure-item h3 {font-size: var(--font-size-22); line-height: 1.2em; margin-bottom: clamp(5px, calc(10 / var(--inner) * 100vw), 10px);}

.sec-types, .sec-column-boxes, .sec-hesitation, .sec-laminate, .sec-tmj-exam, .sec-tmd-program {background: #f4f4f4;}
.type-items {display: flex; flex-wrap: wrap; gap: var(--space-40) 0;}
.type-item {width: 50%; display: flex; align-items: center; gap: 12px var(--space-30); padding-right: 20px;}
.type-icon {display: flex; align-items: center; justify-content: center; width: clamp(60px, calc(180 / var(--inner) * 100vw), 180px); height: clamp(60px, calc(180 / var(--inner) * 100vw), 180px); border-radius: 100%; background: #fff;}
.type-txt {flex: 1;}
.type-txt h3 {font-size: var(--font-size-20); line-height: 1.2em; margin-bottom: var(--space-15); color: var(--primary-color);}
.prepare-boxes {display: flex; flex-wrap: wrap; gap: var(--space-40);}
.prepare-box {width: calc((100% - var(--space-40) * 2) / 3); padding:var(--space-20) var(--space-30); border: 1px solid #ddd; color: var(--dark-color); font-weight: 600;}
.prepare-box p {display: flex; align-items: center; gap: 10px}
.prepare-box p:before {content: ''; display: inline-block; width: 24px; height: 24px; background: url('/images/sub/icon-prepare-chk.png') no-repeat center center / contain;}

.column-box {padding:var(--space-40) 20px; background: #fff;}
.column-box:not(:last-child) {margin-bottom: var(--space-20);}
.column-box h3 {margin-bottom: clamp(5px, calc(10 / var(--inner) * 100vw), 10px);}

.compare-items {display: flex; gap: 40px var(--space-40);}
.compare-item h3 {margin-bottom: 20px;}
.compare-item li:not(:last-child) {margin-bottom: var(--space-20);}
.compare-item li strong {display: block; margin-bottom: 5px; color: var(--dark-color);}
.compare-item li div {font-size: var(--font-size-16); line-height: 1.625em;}

.idcdas-steps-items, .imgs {display: flex; gap: 20px;}
.underline-items, .hesitation-items, .chk-boxes {gap: 30px var(--space-40);}
.underline-item {padding-bottom: var(--space-40); border-bottom: 2px solid var(--dark-color)}

.sec-laminate .contain {gap: 25px var(--space-100);}
.laminate-img {width: 46.429%;}
.specific-table table {width: 100%; border-collapse: collapse; font-size: var(--font-size-16); line-height: 1.625em; border-top: 2px solid var(--primary-color)}
.specific-table th {color: var(--dark-color); text-align: center; border-right: 1px solid #ddd;}
.specific-table th, .specific-table td {padding: 12px 20px; border-bottom: 1px solid #ddd; background: #fff;}

.page-specialty-beauty .sec-txt {background: url('/images/sub/bg-beauty-txt.jpg') no-repeat center center / cover;}
.chk-boxes.type2 {flex-wrap: wrap;}
.chk-boxes.type2 .chk-box {flex: 1 1 auto; min-width: calc((100% - var(--space-40)) / 2);}
.chk-box {padding: var(--space-40); border: 1px solid #ddd; background: #fff;}
.chk-box h4:before {content:''; display: block; width: 100%; height: 24px; margin-bottom: var(--space-10); background: url('/images/sub/icon-prepare-chk.png') no-repeat center center / contain;}