@charset "utf-8";
/* ============================================================
   lydia-sub.css
   리디아 여성의원 — 서브페이지 공통 스타일
   (reset.css · font.css · lydia-variables.css 선적용 전제)
   ============================================================ */


/* ─────────────────────────────────────────────
   0. 공통 레이아웃
────────────────────────────────────────────── */
.sub-page {
  background: var(--bg-base);
}

.sub-inner {
  max-width: var(--max-width);
  margin: 0 auto;
  padding-left:  var(--safe-padding);
  padding-right: var(--safe-padding);
}

/* 섹션 헤더 공통 */
.sub-section-hd {
  text-align: center;
  margin-bottom: var(--sp-3xl);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-sm);
}

.sub-clinic-logo {
  height: 66px;
  width: auto;
  margin-bottom: var(--sp-xs);
}
.sub-clinic-logo--light {
  filter: brightness(0) invert(1);
}

/* 공통 타이틀 */
.sub-title {
  font-family: var(--font-sans);
  font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl));
  font-weight: 400;
  color: var(--txt-base);
  letter-spacing: -0.03em;
  line-height: var(--lh-tight);
  word-break: keep-all;
}
.sub-title strong { font-weight: 700; }
.sub-title--light { color: var(--white); }

.sub-label-en--light { color: rgba(255,255,255,0.6); }

.sub-desc {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-normal);
}


/* ─────────────────────────────────────────────
   S01. 서브 타이틀 배너
────────────────────────────────────────────── */
.sub-banner {
  position: relative;
  overflow: hidden;
  min-height: 340px;
  display: flex;
  flex-direction: column;
}

/* 배경 이미지 */
.sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* 텍스트 영역 */
.sub-banner-inner {
  position: relative;
  z-index: 1;
  max-width: var(--max-width);
  margin: 0 auto;
  width: 100%;
  padding: var(--sp-4xl) var(--safe-padding) var(--sp-3xl);
  text-align: center;
}

.sub-banner-inner strong {
  font-weight: 700;
}

.sub-banner-text {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xs);
}

.sub-banner-pretitle {
  font-size: var(--fs-body);
  color: var(--main-color);
  font-weight: 500;
  letter-spacing: -0.01em;
}

.sub-banner-title {
  font-family: var(--font-sans);
  font-size: clamp(var(--fs-2xl), 5vw, 3.2rem);
  font-weight: 700;
  color: var(--txt-base);
  letter-spacing: -0.04em;
  line-height: var(--lh-normal);
}
.sub-banner-title-point {
  color: var(--main-color);
}

.sub-banner-en {
  font-size: var(--fs-sm);
  letter-spacing: 0.12em;
  color: var(--txt-light);
  text-transform: uppercase;
  margin-top: var(--sp-2xs);
}

/* 하단 정보 아이콘 바 */
.sub-banner-info {
  position: relative;
  z-index: 1;
  display: flex;
}
.sub-banner-info-img {
  max-width: 647px;
  width: 100%;
  height: auto;
}


/* ─────────────────────────────────────────────
   S02. 소개 + 영상
────────────────────────────────────────────── */
.sub-intro {
  padding: var(--sp-5xl) 0;
}

.sub-intro-text {
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-r);
}

.sub-intro-text p strong {
  text-decoration: underline;
  font-weight: bold;
}

.sub-intro-lead {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  font-weight: 500;
  word-break: keep-all;
  margin-top: 2%;
}

.sub-intro-desc {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  font-weight: 500;
  word-break: keep-all;
}

/* 유튜브 16:9 비율 래퍼 */
.sub-video-wrap {
  max-width: 760px;
  margin: 4% auto;
}

.sub-video-ratio {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  background: #000;
  overflow: hidden;
}
.sub-video-ratio iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.sub-video-caption {
  text-align: right;
  font-size: var(--fs-xs);
  color: var(--txt-light);
  margin-top: var(--sp-xs);
}


/* ─────────────────────────────────────────────
   S03. 특징 4개 카드
────────────────────────────────────────────── */
.sub-feature {
  background: #ede8f5;
  padding: var(--sp-5xl) 0;
}

.sub-feature .sub-title 
{
  color: #82367a;
}

.sub-feature .sub-label-en {
    color: #82367a;
    font-size: var(--fs-body);
    letter-spacing: 0.2em;
    padding: 0.5em 3em;
    margin: 1em auto  0.5em;
}

/* 영문 라벨 — pill 테두리 형태 */
.sub-label-en {
  display: inline-block;
  font-size: var(--fs-xs);
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: #000;
  font-weight: 400;
  border: none;
  padding: 0.35em 1.4em;
  line-height: var(--lh-normal);
}
.sub-label-en--light {
  color: rgba(255,255,255,0.8);
  border-color: rgba(255,255,255,0.5);
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3xl) var(--sp-4xl);
  max-width: 900px;
  margin: 0 auto;
}

/* 카드 — 박스 없이 타이틀 pill + 텍스트 구조 */
.feature-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  text-align: center;
  background: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
}
.feature-card:hover {
  transform: none;
  box-shadow: none;
}

/* 타이틀 — 보라 pill 버튼 형태 */
.feature-card-title {
  display: inline-block;
  width: 100%;
  max-width: 340px;
  background: #533fa4;
  color: var(--white);
  font-size: var(--fs-body);
  font-weight: 700;
  letter-spacing: -0.01em;
  padding: 0.8em 2em;
  border-radius: var(--radius-pill);
  text-align: center;
}

.feature-card-desc {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-tight);
  word-break: keep-all;
  text-align: center;
}


/* ─────────────────────────────────────────────
   S04. 맞춤형 디자인
────────────────────────────────────────────── */
.sub-design {
  background: var(--bg-base);
  padding: var(--sp-5xl) 0;
}

/* 타이틀 아래 짧은 바 */
.sub-title-bar {
  display: block;
  width: 40px;
  height: 3px;
  background: var(--txt-base);
  margin: var(--sp-xs) auto 0;
}

/* 이미지 리스트 — 세로로 쌓기 */
.design-img-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-xl);
  max-width: 900px;
  margin: 0 auto;
}

.design-img-item {
  width: 100%;
}
.design-img-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* 중간 캡션 */
.design-caption {
  text-align: center;
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  word-break: keep-all;
}
.design-caption strong {
  color: var(--txt-base);
  font-weight: 700;
}


/* ─────────────────────────────────────────────
   S05. 필요한 경우
────────────────────────────────────────────── */
.sub-needs {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

/* 배경 이미지 */
.sub-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* 어두운 오버레이 */
.sub-needs-bg::after {
  content: '';
  position: absolute;
  inset: 0;
}

.sub-needs-inner {
  position: relative;
  z-index: 1;
}

.sub-needs-inner .sub-title,
.sub-needs-inner .sub-label-en {
  color: var(--accent-golden);
}

/* 리스트 */
.needs-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  max-width: 600px;
  margin: 0 auto;
}

.needs-item {
  border: 1px solid var(--accent-golden);
  border-radius: var(--radius-pill);
  padding: var(--sp-r) var(--sp-2xl);
  text-align: center;
  font-size: var(--fs-body);
  color: var(--white);
  letter-spacing: -0.01em;
  line-height: var(--lh-normal);
  transition: background var(--duration), border-color var(--duration);
  counter-reset: advantage-counter;
}
.needs-item:hover {
  background: rgba(115, 34, 105, 0.5);
  border-color: var(--main-color-light);
}


.needs-list li {
  counter-increment: needs-counter;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--sp-r);
  line-height: var(--lh-normal);
  word-break: keep-all;
}


/* ─────────────────────────────────────────────
   S06. 리디아의 특별함
────────────────────────────────────────────── */
.sub-special {
  padding: var(--sp-5xl) 0;
}

.special-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-xl);
  max-width: 900px;
  margin: 0 auto;
}

.special-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-sm);
}

/* 이미지 + 번호 뱃지 */
.special-card-img {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.special-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  max-width: 285px;
  max-height: 185px;
}

/* 번호 뱃지 (이미지 우상단) */
.special-card-num {
  position: absolute;
  top: var(--sp-sm);
  right: var(--sp-sm);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #5a3e28;
  color: var(--white);
  font-size: var(--fs-xs);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.02em;
}

.special-card-label {
  font-size: var(--fs-md);
  color: var(--txt-base);
  letter-spacing: -0.01em;
  text-align: center;
}

.special-card-label strong {
  font-weight: 700;
}


/* ─────────────────────────────────────────────
   반응형 — 태블릿 (≤ 1024px)
────────────────────────────────────────────── */
@media (max-width: 1024px) {

  .sub-banner-inner { padding-top: var(--sp-3xl); }

  .feature-grid { grid-template-columns: 1fr 1fr; }

  .design-grid  { grid-template-columns: 1fr 1fr; }

  .special-grid { grid-template-columns: repeat(3, 1fr); }
}


/* ─────────────────────────────────────────────
   반응형 — 모바일 (≤ 639px)
────────────────────────────────────────────── */
@media (max-width: 639px) {

  /* 배너 */
  .sub-banner { min-height: 260px; }
  .sub-banner-title { font-size: var(--fs-xl); }
  .sub-banner-bg img { object-position: 70% center; }

  /* 특징 카드 → 1열 */
  .feature-grid { grid-template-columns: 1fr; }

  /* 디자인 → 1열 */
  .design-grid  { grid-template-columns: 1fr; }

  /* 특별함 → 2열 */
  .special-grid { grid-template-columns: repeat(2, 1fr); }
  .special-card-num { width: 26px; height: 26px; font-size: 0.6rem; }
}


/* ─────────────────────────────────────────────
   스크롤 페이드인 애니메이션 (lydia-sub.js 연동)
────────────────────────────────────────────── */
.fade-ready {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity  0.6s var(--ease-out),
    transform 0.6s var(--ease-out);
}

.fade-ready.fade-in {
  opacity: 1;
  transform: translateY(0);
}

/* 카드들 순서대로 딜레이 */
.feature-card:nth-child(1) { transition-delay: 0s;    }
.feature-card:nth-child(2) { transition-delay: 0.1s;  }
.feature-card:nth-child(3) { transition-delay: 0.2s;  }
.feature-card:nth-child(4) { transition-delay: 0.3s;  }

.special-card:nth-child(1) { transition-delay: 0s;    }
.special-card:nth-child(2) { transition-delay: 0.08s; }
.special-card:nth-child(3) { transition-delay: 0.16s; }
.special-card:nth-child(4) { transition-delay: 0.24s; }
.special-card:nth-child(5) { transition-delay: 0.32s; }
.special-card:nth-child(6) { transition-delay: 0.40s; }

.needs-item:nth-child(1) { transition-delay: 0s;    }
.needs-item:nth-child(2) { transition-delay: 0.08s; }
.needs-item:nth-child(3) { transition-delay: 0.16s; }
.needs-item:nth-child(4) { transition-delay: 0.24s; }
.needs-item:nth-child(5) { transition-delay: 0.32s; }


/* ============================================================
   1-5 소음순성형 전용 / 일부 공통 확장 스타일
   ============================================================ */

/* ─────────────────────────────────────────────
   S01. 배너 변형 — 핑크 계열 (1-5)
   기존 .sub-banner 공통 유지, 색상만 오버라이드
────────────────────────────────────────────── */
/* 배너 영문 pill 형태 (1-5 전용) */
.sub-banner-en--pill {
  display: inline-block;
  align-self: flex-start;
  font-size: var(--fs-xs);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--white);
  background: var(--main-color);
  border-radius: var(--radius-pill);
  padding: 0.35em 1.4em;
  margin-top: var(--sp-2xs);
  font-weight: 500;
}

/* 배너 사전 타이틀 — 핑크 계열 */
.sub-banner-pretitle--pink {
  color: var(--main-color-dark);
  font-size: var(--fs-lg);
  font-weight: 400;
}

/* 배너 타이틀 — 어두운 색 (배경이 밝은 핑크이므로) */
.sub-banner-title--dark {
  color: var(--main-color-dark);
}
/* ── 섹션 전체 */
.sub-banner--labia {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #f5dce4;
}

/* ── 배경 이미지: 인물 우측 */
.sub-banner--labia .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--labia .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* ── inner: 좌측 50% 영역, 세로 중앙 */
.sub-banner--labia .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ── 텍스트 블록 */
.sub-banner--labia .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* 메인 타이틀
   시안: "레이저" bold + "질성형" regular */
.sub-banner--labia .sub-banner-title {
  font-size: clamp(32px, 3.6vw, 44px);
  line-height: var(--lh-normal);
  letter-spacing: -0.05em;
  color: var(--main-color);
  margin: 0;
  font-weight: 400;       /* 기본은 regular */
}
.sub-banner--labia .sub-banner-title strong {
  font-weight: 700;       /* 레이저만 bold */
}
.sub-banner--labia .sub-banner-title-point {
  font-weight: 400;       /* 질성형 regular */
}

/* 서브 타이틀 "소음순성형" */
.sub-banner--labia .sub-banner-pretitle {
  font-size: 22px;
  font-weight: 500;
  color: #4a1c35;
  letter-spacing: -0.02em;
  margin: 0;
}

/* 영문 pill 뱃지 */
.sub-banner--labia .sub-banner-en--pill {
    display: inline-block;
    margin-top: 4px;
    padding: 8px 24px;
    border-radius: 100px;
    background-color: var(--main-color);
    font-size: var(--fs-xs);
    letter-spacing: 0.3em;
    color: #fff;
    margin: 1em auto;
    font-weight: 400;
}

/* 요약 문장 */
.sub-banner--labia .sub-banner-summary {
  margin: 2em 0;
  font-size: var(--fs-body);
  line-height: 1.85;
  font-weight: 400;
  color: var(--main-color);
  word-break: keep-all;
  padding: 0;
  list-style: none;
}


/* ─────────────────────────────────────────────
   S03. 소음순성형의 장점
────────────────────────────────────────────── */
.sub-advantage {
  background-image: url('/wp-content/uploads/2026/06/1_5.소음순성형_장정bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
  position: relative;
}

/* 배경 위 밝은 오버레이 (핑크 배경이 연하므로 약하게) */
.sub-advantage::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.45);
  z-index: 0;
}

.sub-advantage .sub-inner {
  position: relative;
  z-index: 1;
}

.sub-advantage .sub-title,
.sub-advantage .sub-label-en {
  color: var(--accent-brown);
}

/* 장점 이미지 — 가로 꽉 채움 */
.advantage-img-wrap {
  max-width: 689px;
  margin: 0 auto var(--sp-3xl);
}
.advantage-img-wrap img {
  width: 100%;
  height: auto;
  display: block;
}

/* 장점 리스트 — 번호 원형 + 텍스트 */
.advantage-list {
  max-width: 450px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  counter-reset: advantage-counter;
}

.advantage-list li {
  counter-increment: advantage-counter;
  display: flex;
  align-items: center;
  gap: var(--sp-r);
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-normal);
  word-break: keep-all;
}

.advantage-list li::before {
  content: counter(advantage-counter, decimal-leading-zero);
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--black);
  color: var(--white);
  font-size: var(--fs-body);
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0;
}


/* ─────────────────────────────────────────────
   S04. 필요한 경우 — 핑크 bg 변형 (1-5)
   기존 .sub-needs (어두운 배경) 와 별도
────────────────────────────────────────────── */
.sub-needs--pink {
  background: var(--accent-pink);
  position: static;
  overflow: visible;
}

.sub-needs--pink .sub-title {
  color: var(--black);
}

.sub-needs--pink .sub-label-en {
  color: var(--txt-muted);
}

/* 필요한경우 이미지 */
.needs-img-wrap {
  max-width: 1226px;
  margin: 0 auto var(--sp-3xl);
}
.needs-img-wrap img {
  width: 100%;
  height: auto;
  display: block;
}

/* 필요한 경우 표 형태 리스트 */
.needs-table-list {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.needs-table-item {
  display: flex;
  align-items: stretch;
  margin : 0.2em 0;
}

.needs-table-label {
  flex-shrink: 0;
  width: 200px;
  background: var(--accent-light-pink);
  color: var(--white);
  font-size: var(--fs-body);
  padding: var(--sp-xs) var(--sp-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: var(--lh-normal);
  word-break: keep-all;
  border-radius: var(--radius-sm);
  font-weight: bold;
  margin-right: 0.2em;
}

.needs-table-desc {
  flex: 1;
  font-size: var(--fs-body);
  color: #77545b;
  padding: var(--sp-xs) var(--sp-xl);
  line-height: var(--lh-loose);
  word-break: keep-all;
  display: flex;
  align-items: center;
  background: var(--accent-rose);
  border-radius: var(--radius-sm);
  margin-left: 0.2em;
}



/* ─────────────────────────────────────────────
   S06. 주의사항 (1-5 신규 섹션)
────────────────────────────────────────────── */
.sub-caution {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

/* 배경 이미지 */
.sub-caution-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-caution-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* 어두운 오버레이 */
.sub-caution-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(30, 8, 8, 0.65);
}

.sub-caution-inner {
  position: relative;
  z-index: 1;
}

/* 주의사항 리스트 */
.caution-list {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
}

.caution-item {
  display: flex;
  align-items: center;
  gap: var(--sp-r);
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: var(--radius-sm);
  padding: var(--sp-r) var(--sp-xl);
  font-size: var(--fs-body);
  color: rgba(255, 255, 255, 0.9);
  line-height: var(--lh-normal);
  word-break: keep-all;
  transition: background var(--duration);
}
.caution-item:hover {
  background: rgba(255, 255, 255, 0.12);
}

.caution-num {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--main-color);
  color: var(--white);
  font-size: var(--fs-body);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.1em;
}


/* ─────────────────────────────────────────────
   반응형 추가 — 태블릿 (≤ 1024px)
────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .needs-table-label { width: 160px; }
}


/* ─────────────────────────────────────────────
   반응형 추가 — 모바일 (≤ 639px)
────────────────────────────────────────────── */
@media (max-width: 639px) {

  /* 필요한 경우 표 → 세로 */
  .needs-table-item {
    flex-direction: column;
  }
  .needs-table-label {
    width: 100%;
    padding: var(--sp-sm) var(--sp-lg);
    justify-content: flex-start;
    margin-right: 0;
    text-align: left;
  }
  .needs-table-desc {
    padding: var(--sp-sm) var(--sp-lg);
    margin-left: 0;
  }

  /* 장점 리스트 */
  .advantage-list li {
    border-radius: var(--radius-r);
    padding: var(--sp-sm) var(--sp-r);
  }

  .advantage-list li::before {
    width: 30px;
    height: 30px;
  }

  /* 주의사항 */
  .caution-item {
    padding: var(--sp-sm) var(--sp-r);
    font-size: var(--fs-sm);
  }
}

/* ============================================================
   1-6 음핵성형 전용 스타일
   ============================================================ */

/* ── 섹션 전체 */
.sub-banner--clitoral {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #f5dce4;
}

/* ── 배경 이미지: 인물 우측 */
.sub-banner--clitoral .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--clitoral .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* ── inner: 좌측 50% 영역, 세로 중앙 */
.sub-banner--clitoral .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ── 텍스트 블록 */
.sub-banner--clitoral .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* 메인 타이틀 */
.sub-banner--clitoral .sub-banner-title {
  font-size: clamp(32px, 3.6vw, 44px);
  line-height: var(--lh-normal);
  letter-spacing: -0.05em;
  color: var(--purple);
  margin: 0;
  font-weight: 700;
}
.sub-banner--clitoral .sub-banner-title strong {
  font-weight: 700;
}
.sub-banner--clitoral .sub-banner-title-point {
  font-weight: 400;  
}

.sub-banner--clitoral .sub-banner-pretitle {
  font-size: 22px;
  font-weight: 500;
  color: var(--purple);
  letter-spacing: -0.02em;
  margin: 0;
}

.sub-banner--clitoral .sub-banner-en--pill {
    display: inline-block;
    margin-top: 4px;
    padding: 8px 24px;
    border-radius: 100px;
    background: none;
    color: var(--purple);
    font-size: var(--fs-xs);
    letter-spacing: 0.3em;
    margin: 1em auto;
    font-weight: 400;
}

/* 요약 문장 */
.sub-banner--clitoral .sub-banner-summary {
  margin: 2em 0;
  font-size: var(--fs-body);
  line-height: 1.85;
  font-weight: 400;
  color: var(--purple);
  word-break: keep-all;
  padding: 0;
  list-style: none;
}

/* ─────────────────────────────────────────────
   S03. 장점 섹션 bg 오버라이드
   .sub-advantage 공통 유지, 배경 이미지만 교체
────────────────────────────────────────────── */
.sub-advantage--clitoral {
  background-image: url('/wp-content/uploads/2026/06/1_6.음핵성형_장점bg.jpg');
}

.sub-advantage--clitoral .sub-title,
.sub-advantage--clitoral .sub-label-en {
  color: var(--purple);
}

/* ─────────────────────────────────────────────
   S03. 장점 텍스트 블록 + 강조 박스
────────────────────────────────────────────── */
.advantage-text-block {
  max-width: 660px;
  margin: 0 auto var(--sp-xl);
  text-align: center;
}
.advantage-text-block p {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  word-break: keep-all;
}

/* 강조 박스 — 보라 배경 + 흰 테두리 */
.advantage-highlight-box {
  max-width: 660px;
  margin: 0 auto;
  border-radius: var(--radius-r);
  border: 1px solid var(--accent-lavender);
  overflow: hidden;
}

.advantage-highlight-main {
  background: var(--accent-lavender);
  color: #ffe2df;
  font-size: var(--fs-body);
  font-weight: 500;
  padding: var(--sp-sm) var(--sp-xl);
  text-align: center;
  line-height: var(--lh-normal);
  word-break: keep-all;
}

.advantage-highlight-sub {
  background: var(--white);
  color: var(--accent-lavender);
  font-size: var(--fs-body);
  padding: var(--sp-sm) var(--sp-xl);
  text-align: center;
  line-height: var(--lh-loose);
  word-break: keep-all;
}

/* ─────────────────────────────────────────────
   반응형 추가
────────────────────────────────────────────── */
@media (max-width: 639px) {

  .sub-banner--clitoral {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--clitoral .sub-banner-inner {
    width: 100%;
    margin: 0 auto;
    padding: 40px 20px 36px;
    min-height: 460px;
    justify-content: center;
  }

  .advantage-highlight-main,
  .advantage-highlight-sub {
    padding: var(--sp-sm) var(--sp-r);
  }

  .needs-list li {
    text-align: left;
  }
}


/* ============================================================
   1-7 G스팟성형 전용 스타일
   ============================================================ */

/* ── 섹션 전체 */
.sub-banner--gspot {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
}

/* ── 배경 이미지: 인물 우측 */
.sub-banner--gspot .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--gspot .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* ── inner: 좌측 50% 영역, 세로 중앙 */
.sub-banner--gspot .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ── 텍스트 블록 */
.sub-banner--gspot .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* 메인 타이틀 */
.sub-banner--gspot .sub-banner-title {
  font-size: clamp(32px, 3.6vw, 44px);
  line-height: var(--lh-normal);
  letter-spacing: -0.05em;
  color: var(--accent-light-brown);
  margin: 0;
  font-weight: 700;
}
.sub-banner--gspot .sub-banner-title strong {
  font-weight: 700;
}
.sub-banner--gspot .sub-banner-title-point {
  font-weight: 400;  
}

.sub-banner--gspot .sub-banner-pretitle {
  font-size: 22px;
  font-weight: 500;
  color: var(--accent-light-brown);
  letter-spacing: -0.02em;
  margin: 0;
}

.sub-banner--gspot .sub-banner-en--pill {
    display: inline-block;
    margin-top: 4px;
    padding: 8px 24px;
    border-radius: 100px;
    background: none;
    color: var(--accent-light-brown);
    font-size: var(--fs-xs);
    letter-spacing: 0.3em;
    margin: 1em auto;
    font-weight: 400;
}

/* 요약 문장 */
.sub-banner--gspot .sub-banner-summary {
  margin: 2em 0 0;
  font-size: var(--fs-body);
  line-height: 1.85;
  font-weight: 400;
  color: var(--accent-light-brown);
  word-break: keep-all;
  padding: 0;
  list-style: none;
}

/* ─────────────────────────────────────────────
   S03. 수술 방법 섹션 bg 오버라이드
────────────────────────────────────────────── */
.sub-advantage--gspot {
  background-image: url('/wp-content/uploads/2026/06/1_7.G스팟성형_방법bg.jpg');
}
.sub-advantage--gspot .advantage-img-wrap {
  max-width: 885px;
}

.sub-advantage.sub-advantage--gspot .sub-title,
.sub-advantage.sub-advantage--gspot .sub-label-en {
  color: #a5574f;
}


/* ─────────────────────────────────────────────
   S04. 리디아 지스팟 수술의 특징
   — 체크 아이콘 + 텍스트 2×2 그리드
────────────────────────────────────────────── */
.sub-gspot-feature {
  background: #fdf0f5;
  padding: var(--sp-5xl) 0;
}

.sub-gspot-feature .sub-title {
  color: #9d2854;
}

.sub-gspot-feature .sub-label-en {
    color: var(--accent-rose);
    background-color: var(--bg-base);
    border-radius: var(--radius-pill);
    border: 1px solid var(--accent-rose);
    font-size: var(--fs-sm);
    letter-spacing: 0.2em;
    padding: 0.5em 3em;
    margin: 1em auto  0.5em;

}


.gspot-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3xl) var(--sp-4xl);
  max-width: 760px;
  margin: 0 auto;
}

