@charset "utf-8"; /* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap { width:100% !important; height:clamp(200px, calc( 460 / var(--inner) * 100vw ), 460px ) !important; } 
.root_daum_roughmap .wrap_map { width:100% !important; height:clamp(200px, calc( 460 / var(--inner) * 100vw ), 460px ) !important; border-bottom: 1px solid #ddd; } 
/* .roughmap_lebel_text { line-height:0 !important; font-size:0 !important; } 
.roughmap_maker_label { display: none !important; } */
.roughmap_lebel_text:after { content:""; font-size:12px; line-height:15px; } 

iframe { width:100% !important; height:clamp(200px, calc( 460 / var(--inner) * 100vw ), 460px ) !important; } 

.pt0 { padding-top:0 !important; } 
.pb0 { padding-bottom:0 !important; } 

.txt-primary { color: var(--color-primary) !important; } 
.txt-second { color: var(--color-secondary) !important; } 

.flex-wrap { display:flex; } 

/* 인사말 */
.greeting { display:flex; align-items: end; } 
.greeting .img { width:55%; } 
.greeting .txt-area { width:45%; padding-left:var(--space-40); } 
.greeting h2 { padding-bottom:clamp(22px, calc( 55 / var(--inner) * 100vw ), 55px ); font-weight:600; font-size: var(--font-size-32); color: var(--color-dark); } 
.greeting p { padding-bottom:1.3em; font-size: var(--font-size-20); line-height:1.8em; } 
.greeting p:last-child { padding-bottom:var(--space-25); } 
.greeting .sign { padding-top:var(--space-60); color: var(--color-dark); } 

/* 사업영역 */
.biz p { padding-bottom:var(--space-50); font-weight:500; font-size: var(--font-size-24); line-height: 1.5em; color: var(--color-dark); text-align:center; } 

