@charset "UTF-8"; /* common */
.container { position: relative; width: 85%; height: 100%; max-width: calc(var(--container-width) * 1px); margin: 0 auto; } 
section { position: relative; text-align: center; overflow: hidden; } 
.row, .inner-row { display: flex; flex-direction: column; } 
.line-d1 { position: relative; top: clamp(30px, 3vw, 45px); margin-bottom: clamp(25px, 3vw, 40px); font-size: var(--font-64); width: 100%; text-align: center; } 
.line-d1:before, .line-d1:after { position: absolute; top: -18%; content: ''; display: block; width: 43%; height: 5px; border: none; background-image: radial-gradient(circle, #fff 1px, transparent 1px); background-size: 5px 5px; } 
.line-d1.black:before, .line-d1.black:after { background-image: radial-gradient(circle, #000 1.1px, transparent 1px); } 
.line-d1:before { left: 0; } 
.line-d1:after { right: 0; } 
.inner-mini-header { align-items: center; justify-content: space-between; margin-inline: 2vw; padding: 3vw 2vw 2vw 2vw; border-bottom: 1px solid; } 
.inner-mini-header .mini-logo { background: url(../images/common/header-logo.png) no-repeat center/cover; --w:65; --h:42; filter: brightness(0) invert(1); min-width: 35px; min-height: 23px; } 
.flower-ico { font-size: var(--font-68); } 
.bg.wall-paper { background: url(../images/common/bg.jpg) no-repeat center/cover; position: absolute; inset: 0; height: 100%; width: 100%; z-index: -1; } 
.renewal-page-only { display: flex !important; } 

/* ==================================================
header - pc
================================================== */
 .pc-header nav li.has-sub { position: relative; } 
 .pc-header nav li.has-sub > .sub-menu { position: absolute; top: 100%; left: 50%; z-index: 100; display: block; width: max-content; min-width: 0; max-width: none; height: auto; margin: 12px 0 0; padding: 10px 0; gap: 0; background-color: #3a281f; border-radius: 12px; text-align: center; opacity: 0; visibility: hidden; transform: translate(-50%, 8px); transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s; } 
 .pc-header .sub-menu:before { content: ''; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* li → 서브메뉴 사이 hover 유지용 */
 .pc-header nav li.has-sub.is-open > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); } 
 .pc-header .sub-menu li { display: block; width: auto; margin: 0; padding: 0; } 
 .pc-header .sub-menu a { display: block; width: auto; margin: 0; padding: 7px 22px; color: #fff; font-size: clamp(13px, 0.9vw, 16px); font-weight: 300; line-height: 1.4; white-space: nowrap; transition: color 0.2s, background-color 0.2s; } 
 .pc-header .sub-menu a:hover { color: #f3c6c6; background-color: rgba(255, 255, 255, 0.08); } 

/* ==================================================
header - mo (sidebar)
================================================== */
 .mo-header nav > ul { max-height: calc(100vh - calc(130vw / var(--mainWidth))); max-height: calc(100dvh - calc(130vw / var(--mainWidth))); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding-bottom: 40px; box-sizing: border-box; } /* 하위 메뉴가 길어져도 이 목록 안에서 스크롤 (모바일 주소창 때문에 dvh 사용) */ 
 .mo-header li.has-sub > a:after { content: ''; position: absolute; right: calc(40vw / var(--mainWidth)); top: 50%; width: 8px; height: 8px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: translateY(-70%) rotate(45deg); transition: transform 0.3s ease; } 
 .mo-header li.has-sub.open > a:after { transform: translateY(-30%) rotate(-135deg); } 
 .mo-header .sub-menu { width: 85%; margin: 0 auto; max-height: 0; overflow: hidden; background-color: rgba(0, 0, 0, 0.15); transition: max-height 0.4s cubic-bezier(0.65, 0, 0.35, 1); } 
 .mo-header li.has-sub.open > .sub-menu { max-height: 100vh; } 
 .mo-header .sub-menu a { width: 100%; padding: calc(40vw / var(--mainWidth)) calc(50vw / var(--mainWidth)) calc(40vw / var(--mainWidth)) calc(105vw / var(--mainWidth)); font-size: var(--font-32, 14px); border-bottom: none; opacity: 0.85; word-break: auto-phrase; } 
 .mo-header .sub-menu a:before { display: none; } 

.mo-header-btn { position: absolute; top: 15%; left: calc(-85vw / var(--mainWidth)); width: calc(85vw / var(--mainWidth)); height: calc(190vw / var(--mainWidth)); border-top-left-radius: 15px; border-bottom-left-radius: 15px; background-color: #3a281f; cursor: pointer; transition: left 0.5s cubic-bezier(0.65, 0, 0.35, 1); } 
.mo-header-btn:after { position: absolute; content: ''; display: block; color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%) scaleX(-1); font-size: var(--font-68); width: calc(23vw / var(--mainWidth)); height: calc(42vw / var(--mainWidth)); background: url('../images/common/ico-sidebar-arrow.png') no-repeat center/contain; transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1); } 
/* 사이드바 스크롤 잠금은 main.js 가 lenis.stop() + touchmove 차단으로 처리한다.
 html/body 의 overflow·position 은 건드리지 않는다 (바꾸면 스크롤 위치가 0 으로 리셋되고 이미지가 사라진다). */
.mo-header.container { position: fixed; right: -70%; top: 0; width: 70%; height: 100vh; height: 100dvh; background-color: #3a281f; padding-top: calc(130vw / var(--mainWidth)); z-index: 99; transition: right 0.5s cubic-bezier(0.65, 0, 0.35, 1); } 
.mo-header.active { right: 0%; } 
.mo-header.active .mo-header-btn { left: calc(-85vw / var(--mainWidth)) } 
.mo-header.active .mo-header-btn:after { transform: translate(-50%, -50%); } 
.mo-header nav a { position: relative; display: block; width: 85%; color: #fff; font-size: var(--font-50); font-weight: 300; border-bottom: 1px solid rgba(255,255,255,0.8); padding: calc(60vw / var(--mainWidth)) 0 calc(60vw / var(--mainWidth)) calc(105vw / var(--mainWidth)); margin: 0 auto; } 
.mo-header nav li:last-child a { border-bottom: none; } 
.mo-header nav a:before { position: absolute; content: ''; left: calc(38vw / var(--mainWidth)); top: 50%; transform: translateY(-50%); display: block; background: url(../images/common/flower-ico.png) no-repeat center/contain; width: min(calc(var(--w) * 1px), calc(var(--fluid) * var(--w))); height: min(calc(var(--h) * 1px), calc(var(--fluid) * var(--h))); --w: 40; --h: 40; display: none; } 
.mo-header nav a:hover:before { animation: mo-nav-icon-spin 1.2s linear infinite; } 
@keyframes mo-nav-icon-spin { 
 from { transform: translateY(-50%) rotate(0deg); } 
 to { transform: translateY(-50%) rotate(360deg); } 
 }
.sns-box { position: fixed; right: 5%; bottom: 4%; bottom: calc(3dvh + env(safe-area-inset-bottom)); gap: 10px; z-index: 99; transition: opacity 0.3s, visibility 0.3s; } 
.sns-box li { display: flex; flex-direction: column; align-items: center; gap: 3px; } 
.sns-box li>span { color: #fff; font-size: var(--font-14); font-weight: 300; letter-spacing: 0.1px; transition: color 0.3s; } 
header.is-light { border-bottom-color: #45332B; } 
header.is-light .sns-box li>span { color: #45332B; } 

/* 모바일 사이드메뉴(.mo-header) 열리면 sns 아이콘 숨기고, 닫히면 다시 보이게 (main.js 가 html 에 mo-header-open 클래스를 토글) */
html.mo-header-open .sns-box { opacity: 0; visibility: hidden; pointer-events: none; } 
.sns-box a { position: relative; display: grid; place-content: center; width: calc(90vw / var(--mainWidth)); height: auto; aspect-ratio: 1; background-color: rgba(111, 81, 65, 0.5); border-radius: 50%; background-size: 45%; background-position: center; background-repeat: no-repeat; transition: background-color 0.3s; } 
.sns-box a.naver { background-image: url(../images/common/ico-naver.png); background-size: 40%; } 
.sns-box a.kakao { background-image: url(../images/common/ico-kakao.png); } 
.sns-box a.insta { background-image: url(../images/common/ico-insta.png); background-size: 40%; } 
.sns-box a.blog { background-image: url(../images/common/ico-blog.png); } 
.sns-box a.wechat { background-image: url(../images/common/ico-wechat.png); background-size: 55%; } 
.sns-box a.line { background-image: url(../images/common/ico-line.png); } 
.sns-box a.whatsapp { background-image: url(../images/common/ico-whatsapp.png); } 

/* 호버(모바일은 탭=qr-open) 시 각 브랜드 메인컬러로 배경색 변경 */
.sns-box a.naver:hover { background-color: #1EC800; } 
.sns-box a.kakao:hover { background-color: #e7de00; } 
.sns-box a.insta { position: relative; } 
.sns-box a.insta:before { content: ''; position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); opacity: 0; transition: opacity 0.3s; } 
.sns-box a.insta:hover:before { opacity: 1; } 
.sns-box a.insta:after { content: ''; position: absolute; inset: 0; background: url(../images/common/ico-insta.png) no-repeat center / 40%; } 
.sns-box a.blog:hover { background-color: #1EC800; } 
.sns-box a.wechat:hover, .sns-box a.wechat.qr-open { background-color: #2AAE67; } 
.sns-box a.line:hover, .sns-box a.line.qr-open { background-color: #07B53B; } 
.sns-box a.whatsapp:hover, .sns-box a.whatsapp.qr-open { background-color: #25D366; } 

/* sns QR 호버 박스: 오른쪽에서 왼쪽으로 슬라이드 등장 (PC 호버 / 모바일 탭) */
.sns-box .qr-box { position: absolute; top: 50%; right: calc(100% + 12px); width: 200px; height: 200px; background: #fff no-repeat center / contain; border-radius: 10px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); opacity: 0; visibility: hidden; pointer-events: none; transform: translate(40px, -50%); transition: opacity 0.35s ease, transform 0.35s ease, visibility 0.35s; z-index: 50; } 
.sns-box a.wechat .qr-box { background-image: url(../images/common/qr-wechat.png?ver=1); } 
.sns-box a.line .qr-box { background-image: url(../images/common/qr-line.png?ver=1); } 
.sns-box a.whatsapp .qr-box { background-image: url(../images/common/qr-whatsapp.png?ver=1); } 
.sns-box a.wechat:hover .qr-box, .sns-box a.line:hover .qr-box, .sns-box a.whatsapp:hover .qr-box, .sns-box a.sns-qr.qr-open .qr-box { opacity: 1; visibility: visible; transform: translate(0, -50%); } 

@media screen and (max-width: 1100px){
 .sns-box .qr-box { width: 150px; height: 150px; } 
 .sns-box a.line .qr-box { top: 0px; } 
 .sns-box a.whatsapp .qr-box { top: -30px; } 
 }

/* ==================================================
language (google translate)
================================================== */
.flag { display: block; flex: none; width: 30px; height: 24px; margin:0; opacity: 0.8; transition: opacity 0.2s; } /* 4:3 */
.trans-menu { list-style: none; display: flex; align-items: center; gap: 16px; } 
.trans-menu li { display: block; width: auto; } 
.trans-menu a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; margin: 0 !important; } 
.trans-menu a.active .flag { opacity: 1; } 
.trans-menu a:after { position: absolute; top: 112%; content: ''; width: 4px; height: 4px; border-radius: 50%; background-color: transparent; transition: background-color 0.3s; } 
.trans-menu a.active:after { background-color: #fff7ef; } 
header.is-light .trans-menu a.active:after { background-color: #45332B; } 

 .pc-header nav li.trans { align-self: center; margin-left: clamp(40px, 4.2vw, 80px); } 
.flower-ico font { color: inherit !important; } 
 html body header .pc-header.pc-header .sub-menu.sub-menu li a, html body header .pc-header.pc-header .sub-menu.sub-menu li a *, html body header .mo-header.mo-header .sub-menu.sub-menu li a, html body header .mo-header.mo-header .sub-menu.sub-menu li a * { color: #fff !important; -webkit-text-fill-color: #fff !important; opacity: 1 !important; text-shadow: none !important; } 
 html body header .pc-header.pc-header .sub-menu.sub-menu li a:hover, html body header .pc-header.pc-header .sub-menu.sub-menu li a:hover *, html body header .mo-header.mo-header .sub-menu.sub-menu li a:hover, html body header .mo-header.mo-header .sub-menu.sub-menu li a:hover * { color: #f3c6c6 !important; -webkit-text-fill-color: #f3c6c6 !important; } 

 .mo-header .trans-menu { width: 85%; margin: 0 auto; gap: 0; } 

/* 번역 후 글자가 길어지면 PC nav 를 grab 으로 잡아끌어 이동 (번역 중에만 적용) */
html[class*="translated-"] .pc-header nav { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; cursor: grab; user-select: none; -webkit-user-select: none; } 
html[class*="translated-"] .pc-header nav::-webkit-scrollbar { display: none; } 
html[class*="translated-"] .pc-header nav.dragging { cursor: grabbing; } 
html[class*="translated-"] .pc-header nav > ul { width: max-content; min-width: 100%; flex-wrap: nowrap; } 
html[class*="translated-"] .pc-header nav > ul > li { flex: none; width: auto !important; padding-inline: clamp(14px, 1.6vw, 28px); white-space: nowrap; } 
html[class*="translated-"] .pc-header nav li > .sub-menu { position: fixed; left: var(--fx-left, 50%) !important; top: var(--fx-top, 100%) !important; } 
html[class*="translated-"] .pc-header nav a { cursor: inherit; } 
html[class*="translated-"] .pc-header a:not(:has(div)) { margin-left: 0; } 
html[class*="translated-"] .pc-header nav li.trans { margin-left: 0; } 

/* 영어 */
html.lang-en #section-8 .sec8__slider-bottom { font-size: var(--font-26); } 

html[class*="translated-"] #section-4 .point-slide { padding-inline: 0.5vw; } 
html[class*="translated-"] #section-11 .sec11__bottom [data-has-desc] .inner-row,
html[class*="translated-"] #section-11 .sec11__bottom .row-3,
html[class*="translated-"] #section-11 .sec11__bottom .row-4 { flex-wrap: wrap; gap: 5px 30px; } 
html[class*="translated-"] #section-11 .sec11__bottom .day { white-space: nowrap; width: auto; letter-spacing: -4px; } 
html.lang-en #section-11 .sec11__bottom .day { letter-spacing: -1.5px; } 
html[class*="translated-"] #section-11 .sec11__bottom .time { letter-spacing: 1px; white-space: nowrap; } 
html[class*="translated-"] #section-11 .sec11__bottom .time:before { left: -25px; } 
html[class*="translated-"] #section-11 .sec11__bottom .tel a { justify-content: center; } 
html[class*="translated-"] #section-11 .sec11__bottom .tel a span:last-child { width: auto; } 
html[class*="translated-"] #section-7 .sec7__top p.font-68 br { display: none; } 
html[class*="translated-"] #section-7 .sec7__top p.font-68 > font > font { display: block; } 
html[class*="translated-"] [data-font="Aurora"] * { font-family: 'Aurora', serif; } 
html[class*="translated-"] .info .inner-row, html[class*="translated-"] .info> .row { align-items: center !important; justify-content: center !important; } 

/* nav 드래그 힌트: JS 가 nav 가 실제로 넘칠 때만 .show 를 붙인다 (PC 전용) */
.nav-hint { position: fixed; z-index: 98; display: none; align-items: center; justify-content: center; width: 26px; height: 26px; margin-top: -13px; padding: 0; border: 0; border-radius: 50%; background: rgba(58, 40, 31, 0.92); cursor: pointer; opacity: 0; transition: opacity 0.3s, background-color 0.2s; } 
.nav-hint:hover { background: #3a281f; } 
.nav-hint:before { content: ''; width: 7px; height: 7px; border-top: 2px solid #fff; border-right: 2px solid #fff; } 
.nav-hint-r:before { transform: translateX(-1px) rotate(45deg); } 
.nav-hint-l:before { transform: translateX(1px) rotate(-135deg); } 
@media (min-width: 1101px){
 .nav-hint.show { display: flex; opacity: 1; } 
 }
html[class*="translated-"] .pc-header nav > ul > li { transition: opacity 0.25s; } 

/* 번역문(<font>) 줄바꿈 */
font { word-break: normal; overflow-wrap: break-word; line-break: auto; } 
.line-d1[data-font="Aurora"] *,html[class*="translated-"] .tel a span * { font-family: 'Aurora', serif; } 
html.lang-zh-cn font { font-family: 'Noto Sans SC', sans-serif; } 
html.lang-zh-tw font { font-family: 'Noto Sans TC', sans-serif; } 
html[class*="translated-"] [data-font="Bethany Elingston"] *, html[class*="translated-"] #section-10 .sec10__bottom_text .right * { font-family: 'Bethany Elingston'; } 
html[class*="translated-"] [data-font="TTSoomyungjol"] * { font-family: 'TTSoomyungjol'; } 
html.lang-en #section-3 .sec3__bottom .doctor-name,
html.lang-en #section-3 .sec3__bottom .doctor-name * { letter-spacing: -1px; } 

/* 구글 번역 기본 UI 숨김 */
.goog-te-banner-frame, iframe.skiptranslate, #goog-gt-tt, .goog-te-balloon-frame { display: none !important; } 
body { top: 0 !important; } /* 구글 번역 상단 배너가 body 를 밀어내지 않게 */
.goog-text-highlight { background: none !important; box-shadow: none !important; } 


/* ==================================================
footer
================================================== */

/* footer Style */
#footer { background-color: #faf7ec; display: flex; flex-direction: column; justify-content: center; height: calc(180vw/var(--basicWidth)); position: relative; z-index: 5; } 
#footer ul { width: fit-content; margin: 0.52vw auto 0; } 
#footer ul li { font-weight: 300; font-size: calc(14vw/var(--basicWidth)); display: inline-block; position: relative; line-height: 1; letter-spacing: 0.03vw; color: #978878; margin-right: calc(8vw/var(--basicWidth)); } 
#footer ul:first-child li::before { content: ''; position: absolute; top: 0; right: calc(-6vw/var(--basicWidth)); width: 1px; height: 100%; background-color: #978878; } 
#footer ul:first-child li:last-child::before { content: none; } 
#footer ul:last-child li { display: block; text-align: center; margin-bottom: 0.5vw; } 

@media screen and (max-width: 1100px){
 #footer { padding-top: calc(20vw/var(--basicWidth)); } 
 #footer ul li { font-size: calc(24vw/var(--basicWidth)); } 
 }


/* ==================================================
intro
================================================== */
html.intro-open { overflow: hidden; } 
html.intro-open body { position: fixed; left: 0; width: 100%; overflow: hidden; } 
#intro { position: fixed; top: 0; left: 0; display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.8); z-index: 999; overflow: hidden; } 
#intro *, #section-1 * { color: var(--white-color); text-align: center; } 
#intro .bg { position: absolute; background-color: rgba(0,0,0,0.1); width: 100%; height: 100%; z-index: -1; } 
.intro__top { max-width: 90%; margin: 0 auto; } 
.intro__top .logo { margin: 0 auto clamp(30px, 5vw, 75px); background: url(../images/intro/mini-logo-pink.png) no-repeat center/contain; --w: 145; --h: 94; min-width: 60px; min-height: 40px; } 
.intro__top p { font-size: var(--font-50); } 
.intro__top h1, .intro__top h1 span { font-size: var(--font-68); } 
#intro .intro__top h1 span { color: var(--main-color); } 
#intro .line { --w: 2; --h: 147; background-color: var(--white-color); margin: clamp(25px, 7vw, 50px) auto; } 
.intro__bottom { max-width: 90%; gap: 10px; justify-content: center; margin: 0 auto; width: 100%; } 
.intro__bottom .circle { display: flex; align-items: center; justify-content: center; width: calc(210vw / var(--mainWidth)); aspect-ratio: 1/1; border-radius: 50%; background-color: #eee4da80; border: 1px dotted #eee4da; font-size: var(--font-35); font-weight: 600; letter-spacing: -1.2px; } 
.intro__close { display: flex; justify-content: center; font-size: var(--font-30); font-weight: 300; border: 1px solid #fff; margin: clamp(30px, 5vw, 50px) auto; border-radius: 50px; padding: 4px 30px 3px; cursor: pointer; } 

/* ==================================================
section-1
================================================== */
#section-1 { padding-bottom: 65%; overflow: hidden; } 
#section-1 .video-wrap video { position: absolute; inset: 0; z-index: -1; } 
.sec1__center { padding-top: clamp(70px, 14vw, 250px); } 
.sec1__center .inner-logo { margin: clamp(40px, 6.7vw, 70px ) auto clamp(25px, 4.8vw, 50px); background: url(../images/section1/logo.png) no-repeat center/cover; --w: 449; --h:291; } 
.sec1__center .flower-ico { background: url(../images/common/flower-ico.png) no-repeat center / contain; margin: 0 auto 10px; --w: 45; color: transparent !important; } 
.sec1__center h2 { margin-bottom: clamp(12px, 1.5vw, 25px); } 
.sec1__center p.font-45 { margin-top: clamp(16px, 7vw, 18px); } 
.sec1__bottom .kor { font-size: var(--font-45); font-weight: 600; } 
.sec1__bottom .eng { font-size: var(--font-24); font-family: 'Bembo Titling MT Std'; margin-top: 25px; } 
.sec1__bottom { position: absolute; bottom: 6%; width: 100%; justify-content: space-evenly; background-color: rgba(58, 40, 31, 0.5); gap: calc(15vw / var(--mainWidth)); } 
.sec1__bottom .bottom-box { position: relative; width: calc((100%) / 4); padding-block: clamp(35px, 8vw, 75px); padding-inline: 10px; } 
.sec1__bottom .bottom-box:not(:last-child):after { position: absolute; top: 50%; transform: translateY(-50%); right: calc(-10vw / var(--mainWidth)); content:''; display:block; width: 1px; height: 65%; background-color: var(--white-color); opacity: 0.5; } 

/* ==================================================
section-2
================================================== */
#section-2 { position: relative; padding-block: clamp(80px, 15vw, 135px); } 
#section-2:before { position: absolute; top: 0; right: 0; content: ''; display: block; background: url(../images/section2/logo-ico.png) no-repeat center bottom/contain; --w: 581; --h: 377; width: min(calc(var(--w) * 1px), calc(var(--fluid) * var(--w))); height: min(calc(var(--h) * 1px), calc(var(--fluid) * var(--h))); } 
#section-2 .line-d1 { width: 75%; } 
#section-2 .top { text-align: center; } 
#section-2 .sign { background: url(../images/section2/sign.png?ver=26101202) no-repeat center bottom/contain; --w: 307; --h: 76; margin: 10vw auto 8vw; } 
#section-2 .sec2__text p.font-68 { margin-block: -20px 10px; } 
#section-2 .sec2__text .top .sec2-point { color: #b29681; } 
#section-2 .sec2__text .bottom .sec2-point { color: #6f5141; font-weight: 500; } 
#section-2 .sec2__text .bottom p { font-size: var(--font-30); text-align: center; font-weight: 300; margin-bottom: 3vw; } 
#section-2 .sec2__banner { position: relative; width: 100%; height: 100%; padding-bottom: 30vw; } 
#section-2 .sec2__banner p { color: var(--white-color); line-height: 1.6; position: relative; top: 15vw; letter-spacing: 0; text-align: left; } 
#section-2 .sec2__banner .bg { position: absolute; background: url(../images/section2/banner.jpg) no-repeat center bottom/cover; inset: 0; } 

/* ==================================================
section-3
================================================== */
#section-3 { position: relative; } 
#section-3:before { position: absolute; bottom: 7%; right: -15px; content: ''; display: block; background: url(../images/section2/logo-ico.png) no-repeat center bottom/contain; --w: 581; --h: 377; width: min(calc(var(--w) * 1px), calc(var(--fluid) * var(--w))); height: min(calc(var(--h) * 1px), calc(var(--fluid) * var(--h))); } 
#section-3 .container { width: 70%; } 
#section-3 .mini-logo { background: url(../images/section3/logo-top.png) no-repeat center center/contain; --w:86; --h:86; min-width: 30px; min-height: 35px; margin: 0 auto; } 
#section-3 h2 { color: #826659; margin-block: 3vw; } 
#section-3 .sec3__top .doctor-image { background: url(../images/section3/doctor.png) no-repeat center center/contain; min-height: auto; width: 100%; aspect-ratio: 0.8; } 
#section-3 .sec3__bottom { text-align: left; } 
#section-3 .sec3__bottom .line { width: 100%; height: 1px; background-color: #D5C4B5; margin-block: calc(30vw / var(--mainWidth)); } 
#section-3 .sec3__bottom .desc { font-size: var(--font-30); font-weight: 300; margin-bottom: 2vw; line-height: 1.4; color: #3e3a39; } 
#section-3 .sec3__bottom .doctor-name { font-size: var(--font-72); letter-spacing: 7px; font-weight: 600; color: #826659; margin-bottom: 2vw; } 
#section-3 .sec3__bottom .doctor-name span { margin-left: -10px; font-weight: 600; } 
#section-3 .sec3__bottom p { text-align: center; padding-block: calc(80vw / var(--mainWidth)); letter-spacing: 1px; } 

/* ==================================================
section-4
================================================== */
#section-4 { padding-block: 12vw } 
#section-4 .sec4__top { text-align: center; } 
#section-4 .flower-ico { color: #b29681; margin-bottom: calc(-30vw / var(--mainWidth)); } 
#section-4 .flower-ico { background: url(../images/common/flower-ico.png) no-repeat center / contain; margin: 0 auto 10px; --w: 45; color: transparent !important; filter: brightness(0) saturate(100%) invert(67%) sepia(14%) saturate(470%) hue-rotate(347deg) brightness(88%) contrast(82%); } 
#section-4 .point-slider { padding-bottom: 6vw; } 
#section-4 .point-slider .swiper-pagination { top: auto; bottom: 0px; display: flex; justify-content: center; width: 100%; gap: clamp(15px, 3.5vw, 25px); } 
#section-4 .point-slide { position: relative; top: 0; padding-block: clamp(30px, 10vw, 58px) clamp(50px, 8vw, 80px); border-radius: 40px; margin-top: 12vw; transition: top 0.3s; min-height: 350px; } 
#section-4 .swiper-slide-active { top: -6vw; transition: 0.3s; } 
#section-4 .point-slide * { color: var(--white-color); text-align: center; } 
#section-4 .point-slide .num { display: flex; font-family: 'Aurora'; font-size: var(--font-22); border: 1px solid #fff; border-radius: 50%; margin: 0 auto 3vw; justify-content: center; width: fit-content; padding: 5px 12px 2px; letter-spacing: 1px; } 
#section-4 .point-slide .tit { font-size: var(--font-40); font-weight: 600; } 
#section-4 .point-slide .line-d1 { max-width: 50%; margin: 0 auto calc(50vw / var(--mainWidth)); } 
#section-4 .point-slide .line-d1:before { left: -10px; } 
#section-4 .point-slide .line-d1:after { right: -10px; } 
#section-4 .point-slide .desc>p { font-size: var(--font-30); font-weight: 300; line-height: 1.5; } 
#section-4 .point-slide .desc>p:last-child { margin-top: 20px; } 
#section-4 .point-slide.slide-1 { background: url(../images/section4/bg-1.png) no-repeat center/cover; } 
#section-4 .point-slide.slide-2 { background: url(../images/section4/bg-2.png) no-repeat center/cover; } 
#section-4 .point-slide.slide-3 { background: url(../images/section4/bg-3.png) no-repeat center/cover; } 
#section-4 .point-slider .swiper-pagination-bullet { background: transparent; border: 1px solid black; width: clamp(9px, 2vw, 13px); height: clamp(9px, 2vw, 13px); transform: none !important; opacity: 0.5; cursor: pointer; } 
#section-4 .point-slider .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #000; opacity: 1; } 

/* ==================================================
section-5
================================================== */
.sec5__top .logo, .sec7__top .logo, .sec9__bottom .logo { background: url(../images/section5/top-logo.png) no-repeat center/contain; width: calc(283vw / var(--mainWidth)); height: calc(183vw / var(--mainWidth)); margin: 0 auto; } 
#section-5 { padding-top: calc(170vw / var(--mainWidth)); overflow-y: hidden; } 
#section-5 h2 { color:#3a281f; padding-block:calc(35vw / var(--mainWidth)) calc(50vw / var(--mainWidth)); } 
#section-5 .num { display: grid; place-content: center; width: calc(64vw / var(--mainWidth)); min-width: 30px; aspect-ratio: 1; font-size: var(--font-30); border: 1px solid; border-radius: 50%; margin: 0 auto calc(27vw / var(--mainWidth)); padding-top: 2px; } 
#section-5 .row .fw-400 { color: #b29681; line-height: 1.8; } 
#section-5 .line-d1 { max-width: 50%; margin-inline: auto; color: #C1AA9A; font-size: var(--font-72); margin-bottom: calc(110vw / var(--mainWidth)); } 
#section-5 .line-d1.black:before, #section-5 .line-d1.black:after { top: -10%; width: 38%; background-image: radial-gradient(circle, #C1AA9A 1.1px, transparent 1px); } 
#section-5 .sec5__bottom p { line-height: 1.4; font-weight: 300; color: #303030; margin-block: -11px calc(50vw / var(--mainWidth)); } 
#section-5 .sec5__progress-box { display: flex; align-items: center; flex-direction: column; gap: calc(75vw / var(--mainWidth)); } 
#section-5 .sec5__progress-box .box { position: relative; font-size: var(--font-35); background: #DACBBA; width: calc(420vw / var(--mainWidth)); padding-block: calc(20vw / var(--mainWidth)); border-radius: 50px; font-weight: 500; } 
#section-5 .sec5__progress-box .box:not(:last-child):after { position: absolute; bottom: -50%; left: 50%; transform: translateX(-50%); content: ''; display: block; --w: 25; --h: 14; background: url(../images/section5/arrow-down.png) no-repeat center/contain; width: min(calc(var(--w) * 1px), calc(var(--fluid) * var(--w))); height: min(calc(var(--h) * 1px), calc(var(--fluid) * var(--h))); } 
#section-5 .sec5__bottom p.sec5__bottom-text { color: #303030; margin-block: calc(55vw / var(--mainWidth)) calc(110vw / var(--mainWidth)); } 
#section-5 .row-2 { padding-top: calc(130vw / var(--mainWidth)); background: #cdb8a533; } 

/* ==================================================
section-6
================================================== */
#section-6 { padding-bottom: calc(115vw / var(--mainWidth)); } 
#section-6 .sec6__top { background: url(../images/section6/bg.jpg) no-repeat center bottom/cover; width: 100%; height: auto; aspect-ratio: 1; } 
#section-6 .sec6__bottom .flower-ico { background: url(../images/common/flower-ico.png) no-repeat center / contain; margin-bottom: calc(70vw / var(--mainWidth)); --w: 45; color: transparent !important; filter: brightness(0) saturate(100%) invert(72%) sepia(13%) saturate(650%) hue-rotate(314deg) brightness(93%) contrast(88%); margin-inline: auto; } 
#section-6 .sec6__bottom { margin-top: calc(130vw / var(--mainWidth)); } 
#section-6 .sec6__bottom .point { color:#b69c87 } 
#section-6 .line { width: 1px; height: calc(130vw / var(--mainWidth)); margin: calc(80vw / var(--mainWidth)) auto 0; background: #000; } 

/* ==================================================
section-7
================================================== */
#section-7 * { color: #fff; } 
#section-7 .container { padding-block: calc(120vw / var(--mainWidth)) calc(135vw / var(--mainWidth)); } 
#section-7 .bg { position: absolute; background: url(../images/section7/bg.jpg) no-repeat center/cover; width: 100%; height: 100%; z-index: -1; } 
#section-7 .logo { background-image: url(../images/section7/logo.png); } 
#section-7 .sec7__top .font-50 { margin-block: calc(55vw / var(--mainWidth)) calc(40vw / var(--mainWidth)); font-weight: 200; } 
#section-7 .line { width: 1px; height: calc(150vw / var(--mainWidth)); background: #fff; margin: calc(75vw / var(--mainWidth)) auto calc(70vw / var(--mainWidth)); } 
#section-7 .sec7__center p { line-height: 1.6; font-weight: 100; } 
#section-7 .sec7__center p:last-child { margin-top: 12px; } 
#section-7 .sec7__bottom { flex-direction: column; align-items: center; gap: clamp(20px, 2vw, 20px); } 
#section-7 .row { flex-direction: row; justify-content: space-between; width: 100%; } 
#section-7 .circle { display: flex; align-items: center; justify-content: center; width: calc((100% / 2.85)); aspect-ratio: 1/1; border-radius: 50%; background-color: #eee4da80; font-size: var(--font-40); font-weight: 500; border: 2px dotted; } 
#section-7 .circle:not(:first-child) { margin-left: clamp(-55px, -4.5vw, -30px); } 
#section-7 .circle.pink { background-color: #d09d9a80; border-color: #d09d9a; z-index: 2; } 

/* ==================================================
section-8
================================================== */
#section-8 { padding-block: calc(180vw / var(--mainWidth)) calc(167vw / var(--mainWidth)); } 
#section-8 .top-logo { position: absolute; top: calc(74vw / var(--mainWidth)); right: 0; --w: 674; --h: 468; background: url(../images/section8/top-logo.png) no-repeat center bottom/cover; } 
#section-8 .sec8__top .img-large { --w: 659; --h: 868; background: url(../images/section8/img-1.jpg) no-repeat center/cover; } 
#section-8 .sec8__top .img-large { --w: 659; --h: 868; background: url(../images/section8/img-1.jpg) no-repeat center/cover; } 
#section-8 .sec8__top .img-small { --w: 487; --h: 487; background: url(../images/section8/img-2.jpg) no-repeat center/cover; margin: calc(-360vw / var(--mainWidth)) 0 calc(120vw / var(--mainWidth)) auto; } 
#section-8 .sec8__slider .logo { --w: 145; --h: 94; background: url(../images/section8/mid-logo.png) no-repeat center/cover; margin: 0 auto calc(50vw / var(--mainWidth)); } 
#section-8 .sec8__panel-ico { font-size: var(--font-68); transition: transform 0.6s ease; } 
#section-8 .swiper-slide-active .sec8__panel-ico { transform: rotate(-360deg); } 
#section-8 .sec8__panel-desc { opacity: 0; transform: translateY(30px); transition: opacity 0.5s ease, transform 0.5s ease; } 
#section-8 .swiper-slide-active .sec8__panel-desc { opacity: 1; transform: translateY(0); } 
#section-8 .sec8__slider-p3 { color: #d09d9a; font-size: var(--font-30); margin-block: calc(35vw / var(--mainWidth)) calc(75vw / var(--mainWidth)); letter-spacing: 1px; } 
#section-8 .sec8__slider-bottom { font-size: var(--font-30); } 
#section-8 .sec8__tab { width: 35%; font-family: inherit; border: 1px solid #000; color: #000; border-radius: 50px; padding-block: calc(20vw / var(--mainWidth)); font-weight: 600; } 
#section-8 .sec8__tabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 8px; } 
#section-8 .sec8__tab.sec8__tab-active { color: #fff; background-color: #3A281F; font-weight: 400; } 
#section-8 .sec8__panel-slider { position: relative; margin-top: calc(50vw / var(--mainWidth)); padding-block: calc(110vw / var(--mainWidth)) calc(85vw / var(--mainWidth)); background: url(../images/section8/bottom-logo.png) no-repeat center/cover; border-radius: 30px; } 
#section-8 .sec8__panel-desc p { font-weight: 300; line-height: 1.4; } 
#section-8 .sec8__panel-desc p:not(:last-child) { margin-bottom: calc(32vw / var(--mainWidth)); } 

/* ==================================================
section-9
================================================== */
#section-9 .container { padding-block: calc(120vw / var(--mainWidth)) calc(135vw / var(--mainWidth)); } 
#section-9 .sec9__img-wrap .bg { position: relative; width: 100%; height: auto; background: url(../images/section9/bg.jpg) no-repeat center/cover; } 
#section-9 .sec9__img-wrap .bg * { color: #fcfeff; } 
#section-9 .sec9__img-wrap *:not(.flower-ico) { font-family: "Bethany Elingston"; } 
#section-9 .sec9__img-wrap .font-72 { margin-top: -16px; font-style: italic; } 
#section-9 .sec9__circle-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-top: calc(45vw / var(--mainWidth)); } 
#section-9 .sec9__circle-wrap .circle { width: 50%; aspect-ratio: 1; display: grid; place-content: center; border: 2px dotted; border-radius: 50%; margin: -0.8px; } 
#section-9 .sec9__bottom .logo { background-image: url(../images/section9/logo.png); margin-bottom: calc(40vw / var(--mainWidth)); } 
#section-9 .sec9__bottom .font-40 { color: #d09d9a; font-size: var(--font-30); margin-block: calc(35vw / var(--mainWidth)) calc(75vw / var(--mainWidth)); letter-spacing: 1px; } 
#section-9 .sec9__bottom .dia { --w: 37; --h: 37; background: url(../images/section9/dia.png) no-repeat center/cover; margin: calc(-30vw / var(--mainWidth)) auto calc(50vw / var(--mainWidth)) } 
#section-9 .sec9__bottom-box p { font-size: var(--font-32); margin-bottom: calc(40vw / var(--mainWidth)); font-weight: 300; line-height: 1.3; } 
#section-9 .sec9__bottom-box p.sec9__bottom-para3 { font-weight: 500; } 
#section-9:before { position: absolute; content: ''; display: block; bottom:0; right: 0; --w: 567; --h: 375; background: url(../images/section9/logo-bottom.png) no-repeat center bottom/cover; width: min(calc(var(--w) * 1px), calc(var(--fluid) * var(--w))); height: min(calc(var(--h) * 1px), calc(var(--fluid) * var(--h))); } 

/* ==================================================
section-10
================================================== */
#section-10 { overflow: visible; } 
#section-10 video { width: 100% } 
#section-10 .dia-text { --w:285; --h:136; background: url(../images/section10/dia-text.png) no-repeat center/contain; margin: 0 auto calc(40vw / var(--mainWidth)); } 
#section-10 .sec10__bottom { background: url(../images/common/bg.jpg) no-repeat center/cover; } 
#section-10 .container { width: 80%; padding-block: calc(120vw / var(--mainWidth)) calc(135vw / var(--mainWidth)); } 
#section-10 .sec10__bottom .font-40 { color: #d09d9a; font-size: var(--font-30); margin-top: calc(35vw / var(--mainWidth)); letter-spacing: 1px; } 
#section-10 .text > div { font-size: var(--font-32); padding: 10px 17px; border: 1px solid; width: fit-content; margin: calc(45vw / var(--mainWidth)) auto calc(100vw / var(--mainWidth)); border-radius: 50px; } 
#section-10 .sec10__bottom .line { position: relative; width: 85%; height: 1px; background: #000; margin-inline: auto; } 
#section-10 .sec10__bottom .line:before, .sec10__bottom .line:after { position: absolute; content: '●'; display: block; top: 50%; transform: translateY(-45%); font-size: var(--font-24); } 
#section-10 .sec10__bottom .line:before { left: -3px; } 
#section-10 .sec10__bottom .line:after { right: 0; } 
#section-10 .sec10__bottom_text .row { max-width: 79%; flex-direction: row; align-items: center; justify-content: space-between; text-align: left; margin: 0 auto; padding-block: calc(58vw / var(--mainWidth)) calc(50vw / var(--mainWidth)); border-bottom: 1px solid; } 
#section-10 .sec10__bottom_text .row:last-child { border-bottom: none; } 
#section-10 .sec10__bottom_text .row-title { font-size: var(--font-45); font-weight: 600; margin-bottom: calc(22vw / var(--mainWidth)); } 
#section-10 .sec10__bottom_text .row-desc { font-size: var(--font-28); font-weight: 300; } 
#section-10 .sec10__bottom_text .right { text-align: center; font-size: var(--font-18); color: #b29681; font-family: "Bethany Elingston"; padding: calc(30vw / var(--mainWidth)); padding-bottom: calc(28vw / var(--mainWidth)); border: 1px solid #6F5D55; border-radius: 50%; line-height: 1.3; } 

/* ==================================================
section-11
================================================== */
#section-11 .bg { position: absolute; background: url(../images/section11/bg.png?ver=2) no-repeat center bottom/cover; width: 100%; height: 100%; z-index: -1; } 
#section-11 .container { padding-block: calc(120vw / var(--mainWidth)) calc(135vw / var(--mainWidth)); } 
#section-11 .sec11__top .logo { --w: 145; --h: 94; background: url(../images/section8/mid-logo.png) no-repeat center / cover; margin: 0 auto calc(50vw / var(--mainWidth)); } 
#section-11 .sec11__top [data-font="Aurora"] { letter-spacing: 1px; } 
#section-11 .sec11__top h2 { margin-block: calc(34vw / var(--mainWidth)) calc(30vw / var(--mainWidth)); } 
#section-11 address { font-style: normal; } 
#section-11 .sec11__center { margin-block: calc(45vw / var(--mainWidth)) calc(50vw / var(--mainWidth)); border: 1px solid; height: calc(600vw / var(--mainWidth)); } 
#section-11 .sec11__bottom { font-size: var(--font-32); width: 75%; margin: 0 auto; } 
#section-11 .sec11__bottom .inner-row { gap: 20px; justify-content: center; } 
#section-11 .sec11__bottom .row, #section-11 .sec11__bottom [data-has-desc] .inner-row { flex-direction: row; align-items: center; justify-content: center; gap: 5px 45px; } 
#section-11 .sec11__bottom .row { margin-bottom: calc(55vw / var(--mainWidth)); border-bottom: 2px dotted; width: fit-content; margin-inline: auto; padding-bottom: calc(35vw / var(--mainWidth)); } 
#section-11 .sec11__bottom .row:last-child { border-bottom: none; } 
#section-11 .sec11__bottom .row[data-has-desc] { flex-direction: column; } 
#section-11 .sec11__bottom .inner-row:last-child { font-size: 12px; font-weight: 200; } 
#section-11 .sec11__bottom .time { position: relative; letter-spacing: 3px; font-weight: 300; } 
#section-11 .sec11__bottom .time:before { position: absolute; content: 'ㅣ'; display: block; left: -30px; top: 50%; transform: translateY(-50%); opacity: 0.7; } 
#section-11 .sec11__bottom .tel a { display: flex; justify-content: center; justify-content: space-between; font-size: var(--font-36); border: 1px solid; padding: 12px 30px; border-radius: 50px; } 
#section-11 .sec11__bottom .tel a span { font-family: 'Aurora'; } 

/* 스크롤 탑 버튼 (PC 전용)*/
#top-btn { position: fixed; right: 20px; bottom: 20px; z-index: 90; display: grid; place-content: center; width: 56px; height: 56px; border-radius: 50%; background-color: #3a281f; opacity: 0; visibility: hidden; transform: translateX(calc(100% + 40px)); transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.5s, visibility 0.5s; } 
#top-btn.show { opacity: 1; visibility: visible; transform: translateX(0); } 
#top-btn:before { content: ''; display: block; width: 12px; height: 12px; border-top: 2px solid #f0e1db; border-left: 2px solid #f0e1db; transform: translateY(3px) rotate(45deg); } 