.gspot-feature-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  text-align: center;
}

.gspot-feature-icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}
.gspot-feature-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.gspot-feature-desc {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  word-break: keep-all;
}

.needs-list {
    max-width: 760px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--sp-sm);
}

.needs-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--sp-r);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius-sm);
    padding: var(--sp-r) var(--sp-xl);
    font-size: var(--fs-body);
    color: rgba(255, 255, 255, 0.9);
    line-height: var(--lh-normal);
    word-break: keep-all;
    transition: background var(--duration);
}

.needs-num {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--white);
    color: var(--txt-base);
    font-size: var(--fs-body);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.1em;
}


/* ─────────────────────────────────────────────
   반응형 추가
────────────────────────────────────────────── */
@media (max-width: 639px) {
  .gspot-feature-grid {
    grid-template-columns: 1fr;
    gap: var(--sp-xl);
  }

  .sub-banner--gspot {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--gspot .sub-banner-inner {
    width: 100%;
    margin: 0 auto;
    padding: 40px 20px 36px;
    min-height: 460px;
    justify-content: center;
  }
}


/* ============================================================
   2-1 자궁근종용해술 전용 스타일
   ============================================================ */

/* ─────────────────────────────────────────────
   S02. 자궁근종이란?
────────────────────────────────────────────── */
.sub-myoma-intro {
  background: var(--bg-base);
  padding: var(--sp-5xl) 0;
}

.myoma-intro-text {
  text-align: center;
  max-width: 860px;
  margin: 0 auto var(--sp-3xl);
}

.myoma-intro-text .sub-intro-lead strong {
  text-decoration: underline;
  font-weight: 700;
}

/* 아이콘 이미지 — 가로 꽉 채움 */
.myoma-symptom-wrap {
  max-width: 760px;
  margin: 0 auto;
}
.myoma-symptom-img {
  width: 100%;
  height: auto;
  display: block;
}


/* ─────────────────────────────────────────────
   S03. 자궁근종 위치에 따른 분류
────────────────────────────────────────────── */
.sub-myoma-class {
  background: var(--accent-pink);
  padding: var(--sp-5xl) 0;
}

.sub-myoma-class .sub-label-en,
.sub-myoma-class .sub-title {
  color: var(--main-color);
}

.myoma-class-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-3xl);
  max-width: 860px;
  margin: 0 auto;
}

.myoma-class-img {
  width: 100%;
  max-width: 313px;
  margin: 0 auto;
}
.myoma-class-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* 치료방법 2열 */
/* 치료방법 전체 래퍼 */
.myoma-treatment-wrap {
  width: 100%;
  margin-top: var(--sp-4xl);
}

.myoma-treatment-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-xl) var(--sp-4xl);
  max-width: 640px;
  margin: 0 auto;
}

.myoma-treatment-col {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
}

/* 타이틀 — 연한 보라 pill 형태 */
.myoma-treatment-title {
  display: inline-block;
  background: var(--white);
  color: var(--main-color);
  font-size: var(--fs-lg);
  padding: 0.5em 1.6em;
  border-radius: var(--radius-pill);
  margin-bottom: var(--sp-sm);
  text-align: center;
}

.myoma-treatment-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xs);
  margin-left: 3em;
}
.myoma-treatment-list li {
  font-size: var(--fs-body);
  color: var(--main-color);
  line-height: var(--lh-normal);
}

/* 섹션 안 유튜브 영상 래퍼 */
.myoma-video-wrap {
  width: 100%;
  max-width: 1200px;
  margin: var(--sp-4xl) auto 0;
  background: var(--white);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.myoma-video-wrap .sub-video-ratio {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  background: #000;
}
.myoma-video-wrap .sub-video-ratio iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}


/* ─────────────────────────────────────────────
   S04. 자궁근종용해술
────────────────────────────────────────────── */
.sub-myoma-lysis {
  background-image: url('/wp-content/uploads/2026/06/2_1.자궁근종용해술_용해술bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
  position: relative;
}
.sub-myoma-lysis::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.55);
  z-index: 0;
}
.sub-myoma-lysis .sub-inner {
  position: relative;
  z-index: 1;
}
.sub-myoma-lysis .sub-title,
.sub-myoma-lysis .sub-label-en {
  color: var(--main-color);
}

/* 용해술 이미지 캡션 */
.myoma-lysis-img-wrap {
  text-align: center;
  margin-bottom: var(--sp-3xl);
}
.myoma-lysis-img-wrap img {
  width: 100%;
  max-width: 860px;
  height: auto;
  display: block;
  margin: 0 auto;
}
.myoma-lysis-img-caption {
  display: block;
  font-size: var(--fs-sm);
  color: var(--main-color);
  text-align: center;
  margin-top: var(--sp-sm);
  letter-spacing: -0.01em;
}

/* 텍스트 블록 */
.myoma-lysis-text-block {
  max-width: 720px;
  margin: 0 auto var(--sp-2xl);
  text-align: center;
}
.myoma-lysis-text-block:last-child {
  margin-bottom: 0;
}

/* 일반 단락 */
.myoma-lysis-para {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  word-break: keep-all;
  margin: 0;
}

/* 하이라이트 단락 — 보라 배경 인라인 */
.myoma-lysis-para--highlight {
  display: inline-block;
  background: var(--main-color);   /* #732269 */
  color: #fff;
  padding: 0.3em 1.2em;
  border-radius: 2px;
  margin-top: var(--sp-xs);
  font-weight: 500;
}


/* ─────────────────────────────────────────────
   S05. 영상 only (상하 여백만 조정)
────────────────────────────────────────────── */
.sub-intro--video-only {
  padding: var(--sp-4xl) 0;
  background: #1a1a1a;
}

.sub-youtube .sub-video-wrap {
  margin: 2em auto;
}
/* ─────────────────────────────────────────────
   S06. 초음파 전/후
────────────────────────────────────────────── */
.sub-ultrasound {
  background: #bb45af;
  padding: var(--sp-4xl) 0;
}

.sub-ultrasound .sub-title--light {
  color: var(--white);
}

.ultrasound-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-xl);
  max-width: 760px;
  margin: 0 auto;
}

.ultrasound-item {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  align-items: center;
}

.ultrasound-img-wrap {
  width: 100%;
  border: 3px solid rgba(255,255,255,0.4);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.ultrasound-img-wrap img {
  width: 100%;
  height: auto;
  display: block;
}

.ultrasound-label {
  font-size: var(--fs-body);
  color: rgba(255,255,255,0.9);
  text-align: center;
  font-weight: 500;
}


/* ─────────────────────────────────────────────
   S07. 고주파 장점 리스트
────────────────────────────────────────────── */
.sub-myoma-merit {
  background: #ffe7e2;
  padding: var(--sp-5xl) 0;
}

.sub-myoma-merit .sub-title {
  color: var(--main-color);
}

.myoma-merit-list {
  list-style: none;
  padding: 0;
  max-width: 700px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  counter-reset: merit-counter;
}

.myoma-merit-list li {
  counter-increment: merit-counter;
  display: flex;
  align-items: center;
  gap: var(--sp-r);
  font-size: var(--fs-body);
  color: var(--main-color);
  line-height: var(--lh-normal);
  padding: var(--sp-r) var(--sp-xl) var(--sp-r) var(--sp-r);
  background: #fdf8ff;
  border-radius: var(--radius-pill);
  border: 1px solid #e8d8f0;
  word-break: keep-all;
}

/* 01 02 03 04 원형 뱃지 */
.myoma-merit-list li::before {
  content: counter(merit-counter, decimal-leading-zero);
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  color: var(--main-color); 
  font-size: var(--fs-body);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0;
}

/* ─────────────────────────────────────────────
   S08. 자가진단 테스트
────────────────────────────────────────────── */
.sub-self-test {
  background-image: url('/wp-content/uploads/2026/06/2_1.자궁근종용해술_테스트bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
  position: relative;
}
.sub-self-test::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(60, 10, 60, 0.72);
  z-index: 0;
}
.sub-self-test .sub-inner {
  position: relative;
  z-index: 1;
}

.sub-self-test .sub-title,
.sub-self-test .sub-label-en,
.sub-self-test .sub-intro-desc {
  color: #ffbeb3;
}

.sub-self-test .sub-intro-desc  {
  font-weight: 400;
}

.self-test-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-sm) var(--sp-xl);
  max-width: 760px;
  margin: 0 auto;
}

.self-test-item {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  font-size: var(--fs-body);
  color: var(--white);
  line-height: var(--lh-normal);
  word-break: keep-all;
  border: 1px solid #ffbeb3;
  border-radius: var(--radius-pill);
  padding: var(--sp-r);
}
.self-test-item img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  object-fit: contain;
}


/* ─────────────────────────────────────────────
   S09. 묻고 답하기 QnA
   — main.css의 .one-qna-li 공통 스타일 재사용
────────────────────────────────────────────── */
.sub-qna {
  background: var(--bg-base);
  padding: var(--sp-5xl) 0;
}

.sub-qna .sub-title {
  color: var(--main-color);
}

/* ─────────────────────────────────────────────
   반응형 추가
────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .myoma-treatment-grid { grid-template-columns: 1fr 1fr; }
  .ultrasound-grid { grid-template-columns: 1fr 1fr; }
  .self-test-grid  { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 639px) {
  .myoma-merit-list li {
    border-radius: var(--radius-r);
    padding: var(--sp-sm) var(--sp-r);
    font-size: var(--fs-sm);
  }
  .myoma-treatment-grid { grid-template-columns: 1fr; }
  .ultrasound-grid { grid-template-columns: 1fr; }
  .self-test-grid  { grid-template-columns: 1fr; }
  .myoma-merit-list li {
    border-radius: var(--radius-r);
    padding: var(--sp-sm) var(--sp-r);
    font-size: var(--fs-sm);
  }
}


/* ============================================================
   2-2 요실금 전용 스타일
   ============================================================ */

/* ── 섹션 전체 */
.sub-banner--minisling {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #f2e4ea;
}

/* ── 배경 이미지: 인물 우측 */
.sub-banner--minisling .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--minisling .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* ── inner: 좌측 50%, 세로 중앙 */
.sub-banner--minisling .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ── 텍스트 블록 */
.sub-banner--minisling .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* pretitle */
.sub-banner--minisling .sub-banner-pretitle {
  font-size: var(--fs-body);
  font-weight: 500;
  color: #5f4338;
  letter-spacing: -0.01em;
  margin: 0;
}

/* 메인 타이틀: 시안 기준 2줄 전체 bold */
.sub-banner--minisling .sub-banner-title {
  font-size: clamp(34px, 3.8vw, 48px);
  line-height: var(--lh-normal);
  font-weight: 700;
  letter-spacing: -0.05em;
  color: #5f4338;
  margin: 0;
}
.sub-banner--minisling .sub-banner-title-point {
  font-weight: 700;
  color: #5f4338;
}

/* 영문 */
.sub-banner--minisling .sub-banner-en {
  font-size: var(--fs-body);
  letter-spacing: 0.3em;
  color: #5f4338;
  text-transform: uppercase;
  margin-top: 2px;
}

/* 요약 */
.sub-banner--minisling .sub-banner-summary {
  margin: 2em 0;
  font-size: var(--fs-body);
  line-height: 1.9;
  font-weight: 400;
  color: #5f4338;
  word-break: keep-all;
  padding: 0;
  list-style: none;
}
/* 첫 줄(조직검사) bold 처리 — 시안 반영 */
.sub-banner--minisling .sub-banner-summary br + *,
.sub-banner--minisling .sub-banner-summary {
  font-weight: 400;
}

/* ── 반응형 */
@media (max-width: 1024px) {
  .sub-banner--minisling {
    height: 360px;
    min-height: 360px;
  }
  .sub-banner--minisling .sub-banner-inner {
    width: 55%;
    padding: 40px 28px 30px;
  }
  .sub-banner--minisling .sub-banner-title {
    font-size: 34px;
  }
}

@media (max-width: 639px) {
  .sub-banner--minisling {
    height: auto;
    min-height: 460px;
  }
  .sub-banner--minisling .sub-banner-bg img {
    object-position: 70% center;
  }
  .sub-banner--minisling .sub-banner-inner {
    width: 100%;
    padding: 40px 20px 36px;
    min-height: 440px;
    justify-content: center;
  }
  .sub-banner--minisling .sub-banner-title {
    font-size: 30px;
  }
  .sub-banner--minisling .sub-banner-pretitle {
    font-size: 13px;
  }
  .sub-banner--minisling .sub-banner-summary {
    font-size: 13px;
  }
}

.sub-minisling-intro {
  background: var(--bg-base);
  padding: var(--sp-5xl) 0;
}

.sub-minisling-video {
  background: #f2f2f2;
  padding: var(--sp-5xl) 0;
}
/* ─────────────────────────────────────────────
   S03. Mini-Sling 장점
────────────────────────────────────────────── */
.sub-minisling {
  background: #ffebde;
  padding: var(--sp-5xl) 0;
}

.minisling-img-wrap {
  max-width: 855px;
  margin: 0 auto var(--sp-xl);
}
.minisling-img-wrap img {
  width: 100%;
  height: auto;
  display: block;
}

.sub-minisling .sub-title {
  color:  var(--main-color)
}

.sub-minisling .sub-label-en {
  color: #fff;
  background-color: var(--main-color);
  padding: var(--sp-xs) var(--sp-xl);
  border-radius: var(--radius-pill);
}
.minisling-text-block {
    max-width: 720px;
    margin: var(--sp-2xl) auto;
    text-align: center;
}
.minisling-para {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    word-break: keep-all;
    margin: 0;
    display: inline-block;
    background: var(--white);
    color: var(--main-color);
    padding: 0.3em 1.2em;
    border-radius: 2px;
    margin-top: var(--sp-xs);
    font-weight: 500;
}


/* ─────────────────────────────────────────────
   S04. 요실금의 종류
────────────────────────────────────────────── */
.sub-urine-type {
  background-image: url('/wp-content/uploads/2026/06/2_2.요실금_종류bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
  position: relative;
}

.sub-urine-type .sub-title,
.sub-urine-type .sub-label-en {
  color: var(--main-color);
}

.urine-type-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);   /* 2×2 */
  gap: var(--sp-3xl) var(--sp-4xl);
  max-width: 760px;
  margin: 0 auto;
}

.urine-type-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  text-align: center;
}

.urine-type-img {
  width: 190px;
  height: 190px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.urine-type-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.urine-type-title {
  font-size: var(--fs-lg);
  font-weight: 500;
  color: var(--main-color);
  letter-spacing: -0.02em;
}

.urine-type-desc {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  word-break: keep-all;
}


/* ─────────────────────────────────────────────
   S05. 어떨때 요실금일까?
────────────────────────────────────────────── */
.sub-urine-when {
  background: #f2e2ff;   /* 시안 연보라 */
  padding: var(--sp-5xl) 0;
}

.sub-urine-when .sub-title,
.sub-urine-when .sub-label-en {
  color: #78449f;
}

.sub-urine-when .sub-label-en {
  background-color: #fff;
  padding: var(--sp-xs) var(--sp-xl);
  border-radius: var(--radius-pill);
}

.urine-when-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-xl);
  max-width: 860px;
  margin: 0 auto;
}

.urine-when-col {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
}

.urine-when-title {
  display: inline-block;
  background: #c578ff;
  color: var(--white);
  font-size: var(--fs-lg);
  font-weight: 500;
  padding: var(--sp-sm) var(--sp-xl);
  border-radius: var(--radius-pill);
  text-align: center;
  margin-bottom: var(--sp-xs);
}

.urine-when-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xs);
  text-align: center;
}
.urine-when-list li {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-normal);
  padding-left: 0.8em;
  position: relative;
  word-break: keep-all;
  list-style: none;
}


/* --------------------------------------------------
   S06. 요실금 자가진단 방법
-------------------------------------------------- */
.sub-urine-selftest {
  background-image: url('/wp-content/uploads/2026/06/2_2.요실금_자가진단bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
  position: relative;
}
.sub-urine-selftest::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.55);
  z-index: 0;
}
.sub-urine-selftest .sub-inner {
  position: relative;
  z-index: 1;
}

.sub-urine-selftest .sub-title,
.sub-urine-selftest .sub-label-en {
  color: #5e4fb7;
}

.sub-urine-selftest .sub-label-en {
  background-color: #f0edff;
  padding: var(--sp-xs) var(--sp-xl);
  border-radius: var(--radius-pill);
}

/* wrap — 카드 박스 제거, 배경 위에 바로 */
.urine-selftest-wrap {
  max-width: 960px;
  margin: 0 auto;
}

/* 2열 그리드 리스트 */
.urine-selftest-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--sp-4xl);
  row-gap: var(--sp-sm);
  margin-bottom: var(--sp-2xl);
  list-style: none;
  padding: 0;
  counter-reset: selftest-counter;
}

.urine-selftest-list li {
  counter-increment: selftest-counter;
  display: flex;
  align-items: baseline;
  gap: 0.5em;
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-normal);
  word-break: keep-all;
}

/* 1) 2) 번호 */
.urine-selftest-list li::before {
  content: counter(selftest-counter) ')';
  flex-shrink: 0;
  font-size: var(--fs-body);
  color: var(--txt-base);
  font-weight: 500;
}

/* 결과 버튼 — 중앙 정렬 pill */
.urine-selftest-result {
  text-align: center;
}
.urine-selftest-result p {
  display: inline-block;
  background: #312867;
  color: var(--white);
  font-size: var(--fs-body);
  font-weight: 500;
  padding: var(--sp-r) var(--sp-3xl);
  border-radius: var(--radius-pill);
  line-height: var(--lh-normal);
}

/* 반응형 */
@media (max-width: 768px) {
  .urine-selftest-list {
    grid-template-columns: 1fr;
  }
  .urine-when-list li {
    padding-left: 0;
  }
  .urine-selftest-result p {
    padding: var(--sp-r) var(--sp-xl);
    font-size: var(--fs-xs);
  }
}


/* ─────────────────────────────────────────────
   S07. 요실금 치료방법
────────────────────────────────────────────── */
.sub-urine-treatment {
  background-image: url('/wp-content/uploads/2026/06/2_2.요실금_치료방법bg.jpg');
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
}
.sub-urine-treatment .sub-inner {
  position: relative;
}

.sub-urine-treatment .sub-title,
.sub-urine-treatment .sub-label-en {
  color: #f8dfd0
}

/* 파트 (복압성 / 절박성) */
.urine-treatment-part {
  max-width: 760px;
  margin: 0 auto var(--sp-3xl);
  display: flex;
  flex-direction: column;
  gap: var(--sp-lg);
}
.urine-treatment-part:last-of-type { margin-bottom: 0; }

/* 구분선 — pill 테두리 박스 */
.urine-treatment-divider {
  align-self: center;
  font-size: var(--fs-xl);
  font-weight: 500;
  color: #f8dfd0;
  border: 1px solid rgba(255,255,255,0.6);
  border-radius: var(--radius-pill);
  padding: 0.4em 2em;
  letter-spacing: 0.05em;
  margin-bottom: var(--sp-sm);
}

/* 소제목 — 밑줄 텍스트 */
.urine-treatment-subtitle {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: #f8dfd0;
  padding-bottom: var(--sp-xs);
  margin-bottom: var(--sp-2xs);
  text-decoration: underline;
}

.urine-treatment-text {
  font-size: var(--fs-body);
  color: #f8dfd0;
  line-height: var(--lh-loose);
  word-break: keep-all;
}

.urine-treatment-text strong{
  font-weight: 500;
}

/* 수술 방법 2열 */
.urine-treatment-surgery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-r);
}
.urine-treatment-surgery-item {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xs);
}

/* 수술명 — 어두운 pill 배경 */
.urine-treatment-surgery-name {
  display: inline-block;
  align-self: flex-start;
  font-size: var(--fs-body);
  font-weight: 700;
  color: #f8dfd0;
  background: #4b3021;
  margin-bottom: var(--sp-2xs);
  padding: var(--sp-xs) var(--sp-xl);
  border-radius: var(--radius-pill);
}

/* ─────────────────────────────────────────────
   반응형 추가
────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .urine-type-grid   { grid-template-columns: repeat(2, 1fr); }
  .urine-when-grid   { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 639px) {
  .urine-type-grid            { grid-template-columns: 1fr; }
  .urine-when-grid            { grid-template-columns: 1fr; }
  .urine-treatment-surgery    { grid-template-columns: 1fr; }
  .urine-selftest-wrap        { padding: var(--sp-xl) var(--sp-r); }
  .urine-treatment-divider {
    font-size: var(--fs-lg);
  }  
  .urine-treatment-subtitle {
    font-size: var(--fs-md);
  }
}

/* ============================================================
   1-4 임플란트 질성형 상단 배너
   - 시안 기준: 텍스트·아이콘바 가운데 정렬, 좌측 50% 영역 안에 위치
   - 배경 인물 이미지는 우측에 자연스럽게 표시
   ============================================================ */

/* ── 섹션 전체 */
.sub-banner--implant-vaginal {
    position: relative;
    overflow: hidden;
    height: 400px;
    min-height: 550px;
    background: #ddc8f0;
    display: block;
}

/* ── 배경 이미지 : 우측으로 자연스럽게 */
.sub-banner--implant-vaginal .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--implant-vaginal .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;  /* 인물 우측 배치 */
  display: block;
}

/* ── inner : 가로 꽉 채우되 max-width 제한 */
.sub-banner--implant-vaginal .sub-banner-inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;      /* 텍스트·아이콘바 모두 가운데 */
  justify-content: center;
  text-align: center;
  /* 좌측 50% 영역에만 콘텐츠 표시 */
  width: 70%;
  margin-left: 0;
  margin-right: auto;
}

/* ── 텍스트 블록 */
.sub-banner--implant-vaginal .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  width: 100%;
}

/* pretitle */
.sub-banner--implant-vaginal .sub-banner-pretitle {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 500;
  color: #5a306e;
  letter-spacing: -0.01em;
}

/* 메인 타이틀
   시안: "임플란트" = bold, "질성형" = regular(얇게)
   → h1 전체를 bold 로 두고 .sub-banner-title-point 를 regular 처리  */
.sub-banner--implant-vaginal .sub-banner-title {
  font-size: clamp(34px, 3.8vw, 46px);
  line-height: var(--lh-normal);
  font-weight: 700;           /* 임플란트 */
  letter-spacing: -0.05em;
  color: #3b0a64;
  margin: 0;
  white-space: nowrap;
}
.sub-banner--implant-vaginal .sub-banner-title-point {
  font-weight: 400;           /* 질성형 — 얇게 */
  color: #3b0a64;
}

/* 영문 소제목 */
.sub-banner--implant-vaginal .sub-banner-en {
  font-size: var(--fs-body);
  font-weight: 500;
  letter-spacing: 0.38em;
  color: #5a306e;
  text-transform: uppercase;
  margin-top: 4px;
}

/* 소개 요약 — <p> 태그 그대로 사용 */
.sub-banner--implant-vaginal .sub-banner-summary {
  margin: 2em 0;
  font-size: var(--fs-body);
  font-weight: 500;
  color: #5a306e;
  word-break: keep-all;
  line-height: var(--lh-normal);
  /* li 관련 스타일 상속 차단 */
  padding: 0;
}

