/* =========================================================
   윈산부인과의원 — 공통 파운데이션 + about 섹션
   폰트: Cardo(영문/디스플레이) · NanumSquare(한글본문)
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Cardo:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');   /* 의료진 인용 손글씨 */

/* =========================================================
   DESIGN TOKENS — 공통 Foundation 2계층 (Atomic → Semantic)
   · Atomic  = 팔레트·스케일 literal (hex/px). 여기에만 literal 정의.
   · Semantic = 클래스/컴포넌트가 참조하는 역할 토큰(공통 명칭).
   CSS는 Semantic만 참조한다(Atomic 직접 사용·하드코딩 금지).
   ========================================================= */
:root{
  /* ---------- 1) COLOR — Atomic 팔레트 (--color-{hue}-{step}) ---------- */
  --color-teal-700:#007D8A;
  --color-teal-800:#006a75;
  --color-teal-400:#78b3c0;    /* WOMEN'S 대표색 */
  --color-teal-300:#88bac5;
  --color-teal-100:#c7dde0;    /* 아이콘 스퀘어 라이트 틴트 */
  --color-taupe-500:#a1988e;
  --color-taupe-600:#877d72;   /* WELL-AGING 서브 */
  --color-taupe-400:#a1908c;   /* BEAUTY 대표색 */
  --color-clay-400:#c39586;    /* BEAUTY 서브 */
  --color-ink-900:#383531;
  --color-gray-500:#807e7c;    /* 본문(설명) 텍스트 중립 그레이 */
  --color-beige-400:#b1a89d;
  --color-beige-300:#E5D7CA;   /* 연한 베이지 #E5D7CA — 서브타이틀·층수 */
  --color-beige-200:#e9e6e2;
  --color-gold-500:#c9a86a;
  --color-gold-200:#EEDEBC;
  --color-cream-100:#F1EAE2;
  --color-cream-50:#F9F7F4;
  --color-beige-50:#f8f6f1;
  --color-line:#e7e0d8;
  --color-white:#fff;

  /* ---------- 1) COLOR — Semantic (역할 → Atomic 참조) ---------- */
  /* Text */
  --c-text-primary:var(--color-ink-900);
  --c-text-secondary:var(--color-beige-400);   /* 구 --c-subtext·--c-muted (진한 갈색) */
  --c-text-body:var(--color-gray-500);          /* 본문·설명 텍스트 공통 (#807e7c) */
  --c-text-eyebrow:var(--color-beige-300);      /* 서브타이틀/층수 (연한 베이지 #E5D7CA) */
  /* GNB 대표색 (페이지별 body.page-* 에서 override) — 기본 = ABOUT/홈 청록 */
  --c-page-accent:var(--color-teal-700);        /* 대표색: 타이틀·강조·링크·버튼 */
  --c-page-accent-sub:var(--color-teal-300);    /* 보조 대표색: hover·2차강조 */
  --c-text-brand:var(--c-page-accent);          /* 섹션 타이틀·본문 강조 = 페이지 대표색 */
  --c-text-inverse:var(--color-white);
  --c-text-inverse-soft:var(--color-beige-200); /* 어두운 배경 약관 등 */
  /* Background */
  --c-bg-base:var(--color-white);
  --c-bg-subtle:var(--color-beige-50);          /* #f8f6f1 베이지 섹션배경 */
  --c-bg-cream:var(--color-cream-100);
  --c-bg-cream-2:var(--color-cream-50);
  --c-bg-inverse:var(--color-teal-700);         /* 푸터 청록 면 */
  --c-icon-bg:var(--color-teal-100);            /* 아이콘 스퀘어 배경(라이트 틴트) */
  /* Border */
  --c-border-default:var(--color-line);
  --c-border-strong:var(--color-gold-200);      /* 구 --c-gold-frame 금테 */
  /* Interactive */
  --c-interactive-default:var(--c-page-accent); /* 링크·버튼·활성 = 페이지 대표색 */
  --c-interactive-hover:var(--c-page-accent-sub);/* 버튼 hover = 페이지 보조색 (기본 #88bac5) */
  --c-interactive-accent:var(--color-gold-500); /* 구 --c-gold */
  --c-interactive-btn:var(--c-interactive-default); /* 버튼 hover 배경 (페이지별 override 가능) */

  /* ---------- 2) TYPOGRAPHY — Atomic ---------- */
  --font-size-120:120px;
  --font-size-96:96px;
  --font-size-60:60px;
  --font-size-48:48px;
  --font-size-44:44px;
  --font-size-41:41px;
  --font-size-38:38px;
  --font-size-36:36px;
  --font-size-30:30px;
  --font-size-26:26px;
  --font-size-25:25px;
  --font-size-24:24px;
  --font-size-20:20px;
  --font-size-19:19px;
  --font-size-18:18px;
  --font-size-17:17px;
  --font-size-16:16px;
  --font-size-15:15px;
  --font-size-14:14px;
  --font-size-13:13px;
  --font-size-12:12px;
  --font-weight-regular:400;
  --font-weight-medium:500;
  --font-weight-bold:700;
  --line-height-base:1.7;
  --line-height-title:1.4;   /* 사이트 전용: 큰 타이틀 (공통엔 없어 신규 등재) */
  --font-latin:'Cardo', serif;
  --font-sans:'NanumSquare', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --ff-base:'Cardo','NanumSquare','Apple SD Gothic Neo','Malgun Gothic',sans-serif;

  /* ---------- 2) TYPOGRAPHY — Semantic (--typo-*) ---------- */
  --typo-display:var(--font-size-96);       /* 배너 디스플레이 (--font-latin, bold) */
  --typo-heading:var(--font-size-60);        /* display>heading>title-large 위계 (DOCTOR PROFILE 등) */
  --typo-title-large:var(--font-size-48);    /* .sec-title 섹션타이틀 */
  --typo-title-medium:var(--font-size-30);   /* 하위 헤딩(sp01/sp02/sp03 h3 · dc-name · loc-info-title · prefooter h2) — PC 30 */
  --typo-body-large:var(--font-size-20);     /* 본문 리드·소제목격 문단 */
  --typo-body-medium:var(--font-size-18);    /* 공통 본문 */
  /* 라벨·태그·브레드크럼 계열 (전부 weight-medium 500) — PC값. 모바일 재지정 @media :root */
  --typo-label-large:var(--font-size-19);    /* medium */
  --typo-label-medium:var(--font-size-17);   /* medium */
  --typo-detail-medium:var(--font-size-15);  /* medium */
  --typo-tag:var(--font-size-13);            /* medium — eyebrow/태그 */
  --typo-breadcrumb:var(--font-size-14);     /* medium — 상단배너 경로 */


  /* ---------- 3) SPACING — Atomic 스케일 (간격 전용, --space-{px}) ---------- */
  --space-2:2px;
  --space-4:4px;
  --space-8:8px;
  --space-10:10px;
  --space-12:12px;
  --space-15:15px;
  --space-16:16px;
  --space-20:20px;
  --space-22:22px;
  --space-24:24px;
  --space-26:26px;
  --space-28:28px;
  --space-30:30px;
  --space-40:40px;
  --space-44:44px;
  --space-48:48px;
  --space-56:56px;
  --space-60:60px;
  --space-70:70px;
  --space-72:72px;
  --space-80:80px;
  --space-100:100px;
  --space-120:120px;
  /* ---------- 3) SPACING — Semantic/치수 ---------- */
  --container:1400px;      /* 컨테이너 max-width (치수) */
  --header-h:88px;         /* 헤더 높이 (고정 치수) */
  /* 페이지 세로 리듬 (배너+콘텐츠+CTA 템플릿 공통) */
  --gap-hero-to-content:var(--space-120);    /* 배너 ↔ 첫 콘텐츠 섹션 상단 */
  --gap-content-to-footer:var(--space-120);  /* 마지막 콘텐츠 섹션 하단 ↔ CTA/푸터 */
  --pad-section:var(--space-100);            /* 콘텐츠 섹션 상·하 내부 패딩(공통) → 섹션 사이 간격 통일 */

  /* ---------- 5) SHAPE — Atomic ---------- */
  --radius-0:0;
  --border-1:1px;
  /* SHAPE — Semantic (--shape-*) */
  --shape-image:var(--radius-0);    /* 사진·지도 등 미디어 직각 */
  --shape-hairline:var(--border-1); /* 구분선·hairline (1px) */
}

/* ===== Reset ===== */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--ff-base);
  color:var(--c-text-primary);
  background:var(--c-bg-base);
  line-height:1.7;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  word-break:keep-all;
}
h1,h2,h3,h4,h5,p,figure,ul,ol{margin:0;}
ul,ol{padding:0;list-style:none;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;height:auto;border-radius:var(--shape-image);}
button{font-family:inherit;cursor:pointer;border:0;background:none;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}

.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--space-20);}
.br-mo{display:none;}   /* 모바일 전용 줄바꿈: PC는 한 줄, 모바일에서만 개행(앞 공백이 PC 단어 간격 유지) */

/* 공통 라벨/제목 */
/* ★ 섹션 서브타이틀 공통 — 전 페이지·전 섹션 동일색(단일 소스). 다크배경만 .on-dark */
.eyebrow{
  font-family:var(--font-latin);
  font-size:16px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--c-page-accent-sub);font-weight:400;   /* 서브타이틀 = 페이지 보조(서브) 대표색 */
}
.eyebrow.is-point{color:var(--c-page-accent-sub);}
.eyebrow.on-dark{color:rgba(255,255,255,.85);}
/* 섹션 타이틀 = 청록 48px */
.sec-title{
  font-family:var(--font-sans);
  font-weight:700;
  color:var(--c-text-brand);
  font-size:var(--typo-title-large);
  line-height:1.4;
  letter-spacing:normal;
}
/* (legacy 2단 타이틀 지원) */
.sec-title .sec-en{
  display:block;
  font-family:var(--font-latin);
  font-size:var(--typo-title-large);line-height:var(--line-height-title);font-weight:var(--font-weight-regular);
  color:var(--c-text-brand);
  letter-spacing:normal;
}
.sec-title .sec-ko{
  display:block;
  font-family:var(--font-sans);
  font-size:var(--font-size-41);line-height:var(--line-height-title);font-weight:var(--font-weight-regular);
  color:var(--c-text-primary);
  letter-spacing:normal;
}

/* 이미지 placeholder (사용자가 나중에 파일을 채움) */
.ph{
  display:block;width:100%;height:100%;
  object-fit:cover;
}

/* =========================================================
   HEADER / GNB / MEGA MENU
   ========================================================= */
/* 흰 배경 고정 헤더 — 풀너비 */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  height:var(--header-h);
  display:flex;align-items:center;
  background:#fff;
  box-shadow:0 1px 0 rgba(0,0,0,.06);
}
.site-header .header-inner{
  width:100%;margin:0 auto;padding:0 var(--space-40);
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-24);
}
.site-header .logo img{height:34px;width:auto;}
.site-header .logo .logo-dark{display:block;}
.site-header .logo .logo-white{display:none;}

/* 우측 연세대 엠블럼 */
.header-yonsei img{height:36px;width:auto;}
.header-yonsei .y-dark{display:block;}

/* GNB — 중앙 모음 (서브 컬럼은 JS로 각 대메뉴 아래 정렬) */
.gnb{display:flex;align-items:center;gap:var(--space-48);justify-content:center;}
.gnb > li > a{
  font-family:var(--font-latin);
  font-size:17px;letter-spacing:.04em;
  color:var(--c-text-secondary);
  padding:var(--space-30) 0;display:block;position:relative;
  white-space:nowrap;
  transition:color .25s ease;
}
.gnb > li.is-active > a,
.gnb > li:hover > a{color:var(--c-interactive-default);}

/* Mega dropdown — 풀너비 패널, slide-down */
.gnb-wrap{position:static;flex:1;}
.mega{
  position:fixed;left:0;right:0;top:var(--header-h);
  background:rgba(255,255,255,.95);
  box-shadow:0 12px 24px rgba(0,0,0,.06);
  border-top:var(--shape-hairline) solid var(--c-border-default);
  overflow:hidden;
  max-height:0;
  opacity:0;visibility:hidden;
  transition:max-height .4s ease, opacity .3s ease, visibility .4s;
  pointer-events:none;
}
.gnb-wrap:hover .mega,
.mega.is-open{
  max-height:340px;
  opacity:1;visibility:visible;
  pointer-events:auto;
}
.mega-inner{
  position:relative;min-height:236px;padding:var(--space-22) 0;
}
.mega-col{position:absolute;top:var(--space-22);text-align:center;}
.mega-col li a{
  display:block;padding:var(--space-4) 0;font-size:15px;color:#6b655e;
  font-family:var(--font-sans);transition:color .2s;
}
.mega-col li a:hover{color:var(--c-interactive-default);}

/* Mobile nav */
.nav-toggle{display:none;width:40px;height:40px;flex-direction:column;justify-content:center;gap:var(--space-4);}
.nav-toggle span{display:block;height:2px;background:var(--c-text-primary);transition:.3s;}