/* 오시는 길 */
.directions .contact-list { background-color: #f8f8f8; text-align: center; } 
.directions .contact-list ul { display: flex; justify-content: center; align-items: center; margin-top:var(--space-40); padding:var(--space-50) 0; } 
.directions .contact-list ul li { position:relative; display: flex; flex-direction: column; align-items: center; padding:0 var(--space-50); } 
.directions .contact-list ul li::after { content: ""; position: absolute; right:0; top: 50%; transform: translateY(-50%); width:1px; height:var(--space-40); background-color: #ddd; } 
.directions .contact-list ul li:last-child::after { display:none; } 
.directions .contact-list ul li strong { display: block; font-size: var(--font-size-20); color: #878787; font-weight:500; line-height:1.8em; } 
.directions .contact-list ul li p { font-weight:600; font-size: var(--font-size-24); line-height:1.5em; font-family: "Poppins", sans-serif; font-weight: 600; color: #242424; } 
.directions .info-list { margin-top:var(--space-50); display:flex; align-items: center; justify-content: center; } 
.directions .info-list dl { display:flex; align-items: center; justify-content: center; padding:0 var(--space-50); } 
.directions .info-list dl dt { padding-right:clamp(20px, calc( 70 / var(--inner) * 100vw ), 70px ); font-weight:700; font-size: var(--font-size-24); line-height:1.5em; color: var(--color-dark); } 
.directions .info-list dl dd { font-size: var(--font-size-18); line-height:2em; } 

.directions.en .info-list dl { padding:0 var(--space-30); } 

/* 제품 */
.product-list2 ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-40); } 
.product-list2 ul li { padding:var(--space-30); border: 1px solid #ddd; transition: .3s; } 
.product-list2 ul li a { display:block; } 
.product-list2 ul li .thumb { position:relative; padding-bottom:75%; overflow:hidden; } 
.product-list2 ul li .thumb img { position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; } 
.product-list2 ul li .tit { position:relative; margin-top:var(--space-40); padding-bottom:64px; line-height:1em; color: var(--color-dark); font-weight:600; font-size: var(--font-size-24); } 
.product-list2 ul li .tit::after { content: ""; position: absolute; bottom:0; left:0; width:40px; height:40px; background: url(/images/bbs/btn-more.png) no-repeat center/contain; transition: .3s; } 
.product-list2 ul li:hover { border: 1px solid #45a9c9; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.2); } 
.product-list2 ul li:hover .tit::after { background-image: url(/images/bbs/btn-more-on.png); } 

/* 제품 상세 */
.product-view { margin-bottom:clamp(30px, calc( 90 / var(--inner) * 100vw ), 90px ) } 
.product-view .flex-wrap { align-items: center; } 
.product-view .flex-wrap > div { width:50%; } 
.product-view .flex-wrap .product-slide { position: relative; width: 100%; display: flex; align-items: center; } 
.product-slide .swiper-slide { cursor:pointer; border: 1px solid #ddd; } 
.product-slide .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } 
.productSwiper2 { width:50%; height:525px; max-width: 700px; margin: 0; } 
.productSwiper { width: 100%; height: 135px; } 
.productSwiper .swiper-free-mode > .swiper-wrapper { overflow: hidden !important; } 
.productSwiper .swiper-slide { width: 180px !important; height: 100%; opacity: 0.4; } 
.productSwiper .swiper-slide-thumb-active { opacity: 1; border: 3px solid #002060; } 
.product-info { width:50%; padding-left:clamp(16px, calc( 120 / var(--inner) * 100vw ), 120px ); } 
.product-info .tit { color:var(--color-dark); font-size:var(--font-size-44); line-height:1.363em; padding-bottom:var(--space-30); } 
.product-info .txt { padding-bottom:clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px ); color:#686868; } 
.product-detail { border-top:2px solid var(--color-dark); } 
.product-detail .flex-wrap { padding:var(--space-40) 0 var(--space-50); border-bottom:1px solid #ddd; } 
.product-detail .tit { width:27%; padding-left:var(--space-50); color:var(--color-dark); font-weight:600; font-size:var(--font-size-36); line-height:1.388em; } 
.product-detail .wrap ul >li { padding-bottom:var(--space-40); } 
.product-detail .wrap ul >li:last-child { padding-bottom:0; } 
.product-detail .wrap h4 { padding-bottom: var(--space-16); font-weight:600; font-size: var(--font-size-20); color: var(--color-dark); } 
.product-detail .wrap p { font-weight:500; font-size: var(--font-size-16); line-height:1.875em; } 
.product-detail .wrap ol li { font-size: var(--font-size-16); line-height:1.875em; } 

.dot-list > li { position:relative; padding-left:21px; padding-bottom:var(--space-16); } 
.dot-list > li:last-child { padding-bottom:0; } 
.dot-list > li:before { content:""; position:absolute; top:11px; left:0; width:6px; height:6px; background-color: #002060; } 

.buttons.custom .btn-more { margin:0 auto; } 

/* 시술개요 */
.product-view.type2 .img { border: 1px solid #ddd; } 

/* 시술방법 */
.step-list { width:100%; max-width: 1200px; margin:0 auto; } 
.step-list ol li { display:flex; justify-content: center; align-items: center; padding:var(--space-30); border-radius: 8px; border: 1px solid rgb(0, 113, 186); } 
.step-list ol li:first-child { position:relative; margin-bottom:40px; } 
.step-list ol li:first-child::after { content: ""; position: absolute; left:50%; bottom: -25px; transform: translateX(-50%); width:16px; height:10px; background: url(/images/sub/arrow-btm.png) no-repeat center/contain; } 
.step-list ol li strong { color: var(--color-primary); display:inline-block; padding-right:25px; } 
.step-list ol li p { color: #242424; } 
.step-list .required { font-size: var(--font-size-16); text-align:center; } 
.step-list .required strong { display:block; padding-top:20px; font-weight:600; color: var(--color-dark); } 

.procedure-wrap { display:flex; align-items: center; padding-top:var(--header-height); } 
.procedure-wrap .video { width:59%; } 
/* .procedure-wrap .video img { border-radius:clamp(var(--14px), calc( 24 / var(--inner) * 100vw ), var(--24px)); } */ 
.procedure-wrap .video video { width:100%; border-radius:clamp(var(--14px), calc( 24 / var(--inner) * 100vw ), var(--24px)); } 
.procedure-wrap .info { width:41%; padding:var(--space-20) 0 var(--space-20) clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px ); } 
.procedure-wrap .info h2 { padding-bottom:var(--space-16); font-size: var(--font-size-24); color: var(--color-dark); } 
.procedure-wrap .info ol li { padding-bottom:10px; font-size: var(--font-size-16); line-height:1.75em; } 
.procedure-wrap .info ol li:last-child { padding-bottom:0; } 

.num-list { padding-bottom:var(--space-40); } 
.num-list li { padding-left: 14px; text-indent: -14px; } 

/* 문의사항 */
.inquiry-wrap { background-color: #f8f8f8; padding:var(--space-50) 0 var(--space-80); } 
.inquiry-form .ico-required { display:inline-block; vertical-align:middle; margin:-.3em 0 0 0; width:16px; height:14px; background:url("../images/sub/inquiry_required.svg") 0 50% no-repeat; background-size:contain; } 
.inquiry-form .group { margin-bottom:55px; } 
.inquiry-form .group:last-child { margin-bottom: 0; } 
.inquiry-form .form { font-size:var(--font-size-16); line-height: 1.75em; } 
.inquiry-form .form .row { display:flex; flex-wrap:wrap; gap: 20px; } 
.inquiry-form .form .col { width: calc(50% - 10px); padding: 13px 20px; background: #fff; border-radius: 5px; } 
.inquiry-form .form .col.w60 { width:60%; } 
.inquiry-form .form .col.col-x2 { width:100%; } 
.inquiry-form .form dl { display:flex; align-items: center; } 
.inquiry-form .form dt { font-weight:500; padding-right: var(--space-37); } 
.inquiry-form .form dd { flex: 1 auto; min-width:0; width:1%; } 
.inquiry-form .form .contents dd { width:100%; min-width:100%; padding-top: 5px; } 
.inquiry-form .form .input { display:block; width:100%; height:34px; padding: 0; font-size:var(--font-size-16); line-height: 1.75em; border: 0; } 
.inquiry-form .form select.input { padding-right:30px; background-size:10px auto; background-position:right 10px center; } 
.inquiry-form .form textarea.input { height:180px; } 
.inquiry-form .submit-area { display:flex; justify-content:space-between; align-items:center; margin-top:clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px ); } 
.inquiry-form .form-agree { margin:0; } 
.inquiry-form .form-agree .check { text-align:left; } 
.inquiry-form .btn-pack.dark { background:#000; border-color:#000; } 
.inquiry-form .checkbox label:before { background-color: #fff; } 

.submit .btn-more { margin-top:0; cursor:pointer; }

.procedure-video-wrap .video {width: 100%; aspect-ratio: 16/9;}
.procedure-video-wrap .video video {width: 100%; height: 100%; object-fit: cover;}