/* ── 아이콘 정보 바 */
.sub-banner--implant-vaginal .sub-banner-info {
  margin-top: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.sub-banner--implant-vaginal .sub-banner-info-img {
  display: block;
  width: 100%;
  max-width: 540px;
  height: auto;
}

/* ── 전역 오버라이드 방지 (공통 클래스가 inner 범위를 다시 건드리는 경우) */
.sub-banner--implant-vaginal .sub-banner-inner .sub-banner-text,
.sub-banner--implant-vaginal .sub-banner-inner .sub-banner-info {
  max-width: 100%;
}


/* ── 반응형 ───────────────────────────────── */

/* 태블릿 */
@media (max-width: 1024px) {
  .sub-banner--implant-vaginal {
    height: 340px;
    min-height: 340px;
  }
  .sub-banner--implant-vaginal .sub-banner-inner {
    width: 54%;
    padding: 40px 28px 30px;
  }
  .sub-banner--implant-vaginal .sub-banner-title {
    font-size: 34px;
  }
  .sub-banner--implant-vaginal .sub-banner-info-img {
    max-width: 400px;
  }
}

/* 모바일 */
@media (max-width: 639px) {
  .sub-banner--implant-vaginal {
    height: auto;
    min-height: 460px;
  }
  .sub-banner--implant-vaginal .sub-banner-bg img {
    object-position: 68% center;
  }
  /* 모바일: 가로 전체 사용, 세로 중앙 정렬 */
  .sub-banner--implant-vaginal .sub-banner-inner {
    width: 100%;
    margin: 0 auto;
    padding: 40px 20px 36px;
    min-height: 460px;
    justify-content: center;
  }
  .sub-banner--implant-vaginal .sub-banner-title {
    font-size: 30px;
    white-space: normal;
  }
  .sub-banner--implant-vaginal .sub-banner-pretitle {
    font-size: 14px;
  }
  .sub-banner--implant-vaginal .sub-banner-summary {
    font-size: 13px;
    margin-top: 14px;
    line-height: 1.7;
  }
  .sub-banner--implant-vaginal .sub-banner-info {
    margin-top: 18px;
  }
  .sub-banner--implant-vaginal .sub-banner-info-img {
    max-width: 320px;
  }
}

@media (max-width: 1024px) {
  .sub-banner--labia {
    height: 340px;
    min-height: 340px;
  }
  .sub-banner--labia .sub-banner-inner {
    width: 54%;
    padding: 40px 28px 30px;
  }
  .sub-banner--labia .sub-banner-title {
    font-size: 32px;
  }
  .sub-banner--labia .sub-banner-pretitle {
    font-size: 18px;
  }
}

@media (max-width: 639px) {
  .sub-banner--labia {
    height: auto;
    min-height: 420px;
  }
  .sub-banner--labia .sub-banner-bg img {
    object-position: 70% center;
  }
  .sub-banner--labia .sub-banner-inner {
    width: 100%;
    padding: 40px 20px 36px;
    min-height: 420px;
    justify-content: center;
  }
  .sub-banner--labia .sub-banner-title {
    font-size: 28px;
  }
  .sub-banner--labia .sub-banner-pretitle {
    font-size: 16px;
  }
  .sub-banner--labia .sub-banner-summary {
    font-size: 13px;
  }
}

/* ============================================================
   2-1 자궁근종 고주파 용해술 상단 배너
   .sub-banner--myoma
   ============================================================ */

/* ── 섹션 전체 */
.sub-banner--myoma {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #f2e4ea;
}

/* ── 배경 이미지: 인물 우측 */
.sub-banner--myoma .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--myoma .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* ── inner: 좌측 50%, 세로 중앙 */
.sub-banner--myoma .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ── 텍스트 블록 */
.sub-banner--myoma .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* pretitle */
.sub-banner--myoma .sub-banner-pretitle {
  font-size: 15px;
  font-weight: 500;
  color: var(--main-color);
  letter-spacing: -0.01em;
  margin: 0;
}

/* 메인 타이틀: 시안 기준 2줄 전체 bold */
.sub-banner--myoma .sub-banner-title {
  font-size: clamp(34px, 3.8vw, 48px);
  line-height: var(--lh-normal);
  font-weight: 700;
  letter-spacing: -0.05em;
  color: var(--main-color);
  margin: 0;
}
.sub-banner--myoma .sub-banner-title-point {
  font-weight: 700;
  color: var(--main-color);
}

/* 영문 */
.sub-banner--myoma .sub-banner-en {
  font-size: 11px;
  letter-spacing: 0.3em;
  color: #5c2d5a;
  text-transform: uppercase;
  margin-top: 2px;
}

/* 요약 */
.sub-banner--myoma .sub-banner-summary {
  margin: 2em 0;
  font-size: 14px;
  line-height: 1.9;
  font-weight: 400;
  color: #5c2d5a;
  word-break: keep-all;
  padding: 0;
  list-style: none;
}
/* 첫 줄(조직검사) bold 처리 — 시안 반영 */
.sub-banner--myoma .sub-banner-summary br + *,
.sub-banner--myoma .sub-banner-summary {
  font-weight: 400;
}

/* ── 반응형 */
@media (max-width: 1024px) {
  .sub-banner--myoma {
    height: 360px;
    min-height: 360px;
  }
  .sub-banner--myoma .sub-banner-inner {
    width: 55%;
    padding: 40px 28px 30px;
  }
  .sub-banner--myoma .sub-banner-title {
    font-size: 34px;
  }
}

@media (max-width: 639px) {
  .sub-banner--myoma {
    height: auto;
    min-height: 460px;
  }
  .sub-banner--myoma .sub-banner-bg img {
    object-position: 70% center;
  }
  .sub-banner--myoma .sub-banner-inner {
    width: 100%;
    padding: 40px 20px 36px;
    min-height: 440px;
    justify-content: center;
  }
  .sub-banner--myoma .sub-banner-title {
    font-size: 30px;
  }
  .sub-banner--myoma .sub-banner-pretitle {
    font-size: 13px;
  }
  .sub-banner--myoma .sub-banner-summary {
    font-size: 13px;
  }
}

/* ============================================================
   3-1 유륜/유두미백 전용 스타일
   lydia-sub.css 하단에 추가
   ============================================================ */

/* ─────────────────────────────────────────────
   S01. 상단 배너 — .sub-banner--nipple
   배경: 연핑크 사진(인물 중앙~우측), 텍스트 좌측 70%
────────────────────────────────────────────── */
.sub-banner--nipple {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 540px;
  background: #f5dce4;
  display: block;
}

/* 배경 이미지 — 인물이 우측에 자연스럽게 */
.sub-banner--nipple .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--nipple .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* inner — 좌측 70% 영역, 세로 중앙 */
.sub-banner--nipple .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
}

/* 텍스트 블록 */
.sub-banner--nipple .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* pretitle */
.sub-banner--nipple .sub-banner-pretitle {
  font-size: var(--fs-body);
  font-weight: 400;
  color: #432618;
  letter-spacing: -0.01em;
  margin: 0;
}
.sub-banner--nipple .sub-banner-pretitle strong {
  font-weight: 700;
}

/* 메인 타이틀 */
.sub-banner--nipple .sub-banner-title {
  font-size: clamp(34px, 4vw, 52px);
  line-height: var(--lh-normal);
  font-weight: 700;
  letter-spacing: -0.05em;
  color: #432618;
  margin: 0;
}

/* 영문 pill 뱃지 */
.sub-banner--nipple .sub-banner-en--pill {
  display: inline-block;
  padding: 7px 22px;
  border-radius: 100px;
  background: #432618;
  color: #fff;
  font-size: var(--fs-xs);
  letter-spacing: 0.28em;
  font-weight: 400;
  margin: 1em auto  0.5em
}

/* 요약 문장 */
.sub-banner--nipple .sub-banner-summary {
  margin: 2em 0;
  font-size: var(--fs-body);
  line-height: 1.9;
  font-weight: 400;
  color: #432618;
  word-break: keep-all;
  padding: 0;
}

/* 아이콘 정보 바 — 텍스트 블록 하단, inner 안에 위치 */
.sub-banner-info--nipple {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.sub-banner-info--nipple .sub-banner-info-img {
  display: block;
  width: 100%;
  max-width: 597px;
  height: auto;
}


/* ─────────────────────────────────────────────
   S02. 유륜/유두 미백이란? — .sub-nipple-intro
   배경: 어두운 회색 + 하단 꽃 장식 이미지
   → 오버레이 없음 (이미지 자체가 어두운 배경)
────────────────────────────────────────────── */
.sub-nipple-intro {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0 calc(var(--sp-5xl) + 60px); /* 하단: 꽃 이미지 공간 */
}

.sub-nipple-intro .sub-title,
.sub-nipple-intro .sub-banner-en,
.sub-nipple-intro .nipple-intro-lead{
  color: #fff1ea;
}

.sub-nipple-intro .sub-title-bar {
  background: #fff1ea;
}
 
.nipple-intro-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.nipple-intro-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom center; /* 하단 꽃 장식 보이도록 */
  display: block;
}
/* 상단은 약간 어둡게, 하단(꽃)은 자연스럽게 — 가벼운 그라디언트만 */
.nipple-intro-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(20, 8, 15, 0.20) 0%,
    rgba(20, 8, 15, 0.10) 60%,
    rgba(20, 8, 15, 0.0)  100%
  );
}
 
.nipple-intro-inner {
  position: relative;
  z-index: 1;
}
 
/* 흰 타이틀 바 */
.sub-title-bar--light {
  background: rgba(255, 255, 255, 0.7);
}
 
/* 소개 본문 */
.nipple-intro-text {
  text-align: center;
  max-width: 680px;
  margin: 0 auto;
}
.nipple-intro-lead {
  font-size: var(--fs-body);
  color: rgba(255, 255, 255, 0.92);
  line-height: 2;
  word-break: keep-all;
}
 
 
/* ─────────────────────────────────────────────
   S03. 유륜/유두미백의 특징 — .sub-nipple-feature
   배경: 연살구색, 원형 아이콘 5개 + 전후 이미지
────────────────────────────────────────────── */
.sub-nipple-feature {
  background: #fdf0ea;
  padding: var(--sp-5xl) 0;
}
 
.sub-nipple-feature .sub-title,
.sub-nipple-feature .sub-label-en {
  color: #5a3220;
}
 
/* ── 특징 카드 5개 1행 */
.nipple-feature-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--sp-xl) var(--sp-lg);
    max-width: 1200px;
    margin: 0 auto var(--sp-4xl);
}
 
.nipple-feature-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 180px;
}
 
/* 원형 텍스트 카드 */
.nipple-feature-circle {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 14px rgba(180, 80, 60, 0.13);
  border: 1px solid #f0c8b8;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 18px;
  overflow: hidden;
}
 
.nipple-feature-desc {
  font-size: var(--fs-body);
  color: #3d1c1c;
  line-height: 1.75;
  word-break: keep-all;
  margin: 0;
  width: 100%;
  text-align: center;
}
 
/* ── 핑크 포인트 텍스트 */
.nipple-point-text {
  text-align: center;
  margin: 0 auto var(--sp-3xl);
}
 
.nipple-point-pretitle {
  font-size: var(--fs-lg);
  color: #3d1c1c;
  font-weight: 400;
  margin-bottom: 4px;
}
.nipple-point-pretitle strong {
  font-weight: 700;
}
 
.nipple-point-highlight {
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 500;
  color: #3d1c1c;
  letter-spacing: -0.04em;
  line-height: 1.2;
  margin: 0.5em 0;
}
.nipple-point-highlight strong {
  font-weight: 500;
  color: #fff;
  /* 시안의 핑크빛 강조 텍스트 — 빨간 배경 pill */
  background: #ff8abe;
  color: #fff;
}
 
.nipple-point-sub {
  font-size: var(--fs-body);
  color: #3d1c1c;
  line-height: 1.8;
  word-break: keep-all;
}
.nipple-point-sub strong {
  text-decoration: underline;
  font-weight: 500;
}
 
/* ── 전후 비교 이미지 */
.nipple-before-after {
  max-width: 700px;
  margin: 0 auto;
}
.nipple-before-after img {
  width: 100%;
  height: auto;
  display: block;
}
 
 
/* ─────────────────────────────────────────────
   S04. 필요한 경우 — .sub-needs--nipple
   배경: 별하늘 보라 계열 이미지
   → 기존 .sub-needs 오버레이 조정 + pill 색 오버라이드
────────────────────────────────────────────── */
 
