/* ── 뉴트럴 + 블루 / 테두리 없는 에디토리얼 레이아웃 ── */
:root{
  --ink:      #1A1A1F;
  --ink-soft: #3E3E48;
  --ash:      #6A6A76;
  --bg:       #FFFFFF;
  --soft:     #F6F7F9;
  --hair:     #E7E9ED;
  --blue:     #1A56DB;
  --blue-dk:  #1345B4;

  --wrap: 720px;
  --sans: 'Pretendard Variable', -apple-system, BlinkMacSystemFont, system-ui, 'Malgun Gothic', sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:20px;
  font-weight:450;
  line-height:1.9;
  letter-spacing:.004em;
  word-break:keep-all;
  overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;
}

.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 20px; }

strong,b,h1,h2,h3,.cta,.facts dt,.faq summary,.tbl th{ letter-spacing:.012em; }

/* ── 상단 : 흰 배경 · 가운데 정렬 ────────────────────── */
.topbar{
  background:var(--bg);
  border:0;
  padding:28px 0 14px;
}
.topbar h1{
  margin:0; text-align:center;
  font-size:clamp(27px,7vw,34px);
  font-weight:800; line-height:1.45;
}
.topbar h1 a{
  color:inherit; text-decoration:none;
}
.topbar h1 a:hover{
  color:var(--blue);
}

/* ── 광고 : 테두리 없이 여백으로만 분리 ──────────────── */
.ad{
  margin:24px 0;
  text-align:center;
  line-height:0;          /* 인라인 요소 하단 여백 제거 */
}
.ad ins{ display:block; }

/* 광고가 채워지지 않으면 자리까지 접어 흰 공백 제거 */
ins.adsbygoogle[data-ad-status="unfilled"]{ display:none !important; }
.ad:empty{ display:none; margin:0; }

/* ── 이미지 ──────────────────────────────────────────── */
.poster{ margin:32px 0; }
.poster img{ display:block; width:100%; height:auto; border-radius:6px; }

/* 링크가 걸린 이미지 — 누를 수 있다는 신호 */
.poster.linked a{
  display:block;
  border-radius:6px;
  overflow:hidden;
  transition:opacity .15s ease, transform .15s ease;
}
.poster.linked a:hover,
.poster.linked a:focus-visible{
  opacity:.92;
  transform:translateY(-2px);
}

/* ── 본문 ────────────────────────────────────────────── */
main{ padding-top:4px; }
p{ margin:0 0 24px; }
.lead{ font-size:21px; }
.lead strong{ font-weight:800; }

h2{
  margin:52px 0 18px;
  font-size:28px; font-weight:800; line-height:1.5;
}
h3{ margin:36px 0 12px; font-size:23px; font-weight:800; }

a{ color:var(--blue); }

/* ── 정의형 정보 목록 (테두리 없음) ──────────────────── */
.facts{ margin:30px 0; }
.facts dl{ margin:0; }
.facts .row{
  display:flex; align-items:baseline; gap:18px;
  padding:15px 2px;
  border-bottom:1px solid var(--hair);
}
.facts .row:first-child{ border-top:1px solid var(--hair); }
.facts dt{ flex:0 0 104px; font-size:18px; font-weight:700; color:var(--ash); }
.facts dd{ margin:0; font-size:20px; font-weight:600; line-height:1.6; }

