/* company.css — 팔레트: #F4F7FA/#FFFFFF/#0F2A44/#C9A227, Gmarket Sans/Pretendard, 좌측 사이드바형 */
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/woff2/Pretendard-Regular.woff2') format('woff2');
  font-weight: 400; font-display: swap;
}
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/woff2/Pretendard-Bold.woff2') format('woff2');
  font-weight: 700; font-display: swap;
}

:root{
  --bg:#F4F7FA; --surface:#FFFFFF; --text:#0F2A44; --accent:#C9A227;
  --radius:0px; --maxw:640px;
}
body{ background:var(--bg); color:var(--text); font-family:'Pretendard',-apple-system,'Malgun Gothic',sans-serif; line-height:1.7; }
h1,h2,h3{ font-family:'Gmarket Sans','Pretendard',sans-serif; letter-spacing:-.01em; }

.skip-link{ position:absolute; left:-999px; top:0; background:var(--text); color:#fff; padding:.6em 1em; z-index:100; }
.skip-link:focus{ left:1rem; top:1rem; }

/* 헤더 — 스크롤 시 축소 */
.site-header{ position:sticky; top:0; z-index:50; background:var(--surface); border-bottom:1px solid #e3e8ee; padding:18px 20px; transition:padding .25s ease, box-shadow .25s ease; }
.site-header.is-shrunk{ padding:8px 20px; box-shadow:0 2px 10px rgba(15,42,68,.08); }
.header-inner{ max-width:1120px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.wordmark{ font-weight:700; font-size:1.05rem; color:var(--text); }
.main-nav{ display:flex; gap:18px; flex-wrap:wrap; font-size:.9rem; }
.main-nav a{ color:#4b5a6b; border-bottom:1px solid transparent; padding-bottom:2px; }
.main-nav a:hover, .main-nav a[aria-current="page"]{ color:var(--text); border-color:var(--accent); }
.cta-tel{ border-bottom:2px solid var(--accent); font-weight:700; padding-bottom:2px; color:var(--text); font-size:.9rem; white-space:nowrap; }

/* 레이아웃 — 좌측 고정 사이드바 + 우측 본문 */
.layout{ max-width:1120px; margin:0 auto; display:grid; grid-template-columns:220px 1fr; gap:48px; padding:40px 20px 0; }
.side-nav{ position:sticky; top:90px; align-self:start; font-size:.85rem; border-left:1px solid #e3e8ee; padding-left:16px; }
.side-nav div{ font-weight:700; margin-bottom:10px; color:var(--text); }
.side-nav a{ display:block; padding:6px 0; color:#5c6b7c; }
.side-nav a:hover{ color:var(--accent); }

main{ max-width:var(--maxw); }

.hero{ padding:8px 0 32px; text-indent:0; }
.hero h1{ font-size:clamp(1.6rem,4vw,2.3rem); padding-left:18px; border-left:4px solid var(--accent); }
.hero p{ margin-top:14px; color:#3d4e60; font-size:1rem; }

section{ padding:28px 0; border-top:1px solid #e3e8ee; }
section:first-of-type{ border-top:0; }
h2{ font-size:1.25rem; padding-left:18px; border-left:4px solid var(--accent); }
h2 + p, h2 + ul, h2 + .type-grid{ margin-top:14px; }
p{ color:#2c3b4c; }
p + p{ margin-top:12px; }

.type-grid{ display:grid; gap:14px; margin-top:14px; }
.type-card{ background:var(--surface); border:1px solid #e3e8ee; border-radius:var(--radius); padding:16px 18px; }
.type-card h3{ font-size:1rem; margin-bottom:6px; }
.type-card p{ font-size:.92rem; }

.check-list{ display:grid; gap:10px; margin-top:14px; }
.check-list li{ display:flex; gap:10px; align-items:flex-start; font-size:.95rem; color:#2c3b4c; }
.check-list svg{ flex:none; margin-top:3px; color:var(--accent); }

figure.content-figure{ margin:28px auto; text-align:center; }
figure.content-figure img{ margin:0 auto; border:1px solid #d9e0e8; border-radius:var(--radius); }
figure.content-figure figcaption{ margin-top:8px; font-size:.82rem; color:#6b7684; }

.cta-block{ margin:36px 0; padding:24px 18px; background:var(--surface); border:1px solid #e3e8ee; text-align:left; }
.cta-block .cta-tel, .cta-block .cta-sms{ display:inline-block; margin-top:10px; margin-right:18px; font-weight:700; border-bottom:2px solid var(--accent); padding-bottom:2px; }

.related{ margin-top:14px; display:flex; flex-wrap:wrap; gap:10px 18px; }
.related a{ font-size:.9rem; border-bottom:1px solid #c9d2db; padding-bottom:1px; }

footer.site-footer{ margin-top:56px; background:#0F2A44; color:rgba(255,255,255,.82); padding:36px 20px; font-size:.85rem; }
.footer-inner{ max-width:1120px; margin:0 auto; }
.footer-links{ display:flex; flex-wrap:wrap; gap:8px 16px; margin-bottom:18px; }
.footer-links a{ color:rgba(255,255,255,.72); }
.footer-links a:hover{ color:#fff; }
.biz-info p{ margin:2px 0; color:rgba(255,255,255,.62); }
.footer-bottom{ margin-top:14px; color:rgba(255,255,255,.4); font-size:.78rem; }

@media (max-width:860px){
  .layout{ grid-template-columns:1fr; }
  .side-nav{ position:static; border-left:0; border-top:1px solid #e3e8ee; padding:16px 0 0; display:flex; gap:14px; overflow-x:auto; }
  .side-nav div{ display:none; }
}

/* FAQ — 아코디언 카드형 */
#faq .qa-list{ display:grid; gap:12px; margin-top:14px; }
.qa-list details{ background:var(--surface); border:1px solid #e3e8ee; border-radius:var(--radius); padding:14px 18px; max-width:100%; box-sizing:border-box; }
.qa-list details[open]{ border-color:var(--accent); }
.qa-list summary{ font-weight:700; color:var(--text); cursor:pointer; list-style:none; padding-right:24px; position:relative; word-break:keep-all; }
.qa-list summary::-webkit-details-marker{ display:none; }
.qa-list summary::after{ content:"+"; position:absolute; right:0; top:0; color:var(--accent); font-weight:700; }
.qa-list details[open] summary::after{ content:"−"; }
.qa-list details p{ margin-top:10px; font-size:.92rem; color:#2c3b4c; word-break:keep-all; }

/* 업체 선택 전 확인 항목표 */
.table-scroll{ margin-top:14px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
#check-table table{ width:100%; border-collapse:collapse; min-width:480px; background:var(--surface); }
#check-table th, #check-table td{ padding:12px 16px; border:1px solid var(--line,#e3e8ee); text-align:left; font-size:.92rem; vertical-align:top; }
#check-table thead th{ background:var(--accent); color:#fff; font-weight:700; white-space:nowrap; }
#check-table tbody th, #check-table tbody td:first-child{ font-weight:700; color:var(--text); white-space:nowrap; }
#check-table tbody td{ color:#2c3b4c; word-break:keep-all; }
#check-table tbody tr:nth-child(even){ background:var(--bg); }