.sub-needs--nipple {
  background-image: url('/wp-content/uploads/2026/06/3_1.유륜·유두미백_필요bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-5xl) 0;
  position: relative;
}
/* 오버레이: 보라 계열로 덮어씌움 */
.sub-needs--nipple .sub-needs-bg::after {
  background: rgba(30, 10, 40, 0.65);
}
 
/* 타이틀/라벨 색 — golden → 핑크 계열 */
.sub-needs--nipple .sub-needs-inner .sub-title,
.sub-needs--nipple .sub-needs-inner .sub-label-en {
  color: #fbe0ff;
}
 
/* pill 리스트 너비 */
/* .sub-needs--nipple .needs-list {
  counter-reset: needs-counter;
  max-width: 580px;
} */

/* pill 테두리 — golden → 핑크 계열 */
.sub-needs--nipple .needs-item {
  border-color: rgba(220, 150, 175, 0.65);
}
.sub-needs--nipple .needs-item:hover {
  background: rgba(139, 58, 90, 0.42);
  border-color: rgba(220, 150, 175, 1);
}

.sub-needs--nipple .needs-list li {
  justify-content: center;
  border-radius: var(--radius-pill);
  background-color: transparent;
}
 
/* 번호 원형 — 흰 배경 + 진한 핑크 글자 */
.sub-needs--nipple .needs-list li::before {
  background: rgba(255, 255, 255, 0.92);
  color: #6e3248;
}
 
 
/* ─────────────────────────────────────────────
   반응형 — 태블릿 (≤ 1024px)
────────────────────────────────────────────── */
@media (max-width: 1024px) {
 
  .sub-banner--nipple {
    height: 360px;
    min-height: 360px;
  }
  .sub-banner--nipple .sub-banner-inner {
    width: 56%;
    padding: 40px 28px 30px;
  }
  .sub-banner--nipple .sub-banner-title {
    font-size: 34px;
  }
  .sub-banner-info--nipple .sub-banner-info-img {
    max-width: 380px;
  }
 
  /* 특징 카드 */
  .nipple-feature-card {
    width: 140px;
  }
  .nipple-feature-circle {
    width: 144px;
    height: 144px;
  }
}
 
 
/* ─────────────────────────────────────────────
   반응형 — 모바일 (≤ 639px)
────────────────────────────────────────────── */
@media (max-width: 639px) {
 
  /* 배너 */
  .sub-banner--nipple {
    height: auto;
    min-height: 500px;
  }
  .sub-banner--nipple .sub-banner-bg img {
    object-position: 68% center;
  }
  .sub-banner--nipple .sub-banner-inner {
    width: 100%;
    margin: 0 auto;
    padding: 40px 20px 36px;
    min-height: 500px;
    justify-content: center;
  }
  .sub-banner--nipple .sub-banner-title {
    font-size: 30px;
    white-space: normal;
  }
  .sub-banner--nipple .sub-banner-pretitle {
    font-size: 13px;
  }
  .sub-banner--nipple .sub-banner-summary {
    font-size: 13px;
    margin-top: 12px;
  }
  .sub-banner-info--nipple {
    margin-top: 20px;
  }
  .sub-banner-info--nipple .sub-banner-info-img {
    max-width: 320px;
  }
 
  /* 소개 섹션 하단 여백 축소 */
  .sub-nipple-intro {
    padding-bottom: var(--sp-5xl);
  }
 
  /* 특징 카드: 2열 */
  .nipple-feature-grid {
    gap: var(--sp-lg) var(--sp-r);
  }
  .nipple-feature-card {
    width: calc(50% - var(--sp-r));
  }
  .nipple-feature-circle {
    width: 150px;
    height: 150px;
    padding: 14px;
  }
 
  /* 핑크 강조 */
  .nipple-point-highlight {
    font-size: 22px;
  }
}

/* =====================================================
   template-0302 - Y존 미백
   lydia-sub.css 에 추가
   ===================================================== */

/* --------------------------------------------------
   S01. 서브 배너 - Y존 미백
   -------------------------------------------------- */
.sub-banner--yzone {
}

.sub-banner--yzone .sub-banner-bg {
  object-position: right center;
}

.sub-banner--yzone .sub-banner-inner {
  width: 70%;
  margin-left: 0;
}

.sub-banner--yzone .sub-banner-label-en {
  display: block;
  font-size: var(--fz-xs, 12px);
  letter-spacing: 0.12em;
  color: var(--color-primary, #732269);
  margin-bottom: 8px;
  font-weight: 500;
}

.sub-banner--yzone .sub-banner-title {
  font-size: var(--fz-banner, 52px);
  font-weight: 700;
  color: var(--color-primary, #732269);
  line-height: var(--lh-normal);
  margin-bottom: 20px;
}

.sub-banner--yzone .sub-banner-title em {
  font-style: normal;
  color: var(--color-primary, #732269);
}

.sub-banner--yzone .sub-banner-desc {
  font-size: var(--fz-sm, 15px);
  line-height: 1.8;
  color: var(--main-color);
  margin-bottom: 40px;
}

/* 배너 시술 정보 이미지 */
.sub-banner-con {
  margin-top: 32px;
}

.sub-banner-con img {
  max-width: 100%;
  height: auto;
  max-width: 597px;
}

/* --------------------------------------------------
   S02. Y존 미백이란?
   -------------------------------------------------- */
.sub-intro--yzone {
  background-color: #fff;
  padding: var(--section-py, 80px) 0;
}

.sub-intro--yzone .sub-intro-body {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.sub-intro--yzone .sub-intro-text {
  font-size: var(--fs-body);
  color: var(--color-text, #444);
}

.sub-intro--yzone .sub-intro-text--bold {
  font-weight: 700;
  color: var(--color-text-dark, #222);
}

.sub-intro--yzone .sub-intro-desc strong {
  font-weight: 500;
  text-decoration: underline;
}

/* --------------------------------------------------
   S03. Y존 미백 특징
   -------------------------------------------------- */
.sub-feature--yzone {
  background-color: var(--color-pink-bg, #fdf0f5);
  padding: var(--section-py, 80px) 0;
}

.sub-feature--yzone .sub-title,
.sub-feature--yzone .sub-label-en {
  color: #3a2d6e;
}

/* 원형 아이콘 5개 리스트 */
.yzone-feature-list {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
}

.yzone-feature-list__item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  text-align: center;
  padding: 20px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.yzone-feature-list__item:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.yzone-feature-list__text {
  font-size: var(--fs-body);
  line-height: 1.7;
  color: var(--accent-purple);
  font-weight: 500;
  word-break: keep-all;
}

/* --------------------------------------------------
   S04. Y존 미백이 필요한 경우
   -------------------------------------------------- */
.sub-needs--yzone {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-needs--yzone .sub-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-needs--yzone .sub-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sub-needs--yzone .sub-inner {
  position: relative;
  z-index: 1;
}

.sub-needs--yzone .sub-title,
.sub-needs--yzone .sub-label-en,
.sub-needs--yzone .needs-list__item {
  color: #ad8f5d;
}


/* pill 리스트 - 어두운 배경용 */
.needs-list--pill {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 540px;
}

.needs-list--pill .needs-list__item {
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 50px;
  padding: 14px 32px;
  text-align: center;
  color: #fff;
  font-size: var(--fs-body);
  letter-spacing: 0.02em;
  backdrop-filter: blur(4px);
  transition: background-color 0.25s ease;
  justify-content: center;
}

.needs-list--pill .needs-list__item:hover {
  background-color: rgba(255, 255, 255, 0.22);
}

/* =====================================================
   반응형 - 태블릿 (1024px 이하)
   ===================================================== */
@media (max-width: 1024px) {
  .sub-banner--yzone {
    min-height: 460px;
  }
  .sub-banner--yzone .sub-banner-inner {
    width: 60%;
  }

  .yzone-feature-list__item {
    width: 140px;
    height: 140px;
  }

  .sub-banner-con img {
    max-width: 80%;
  }
}

/* =====================================================
   반응형 - 모바일 (768px 이하)
   ===================================================== */
@media (max-width: 768px) {
  .sub-banner--yzone .sub-banner-inner {
    width: 100%;
    padding: 40px 24px;
    text-align: center;
  }

  .sub-banner--yzone .sub-banner-title {
    font-size: var(--fz-banner-mo, 36px);
  }

  .sub-banner-con {
    text-align: center;
  }

  .sub-banner-con img {
    max-width: 100%;
  }

  .sub-intro--yzone .sub-intro-text {
    font-size: var(--fz-sm, 14px);
  }

  .yzone-feature-list {
    gap: 12px;
  }

  .yzone-feature-list__item {
    width: calc(50% - 6px);
    height: 130px;
    border-radius: 20px;
  }

  .needs-list--pill {
    max-width: 100%;
    padding: 0 16px;
  }

  .needs-list--pill .needs-list__item {
    font-size: var(--fz-xs, 13px);
    padding: 12px 24px;
  }
}

/* =====================================================
   template-0303 — 겨드랑이 미백
   lydia-sub.css 에 추가 (기존 yzone/elbow 패턴 준용)
   ===================================================== */

/* --------------------------------------------------
   S01. 서브 배너 — 겨드랑이 미백
   -------------------------------------------------- */
.sub-banner--armpit .sub-banner-inner {
  width: 70%;
  margin-left: 0;
}

.sub-banner--armpit .sub-banner-pretitle {
    font-size: var(--fs-body);
    font-weight: 400;
    color: var(--accent-green);
    letter-spacing: -0.01em;
    margin: 0;
}

.sub-banner--armpit .sub-banner-label-en {
    display: inline-block;
    padding: 7px 22px;
    border-radius: 100px;
    background: var(--accent-green);
    color: #fff;
    font-size: var(--fs-xs);
    letter-spacing: 0.28em;
    font-weight: 400;
    margin: 1em auto  0.5em;  
}

.sub-banner--armpit .sub-banner-title {
  font-size: var(--fz-banner, 52px);
  font-weight: 700;
  color: var(--accent-green);
  line-height: var(--lh-normal);
  margin-bottom: var(--sp-r);
}

.sub-banner--armpit .sub-banner-title em {
  font-style: normal;
  color: var(--accent-green);
}

.sub-banner--armpit .sub-banner-desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--accent-green);
  margin-bottom: var(--sp-xl);
}

/* --------------------------------------------------
   S02. 겨드랑이 미백이란? — 어두운 bg + 흰 텍스트
   -------------------------------------------------- */
.sub-intro--armpit {
  position: relative;
  padding: var(--sp-5xl) 0;
  overflow: hidden;
  text-align: center;
}

.sub-intro--armpit .sub-intro-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-intro--armpit .sub-intro-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sub-intro--armpit .sub-intro-body {
  max-width: 560px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-xl);
}

.sub-intro--armpit .sub-title,
.sub-intro--armpit .sub-label-en,
.sub-intro--armpit .sub-intro-text {
  color: #ffe7cf;
}

.sub-intro--armpit .sub-intro-text {
  line-height: var(--lh-loose);
}

.sub-intro.sub-intro--armpit .sub-section-hd::after {
  background-color: #ffe7cf;
}

/* --------------------------------------------------
   S03. 겨드랑이 미백 특징
   yzone-feature-list 재사용, 배경색만 지정
   -------------------------------------------------- */
.sub-feature--armpit {
  background-color: #e9f8f8;
  padding: var(--sp-5xl) 0;
}

.sub-feature--armpit .sub-title,
.sub-feature--armpit .sub-label-en {
  color: #185557;
}

/* 수정자 클래스: armpit 전용 원형 색상만 오버라이드 */
.armpit-feature-list .yzone-feature-list__text {
  color: var(--accent-green);
}

/* --------------------------------------------------
   S04. 겨드랑이 미백이 필요한 경우
   sub-needs--yzone 패턴 동일 적용
   -------------------------------------------------- */
.sub-needs--armpit {
  position: relative;
  padding: var(--sp-5xl) 0;
  overflow: hidden;
}

.sub-needs--armpit .sub-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-needs--armpit .sub-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sub-needs--armpit .sub-title,
.sub-needs--armpit .sub-label-en {
  color: #bbd8ff;
}

/* =====================================================
   반응형 — 태블릿 (1024px 이하)
   ===================================================== */
@media (max-width: 1024px) {
  .sub-banner--armpit .sub-banner-inner {
    width: 60%;
  }
}

/* =====================================================
   반응형 — 모바일 (768px 이하)
   ===================================================== */
@media (max-width: 768px) {
  .sub-banner--armpit {
    min-height: 460px;
  }
  .sub-banner--armpit .sub-banner-inner {
    width: 100%;
    text-align: center;
  }

  .sub-banner--armpit .sub-banner-title {
    font-size: var(--fz-banner-mo, 36px);
  }

  .sub-intro--armpit .sub-intro-body {
    padding: 0 var(--safe-padding);
  }
}

/* =====================================================
   template-0304 - 팔꿈치 미백
   lydia-sub.css 에 추가
   ===================================================== */

/* --------------------------------------------------
   공통 유틸: sub-inner--relative
   (bg 이미지 섹션 내부에서 z-index 보장)
   -------------------------------------------------- */
.sub-inner--relative {
  position: relative;
  z-index: 1;
}

/* --------------------------------------------------
   S01. 서브 배너 - 팔꿈치 미백
   -------------------------------------------------- */
.sub-banner--elbow .sub-banner-bg {
  object-position: right center;
}

/* Y존미백과 동일하게 왼쪽 50% 텍스트 영역 */
.sub-banner--elbow .sub-banner-inner {
  width: 70%;
  margin-left: 0;
}

.sub-banner--elbow .sub-banner-pretitle {
    font-size: var(--fs-body);
    font-weight: 400;
  color: var(--main-color);
    letter-spacing: -0.01em;
    margin: 0;
}

.sub-banner--elbow .sub-banner-title {
    font-size: clamp(34px, 4vw, 52px);
    line-height: var(--lh-normal);
    font-weight: 700;
    letter-spacing: -0.05em;
  color: var(--main-color);
    margin: 0;  
}

.sub-banner--elbow .sub-banner-title em {
  font-style: normal;
  color: var(--main-color);
}

/* 영문 pill 뱃지 */
.sub-banner-pill-en {
  display: inline-block;
  margin-bottom: 16px;
}

.sub-banner-pill-en span {
    display: inline-block;
    padding: 7px 22px;
    border-radius: 100px;
    background-color: var(--color-primary, #732269);
    color: #fff;
    font-size: var(--fs-xs);
    letter-spacing: 0.28em;
    font-weight: 400;
    margin: 1em auto  0.5em;  
}

.sub-banner--elbow .sub-banner-desc {
  font-size: var(--fs-body);
  line-height: 1.8;
  color: var(--main-color);
  margin-bottom: 32px;
}

/* --------------------------------------------------
   S02. 팔꿈치 미백이란? - 어두운 갈색 bg
   -------------------------------------------------- */
.sub-intro--elbow {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
  text-align: center;
}

.sub-intro--elbow .sub-title,
.sub-intro--elbow .sub-label-en,
.sub-intro--elbow .sub-intro-text {
  color: #ffe7cf;
}

.sub-intro--elbow .sub-intro-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-intro--elbow .sub-intro-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* sub-inner--relative 로 z-index 처리하므로
   .sub-inner 추가 선언 불필요 */

.sub-intro--elbow .sub-intro-body {
  max-width: 560px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-xl);
}

.sub-intro--elbow .sub-title,
.sub-intro--elbow .sub-label-en,
.sub-intro--elbow .sub-intro-text {
  color: #ffe7cf;
}

.sub-intro--elbow .sub-intro-text {
  line-height: var(--lh-loose);
}

.sub-intro.sub-intro--elbow .sub-section-hd::after {
  background-color: #ffe7cf;
}

/* --------------------------------------------------
   S03. 팔꿈치 미백 특징 - yzone-feature-list 재사용
   -------------------------------------------------- */
.sub-feature--elbow {
  background-color: #fff0fe;
  padding: var(--section-py, 80px) 0;
}

.sub-feature--elbow .yzone-feature-list__text  {
  color: var(--main-color);
}

/* --------------------------------------------------
   S04. 팔꿈치 미백이 필요한 경우 - 보라 bg
   -------------------------------------------------- */
.sub-needs--elbow {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-needs--elbow .sub-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-needs--elbow .sub-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sub-needs--elbow .sub-title,
.sub-needs--elbow .sub-label-en {
  color: #efd6ff;
}

/* 시안 스타일: 번호원형 + 텍스트 pill 리스트 */
.elbow-needs-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 660px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  counter-reset: elbow-needs;
}

.elbow-needs-list__item {
  counter-increment: elbow-needs;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50px;
  padding: 16px 32px 16px 20px;
  backdrop-filter: blur(4px);
  transition: background-color 0.25s ease;
}

.elbow-needs-list__item:hover {
  background-color: rgba(255, 255, 255, 0.18);
}

.elbow-needs-list__text {
  font-size: var(--fs-body);
  color: #fff;
  font-weight: 400;
  letter-spacing: 0.02em;
}

/* =====================================================
   반응형 - 태블릿 (1024px 이하)
   ===================================================== */
@media (max-width: 1024px) {
  .sub-banner--elbow .sub-banner-inner {
    width: 60%;
  }

  .sub-banner--elbow .sub-banner-title {
    font-size: 40px;
  }
}

/* =====================================================
   반응형 - 모바일 (768px 이하)
   ===================================================== */
@media (max-width: 768px) {
  .sub-banner--elbow {
    min-height: 460px;
  }
  .sub-banner--elbow .sub-banner-inner {
    width: 100%;
    padding: 40px 24px;
    text-align: center;
  }

  .sub-banner--elbow .sub-banner-title {
    font-size: var(--fz-banner-mo, 36px);
  }

  .sub-intro-text--light {
    font-size: var(--fz-sm, 14px);
  }

  .elbow-needs-list {
    max-width: 100%;
    padding: 0 16px;
  }

  .elbow-needs-list__item {
    border-radius: 16px;
    padding: 14px 20px;
  }

  .elbow-needs-list__text {
    font-size: var(--fz-xs, 13px);
  }
}

/* =====================================================
   template-0305 — 점/사마귀
   lydia-sub.css 의 기존 0305 블록 전체 교체
   ===================================================== */


/* --------------------------------------------------
   S01. 서브 배너
   · 이미지 우측, 텍스트 좌측 50%
   · "점/사마귀"(em) → 핑크/마젠타, "수술" → 어두운색
   · SPOT/WART → 배경 없는 일반 영문 텍스트
   -------------------------------------------------- */

/* ── 섹션 전체 */
.sub-banner--spot {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #f2e4ea;
}

/* ── 배경 이미지: 인물 우측 */
.sub-banner--spot .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sub-banner--spot .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* ── inner: 좌측 50%, 세로 중앙 */
.sub-banner--spot .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* ── 텍스트 블록 */
.sub-banner--spot .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* pretitle */
.sub-banner--spot .sub-banner-pretitle {
  font-size: 15px;
  font-weight: 500;
  color: #ad21a2;
  letter-spacing: -0.01em;
  margin: 0;
}

/* 메인 타이틀: 시안 기준 2줄 전체 bold */
.sub-banner--spot .sub-banner-title {
  font-size: clamp(34px, 3.8vw, 48px);
  font-weight: 500;
  letter-spacing: -0.05em;
  color: #ad21a2;
  margin: 0;
  line-height: var(--lh-normal);
}

.sub-banner--spot .sub-banner-title strong {
  font-weight: 700;
}

/* 영문 */
.sub-banner--spot .sub-banner-en {
  font-size: 11px;
  letter-spacing: 0.3em;
  color: #ad21a2;
  text-transform: uppercase;
  margin-top: 2px;
}

/* 요약 */
.sub-banner--spot .sub-banner-summary {
  margin: 2em 0;
  font-size: 14px;
  line-height: 1.9;
  font-weight: 400;
  color: #ad21a2;
  word-break: keep-all;
  padding: 0;
  list-style: none;
}
/* 첫 줄(조직검사) bold 처리 — 시안 반영 */
.sub-banner--spot .sub-banner-summary br + *,
.sub-banner--spot .sub-banner-summary {
  font-weight: 400;
}

/* ── 반응형 */
@media (max-width: 1024px) {
  .sub-banner--spot {
    height: 360px;
    min-height: 360px;
  }
  .sub-banner--spot .sub-banner-inner {
    width: 55%;
    padding: 40px 28px 30px;
  }
  .sub-banner--spot .sub-banner-title {
    font-size: 34px;
  }
}

@media (max-width: 639px) {
  .sub-banner--spot {
    height: auto;
    min-height: 460px;
  }
  .sub-banner--spot .sub-banner-bg img {
    object-position: 70% center;
  }
  .sub-banner--spot .sub-banner-inner {
    width: 100%;
    padding: 40px 20px 36px;
    min-height: 440px;
    justify-content: center;
  }
  .sub-banner--spot .sub-banner-title {
    font-size: 30px;
  }
  .sub-banner--spot .sub-banner-pretitle {
    font-size: 13px;
  }
  .sub-banner--spot .sub-banner-summary {
    font-size: 13px;
  }
}

/* --------------------------------------------------
   S02. 점/사마귀 제거란?
   · 공통 .sub-intro .sub-section-hd::after 구분선 재사용
   · ::after 색상만 main-color로 오버라이드
   · .sub-title-line div PHP에서 제거 완료
   -------------------------------------------------- */
.sub-intro--spot {
  background: var(--bg-base);
  padding: var(--sp-5xl) 0;
}

.sub-intro--spot .sub-intro-text {
  text-align: center;
  max-width: 860px;
  margin: 0 auto var(--sp-3xl);
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  font-weight: 500;
  word-break: keep-all;
  margin-top: 2%;
  display: block;
}

.sub-intro--spot .sub-intro-text strong {
  text-decoration: underline;
  font-weight: 700;
}

.sub-intro--spot .sub-symptom-img {
  width: 100%;
  height: auto;
  display: block;
}


/* --------------------------------------------------
   S03. 점/사마귀 제거의 장점
   · 어두운 보라 bg + 흰 pill 리스트
   -------------------------------------------------- */
.sub-advantage--spot {
  position: relative;
  padding: var(--sp-5xl) 0;
  overflow: hidden;
  text-align: center;
}

.sub-advantage--spot .sub-advantage-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-advantage--spot .sub-advantage-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sub-advantage.sub-advantage--spot .sub-title,
.sub-advantage.sub-advantage--spot .sub-label-en {
  color: #ab54a2;
}

.spot-advantage-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 500px;
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
}

.spot-advantage-list__item {
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: var(--radius-pill);
  padding: var(--sp-r) var(--sp-2xl);
  text-align: center;
  color: var(--white);
  font-size: var(--fs-body);
  font-weight: 400;
  letter-spacing: 0.02em;
  backdrop-filter: blur(4px);
  transition: background-color var(--duration);
  word-break: keep-all;
}

.spot-advantage-list__item:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.spot-advantage-list__item strong {
  font-weight: 500;
}


/* --------------------------------------------------
   S04. 시술과정 — 지그재그 스텝
   -------------------------------------------------- */
.sub-process--spot {
  background-color: var(--color-pink-bg, #fdf0f5);
  padding: var(--sp-5xl) 0;
}

.sub-process.sub-process--spot .sub-title,
.sub-process.sub-process--spot .sub-label-en {
  color: #ab54a2;
}

.sub-process--spot .sub-title {
  font-weight: 700;
}

.spot-process-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  position: relative;
}

.spot-process-list__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  max-width: 170px;
  position: relative;
  z-index: 1;
}

.spot-process-list__item--top {
  padding-bottom: var(--sp-4xl);
  justify-content: flex-start;
}

.spot-process-list__item--bottom {
  padding-top: var(--sp-4xl);
  justify-content: flex-end;
  align-self: flex-end;
}

.spot-process-list__circle {
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background-color: var(--white);
  border: 2px solid #e46dff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-xs);
  padding: var(--sp-r);
  text-align: center;
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--duration), transform var(--duration);
}

.spot-process-list__circle:hover {
  box-shadow: 0 8px 24px rgba(115, 34, 105, 0.15);
  transform: translateY(-4px);
}

.spot-process-list__num {
  font-size: var(--fs-md);
  font-weight: 700;
  color: #e46dff;
  display: block;
  text-decoration: underline;
}

.spot-process-list__text {
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  color: var(--txt-muted, #444);
  word-break: keep-all;
}


/* --------------------------------------------------
   S05. 제거 가능 증상
   · 연한 보라 bg + 어두운 제목 + 아웃라인 pill
   -------------------------------------------------- */
.sub-symptom--spot {
  position: relative;
  padding: var(--sp-5xl) 0;
  overflow: hidden;
  text-align: center;
}

.sub-symptom--spot .sub-symptom-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-symptom--spot .sub-symptom-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sub-symptom--spot .sub-section-hd {
  margin-bottom: 0;
}

.sub-title--symptom {
  color: #a036ff;
  font-size: var(--fz-title, 38px);
  font-weight: 700;
}

.sub-banner-pill-en--symptom {
  margin: var(--sp-sm) 0 var(--sp-3xl);
}

.sub-banner-pill-en--symptom span {
  background-color: var(--white);
  border: 1px solid #a036ff;;
  color: #a036ff;
  font-size: var(--fs-xs);
  letter-spacing: 0.14em;
  padding: 5px 18px;
  border-radius: var(--radius-pill);
}

.spot-symptom-img {
  max-width: 1160px;
  margin: 0 auto;
}

.spot-symptom-img img {
  width: 100%;
  height: auto;
  display: block;
}


/* =====================================================
   반응형 — 태블릿 (1024px 이하)
   ===================================================== */
@media (max-width: 1024px) {
  .sub-banner--spot .sub-banner-inner {
    width: 60%;
  }

  .sub-banner--spot .sub-banner-title {
    font-size: 40px;
  }

  .spot-process-list__circle {
    width: 110px;
    height: 110px;
  }
}


/* =====================================================
   반응형 — 모바일 (768px 이하)
   ===================================================== */
@media (max-width: 768px) {
  .sub-banner--spot .sub-banner-inner {
    width: 100%;
    padding: var(--sp-3xl) var(--safe-padding);
    text-align: center;
  }

  .sub-banner--spot .sub-banner-title {
    font-size: var(--fz-banner-mo, 36px);
  }

  .spot-process-list {
    align-items: center;
    gap: var(--sp-r);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .spot-process-list::before {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 100%;
  }

  .spot-process-list__item--top,
  .spot-process-list__item--bottom {
    padding: 0;
    justify-content: center;
    align-self: center;
  }

  .spot-process-list__circle {
    width: 150px;
    height: 150px;
    justify-content: flex-start;
  }

  .spot-advantage-list {
    padding: 0 var(--safe-padding);
    max-width: 100%;
  }

  .spot-advantage-list__item {
    font-size: var(--fs-sm);
    padding: var(--sp-sm) var(--sp-r);
  }
}

/* =====================================================
   4-1 레이저 리프팅 — template-0401
   추가 위치: lydia-sub.css 하단
====================================================== */


/* --------------------------------------------------
   S01. 배너 — .sub-banner--lifting
-------------------------------------------------- */
.sub-banner--lifting {
  height: 470px;
  max-height: 500px;
  background: #e8d3f2;
}

.sub-banner--lifting .sub-banner-bg img {
  object-position: right center;
}

/* inner: 좌 50%, 세로 중앙 */
.sub-banner--lifting .sub-banner-inner {
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: var(--sp-4xl) var(--sp-3xl) var(--sp-3xl);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sub-banner--lifting .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-xs);
}

.sub-banner--lifting .sub-banner-pretitle {
  font-size: var(--fs-body);
  font-weight: 500;
  color: #491c77;
  margin: 0;
}

.sub-banner--lifting .sub-banner-title {
  font-size: var(--fz-banner, 52px);
  font-weight: 400;
  color: #491c77;
  line-height: var(--lh-normal);
  letter-spacing: -0.04em;
  margin: 0;
}

.sub-banner--lifting .sub-banner-title strong {
  font-weight: 700;
}

.sub-banner--lifting .sub-banner-en {
  font-size: var(--fs-body);
  letter-spacing: 0.4em;
  color: #491c77;
  font-weight: 500;
  margin: var(--sp-2xs) 0 0;
}

.sub-banner--lifting .sub-banner-summary {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #4a3060;
  margin: var(--sp-r) 0 0;
}

.sub-banner--lifting .sub-banner-con {
  margin-top: var(--sp-xl);
}

.sub-banner--lifting .sub-banner-con img {
  max-width: 380px;
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}


/* --------------------------------------------------
   S02. 슈링크리프팅 이란? — .sub-intro--shrink
   텍스트 좌 / 이미지 우 (시안 기준)
-------------------------------------------------- */
.sub-intro.sub-intro--shrink {
  padding: var(--sec-py, 80px) 0 20px;
}
.sub-intro.sub-intro--shrink,
.sub-intro.sub-intro--indigo {
  background: #fcf1ff;
}
.sub-intro.sub-intro--shrink .sub-section-hd::after,
.sub-intro.sub-intro--indigo .sub-section-hd::after  {
  display: none;
}
.sub-intro--shrink .sub-section-hd,
.sub-intro--indigo .sub-section-hd  {
  margin-bottom: var(--sp-3xl);
}

.sub-intro--shrink .sub-title,
.sub-intro--indigo .sub-title{
  color: #6e3851;;
}

/* row: 텍스트 왼쪽, 이미지 오른쪽 */
.shrink-layout {
  display: flex;
  align-items: center;
  gap: var(--sp-4xl);
}

.shrink-layout__text {
  flex: 1;
}

.shrink-layout__text p {
  font-size: var(--fs-md);
  font-weight: 500;
  line-height: var(--lh-normal);
  color: #6e3851;
  margin-bottom: var(--sp-r);
  word-break: keep-all;
  text-align: center;
}

.shrink-layout__text p:last-child {
  margin-bottom: 0;
}

.shrink-layout__img {
  flex: 0 0 260px;
}

.shrink-layout__img img {
  width: 100%;
  display: block;
}


/* --------------------------------------------------
   S03. 인디고리프팅 이란? — .sub-intro--indigo
   이미지 좌 / 텍스트 우 (시안 기준)
-------------------------------------------------- */

.indigo-layout {
  display: flex;
  align-items: center;
  gap: var(--sp-4xl);
}

.indigo-layout__img {
  flex: 0 0 260px;
}

.indigo-layout__img img {
  width: 100%;
  display: block;
}

.indigo-layout__text {
  flex: 1;
}

.indigo-layout__text p {
    font-weight: 500;
    line-height: var(--lh-normal);
    color: #6e3851;
    margin-bottom: var(--sp-r);
    word-break: keep-all;
    text-align: center;
}

.indigo-layout__text p:last-child {
  margin-bottom: 0;;
}

.indigo-layout__text .sub-label-en {
  font-size: var(--fs-xs);
}

/* 좌측 정렬 섹션 헤더 (공통 유틸 — 기존 정의 재사용) */
.sub-section-hd--left {
  text-align: left;
  align-items: flex-start;
  margin-bottom: var(--sp-xl);
}

.sub-section-hd--left .sub-label-en {
  text-align: left;
}


/* --------------------------------------------------
   S04. 시술효과 — .sub-effect--lifting
-------------------------------------------------- */
.sub-effect--lifting {
  background: #fff;
  padding: var(--sp-5xl) 0;
}

.effect-list {
  display: flex;
  justify-content: center;
  gap: var(--sp-xl);
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
}

.effect-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-sm);
}

.effect-item__img {
  width: 170px;
  height: 170px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  transition: border-color var(--duration);
}

.effect-item:hover .effect-item__img {
  border-color: var(--main-color);
}

.effect-item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.effect-item__label {
  font-size: var(--fs-body);
  color: var(--txt-base);
  text-align: center;
  line-height: var(--lh-normal);
}


/* --------------------------------------------------
   S05. 시술특징 — .sub-feature--lifting
   어두운 bg + 반투명 카드
-------------------------------------------------- */
.sub-feature--lifting {
  position: relative;
  padding: var(--sp-5xl) 0;
  overflow: hidden;
}

.sub-feature--lifting .sub-feature-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-feature--lifting .sub-feature-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-feature--lifting::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.sub-feature--lifting .sub-inner--relative {
  position: relative;
  z-index: 2;
}

.sub-feature--lifting .sub-title {
  color: #ae9181;
}

.feature-list--lifting {
  display: flex;
  gap: var(--sp-xl);
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: nowrap;
}

.feature-card--lifting {
  flex: 0 0 calc(33.333% - 20px);
  min-width: 240px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  padding: var(--sp-3xl) var(--sp-xl);
  transition: background var(--duration);
}

.feature-card--lifting:hover {
  background: rgba(255, 255, 255, 0.14);
}

.feature-card--lifting .feature-card__img {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid rgba(255, 255, 255, 0.3);
  flex-shrink: 0;
}

.feature-card--lifting .feature-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.feature-card--lifting .feature-card__name {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: #fff0e9;
  text-align: center;
}

.feature-card--lifting .feature-card__desc {
  font-size: var(--fs-body);
  color: #fff0e9;
  text-align: center;
  line-height: var(--lh-loose);
  word-break: keep-all;
}


/* --------------------------------------------------
   S06. 필요한 경우 — .sub-needs--lifting
   어두운 bg + 번호 pill 리스트
-------------------------------------------------- */
.sub-needs--lifting {
  position: relative;
  padding: var(--sp-5xl) 0;
  overflow: hidden;
}

.sub-needs--lifting .sub-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-needs--lifting .sub-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-needs--lifting .sub-needs-bg::after {
  content: '';
  position: absolute;
  inset: 0;
}

.sub-needs--lifting .sub-title,
.sub-needs--lifting .sub-label-en {
  color: #f2bdcd;
}

.needs-list--lifting {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  max-width: 780px;
  counter-reset: needs-counter;
}

.needs-list--lifting .needs-item {
  counter-increment: needs-counter;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--sp-xl);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius-pill);
  padding: var(--sp-r) var(--sp-xl);
  font-size: var(--fs-body);
  color: var(--white);
  line-height: var(--lh-normal);
  transition: background var(--duration);
  word-break: keep-all;
  background: transparent;
}

.needs-list--lifting .needs-item::before {
      content: "0" counter(needs-counter);
    font-size: var(--fs-xs);
    font-weight: 700;
    background-color: #f2bdcd;
    color: var(--txt-base);
    letter-spacing: 0.04em;
    flex-shrink: 0;
    border-radius: var(--radius-pill);
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.1em;
}

.needs-list--lifting .needs-item:hover {
  background: rgba(255, 255, 255, 0.14);
}


/* --------------------------------------------------
   S07. 시술부위 — .sub-area--lifting
-------------------------------------------------- */
.sub-area--lifting {
  background: #e8e8e8;
  padding: var(--sp-5xl) 0 0;
}

.sub-area--lifting .sub-title,
.sub-area--lifting .sub-label-en {
  color: #7c3b9f;
}

.area-img-wrap {
  display: flex;
  justify-content: center;
}

.area-img-wrap img {
  width: 100%;
  max-width: 1920px;
  height: auto;
  display: block;
  border-radius: var(--radius-r);
}


/* --------------------------------------------------
   반응형 — 태블릿 (1024px 이하)
-------------------------------------------------- */
@media (max-width: 1024px) {
  .feature-card--lifting {
    flex: 0 0 calc(50% - 14px);
  }
}


/* --------------------------------------------------
   반응형 — 모바일 (768px 이하)
-------------------------------------------------- */
@media (max-width: 768px) {
  .sub-area--lifting {
    padding: var(--sp-2xl) 0 0;
  }
  .sub-banner--lifting {
    min-height: 460px;
  }
  .sub-banner--lifting .sub-banner-bg img {
    object-position: 70% center;
  }

  .sub-banner--lifting .sub-banner-inner {
    width: 100%;
    min-height: 380px;
    padding: var(--sp-3xl) var(--safe-padding);
    justify-content: center;
  }

  .shrink-layout,
  .indigo-layout {
    flex-direction: column;
    gap: var(--sp-3xl);
    text-align: center;
  }

  .shrink-layout__img,
  .indigo-layout__img {
    flex: 0 0 auto;
  }

  .indigo-layout__img {
    order: 2;
  }

  .shrink-layout__img img,
  .indigo-layout__img img {
    max-width: 200px;
    margin: 0 auto;
  }

  .sub-section-hd--left {
    text-align: center;
    align-items: center;
  }

  .sub-section-hd--left .sub-label-en {
    text-align: center;
  }

  .effect-list {
    gap: var(--sp-r);
  }

  .effect-item__img {
    width: 100px;
    height: 100px;
  }

  .feature-list--lifting {
    flex-direction: column;
    align-items: center;
  }

  .feature-card--lifting {
    flex: 0 0 auto;
    width: 100%;
    max-width: 400px;
    padding: var(--sp-r) var(--sp-r);
  }

  .needs-list--lifting .needs-item {
    border-radius: var(--radius-r);
    padding: var(--sp-sm) var(--sp-r);
    font-size: var(--fs-sm);
  }
}


/* --------------------------------------------------
   반응형 — 소형 모바일 (480px 이하)
-------------------------------------------------- */
@media (max-width: 480px) {
  .sub-banner--lifting .sub-banner-title {
    font-size: var(--fz-banner-mo, 36px);
  }

  .effect-item__img {
    width: 80px;
    height: 80px;
  }
}

/* =====================================================
   4-2 여드름 흉터 — template-0402
   추가 위치: lydia-sub.css 하단
====================================================== */


/* --------------------------------------------------
   S01. 배너 — .sub-banner--acne
-------------------------------------------------- */
.sub-banner--acne {
  position: relative;
  overflow: hidden;
  height: 470px;
  min-height: 500px;
  background: #f5ede8;
}

.sub-banner--acne .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--acne .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* inner: 좌 50%, 세로 중앙 */
.sub-banner--acne .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sub-banner--acne .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.sub-banner--acne .sub-banner-pretitle {
  font-size: var(--fs-body);
  font-weight: 500;
  color: #3e3632;
  margin: 0;
}

.sub-banner--acne .sub-banner-title {
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 800;
  color: #3e3632;
  letter-spacing: -0.04em;
  margin: 0;
  line-height: var(--lh-normal);
}

.sub-banner--acne .sub-banner-title-point {
  font-weight: 400;
  color: #3e3632;
}

