body { margin:0; background:var(--color-bg); }
:root { --font-body:"Archivo","Noto Sans KR",system-ui,sans-serif; --font-heading:"Archivo","Noto Sans KR",system-ui,sans-serif; }
a { color:var(--color-accent-700); text-decoration:none; }
a:hover { color:var(--color-accent-800); }
button, input { font-family:inherit; }
:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }

.wrap { font-family:var(--font-body); color:var(--color-text); font-size:15px; line-height:1.55; word-break:keep-all; min-height:100vh; display:flex; flex-direction:column; }
.inner { max-width:1240px; margin:0 auto; padding:0 32px; box-sizing:border-box; width:100%; }

.hd { position:sticky; top:0; z-index:5; background:var(--color-bg); border-bottom:2px solid var(--color-divider); }
.hd .inner { display:flex; align-items:center; gap:20px; min-height:68px; padding-top:12px; padding-bottom:12px; }
.hd .brand { color:var(--color-text); font:900 19px/1 var(--font-heading); letter-spacing:-.01em; white-space:nowrap; flex-shrink:0; }
.hd nav { display:flex; gap:16px; margin-left:auto; font-weight:700; font-size:14px; white-space:nowrap; min-width:0; overflow:hidden; }
.hd nav a { color:var(--color-text); }
.hd nav a.on { color:var(--color-accent-700); border-bottom:2px solid var(--color-accent); }
.hd .acts { display:flex; gap:8px; flex-shrink:0; white-space:nowrap; }
.btn-line { display:flex; align-items:center; height:40px; padding:0 16px; border:2px solid var(--color-divider); color:var(--color-text); font-weight:700; font-size:14px; background:transparent; cursor:pointer; }
.btn-line:hover { background:var(--color-neutral-200); color:var(--color-text); }
.btn-red { display:flex; align-items:center; height:40px; padding:0 16px; background:var(--color-accent); color:var(--color-bg); font-weight:700; font-size:14px; border:0; cursor:pointer; }
.btn-red:hover { background:var(--color-accent-600); color:var(--color-bg); }
.btn-red.on { background:var(--color-accent-700); }

main { flex:1; }
main .inner { padding-top:56px; padding-bottom:80px; }
.kicker { font-size:12px; letter-spacing:.16em; font-weight:800; color:var(--color-accent-700); }
.ttl { margin:10px 0 0; font:900 clamp(34px,4.4vw,56px)/1.05 var(--font-heading); letter-spacing:-.035em; }
.lead { margin:12px 0 0; font-size:16px; color:var(--color-neutral-800); max-width:620px; }
.page-hd { padding-bottom:22px; border-bottom:2px solid var(--color-divider); }
.lbl { font-size:12px; letter-spacing:.1em; font-weight:800; color:var(--color-neutral-700); }
.muted { color:var(--color-neutral-700); }
.req { color:var(--color-accent-700); }