.mobile-nav{
  position:fixed;inset:0;z-index:1100;background:#fff;
  transform:translateX(100%);transition:transform .35s ease;
  overflow-y:auto;padding:var(--space-60) var(--space-24) var(--space-28);
}
.mobile-nav.is-open{transform:translateX(0);}
.mobile-nav .m-close{position:absolute;top:var(--space-22);right:var(--space-20);font-size:30px;line-height:1;color:var(--c-text-primary);}
.mobile-nav .m-group{border-bottom:var(--shape-hairline) solid var(--c-border-default);}
.mobile-nav .m-group > a{display:block;padding:var(--space-10) var(--space-4);font-family:var(--font-latin);font-size:18px;color:var(--c-text-primary);}
.mobile-nav .m-sub a{display:block;padding:var(--space-8) var(--space-16);font-size:15px;color:#6b655e;}
.mobile-nav .m-sub{padding-bottom:var(--space-4);display:none;}   /* 기본 접힘 · 현재 페이지 대분류만 JS로 펼침 */
.mobile-nav .m-group > a{position:relative;}
.mobile-nav .m-group > a::after{content:"+";position:absolute;right:var(--space-8);top:50%;transform:translateY(-50%);font-size:18px;color:var(--c-text-secondary);}
.mobile-nav .m-group.is-open > a::after{content:"\2212";}
.mobile-nav .m-group.is-open .m-sub{display:block;}
body.no-scroll{overflow:hidden;}

/* =========================================================
   REVEAL animation base
   ========================================================= */
.reveal{opacity:0;will-change:transform,opacity;}
.reveal[data-reveal="fadeInUp"]{transform:translateY(40px);transition:opacity .7s ease, transform .7s ease;}
.reveal[data-reveal="zoomIn"]{transform:scale(.92);transition:opacity .7s ease, transform .7s ease;}
.reveal.is-visible{opacity:1;transform:none;}

/* =========================================================
   ABOUT — page sections
   ========================================================= */

/* 공통 버튼 */
.btn-outline{
  display:inline-block;padding:var(--space-15) var(--space-30);
  border:1px solid var(--c-interactive-default);color:var(--c-interactive-default);
  font-family:var(--font-sans);font-size:16px;letter-spacing:.04em;
  transition:background .25s,color .25s;
}
/* 파생 토큰을 body에서 재선언 — --c-page-accent override가 body 스코프에서 재확정되도록.
   (:root에만 두면 :root 값으로 한 번 확정 후 상속돼 body.page-* override가 안 먹음) */
body{
  --c-text-brand:var(--c-page-accent);
  --c-interactive-default:var(--c-page-accent);
  --c-interactive-hover:var(--c-page-accent-sub);
  --c-interactive-btn:var(--c-page-accent);   /* 모바일 버튼 채움색도 페이지 대표색 (page-home은 아래서 override) */
}
body.page-home{--c-interactive-btn:var(--color-teal-300);}
/* GNB별 대표색 — body.page-* 스코프에서 --c-page-accent(+sub) override.
   text-brand·interactive-default·hover 가 이 토큰을 참조하므로 페이지 전체 강조색이 바뀐다. */
body.page-womens{--c-page-accent:var(--color-teal-400);--c-page-accent-sub:var(--color-beige-400);}    /* 메인 #78b3c0 · 서브(eyebrow) #b1a89d */
body.page-moms{--c-page-accent:var(--color-beige-400);--c-page-accent-sub:var(--color-teal-300);}        /* #b1a89d · sub #88bac5 */
body.page-wellaging{--c-page-accent:var(--color-teal-700);--c-page-accent-sub:var(--color-taupe-500);}   /* #007d8a · sub #a1988e */
body.page-beauty{--c-page-accent:var(--color-taupe-400);--c-page-accent-sub:var(--color-clay-400);}      /* #a1908c · sub #c39586 */
.btn-outline:hover{background:var(--c-interactive-btn);border-color:var(--c-interactive-btn);color:#fff;}
.btn-outline.on-dark{border-color:rgba(255,255,255,.7);color:#fff;}
.btn-outline.on-dark:hover{background:#fff;color:var(--c-text-primary);border-color:#fff;}

/* =========================================================
   HOME — 풀스크린 유튜브 배경영상 히어로
   ========================================================= */
.home-hero-video{
  position:relative;
  height:100vh;
  margin-top:0;   /* 영상이 화면 전체(100vh) 채우고 흰 헤더가 위에 겹침 */
  overflow:hidden;
  background:#000;
}
.home-hero-video .hv-frame{
  position:absolute;inset:0;
  pointer-events:none;
}
.home-hero-video iframe{
  position:absolute;
  width:max(100vw,177.78vh);
  height:max(56.25vw,100vh);
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;
  border:0;
}

/* =========================================================
   HOME — 인사말
   ========================================================= */
.home-greeting{padding:var(--space-120) 0 var(--space-120);background:#fff;}
.home-greeting .container{max-width:1200px;}
.home-greeting .eyebrow{display:block;text-align:center;margin-bottom:var(--space-15);}
.home-greeting .sec-title{text-align:center;margin-bottom:var(--space-60);}
.home-greeting .greeting-grid{
  display:flex;gap:var(--space-48);align-items:center;
  width:100%;margin:0 auto;
}
.home-greeting .greeting-circles-img{
  flex:0 0 500px;
}
.home-greeting .greeting-circles-img img{
  width:100%;aspect-ratio:2 / 1;object-fit:contain;
}
.home-greeting .g-circle{
  width:240px;height:240px;border-radius:50%;
  border:2px solid var(--c-interactive-default);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:var(--space-24);
}
.home-greeting .g-quote{
  font-family:var(--font-latin);font-size:46px;line-height:1;
  color:var(--c-text-brand);margin-bottom:var(--space-8);
}
.home-greeting .g-circle p{
  font-family:var(--font-sans);font-size:16px;line-height:1.7;color:var(--c-text-primary);
}
.home-greeting .greeting-text{flex:1;}
.home-greeting .greeting-text p{
  font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.7;color:var(--c-text-primary);
}
.home-greeting .greeting-team{margin:var(--space-100) auto 0;max-width:1000px;}
.home-greeting .greeting-team-frame{
  width:1000px;max-width:100%;aspect-ratio:1000 / 533;margin:0 auto;background:#e8e4de;
}
.home-greeting .greeting-team-frame img{width:100%;height:100%;object-fit:cover;}
.home-greeting .greeting-sign-img{
  margin-top:var(--space-26);text-align:center;
}
.home-greeting .greeting-sign-img img{
  display:inline-block;height:44px;width:auto;max-width:80%;object-fit:contain;
}

/* =========================================================
   HOME — SPECIAL POINT 01 (풀 배경 + 청록 오버레이)
   ========================================================= */
.sp01{
  position:relative;overflow:hidden;color:#fff;
  padding:var(--space-120) 0 var(--space-120);
}
.sp01 .sp01-bg{position:absolute;inset:0;z-index:0;}
.sp01 .sp01-bg img{width:100%;height:100%;object-fit:cover;}
.sp01 .sp01-overlay{position:absolute;inset:0;z-index:1;background:transparent;}
.sp01 .container{position:relative;z-index:2;}

.sp01 .sp01-head{
  padding-bottom:var(--space-100);
}
.sp01 .sp01-eyebrow{display:block;margin-bottom:var(--space-20);}
.sp01 .sp01-head-row{
  display:flex;gap:var(--space-44);align-items:stretch;justify-content:flex-start;
}
.sp01 .sp01-head-l{flex:0 0 auto;max-width:420px;}
.sp01 .sp01-head-l h3{
  font-family:var(--font-sans);font-weight:700;font-size:var(--typo-title-medium);line-height:1.4;color:#fff;
}
.sp01 .sp01-head-r{
  flex:0 0 auto;max-width:340px;
  display:flex;align-items:center;
  border-left:3px solid #fff;padding-left:var(--space-44);
}
.sp01 .sp01-head-r p{font-size:var(--typo-body-medium);line-height:1.7;color:rgba(255,255,255,.92);}

/* SPECIAL 글자 이미지 — 카드 영역 우측 상단에 절대배치(카드1 top과 같은 y) */
.sp01 .sp01-word{
  position:absolute;top:0;right:0;
  text-align:right;line-height:1;margin:0;
  pointer-events:none;
}
.sp01 .sp01-word img{
  display:inline-block;width:380px;max-width:100%;
  aspect-ratio:4.5 / 1;object-fit:contain;
}

/* 카드 4개 — 카드1 가장 큼, 흰카드는 그 높이의 절반보다 조금 크게, 상단 정렬 */
.sp01 .sp01-cards{
  position:relative;
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:var(--space-22);align-items:end;
}
.sp01 .sp-card{
  background:#fff;min-height:250px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:var(--space-40) var(--space-24);
}
.sp01 .sp-card .sp-icon{
  width:84px;height:84px;border-radius:50%;overflow:hidden;
  background:var(--c-interactive-default);margin-bottom:var(--space-24);
}
.sp01 .sp-card .sp-icon img{width:100%;height:100%;object-fit:cover;}
.sp01 .sp-card .sp-card-title{
  font-family:var(--font-sans);font-weight:700;font-size:20px;line-height:1.4;color:var(--c-text-brand);
}
/* 카드1 — 큰 피처 카드 (코드 박스: 5px #EEDEBC 테두리 + sp01-bg.jpg 배경) */
.sp01 .sp-card-feature{
  background:linear-gradient(rgba(0,30,35,.55),rgba(0,30,35,.55)), url('images/home/sp01-bg.jpg') center/cover no-repeat;
  border:5px solid var(--c-border-strong);
  justify-content:center;min-height:420px;
}
.sp01 .sp-card-feature .sp-badge{
  width:130px;height:130px;margin-bottom:var(--space-26);
}
.sp01 .sp-card-feature .sp-badge img{width:100%;height:100%;object-fit:contain;background:transparent;}
.sp01 .sp-card-feature .sp-card-title{color:#fff;font-size:23px;}
.sp01 .sp-card-feature .sp-card-name{margin-top:var(--space-10);font-size:16px;color:rgba(255,255,255,.85);}
.sp01 .sp-card-feature .sp-card-btn{margin-top:var(--space-28);padding:var(--space-12) var(--space-26);font-size:14px;}

/* =========================================================
   HOME — SPECIAL POINT 02 (좌글 우이미지)
   ========================================================= */
.sp02{padding:var(--space-120) 0;background:#fff;position:relative;overflow:hidden;}
.sp02 .sp02-inner{display:flex;gap:var(--space-60);align-items:flex-start;}
.sp02 .sp02-text{flex:1;align-self:center;}
.sp02 .eyebrow{display:block;margin-bottom:var(--space-26);}
.sp02 h3{font-size:var(--typo-title-medium);line-height:1.4;font-family:var(--font-sans);font-weight:700;color:var(--c-text-brand);margin-bottom:var(--space-28);}
.sp02 .sp02-body{font-size:var(--typo-body-medium);line-height:1.7;color:var(--c-text-primary);margin-bottom:var(--space-48);}
/* 우측 이미지: 좌우 안 잘리게 자연 비율 유지(contain), 크게 채움.
   상단 = 좌측 eyebrow 줄 시작 y, 하단 = 섹션 하단(아래 padding 만큼 음수 마진). */
.sp02 .sp02-figure{flex:0 0 50.6%;position:relative;margin-bottom:-140px;align-self:stretch;}
.sp02 .sp02-frame{
  position:relative;z-index:1;
  width:100%;height:100%;overflow:hidden;background:transparent;
}
/* 좌우 미크롭(contain) 유지 + 하단 밀착(object-position:bottom)으로 섹션 하단 공백 제거 */
.sp02 .sp02-frame img{width:100%;height:100%;display:block;object-fit:contain;object-position:bottom center;}

/* =========================================================
   HOME — SPECIAL POINT 03 (좌글 우4사진 콜라주)
   ========================================================= */
.sp03{padding:var(--space-120) 0;background:#f9f7f4;}
.sp03 .sp03-inner{display:flex;gap:var(--space-60);align-items:center;}
.sp03 .sp03-text{flex:1;}
.sp03 .eyebrow{display:block;margin-bottom:var(--space-26);}
.sp03 h3{font-size:var(--typo-title-medium);line-height:1.4;font-family:var(--font-sans);font-weight:700;color:var(--c-text-brand);margin-bottom:var(--space-40);}
.sp03 .sp03-list{display:grid;gap:var(--space-20);}
.sp03 .sp03-item{display:flex;align-items:flex-start;gap:var(--space-15);}
.sp03 .sp03-check-img{
  flex:0 0 26px;width:26px;height:26px;object-fit:contain;margin-top:var(--space-4);
}
.sp03 .sp03-item > span:last-child{font-size:var(--typo-body-medium);line-height:1.7;color:var(--c-text-primary);font-family:var(--font-sans);}
.sp03 .sp03-item em{font-style:normal;color:var(--c-text-brand);font-weight:700;}

/* 우측 4사진 콜라주 — 고정 px 배치(이미지 원본 비율 그대로, 늘림 금지) */
/* 좌: img2(328×433). 우: 상단 img1(445×490) + 하단 img3·img4(211×232 나란히).
   gap 18px 균일. 각 셀=이미지 크기라 회색배경(#e8e4de) 밖으로 안 보임. 겹침 0.
   일부 구간이 컨테이너를 삐져나가는 건 의도된 것(그대로 둠).
   우측 컬럼은 211+211+18=440이지만 img1(445)이 약간 더 넓어 그만큼만 차지. */
.sp03 .sp03-gallery{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:328px 211px 211px;
  grid-template-rows:490px 232px;
  column-gap:var(--space-20);row-gap:var(--space-20);
  align-items:start;justify-items:start;
}
.sp03 .sp03-g{overflow:hidden;background:#e8e4de;}
.sp03 .sp03-g img{display:block;width:100%;height:100%;object-fit:cover;}
/* g2(img2): 좌측 세로 328×433, 두 행에 걸침, 세로 중앙정렬 */
.sp03 .sp03-g2{grid-row:1 / 3;grid-column:1;align-self:center;width:328px;height:433px;}
/* g1(img1): 우측 상단 445×490 (우측 2컬럼+gap=440보다 5px 넓게 삐져나옴, 의도됨) */
.sp03 .sp03-g1{grid-row:1;grid-column:2 / 4;width:445px;height:490px;}
/* g3·g4: 우측 하단 작은 2장 나란히, 각 211×232 */
.sp03 .sp03-g3{grid-row:2;grid-column:2;width:211px;height:232px;}
.sp03 .sp03-g4{grid-row:2;grid-column:3;width:211px;height:232px;}

/* =========================================================
   HOME — Pre-footer CTA
   ========================================================= */
.prefooter{
  padding:var(--space-120) 0;text-align:center;color:#fff;position:relative;overflow:hidden;
  min-height:520px;display:flex;align-items:center;
}
.prefooter .pf-bg{
  position:absolute;inset:0;z-index:0;
  background:url('images/home/cta-bg.jpg') center/cover no-repeat fixed;
}
.prefooter .pf-bg img{display:none;}
.prefooter .pf-overlay{position:absolute;inset:0;z-index:1;background:rgba(67,60,53,0.25);}
.prefooter .container.pf-inner{position:relative;z-index:2;width:100%;}
.prefooter .eyebrow{display:block;margin-bottom:var(--space-20);color:rgba(255,255,255,.75);}
.prefooter h2{font-size:var(--typo-title-medium);line-height:1.4;font-family:var(--font-sans);font-weight:700;margin-bottom:var(--space-40);color:#fff;}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{background:#007d8a;color:#fff;}
.footer-partners{
  background:#fff;
  padding:var(--space-20) 0;
  border-top:1px solid var(--c-border-default);
}
.footer-partners .partners-row{
  display:flex;align-items:center;justify-content:space-around;gap:var(--space-30);flex-wrap:wrap;
}
.footer-partners .partners-row img{height:60px;width:auto;}
.footer-bottom{padding:var(--space-48) 0 var(--space-60);}
.footer-bottom .container{max-width:none;padding:0;}
.footer-bottom .fb-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-30);flex-wrap:wrap;padding:0 var(--space-40);}
.footer-bottom .fb-links{display:flex;gap:var(--space-20);font-size:14px;margin-bottom:var(--space-20);list-style:none;padding:0;}
.footer-bottom .fb-links li{display:flex;align-items:center;}
.footer-bottom .fb-links a{color:var(--c-text-inverse-soft);font-weight:700;}
.footer-bottom .fb-links span{color:rgba(255,255,255,.55);}
.footer-bottom .fb-info{font-size:13px;line-height:1.7;color:rgba(255,255,255,.85);}
.footer-bottom .fb-copy{font-size:13px;color:rgba(255,255,255,.7);margin-top:var(--space-10);}
.footer-bottom .fb-badges{display:flex;align-items:center;gap:var(--space-22);}
.footer-bottom .fb-badges img{height:34px;width:auto;}
/* 연세대 로고(첫번째)는 윈 로고 대비 시각적으로 작아 보여 살짝 키움 */
.footer-bottom .fb-badges img:first-child{height:43px;}

/* =========================================================
   HOME — mobile-only elements (PC default = hidden)
   ========================================================= */
/* 모바일 전용 블록들은 PC에서 숨김 */
.home-hero-m,
.home-intro-video,
.sp01-m,
.sp03-m,
.pf-mobile-img,
.header-yonsei-m,
.fb-logo-m,
.sp02 .sp-num-02,
.sp01 .sp-num{display:none;}

/* SP01 흰배경 타이틀 (PC+모바일 공통) */
.sp01-intro{background:#fff;text-align:center;padding:var(--space-120) 0 var(--space-60);}
/* eyebrow "WE ARE SPECIAL" 색을 다른 섹션 서브타이틀과 통일 (is-point 청록 override) */
.sp01-intro .eyebrow,
.sp01-intro .eyebrow.is-point{display:block;margin-bottom:var(--space-15);color:var(--c-text-secondary);}
.sp01-intro .sec-title{color:var(--c-text-brand);}

/* 번호 펜타곤 이미지 공통 */
.sp-num{margin:0 auto var(--space-22);text-align:center;}
.sp-num img{display:inline-block;width:64px;height:auto;object-fit:contain;}

/* 협력병원 로고 marquee (모바일에서만 애니메이션, PC는 정렬 유지) */
.footer-partners .partners-track{
  display:flex;align-items:center;justify-content:space-around;gap:var(--space-30);
  flex-wrap:wrap;width:100%;
}
.footer-partners .partners-track img[aria-hidden="true"]{display:none;} /* PC: 복제본 숨김 */

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

/* =========================================================
   RESPONSIVE — 768px
   ========================================================= */
@media (max-width:768px){
  .br-mo{display:inline;}   /* 모바일: 줄바꿈 활성화 */
  :root{
    --header-h:64px;
    --gap-hero-to-content:var(--space-60);       /* 첫 섹션 상단여백 모바일 통일값 */
    --pad-section:var(--space-56);               /* 콘텐츠 섹션 상·하 패딩 모바일값 */
    /* Semantic typo 모바일 재지정 → 모바일 atomic 스텝으로 매핑 */
    --typo-display:var(--font-size-41);          /* 배너 타이틀 모바일 (≈40) — heading(36)보다 큼 */
    --typo-body-large:var(--font-size-18);       /* 모바일 리드 */
    --typo-body-medium:var(--font-size-16);      /* 본문 일괄 축소 */
    --typo-heading:var(--font-size-36);          /* 모바일 heading */
    --typo-title-large:var(--font-size-30);      /* 모바일 32px 기준 -2px */
    --typo-title-medium:var(--font-size-26);     /* 모바일 28px 기준 -2px */
    /* 라벨·태그·브레드크럼 모바일 스텝 */
    --typo-label-large:var(--font-size-17);
    --typo-label-medium:var(--font-size-15);
    --typo-detail-medium:var(--font-size-13);
    --typo-tag:var(--font-size-12);
    --typo-breadcrumb:var(--font-size-12);
  }
  /* 6. 모바일 컨테이너 좌우 거터 14px (PC는 20px 유지) */
  .container{padding:0 var(--space-15);}
  .gnb, .header-yonsei, .mega{display:none;}
  .nav-toggle{display:flex;}
  .site-header .header-inner{padding:0 var(--space-20);gap:var(--space-10);}
  .site-header .logo img{height:30px;}

  /* 1. 모바일 헤더 연세대 로고 (로고 옆, 햄버거 왼쪽) */
  .site-header .header-inner{justify-content:flex-start;}
  .header-yonsei-m{display:block;margin-right:auto;}
  .header-yonsei-m img{height:26px;width:auto;}

  /* 1-B. 다크 히어로 페이지: 스크롤 전 투명 헤더 + 흰 로고/햄버거 */
  body:has(.about-hero) .site-header:not(.is-scrolled),
  body.page-home .site-header:not(.is-scrolled){background:transparent;box-shadow:none;}
  /* 로고: 투명 상태에선 흰 로고로 교체(연세·햄버거만 filter) */
  body:has(.about-hero) .site-header:not(.is-scrolled) .logo .logo-dark,
  body.page-home .site-header:not(.is-scrolled) .logo .logo-dark{display:none;}
  body:has(.about-hero) .site-header:not(.is-scrolled) .logo .logo-white,
  body.page-home .site-header:not(.is-scrolled) .logo .logo-white{display:block;}
  body:has(.about-hero) .site-header:not(.is-scrolled) .header-yonsei-m img,
  body.page-home .site-header:not(.is-scrolled) .header-yonsei-m img{filter:brightness(0) invert(1);}
  body:has(.about-hero) .site-header:not(.is-scrolled) .nav-toggle span,
  body.page-home .site-header:not(.is-scrolled) .nav-toggle span{background:#fff;}
  .site-header{transition:background .25s ease, box-shadow .25s ease;}

  /* 2. 모바일 히어로 (이미지+텍스트), 영상 숨김 */
  .home-hero-video{display:none;}
  .home-hero-m{
    display:block;position:relative;height:500px;min-height:0;
    overflow:hidden;background:#cfd6d8;
  }
  .home-hero-m .hm-bg{position:absolute;inset:0;z-index:0;}
  .home-hero-m .hm-bg img{width:100%;height:100%;object-fit:cover;}
  .home-hero-m .hm-overlay{position:absolute;inset:0;z-index:1;background:rgba(0,0,0,.28);}
  .home-hero-m .hm-inner{
    position:relative;z-index:2;height:100%;
    display:flex;flex-direction:column;justify-content:center;align-items:center;
    padding:0 var(--space-28);text-align:center;
  }
  .home-hero-m .hm-title{
    font-family:var(--font-sans);font-weight:700;color:#fff;
    font-size:34px;line-height:1.35;margin:0;
    text-shadow:0 2px 12px rgba(0,0,0,.35);
  }

  /* ★ 공유 컴포넌트: 히어로 다음 첫 섹션 = 좌우상단 둥근 시트(모바일). 코너 밖은 히어로가 보임.
     전 페이지 공통 — 첫 섹션에 class="after-hero" 추가. (배경 흰색, 위로 26px 겹침) */
  .after-hero{border-radius:26px 26px 0 0;margin-top:-26px;position:relative;z-index:2;background:#fff;}

  /* 3. 소개 영상 섹션 (모바일 전용) */
  .home-intro-video{display:block;background:#fff;padding:var(--gap-hero-to-content) 0 var(--space-20);}   /* 상단여백=--gap-hero-to-content 공용 */
  .home-intro-video .eyebrow{display:block;text-align:center;margin-bottom:var(--space-12);}
  .home-intro-video .sec-title{text-align:center;margin-bottom:var(--space-30);}
  .home-intro-video .iv-frame{
    position:relative;width:100%;aspect-ratio:16 / 9;
    overflow:hidden;background:#000;border-radius:6px;
  }
  .home-intro-video .iv-frame iframe{
    position:absolute;inset:0;width:100%;height:100%;border:0;
  }

  /* 섹션 타이틀 모바일 비례 축소 (.sec-title 은 --typo-title-large 토큰으로 일괄 처리) */
  .sec-title .sec-en{font-size:var(--typo-title-large);}
  .sec-title .sec-ko{font-size:var(--font-size-25);}

  /* 히어로 영상 */
  .home-hero-video{height:64vh;}

  /* 인사말 */
  .home-greeting{padding:var(--space-70) 0 var(--space-80);}
  .home-greeting .sec-title{margin-bottom:var(--space-40);}
  .home-greeting .greeting-grid{flex-direction:column;gap:var(--space-40);}
  .home-greeting .greeting-circles-img{flex:1 1 auto;width:100%;max-width:440px;margin:0 auto;}
  /* 본문 크기는 --typo-body-medium 토큰으로 일괄 축소(개별 오버라이드 제거) */
  .home-greeting .greeting-team{margin-top:var(--space-48);}
  .home-greeting .greeting-sign-img img{height:30px;}

  /* 5-T. SP01 흰배경 타이틀 (모바일) */
  .sp01-intro{padding:var(--space-56) 0 var(--space-16);}

  /* 6 (공통 버튼). 모바일은 hover 없으니 hover색을 디폴트로 */
  .btn-outline{
    background:var(--c-interactive-btn);border-color:var(--c-interactive-btn);color:#fff;
  }

  /* 5. SP01 — 모바일 텍스트 기반 재구성 (PC 카드 숨김) */
  /* 청록 색배경 제거 → 인물 이미지를 섹션 전체 배경으로, 텍스트 위로 비쳐 보이게 */
  /* 이미지 자체를 배경으로(dim 없이 선명) — 섹션 높이=이미지 비율(437x751)이라 인물 안 잘림. 텍스트는 그 위에 오버레이 */
  .sp01{
    padding:var(--space-56) 0 0;
    background:url('images/home/sp01-mobile-bg.jpg') top center / 100% auto no-repeat;
    min-height:calc(100vw * 751 / 437);
  }
  .sp01 .sp01-m-title,
  .sp01 .sp01-m-list li{text-shadow:0 1px 8px rgba(0,0,0,.55);}
  /* 인물 사진 블록은 배경으로 일원화 → 얹지 않음 */
  .sp01 .sp01-m-photo{display:none;}
  .sp01 .sp01-pc{display:none;}
  .sp01 .sp01-bg{display:none;}
  .sp01 .sp01-overlay{display:none;}
  .sp01 .sp01-m{display:block;text-align:center;}
  .sp01 .sp01-m .sp-num{display:block;}
  .sp01 .sp01-m-title{
    font-family:var(--font-sans);font-weight:700;color:#fff;
    font-size:22px;line-height:1.4;margin-bottom:var(--space-24);  /* 모바일 타이틀 -2px */
    text-shadow:0 2px 10px rgba(0,0,0,.35);
  }
  .sp01 .sp01-m-list{
    display:inline-block;text-align:left;margin:0 auto;
    color:#fff;font-family:var(--font-sans);
    text-shadow:0 1px 8px rgba(0,0,0,.4);
  }
  .sp01 .sp01-m-list li{font-size:16px;line-height:1.9;color:#fff;}
  /* (인물 사진은 위에서 풀폭 블록으로 표시 — dim 없이 선명·안 잘림) */

  /* 6. SP02 — 번호 이미지 + 이미지 텍스트 하단으로 */
  .sp02{padding:var(--space-60) 0;}
  .sp02 .sp02-inner{flex-direction:column;gap:var(--space-40);}
  .sp02 .sp-num-02{display:block;}
  .sp02 .sp02-figure{order:1;width:100%;margin-bottom:0;}  /* 이미지 아래로 */
  .sp02 .sp02-text{order:0;text-align:center;}
  .sp02 .sp02-text .eyebrow{margin-top:var(--space-8);}
  /* .sp02 h3 는 --typo-title-medium 토큰으로 일괄(모바일 26px) */

  /* 7. SP03 — 모바일 전면 변경 (PC 콜라주 숨김) */
  .sp03{padding:var(--space-60) 0;}
  .sp03 .sp03-pc{display:none;}
  .sp03 .sp03-m{display:block;text-align:center;}
  .sp03 .sp03-m .sp-num{display:block;}
  .sp03 .sp03-m-title{
    font-family:var(--font-sans);font-weight:700;color:var(--c-text-brand);
    font-size:24px;line-height:1.4;margin-bottom:var(--space-28);  /* 모바일 타이틀 -2px */
  }
  .sp03 .sp03-m-box{
    background:#fff;border:var(--shape-hairline) solid var(--c-border-default);
    padding:var(--space-30) var(--space-22);margin-bottom:var(--space-20);text-align:center;
  }
  .sp03 .sp03-m-icon{width:84px;height:auto;margin:0 auto var(--space-16);object-fit:contain;}
  .sp03 .sp03-m-box-title{
    font-family:var(--font-sans);font-weight:700;font-size:19px;
    color:var(--c-text-brand);margin-bottom:var(--space-10);
    text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px;
  }
  .sp03 .sp03-m-box-body{font-size:15px;line-height:1.7;color:var(--c-text-primary);font-family:var(--font-sans);}
  .sp03 .sp03-m-photo{margin:0 0 var(--space-20);}
  .sp03 .sp03-m-photo img{width:100%;height:auto;background:#e8e4de;}

  /* 8. CTA — 모바일 이미지 한 장 */
  .prefooter{padding:0;min-height:0;display:block;}
  .prefooter .pf-bg,.prefooter .pf-overlay,.prefooter .pf-inner{display:none;}
  .prefooter .pf-mobile-img{display:block;}
  .prefooter .pf-mobile-img img{width:100%;height:auto;display:block;background:#cfd6d8;}

  /* 9. 푸터 정리 */
  /* ① 연세대+윈 배지 숨김  ② 윈 로고를 약관 위로  ③ 협력로고 marquee */
  .footer-bottom .fb-badges{display:none;}
  .footer-bottom .fb-inner{flex-direction:column;}
  /* 로고↔약관 간격 넓히고, 약관↔대표정보 간격 좁힘 */
  .fb-logo-m{display:block;margin-bottom:var(--space-30);}
  .fb-logo-m img{height:30px;width:auto;}
  .footer-bottom .fb-links{margin-bottom:var(--space-8);}

  .footer-partners{padding:var(--space-24) 0;overflow:hidden;}
  .footer-partners .partners-row{overflow:hidden;padding:0;}
  .footer-partners .partners-track{
    flex-wrap:nowrap;justify-content:flex-start;width:max-content;gap:var(--space-48);
    animation:partners-marquee 18s linear infinite;
  }
  .footer-partners .partners-track img{height:42px;width:auto;flex:0 0 auto;}
  .footer-partners .partners-track img[aria-hidden="true"]{display:block;} /* 복제본 표시 */
}

/* =========================================================
   ABOUT/DOCTORS — 의료진 소개
   ========================================================= */
/* 히어로 = 공통 .about-hero 템플릿 사용. 배경만 의료진 이미지로 override */
.about-hero.ah-doctors::before{background-image:url('images/doctors/doctors-hero.jpg');}

/* ---- 인트로 + 소개 영상 (YONSEI UNIVERSITY) — 서브타이틀/타이틀 표준 디자인 ---- */
.doctors-intro{background:#fff;text-align:center;padding:var(--gap-hero-to-content) 0 var(--space-40);}
.doctors-intro .eyebrow{display:block;margin-bottom:var(--space-16);}
.doctors-intro .sec-title{margin:0 0 var(--space-48);}
.di-video{max-width:1180px;margin:0 auto;}
.dv-frame{
  position:relative;width:100%;aspect-ratio:16 / 9;background:#e7e6e4;
  overflow:hidden;cursor:pointer;
}
.dv-frame .dv-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
/* 커버가 흰 배경이라 본문과 구분되게 dim 5% (재생 전만) */
.dv-frame:not(.is-playing)::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(0,0,0,.05);pointer-events:none;}
.dv-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.dv-play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;
  width:76px;height:76px;border-radius:50%;background:rgba(30,40,42,.55);transition:background .2s;
}
.dv-frame:hover .dv-play,.dv-frame:focus-visible .dv-play{background:var(--c-interactive-default);}
.dv-play::after{
  content:"";position:absolute;top:50%;left:56%;transform:translate(-50%,-50%);
  border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent #fff;
}
.dv-frame.is-playing .dv-cover,.dv-frame.is-playing .dv-play{display:none;}

/* ---- 사진 갤러리 (자동 흐름 + 좌우 버튼, JS 구동 · 무한루프) ---- */
.doctors-gallery{position:relative;background:#fff;padding:var(--space-72) 0 var(--space-72);overflow:hidden;}
.dg-viewport{overflow:hidden;width:100%;}
.dg-track{display:flex;width:max-content;will-change:transform;}
.dg-item{
  flex:0 0 auto;width:calc((100vw - 56px) / 7);aspect-ratio:1 / 1;margin:0 var(--space-8) 0 0;   /* 한 줄 7칸(6풀+양끝 반), 1:1 */
  background:#e8e4de;overflow:hidden;
}
.dg-item img{width:100%;height:100%;object-fit:cover;}
.dg-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.92);
  box-shadow:0 2px 10px rgba(0,0,0,.15);color:var(--c-text-brand);
  font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center;
}
.dg-arrow:hover{background:var(--c-interactive-default);color:#fff;}
.dg-prev{left:var(--space-16);}
.dg-next{right:var(--space-16);}
.dg-grid-m{display:none;}   /* 모바일 3×3 그리드는 모바일에서만 */

/* ---- DOCTOR PROFILE 타이틀 — 아래 프로필 섹션 경계 바로 위 ---- */
/* 하단 padding 0 + line-height 1 → 텍스트 하단이 아래 섹션 배경 경계에 밀착 */
.doctors-profile-head{background:#fff;text-align:center;padding:var(--space-80) 0 0;}
.doctors-profile-head .dp-eyebrow{
  display:inline-block;margin:0 0 -0.17em;line-height:1;   /* 하단을 아래 섹션 배경 경계에 완전 밀착 */
  font-family:var(--font-latin);font-style:italic;font-weight:var(--font-weight-regular);
  font-size:var(--typo-heading);color:var(--c-text-brand);   /* heading(60), regular. Cardo 이탤릭 400만 로드돼 crisp */
}

/* ---- 의료진 프로필 — 의사별 풀배경 교차 (연한베이지 #f8f6f1 / 흰색) ---- */
.doctors-profile{padding:0;}
.doctor-list{list-style:none;margin:0;padding:0;}
.doctor-card{margin:0;padding:var(--space-120) 0;background:var(--c-bg-subtle);}  /* 1·3 = #f8f6f1 */
.doctor-card:nth-child(even){background:var(--c-bg-base);}            /* 2·4 = 흰색 */
/* 풀배경 유지 위해 container div 없이 자식에 폭 제한(중앙정렬) */
.doctor-card .dc-quote,
.doctor-card .dc-main{max-width:1160px;margin-left:auto;margin-right:auto;padding-left:var(--space-20);padding-right:var(--space-20);}
/* 인용 — 손글씨 웹폰트로 직접 렌더(이미지 대체), 중앙정렬, 연한 베이지 */
.doctor-card .dc-quote{
  font-family:'Nanum Pen Script',cursive;
  font-size:var(--typo-heading);line-height:1.35;color:var(--c-text-secondary);
  text-align:center;margin-top:0;margin-bottom:var(--space-80);
}
/* 앞에 큰 따옴표 — 세리프로 crisp, 텍스트보다 크게, 더 연한 베이지. em 낮춰 텍스트 커져도 따옴표 크기 유지 */
.doctor-card .dc-quote::before{
  content:"\201C";
  font-family:Georgia,'Times New Roman',serif;font-weight:700;
  font-size:1.3em;color:var(--c-text-eyebrow);
  vertical-align:-0.38em;margin-right:.1em;line-height:0;
}
.doctor-card .dc-main{
  display:grid;grid-template-columns:auto 1fr;
  grid-template-areas:"photo head" "photo body";
  column-gap:var(--space-60);align-items:start;
}
.doctor-card .dc-head{grid-area:head;}
.doctor-card .dc-photo{
  grid-area:photo;width:auto;height:600px;margin:0;   /* 높이 600 고정, 가로는 680/785 비율(≈520) */
  aspect-ratio:680 / 785;background:#e8e4de;overflow:hidden;border-radius:var(--shape-image);
}
.doctor-card .dc-photo img{width:100%;height:100%;object-fit:cover;}
.doctor-card .dc-photo--illust{background:#eef1f0;}
.doctor-card .dc-body{grid-area:body;min-width:0;padding-top:var(--space-8);}
.doctor-card .dc-spec{
  font-family:var(--font-sans);font-size:var(--typo-detail-medium);font-weight:var(--font-weight-bold);
  letter-spacing:.2em;color:var(--c-text-secondary);margin:0 0 var(--space-8);
}
.doctor-card .dc-name{
  font-family:var(--font-sans);font-weight:700;line-height:1.2;color:var(--c-text-brand);   /* 이름 청록 */
  font-size:var(--typo-title-medium);margin:0 0 var(--space-30);
}
/* 직함 = 배지(pill, 양옆 라운드 최대). 골드 채움 + 흰 글자 → 청록 이름과 대비(안 A) */
.doctor-card .dc-name .dc-role{
  display:inline-block;vertical-align:middle;
  background:var(--color-gold-500);color:var(--c-text-inverse);
  font-size:var(--typo-label-medium);font-weight:700;
  padding:var(--space-4) var(--space-16);border-radius:999px;margin-left:var(--space-10);
}
/* 경력 제목 — 진료시간표 라벨과 동일 위계 */
.doctor-card .dc-career-label{
  font-family:var(--font-sans);font-weight:700;color:var(--c-text-brand);
  font-size:var(--typo-body-medium);margin:0 0 var(--space-10);
}
.doctor-card .dc-career{list-style:none;margin:0 0 var(--space-30);padding:0;}
.doctor-card .dc-career li{
  position:relative;padding-left:var(--space-16);
  font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.9;color:var(--c-text-primary);
}
.doctor-card .dc-career li::before{
  content:"·";position:absolute;left:var(--space-2);top:0;color:var(--c-text-primary);
}

/* 진료시간표 */
.dc-schedule{margin-top:var(--space-8);}
.dc-sch-label{
  font-family:var(--font-sans);font-weight:700;color:var(--c-text-brand);
  font-size:var(--typo-body-medium);margin:0 0 var(--space-10);   /* 본문 크기로 키움 */
}
.dc-sch-table{border-collapse:collapse;width:100%;max-width:none;text-align:center;table-layout:fixed;}  /* 사진 축소분만큼 표 가로 확장(본문 폭 가득) */
.dc-sch-table th,.dc-sch-table td{border:1px solid var(--c-border-default);padding:var(--space-10) var(--space-4);height:44px;font-family:var(--font-sans);}
.dc-sch-table thead th{background:var(--c-bg-subtle);color:var(--c-text-primary);font-weight:700;font-size:var(--typo-label-large);}
.dc-sch-table tbody th{background:var(--c-bg-subtle);color:var(--c-text-primary);font-weight:700;font-size:var(--typo-label-large);width:64px;}
.dc-sch-table td{background:#fff;}
.dc-sch-table td.on::after{
  content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--c-interactive-default);
}
.dc-sch-table td.txt{color:var(--c-text-brand);font-weight:700;font-size:var(--typo-label-medium);line-height:1.2;}
.dc-sch-note{
  font-family:var(--font-sans);font-weight:700;color:var(--c-text-brand);
  font-size:var(--typo-detail-medium);margin:var(--space-12) 0 0;
}

/* 메가메뉴 현재 페이지 강조 */
.mega-col li a.is-current{color:var(--c-interactive-default);font-weight:700;}

@media (max-width:768px){
  /* 히어로는 공통 .about-hero 모바일 규칙 사용 */
  .doctors-intro{padding-bottom:var(--space-30);}   /* 상단여백=--gap-hero-to-content 공용 */
  .doctors-intro .sec-title{margin-bottom:var(--space-28);}
  .doctors-intro .sec-title br{display:none;}

  /* 갤러리: 모바일은 슬라이드 숨기고 3×3 그리드(_mo.jpg) */
  .doctors-gallery{padding:var(--space-40) 0;}
  .doctors-gallery .dg-viewport,.doctors-gallery .dg-arrow{display:none;}
  .dg-grid-m{display:block;}
  .dg-grid-m img{width:100%;height:auto;display:block;}   /* 3×3 통이미지 한 장 */

  .doctors-profile-head{padding:var(--space-56) 0 0;}
  .doctor-card{padding:var(--space-70) 0;}
  /* 첫 카드 제외 모든 카드: 상단 둥근 사각형 — 위쪽 26px는 이전 섹션 배경이 보임 */
  .doctor-card:not(:first-child){border-radius:26px 26px 0 0;margin-top:-26px;position:relative;z-index:1;}
  .doctor-card .dc-quote,
  .doctor-card .dc-main{padding-left:var(--space-15);padding-right:var(--space-15);}   /* 모바일 좌우 14px */
  .doctor-card .dc-quote{margin-top:var(--space-20);margin-bottom:0;}   /* 인용문 위 여백 */
  /* 인용문↔head 사이 세로 구분선 */
  .doctor-card .dc-quote::after{content:"";display:block;width:1px;height:44px;background:var(--c-text-secondary);margin:var(--space-24) auto;}
  /* 모바일: head(전문의·이름·직함) → 사진 → 본문 순, head 가운데정렬 */
  .doctor-card .dc-main{
    display:grid;grid-template-columns:1fr;grid-template-areas:"head" "photo" "body";row-gap:var(--space-24);
  }
  .doctor-card .dc-head{text-align:center;margin-bottom:var(--space-4);}
  /* 전문의·이름·직함 2단계씩 확대 */
  .doctor-card .dc-spec{font-size:var(--typo-label-large);margin-bottom:var(--space-12);}   /* 전문의↔이름 간격 살짝 확대 */
  .doctor-card .dc-name{font-size:var(--typo-title-large);margin-bottom:0;}
  .doctor-card .dc-name .dc-role{font-size:var(--typo-body-medium);}
  /* 사진: 위쪽 아치(원형)·아래 사각형 */
  .doctor-card .dc-photo{
    width:100%;max-width:340px;height:auto;margin:0 auto;
    aspect-ratio:68 / 92;                        /* 모바일 세로 더 길게 */
    border-radius:50% 50% 0 0 / 40% 40% 0 0;     /* 세로 늘어난 만큼 아치도 더 길어짐 */
  }
  .doctor-card .dc-body{padding-top:0;}
  .dc-sch-table{max-width:100%;}
}

/* =========================================================
   서브페이지 공통 — 사진 히어로 (원본: 다크 사진 배경 + 화이트 타이틀)
   ========================================================= */
.about-hero{
  position:relative;overflow:hidden;color:#fff;
  width:100%;                 /* 풀폭 배너 */
  background:#243033;
  padding:calc(var(--header-h) + 96px) 0 var(--space-120);
  min-height:100vh;display:flex;align-items:center;
}
.about-hero::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:url('images/facility/hero-surgeon.jpg') center/cover no-repeat;
}
.about-hero.has-video::before{display:none;}   /* 영상 배경일 땐 이미지 숨김 */
/* 유튜브 배경 영상 — 히어로를 꽉 채우도록 cover 스케일 */
.about-hero .ah-video{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.about-hero .ah-video iframe{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:100vw;height:56.25vw;            /* 16:9 (뷰포트 너비 기준) */
  min-height:100%;min-width:177.78vh;    /* 16:9 (뷰포트 높이 기준) → 항상 cover */
  border:0;
}
/* 자체호스팅 배경 영상 — cover */
.about-hero .ah-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.about-hero::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(20,30,32,.78) 0%,rgba(20,30,32,.45) 55%,rgba(20,30,32,.30) 100%);
}
.about-hero .ah-inner{position:relative;z-index:2;width:100%;}
.about-hero .ah-crumb{
  font-family:var(--font-sans);font-size:var(--typo-breadcrumb);font-weight:var(--font-weight-medium);
  letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.85);margin:0 0 var(--space-44);   /* typo-breadcrumb 14px/모바일12px. 한글 포함 → sans */
}
.about-hero .ah-crumb .ah-sep{margin:0 var(--space-10);opacity:1;font-size:1.15em;font-weight:700;color:#fff;}   /* > 화살표 강조 */
.about-hero .ah-title{
  font-family:var(--font-sans);font-weight:700;color:#fff;
  font-size:var(--typo-display);line-height:1.3;margin:0;   /* 디스플레이 토큰 96px, line-height 130% */
}
.about-hero .ah-lead{
  font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.8;   /* 본문 토큰 */
  color:rgba(255,255,255,.82);margin:var(--space-44) 0 0;font-weight:400;   /* 타이틀 ↔ 본문 여백 확대 */
}
.about-hero .ah-subnav{display:none;}   /* 하위메뉴 버튼 = 모바일 전용 */

@media (max-width:768px){
  /* 모바일 히어로 높이 600px 고정, 내용 세로 중앙·가운데 정렬 */
  .about-hero{height:600px;min-height:0;padding:0;}
  .about-hero .ah-inner{text-align:center;display:flex;flex-direction:column;justify-content:center;height:100%;}
  .about-hero::after{background:linear-gradient(180deg,rgba(20,30,32,.35) 0%,rgba(20,30,32,.55) 100%);}  /* 모바일 균일 dim */
  .about-hero .ah-title{font-size:var(--typo-display);line-height:1.35;}   /* PC와 동일 세만틱, 값만 :root 모바일 재지정 */
  .about-hero .ah-crumb{margin:0 0 var(--space-30);order:-1;}      /* 타이틀 위 'ABOUT US'만, 간격 확대 */
  .about-hero .ah-crumb-rest{display:none;}             /* '› 현재페이지' 숨김 */
  .about-hero .ah-lead{display:none;}                   /* 리드 삭제 */
  /* 브레드크럼 = 타이틀 아래 하위메뉴 버튼 */
  .about-hero .ah-subnav{
    display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-10) var(--space-8);margin:var(--space-60) 0 0;
  }
  .about-hero .ah-subnav a{
    font-family:var(--font-sans);font-size:14px;font-weight:500;color:rgba(255,255,255,.9);
    padding:var(--space-8) var(--space-15);border-radius:999px;white-space:nowrap;line-height:1;
  }
  .about-hero .ah-subnav a.is-current{background:#fff;color:var(--c-text-primary);font-weight:700;}
}

/* =========================================================
   ABOUT/FACILITY — 시설 소개
   ========================================================= */
/* 인트로: WIN WOMEN CLINIC + 카피 + 빌딩 일러스트 + 층별 앵커 */
.fac-intro{background:#fff;padding:var(--gap-hero-to-content) 0 var(--space-30);text-align:center;}
/* 섹션 eyebrow=베이지(#bcb2a8) / 타이틀=청록 통일 (홈과 동일) */
.fac-intro .eyebrow,
.fac-intro .eyebrow.is-point{display:block;margin-bottom:var(--space-20);}   /* 색은 .after-hero 공용 */
.fac-intro .fac-intro-copy{
  font-family:var(--font-sans);font-weight:700;
  font-size:var(--typo-title-large);line-height:1.4;color:var(--c-text-brand);
  margin:0 0 var(--space-60);
}
.fac-building{
  display:flex;align-items:center;justify-content:center;
  max-width:1400px;margin:0 auto;
}
/* 건물 일러스트만 남김 + 층별 클릭영역 오버레이 컨테이너 */
.fac-building-img{width:100%;max-width:1400px;aspect-ratio:1400 / 404;position:relative;margin:var(--space-40) auto 0;}
.fac-building-img picture{display:block;width:100%;height:100%;}
.fac-building-img img{width:100%;height:100%;object-fit:cover;display:block;}
/* 세로 4등분 투명 클릭영역(위→아래 = 4F→1F). inline style로 top/height 지정 */
.fac-floor-hit{
  position:absolute;left:0;right:0;display:block;
  border-radius:8px;transition:background .2s;
}
.fac-floor-hit:hover{background:rgba(46,124,124,.14);}

/* 층별 섹션 */
.fac-section{padding:var(--space-100) 0;background:#fff;scroll-margin-top:100px;}
.fac-section:last-of-type{padding-bottom:var(--gap-content-to-footer);}
.fac-section .container{max-width:1400px;}   /* 이미지 규격 기준 폭 1400 */
/* 2번째(2F)·4번째(4F) 섹션 배경 = 연한 베이지 풀폭 */
.fac-section#floor-2,
.fac-section#floor-4{background:var(--c-bg-subtle);}
.fac-sec-head{position:relative;text-align:center;margin-bottom:var(--space-48);}
.fac-sec-head .fac-watermark{
  font-family:var(--font-latin);font-weight:700;font-size:90px;line-height:1;
  color:var(--c-text-eyebrow);display:block;
}
.fac-sec-head .fac-sec-title{
  font-family:var(--font-sans);font-weight:700;font-size:32px;
  color:var(--c-text-brand);margin-top:-46px;position:relative;
}
/* 슬라이드(캐러셀) — 기본 1400×600(7/3), 미디어 직각(라운드 없음).
   여러 캐러셀이 한 페이지에 있어도 각자 독립 동작(JS는 페이지 하단 인라인). */
.fac-slider{
  position:relative;width:100%;aspect-ratio:1400 / 600;
  background:#e8e4de;overflow:hidden;margin-bottom:var(--space-40);
  border-radius:var(--shape-image);
}
/* "높은 수준의 진료를 쾌적하게 받으세요" 직후 첫 대표 이미지(1F) = 1400×404 */
.fac-slider.fac-slider-wide{aspect-ratio:1400 / 404;}
.fac-slider .fs-track{
  display:flex;width:100%;height:100%;
  transition:transform .45s ease;will-change:transform;
}
.fac-slider .fs-slide{flex:0 0 100%;width:100%;height:100%;}
.fac-slider .fs-slide img{
  width:100%;height:100%;object-fit:cover;display:block;
  border-radius:var(--shape-image);
}
/* 좌우 화살표 */
.fac-slider .fs-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  border:0;cursor:pointer;
  background:rgba(20,30,32,.42);color:#fff;
  font-family:var(--font-latin);font-size:28px;line-height:1;
  transition:background .2s;
}
.fac-slider .fs-arrow:hover{background:rgba(20,30,32,.7);}
.fac-slider .fs-prev{left:var(--space-16);}
.fac-slider .fs-next{right:var(--space-16);}
/* 하단 dot 인디케이터 */
.fac-slider .fs-dots{
  position:absolute;left:0;right:0;bottom:var(--space-16);z-index:3;
  display:flex;justify-content:center;gap:var(--space-10);
}
.fac-slider .fs-dot{
  width:9px;height:9px;padding:0;border:0;cursor:pointer;border-radius:50%;
  background:rgba(255,255,255,.5);transition:background .2s,transform .2s;
}
.fac-slider .fs-dot.is-active{background:#fff;transform:scale(1.25);}

/* 장비 그리드: 한 줄에 5개 고정 (1:1 260×260, 캡션 없음 — 이미지에 설명 포함) */
.fac-equip{
  display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-30) var(--space-24);
  justify-content:center;
}
.fac-equip.cols-2,
.fac-equip.cols-4{grid-template-columns:repeat(5,1fr);justify-content:center;}
.fac-equip-item{margin:0;width:100%;max-width:260px;}
.fac-equip-item .fe-thumb{
  width:100%;height:auto;aspect-ratio:1 / 1;background:#eee;overflow:hidden;
}
.fac-equip-item .fe-thumb img{width:100%;height:100%;object-fit:cover;}

@media (max-width:768px){
  .fac-intro{padding-bottom:var(--space-24);}   /* 상단여백=--gap-hero-to-content 공용 */
  .fac-intro .fac-intro-copy{font-size:26px;margin-bottom:var(--space-40);}
  .fac-intro .fac-intro-copy br{display:none;}
  .fac-building{flex-direction:column;gap:var(--space-28);}
  .fac-building-img{aspect-ratio:1920 / 1076;}   /* 모바일 건물일러스트_mo(세로형) 비율 */
  .fac-section{padding:var(--space-56) 0 var(--space-40);}   /* 섹션 하단 내부 여백 추가 */
  .fac-sec-head .fac-watermark{font-size:64px;}
  .fac-sec-head .fac-sec-title{font-size:24px;margin-top:-34px;}
  /* 모바일 슬라이드: 세로 여유 확보 + 화살표/도트 축소 */
  .fac-slider{aspect-ratio:4 / 3;margin-bottom:var(--space-28);}
  .fac-slider.fac-slider-wide{aspect-ratio:3 / 2;}
  .fac-slider .fs-arrow{width:38px;height:38px;font-size:22px;}
  .fac-slider .fs-prev{left:var(--space-8);}
  .fac-slider .fs-next{right:var(--space-8);}
  .fac-slider .fs-dots{bottom:var(--space-12);gap:var(--space-8);}
  .fac-equip,
  .fac-equip.cols-2,.fac-equip.cols-4{grid-template-columns:repeat(2,1fr);gap:var(--space-20) var(--space-8);}
  .fac-equip-item{width:auto;max-width:none;}
}

/* =========================================================
   ABOUT/LOCATION — 오시는 길
   ========================================================= */
.loc-map{background:#fff;padding:var(--gap-hero-to-content) 0 0;}   /* 배너 ↔ 콘텐츠 */
.loc-map .container{max-width:1200px;}
.loc-map-head{text-align:center;margin-bottom:var(--space-48);}
/* 섹션 eyebrow=베이지(#bcb2a8) / 타이틀(.sec-title)=청록 통일 */
.loc-map-head .eyebrow,
.loc-map-head .eyebrow.is-point{display:block;margin-bottom:var(--space-16);}   /* 색은 .after-hero 공용 */
/* 서브타이틀 색은 base .eyebrow에서 전역 통일 (별도 규칙 불필요) */
.loc-map-head .sec-title{margin:0;color:var(--c-text-brand);}
/* 미디어 직각(라운드 없음), 지도 ↔ 아래 섹션 간격 더 띄움 */
.map-frame{
  position:relative;width:100%;aspect-ratio:1440 / 580;
  background:#e8e4de;overflow:hidden;
  margin-bottom:var(--space-80);
}
.map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

.loc-info{background:#fff;padding:var(--space-60) 0 var(--gap-content-to-footer);}   /* 콘텐츠 ↔ 푸터 */
.loc-info .container{max-width:1200px;}
/* 진료안내 타이틀 — 청록색, 기본보다 얇게(300), 브랜드명만 강조 */
.loc-info-title{
  font-family:var(--font-sans);font-weight:400;
  font-size:var(--typo-title-medium);line-height:1.4;color:var(--c-text-brand);
  margin:0 0 var(--space-4);padding-bottom:0;
}
.loc-info-title strong{font-weight:700;}   /* 윈산부인과의원만 굵게 (얇은 본문 대비) */
/* 타이틀 아래 긴 가로선 — 청록 2px */
.loc-info-rule{
  border:0;border-top:2px solid var(--c-text-brand);
  margin:var(--space-20) 0 0;width:100%;
}
/* 그리드: 좌 텍스트(주소·주차장·진료시간) · 우 약도. 모바일은 약도를 주차장 아래로 재배치 */
.loc-info-grid{
  display:grid;grid-template-columns:1fr auto;column-gap:var(--space-48);align-items:start;margin-top:var(--space-60);
  grid-template-areas:"addr map" "parking map" "hours map";
}
.loc-info-table{display:contents;}   /* dl 박스 제거 → 행들이 그리드 아이템으로 */
.li-addr{grid-area:addr;} .li-parking{grid-area:parking;} .li-hours{grid-area:hours;}
/* 왼쪽 텍스트의 가로선(구분선) 전부 제거 */
.li-row{
  display:flex;gap:var(--space-28);align-items:flex-start;
  padding:var(--space-22) var(--space-4);border:0;
}
.li-row:first-child{border:0;padding-top:0;}   /* 첫 행 상단 패딩 제거 → 이미지 상단과 시작점 일치 */
/* 라벨(항목) 텍스트 색 = #b1a89d (--c-text-secondary) */
.li-row dt{
  flex:0 0 110px;margin:0;
  font-family:var(--font-sans);font-weight:700;font-size:var(--typo-body-medium);
  line-height:1.7;color:var(--c-text-secondary);
}
.li-row dd{
  flex:1;margin:0;
  font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.7;color:var(--c-text-primary);
}
.li-list{list-style:none;margin:0;padding:0;}
.li-list li{display:flex;gap:var(--space-20);line-height:1.95;}
.li-list .li-key{flex:0 0 130px;color:var(--c-text-secondary);}
.li-list .li-val{flex:1;color:var(--c-text-primary);}
.li-list li.is-muted .li-key,.li-list li.is-muted .li-val{color:var(--c-text-secondary);}
.li-hours .li-val{white-space:nowrap;}   /* 진료시간 값 한 줄 */
.li-hours .li-key{white-space:nowrap;}   /* "일요일 · 공휴일" 한 줄 */
/* 우측 이미지(약도) — 라운드·테두리 제거 */
.loc-parking-map{grid-area:map;display:block;}
.loc-parking-map img{width:569px;max-width:100%;height:auto;aspect-ratio:569 / 348;display:block;object-fit:cover;border-radius:var(--shape-image);border:0;}

@media (max-width:768px){
  /* .loc-map 상단여백=--gap-hero-to-content 공용(모바일 개별지정 제거) */
  .loc-map-head{margin-bottom:var(--space-28);}
  .map-frame{aspect-ratio:4 / 3;margin-bottom:var(--space-48);}
  .loc-info{padding:var(--space-40) 0 var(--space-80);}
  .loc-info-title{padding-bottom:0;}
  /* 모바일: 주소 → 주차장 → 약도 → 진료시간 */
  .loc-info-grid{grid-template-columns:1fr;grid-template-areas:"addr" "parking" "map" "hours";row-gap:var(--space-24);margin-top:var(--space-40);}
  .loc-parking-map{width:100%;margin-top:calc(var(--space-24) * -1);}   /* 주차장↔약도 간격 축소 */
  .loc-parking-map img{width:100%;height:auto;}
  .li-row{flex-direction:column;gap:var(--space-8);padding:var(--space-16) var(--space-2);}
  .li-row dt{flex:0 0 auto;}
  .li-list li{gap:var(--space-12);}
  .li-list .li-key{flex:0 0 96px;}
  .li-hours .li-key{flex-basis:120px;}   /* "일요일 · 공휴일" 폭 확보 */
}

/* =========================================================
   WOMEN'S CLINIC — 클리닉 소개 (/womens)
   ========================================================= */
/* 인트로 + 소개 영상 (di-video·dv-* 공용 컴포넌트 재사용) */
.wc-intro{background:#fff;text-align:center;padding:var(--gap-hero-to-content) 0 var(--pad-section);}
.wc-intro .eyebrow{display:block;margin-bottom:var(--space-16);}
.wc-intro .sec-title{margin:0 0 var(--space-48);}

/* 섹션 헤더(eyebrow + 타이틀, 가운데) */
.wc-sec-head{text-align:center;margin-bottom:var(--space-60);}
.wc-sec-head .eyebrow{display:block;margin-bottom:var(--space-16);}
.wc-sec-head .sec-title{margin:0;}

/* 대학병원 인프라 */
.wc-infra{background:#fff;padding:var(--pad-section) 0;}
.wc-infra.alt-sub{background:var(--c-bg-subtle);}
/* 웰에이징 클리닉소개 — WE ARE DIFFERENT 인포그래픽 단일 이미지 */
.wa-about{max-width:1000px;margin:0 auto;}
.wa-about img{width:100%;height:auto;display:block;border-radius:var(--shape-image);}
.wc-infra .container{max-width:1200px;}
/* 원 2개(어려움→원스톱) = 가로로 긴 통이미지 한 장 */
.wc-infra-circles{margin:0 auto var(--space-40);max-width:980px;}
.wc-infra-circles img{width:100%;height:auto;display:block;}
.wc-infra-circles .wic-mo{display:none;}   /* 모바일 전용: 원+화살표+원 세로 스택 (아래 media에서 표시) */
/* 이미지 위 가로선 — 연한 라인 + 4구간 청록 강조(각 특징 열 위) */
.wc-infra-divider{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-30);border-top:1px solid var(--c-interactive-default);margin:0 0 var(--space-40);}
.wc-infra-divider span{height:3px;width:25%;justify-self:start;background:var(--c-interactive-default);margin-top:-2px;}   /* 굵은 세그먼트 = 각 칸의 1/4 길이(좌측 정렬) */
/* 4 특징 그리드 */
.wc-features{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-30);}
.wc-features.cols-3{grid-template-columns:repeat(3,1fr);}   /* 3특징 변형(MOM'S 등) */
.wc-infra-divider.cols-3{grid-template-columns:repeat(3,1fr);}
.wc-feature{margin:0;text-align:center;}
.wc-feat-img{margin:0 0 var(--space-20);aspect-ratio:1 / 1;background:#e8e4de;overflow:hidden;border-radius:var(--shape-image);}
.wc-feat-img img{width:100%;height:100%;object-fit:cover;}
.wc-feat-txt{font-family:var(--font-sans);font-size:var(--typo-body-medium);font-weight:700;line-height:1.5;color:var(--c-text-primary);margin:0;}
/* MOM'S 특징 이미지 = 자연 비율(1:1 크롭 안 함 → 세로 절약). 담당팀이 넣는 이미지 비율 그대로 */
.page-moms .wc-feat-img{aspect-ratio:auto;background:none;}
.page-moms .wc-feat-img img{height:auto;}

/* 여성암 정기검진 — full 배경 + 텍스트(체크 3개) 좌 · 이미지 우 */
.wc-cancer{position:relative;overflow:hidden;background:var(--c-bg-subtle);padding:var(--pad-section) 0;}
.wc-cancer-bg{position:absolute;inset:0;z-index:0;}
.wc-cancer-bg img{width:100%;height:100%;object-fit:cover;}
.wc-cancer .container{position:relative;z-index:1;max-width:1100px;}
.wc-cancer-body{display:flex;gap:var(--space-56);align-items:center;}
.wc-cancer-list{flex:1;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-30);}
.wc-cancer-list li{display:flex;gap:var(--space-16);align-items:flex-start;}
.wc-cancer-list .wc-check{flex:0 0 auto;width:28px;height:28px;margin-top:3px;}
.wc-cancer-list p{margin:0;font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.6;color:var(--c-text-brand);}
.wc-cancer-list p b{display:block;color:var(--c-text-primary);font-weight:700;margin-bottom:var(--space-4);}
.wc-cancer-img{flex:0 0 auto;margin:0;width:521px;max-width:100%;}
.wc-cancer-img img{width:100%;height:auto;display:block;aspect-ratio:521/377;}
/* MOM'S 마미톡 섹션 = 유방암 섹션과 동일 레이아웃(좌 텍스트·우 이미지 · full 배경) */
.mm-check{border-radius:50%;background-color:var(--c-interactive-default);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;background-size:15px;}
.mm-img img{aspect-ratio:auto;}   /* 마미톡 이미지 자연비율 */

/* CTA — 좌우 이미지 + 가운데(좌→우→가운데 순차 등장) */
/* 풀폭 섹션: 좌우 이미지(각 646px)를 양 끝에 붙이고 중앙 텍스트를 그 위에 겹침(원본 동일) */
.wc-cta{position:relative;display:flex;align-items:center;justify-content:space-between;padding:var(--pad-section) var(--space-40);background:#fff;overflow:hidden;}
.wc-cta-side{flex:0 0 646px;max-width:50%;min-width:0;margin:0;}
.wc-cta-side img{width:100%;height:auto;display:block;border-radius:var(--shape-image);}
.wc-cta-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;pointer-events:none;}   /* reveal transform과 충돌 안 나게 flex로 중앙정렬 */
.wc-cta-center{width:520px;max-width:80%;text-align:center;pointer-events:auto;}
.wc-cta-center h2{font-family:var(--font-sans);font-weight:700;font-size:var(--typo-title-medium);line-height:1.4;color:var(--c-text-primary);margin:0 0 var(--space-30);}

/* 태블릿(≤1280): 646px 이미지 2장+중앙텍스트가 안 맞아 겹치므로 세로 스택(이미지→텍스트→이미지)으로 전환 — 겹침 레이아웃은 초광폭에서만 */
@media (min-width:769px) and (max-width:1280px){
  .wc-cta{flex-direction:column;gap:var(--space-40);}
  .wc-cta-side{flex:0 0 auto;width:100%;max-width:560px;}
  .wc-cta-left{order:1;}
  .wc-cta-overlay{position:static;display:block;order:2;pointer-events:auto;}
  .wc-cta-right{order:3;}
  .wc-cta-center{width:100%;max-width:560px;}
}

@media (max-width:768px){
  .wc-intro .sec-title{margin-bottom:var(--space-48);}   /* 타이틀↔영상 간격 확대 */
  .wc-sec-head{margin-bottom:var(--space-40);}
  /* 섹션 상·하 패딩은 --pad-section(모바일 56)로 통일 → intro/infra/cancer 개별 오버라이드 불필요 */
  /* 원 이미지: 가로 통이미지 숨기고 원+화살표+원 세로 스택 */
  .wc-infra-circles .wic-pc{display:none;}
  .wc-infra-circles .wic-mo{display:flex;flex-direction:column;align-items:center;gap:var(--space-16);}
  .wc-infra-circles .wic-circle{width:250px;max-width:80%;height:auto;}
  .wc-infra-circles .wic-arrow{width:36px;height:auto;}
  .wc-infra-divider{gap:var(--space-15);}
  .wc-features,.wc-features.cols-3{grid-template-columns:1fr;gap:var(--space-48);}   /* 한 줄에 1개 (cols-3도 모바일은 1열) · 그룹 사이 간격을 이미지↔텍스트(20)보다 크게 */
  .wc-infra-divider.cols-3{grid-template-columns:repeat(3,1fr);}   /* 구분선은 3구간 유지 */
  .wc-cancer-body{flex-direction:column;gap:var(--space-30);}
  .wc-cancer-list{width:100%;}
  .wc-cancer-img{order:-1;flex:0 0 auto;width:100%;max-width:521px;margin:0 auto;}   /* 이미지를 내용 위로 */
  .wc-cta{flex-direction:column;gap:var(--space-40);padding:var(--pad-section) var(--space-15);}   /* 세로=--pad-section 통일 · 텍스트+버튼 그룹 간격은 gap */
  .wc-cta-side{flex:0 0 auto;width:100%;max-width:340px;}
  .wc-cta-left{order:1;}
  .wc-cta-overlay{position:static;display:block;order:2;pointer-events:auto;}   /* 모바일: 텍스트를 두 이미지 사이에 */
  .wc-cta-right{order:3;}
  .wc-cta-center h2{margin-bottom:var(--space-24);font-size:var(--typo-body-large);line-height:1.5;}   /* 모바일 폰트 축소(PC title-medium → 모바일 body-large) */
  .wc-cta-center .btn-outline{padding:var(--space-10) var(--space-24);font-size:var(--typo-label-large);}   /* 버튼 축소 */
  .wc-cta-center{width:100%;max-width:100%;}
}

/* =========================================================
   WOMEN'S CLINIC — 검진/검사 (checkup)
   ========================================================= */
.chk-insurance{background:#fff;padding:var(--gap-hero-to-content) 0 var(--pad-section);}
.chk-cancer{background:var(--c-bg-subtle);padding:var(--pad-section) 0;}
.chk-etc{background:#fff;padding:var(--pad-section) 0;}

/* 2) 국민보험공단 검진 — 정보카드 2열 + 주의사항 */
.chk-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-30);}   /* 컨테이너 폭 채움 */
.chk-info-card{border:1px solid var(--c-border-default);border-radius:var(--shape-image);overflow:hidden;background:#fff;}
.chk-info-card h3{margin:0;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:#fff;background:var(--c-interactive-default);text-align:center;padding:var(--space-20);}
.chk-info-card ul{list-style:none;margin:0;padding:var(--space-30);display:flex;flex-direction:column;gap:var(--space-16);}
.chk-info-card li{position:relative;padding-left:var(--space-24);font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.5;color:var(--c-text-primary);}
.chk-info-card li::before{content:"";position:absolute;left:0;top:.4em;width:8px;height:8px;border-radius:50%;background:var(--c-interactive-default);}
.chk-info-card li.chk-row{padding-top:var(--space-16);border-top:1px solid var(--c-border-default);}
.chk-info-card li.chk-row::before{top:calc(var(--space-16) + .4em);}
.chk-notice{margin:var(--space-40) 0 0;}
.chk-notice h4{margin:0 0 var(--space-16);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-brand);}
.chk-notice p{margin:0 0 var(--space-8);font-family:var(--font-sans);font-size:var(--typo-detail-medium);line-height:1.7;color:var(--c-text-body);}

/* 3·4) 여성암 검진 · 기타 검진/검사 — 이미지 카드(사진 위 + 텍스트박스 아래 · 전체 회색 테두리) 공통 */
.chk-photo-grid{display:grid;gap:var(--space-30);}   /* 컨테이너 폭 채움 */
.chk-grid-3{grid-template-columns:repeat(3,1fr);}
.chk-grid-2{grid-template-columns:repeat(2,1fr);}
.chk-photo-card{display:flex;flex-direction:column;border:1px solid var(--c-border-default);border-radius:var(--shape-image);overflow:hidden;background:#fff;}
.chk-photo{margin:0;aspect-ratio:872/491;overflow:hidden;background:var(--c-bg-subtle);}
.chk-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.chk-photo-body{padding:var(--space-30) var(--space-16);}   /* 좌우 여백 축소 */
.chk-photo-body h3{margin:0 0 var(--space-16);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-primary);text-align:center;}   /* 도형 내 = 라벨라지 */
.chk-photo-body p{margin:0;font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);}   /* 도형 내 = 라벨미디엄 · 본문색 */

@media (max-width:768px){
  .chk-cards{grid-template-columns:1fr;gap:var(--space-24);max-width:520px;}
  .chk-notice{margin-top:var(--space-30);}
  .chk-grid-3,.chk-grid-2{grid-template-columns:1fr;max-width:460px;}
}

/* =========================================================
   WOMEN'S CLINIC — 부인암/종양 · 일반질환 (질환 텍스트 카드)
   ========================================================= */
.dz-section{background:#fff;padding:var(--gap-hero-to-content) 0 var(--pad-section);}
.dz-section.alt{background:var(--c-bg-subtle);}
/* 섹션 제목 아래 중앙 설명문(루프 종류 등) */
.dz-sec-desc{max-width:820px;margin:var(--space-20) auto 0;font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.8;color:var(--c-text-body);}
.dz-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-30);align-items:start;}   /* 컨테이너(1400) 폭 채움 · start=카드가 자기 높이만(펼쳐도 다른 카드 안 늘어남) */
.dz-card{display:flex;flex-direction:column;border:1px solid var(--c-border-default);border-radius:var(--shape-image);overflow:hidden;background:#fff;}
.dz-photo{margin:0;aspect-ratio:872/491;overflow:hidden;background:var(--c-bg-subtle);}   /* 사진 위(16:9) */
.dz-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.dz-body{padding:var(--space-30) var(--space-16);}   /* 텍스트박스 아래 */
.dz-body h3{margin:0 0 var(--space-16);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-primary);text-align:center;}   /* 도형 제목 = label-large */
.dz-body p{margin:0;font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);}   /* 도형 내용 = label-medium · 본문색 */
/* 아코디언 상세(검사 및 진단 · 치료방법) — 네이티브 <details>, JS 없이 CSS만. 내용은 HTML에 상주 → SEO/AEO 안전 */
.dz-detail{margin-top:var(--space-20);}
.dz-toggle{list-style:none;display:flex;align-items:center;gap:var(--space-4);margin:0 auto;width:fit-content;padding:var(--space-4) var(--space-16);border:1px solid var(--c-interactive-default);border-radius:999px;cursor:pointer;font-family:var(--font-sans);font-size:var(--typo-detail-medium);color:#fff;background:var(--c-interactive-default);transition:background .2s,border-color .2s;}   /* detail 티어 · 기본 채움 · 소형 */
.dz-toggle::-webkit-details-marker{display:none;}   /* Safari 기본 삼각형 제거 */
.dz-toggle::after{content:"+";font-weight:700;line-height:1;}
.dz-detail[open] .dz-toggle::after{content:"\2212";}   /* − */
@media (hover:hover){ .dz-toggle:hover{background-image:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.12));} }   /* 클릭 대상(버튼)만 PC hover — 배경만 어둡게(텍스트 흰색 유지) */
.dz-toggle .lbl-less{display:none;}
.dz-detail[open] .dz-toggle .lbl-more{display:none;}
.dz-detail[open] .dz-toggle .lbl-less{display:inline;}
.dz-detail-body{text-align:left;margin-top:var(--space-40);}
.dz-detail[open] .dz-detail-body{animation:dzFade .35s ease;}
.dz-detail-body h4{display:flex;align-items:center;gap:var(--space-8);margin:var(--space-20) 0 var(--space-8);padding-top:var(--space-20);border-top:1px solid var(--c-border-default);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-medium);color:var(--c-text-brand);}
/* 아이콘 = 대표색 원(면) 안에 흰 아이콘 → 텍스트와 뚜렷이 구분 */
.dz-detail-body h4::before{content:"";width:22px;height:22px;flex:0 0 auto;border-radius:50%;background-color:var(--c-interactive-default);background-position:center;background-repeat:no-repeat;background-size:13px;}
/* 검사 및 진단 = 돋보기 */
.dz-h-exam::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.5' y1='16.5' x2='21' y2='21'/%3E%3C/svg%3E");}
/* 치료방법 = 의료 플러스 */
.dz-h-treat::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='6' x2='12' y2='18'/%3E%3Cline x1='6' y1='12' x2='18' y2='12'/%3E%3C/svg%3E");}
/* 권장 예방접종 = 방패 체크 */
.dz-h-vaccine::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 4 5v6c0 5 3.4 8.5 8 10 4.6-1.5 8-5 8-10V5z'/%3E%3Cpolyline points='9 12 11 14 15 10'/%3E%3C/svg%3E");}
.dz-detail-body h4:first-child{margin-top:0;padding-top:0;border-top:none;}
.dz-detail-body p{margin:0;font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);}
.dz-detail-body ul.dz-sublist{margin:var(--space-4) 0 0;padding-left:var(--space-24);list-style:disc;}
.dz-detail-body ul.dz-sublist li{font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);}
@keyframes dzFade{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
/* 성인예방주사 표 */
.dz-table-wrap{overflow-x:auto;margin-top:var(--space-4);}
.dz-table{width:100%;border-collapse:collapse;font-family:var(--font-sans);font-size:var(--typo-detail-medium);color:var(--c-text-body);}
.dz-table th,.dz-table td{border:1px solid var(--c-border-default);padding:var(--space-8) var(--space-10);text-align:left;line-height:1.5;vertical-align:top;}
.dz-table th{background:var(--c-bg-subtle);color:var(--c-text-primary);font-weight:700;white-space:nowrap;}
.dz-table td:first-child{font-weight:700;color:var(--c-text-primary);white-space:nowrap;}

/* =========================================================
   MOM'S CLINIC — 산전관리 (prenatal-care)
   ========================================================= */
.pre-section{background:#fff;padding:var(--gap-hero-to-content) 0 var(--pad-section);text-align:center;}
.pre-section.alt{background:var(--c-bg-subtle);}
/* 상단 2단: 좌 사진 · 우 글(인용구+본문+표/통계) */
.pre-top{display:flex;gap:var(--space-56);align-items:stretch;text-align:left;margin:0 0 var(--space-60);}
.pre-photo{flex:0 0 44%;margin:0;border-radius:var(--shape-image);overflow:hidden;}
.pre-photo img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;}
.pre-body{flex:1;min-width:0;}
/* 인용구 = 사이트 메인 청녹색 + 앞 따옴표 */
.pre-quote{position:relative;font-family:'Nanum Pen Script',var(--font-sans);font-size:var(--typo-title-large);line-height:1.25;color:var(--color-teal-700);margin:0 0 var(--space-24);padding-top:var(--space-24);}
.pre-quote::before{content:"\201C";position:absolute;top:2px;left:-2px;font-family:var(--font-latin);font-size:44px;line-height:1;color:var(--c-border-default);}
.pre-lead{margin:0 0 var(--space-40);font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.8;color:var(--c-text-body);}
/* 검진시기 표 */
.pre-table-wrap{overflow-x:auto;}
.pre-table{width:100%;border-collapse:collapse;font-family:var(--font-sans);}
.pre-table th{background:var(--c-page-accent);color:#fff;font-weight:700;font-size:var(--typo-label-large);padding:var(--space-10) var(--space-16);text-align:center;}
.pre-table td{border-bottom:1px solid var(--c-border-default);padding:var(--space-12) var(--space-16);font-size:var(--typo-label-large);color:var(--c-text-primary);text-align:center;}
/* 통계 2개(첫 출산 산모 연령 · 고위험 산모 비중) */
.pre-stats{display:flex;gap:var(--space-40);}
.pre-stat{flex:1;text-align:center;}
.pre-stat-title{margin:0 0 var(--space-16);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--color-teal-700);}
.pre-stat img{width:100%;max-width:300px;height:auto;display:block;margin:0 auto;}
/* 소제목(고위험 임신 분류) — 양옆 라인 */
.pre-subhead{display:flex;align-items:center;justify-content:center;gap:var(--space-20);margin:0 0 var(--space-40);}
.pre-subhead::before,.pre-subhead::after{content:"";height:1px;width:70px;background:var(--c-border-default);}
.pre-subhead span{font-family:var(--font-sans);font-weight:700;font-size:var(--typo-title-medium);color:var(--c-text-secondary);}
/* 카드 그리드 4열 변형(산전검진 임신초기~) · 카드는 부인암/종양 dz-card 재사용 */
.dz-grid.cols-4{grid-template-columns:repeat(4,1fr);}
.dz-grid.cols-2{grid-template-columns:repeat(2,1fr);max-width:920px;margin-left:auto;margin-right:auto;align-items:stretch;}
.dz-grid.cols-2 .dz-card{display:flex;flex-direction:column;}
.dz-grid.cols-2 .dz-body{flex:1;}
/* 손글씨 인용 — 따옴표를 텍스트 바로 앞에 인라인(중앙정렬 섹션용) */
.pre-quote.q-inline{padding-top:0;}
.pre-quote.q-inline::before{position:static;top:auto;left:auto;font-size:44px;line-height:0;vertical-align:-0.38em;margin-right:var(--space-4);}
/* 뷰티 — 비만 원인 질환 6블록 체커보드(밝은칸/타우프칸 교차) */
.bt-causes{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:0;max-width:1170px;margin:0 auto;padding:0;}
.bt-causes li{display:flex;align-items:center;justify-content:center;min-height:150px;padding:var(--space-24) var(--space-16);text-align:center;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);}
.bt-causes li:nth-child(odd){background:#fbf4f2;color:var(--c-text-brand);}
.bt-causes li:nth-child(even){background:#c9beb8;color:#fff;}
@media(max-width:768px){.bt-causes{grid-template-columns:1fr 1fr;}.bt-causes li{min-height:110px;font-size:var(--typo-label-medium);}}
/* 뷰티 프로그램 상세 — 서브 헤더 바(#D7CDCA, 카드폭 꽉) */
.wa-progcard .dz-detail-body .bt-subbar{background:#D7CDCA;color:#fff;text-align:center;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);padding:var(--space-12) var(--space-16);margin:var(--space-48) calc(var(--space-24) * -1) var(--space-20);width:calc(100% + var(--space-24) * 2);max-width:none;}
/* 서브바 바로 아래 이미지 = 여백 없이 붙임 */
.wa-progcard .dz-detail-body .bt-subbar + img{margin-top:calc(var(--space-20) * -1);}
/* 이미지+내용 한 그룹 · 앞 그룹(wa-sym)과 간격 더 벌림 */
.wa-progcard .dz-detail-body .wa-sym + img{margin-top:var(--space-40);}
.wa-progcard .dz-detail-body>.bt-subbar:first-child{margin-top:0;}
/* 소음순 STEP 4단계 */
.bt-steps{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--c-border-default);border-left:1px solid var(--c-border-default);margin:0 0 var(--space-20);padding:0;}
.bt-steps li{text-align:center;padding:var(--space-20) var(--space-12);border-right:1px solid var(--c-border-default);border-bottom:1px solid var(--c-border-default);}
.bt-steps .step-no{display:block;font-family:var(--font-latin);letter-spacing:.12em;font-size:var(--typo-detail-medium);color:var(--c-text-secondary);margin-bottom:var(--space-8);}
.bt-steps .step-t{font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-medium);color:var(--c-text-primary);}
/* 이런 분께 추천 체크리스트 */
.bt-reco-head{text-align:center;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-brand);margin:var(--space-24) 0 var(--space-20);}
.bt-checklist{list-style:none;margin:0;padding:0;}
.bt-checklist li{display:flex;align-items:flex-start;gap:var(--space-10);margin-bottom:var(--space-12);font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.6;color:var(--c-text-body);}
.bt-checklist li::before{content:"";width:20px;height:20px;flex:0 0 auto;border-radius:50%;background:var(--c-interactive-default) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12 10 17 19 8'/%3E%3C/svg%3E") center/12px no-repeat;margin-top:1px;}

@media (max-width:768px){
  .pre-top{flex-direction:column;text-align:center;gap:var(--space-30);}
  .pre-photo{flex:0 0 auto;width:100%;}
  .pre-photo img{height:auto;}
  .pre-quote::before{left:50%;transform:translateX(-50%);}
  .pre-stats{flex-direction:column;gap:var(--space-30);}
  .pre-subhead::before,.pre-subhead::after{width:36px;}
  .dz-grid.cols-4{grid-template-columns:1fr;}
}

/* ===== 임신준비(pregnancy-prep) ===== */
/* 인트로 우측 체크 포인트 3개 (아이콘+제목+설명) — pre-body 안에서 사용 */
/* 질문(인용구)↔체크그룹 간격은 margin-top으로(넓게), 체크 3개 사이는 gap으로(좁게) */
.prep-points{display:flex;flex-direction:column;gap:var(--space-40);margin-top:var(--space-60);}
.prep-point h4{display:flex;align-items:center;gap:var(--space-10);margin:0 0 var(--space-12);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-brand);}
.prep-point h4::before{content:"";width:24px;height:24px;flex:0 0 auto;border-radius:50%;background:var(--c-interactive-default) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12 10 17 19 8'/%3E%3C/svg%3E") center/14px no-repeat;}
.prep-point p{margin:0;font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.8;color:var(--c-text-body);}
/* 웨딩·임신 전 검진 — 검진 항목 박스 */
.prep-exam{max-width:600px;margin:0 auto;border:1px solid var(--c-border-default);border-radius:var(--shape-image);overflow:hidden;background:#fff;}
.prep-exam-head{background:var(--c-page-accent);color:#fff;text-align:center;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);letter-spacing:.02em;padding:var(--space-12) var(--space-16);}
.prep-exam-list{list-style:none;margin:0;padding:var(--space-30) var(--space-40);display:flex;flex-direction:column;gap:var(--space-12);}
.prep-exam-list li{display:flex;align-items:center;gap:var(--space-12);text-align:left;font-family:var(--font-sans);font-size:var(--typo-label-large);color:var(--c-text-primary);}
.prep-exam-list li::before{align-self:flex-start;}
.prep-exam-list li::before{content:"";width:20px;height:20px;flex:0 0 auto;border-radius:50%;background:var(--c-interactive-default) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12 10 17 19 8'/%3E%3C/svg%3E") center/12px no-repeat;}
@media (max-width:768px){
  .prep-points{gap:var(--space-24);text-align:left;}
  .prep-exam-list{padding:var(--space-30) var(--space-24);}
}

/* ===== 웰에이징 질환 페이지 공통 ===== */
/* 증상 및 진단방법 — 플랫 아코디언(JS 없는 details) */
.wa-acc{max-width:900px;margin:0 auto;border-top:1px solid var(--c-border-default);}
.wa-acc details{border-bottom:1px solid var(--c-border-default);}
.wa-acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--space-16);padding:var(--space-24) var(--space-8);cursor:pointer;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-primary);}
.wa-acc summary::-webkit-details-marker{display:none;}
.wa-acc summary::after{content:"+";font-weight:400;font-size:24px;line-height:1;color:var(--c-page-accent);}
.wa-acc details[open] summary::after{content:"\2212";}
.wa-acc-body{padding:0 var(--space-8) var(--space-24);font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.8;color:var(--c-text-body);}
.wa-acc details[open] .wa-acc-body{animation:dzFade .35s ease;}
/* FOR 2ND WOMEN'S LIFE 밴드 */
.wa-band{padding:var(--space-80) var(--space-24);text-align:center;background:linear-gradient(rgba(4,86,96,.46),rgba(4,86,96,.46)),url("images/wellaging/band-bg.jpg") center/cover no-repeat;color:#fff;}
.wa-band-eyebrow{font-family:var(--font-latin);letter-spacing:.22em;font-size:var(--typo-detail-medium);opacity:.85;margin:0 0 var(--space-20);}
.wa-band-tag{font-family:var(--font-sans);font-weight:700;font-size:var(--typo-title-large);margin:0 0 var(--space-12);}
.wa-band h2{font-family:var(--font-sans);font-weight:700;font-size:var(--typo-title-medium);margin:0;color:#fff;}
/* WELL-AGING CLINIC POINT — 섹션 시작에 붙는 대형 헤딩 + 이미지 밑 텍스트박스 */
.wa-point{padding-top:var(--space-40);}
.wa-point-head{text-align:center;font-family:var(--font-latin);font-style:italic;font-weight:700;font-size:var(--typo-heading);letter-spacing:.03em;color:var(--c-text-brand);margin:0 0 var(--space-24);}
.wa-point .wc-feat-img{margin:0;}
.wa-point .wc-feat-txt{margin:0;background:#fff;border:1px solid var(--c-border-default);border-top:none;padding:var(--space-24) var(--space-20);}
/* 메인컬러 가로 텍스트 밴드(갱년기 치료만 잘받아도 · 골다공증 진행 과정) */
.wa-headband{background:var(--c-page-accent);color:#fff;text-align:center;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-title-medium);letter-spacing:.02em;padding:var(--space-10) var(--space-16);margin:0 auto var(--space-40);max-width:1000px;}
/* 이미지 + 메인컬러 캡션(박스 아님) */
.wa-capgrid{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-30);margin:0 auto;padding:0;max-width:1000px;}
.wa-capgrid figure{margin:0 0 var(--space-16);aspect-ratio:1/1;overflow:hidden;border-radius:var(--shape-image);background:var(--c-bg-subtle);}
.wa-capgrid figure img{width:100%;height:100%;object-fit:cover;display:block;}
.wa-capgrid figcaption{font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);line-height:1.5;color:var(--c-text-brand);}
/* 증상 아코디언 항목(체크 아이콘 + 소제목 + 설명) */
.wa-sym{margin:0 0 var(--space-24);}
.wa-sym:last-child{margin-bottom:0;}
.wa-sym h4{display:flex;align-items:center;gap:var(--space-8);margin:0 0 var(--space-8);padding-top:0;border-top:none;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-brand);}
.wa-sym h4::before{border-top:none;}
.wa-sym h4::before{content:"";width:22px;height:22px;flex:0 0 auto;border-radius:50%;background:var(--c-interactive-default) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12 10 17 19 8'/%3E%3C/svg%3E") center/13px no-repeat;}
.wa-sym p{margin:0;padding-left:calc(22px + var(--space-8));font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);}
.wa-sym ul.wa-sym-list{margin:0;padding-left:calc(22px + var(--space-8) + var(--space-16));list-style:disc;}
.wa-sym ul.wa-sym-list li{font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);margin-bottom:var(--space-4);}
/* 프로그램 카드 앞면 설명(제목 아래) */
.wa-progcard-desc{margin:0 0 var(--space-20);min-height:calc(1.7em * 3);font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.7;color:var(--c-text-body);}
/* 프로그램 아이콘 카드(아이콘 + 제목 + 자세히보기) */
.wa-progcard{text-align:center;border:1px solid var(--c-border-default);background:#fff;padding:var(--space-40) var(--space-24);}
.wa-progcard>img{width:84px;height:84px;margin:0 auto var(--space-20);display:block;}
.wa-progcard h3{margin:0 0 var(--space-16);min-height:2.7em;line-height:1.35;display:flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-brand);}
/* 자세히보기 내용 = 왼쪽정렬 · 이미지는 카드 폭 꽉 채움(양옆 패딩 상쇄) · 간격 통일 */
.wa-progcard .dz-detail-body{text-align:left;}
.wa-progcard .dz-detail-body img{width:calc(100% + var(--space-24) * 2);max-width:none;margin:0 calc(var(--space-24) * -1) var(--space-16);height:auto;display:block;border-radius:0;}
.wa-progcard .dz-detail-body h4{justify-content:flex-start;}
.wa-progcard .dz-detail-body p{text-align:left;margin:0 0 var(--space-16);}
.wa-progcard .dz-detail-body>*:last-child{margin-bottom:0;}
.wa-progcard a.dz-toggle{text-decoration:none;}
.dz-toggle.is-link::after{content:"\203A";}
/* 전문 치료 프로그램 3열(텍스트) */
.wa-prog{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-40);max-width:1040px;margin:0 auto;padding:0;}
.wa-prog li{text-align:center;padding-top:var(--space-24);border-top:2px solid var(--c-page-accent);}
.wa-prog h3{margin:0 0 var(--space-16);font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);color:var(--c-text-brand);}
.wa-prog p{margin:0;font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.8;color:var(--c-text-body);}
/* 프로그램 섹션 제목 아래 필기체 서브라인(서브색보다 살짝 진한 taupe-600) */
.wa-prog-sub{margin:var(--space-12) 0 0;font-family:'Nanum Pen Script',var(--font-sans);font-size:var(--typo-title-medium);line-height:1.2;color:var(--color-taupe-600);}
/* 인트로 손글씨 인용(=pre-quote 재사용) 아래 리드 문단 */
.wa-lead{max-width:820px;margin:0 auto var(--space-48);text-align:center;font-family:var(--font-sans);font-size:var(--typo-body-medium);line-height:1.8;color:var(--c-text-body);}
/* 단일 인포그래픽 이미지(자체 완결) 중앙 배치 */
.wa-figure{max-width:1000px;margin:0 auto;}
.wa-figure img{width:100%;height:auto;display:block;border-radius:var(--shape-image);}
.wa-figure .wic-mo{display:none;}   /* 모바일 전용 원+화살표+원 세로 스택 */
@media (max-width:768px){
  .wa-prog{grid-template-columns:1fr;gap:var(--space-32);max-width:460px;}
  .wa-band{padding:var(--space-56) var(--space-20);}
  .wa-capgrid{grid-template-columns:1fr;gap:var(--space-24);max-width:360px;}
  .dz-grid.cols-2{grid-template-columns:1fr;}
  /* 뷰티 비만질환 6블록 — 모바일 2열 체커보드(분홍/갈색 지그재그) */
  .bt-causes li:nth-child(4n+1),.bt-causes li:nth-child(4n){background:#fbf4f2;color:var(--c-text-brand);}
  .bt-causes li:nth-child(4n+2),.bt-causes li:nth-child(4n+3){background:#c9beb8;color:#fff;}
  /* 요실금 통계 이미지 모바일 축소 */
  .pre-stat img{max-width:200px;}
  /* 갱년기 benefit 모바일 원-화살표-원 세로 스택 */
  .wa-figure .wic-pc{display:none;}
  .wa-figure .wic-mo{display:flex;flex-direction:column;align-items:center;gap:var(--space-16);}
  .wa-figure .wic-circle{width:260px;max-width:82%;height:auto;border-radius:0;}
  .wa-figure .wic-arrow{width:38px;height:auto;border-radius:0;}
  .wa-headband{font-size:var(--typo-label-large);}
}

@media (max-width:768px){
  .dz-grid{grid-template-columns:1fr;gap:var(--space-16);max-width:460px;}
}

/* ===== 의학정보(블로그) 목록 — 유테라 blog 디자인 참조 ===== */
/* 카테고리 = 표(테두리 격자 타일) — 유테라 blog-cat1 참조 */
.hi-cats{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--c-border-default);border-left:1px solid var(--c-border-default);margin:0 0 var(--space-60);}
.hi-cat{border-right:1px solid var(--c-border-default);border-bottom:1px solid var(--c-border-default);padding:var(--space-22) var(--space-12);text-align:center;font-family:var(--font-sans);font-size:var(--typo-label-medium);color:var(--c-text-body);background:#fff;cursor:pointer;transition:background .15s,color .15s;}
.hi-cat:hover{background:var(--c-bg-subtle);}
.hi-cat.is-active{background:var(--c-page-accent);color:#fff;font-weight:700;}
.hi-grid{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-80) var(--space-40);margin:0;padding:0;}
.hi-card a{display:block;}
.hi-card-thumb{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--c-bg-subtle);border-radius:var(--shape-image);}
.hi-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease;}
@media(hover:hover){.hi-card a:hover .hi-card-thumb img{transform:scale(1.05);}}
.hi-card-body{display:block;padding:var(--space-20) 0 0;}
.hi-card-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--font-sans);font-weight:700;font-size:var(--typo-label-large);line-height:1.5;color:var(--c-text-primary);margin:0 0 var(--space-8);}
.hi-card-sum{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--font-sans);font-size:var(--typo-label-medium);line-height:1.55;color:var(--c-text-body);margin:0 0 var(--space-40);}
.hi-card-meta{display:flex;align-items:center;gap:var(--space-8);}
.hi-card-cat{background:var(--c-page-accent);color:#fff;font-family:var(--font-sans);font-size:var(--typo-tag);font-weight:700;padding:var(--space-4) var(--space-10);line-height:1.5;white-space:nowrap;}
.hi-card-date{margin-left:auto;font-family:var(--font-sans);font-size:var(--typo-detail-medium);color:var(--c-text-secondary);}
/* 페이지네이션 < 1 2 3 4 > */
.hi-pager{display:flex;justify-content:center;align-items:center;gap:var(--space-8);margin-top:calc(var(--space-120) + var(--space-40));margin-bottom:var(--space-80);}
.hi-pg,.hi-pg-arrow{display:flex;align-items:center;justify-content:center;min-width:30px;height:30px;font-family:var(--font-sans);font-size:var(--typo-label-medium);color:var(--c-text-body);text-decoration:none;transition:background .15s,color .15s;}
.hi-pg:hover,.hi-pg-arrow:hover{background:var(--c-bg-subtle);}
.hi-pg.is-active{background:var(--c-page-accent);color:#fff;font-weight:700;}
.hi-pg-arrow{color:var(--c-page-accent);}
.hi-pg-arrow svg{width:20px;height:20px;display:block;}
.hi-pg-arrow[aria-disabled="true"]{opacity:.3;pointer-events:none;}
@media(max-width:1000px){.hi-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:768px){.hi-grid{grid-template-columns:1fr;gap:var(--space-40);}.hi-cats{grid-template-columns:repeat(2,1fr);margin-bottom:var(--space-40);}.hi-cat{padding:var(--space-12) var(--space-4);font-size:var(--typo-detail-medium);}.hi-pager{margin-top:var(--space-60);}}