/* ACNE SCARS 뱃지 */
.sub-banner--acne .sub-banner-badge {
  display: inline-block;
  font-size: var(--fs-xs);
  letter-spacing: 0.25em;
  color: #fff;
  background: #3e3632;
  border-radius: 20px;
  padding: 5px 20px;
  margin: 1em auto;
}

.sub-banner--acne .sub-banner-summary {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #3e3632;
  margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 여드름이란? — .sub-about--acne
-------------------------------------------------- */
.sub-about--acne {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-about--acne .sub-about-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-about--acne .sub-about-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 배경이 어두운 이미지이므로 오버레이 없이 그대로 사용 */

.sub-about--acne .sub-section-hd--light .sub-label-en {
  font-size: var(--fs-xs);
  letter-spacing: 0.22em;
  color: #fcdff1;
  margin-bottom: 10px;
}

.sub-about--acne .sub-section-hd--light .sub-title {
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 400;
  color: #fcdff1;
}

.sub-about--acne .sub-section-hd--light .sub-title strong {
  font-weight: 700;
}

/* 구분선 */
.sub-about__divider {
  width: 40px;
  height: 2px;
  background: #fcdff1;
  margin: 20px auto 0;
}

.sub-about__body {
  max-width: 780px;
  margin: 32px auto 0;
  text-align: center;
}

.sub-about__body p {
  font-size: var(--fs-body);
  line-height: 2;
  color: #fcdff1;
  margin-bottom: 20px;
}

.sub-about__body p:last-child {
  margin-bottom: 0;
}


/* --------------------------------------------------
   S03. 흉터의 종류 — .sub-type
-------------------------------------------------- */
.sub-type {
  background: #fff2fb;
  padding: var(--sp-5xl) 0;
}

.sub-type .sub-title,
.sub-type .sub-label-en {
  color: #61204a;
}

.acne-type-list {
  display: flex;
  gap: 24px;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.acne-type-item {
  flex: 0 0 calc(25% - 18px);
  min-width: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
}

.acne-type-item__img {
  width: 100%;
  aspect-ratio: 1 / 0.85;
  overflow: hidden;
}

.acne-type-item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.acne-type-item__name {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: #61204a;
}

.acne-type-item__desc {
  font-size: var(--fs-body);
  color: #61204a;
  line-height: var(--lh-loose);
}


/* --------------------------------------------------
   S04. 여드름 흉터의 장점 — .sub-advantage
-------------------------------------------------- */
.sub-advantage {
  background: #fff2fb;
}

.sub-advantage-acne::before {
  background: transparent;
}

.sub-advantage .sub-title,
.sub-advantage .sub-label-en {
  color: #61204a;
}

.advantage-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-r);
  max-width: 1100px;
  margin: 0 auto;
}

/* 카드 자체는 배경/테두리 없음 */
.advantage-item {
  display: flex;
  align-items: stretch;   /* ✅ 라벨 박스가 카드 높이 전체를 채움 */
  gap: var(--sp-xl);
  background: var(--white);
  border: none;
  padding: 0;
}

/* 라벨 박스: 보라 정사각형, 카드 높이와 동일 */
.advantage-item__label {
  flex-shrink: 0;
  width: 140px;
  background: #61204a;
  color: #fff;
  font-size: var(--fs-lg);
  font-weight: 500;
  line-height: var(--lh-tight);
  text-align: center;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp-r);
}

/* desc는 세로 중앙 정렬 */
.advantage-item__desc {
  font-size: var(--fs-body);
  color: #61204a;
  line-height: var(--lh-loose);
  word-break: keep-all;
  align-self: center;
}

/* --primary 수정자 불필요 — 라벨 박스 색은 항상 동일 */
.advantage-item--primary {
  background: var(--white);
  border: none;
}

.advantage-item--primary .advantage-item__desc {
  color: #61204a;
}

/* --------------------------------------------------
   S05. 추천합니다 — .sub-recommend--acne
-------------------------------------------------- */
.sub-recommend--acne {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-recommend--acne .sub-recommend-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-recommend--acne .sub-recommend-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 배경 이미지가 어두우므로 오버레이 생략 */

.recommend-list--acne {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 380px;
}

.recommend-list--acne .recommend-item {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50px;
  padding: 14px 28px;
  font-size: var(--fs-body);
  color: rgba(255, 255, 255, 0.92);
  text-align: center;
  transition: background 0.2s;
}

.recommend-list--acne .recommend-item:hover {
  background: rgba(255, 255, 255, 0.16);
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  /* 배너 */
  .sub-banner--acne {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--acne .sub-banner-bg img {
    object-position: 65% center;
  }

  .sub-banner--acne .sub-banner-inner {
    width: 100%;
    min-height: 360px;
    padding: 44px 24px 36px;
  }

  /* 종류 */
  .acne-type-list {
    gap: 20px;
  }

  .acne-type-item {
    flex: 0 0 calc(50% - 10px);
  }

  /* 장점 */
  .advantage-grid {
    grid-template-columns: 1fr;
  }

  .advantage-item {
    gap: 18px;
    padding: 20px 22px;
  }
  .sub-advantage-acne .advantage-item {
    flex-direction: column;
  }
  .sub-advantage-acne .advantage-item__label {
    width: 100%;
    font-size: var(--fs-md);
  }
}

@media (max-width: 480px) {
  .sub-banner--acne .sub-banner-title {
    font-size: 40px;
  }

  .acne-type-item {
    max-width: 300px;
  }
}

/* =====================================================
   4-3 스킨부스터 — template-0403
   추가 위치: lydia-sub.css 하단
====================================================== */


/* --------------------------------------------------
   S01. 배너 — .sub-banner--skinbooster
-------------------------------------------------- */
.sub-banner--skinbooster {
  position: relative;
  overflow: hidden;
  height: 470px;
  min-height: 500px;
  background: #f5ede8;
}

.sub-banner--skinbooster .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--skinbooster .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

/* inner: 좌 50%, 세로 중앙 */
.sub-banner--skinbooster .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sub-banner--skinbooster .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.sub-banner--skinbooster .sub-banner-pretitle {
  font-size: var(--fs-body);
  font-weight: 500;
  color: #c7376d;
  margin: 0;
}

.sub-banner--skinbooster .sub-banner-title {
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 800;
  color: #c7376d;
  letter-spacing: -0.04em;
  margin: 0;
  line-height: var(--lh-normal);
}

.sub-banner--skinbooster .sub-banner-title-point {
  font-weight: 400;
  color: #c7376d;
}

/* ACNE SCARS 뱃지 */
.sub-banner--skinbooster .sub-banner-badge {
  display: inline-block;
  font-size: var(--fs-xs);
  letter-spacing: 0.25em;
  color: #fff;
  background: #c7376d;
  border-radius: 20px;
  padding: 5px 20px;
  margin: 1em auto;
}

.sub-banner--skinbooster .sub-banner-summary {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #c7376d;
  margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 핑크부스터란? — .sub-intro--skinbooster
-------------------------------------------------- */
.sub-intro--skinbooster {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
  background: #fff;
}

.sub-intro-bg--skinbooster {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-intro.sub-intro--skinbooster .sub-section-hd::after {
  display: none;
}

.sub-intro--skinbooster .sub-title,
.sub-intro--skinbooster .sub-label-en {
  color: #9e3b6a;
}

.sub-intro-bg--skinbooster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 연한 배경이므로 오버레이 없이 그대로 */

.skinbooster-intro__body {
  max-width: 720px;
  margin: 0 auto 40px;
  text-align: center;
}

.skinbooster-intro__body p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #61204a;
  margin-bottom: 14px;
}

.skinbooster-intro__body p:last-child {
  margin-bottom: 0;
}

.skinbooster-intro__highlight {
  color: #5a0a30 !important;
}

.skinbooster-intro__highlight span {
  color: var(--white);
  background-color: #e764a2;
  padding: 0 0.5%;
  font-weight: 500;
}

/* 효과 태그 + 이미지 3단 레이아웃 */
.skinbooster-effect {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  flex-wrap: wrap;
}

.skinbooster-effect__tags {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.skinbooster-effect__tags li {
  border: 1.5px solid #d4508a;
  border-radius: 50px;
  padding: 10px 24px;
  font-size: 14px;
  font-weight: 500;
  color: #732269;
  white-space: nowrap;
  text-align: center;
  background: #fff;
  transition: background 0.2s, color 0.2s;
}

.skinbooster-effect__tags li:hover {
  background: #d4508a;
  color: #fff;
}

.skinbooster-effect__img img {
  width: 100%;
  display: block;
}


/* --------------------------------------------------
   S03. 특징 — .sub-feature--skinbooster
-------------------------------------------------- */
.sub-feature--skinbooster {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-feature--skinbooster .sub-feature-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-feature--skinbooster .sub-feature-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-feature--skinbooster .sub-title,
.sub-feature--skinbooster .sub-label-en {
  color: #fde1de;
}

/* 어두운 브라운 배경이미지 — 오버레이 생략 */

/* 특징 상단 인트로 2단 */
.skinbooster-feature__intro {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 48px;
  margin-bottom: 48px;
  border-radius: 12px;
  padding: 32px 40px;
}

.skinbooster-feature__intro-left {
  text-align: center;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
  padding-right: 40px;
}

.skinbooster-feature__intro-left p {
  font-size: var(--fs-lg);
  line-height: var(--lh-loose);
  color: #fde1de;
  font-weight: 500;
}

.skinbooster-feature__intro-left p strong {
  font-weight: 500;
  color: #fde1de;
}

.skinbooster-feature__intro-right p {
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  color: #fde1de;
  display: inline-block;
}

/* 6개 그리드 */
.skinbooster-feature__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  background: rgba(255, 255, 255, 0.07);
  border-radius: var(--radius-r);
}

.skinbooster-feature__item {
  padding: 42px;
  transition: background 0.2s;
}

.skinbooster-feature__num {
  font-size: var(--fs-lg);
  font-weight: 500;
  margin-bottom: var(--sp-lg);
  color: #fde1de;
}

.skinbooster-feature__item p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #fde1de;
}


/* --------------------------------------------------
   S04. 필요한 경우 — .sub-needs--skinbooster
-------------------------------------------------- */
.sub-needs--skinbooster {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-needs--skinbooster .sub-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-needs--skinbooster .sub-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-needs--skinbooster .sub-title,
.sub-needs--skinbooster .sub-label-en {
  color: #f2bdcd;
}

/* 어두운 버건디 배경이미지 — 오버레이 생략 */

.needs-list--skinbooster {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 780px;
  counter-reset: needs-counter;
}

.needs-list--skinbooster .needs-item {
    counter-increment: needs-counter;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--sp-xl);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius-pill);
    padding: var(--sp-r) var(--sp-xl);
    font-size: var(--fs-body);
    color: var(--white);
    line-height: var(--lh-normal);
    transition: background var(--duration);
    word-break: keep-all;
    background: transparent;
}

.needs-list--skinbooster .needs-item::before {
    content: "0" counter(needs-counter);
    font-size: var(--fs-xs);
    font-weight: 700;
    background-color: #f2bdcd;
    color: var(--txt-base);
    letter-spacing: 0.04em;
    flex-shrink: 0;
    border-radius: var(--radius-pill);
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.1em;
}

.needs-list--skinbooster .needs-item:hover {
  background: rgba(255, 255, 255, 0.14);
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  /* 배너 */
  .sub-banner--skinbooster {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--skinbooster .sub-banner-bg img {
    object-position: 65% center;
  }

  .sub-banner--skinbooster .sub-banner-inner {
    width: 100%;
    min-height: 360px;
    padding: 44px 24px 36px;
  }

  /* 효과 태그 */
  .skinbooster-effect {
    flex-direction: column;
    gap: 20px;
  }

  .skinbooster-effect__tags {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }

  /* 특징 인트로 */
  .skinbooster-feature__intro {
    flex-direction: column;
    gap: 20px;
    padding: 24px;
  }

  .skinbooster-feature__intro-left {
    flex: 0 0 auto;
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding-right: 0;
    padding-bottom: 20px;
    width: 100%;
  }

  /* 특징 그리드 */
  .skinbooster-feature__grid {
    grid-template-columns: 1fr;
  }

  /* 필요 리스트 */
  .needs-list--skinbooster .needs-item {
    border-radius: 12px;
    padding: 14px 22px;
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .sub-banner--skinbooster .sub-banner-title {
    font-size: 40px;
  }
}

/* =====================================================
   4-4 지방분해주사 — template-0404
   추가 위치: lydia-sub.css 하단
====================================================== */


/* --------------------------------------------------
   S01. 배너 — .sub-banner--fatdissolve
-------------------------------------------------- */
.sub-banner--fatdissolve {
  position: relative;
  overflow: hidden;
  height: 420px;
  min-height: 420px;
  background: #f5e8e0;
}

.sub-banner--fatdissolve .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--fatdissolve .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.sub-banner--fatdissolve .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sub-banner--fatdissolve .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.sub-banner--fatdissolve .sub-banner-pretitle {
  font-size: 15px;
  font-weight: 500;
  color: #824831;
  margin: 0;
}

.sub-banner--fatdissolve .sub-banner-title {
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 700;
  color: #824831;
  line-height: var(--lh-normal);
  letter-spacing: -0.05em;
  margin: 0;
}

.sub-banner--fatdissolve .sub-banner-summary {
  font-size: 14px;
  line-height: 1.85;
  color: #824831;
  margin: 4px 0 0;
}


/* --------------------------------------------------
   S02. PPC란? — .sub-about--fatdissolve
-------------------------------------------------- */
.sub-about--fatdissolve,
.sub-3max-text {
  padding: var(--sp-5xl) 0;
}

.sub-about--fatdissolve .sub-section-hd {
  margin-bottom: 32px;
}

.sub-about--fatdissolve .sub-label-en {
  margin-bottom: 8px;
}

.fatdissolve-about__body {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.fatdissolve-about__body p {
  font-size: var(--fs-body);
  line-height: 2;
  color: var(--txt-base);
  margin-bottom: 16px;
}

.fatdissolve-about__body p:last-child {
  margin-bottom: 0;
}


/* --------------------------------------------------
   S03. 3MAX 텍스트 — .sub-3max-text
-------------------------------------------------- */

/* 큰 타이틀 변형 */
.sub-3max-text .sub-title--lg {
    font-family: var(--font-sans);
    font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl));
    font-weight: 400;
    color: var(--txt-base);
    letter-spacing: -0.03em;
    line-height: var(--lh-tight);
    word-break: keep-all;
}

.sub-3max-text .sub-title--lg strong {
  font-weight: 700;
}

.fatdissolve-3max__body {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.fatdissolve-3max__body p {
  font-size: var(--fs-body);
  line-height: 2;
  color: var(--txt-base);
  margin-bottom: 16px;
}


/* --------------------------------------------------
   S04. 3MAX 장비 — .sub-3max-device
-------------------------------------------------- */
.sub-3max-device {
  background: #feeaf4;
  padding: var(--section-py, 80px) 0;
}

.device-layout {
  display: flex;
  align-items: center;
  gap: var(--sp-r)
}

.device-layout__img {
  flex: 0 0 360px;
  display: flex;
  justify-content: flex-end;
}

.device-layout__img img {
  width: 100%;
  max-width: 224px;
  display: block;
}

.device-layout__text {
  flex: 1;
  text-align: center;
}

.device-layout__title {
  font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl));
  font-weight: 400;
  color: var(--main-color);
  margin-bottom: 12px;
  letter-spacing: -0.03em;
  line-height: var(--lh-loose);
}

.device-layout__title strong {
  color: var(--main-color);
  font-weight: 700;
}

.sub-3max-device .device-layout__badge {
  display: inline-block;
  background: #6d2c4b;
  color: #fff7d3;
  font-size: var(--fs-body);
  padding: 10px 30px;
  margin-bottom: 18px;
  border-radius: 0;
}

.sub-3max-device .device-layout__img img {
  max-width: 224px;
}

.device-layout__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #6d2c4b;
}


/* --------------------------------------------------
   S05. 카복시 — .sub-carboxy
-------------------------------------------------- */
.sub-carboxy {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-carboxy-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-carboxy-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-carboxy .sub-title,
.sub-carboxy .sub-label-en {
  color: var(--white);
}

/* 어두운 버건디 배경 — 오버레이 생략 */

.carboxy-content {
  text-align: center;
  max-width: 680px;
  margin: 0 auto;
}

.carboxy-content__highlight {
  display: inline-block;
  font-size: var(--fs-body);
  font-weight: 600;
  color: #49102c;
  background: #ffcbe5;
  padding: 12px 32px;
}

.carboxy-content__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--white);
}


/* --------------------------------------------------
   S06. PPC 특징 — .sub-ppc-feature
-------------------------------------------------- */
.sub-ppc-feature {
  background: #faf1ec;
  padding: var(--sp-5xl) 0;
}

.ppc-feature-img {
  margin-bottom: 32px;
}

.ppc-feature-img img {
  width: 100%;
  max-width: 1000px;
  display: block;
  margin: 0 auto;
  border-radius: 8px;
}

.sub-ppc-feature .sub-title,
.sub-ppc-feature .sub-label-en {
  color: #6d2c4b;
}

.ppc-feature-desc {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}

.ppc-feature-desc p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #49102c;
}

.ppc-feature-desc p strong {
  font-weight: 700;
}


/* --------------------------------------------------
   S07. 시술부위 — .sub-area--fatdissolve
-------------------------------------------------- */
.sub-area--fatdissolve {
  background: #e3f2f4 ;
  padding: var(--sp-5xl) 0;
}

.sub-area--fatdissolve .area-img-wrap img {
  width: 100%;
  max-width: 1000px;
  display: block;
  margin: 0 auto;
  border-radius: 12px;
}


/* --------------------------------------------------
   S08. 시술 시간 및 과정 — .sub-process
-------------------------------------------------- */
.sub-process {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-process-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-process-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-process .sub-title,
.sub-process .sub-label-en {
  color: var(--white);
}

/* 어두운 브라운 배경 — 오버레이 생략 */

.process-desc {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.process-desc p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--white);
}

.process-desc p strong {
  font-size: var(--fs-lg);
  text-decoration: underline;
}

