/* 충치치료 지면 전용 레이어 — 치수는 시안 프레임(1920 폭) 값을 그대로 박는다.
   공통 레이어(newn-figma-2nd.css)는 고치지 않는다. 히어로는 공통 클래스를 그대로 쓴다. */

/* ── 섹션 바탕과 상하 여백 ─────────────────── */
.fg14c-sec { position: relative; width: 100%; }
.fg14c-sec--def1  { background: #ffffff; padding: 170px 0 145px; }
.fg14c-sec--kinds { background: #f5f5f5; padding: 130px 0 174px; }
.fg14c-sec--def2  { background: #ffffff; padding: 140px 0 140px; }
.fg14c-sec--adv   { background: #f5f5f5; padding: 130px 0 236px; }

/* ── 섹션 머리(라벨 + 제목 + 리드) ─────────── */
.fg14c-head { display: flex; flex-direction: column; gap: 16px; }
.fg14c-head__label {
  margin: 0;
  font-size: 12px;
  line-height: 14.32px;
  font-weight: 600;
  letter-spacing: 3px;
  color: #6b6b6b;
}
.fg14c-head__body { display: flex; flex-direction: column; gap: 5px; }
.fg14c-head__title {
  margin: 0;
  font-size: 40px !important;
  line-height: 52px !important;
  font-weight: 600 !important;
  letter-spacing: -0.6px;
  color: #0a0a0a;
}
.fg14c-head__lead {
  margin: 0;
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
  letter-spacing: -0.27px;
  color: #333333;
}

/* ── 본문 큰 사진 ──────────────────────────
   시안은 고정 높이지만 px 로 박으면 좁은 창에서 비율이 바뀌어 좌우가 잘린다.
   비율로 고정해 어느 폭에서도 시안 구도를 지킨다. */
.fg14c-figure { display: block; width: 100%; height: auto; object-fit: cover; }
.fg14c-figure--def1 { aspect-ratio: 1200 / 450; object-position: 50% 50%; margin-top: 60px; }
.fg14c-figure--def2 { aspect-ratio: 1200 / 400; object-position: 50% 0.1%; margin-top: 70px; }

/* ── 치료 종류 카드(사진 + 글) ─────────────── */
.fg14c-cards { display: flex; flex-direction: column; gap: 14px; margin-top: 60px; }
.fg14c-card { display: flex; align-items: stretch; }
.fg14c-card__img {
  flex: none;
  width: 340px;
  height: 200px;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
}
.fg14c-card__body {
  flex: 1 1 auto;
  min-width: 0;
  padding: 22px 30px;
  background: #ffffff;
  border: 1px solid #e4e4e4;
}
.fg14c-card__title {
  margin: 0;
  font-size: 18px !important;
  line-height: 30px !important;
  font-weight: 600 !important;
  letter-spacing: -0.255px;
  color: #0a0a0a;
}
.fg14c-card__desc {
  margin: 0;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  letter-spacing: 0;
  color: #6b6b6b;
}

/* ── 장점 카드(글만) ───────────────────────── */
.fg14c-adv { display: flex; flex-direction: column; gap: 14px; margin-top: 60px; }
.fg14c-adv__item {
  padding: 26px 36px;
  background: #ffffff;
  border: 1px solid #e4e4e4;
}
.fg14c-adv__title {
  margin: 0;
  font-size: 18px !important;
  line-height: 30px !important;
  font-weight: 600 !important;
  letter-spacing: -0.255px;
  color: #0a0a0a;
}
.fg14c-adv__desc {
  margin: 0;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  letter-spacing: 0;
  color: #6b6b6b;
}

/* ── 좁은 화면 ─────────────────────────────
   사진이 주인공이 되도록 글자를 줄이고 카드를 세로로 쌓는다. */
@media (max-width: 767px) {
  .fg14c-sec--def1  { padding: 56px 0 48px; }
  .fg14c-sec--kinds { padding: 48px 0 56px; }
  .fg14c-sec--def2  { padding: 48px 0 48px; }
  .fg14c-sec--adv   { padding: 48px 0 56px; }

  .fg14c-head { gap: 10px; }
  /* 좁은 화면에서도 12px 아래로 내리지 않는다 — 작은 글자 하한선 */
  .fg14c-head__label { font-size: 12px; letter-spacing: 2px; }
  .fg14c-head__title { font-size: 24px !important; line-height: 34px !important; letter-spacing: -0.4px; }
  .fg14c-head__lead { font-size: 15px; line-height: 25px; }

  .fg14c-figure--def1, .fg14c-figure--def2 { margin-top: 24px; }

  .fg14c-cards, .fg14c-adv { margin-top: 24px; gap: 10px; }
  .fg14c-card { flex-direction: column; }
  .fg14c-card__img { width: 100%; height: auto; aspect-ratio: 340 / 200; }
  .fg14c-card__body { padding: 18px 20px; }
  .fg14c-card__title, .fg14c-adv__title { font-size: 16px !important; line-height: 26px !important; }
  .fg14c-card__desc, .fg14c-adv__desc { font-size: 15px; line-height: 25px; }
  .fg14c-adv__item { padding: 18px 20px; }
}