/* 목록 */
.toolbar { display:flex; align-items:center; gap:12px; margin-top:22px; flex-wrap:wrap; }
.tabs { display:flex; flex-wrap:wrap; }
.tabs a { display:flex; align-items:center; gap:6px; white-space:nowrap; height:40px; padding:0 16px; margin-right:-2px; border:2px solid var(--color-divider); color:var(--color-text); font-weight:700; font-size:14px; box-sizing:border-box; }
.tabs a.on { background:var(--color-text); color:#fff; }
.tabs a span { font-weight:400; opacity:.75; }
.search { margin-left:auto; display:flex; height:40px; border:2px solid var(--color-divider); background:#fff; flex:0 1 300px; min-width:200px; box-sizing:border-box; }
.search input { flex:1; min-width:0; border:0; padding:0 12px; font-size:14px; background:transparent; outline:none; }
.search button { border:0; border-left:2px solid var(--color-divider); background:transparent; padding:0 14px; font-weight:700; font-size:13.5px; cursor:pointer; white-space:nowrap; }
.search button:hover { background:var(--color-accent-100); color:var(--color-accent-700); }
.tbl { margin-top:20px; border-top:2px solid var(--color-divider); }
.tbl .row { display:grid; grid-template-columns:56px 96px minmax(0,1fr) 64px 110px; gap:12px; align-items:center; padding:20px 0; border-bottom:1px solid var(--color-divider); font-size:15.5px; color:var(--color-text); }
.tbl .row.head { padding:12px 0; }
.tbl a.row:hover { background:var(--color-accent-100); color:var(--color-accent-700); }
.tbl .t { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.tbl .t.b { font-weight:800; }
.tag { display:inline-block; font-size:12px; font-weight:700; padding:3px 9px; border:1px solid; }
.empty { padding:48px 0; border-bottom:1px solid var(--color-divider); color:var(--color-neutral-700); }
.pager { display:flex; margin-top:24px; }
.pager a, .pager b { display:flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 10px; margin-right:-2px; border:2px solid var(--color-divider); color:var(--color-text); font-weight:700; font-size:14px; box-sizing:border-box; }
.pager b { background:var(--color-text); color:#fff; }
.pager a:hover { background:var(--color-accent-100); color:var(--color-accent-700); }

/* 상세 */
.meta3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-bottom:1px solid var(--color-divider); }
.meta3 > div { padding:14px 16px; border-left:1px solid var(--color-divider); }
.meta3 > div:first-child { padding-left:0; border-left:0; }
.meta3 .v { font-size:15px; font-weight:700; margin-top:4px; white-space:nowrap; }
.vttl { margin:14px 0 0; font:900 clamp(26px,3vw,38px)/1.2 var(--font-heading); letter-spacing:-.025em; max-width:900px; text-wrap:pretty; }
.body { padding:34px 0 40px; max-width:820px; font-size:16.5px; line-height:1.85; color:var(--color-neutral-900); }
.sec { border-top:2px solid var(--color-divider); margin-top:40px; }
.sec-h { padding:14px 0; border-bottom:1px solid var(--color-divider); }
.file { display:flex; align-items:center; gap:16px; padding:16px 0; border-bottom:1px solid var(--color-divider); color:var(--color-text); }
.file:hover { background:var(--color-accent-100); color:var(--color-accent-700); }
.rel { display:grid; grid-template-columns:minmax(0,1fr) 110px; gap:12px; padding:16px 0; border-bottom:1px solid var(--color-divider); color:var(--color-text); }
.rel:hover { background:var(--color-accent-100); color:var(--color-accent-700); }
.prevnext { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:2px solid var(--color-divider); border-bottom:2px solid var(--color-divider); margin-top:40px; }
.prevnext > * { display:flex; flex-direction:column; gap:4px; padding:18px 18px 18px 0; color:var(--color-text); }
.prevnext > * + * { padding:18px 0 18px 18px; border-left:1px solid var(--color-divider); }
.prevnext a:hover { background:var(--color-accent-100); }
.prevnext .pt { font-size:15px; font-weight:700; }
.prevnext span.none .pt { color:var(--color-neutral-600); }

/* 신청 */
.frow { display:grid; grid-template-columns:160px minmax(0,1fr); border-bottom:1px solid var(--color-divider); }
.frow > .k { padding:26px 0; font-size:14px; font-weight:800; }
.frow > .v { padding:14px 0; max-width:560px; }
.types { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:18px 0 !important; max-width:none !important; }
.types label { display:flex; flex-direction:column; gap:6px; padding:16px 18px; margin-right:-2px; border:2px solid var(--color-divider); cursor:pointer; min-height:96px; box-sizing:border-box; }
.types label:hover { border-color:var(--color-accent); }
.types input { position:absolute; opacity:0; pointer-events:none; }
.types .nm { display:flex; align-items:center; gap:10px; font-weight:800; font-size:15.5px; }
.types .nm i { flex:0 0 auto; width:14px; height:14px; border:2px solid var(--color-divider); box-sizing:border-box; }
.types .ds { font-size:13px; line-height:1.5; color:var(--color-neutral-700); padding-left:24px; }
.types input:checked + label { background:var(--color-text); color:#fff; }
.types input:checked + label .nm i { background:var(--color-accent); border-color:var(--color-accent); }
.types input:checked + label .ds { color:var(--color-neutral-300); }
.types input:focus-visible + label { outline:2px solid var(--color-accent); outline-offset:2px; }
.inp { width:100%; box-sizing:border-box; height:48px; border:2px solid var(--color-divider); background:#fff; padding:0 14px; font-size:16px; color:var(--color-text); outline:none; }
.inp:focus { border-color:var(--color-accent); }
.inp.err { border-color:var(--color-accent); }
.emsg { font-size:13px; font-weight:700; color:var(--color-accent-700); margin-top:6px; }
.cap { display:flex; align-items:stretch; flex-wrap:wrap; gap:8px; }
.cap-img { display:flex; align-items:center; height:48px; border:2px solid var(--color-divider); background:#fff; box-sizing:border-box; }
.cap-img img { display:block; height:44px; }
.cap .btn-line { height:48px; white-space:nowrap; flex:0 0 auto; }
.cap .inp { flex:1 1 160px; min-width:140px; width:auto; letter-spacing:.08em; text-transform:uppercase; }
.agree { display:flex; align-items:center; gap:10px; font-weight:700; font-size:14.5px; cursor:pointer; }
.agree input { width:20px; height:20px; accent-color:var(--color-accent); margin:0; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.submit { margin-left:auto; display:flex; align-items:center; gap:56px; height:52px; padding:0 22px; border:0; background:var(--color-accent); color:#fff; font-weight:800; font-size:16px; cursor:pointer; }
.submit:hover { background:var(--color-accent-600); }
.submit:active { background:var(--color-accent-700); }
.alert { margin-top:24px; padding:14px 18px; border:2px solid var(--color-accent); background:var(--color-accent-100); color:var(--color-accent-700); font-weight:700; }
.done { margin-top:32px; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); border:2px solid var(--color-divider); }
.done .l { padding:36px; background:var(--color-accent); color:#fff; }
.done .sum > div { display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; padding:14px 22px; border-bottom:1px solid var(--color-divider); }
.done .sum b { overflow-wrap:anywhere; }

.ft { background:var(--color-text); color:var(--color-bg); }
.ft .inner { padding-top:40px; padding-bottom:40px; display:flex; flex-direction:column; gap:12px; font-size:14px; }
.ft .ln { display:flex; gap:20px; flex-wrap:wrap; color:var(--color-neutral-300); }

@media (max-width:760px) {
  .hd nav { display:none; }
  .tbl .row { grid-template-columns:72px minmax(0,1fr) 92px; }
  .tbl .row > :nth-child(1), .tbl .row > :nth-child(4) { display:none; }
  .frow, .types { grid-template-columns:1fr; }
  .frow > .k { padding:18px 0 0; }
  .types label { margin-right:0; margin-bottom:-2px; }
  .done { grid-template-columns:1fr; }
}