/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {

  .sub-about--fatdissolve, .sub-3max-text {
    padding: var(--sp-2xl) 0;
  }
  /* 배너 */
  .sub-banner--fatdissolve {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--fatdissolve .sub-banner-bg img {
    object-position: 65% center;
  }

  .sub-banner--fatdissolve .sub-banner-inner {
    width: 100%;
    min-height: 360px;
    padding: 44px 24px 36px;
  }

  .sub-banner--fatdissolve .sub-banner-title {
    font-size: 44px;
  }

  .sub-3max-device {
    padding: var(--section-py, 40px) 0;
  }

  .sub-3max-device .device-layout__img img {
    max-width: 112px;
  }

  /* 3MAX 장비 */
  .device-layout {
    flex-direction: column;
    gap: 32px;
    text-align: center;
  }

  .device-layout__img {
    flex: 0 0 auto;
  }

  .device-layout__img img {
    max-width: 180px;
  }

  /* 카복시 */
  .carboxy-content__highlight {
    font-size: 14px;
    padding: 10px 22px;
  }
}

@media (max-width: 480px) {
  .sub-banner--fatdissolve .sub-banner-title {
    font-size: 36px;
  }

  .device-layout__title {
    font-size: 26px;
  }
}

/* =====================================================
   4-5 레이저 제모 — template-0405
   추가 위치: lydia-sub.css 하단
====================================================== */


/* --------------------------------------------------
   S01. 배너 — .sub-banner--waxing
-------------------------------------------------- */
.sub-banner--waxing {
    position: relative;
    overflow: hidden;
    height: 470px;
    min-height: 500px;
    background: #f5ede8;
}

.sub-banner--waxing .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--waxing .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.sub-banner--waxing .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sub-banner--waxing .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.sub-banner--waxing .sub-banner-pretitle {
  font-size: var(--fs-body);
  font-weight: 500;
  color: #473120;
  margin: 0;
}

.sub-banner--waxing .sub-banner-title {
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 800;
    color: #473120;
    letter-spacing: -0.04em;
    margin: 0;
    line-height: var(--lh-normal);
}

.sub-banner--waxing .sub-banner-title-point {
  font-weight: 400;
  color: #473120;
}

/* LASER WAXING 뱃지 */
.sub-banner--waxing .sub-banner-badge {
      display: inline-block;
    font-size: var(--fs-body);
    letter-spacing: 0.25em;
    color: #fff;
    background: #77552c;
    border-radius: 20px;
    padding: 5px 20px;
    margin: 1em auto;
}

.sub-banner--waxing .sub-banner-summary {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: #473120;
    margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 레이저 제모란? — .sub-about--waxing
-------------------------------------------------- */
.sub-about--waxing {
  background: #fff;
  padding: var(--sp-5xl) 0;
}

.sub-about--waxing .sub-section-hd {
  margin-bottom: 32px;
}

.sub-about--waxing .sub-label-en {
  margin-bottom: 8px;
}

.waxing-about__body {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.waxing-about__body p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  margin-bottom: 16px;
}

.waxing-about__body p:last-child {
  margin-bottom: 0;
}


/* --------------------------------------------------
   S03. 레이저 제모 부위 — .sub-waxing-area
-------------------------------------------------- */
.sub-waxing-area {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-waxing-area-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-waxing-area-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-waxing-area .sub-title {
  color: #ebb88b;
}

/* 어두운 차콜 배경 — 오버레이 생략 */

.waxing-area-list {
  display: flex;
  gap: 40px;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.waxing-area-item {
  flex: 0 0 calc(33.333% - 28px);
  min-width: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

.waxing-area-item__img {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid rgba(255, 255, 255, 0.25);
  flex-shrink: 0;
  transition: border-color 0.3s;
}

.waxing-area-item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.waxing-area-item__name {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: #fff1ea;
}

.waxing-area-item__desc {
  font-size: var(--fs-body);
  color: #fff1ea;
  line-height: var(--lh-loose);
}


/* --------------------------------------------------
   S04. 필요한 경우 — .sub-needs--waxing
-------------------------------------------------- */
.sub-needs--waxing {
  background: #faf1ec;          /* 시안 배경 — 흰색 아닌 연핑크베이지 */
  padding: var(--sp-5xl) 0;
}

.sub-needs--waxing .sub-title,
.sub-needs--waxing .sub-label-en {
  color: #6d2c4b;
}

.waxing-needs-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 900px;
  display: flex;
  flex-direction: column;
  gap: var(--sp-r);
}

/* 각 아이템: pill 박스 + 설명 텍스트 가로 배치 */
.waxing-needs-item {
  display: flex;
  align-items: center;
  gap: var(--sp-2xl);
  border: none;                 /* 구분선 제거 */
  padding: 0;
}

/* pill 박스: 번호 + 제목을 하나의 둥근 박스로 */
.waxing-needs-item__pill {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  background: var(--white);
  border: 1.5px solid #d8c0d0;
  border-radius: var(--radius-pill);
  padding: var(--sp-r) var(--sp-2xl);
  min-width: 180px;
  height: 64px;
}

.waxing-needs-item__num {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--main-color);
  color: var(--white);
  font-size: var(--fs-body);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.02em;
}

.waxing-needs-item__label {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: var(--main-color);
  white-space: nowrap;
}

/* 설명 텍스트 */
.waxing-needs-item__desc {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-loose);
  word-break: keep-all;
}

/* --------------------------------------------------
   S05. 해야하는 이유 — .sub-reason--waxing
-------------------------------------------------- */
.sub-reason--waxing {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-reason-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-reason-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 핑크 배경 — 오버레이 생략 */

.sub-reason--waxing .sub-section-hd--light .sub-title,
.sub-reason--waxing .sub-section-hd--light .sub-label-en {
  color: #581836;
}

.waxing-reason-list {
  display: flex;
  gap: var(--sp-r);
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.waxing-reason-item {
  flex: 0 0 calc(33.333% - 14px);
  min-width: 220px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: var(--radius-r);
  padding: var(--sp-2xl) var(--sp-xl);
  text-align: center;           /* ✅ 중앙 정렬 */
  backdrop-filter: blur(4px);
}

/* ✅ 번호: 보라 원형 뱃지로 */
.waxing-reason-item__num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--main-color);
  color: var(--white);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  margin: 0 auto var(--sp-r);  /* ✅ 카드 중앙 + 아래 여백 */
}

.waxing-reason-item__title {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: #581836;
  line-height: var(--lh-normal);
  margin-bottom: var(--sp-r);
  word-break: keep-all;
}

.waxing-reason-item__desc {
  font-size: var(--fs-body);
  color: #581836;
  line-height: var(--lh-loose);
  word-break: keep-all;
}


/* --------------------------------------------------
   S06. 체크리스트 — .sub-checklist
-------------------------------------------------- */
.sub-checklist {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-checklist-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-checklist-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-checklist .sub-title,
.sub-checklist .sub-label-en {
  color: #f2bdcd;
}

/* 어두운 다크 배경 — 오버레이 생략 */

.checklist-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 640px;
}

.checklist-item {
  display: flex;
  align-items: center;
  gap: 20px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  border-radius: 50px;
  padding: 16px 30px;
  transition: background 0.2s;
}

.checklist-item__num {
  flex-shrink: 0;
  font-size: var(--fs-body);
  font-weight: 700;
  color: var(--txt-base);
  background-color: #f2bdcd;
  min-width: 28px;
  letter-spacing: 0.04em;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: var(--radius-pill);
  width: 28px;
  height: 28px;
}

.checklist-item p {
  font-size: var(--fs-body);
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.6;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  /* 배너 */
  .sub-banner--waxing {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--waxing .sub-banner-bg img {
    object-position: 68% center;
  }

  .sub-banner--waxing .sub-banner-inner {
    width: 100%;
    min-height: 360px;
    padding: 44px 24px 36px;
  }

  .sub-about--waxing,
  .sub-waxing-area {
    padding: var(--sp-2xl) 0;
  }

  /* 부위 */
  .waxing-area-list {
    gap: 28px;
  }

  .waxing-area-item {
    flex: 0 0 calc(50% - 14px);
  }

  .waxing-area-item__img {
    width: 140px;
    height: 140px;
  }

  /* 이유 카드 */
  .waxing-reason-list {
    flex-direction: column;
    align-items: center;
  }

  .waxing-reason-item {
    flex: 0 0 auto;
    width: 100%;
    max-width: 300px;
    padding: var(--sp-lg);
  }

  /* 체크리스트 */
  .checklist-item {
    border-radius: 12px;
    padding: 14px 22px;
  }

  .waxing-needs-list {
    flex-direction: column;
    max-width: 720px;
  }
  .waxing-needs-item {
    flex-direction: column;
    gap: var(--sp-sm);
  }
  .waxing-needs-item__pill {
        flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--sp-sm);
    background: var(--white);
    border: 1.5px solid #d8c0d0;
    border-radius: var(--radius-sm);
    padding: var(--sp-xs) var(--sp-md);
    min-width: auto;
    height: 44px;
    width: 100%;
  }
  .waxing-needs-item__num {
        flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--main-color);
    color: var(--white);
    font-size: var(--fs-xs);
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.02em;
  }
  .waxing-needs-item__label {
    font-size: var(--fs-md);
  }
}

@media (max-width: 480px) {
  .sub-banner--waxing .sub-banner-title {
    font-size: 40px;
  }

  .waxing-area-item {
    flex: 0 0 100%;
  }

  .waxing-area-item__img {
    width: 120px;
    height: 120px;
  }
}

/* =====================================================
   4-6 필러/보톡스 — template-0406
   추가 위치: lydia-sub.css 하단
====================================================== */


/* --------------------------------------------------
   S01. 배너 — .sub-banner--filler
-------------------------------------------------- */
.sub-banner--filler {
    position: relative;
    overflow: hidden;
    height: 470px;
    min-height: 500px;
    background: #f5ede8;
}

.sub-banner--filler .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--filler .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.sub-banner--filler .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  height: 100%;
  margin-left: 0;
  padding: 46px 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sub-banner--filler .sub-banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.sub-banner--filler .sub-banner-pretitle {
    font-size: var(--fs-body);
    font-weight: 500;
    color: #782e32;
    margin: 0;
}

.sub-banner--filler .sub-banner-title {
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 800;
    color: #782e32;
    letter-spacing: -0.04em;
    margin: 0;
    line-height: var(--lh-normal);
}

.sub-banner--filler .sub-banner-title-point {
  font-weight: 400;
  color: #782e32;
}

.sub-banner--filler .sub-banner-badge {
    display: inline-block;
    font-size: var(--fs-xs);
    letter-spacing: 0.25em;
    color: #fff;
    background: #782e32;
    border-radius: 20px;
    padding: 5px 20px;
    margin: 1em auto;
}

.sub-banner--filler .sub-banner-summary {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: #782e32;
    margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 필러란? / 보톡스란? — .sub-about--filler
-------------------------------------------------- */
.sub-about--filler {
     background: var(--white);
    padding: var(--sp-5xl) 0;
}

/* 각 블록 사이 구분 */
.filler-about__block {
  max-width: 820px;
  margin: 0 auto 60px;
  text-align: center;
}

.filler-about__block:last-child {
  margin-bottom: 0;
}

/* 보톡스 블록 상단 구분선 */
.filler-about__block--botox {
  padding-top: 56px;
}

.filler-about__body {
  margin-top: 20px;
}


.filler-about__body {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.filler-about__body p {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: var(--txt-base);
    margin-bottom: 16px;
}

.filler-about__body p:last-child {
  margin-bottom: 0;
}

.filler-about__body p strong {
  font-weight: 700;
  text-decoration: underline;
}

/* --------------------------------------------------
   S03. 추천 대상 — .sub-target
-------------------------------------------------- */
.sub-target {
  background: #fdf4fa;
}

.sub-target .sub-title {
  color: #3a2d6e;
}

.target-group {
  max-width: 860px;
  margin: 0 auto 40px;
}

.target-group:last-child {
  margin-bottom: 0;
}

/* 필러 / 보톡스 라벨 */
.target-group__label {
  display: inline-block;
  font-size: var(--fs-body);
  font-weight: 700;
  letter-spacing: 0.06em;
  border-radius: 50px;
  padding: 8px 32px;
  margin-bottom: 24px;
}

.target-group__label--filler {
  background: #732269;
  color: #fff;
}

.target-group__label--botox {
  background: #732269;
  color: #fff;
}

/* 추천 아이템 가로 나열 */
.target-list {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
}

.target-item {
  background: #fff;
  border: 1.5px solid #e0c8e8;
  border-radius: 50px;
  padding: 12px 22px;
  font-size: 13px;
  color: #3a1020;
  line-height: 1.5;
  text-align: center;
  transition: background 0.2s, border-color 0.2s;
  white-space: nowrap;
}

.target-item:hover {
  background: #f5e8f5;
  border-color: #732269;
}

/* --------------------------------------------------
   S03. 추천 대상 — .sub-target--filler (시안형 원형 카드)
-------------------------------------------------- */
.sub-target--filler {
  background: #fbf0ff;
  padding: var(--sp-5xl) 0 var(--sp-5xl);
}

/* 로고 */
.sub-target__logo {
  height: 52px;
  width: auto;
  display: block;
  margin: 0 auto var(--sp-xs);
}

/* 필러 / 보톡스 구분 그룹 */
.target-filler-group {
  margin-top: var(--sp-3xl);
  text-align: center;
}
.target-filler-group--botox {
  margin-top: var(--sp-4xl);
}

/* – 필러 – / – 보톡스 – pill 라벨 */
.target-filler-group__label {
  display: inline-block;
  font-size: var(--fs-lg);
  color: var(--white);
  border-radius: var(--radius-pill);
  padding: var(--sp-xs) var(--sp-2xl);
  letter-spacing: 0.1em;
  margin-bottom: var(--sp-lg);
  background: #3a2d6e;
}

/* 원형 카드 리스트 */
.target-circle-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  gap: var(--sp-xl);
  flex-wrap: wrap;
  max-width: 1000px;
}

/* 아이템 */
.target-circle-item {
  flex: 0 0 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 원형 카드 */
.target-circle-card {
  position: relative;
  width: 190px;
  height: 190px;
  border-radius: var(--radius-pill);
  border: 1.5px solid #e5e3eb;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--sp-sm);
  box-sizing: border-box;
}

.target-circle-card p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #3a2d6e;
  word-break: keep-all;
  margin: 0;
}

/* 번호 뱃지 — 육각형 효과는 clip-path로 */
.target-circle-num {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  width: 34px;
  height: 34px;
  background: #5b3fa6;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  letter-spacing: 0.02em;
}

/* 보톡스 3열 — 중앙 정렬 자연스럽게 */
.target-circle-list--3col {
  max-width: 760px;
}

/* ── 반응형 ── */
@media (max-width: 768px) {
  .sub-about--filler {
    padding: var(--sp-2xl) 0;
  }
  .filler-about__block {
    margin: 0;
  }
  .target-circle-list {
    gap: var(--sp-lg);
  }
  .target-circle-item {
    flex: 0 0 160px;
  }
  .target-circle-card {
    width: 160px;
    height: 160px;
    padding: 0;
  }
  .target-circle-card p {
    font-size: var(--fs-body);
  }
}

@media (max-width: 480px) {
  .target-circle-list {
    gap: var(--sp-r);
  }
  .target-circle-item {
    flex: 0 0 calc(50% - 12px);
  }
}


/* --------------------------------------------------
   S04. 시술과정 — .sub-process--filler
-------------------------------------------------- */
.sub-process--filler {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
  background: #fff; /* bg 로드 전 fallback */
}

/* 배경 이미지 — 섹션 전체 커버 */
.filler-process-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.filler-process-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

.sub-process--filler .sub-title,
.sub-process--filler .sub-label-en {
  color: #7b3b9f;
}

/* 콘텐츠 — 배경 위로 */
.filler-process-content {
  position: relative;
  z-index: 1;
}

/* 스텝 이미지 래퍼 */
.filler-process-steps {
  text-align: center;
  margin-top: var(--sp-2xl);
}
.filler-process-steps img {
  width: 100%;
  max-width: 1000px;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* 반응형 */
@media (max-width: 768px) {
  .filler-process-steps img {
    max-width: 100%;
  }
}


/* --------------------------------------------------
   S05. 필러/보톡스 효과 — .sub-effect--filler
-------------------------------------------------- */
.sub-effect--filler {
  position: relative;
  padding: var(--section-py, 80px) 0;
  overflow: hidden;
}

.sub-effect--filler .sub-effect-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-effect--filler .sub-effect-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-effect--filler .sub-title,
.sub-effect--filler .sub-label-en {
  color: #fcdff1;
}

.sub-effect--filler .sub-title-bar {
  background-color: #fcdff1;
}

/* 어두운 차콜 배경 — 오버레이 생략 */

.filler-effect__block {
  max-width: 780px;
  margin: 0 auto 56px;
  text-align: center;
}

.filler-effect__block:last-child {
  margin-bottom: 0;
}

.filler-effect__block--botox {
  padding-top: 52px;
}

.filler-effect__body {
  margin-top: 20px;
}

.filler-effect__body p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #fcdff1;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  /* 배너 */
  .sub-banner--filler {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--filler .sub-banner-bg img {
    object-position: 68% center;
  }

  .sub-banner--filler .sub-banner-inner {
    width: 100%;
    min-height: 360px;
    padding: 44px 24px 36px;
  }

  .filler-effect__block {
    margin: 0;
  }

  /* 추천 아이템 */
  .target-item {
    white-space: normal;
    flex: 0 0 calc(50% - 7px);
    min-width: 140px;
  }

  /* 시술과정 이미지 */
  .filler-process-img img {
    border-radius: 8px;
  }
}

@media (max-width: 480px) {
  .sub-banner--filler .sub-banner-title {
    font-size: 40px;
  }

  .target-item {
    flex: 0 0 100%;
  }
}

/* ==========================================================
   5-1 PRP / 줄기세포   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 서브 배너 — .sub-banner--prp
-------------------------------------------------- */
.sub-banner--prp {
    position: relative;
    overflow: hidden;
    height: 470px;
    min-height: 500px;
    background: #e8dff2;
}

.sub-banner--prp .sub-banner-bg {
      position: absolute;
    inset: 0;
    z-index: 0;
}

.sub-banner--prp .sub-banner-inner {
    position: relative;
    z-index: 1;
    width: 70%;
    height: 100%;
    margin-left: 0;
    padding: 46px 40px 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 소제목 "시간을 되돌리는" */
.sub-banner--prp .sub-banner-subtitle {
  font-size: 18px;
  color: #6b21b1;
  margin: 0 0 10px;
  font-weight: 400;
}

/* 대제목 "PRP / 줄기세포" */
.sub-banner--prp .sub-banner-title {
  font-size: clamp(40px, 5vw, 64px);
  font-weight: 800;
  color: #6b21b1;
  margin: 0 0 16px;
  line-height: var(--lh-normal);
}

/* 영문 pill 뱃지 "PRP/STEM CELL" */
.sub-banner--prp .sub-banner-label-en {
    display: inline-block;
    font-size: var(--fs-xs);
    letter-spacing: 0.25em;
    color: #fff;
    background: #6b21b1;
    border-radius: 20px;
    padding: 5px 20px;
    margin: 1em auto;
}

/* 설명 문구 */
.sub-banner--prp .sub-banner-desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #6b21b1;
  margin: 8px 0 0;
  text-align: center;
}


/* --------------------------------------------------
   S02–S03. PRP란? / 줄기세포란?
-------------------------------------------------- */
.sub-intro {
  background: #fff;
  padding: var(--sec-py, 80px) 0;
}

.sub-intro--stem {
  background: #fff;
}

/* 제목: "PRP" / "줄기세포" 부분만 black 볼드 */
.sub-intro .sub-section-title {
  font-size: clamp(28px, 3.5vw, 40px);
  font-weight: 900;
  color: #111;
}

/* "란?" 부분은 normal weight */
.sub-intro .sub-section-title .sub-section-title__point {
  font-weight: 400;
  color: #111;
}

/* 제목 하단 짧은 구분선 */
.sub-intro .sub-section-hd::after {
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  background: #111;
  margin: 16px auto 0;
}

.sub-intro__text {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  text-align: center;
  margin-top: 32px;
}

.sub-intro__text--mt {
  margin-top: 20px;
}


/* --------------------------------------------------
   S04. PRP 과정 — .prp-course
-------------------------------------------------- */
.prp-course {
  background: #f0e7ff;
  padding: var(--sec-py, 80px) 0;
}

.prp-course__img {
  margin-top: 40px;
  text-align: center;
}

.prp-course__img img {
  max-width: 100%;
  height: auto;
}

.prp-course .sub-title,
.prp-course .sub-label-en {
  color: #3a2d6e;
}


/* --------------------------------------------------
   S05. PRP 장점 + 줄기세포 장점 — .prp-advantage
-------------------------------------------------- */
.prp-advantage {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

.prp-advantage-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.prp-advantage-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.prp-advantage .sub-title,
.prp-advantage .sub-label-en {
  color: #d4c1ab;
}

/* 두 번째 섹션 hd 간격 */
.prp-advantage__hd--stem {
  margin-top: 64px;
}

/* PRP 장점 리스트 */
.prp-adv-list {
  list-style: none;
  padding: 0;
  margin: 32px 0 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.prp-adv-list__item {
  display: flex;
  align-items: center;
  gap: 20px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50px;
  padding: 18px 32px;
}

.prp-adv-list__badge {
  flex-shrink: 0;
  font-size: var(--fs-md);
  font-weight: 700;
  color: #d4c1ab;
  border-radius: var(--radius-pill);
  padding: 4px 18px;
  white-space: nowrap;
  width: 140px;
  text-align: center;
}

.prp-adv-list__desc {
  font-size: var(--fs-body);
  color: var(--white);
  line-height: var(--lh-loose);
  margin: 0;
  text-align: center;
}

/* 줄기세포 장점 리스트 */
.stem-adv-list {
  list-style: none;
  padding: 0;
  margin: 32px 0 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.stem-adv-list__item {
  display: flex;
  align-items: center;
  gap: 20px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50px;
  padding: 18px 32px;
}

.stem-adv-list__badge {
  flex-shrink: 0;
  font-size: var(--fs-md);
  font-weight: 700;
  color: #d4c1ab;
  border-radius: var(--radius-pill);
  padding: 4px 18px;
  white-space: nowrap;
  width: 140px;
  text-align: center;
}

.stem-adv-list__desc {
  font-size: var(--fs-body);
  color: var(--white);
  line-height: var(--lh-loose);
  margin: 0;
  text-align: center;
}


/* --------------------------------------------------
   S06. 줄기세포 병합치료법 — .stem-combo
-------------------------------------------------- */
.stem-combo {
  position: relative;
  background: #f0f4f8;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
  text-align: center;
}

/* 배경 이미지 — 의사 사진, 흐리게 */
.stem-combo-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.stem-combo-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  opacity: 0.25;
}

/* 제목: "줄기세포" normal + "병합치료법" bold */
.stem-combo__title {
  font-size: clamp(28px, 3.5vw, 42px) !important;
  font-weight: 400;
  color: #1a2a4a;
}

.stem-combo__title strong {
  font-weight: 700;
}
.stem-combo .sub-label-en {
  color: #1a2a4a;
}

/* 원형 이미지 3개 */
.stem-combo__circles {
  margin: 40px auto 0;
  max-width: 780px;
}

.stem-combo__circles img {
  width: 100%;
  height: auto;
}

/* 텍스트 영역 */
.stem-combo__text-wrap {
  max-width: 640px;
  margin: 40px auto 0;
  text-align: center;
}

/* outline 뱃지 */
.stem-combo__badge {
  display: inline-block;
  font-size: var(--fs-md);
  font-weight: 700;
  color: #1a2a4a;
  background: transparent;
  border: 1px solid #1a2a4a;
  border-radius: 50px;
  padding: 10px 28px;
  margin-bottom: 24px;
}

.stem-combo__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #1a2a4a;
  text-align: center;
  margin: 0;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 1024px) {
  .prp-adv-list,
  .stem-adv-list {
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .sub-intro--prp {
    padding: var(--sec-py, 40px);
  }
  .sub-banner--prp {
    min-height: 460px;
    height: auto;
  }

  .sub-banner--prp .sub-banner-bg {
    object-position: 65% center;
  }

  .sub-banner--prp .sub-banner-inner {
    width: 100%;
    min-height: 380px;
    padding: 44px 24px 36px;
  }

  .prp-adv-list__item,
  .stem-adv-list__item {
    flex-direction: column;
    gap: 10px;
    border-radius: 16px;
    padding: 18px 24px;
  }

  .stem-combo__body {
    flex-direction: column;
    gap: 0;
  }

  .stem-combo__thumb {
    flex: 0 0 auto;
    width: 100%;
    height: 200px;
  }

  .stem-combo__text-wrap {
    padding: 24px;
  }
}

@media (max-width: 480px) {
  .sub-banner--prp .sub-banner-title {
    font-size: 34px;
  }

  .prp-adv-list__badge,
  .stem-adv-list__badge {
    padding: 4px 14px;
  }
}

/* ==========================================================
   5-2 마늘주사   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 서브 배너 — .sub-banner--garlic
-------------------------------------------------- */
.sub-banner--garlic {
    position: relative;
    overflow: hidden;
    height: 470px;
    min-height: 500px;
    background: #f0e8cc;
}

.sub-banner--garlic .sub-banner-bg {
      position: absolute;
    inset: 0;
    z-index: 0;
}

.sub-banner--garlic .sub-banner-inner {
      position: relative;
    z-index: 1;
    width: 70%;
    height: 100%;
    margin-left: 0;
    padding: 46px 40px 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 소제목 */
.sub-banner--garlic .sub-banner-subtitle {
    font-size: var(--fs-body);
    font-weight: 500;
    color: #7d5738;
    margin: 0;
}

/* 대제목 */
.sub-banner--garlic .sub-banner-title {
     font-size: clamp(40px, 5vw, 64px);
    font-weight: 800;
    color: #7d5738;
    letter-spacing: -0.04em;
    margin: 0;
    line-height: var(--lh-normal);
}

/* 골드 pill 뱃지 */
.sub-banner--garlic .sub-banner-label-en {
      display: inline-block;
    font-size: var(--fs-xs);
    letter-spacing: 0.25em;
    color: #fff;
    background: #7d5738;
    border-radius: 20px;
    padding: 5px 20px;
    margin: 1em auto;
}

/* 설명 문구 */
.sub-banner--garlic .sub-banner-desc {
      font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: #7d5738;
    margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 마늘주사란? — .garlic-intro
-------------------------------------------------- */
.garlic-intro {
    background: #fff;
    padding: var(--sp-5xl) 0;
}

/* 제목: "마늘주사" normal + "란?" bold */
.garlic-intro__title {
  font-size: clamp(28px, 3.5vw, 40px) !important;
  font-weight: 400;
  color: #111;
}

.garlic-intro__title strong {
  font-weight: 900;
}

/* 제목 하단 구분선 */
.garlic-intro .sub-section-hd::after {
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  background: #111;
  margin: 16px auto 0;
}

.garlic-intro__text {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  text-align: center;
  margin: 32px 0 48px;
}

/* 번호 pill 리스트 */
.garlic-num-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 500px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.garlic-num-list__item {
  display: flex;
  align-items: center;
  gap: 20px;
  border: 1.5px solid #b6a368;
  border-radius: 50px;
  padding: 14px 32px;
  background: #fff;
}

.garlic-num-list__num {
  flex-shrink: 0;
  font-size: var(--fs-body);
  font-weight: 700;
  color: #b6a368;
  letter-spacing: 0.05em;
  min-width: 24px;
}

.garlic-num-list__text {
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: 1.6;
  margin: 0;
}

.garlic-num-list__text strong {
  font-weight: 700;
}


/* --------------------------------------------------
   S03. 마늘주사 효과 — .garlic-effect
-------------------------------------------------- */
.garlic-effect {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

.garlic-effect-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.garlic-effect-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 제목 em 강조 */
.garlic-effect .sub-title,
.garlic-effect .sub-title em {
  color: #473318;
  font-style: normal;
}

.garlic-effect .sub-title em {
  font-weight: 700;
}

.garlic-effect .sub-label-en {
  color: #473318;
  letter-spacing: 0.15em;
}

/* 효과 원형 그리드: 4 + 3 배치 */
.garlic-effect-list {
  list-style: none;
  padding: 0;
  margin: 48px auto 0;
  max-width: 860px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px 24px;
}

.garlic-effect-list__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  flex: 0 0 180px;
}

.garlic-effect-list__img {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid rgba(200, 169, 110, 0.4);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.garlic-effect-list__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.garlic-effect-list__label {
  font-size: var(--fs-md);
  color: #473318;
  text-align: center;
  line-height: var(--lh-loose);
  margin: 0;
  font-weight: 500;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  .sub-banner--garlic {
    height: auto;
    min-height: 460px;
  }

  .sub-banner--garlic .sub-banner-bg {
    object-position: 70% center;
  }

  .sub-banner--garlic .sub-banner-inner {
    width: 100%;
    min-height: 380px;
    padding: 44px 24px 36px;
  }

  .garlic-intro__text {
    font-size: 14px;
  }

  .garlic-num-list {
    max-width: 100%;
  }

  .garlic-num-list__item {
    border-radius: 16px;
    padding: 14px 20px;
  }

  .garlic-effect-list__item {
    flex: 0 0 140px;
  }

  .garlic-effect-list__img {
    width: 120px;
    height: 120px;
  }
}

@media (max-width: 480px) {
  .sub-banner--garlic .sub-banner-title {
    font-size: 38px;
  }

  .garlic-effect-list {
    gap: 24px 16px;
  }

  .garlic-effect-list__item {
    flex: 0 0 120px;
  }

  .garlic-effect-list__img {
    width: 100px;
    height: 100px;
  }
}

/* ==========================================================
   5-3 신데렐라주사   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 서브 배너 — .sub-banner--cinderella
-------------------------------------------------- */
.sub-banner--cinderella {
    position: relative;
    overflow: hidden;
    height: 470px;
    min-height: 500px;
    background: #f9b8d0;
}

.sub-banner--cinderella .sub-banner-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.sub-banner--cinderella .sub-banner-inner {
    position: relative;
    z-index: 1;
    width: 70%;
    height: 100%;
    margin-left: 0;
    padding: 46px 40px 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 소제목 */
.sub-banner--cinderella .sub-banner-subtitle {
    font-size: var(--fs-body);
    font-weight: 500;
    color: #8a2f76;
    margin: 0;
    line-height: var(--lh-loose);
}

/* 대제목 */
.sub-banner--cinderella .sub-banner-title {
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 800;
    color: #8a2f76;
    letter-spacing: -0.04em;
    margin: 0;
    line-height: var(--lh-normal);
}

/* 핑크 pill 뱃지 */
.sub-banner--cinderella .sub-banner-label-en {
    display: inline-block;
    font-size: var(--fs-xs);
    letter-spacing: 0.25em;
    color: #fff;
    background: #8a2f76;
    border-radius: 20px;
    padding: 5px 20px;
    margin: 1em auto;
}

/* 설명 문구 */
.sub-banner--cinderella .sub-banner-desc {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: #8a2f76;
    margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 신데렐라 주사란? — .cinderella-intro
-------------------------------------------------- */
.cinderella-intro {
  background: #fff;
  padding: var(--sec-py, 80px) 0;
}

/* 제목: "신데렐라 주사" normal + "란?" bold */
.cinderella-intro__title {
  font-size: clamp(26px, 3.2vw, 38px) !important;
  font-weight: 400;
  color: var(--txt-base);
}

.cinderella-intro__title strong {
  font-weight: 700;
}

/* 제목 하단 구분선 */
.cinderella-intro .sub-section-hd::after {
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  background: var(--txt-base);
  margin: 16px auto 0;
}

.cinderella-intro__text {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  text-align: center;
  margin: 32px 0 0;
}


/* --------------------------------------------------
   S03. 신데렐라 주사 효과 — .cinderella-effect
-------------------------------------------------- */
.cinderella-effect {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

.cinderella-effect-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.cinderella-effect-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 제목 em 강조 */
.cinderella-effect .sub-title em {
  color: #752142;
  font-weight: 700;
}

.cinderella-effect .sub-title,
.cinderella-effect .sub-label-en {
  color: #752142;
}

/* 효과 원형 그리드: 4 + 3 배치 */
.cinderella-effect-list {
  list-style: none;
  padding: 0;
  margin: 48px auto 0;
  max-width: 860px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px 24px;
}

.cinderella-effect-list__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  flex: 0 0 180px;
}

.cinderella-effect-list__img {
  width: 180px;
  height: 180px;
  border-radius: var(--radius-pill);
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.cinderella-effect-list__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cinderella-effect-list__label {
  font-size: var(--fs-md);
  color: var(--txt-base);
  text-align: center;
  line-height: var(--lh-loose);
  margin: 0;
}


/* --------------------------------------------------
   S04. 필요한 경우 — .cinderella-needs
-------------------------------------------------- */
.cinderella-needs {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

.cinderella-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.cinderella-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cinderella-needs .sub-title,
.cinderella-needs .sub-label-en {
  color: #f2bdcd;
}

/* 필요 리스트 */
.cinderella-needs-list {
  list-style: none;
  padding: 0;
  margin: 40px auto 0;
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.cinderella-needs-list__item {
  display: flex;
  align-items: center;
  gap: 18px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50px;
  padding: 14px 28px;
}

.cinderella-needs-list__num {
    flex-shrink: 0;
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--txt-base);
    background-color: #f2bdcd;
    min-width: 28px;
    letter-spacing: 0.04em;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--radius-pill);
    width: 28px;
    height: 28px;
}

.cinderella-needs-list__text {
  font-size: var(--fs-body);
  color: #fff;
  line-height: var(--lh-loose);
  margin: 0;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  .sub-banner--cinderella {
    height: auto;
    min-height: 380px;
  }

  .sub-banner--cinderella .sub-banner-bg {
    object-position: 70% center;
  }

  .sub-banner--cinderella .sub-banner-inner {
    width: 100%;
    min-height: 460px;
    padding: 44px 24px 36px;
  }

  .cinderella-intro__text {
    font-size: 14px;
  }

  .cinderella-effect-list__item {
    flex: 0 0 140px;
  }

  .cinderella-effect-list__img {
    width: 120px;
    height: 120px;
  }

  .cinderella-needs-list {
    max-width: 100%;
  }

  .cinderella-needs-list__item {
    border-radius: 16px;
    padding: 14px 20px;
  }
}

@media (max-width: 480px) {
  .sub-banner--cinderella .sub-banner-title {
    font-size: 34px;
  }

  .cinderella-effect-list {
    gap: 24px 16px;
  }

  .cinderella-effect-list__item {
    flex: 0 0 120px;
  }

  .cinderella-effect-list__img {
    width: 100px;
    height: 100px;
  }
}

/* ==========================================================
   5-4 태반주사   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 서브 배너 — .sub-banner--placenta
-------------------------------------------------- */
.sub-banner--placenta {
    position: relative;
    overflow: hidden;
    height: 470px;
    min-height: 500px;
    background: #e8ead8;
}

.sub-banner--placenta .sub-banner-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.sub-banner--placenta .sub-banner-inner {
    position: relative;
    z-index: 1;
    width: 70%;
    height: 100%;
    margin-left: 0;
    padding: 46px 40px 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 소제목 */
.sub-banner--placenta .sub-banner-subtitle {
    font-size: var(--fs-body);
    font-weight: 500;
    color: #4d6908;
    margin: 0;
    line-height: var(--lh-tight);
}

/* 대제목 */
.sub-banner--placenta .sub-banner-title {
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 800;
    color: #4d6908;
    letter-spacing: -0.04em;
    margin: 0;
    line-height: var(--lh-normal);
}

/* 올리브 pill 뱃지 */
.sub-banner--placenta .sub-banner-label-en {
    display: inline-block;
    font-size: var(--fs-xs);
    letter-spacing: 0.25em;
    color: #fff;
    background: #4d6908;
    border-radius: 20px;
    padding: 5px 20px;
    margin: 1em auto;
}

/* 설명 문구 */
.sub-banner--placenta .sub-banner-desc {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: #4d6908;
    margin: 8px 0 0;
}


/* --------------------------------------------------
   S02. 태반주사란? — .placenta-intro
-------------------------------------------------- */
.placenta-intro {
  background: #fff;
  padding: var(--sec-py, 80px) 0;
}

/* 제목: "태반주사" normal + "란?" bold */
.placenta-intro__title {
  font-size: clamp(28px, 3.5vw, 40px) !important;
  font-weight: 400;
  color: #111;
}

.placenta-intro__title strong {
  font-weight: 900;
}

/* 제목 하단 구분선 */
.placenta-intro .sub-section-hd::after {
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  background: var(--txt-base);
  margin: 16px auto 0;
}

.placenta-intro__text {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  text-align: center;
  margin: 32px 0 0;
}


/* --------------------------------------------------
   S03. 태반주사 효과 — .placenta-effect
-------------------------------------------------- */
.placenta-effect {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

.placenta-effect-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.placenta-effect-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 제목 em 강조 */
.placenta-effect .sub-title em {
  color: #795f2d;
  font-weight: 700;
}

.placenta-effect .sub-title,
.placenta-effect .sub-label-en {
  color: #795f2d;
}

/* 효과 원형 그리드: 4 + 3 배치 */
.placenta-effect-list {
  list-style: none;
  padding: 0;
  margin: 48px auto 0;
  max-width: 860px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px 24px;
}

.placenta-effect-list__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  flex: 0 0 180px;
}

.placenta-effect-list__img {
  width: 180px;
  height: 180px;
  border-radius: var(--radius-pill);
  overflow: hidden;
}

.placenta-effect-list__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.placenta-effect-list__label {
  font-size: var(--fs-md);
  color: var(--txt-base);
  text-align: center;
  line-height: var(--lh-loose);
  margin: 0;
}


/* --------------------------------------------------
   S04. 필요한 경우 — .placenta-needs
-------------------------------------------------- */
.placenta-needs {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

.placenta-needs-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.placenta-needs-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.placenta-needs .sub-title,
.placenta-needs .sub-label-en {
  color: #faffc5;
}
.placenta-needs__title em {
  color: #faffc5;
  font-weight: 700;
}

/* 필요 리스트 */
.placenta-needs-list {
  list-style: none;
  padding: 0;
  margin: 40px auto 0;
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.placenta-needs-list__item {
  display: flex;
  align-items: center;
  gap: 18px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50px;
  padding: 14px 28px;
}

.placenta-needs-list__num {
    flex-shrink: 0;
    font-size: var(--fs-body);
    font-weight: 700;
    color: var(--txt-base);
    background-color: #fff;
    min-width: 28px;
    letter-spacing: 0.04em;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--radius-pill);
    width: 28px;
    height: 28px;
}

.placenta-needs-list__text {
  font-size: 15px;
  color: #fff;
  line-height: 1.6;
  margin: 0;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  .sub-banner--placenta {
    height: auto;
    min-height: 380px;
  }

  .sub-banner--placenta .sub-banner-bg {
    object-position: 70% center;
  }

  .sub-banner--placenta .sub-banner-inner {
    width: 100%;
    min-height: 460px;
    padding: 44px 24px 36px;
  }

  .placenta-intro__text {
    font-size: 14px;
  }

  .placenta-effect-list__item {
    flex: 0 0 140px;
  }

  .placenta-effect-list__img {
    width: 120px;
    height: 120px;
  }

  .placenta-needs-list {
    max-width: 100%;
  }

  .placenta-needs-list__item {
    border-radius: 16px;
    padding: 14px 20px;
  }
}

@media (max-width: 480px) {
  .sub-banner--placenta .sub-banner-title {
    font-size: 38px;
  }

  .placenta-effect-list {
    gap: 24px 16px;
  }

  .placenta-effect-list__item {
    flex: 0 0 120px;
  }

  .placenta-effect-list__img {
    width: 100px;
    height: 100px;
  }
}

/* ============================================================
   6-1 카카오톡 상담 페이지
   ============================================================ */

/* ─────────────────────────────────────────────
   S01. 배너 — .kakao-banner
────────────────────────────────────────────── */
.kakao-banner {
  position: relative;
  overflow: hidden;
  min-height: 480px;
  background: #FEE500; /* 카카오 노랑 fallback */
}

.kakao-banner__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.kakao-banner__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* pc_v / mo_v 공통 처리 */
.kakao-banner__bg .mo_v { display: none; }
.kakao-banner__bg .pc_v { display: block; }

.kakao-banner__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3xl);
  padding-top: 60px;
  padding-bottom: 60px;
  min-height: 480px;
}

/* 좌측 텍스트 */
.kakao-banner__text {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-xl);
}

.kakao-banner__logo img {
  height: 56px;
  width: auto;
  display: block;
}

.kakao-banner__title {
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 400;
  color: #3c1e1e;
  line-height: 1.2;
  letter-spacing: -0.03em;
  margin: 0;
}

.kakao-banner__title strong {
  font-weight: 800;
}

.kakao-banner__btn {
  display: inline-block;
  background: #3c1e1e;
  color: #FEE500;
  font-size: var(--fs-body);
  font-weight: 700;
  padding: 14px 32px;
  border-radius: var(--radius-pill);
  text-decoration: none;
  letter-spacing: -0.01em;
  transition: opacity 0.2s;
  align-self: flex-start;
}

.kakao-banner__btn:hover {
  opacity: 0.85;
}

/* 우측 목업 이미지 */
.kakao-banner__mockup {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-end;
}

.kakao-banner__mockup img {
  height: 420px;
  width: auto;
  display: block;
  object-fit: contain;
}


/* ─────────────────────────────────────────────
   S02. 상담 가이드 — .kakao-guide
────────────────────────────────────────────── */
.kakao-guide {
  background: #fff;
  padding: var(--sp-5xl) 0;
}

.kakao-guide-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: center;
  gap: var(--sp-4xl);
  flex-wrap: wrap;
}

.kakao-guide-list__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-xl);
  flex: 0 0 260px;
  text-align: center;
}

/* 원형 클리핑 */
.kakao-guide-list__img {
  width: 240px;
  height: 240px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  border: 3px solid #e8d0f0;
}

.kakao-guide-list__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.kakao-guide-list__desc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-sm);
}

/* 번호 뱃지 */
.kakao-guide-list__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #FEE500;
  color: #3c1e1e;
  font-size: var(--fs-sm);
  font-weight: 800;
  flex-shrink: 0;
}

.kakao-guide-list__text {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  margin: 0;
}

.kakao-guide-list__link {
  color: var(--main-color);
  font-weight: 700;
  text-decoration: none;
}

.kakao-guide-list__link:hover {
  text-decoration: underline;
}


/* ─────────────────────────────────────────────
   모바일 반응형 (@max 768px)
────────────────────────────────────────────── */
@media (max-width: 768px) {

  /* 배너: 배경 이미지 교체 */
  .kakao-banner__bg .pc_v { display: none; }
  .kakao-banner__bg .mo_v { display: block; }

  .kakao-banner {
    min-height: auto;
  }

  /* 배너 레이아웃: 세로 스택 */
  .kakao-banner__inner {
    flex-direction: column;
    align-items: flex-start;
    padding-top: 40px;
    padding-bottom: 0;
    min-height: auto;
    gap: var(--sp-2xl);
    overflow: hidden;
  }

  .kakao-banner__text {
    gap: var(--sp-r);
  }

  .kakao-banner__logo img {
    height: 40px;
  }

  .kakao-banner__title {
    font-size: clamp(1.8rem, 8vw, 2.4rem);
  }

  /* 목업: 우측으로 삐져나오게 */
  .kakao-banner__mockup {
    align-self: flex-end;
    margin-right: -20px; /* 오른쪽 약간 초과 */
  }

  .kakao-banner__mockup img {
    height: 300px;
  }

  /* 가이드: 01/02 → 2열, 03 → 1열 중앙 */
  .kakao-guide-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--sp-2xl) var(--sp-r);
    max-width: 480px;
    margin-inline: auto;
  }

  /* 03 아이템은 전체 너비 중앙 */
  .kakao-guide-list__item:last-child {
    grid-column: 1 / -1;
    max-width: 240px;
    margin-inline: auto;
  }

  .kakao-guide-list__item {
    flex: unset;
    width: 100%;
  }

  /* 원형 이미지 크기 축소 */
  .kakao-guide-list__img {
    width: 160px;
    height: 160px;
  }

  /* 번호 뱃지: 모바일에서 보라색 */
  .kakao-guide-list__num {
    background: #9b59b6;
    color: #fff;
  }
}

@media (max-width: 480px) {
  .kakao-guide-list {
    max-width: 100%;
    padding: 0 var(--sp-r);
  }

  .kakao-guide-list__img {
    width: 130px;
    height: 130px;
  }

  .kakao-guide-list__text {
    font-size: var(--fs-sm);
  }
}

/* ==========================================================
   6-2 전화상담   (lydia-sub.css 하단에 추가)
========================================================== */

.phone-consult {
  background: #fff;
}

.phone-consult__img-wrap {
  position: relative;
  display: block;
  line-height: 0;
}

.phone-consult__img-wrap img {
  width: 100%;
  height: auto;
  display: block;
}

/* 전화번호 영역 위 투명 클릭 오버레이 */
.phone-consult__tel-overlay {
  position: absolute;
  /* 시안 기준: 우측 절반, 전화번호 텍스트 위치 */
  right: 5%;
  top: 45%;
  width: 42%;
  height: 22%;
  display: block;
  cursor: pointer;
  /* 개발 중 확인용: outline: 2px dashed red; */
}

/* ==========================================================
   7-1 병원소개   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 병원 히어로 — .hospital-hero
-------------------------------------------------- */
.hospital-hero {
  position: relative;
  overflow: hidden;
  min-height: 460px;
  display: flex;
  align-items: center;
}

/* 배경 이미지 — 의사 사진 */
.hospital-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hospital-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
  display: block;
}

/* 내부: 우측 정렬 */
.hospital-hero__inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding-top: 48px;
  padding-bottom: 48px;
}

