/* nyw-fig-wisdomtooth.css — 사랑니발치 지면 전용. 시안 프레임 1920x6408 의 px 값을 그대로 옮긴 시트.
 *
 * 이 파일의 숫자는 시안에서 뽑은 값이고 손으로 고르지 않았다.
 * 이 지면만 링크한다 — 다른 지면이 함께 쓰는 시트는 건드리지 않는다.
 * 1280px 미만은 시안에 모바일 프레임이 없어 데스크톱 값을 내리지 않고 따로 짠다.
 */

.nywt {
  --wt-bg: #ffffff;
  --wt-bg2: #f5f5f5;
  --wt-ink: #0a0a0a;
  --wt-ink70: rgba(10, 10, 10, 0.7);
  --wt-sub: #3d3d3d;
  --wt-eyebrow: #707070;
  --wt-muted: #7e7e7e;
  --wt-crumb: #8f8f8f;
  --wt-line: #e4e4e4;
  --wt-line2: #e8e8e8;
  --wt-font: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-family: var(--wt-font);
  color: var(--wt-ink);
}
.nywt *,
.nywt *::before,
.nywt *::after { box-sizing: border-box; }
:where(.nywt) :where(p, h1, h2, h3) { margin: 0; font-family: var(--wt-font); }
.nywt a { color: inherit; text-decoration: none; }
.nywt img { display: block; max-width: 100%; }

/* ── 섹션 골격 ─────────────────────────────────────────────── */
.nywt-s {
  width: 100%;
  background: var(--wt-bg);
  overflow: hidden;
}
.nywt-s--gray { background: var(--wt-bg2); }
.nywt-in1200,
.nywt-in1080 {
  margin-inline: auto;
  width: 100%;
}
.nywt-in1200 { max-width: 1200px; }
.nywt-in1080 { max-width: 1080px; }

/* ── 공통 타이포 ───────────────────────────────────────────── */
/* 시안이 이 줄에 대문자 변환을 걸어 둔다(textCase UPPER) */
.nywt-kicker {
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
  line-height: 15.5137px;
  letter-spacing: 2.077px;
  color: var(--wt-eyebrow);
}
.nywt-kicker--hero {
  letter-spacing: 2px;
  width: fit-content;
}
.nywt-h1 {
  font-size: 54px;
  font-weight: 600;
  line-height: 65.97px;
  letter-spacing: -1px;
  color: var(--wt-ink);
  width: fit-content;
}
.nywt-h2 {
  font-size: 40px;
  font-weight: 400;
  line-height: 47.7344px;
  letter-spacing: -2px;
  color: var(--wt-ink);
  width: fit-content;
}
.nywt-h3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 28px;
  color: var(--wt-ink);
}
.nywt-lead18 {
  font-size: 18px;
  font-weight: 400;
  line-height: 21.4805px;
  color: var(--wt-sub);
  width: fit-content;
}
.nywt-body22 {
  font-size: 22px;
  font-weight: 300;
  line-height: 34px;
  color: var(--wt-ink70);
}
.nywt-lead22 {
  font-size: 22px;
  font-weight: 300;
  line-height: 34px;
  color: var(--wt-ink70);
  width: fit-content;
}
/* 시안이 이 리드에 두 줄 높이를 잡아 둔다 — 문장이 한 줄이어도 칸은 두 줄이다 */
.nywt-lead22--full { width: 100%; min-height: 68px; }
.nywt-blk7--2line { min-height: 68px; }

/* 제목 묶음 — 시안이 칸마다 폭을 다르게 잡는다(글자폭 HUG vs 단 채움) */
.nywt-blk25 { display: block; }
.nywt-blk25 > .nywt-h2 { margin-top: 18px; }
.nywt-blk25--hug { width: fit-content; }

.nywt-blk26 > * + * { margin-top: 14px; }

