/* 서비스상세 D계열(04·09·14·19) — 진단형 구성 · 반응형 SVG · 체크리스트 */
:root {
  --color-primary: #303B3B;
  --color-secondary: #466B60;
  --color-accent: #466B60;
  --color-bg: #F4F7F7;
  --color-surface: #FFFFFF;
  --color-text: #1D2424;
  --color-text-muted: #52605D;
  --color-border: rgba(48, 59, 59, 0.16);
  --font-display: 'Pretendard', sans-serif;
  --font-body: 'Noto Sans KR', sans-serif;
}
.kw-diagnose { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-4); }
.kw-diagnose__box { background: var(--color-surface); border: 1px solid var(--color-border); border-left: 6px solid var(--color-accent); border-radius: var(--radius-md); padding: var(--space-4); }
.kw-diagnose__box h3 { font-family: var(--font-display); font-size: var(--fs-base); margin-bottom: var(--space-2); }
.kw-checklist { display: grid; gap: var(--space-2); list-style: none; padding: 0; }
.kw-checklist li { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-3); background: var(--color-bg); border-radius: var(--radius-md); }
.kw-checklist li::before { content: '\2713'; color: var(--color-accent); font-weight: 700; }
.kw-imgset { display: flex; justify-content: center; align-items: flex-end; gap: var(--space-4); flex-wrap: wrap; margin: 0 auto; max-width: 760px; }
.kw-imgset figure { margin: 0; width: 260px; text-align: center; }
.kw-imgset img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--radius-md); display: block; }
.kw-imgset figcaption { margin-top: var(--space-2); font-size: var(--fs-sm); letter-spacing: 0.1em; color: var(--color-accent); font-weight: 600; }