/* 텍스트 박스 */
.hospital-hero__box {
  position: relative;
  width: 320px;
  min-height: 260px;
  display: flex;
  align-items: stretch;
}

/* 박스 배경 이미지 (테두리 프레임) */
.hospital-hero__box-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  display: block;
  z-index: 0;
}

/* 박스 내부 콘텐츠 */
.hospital-hero__box-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 36px 32px;
  text-align: center;
  width: 100%;
}

/* 로고 */
.hospital-hero__logo {
  height: 40px;
  width: auto;
  display: block;
}

/* 제목 "리디아는" */
.hospital-hero__title {
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 400;
  color: #bf2bb3;
  margin: 0;
  line-height: var(--lh-tight);
}

.hospital-hero__title strong {
  font-weight: 600;
}

/* 설명 문구 */
.hospital-hero__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  text-align: center;
  margin: 0;
}

.hospital-hero__desc strong {
  color: #bf2bb3;
}


/* --------------------------------------------------
   S02. 진료 과목 — .hospital-subjects
-------------------------------------------------- */
.hospital-subjects {
  background: #fff;
  padding: var(--sec-py, 80px) 0 100px;
}

/* 제목: "진료" bold + "과목" normal */
.hospital-subjects__title {
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 400;
  color: #3d096d;
  margin: 0;
}

.hospital-subjects__title strong {
  font-weight: 700;
    color: #3d096d;
}

.hospital-subjects .sub-label-en {
  color: #3d096d;
}

/* 진료 과목 리스트 */
.hospital-subjects-list {
  list-style: none;
  padding: 0;
  margin: 48px auto 0;
  max-width: 860px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.hospital-subjects-list__item {
  display: flex;
  align-items: stretch;
  border-radius: 50px;
  overflow: hidden;
  min-height: 58px;
}

/* 좌측 카테고리 — 보라 채움 */
.hospital-subjects-list__cat {
  flex: 0 0 42%;
  background: #904ccf;
  color: #fff;
  font-size: var(--fs-md);
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 24px;
  text-align: center;
  line-height: var(--lh-loose);
}

/* 우측 상세 — 연보라 채움 */
.hospital-subjects-list__detail {
  flex: 1;
  background: #f4e8ff;
  color: #3d096d;
  font-size: var(--fs-body);
  display: flex;
  align-items: center;
  padding: 16px 28px;
  line-height: var(--lh-loose);
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 1024px) {
  .hospital-hero__box {
    width: 280px;
  }
}

@media (max-width: 768px) {
  .hospital-hero {
    min-height: auto;
  }

  .hospital-hero__bg img {
    object-position: 30% center;
  }

  .hospital-hero__inner {
    justify-content: center;
    padding: 200px 24px 40px;
    align-items: flex-end;
  }

  .hospital-hero__box {
    width: 100%;
    max-width: 340px;
  }

  .hospital-subjects-list__item {
    flex-direction: column;
    border-radius: 16px;
  }

  .hospital-subjects-list__cat {
    flex: 0 0 auto;
    border-radius: 0;
    padding: 14px 20px;
  }

  .hospital-subjects-list__detail {
    padding: 14px 20px;
  }
}

@media (max-width: 480px) {
  .hospital-hero__title {
    font-size: 24px;
  }

  .hospital-subjects__title {
    font-size: 28px;
  }
}

/* ==========================================================
   7-2 의료진소개   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 상단 히어로 — .doctor-hero
-------------------------------------------------- */
.doctor-hero {
  position: relative;
  overflow: hidden;
  min-height: 400px;
  display: flex;
  align-items: center;
}

/* 배경 이미지 */
.doctor-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.doctor-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* 내부: 중앙 박스 */
.doctor-hero__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 60px;
  padding-bottom: 60px;
}

/* 다크 텍스트 박스 */
.doctor-hero__box {
  background: rgba(20, 10, 30, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.15);
  padding: 40px 48px;
  max-width: 480px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
}

/* 영문 라벨 */
.doctor-hero__box-label {
  font-size: 12px;
  letter-spacing: 0.2em;
  color: #ff86b9;
  margin: 0;
}

/* 제목 "리디아 홍승호 원장은" */
.doctor-hero__title {
  font-size: clamp(22px, 2.8vw, 32px);
  font-weight: 400;
  color: #ff86b9;
  margin: 0;
  line-height: var(--lh-tight);
}

.doctor-hero__title strong {
  color: #ff86b9;
  font-weight: 700;
}

/* 설명 문구 */
.doctor-hero__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}

/* 핑크 링크 텍스트 */
.doctor-hero__desc-link {
  color: #ff86b9;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.doctor-hero__desc-link:hover {
  color: #ff90c0;
}

/* 하단 로고 */
.doctor-hero__logo {
  height: 52px;
  width: auto;
  display: block;
  opacity: 0.9;
  margin-top: 4px;
}


/* --------------------------------------------------
   S02. 대표원장 약력소개 — .doctor-history
-------------------------------------------------- */
.doctor-history {
  position: relative;
  padding: var(--sec-py, 80px) 0;
  overflow: hidden;
}

/* 배경 이미지 (회색 + 우측 원장 사진) */
.doctor-history__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.doctor-history__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.doctor-history__content {
  display: flex;
  align-items: flex-start;
}

/* 좌측 텍스트 — 최대 60% */
.doctor-history__text {
  max-width: 60%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* 제목 */
.doctor-history__title {
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 700;
  color: var(--white);
  margin: 0;
}

.doctor-history__subtitle {
  font-size: var(--fs-body);
  letter-spacing: 0.15em;
  color: var(--white);
  margin: 0 0 12px;
}

/* "경력" 뱃지 */
.doctor-history__badge {
  display: inline-block;
  font-size: var(--fs-lg);
  font-weight: 500;
  color: var(--txt-base);
  background: var(--white);
  border-radius: 4px;
  padding: 5px 20px;
  margin-bottom: 16px;
}

/* 2컬럼 경력 목록 */
.doctor-history__career {
  display: flex;
  gap: 32px;
  align-items: flex-start;
}

.doctor-history__career-col {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.doctor-history__career-col li {
  font-size: var(--fs-body);
  color: var(--white);
  line-height: 1.6;
}

/* 원장 이름 */
.doctor-history__name {
  font-weight: 600;
  font-size: var(--fs-body);
  color: var(--white);
  margin: 16px 0 0;
  text-align: right;
}


/* --------------------------------------------------
   S03. 활동사진 + LYDIA AWARDS — .doctor-gallery
-------------------------------------------------- */
.doctor-gallery {
  line-height: 0;
  display: block;
}

.doctor-gallery img {
  width: 100%;
  height: auto;
  display: block;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  .doctor-hero__box {
    padding: 32px 24px;
    max-width: 100%;
    margin: 0 16px;
  }

  .doctor-history__text {
    max-width: 100%;
  }

  .doctor-history__career {
    flex-direction: column;
    gap: 12px;
  }

  .doctor-history__name {
    text-align: left;
  }
}

@media (max-width: 480px) {
  .doctor-hero__title {
    font-size: 20px;
  }

  .doctor-history__career-col li {
    font-size: 13px;
  }
}

/* ==========================================================
   7-3 장비소개   (lydia-sub.css 하단에 추가)
========================================================== */

/* --------------------------------------------------
   S01. 서브 배너 — .sub-banner--equipment
-------------------------------------------------- */

.sub-banner--equipment {
    position: relative;
    overflow: hidden;
    height: 300px;
    min-height: 30px;
    background: #f0e0f8;
}

.sub-banner--equipment .sub-banner-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.sub-banner--equipment .sub-banner-inner {
    position: relative;
    z-index: 1;
    width: 70%;
    height: 100%;
    margin-left: 0;
    padding: 46px 40px 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* "리디아에서는" — 리디아 bold */
.equipment-banner__title {
  font-size: clamp(28px, 3.5vw, 44px) !important;
  font-weight: 400;
  color: #2a0a4e;
  margin: 0 0 16px !important;
  line-height: var(--lh-tight);
}

.equipment-banner__title strong {
  font-weight: 700;
}

/* 설명 문구 — "환자 맞춤형 고난도 치료" bold */
.equipment-banner__desc {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #3a1a5e !important;
  text-align: left !important;
  margin: 0 !important;
}

.equipment-banner__desc strong {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* --------------------------------------------------
   S02. 장비 섹션 제목
-------------------------------------------------- */
.equipment-section__title {
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 400;
  color: #1a1a2e;
  margin: 0;
}

.equipment-section__title strong {
  font-weight: 900;
}


/* --------------------------------------------------
   S02. 장비 그리드 — .equipment-section
-------------------------------------------------- */
.equipment-section {
  background: #fff;
  padding: var(--sec-py, 80px) 0 100px;
}

/* 2컬럼 그리드 */
.equipment-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60px 80px;
}

.equipment-list__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0;
}

/* 장비 이미지 */
.equipment-list__img {
  width: 100%;
  max-width: 280px;
  aspect-ratio: 4 / 5;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 24px;
}

.equipment-list__img img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

/* 장비명 뱃지 */
.equipment-list__name {
  display: inline-block;
  font-size: var(--fs-lg);
  font-weight: 700;
  color: #fff;
  background: #b24ccf;
  border-radius: var(--radius-pill);
  padding: 7px 32px;
  margin-bottom: 20px;
}

/* 설명 텍스트 */
.equipment-list__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  text-align: center;
  margin: 0;
  max-width: 340px;
}


/* --------------------------------------------------
   반응형
-------------------------------------------------- */
@media (max-width: 768px) {
  .sub-banner--equipment .sub-banner-inner {
    width: 100%;
  }

  .equipment-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px 24px;
  }

  .equipment-list__img {
    max-width: 180px;
  }

  .equipment-list__desc {
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .equipment-list {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .equipment-list__img {
    max-width: 220px;
  }
}

/* ============================================================
   1-1 레이저 질타이트닝 전용 스타일
   ============================================================ */

/* ─────────────────────────────────────────────
   S01. 배너 — .sub-banner--laser-tight
────────────────────────────────────────────── */
.sub-banner--laser-tight {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #fce8f0;
}

.sub-banner--laser-tight .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--laser-tight .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.sub-banner--laser-tight .sub-banner-inner {
  position: relative;
  z-index: 1;
  width: 70%;
  max-width: 1200px;
  margin-left: 0;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 0 var(--sp-5xl);
  gap: var(--sp-xl);
}

.sub-banner--laser-tight .sub-banner-text {
  display: flex;
  flex-direction: column;
  gap: 5px;
  text-align: center;
}

.sub-banner--laser-tight .sub-banner-pretitle {
  font-size: var(--fs-body);
  color: #a7324f;
  margin: 0;
  line-height: var(--lh-normal);
  font-weight: 500;
  letter-spacing: -0.01em;
}

.sub-banner--laser-tight .sub-banner-title {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  color: #a7324f;
  margin: 0;
  letter-spacing: -0.05em;
  line-height: var(--lh-normal);
  white-space: nowrap;
}

.sub-banner--laser-tight .sub-banner-title-point {
  font-weight: 400;
  color: #a7324f;
}

.sub-banner--laser-tight .sub-banner-en {
    font-size: var(--fs-body);
    font-weight: 500;
    letter-spacing: 0.38em;
    color: #a7324f;
    text-transform: uppercase;
    margin-top: 4px;
}

.sub-banner--laser-tight .sub-banner-summary {
    margin: 2em 0;
    font-size: var(--fs-body);
    font-weight: 500;
    color: #a7324f;
    word-break: keep-all;
    line-height: var(--lh-normal);
    padding: 0;
}


/* ─────────────────────────────────────────────
   S02. 소개 아이콘 그리드 — .laser-icon-grid
────────────────────────────────────────────── */

.sub-laser-intro .sub-label-en {
  color: #a7324f;
}

.laser-icon-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-r);
  margin-top: var(--sp-3xl);
  max-width: 680px;
  margin-inline: auto;
}