/* ── 1) 히어로 + 대표 사진 (프레임 1028h) ───────────────────── */
.nywt-s1 { padding-bottom: 97px; }
.nywt-hero {
  height: 420px;
  padding-top: 100px;
  background: var(--wt-bg);
}
.nywt-crumb {
  display: flex;
  align-items: center;
  gap: 7px;
  height: 15px;
  font-size: 13px;
  font-weight: 400;
  line-height: 15.5137px;
  color: var(--wt-crumb);
}
.nywt-crumb b {
  font-weight: 500;
  color: var(--wt-ink);
}
.nywt-head { margin-top: 40px; }
.nywt-head > * + * { margin-top: 10px; }
.nywt-fig1200 {
  margin: 78px auto 0;
  width: 100%;
  max-width: 1200px;
  height: 433px;
  border-radius: 2px;
  overflow: hidden;
}
.nywt-fig1200 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ── 2) 사랑니에 대해 알아보기 (프레임 1461h) ────────────────── */
.nywt-s2 { padding: 140px 0; }
.nywt-blk136 { margin-top: 60px; }
.nywt-blk136 > * + * { margin-top: 26px; }
.nywt-cards > * + * { margin-top: 12px; }
.nywt-card72 {
  min-height: 72px;
  padding: 22px 30px;
  background: var(--wt-bg);
  border: 1px solid var(--wt-line);
}
.nywt-card72 > p {
  font-size: 17px;
  font-weight: 600;
  line-height: 26px;
  color: var(--wt-ink);
}
.nywt-blk132 { margin-top: 60px; }
.nywt-fig1080 {
  margin: 0;
  width: 100%;
  height: 330px;
  overflow: hidden;
}
.nywt-fig1080 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nywt-note {
  min-height: 122px;
  padding: 24px 36px;
  background: var(--wt-bg2);
}
.nywt-note__t {
  font-size: 17px;
  font-weight: 600;
  line-height: 28px;
  color: var(--wt-ink);
}
/* 시안이 이 안내문에 두 줄 높이를 잡아 둔다 */
.nywt-note__d {
  margin-top: 6px;
  min-height: 40px;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: var(--wt-muted);
}

/* ── 3) 사랑니 발치 대상 (프레임 599h) ──────────────────────── */
.nywt-s3 { padding: 140px 0; }
.nywt-blk62 { margin-top: 50px; }
.nywt-blk62 > * + * { margin-top: 12px; }
.nywt-row2 {
  display: flex;
  gap: 12px;
}
.nywt-row2 > * { flex: 1 1 0; }
.nywt-card88 {
  min-height: 88px;
  padding: 30px;
  background: var(--wt-bg);
  border: 1px solid var(--wt-line);
}
.nywt-card88 > p {
  font-size: 17px;
  font-weight: 600;
  line-height: 26px;
  color: var(--wt-ink);
}

/* ── 4) 유형별 실제 사례 (프레임 989h) ──────────────────────── */
.nywt-s4 { padding: 140px 0; }
.nywt-blk7 { width: 100%; }
.nywt-case {
  margin-top: 70px;
  background: var(--wt-bg);
  border: 1px solid var(--wt-line);
}
.nywt-case + .nywt-case { margin-top: 26px; }
.nywt-case__imgs {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 180px;
}
.nywt-case__img {
  position: relative;
  flex: 1 1 0;
  height: 180px;
  overflow: hidden;
}
/* 시안이 한 장의 사례 시트에서 잘라 쓰는 구간 — 잘라내기 값은 시안 imageTransform 에서 파생한다.
   퍼센트라 폭이 줄어도 같은 자리를 보여준다. */
.nywt-case__img img {
  position: absolute;
  max-width: none;
  width: 366.505%;
  height: 2228.125%;
  left: var(--wt-cx);
  top: var(--wt-cy);
}
.nywt-case__cap {
  padding: 20px 18px;
}
.nywt-case__cap > p {
  font-size: 17px;
  font-weight: 600;
  line-height: 20.2871px;
  color: var(--wt-ink);
}