/* ── CTA : 애드센스 톤과 어울리는 블루 ───────────────── */
.cta-zone{ margin:30px 0 24px; }
.cta{
  display:block; width:100%;
  padding:21px 20px;
  background:var(--blue); color:#fff;
  border:0; border-radius:8px;
  font-size:23px; font-weight:800; line-height:1.5;
  text-align:center; text-decoration:none;
  transition:background .15s ease;
}
.cta:hover,.cta:focus-visible{ background:var(--blue-dk); color:#fff; }
.cta.alt{ background:var(--ink); }
.cta.alt:hover{ background:#000; }
.cta.alt em{ font-style:normal; color:#fff; }

/* ── 표 (테두리 없음) ────────────────────────────────── */
.tbl{
  width:100%; margin:26px 0;
  border-collapse:collapse; border:0;
  font-size:20px;
}
.tbl th,.tbl td{
  padding:15px 12px; text-align:left; line-height:1.7;
  border:0; border-bottom:1px solid var(--hair);
}
.tbl thead th{
  background:var(--soft); color:var(--ink);
  font-size:18px; font-weight:700;
}
.tbl tbody th{
  width:74px; text-align:center;
  font-size:20px; font-weight:800; color:var(--blue);
}
.tbl td strong{ font-weight:800; }

/* ── 핵심 요약 (AI 브리핑·검색 스니펫 대상) ──────────── */
.summary{
  margin:28px 0 30px; padding:22px 24px;
  background:var(--soft);
  border-radius:8px;
  border-left:5px solid var(--blue);
}
.summary h2{
  margin:0 0 12px; padding:0;
  font-size:20px; font-weight:800;
}
.summary p{ margin:0 0 12px; font-size:19px; }
.summary p:last-child{ margin-bottom:0; }
.summary ul{ margin:0; padding-left:22px; }
.summary li{ margin:7px 0; font-size:19px; }

/* ── 강조 블록 (테두리 대신 옅은 면) ─────────────────── */
.note{
  margin:30px 0; padding:22px 24px;
  background:var(--soft);
  border:0; border-radius:8px;
  font-size:20px;
}
.note p:last-child{ margin-bottom:0; }
.note b{ font-weight:800; }

/* ── FAQ (테두리 없음) ───────────────────────────────── */
.faq{
  margin:0; background:none; border:0;
  border-bottom:1px solid var(--hair);
}
.faq:first-of-type{ border-top:1px solid var(--hair); }
.faq summary{
  position:relative; padding:20px 40px 20px 2px;
  font-size:20px; font-weight:700; line-height:1.6;
  cursor:pointer; list-style:none;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+"; position:absolute; right:8px; top:18px;
  font-size:24px; font-weight:400; color:var(--ash);
}
.faq[open] summary::after{ content:"\2212"; }
.faq .a{ padding:0 8px 22px 2px; font-size:19px; color:var(--ink-soft); }

/* ── 푸터 ────────────────────────────────────────────── */
footer{
  margin-top:40px; padding:26px 0 30px;
  background:var(--soft); color:var(--ash);
  font-size:16px; line-height:1.85;
}
footer .fnav{ margin:0 0 12px; font-size:17px; }
footer .fnav a{ color:var(--blue); text-decoration:none; margin-right:20px; font-weight:600; }
footer .fnav a:hover{ text-decoration:underline; }
footer details{ margin:9px 0; }
footer summary{ cursor:pointer; color:var(--ink-soft); font-weight:600; font-size:17px; }
footer .biz{ margin-top:14px; }
footer .disc{ margin-top:14px; padding-top:12px; border-top:1px solid var(--hair); font-size:15px; }

/* 본문 끝과 푸터 사이 여백 정리 */
main > :last-child{ margin-bottom:0; }
main .cta-zone:last-child{ margin-bottom:8px; }

@media (max-width:430px){
  body{ font-size:19px; }
  .facts dt{ flex:0 0 88px; font-size:17px; }
  .tbl{ font-size:19px; }
  .tbl th,.tbl td{ padding:13px 8px; }
  .cta{ font-size:21px; padding:19px 14px; }
  h2{ font-size:25px; }
  .ad{ margin:18px 0; }
  .cta-zone{ margin:26px 0 20px; }
  footer{ margin-top:32px; padding:22px 0 26px; }
  h2{ margin:40px 0 16px; }
}

@media (prefers-reduced-motion:reduce){ *{ transition:none !important; } }

/* ══════════════════════════════════════════════════════
   원페이지(검색 색인) 전용 — 클릭 유도형 CTA
   파워링크 페이지는 기존 파란 버튼 그대로 유지됩니다
   ══════════════════════════════════════════════════════ */
:root{
  --cta1: #FF6B3D;
  --cta2: #E01B24;
  --cta-sh: rgba(224,27,36,.30);
}

.onepage .cta{
  position:relative;
  overflow:hidden;
  background:linear-gradient(100deg, var(--cta1) 0%, var(--cta2) 62%, var(--cta2) 100%);
  border-radius:999px;
  padding:23px 46px 23px 26px;
  box-shadow:0 6px 18px var(--cta-sh);
  letter-spacing:.015em;
}
.onepage .cta:hover,
.onepage .cta:focus-visible{
  background:linear-gradient(100deg, var(--cta2) 0%, var(--cta2) 60%, #B8151C 100%);
  box-shadow:0 8px 22px var(--cta-sh);
  transform:translateY(-1px);
}
.onepage .cta:active{ transform:translateY(1px); box-shadow:0 3px 10px var(--cta-sh); }

/* 오른쪽 화살표 — 다음 단계라는 신호 */
.onepage .cta::after{
  content:"";
  position:absolute; right:24px; top:50%;
  width:11px; height:11px;
  margin-top:-6px;
  border-top:3px solid #fff;
  border-right:3px solid #fff;
  transform:rotate(45deg);
}

/* 빛 흐름 — 시선 유도 (움직임 최소화 설정 시 자동 해제) */
.onepage .cta::before{
  content:"";
  position:absolute; top:0; bottom:0; left:-60%;
  width:45%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.42), transparent);
  transform:skewX(-18deg);
  animation:ctaShine 3.6s ease-in-out infinite;
}
@keyframes ctaShine{
  0%, 62% { left:-60%; }
  100%    { left:130%; }
}

.onepage .cta.alt{
  background:linear-gradient(100deg, var(--cta1) 0%, var(--cta2) 62%, var(--cta2) 100%);
}

/* 버튼 아래 보조 문구 */
.onepage .cta-hint{
  margin:10px 0 0;
  font-size:15px; color:var(--ash); text-align:center;
}

@media (max-width:430px){
  .onepage .cta{ padding:21px 40px 21px 20px; }
  .onepage .cta::after{ right:20px; }
}

@media (prefers-reduced-motion:reduce){
  .onepage .cta::before{ display:none; }
  .onepage .cta:hover{ transform:none; }
}