.laser-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  text-align: center;
  background: #fff;
  border-radius: var(--radius-r);
  padding: var(--sp-2xl) var(--sp-xl);
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}

.laser-icon-item img {
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.laser-icon-item p {
  font-size: var(--fs-body);
  color: var(--txt-base);
  margin: 0;
  line-height: var(--lh-normal);
}


/* ─────────────────────────────────────────────
   S03. 이런 고민 — .sub-concern
────────────────────────────────────────────── */
.sub-concern {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

.sub-concern-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-concern-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-concern .sub-inner--relative {
  position: relative;
  z-index: 1;
}

.sub-concern .sub-title {
  color: #7d3028;
}

.concern-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-r) var(--sp-3xl);
  max-width: 800px;
  margin: 0 auto;
  list-style: none;
  padding: 0;
}

.concern-item {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  font-size: var(--fs-body);
  color: var(--txt-base);
  line-height: var(--lh-normal);
  padding: var(--sp-sm) 0;
  border-bottom: 1px solid rgba(62, 35, 97, 0.15);
}

.concern-item img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  object-fit: contain;
}


/* ─────────────────────────────────────────────
   S04. 질이완 생기는 이유 — .sub-reason
────────────────────────────────────────────── */
.sub-reason {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

.sub-reason-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-reason-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-reason .sub-inner--relative {
  position: relative;
  z-index: 1;
}

.sub-reason .sub-title, 
.sub-reason .sub-label-en {
  color: #a7324f;
}

.reason-tag-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-sm);
  margin-bottom: var(--sp-2xl);
}

.reason-tag {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--txt-base);
  font-size: var(--fs-body);
  width: 150px;
  height: 150px;
  border-radius: var(--radius-pill);
  border: 1px solid #ffeaed;
  background: rgba(255,255,255,0.6);
}

.reason-lead {
  text-align: center;
  font-size: var(--fs-lg);
  font-weight: 600;
  line-height: var(--lh-no);
  color: #a7324f;
  margin: 0 auto;
}

.reason-text {
  text-align: center;
  font-size: var(--fs-body);
  margin: 2% auto;
  line-height: var(--lh-normal);
}


/* ─────────────────────────────────────────────
   S05. 장비 소개 — .sub-device
────────────────────────────────────────────── */
.sub-device {
  padding: 0;
}

.device-block {
  padding: var(--sp-5xl) 0;
}

.device-block--ebium {
  background: #faf1ec; /* 연한 살구색 배경 */
}

.device-block--ebium .sub-title,
.device-block--ebium .sub-label-en {
  color: #6d2c4b;
}

.device-block--amos {
  background: #f4e6ea; /* 연한 핑크 배경 */
}

.device-block--amos .device-layout {
  flex-direction: row;
}

.device-block__inner {
  max-width: 1080px;
}

/* 좌우 분할 레이아웃 */
.device-layout {
  display: flex;
  align-items: center;
  gap: var(--sp-4xl);
  margin-top: var(--sp-3xl);
  text-align: center;
}

.device-layout--reverse {
  flex-direction: row-reverse;
}

.device-layout__img {
  flex: 0 0 360px;
  display: flex;
  justify-content: center;
}

.device-layout__img img {
  width: 100%;
  max-width: 393px;
  object-fit: contain;
  display: block;
}

.device-layout__text {
  flex: 1;
  text-align: center;
}

.device-layout__lead {
  font-size: var(--fs-md);
  color: #6d2c4b;
  margin: 0 0 var(--sp-r);
}

.device-layout__lead strong {
  font-weight: 600;
}

/* 장비명 알약 박스 */
.device-layout__badge {
  display: inline-block;
  background: #fff;
  color: #6d2c4b;
  font-size: var(--fs-2xl);
  font-weight: 700;
  padding: 16px 48px;
  border-radius: var(--radius-pill);
  margin-bottom: var(--sp-xl);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.device-layout__badge--amos {
  color: #b4356a;
}

.device-layout__desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  margin-bottom: var(--sp-r);
}

/* 효과 리스트: 흰 알약형 박스 */
.device-layout__list {
  list-style: none;
  padding: 0;
  margin: var(--sp-xl) 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.device-layout__list li {
  background: #fff;
  color: #6d2c4b;
  font-size: var(--fs-body);
  font-weight: 600;
  text-align: center;
  padding: 12px 20px;
  border-radius: var(--radius-pill);
  box-shadow: 0 1px 6px rgba(0,0,0,0.05);
}

.device-layout__lead--amos,
.device-layout__list--amos li {
  color: #b4356a;
}

.sub-needs--laser-tight .sub-title,
.sub-needs--laser-tight .sub-label-en {
  color: #f2becd;
}

.sub-needs--laser-tight .needs-item {
 border-color: #f2becd;
 border-radius: var(--radius-pill);
}

.sub-needs--laser-tight .needs-list li {
  justify-content: center;
  background-color: transparent;
}

/* ─────────────────────────────────────────────
   S07. Q&A 아코디언
────────────────────────────────────────────── */
.sub-qna {
  background: #fff;
  padding: var(--sp-5xl) 0;
}

.sub-qna-lazer .sub-title,
.sub-qna--vaginal-surgery .sub-title {
  font-weight: 700;
  font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl));
}

.sub-qna-lazer .sub-title,
.sub-qna-lazer .sub-label-en,
.sub-qna--vaginal-surgery .sub-title,
.sub-qna--vaginal-surgery .sub-label-en {
  color: #6d2c4b;
  line-height: var(--lh-normal);
}

.sub-qna-lazer .one-qna-li,
.sub-qna--vaginal-surgery .one-qna-li {
  margin-top: 0;
  gap: var(--sp-sm);
}

.one-qna-list {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: 760px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* 각 li = 카드형 독립 박스 */
.one-qna-li {
  border-radius: 6px;
  overflow: hidden;
}

/* Q 버튼 */
.one-qna-q {
  width: 100%;
  background: #f5f5f5;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  text-align: left;
  font-size: var(--fs-body);
  font-weight: 500;
  color: #6d2c4b;
  line-height: var(--lh-normal);
  transition: background 0.2s;
  border-radius: 6px;
}

.one-qna-q:hover {
  background: #eeecf2;
}

/* Q 뱃지 원형 */
.one-qna-q::before {
  content: 'Q';
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--main-color);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* 화살표 */
.one-qna-q::after {
  content: '';
  flex-shrink: 0;
  margin-left: auto;
  width: 9px;
  height: 9px;
  border-right: 2px solid #aaa;
  border-bottom: 2px solid #aaa;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.25s ease;
}

.one-qna-q[aria-expanded="true"]::after {
  transform: rotate(-135deg) translateY(-2px);
}

/* A 패널 */
.one-qna-a[hidden] {
  display: none;
}

.one-qna-a-inner {
  background: #f9f0f3;
  padding: 22px 24px 22px calc(30px + 14px + 24px); /* Q뱃지 너비 + gap + 좌패딩 맞춤 */
}

.one-qna-a-inner p {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  margin: 0;
}

/* 반응형 */
@media (max-width: 639px) {
  .one-qna-a-inner {
    padding: 18px 16px 18px 16px;
  }
  .sub-needs--laser-tight .needs-list li {
    justify-content: flex-start;
  }
}


/* ─────────────────────────────────────────────
   S06. 필요한 경우 — .sub-needs--laser
────────────────────────────────────────────── */
.sub-needs--laser .sub-needs-bg::after {
  background: rgba(50, 30, 20, 0.55);
}


/* ─────────────────────────────────────────────
   반응형
────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .sub-banner--laser-tight {
    height: auto;
    min-height: 400px;
  }

  .sub-banner--laser-tight .sub-banner-inner {
    width: 60%;
    padding: var(--sp-3xl) var(--sp-2xl);
  }

  .concern-list {
    grid-template-columns: 1fr;
    max-width: 480px;
  }

  .device-layout,
  .device-layout--reverse,
  .device-block--amos .device-layout {
    flex-direction: column;
    text-align: center;
  }

  .device-layout__text {
    text-align: center;
  }

  .device-layout__img {
    flex: 0 0 auto;
  }

  .device-layout__list li {
    max-width: 320px;
    margin-inline: auto;
  }
}

@media (max-width: 639px) {
  .sub-banner--laser-tight .sub-banner-inner {
    width: 100%;
    padding: var(--sp-2xl) var(--sp-r);
  }

  .sub-banner--laser-tight .sub-banner-title {
    font-size: 1.8rem;
  }

  /* 시술 정보 아이콘 바 — 좁은 화면에서 폭 제한 해제 */
  .sub-banner--laser-tight .sub-banner-info-img {
    max-width: 100%;
  }

  .laser-icon-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--sp-sm);
    max-width: 100%;
  }

  .laser-icon-item {
    padding: var(--sp-xl) var(--sp-r);
  }

  .laser-icon-item img {
    width: 48px;
    height: 48px;
  }

  /* 고민 리스트: 좌우 여백 확보 */
  .sub-concern .sub-inner--relative {
    padding-left: var(--sp-r);
    padding-right: var(--sp-r);
  }

  /* 이유 태그: 6개 줄바꿈 시 패딩/폰트 축소 */
  .reason-tag-row {
    gap: 8px;
    padding: 0 var(--sp-r);
  }

  .reason-tag {
    font-size: var(--fs-body);
    padding: 6px 16px;
    width: 100px;
    height: 100px;
    text-align: center;
  }

  .reason-lead,
  .reason-text {
    font-size: var(--fs-body);
  }

  .reason-lead {
    font-size: var(--fs-md);
  }

  /* 장비 소개 블록: PC 전용 5xl 패딩 축소 + 좌우 여백 */
  .device-block {
    padding: var(--sp-3xl) 0;
  }

  .device-block__inner {
    padding-left: var(--sp-r);
    padding-right: var(--sp-r);
  }

  .device-layout {
    gap: var(--sp-xl);
  }

  .sub-device .device-layout__img {
    flex: unset;
    width: 100%;
    order: 2;
  }

  .sub-device .device-layout__img img {
    max-width: 200px;
    margin: 0 auto;
  }

  /* 장비명 알약 뱃지 + 리드 문구 모바일 축소 */
  .device-layout__lead {
    font-size: var(--fs-body);
  }

  .device-layout__badge {
    font-size: var(--fs-lg);
    padding: 10px 24px;
  }

  .device-layout__desc {
    font-size: var(--fs-sm);
  }

  .device-layout__list li {
    font-size: var(--fs-sm);
    padding: 10px 16px;
  }

  /* 필요한 경우 리스트: 좌우 여백 확보 */
  .sub-needs-inner {
    padding-left: var(--sp-r);
    padding-right: var(--sp-r);
  }

  .needs-list {
    max-width: 100%;
  }

  /* QnA: 모바일 폰트 축소 */
  .one-qna-q {
    font-size: var(--fs-sm);
    padding: var(--sp-r);
  }

  .one-qna-a-inner p {
    font-size: var(--fs-sm);
  }
}

/* 태블릿 세로 구간 보강: 60% 폭이 좁아져 텍스트가 눌리는 것 방지 */
@media (min-width: 640px) and (max-width: 820px) {
  .sub-banner--laser-tight .sub-banner-inner {
    width: 80%;
  }
}


/* ============================================================
   1-2 이쁜이주사(질축소주사) 전용 스타일
   ============================================================ */

/* ─────────────────────────────────────────────
   S01. 배너 — .sub-banner--vaginal-filler
────────────────────────────────────────────── */
.sub-banner--vaginal-filler {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #f9d8e8;
}

.sub-banner--vaginal-filler .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--vaginal-filler .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.sub-banner--vaginal-filler .sub-banner-inner {
    position: relative;
    z-index: 1;
    width: 70%;
    max-width: 1200px;
    margin-left: 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 0 var(--sp-5xl);
    gap: var(--sp-xl);
}

.sub-banner--vaginal-filler .sub-banner-text {
  text-align: center;
}

.sub-banner--vaginal-filler .sub-banner-pretitle {
    font-size: var(--fs-body);
    color: var(--main-color);
    margin: 0;
    line-height: var(--lh-normal);
    font-weight: 500;
    letter-spacing: -0.01em;
}

.sub-banner--vaginal-filler .sub-banner-title {
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 700;
  color: var(--main-color);
  margin: 0;
  letter-spacing: -0.03em;
  line-height: var(--lh-normal);
}

.sub-banner--vaginal-filler .sub-banner-en {
    display: inline-block;
    margin-top: 4px;
    padding: 8px 24px;
    border-radius: 100px;
    background-color: var(--main-color);
    font-size: var(--fs-xs);
    letter-spacing: 0.3em;
    color: #fff;
    margin: 1em auto;
    font-weight: 400;
}

.sub-banner--vaginal-filler .sub-banner-summary {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--main-color);
  margin: 0;
}


/* ─────────────────────────────────────────────
   S02. 소개 아이콘 그리드 — .filler-icon-grid
────────────────────────────────────────────── */

.sub-intro-vaginal-filler .sub-label-en {
  color: var(--main-color);
}

.filler-icon-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-r);
  margin-top: var(--sp-3xl);
  max-width: 680px;
  margin-inline: auto;
  margin-top: var(--sp-3xl);
}

.filler-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  text-align: center;
  background: #fff;
  border-radius: var(--radius-r);
  padding: var(--sp-2xl) var(--sp-xl);
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}

.filler-icon-item img {
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.filler-icon-item p {
  font-size: var(--fs-body);
  color: var(--txt-base);
  margin: 0;
  line-height: var(--lh-normal);
}


/* ─────────────────────────────────────────────
   S03. 고민 — .sub-concern--filler
   concern-list--2col: 2컬럼 구분선형
────────────────────────────────────────────── */
.concern-list--2col {
  grid-template-columns: repeat(2, 1fr);
  max-width: 860px;
  column-gap: var(--sp-5xl);
}

.concern-list--2col .concern-item {
  border-bottom: 1px solid rgba(62, 35, 97, 0.15);
  padding: var(--sp-r) 0;
}

/* ─────────────────────────────────────────────
   S04. 이유 — .sub-reason--filler
────────────────────────────────────────────── */
.sub-reason--filler {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

.sub-reason--filler .sub-reason-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-reason--filler .sub-reason-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


/* ─────────────────────────────────────────────
   S05. 특징 — .sub-feature--filler
────────────────────────────────────────────── */
.sub-feature--filler {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

.sub-feature-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-feature-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 특징 뱃지 탭 */
.filler-badge-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-sm);
  margin-bottom: var(--sp-3xl);
}

.filler-badge {
  display: inline-block;
  background: var(--main-color);
  color: #fff;
  font-size: var(--fs-md);
  padding: 16px 48px;
  border-radius: var(--radius-pill);
  letter-spacing: -0.01em;
}

/* 특징 카드 2x2 */
.filler-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  background: rgba(255,255,255,0.25);
  border-radius: var(--radius-r);
  overflow: hidden;
}

.filler-feature-card {
  background: rgba(255,255,255,0.85);
  padding: var(--sp-3xl);
}

.filler-feature-num {
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--main-color);
  margin: 0 0 var(--sp-sm);
  letter-spacing: 0.05em;
}

.filler-feature-title {
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--main-color);
  margin: 0 0 var(--sp-r);
  letter-spacing: -0.02em;
}

.filler-feature-desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: #7a1472;
  margin: 0;
}

.sub-needs-vaginal-filler .sub-title,
.sub-needs-vaginal-filler .sub-label-en {
  color: #f2becd;
}

.sub-needs-vaginal-filler .needs-item {
  border-color: #f2becd;
}

.sub-qna-vaginal-filler .sub-title {
  font-weight: 700;
  font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl));
}

.sub-qna-vaginal-filler .sub-title,
.sub-qna-vaginal-filler .sub-label-en {
  color: #6d2c4b;
  line-height: var(--lh-normal);
}

.sub-needs-vaginal-filler .needs-list {
  max-width: 640px;
}

.sub-needs-vaginal-filler .needs-list li {
  justify-content: center;
  border-radius: var(--radius-pill);
}

.sub-qna-vaginal-filler .one-qna-li {
  margin-top: 0;
  gap: var(--sp-sm);
}

/* ─────────────────────────────────────────────
   반응형
────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .sub-banner--vaginal-filler .sub-banner-inner {
    width: 60%;
    padding: var(--sp-3xl) var(--sp-2xl);
  }

  .concern-list--2col {
    grid-template-columns: 1fr;
  }

  .concern-list--2col .concern-item:nth-last-child(-n+2) {
    border-bottom: 1px solid rgba(62, 35, 97, 0.15);
  }

  .concern-list--2col .concern-item:last-child {
    border-bottom: none;
  }

  .filler-feature-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 639px) {
  .sub-banner--vaginal-filler .sub-banner-inner {
    width: 100%;
    padding: var(--sp-2xl) var(--sp-r);
  }

  .filler-icon-grid {
    grid-template-columns: repeat(2, 1fr);
    max-width: 100%;
  }

  .filler-badge-row {
    gap: 8px;
  }

  .filler-badge {
    font-size: var(--fs-sm);
    padding: 8px 16px;
  }

  .filler-feature-card {
    padding: var(--sp-2xl) var(--sp-r);
  }
}

/* ============================================================
   1-3 이쁜이수술(질축소수술) 전용 스타일
   ============================================================ */

/* ─────────────────────────────────────────────
   S01. 배너 — .sub-banner--vaginal-surgery
────────────────────────────────────────────── */
.sub-banner--vaginal-surgery {
  position: relative;
  overflow: hidden;
  height: 400px;
  min-height: 500px;
  background: #fce8e4;
}

.sub-banner--vaginal-surgery .sub-banner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-banner--vaginal-surgery .sub-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  display: block;
}

.sub-banner--vaginal-surgery .sub-banner-inner {
    position: relative;
    z-index: 1;
    width: 70%;
    max-width: 1200px;
    margin-left: 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 0 var(--sp-5xl);
    gap: var(--sp-xl);
}

.sub-banner--vaginal-surgery .sub-banner-text {
  text-align: center;
}

.sub-banner--vaginal-surgery .sub-banner-pretitle {
    font-size: var(--fs-body);
    color: #fb6f69;
    margin: 0;
    line-height: var(--lh-normal);
    font-weight: 500;
    letter-spacing: -0.01em;
}

.sub-banner--vaginal-surgery .sub-banner-title {
    font-size: clamp(1.8rem, 3.5vw, 2.8rem);
    font-weight: 700;
    color: #fb6f69;
    margin: 0;
    letter-spacing: -0.03em;
    line-height: var(--lh-normal);
}

.sub-banner--vaginal-surgery .sub-banner-en {
    display: inline-block;
    margin-top: 4px;
    padding: 8px 24px;
    border-radius: 100px;
    background-color: #fb6f69;
    font-size: var(--fs-xs);
    letter-spacing: 0.3em;
    color: #fff;
    margin: 1em auto;
    font-weight: 400;
}

.sub-banner--vaginal-surgery .sub-banner-summary {
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: #fb6f69;
    margin: 0;
}

.sub-intro--vaginal-surgery .sub-label-en {
      color: #fb6f69;
}


/* ─────────────────────────────────────────────
   S05. 질 축소 수술 효과 — .sub-surgery-effect
────────────────────────────────────────────── */
.sub-surgery-effect {
  background: #fff;
  padding: var(--sp-5xl) 0;
}

.sub-surgery-effect .sub-title {
  color: #ff8381;
}

.surgery-before-after {
  display: flex;
  justify-content: center;
  margin-bottom: var(--sp-2xl);
}

.surgery-before-after img {
  max-width: 710px;
  width: 100%;
  display: block;
}

.surgery-effect-desc {
  text-align: center;
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  margin: 0 auto;
}


/* ─────────────────────────────────────────────
   S06. 확실한 탄력 효과 — .sub-elastic
────────────────────────────────────────────── */
.sub-elastic {
  position: relative;
  overflow: hidden;
  padding: var(--sp-5xl) 0;
}

.sub-elastic-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.sub-elastic-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sub-title--elastic {
  font-size: clamp(var(--fs-2xl), 3vw, var(--fs-3xl));
  font-weight: 400;
  color: #f4a8a6;
  margin: 0 0 var(--sp-sm);
  letter-spacing: -0.03em;
}

.sub-title--elastic strong {
  font-weight: 700;
  color: #ff8381;
}

.sub-elastic-sub {
  font-size: var(--fs-lg);
  color: var(--txt-base);
  margin: 0 0 var(--sp-3xl);
}

/* 아이콘 3개 가로 배열 */
.elastic-icon-row {
  display: flex;
  justify-content: center;
  gap: var(--sp-4xl);
  margin-bottom: var(--sp-3xl);
  flex-wrap: wrap;
}

.elastic-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-r);
  text-align: center;
  flex: 0 0 200px;
}

.elastic-icon-circle {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/*
  스프라이트 시트: 1_3.이쁜이수술_효과img2.png
  가로로 동일한 너비의 아이콘 3개가 나열된 이미지.
  컨테이너 너비를 아이콘 1개 너비로 보고, 전체 이미지를 300%로 키운 뒤
  position-x를 0% / 50% / 100%로 이동하면 실제 파일 px 크기와 무관하게
  항상 정확히 1/3씩 보여짐.
*/
.elastic-icon-sprite {
    display: block;
    width: 100px;
    height: 100px;
    background-image: url('/wp-content/uploads/2026/06/1_3.이쁜이수술_효과img2.png');
    background-repeat: no-repeat;
    background-size: 450% 100%;
}

.elastic-icon-sprite--1 { background-position: 0% center; }
.elastic-icon-sprite--2 { background-position: 50% center; }
.elastic-icon-sprite--3 { background-position: 100% center; }

.elastic-icon-title {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: var(--txt-base);
  margin: 0;
}

.elastic-icon-title--active {
  color: #ff8381;
}

.elastic-icon-desc {
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  color: var(--txt-base);
  margin: 0;
}

/* 효과 뱃지 */
.elastic-badge-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-sm);
}

.elastic-badge-row {
  display: flex;
  justify-content: center;
  gap: var(--sp-sm);
  flex-wrap: wrap;
}

.elastic-badge {
  display: inline-block;
  background: #fb6f69;
  color: #fff;
  font-size: var(--fs-body);
  padding: 16px 48px;
  border-radius: var(--radius-pill);
  letter-spacing: -0.01em;
}

.sub-needs--vaginal-surgery .sub-title,
.sub-needs--vaginal-surgery .sub-label-en {
  color: #f2becd;
}

.sub-needs--vaginal-surgery .needs-list li {
  justify-content: center;
  border-color: #f2becd;
  border-radius: var(--radius-pill);
  background-color: transparent;
  text-align: center;
}

/* ─────────────────────────────────────────────
   반응형
────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .sub-banner--vaginal-surgery .sub-banner-inner {
    width: 60%;
    padding: var(--sp-3xl) var(--sp-2xl);
  }

  .elastic-icon-row {
    gap: var(--sp-r);
  }
}

@media (max-width: 639px) {
  .sub-banner--vaginal-surgery .sub-banner-inner {
    width: 100%;
    padding: var(--sp-2xl) var(--sp-r);
  }

  .sub-title--elastic {
    font-size: clamp(var(--fs-xl), 3.5vw, var(--fs-3xl));
  }

  .sub-elastic-sub {
    font-size: var(--fs-md);
  }

  .elastic-icon-item {
    flex: 0 0 140px;
  }

  .elastic-icon-circle {
    width: 90px;
    height: 90px;
  }

  .elastic-badge {
    font-size: var(--fs-sm);
    padding: 8px 16px;
  }
}