/* ── 5) 시술 과정 (프레임 1147h) ────────────────────────────── */
.nywt-s5 { padding: 140px 0 162px; }
.nywt-steps { margin-top: 70px; }
.nywt-steps > * + * { margin-top: 12px; }
.nywt-step {
  min-height: 114px;
  padding: 30px;
  background: var(--wt-bg);
  border: 1px solid var(--wt-line);
}
.nywt-step--tight { min-height: 108px; }
.nywt-step__t {
  font-size: 17px;
  font-weight: 600;
  line-height: 26px;
  color: var(--wt-ink);
}
.nywt-step__t--tight { line-height: 20.2871px; }
.nywt-step__d {
  margin-top: 4px;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--wt-muted);
}

/* ── 6) 함께 보면 좋은 진료 (프레임 550h) ───────────────────── */
.nywt-s6 { padding: 140px 0 217px; }
.nywt-rel { margin-top: 38px; }
.nywt-rel__row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.nywt-rel__item {
  display: flex;
  align-items: center;
  flex: 1 1 0;
  min-height: 74px;
  padding: 26px 24px;
  background: var(--wt-bg);
  border: 1px solid var(--wt-line2);
}
.nywt-rel__item span {
  display: block;
  font-size: 17px;
  font-weight: 600;
  line-height: 20.2871px;
  color: var(--wt-ink);
  white-space: pre;
}

/* ── 1280px 미만 — 시안에 모바일 프레임이 없다. 흐름으로 되돌린다 ── */
@media (max-width: 1279px) {
  .nywt-in1200,
  .nywt-in1080 { padding-inline: 20px; }
  .nywt-s1 { padding-bottom: 48px; }
  .nywt-hero {
    height: auto;
    padding-top: 40px;
    padding-bottom: 32px;
  }
  .nywt-h1 { font-size: 34px; line-height: 1.24; letter-spacing: -0.6px; }
  .nywt-h2 { font-size: 26px; line-height: 1.3; letter-spacing: -1px; width: 100%; }
  .nywt-h3 { font-size: 19px; line-height: 1.4; }
  .nywt-lead18 { font-size: 15.5px; line-height: 1.6; width: 100%; }
  .nywt-body22,
  .nywt-lead22 { font-size: 16px; line-height: 1.7; width: 100%; }
  .nywt-lead22--full,
  .nywt-blk7--2line { min-height: 0; }
  .nywt-blk25--hug { width: 100%; }
  .nywt-fig1200 { margin-top: 32px; height: auto; aspect-ratio: 1200 / 433; }
  .nywt-fig1080 { height: auto; aspect-ratio: 1080 / 330; }
  .nywt-s2,
  .nywt-s3,
  .nywt-s4 { padding: 56px 0; }
  .nywt-s5 { padding: 56px 0 64px; }
  .nywt-s6 { padding: 56px 0 72px; }
  .nywt-blk136,
  .nywt-blk132 { margin-top: 36px; }
  .nywt-blk62,
  .nywt-rel { margin-top: 28px; }
  .nywt-case { margin-top: 36px; }
  .nywt-steps { margin-top: 36px; }
  .nywt-card72,
  .nywt-card88,
  .nywt-step { min-height: 0; padding: 18px 20px; }
  .nywt-note { min-height: 0; padding: 20px; }
  .nywt-note__d { min-height: 0; }
  .nywt-card72 > p,
  .nywt-card88 > p,
  .nywt-step__t,
  .nywt-step__t--tight { font-size: 15.5px; line-height: 1.5; }
  .nywt-row2 { flex-direction: column; }
  .nywt-case__imgs { height: auto; flex-direction: column; }
  .nywt-case__img { width: 100%; height: 120px; }
  .nywt-rel__row { flex-wrap: wrap; }
  .nywt-rel__item { flex: 1 1 calc(50% - 5px); min-height: 60px; padding: 18px 16px; }
  .nywt-rel__item span { font-size: 15px; white-space: normal; }
}