/* ========================================
 FONT IMPORTS & VARIABLES
 ======================================== */

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100; 200; 300; 400; 500; 600; 700; 800&display=swap");@import url("https://fonts.googleapis.com/css2?family=GFS+Didot:wght@100; 200; 300; 400&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100; 400; 500; 600; 700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@300; 400; 700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300; 400; 700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300; 400; 500; 700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Yellowtail&display=swap");
@font-face { font-family: "Photograph Signature"; font-weight: 400; src: local("Photograph Signature"), url(/fonts/photograph-signature.woff) format("woff"); } 

@font-face { font-family: Poppins; src: local("Poppins"), url(/fonts/Poppins-Regular.ttf) format("truetype"); font-weight: 400; } 

@font-face { font-family: Pretendard; src: local("Pretendard"), url(/fonts/PretendardVariable.ttf) format("truetype"); font-weight: 400; } 

@font-face { font-family: swiper-icons; src: url("data:application/font-woff; charset=utf-8;base64,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"); font-weight: 400; } 

:root { --swiper-theme-color: #007aff; } 

/* ========================================
 COMMON STYLES
 ======================================== */

section { padding: 120px 20px; overflow: hidden; } 

.container { max-width: 1285px; margin: 0 auto; } 

.section__heading { display: flex; flex-direction: column; align-items: center; text-align: center; } 

.section__title { font-size: 55px; font-weight: 700; line-height: 65px; letter-spacing: -0.02em; color: #282828; margin: 0; } 

.section__title--small { font-size: 42px; font-weight: 700; letter-spacing: -0.02em; } 

.section__title--bold { font-weight: 800; } 

.section__title--highlight { color: #BA8E7A; } 

.section__clinic { font-size: 14px; font-weight: 600; letter-spacing: 4px; text-transform: uppercase; color: #BA8E7A; margin-bottom: 20px; } 

.section__clinic--dark { font-size: 14px; font-weight: 600; letter-spacing: 4px; text-transform: uppercase; color: #282828; } 

.pc_only { display: block; } 

.mo_only { display: none !important; } 

/* ========================================
 HERO SECTION
 ======================================== */

.hero { overflow: hidden; } 

.hero-bg { max-width: 1920px; position: relative; height: calc(48.25vw); max-height: 1080px; margin: auto 0; } 

.hero-bg img { width: 100%; height: 100%; object-fit: cover; } 

.hero-content { position: absolute; top: 47.4%; right: 17.55%; text-align: center; z-index: 10; } 

.hero-textwrap { position: relative; display: flex; flex-direction: column; align-items: center; z-index: 0; } 

.hero-text { text-align: center; color: #ffffff; } 

.hero-text h3 { font-family: "Photograph Signature"; font-weight: 400; font-size: 55px; line-height: 55px; letter-spacing: 0.03em; color: rgba(186, 142, 122, 0.5); margin: 0 0 0 0; white-space: nowrap; } 

.hero-text h2 { font-weight: 400; font-size: 30px; line-height: 36px; letter-spacing: -0.02em; white-space: pre-line; margin: 0; } 

.hero-text h1 { font-size: 75px; font-weight: 800; line-height: 90px; letter-spacing: -0.02em; text-shadow: 0 0 12px rgba(126, 155, 171, 0.2); margin: 5px 0 30px 0; color: #ffffff; } 

.hero-text .highlight { color: #BA8E7A; } 

.divider { margin: 20px 0; font-weight: 800; font-size: 75px; line-height: 90px; text-align: center; letter-spacing: -0.02em; white-space: pre-line; text-shadow: 0 0 12px rgba(217, 103, 141, 0.2); word-break: keep-all; color: #ffffff; height: 2px; width: 40px; background: #ffffff; margin: 30px auto; } 

.subtitle { font-weight: 400; font-size: 22px; line-height: 30px; text-align: center; letter-spacing: -0.02em; white-space: pre-wrap; color: #ffffff; } 

.scroll-down { position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); background: none; border: none; cursor: pointer; animation: bounce 2s infinite; padding: 0; } 

@keyframes bounce { 0%, 100% { transform: translateX(-50%) translateY(0); } 
 50% { transform: translateX(-50%) translateY(10px); } 
 }

/* ========================================
 PROCESS SECTION
 ======================================== */

.process { display: flex; flex-direction: column; align-items: center; padding-bottom: 120px; overflow: hidden; } 

.process__container { position: relative; width: 100%; max-width: 1200px; margin: 50px auto; display: flex; justify-content: space-between; align-items: center; } 

.dashed-line { position: absolute; top: 50%; left: 0; right: 0; height: 2px; background: url("data:image/svg+xml,%3Csvg width='8' height='2' viewBox='0 0 8 2' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='0' y1='1' x2='4' y2='1' stroke='%23D0C7BF' stroke-width='2' stroke-dasharray='4,4'/%3E%3C/svg%3E"); z-index: 0; } 

.dot__container { position: absolute; width: 100%; display: flex; justify-content: space-between; z-index: 1; } 

.process-dot { width: 16px; height: 16px; border-radius: 50%; background: #D0C7BF; border: 3px solid #ffffff; } 

.process-step__container { display: flex; justify-content: space-between; gap: 30px; width: 100%; max-width: 1200px; margin: 50px auto 0; position: relative; z-index: 2; } 

.process-step { flex: 1; text-align: center; } 

.step-number { font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: -0.02em; color: #BA8E7A; } 

.step-title { font-size: 22px; font-weight: 700; line-height: 30px; color: #282828; margin-top: 8px; } 

.step-description { margin-top: 8px; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: -0.02em; color: #666666; } 

.process__last { margin-top: 50px; font-weight: 500; font-size: 18px; line-height: 28px; text-align: center; letter-spacing: -0.02em; color: #282828; } 

/* ========================================
 MCT SECTION
 ======================================== */

.mct { display: flex; flex-direction: column; align-items: center; padding-bottom: 120px; overflow: hidden; } 

.mct__subtitle { text-align: center; font-size: 24px; font-weight: 100; line-height: normal; letter-spacing: -0.48px; margin-bottom: 5px; } 

.mct__content { display: flex; margin: 0 auto; align-items: flex-start; gap: 32px; width: 100%; max-width: 1200px; } 

.mct__image-wrapper { width: 100%; height: auto; flex-shrink: 0; } 

.mct__image-wrapper img { width: 100%; height: auto; display: block; } 

.mct__effect-title { display: flex; align-items: baseline; gap: 0; margin: 40px 0 20px 0; } 

.mct__effect-title__text { color: #BA8E7A; text-align: center; font-size: 50px; font-weight: 700; line-height: normal; letter-spacing: -1px; position: relative; z-index: 1; } 

.mct__effect-title__accent { font-family: "Yellowtail", cursive; color: rgba(214, 210, 255, 0.6); font-size: 80px; font-weight: 400; line-height: 60px; letter-spacing: -1.6px; margin-top: -3.93px; margin-left: -19.1px; } 

.mct__banner { margin-top: 100px; width: 100%; } 

/* ========================================
 MARQUEE / TAG SECTIONS
 ======================================== */

.sub_tag { display: flex; align-items: center; list-style: none; padding: 0; margin: 30px 0 25px 0; gap: 10px; width: 100%; white-space: nowrap; overflow: hidden; } 

.sub_tag li { display: inline-flex; align-items: center; justify-content: center; padding: 7px 20px; border-radius: 60px; background: #D0C7BF; color: #282828; text-align: center; font-size: 16px; font-weight: 700; line-height: normal; letter-spacing: -0.32px; flex-shrink: 0; animation: 10s marquee infinite linear; } 

.sub_tag li.t1 { background: #FFF4DE; } 

.sub_tag li.t2 { border: 1px solid #D0C7BF; background: #FFF4DE; } 

.sub_tag li.t3 { background: #D0C7BF; color: #282828; } 

.sub_tag2 { display: flex; list-style: none; padding: 0; margin: 42px 0 0 0; gap: 10px; width: 100%; white-space: nowrap; overflow: hidden; } 

.sub_tag2 li { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 200px; height: 118px; border-radius: 118px; text-align: center; font-size: 16px; font-weight: 700; color: #282828; overflow: hidden; box-sizing: border-box; flex-shrink: 0; } 

.sub_tag2 li img { width: 100%; height: 100%; object-fit: cover; } 

.sub_tag2 li.t1 { border: 1px solid #FFF4DE; background: #D0C7BF; } 

.sub_tag2 li.t2 { border: 1px solid #D0C7BF; background: #FFF4DE; } 

.sub_tag2 li.t2 img { display: block; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60%; } 

.sub_tag2 li.t3 { color: #BA8E7A; background: #D0C7BF; } 

.sub_tag2 li.t4 { background: #D0C7BF; } 

.sub_tag2 li.t4 img { display: block; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60%; } 

.sub_tag2 li.t5 img { display: block; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60%; } 

@keyframes marquee { 
 from { transform: translateX(-100%); } 
 to { transform: translateX(0); } 
 }

/* ========================================
 INTRO SECTION
 ======================================== */

.intro { position: relative; min-height: 700px; padding: 120px 0 0 0; overflow: hidden; display: flex; align-items: center; } 

.model-image { position: absolute; left: 0; width: auto; z-index: 1; } 

.model-image img { width: 100%; max-width: 600px; height: auto; } 

.intro-content { position: relative; margin-left: auto; margin-right: 60px; max-width: 600px; z-index: 2; } 

.intro-content h3 { font-size: 18px; font-weight: 400; letter-spacing: -0.02em; color: #BA8E7A; } 

.intro-content h1 { font-size: 50px; font-weight: 800; line-height: 60px; letter-spacing: -0.02em; color: #282828; margin: 15px 0 40px 0; } 

.info-box { padding: 30px; background: #ffffff; border-radius: 10px; } 

.info-image { width: 100%; height: auto; display: block; } 

/* ========================================
 FORBES SECTION
 ======================================== */

.forbes { background: linear-gradient(135deg, #f8f6f3 0%, #efe9e0 100%); } 

.img__container { max-width: 1000px; margin: 50px auto 0; text-align: center; } 

.forbes__image { width: 100%; height: auto; display: block; } 

/* ========================================
 BENEFITS SECTION
 ======================================== */

.benefits { background: #f8f6f3; } 

.benefits .heading { display: flex; flex-direction: column; align-items: center; text-align: center; margin-bottom: 60px; } 

/* ========================================
 RECOMMENDATION SECTION
 ======================================== */

.recom { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 60px; width: 100%; height: auto; } 

.recom__desktop-image { flex: 0 0 45%; } 

.recom__content { flex: 1; padding-top: 0; } 

.section__header { margin-bottom: 50px; display: block; } 

.recom__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 20px; } 

.recom__list-item { padding: 20px 30px; background: #f8f6f3; border-radius: 8px; border-left: 4px solid #BA8E7A; } 

.recom__list-text { font-size: 18px; font-weight: 500; line-height: 28px; color: #282828; } 

/* ========================================
 Q&A SECTION
 ======================================== */

.qa { background: #ffffff; } 

.qa .section__title { margin-bottom: 60px; } 

.qa__container { max-width: 1000px; margin: 0 auto; } 

.qa__content { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 20px; } 

.qa__item { border: 1px solid #e0e0e0; border-radius: 8px; overflow: hidden; } 

.qa__question { padding: 20px 30px; background: #f8f6f3; font-size: 16px; font-weight: 600; line-height: 24px; color: #282828; cursor: pointer; user-select: none; } 

.qa__answer-wrapper { display: flex; } 

.qa__answer { flex: 1; padding: 20px 30px; font-size: 15px; line-height: 24px; color: #666666; } 

/* ========================================
 COMMON SECTION (CLINIC FEATURES)
 ======================================== */

.common { background: transparent; padding: 120px 20px; overflow: visible; } 

.common__container { max-width: 1285px; margin: 0 auto; } 

.common__container > p:first-child { text-align: center; margin-bottom: 30px; } 

.common__list { list-style: none; padding: 0; margin: 60px 0 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; } 

.common { position: relative; height: 400px; border-radius: 12px; overflow: hidden; cursor: pointer; } 

.common__image { width: 100%; height: 100%; object-fit: cover; display: block; } 

.common__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 40px; background: linear-gradient(180deg, transparent 0%, rgba(40, 40, 40, 0.8) 50%, rgba(40, 40, 40, 0.95) 100%); } 

.common__overlay--1 { background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.7) 100%); } 

.common__header { margin-bottom: 20px; } 

.common__header-content { display: flex; align-items: center; } 

.common__subtitle { font-size: 12px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: #ffffff; opacity: 0.8; } 

.common__subtitle--white { color: #ffffff !important; } 

.common__title { font-size: 20px; font-weight: 700; line-height: 28px; color: #ffffff; margin: 15px 0 0 0; } 

.common__title--white { color: #ffffff !important; } 

.common__description { display: flex; flex-direction: column; gap: 8px; } 

.common__text { font-size: 14px; font-weight: 400; line-height: 20px; color: rgba(255, 255, 255, 0.9); word-break: keep-all; } 

.common__text--white { color: #ffffff !important; } 

/* ========================================
 VIDEO SECTION
 ======================================== */

.youtube { width: 100%; max-width: 880px; height: calc(500 / 880 * min(100vw, 880px)); margin: 0 auto; display: block; } 

/* ========================================
 SWIPER STYLES
 ======================================== */

.swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } 

.swiper-vertical > .swiper-wrapper { flex-direction: column; } 

.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; } 

.swiper-backface-hidden .swiper-slide { backface-visibility: hidden; -webkit-backface-visibility: hidden; } 

.swiper-3d,
.swiper-3d .swiper-wrapper { perspective: 1200px; } 

.swiper-3d .swiper-wrapper { transform-style: preserve-3d; } 

.swiper-3d .swiper-slide { transform-style: preserve-3d; } 

.swiper-click-prevention-active { pointer-events: none; } 

.swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; } 

.swiper-slide-invisible-blank { visibility: hidden; } 

.swiper-autoplay.autoplay-disabled,
.swiper-autoplay.autoplay-paused { animation: none; } 

/* ========================================
 RESPONSIVE STYLES
 ======================================== */

@media (max-width: 1480px){
 .common__container { width: 100%; min-width: 319px; max-width: 1480px; height: auto; } 

 .section__clinic { font-size: 12px; letter-spacing: 4px; text-align: center; } 

 .common__number { font-size: 30px; color: #ffffff !important; } 

 .common__divider { font-size: 30px; color: #ffffff !important; } 

 .common__subtitle { font-size: 12px; font-weight: 300; color: #ffffff !important; margin-bottom: 0; } 

 .common__subtitle-small { font-size: 8px; line-height: 8px; font-weight: 100; color: #ffffff !important; } 

 .common__title { font-size: 18px; margin: 5px 0; color: #ffffff !important; } 

 .common__text { font-size: 13px; margin-bottom: 3px; word-break: keep-all; color: #ffffff !important; } 
 }

@media (max-width: 1023px){
 .hero { width: 100%; min-width: 319px; max-width: 1023px; height: auto; background: #e5d1d2; overflow: hidden; } 

 .hero-bg { height: 640px; } 

 .hero-bg img { max-height: 640px; } 

 .hero-content { position: static; transform: none; width: 100%; } 

 .hero-text h3 { top: -45px; font-size: 24px; line-height: 55px; } 

 .hero-text h2 { font-size: 20px; line-height: 24px; } 

 .hero-text h1 { font-size: 40px; line-height: 48px; } 

 .subtitle { font-size: 15px; line-height: 18px; } 

 .mo_only { display: block !important; } 

 .pc_only { display: none; } 

 .process__container { position: absolute; margin-top: 580px; width: 320px; height: 184px; } 

 .dashed-line { display: none; } 

 .process-dot { display: none; } 

 .process-step { top: 15px; left: 14px; } 

 .step-number { font-size: 12px; line-height: 18px; letter-spacing: -0.02em; } 

 .step-title { margin-top: 0; font-size: 16px; line-height: 19px; } 

 .step-description { margin-top: 10px; font-size: 14px; line-height: 20px; text-align: center; letter-spacing: -0.02em; } 

 .process__last { margin-top: 50px; font-weight: 500; font-size: 16px; line-height: 24px; letter-spacing: -0.02em; } 

 .intro { min-height: 700px; padding: 120px 0 0 0; } 

 .model-image { left: 27%; } 

 .model-image img { width: 100%; max-width: 400px; } 

 .intro-content { top: 140px; left: 20px; right: 20px; margin: 54px 15px; } 

 .intro-content h3 { font-size: 24px; } 

 .intro-content h1 { font-size: 40px; margin-bottom: -5px; } 

 .info-box { padding: 30px 20px; } 

 .qna h1 { font-size: 50px; } 

 .qa__container { padding: 70px 20px 0; border-radius: 50px 50px 0 0; } 

 .qa__question,
 .qa__answer { font-size: 14px; line-height: 20px; } 

 .qa__answer { margin-left: auto; } 

 .recom { padding: 40px 0 50px 0; flex-direction: column; align-items: center; justify-content: flex-start; height: min(780px, 177.27vw); } 

 .recom__desktop-image { display: none; } 

 .recom__content { padding-top: 0; margin-left: 0; right: 0; } 

 .section__header { display: none; } 

 .section__clinic { font-size: 12px; line-height: 18px; } 

 .recom__list-item { height: 40px; width: 320px; } 

 .recom__list-text { font-size: 15px; line-height: 18px; } 

 .qa__content { margin-top: 40px; width: 324px; } 

 .qa__question { padding: 11px 25px; height: 40px; font-size: 15px; line-height: 18px; } 

 .qa__answer { font-size: 15px; line-height: 23px; letter-spacing: -0.02em; width: 100%; } 

 .common__image { height: 136px; } 
 }