.notice-board { width:min(880px,calc(100% - 40px)); margin:0 auto; padding:64px 0 80px; }
.notice-board h1 { margin:8px 0 12px; }
.notice-list { list-style:none; margin:32px 0 0; padding:0; border-top:1px solid var(--line); }
.notice-list li { border-bottom:1px solid var(--line); }
.notice-list-link { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:20px; padding:24px 4px; text-decoration:none; }
.notice-list-number { color:var(--ink-soft); font-variant-numeric:tabular-nums; text-align:center; }
.notice-list-title { color:var(--ink); font-weight:650; overflow-wrap:anywhere; }
.notice-list-link:hover .notice-list-title { color:var(--green); }
.notice-date { color:var(--ink-soft); font-size:14px; white-space:nowrap; }
.notice-pagination { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:16px; margin-top:32px; }
.notice-pagination[hidden] { display:none; }
.notice-article { padding:28px 0; }
.notice-article h2 { font-size:clamp(24px,4vw,34px); overflow-wrap:anywhere; }
.notice-body { border-top:1px solid var(--line); margin-top:24px; padding-top:28px; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.85; }
.notice-back { display:inline-block; margin-top:24px; }
#notice-status { min-height:24px; margin:20px 0; }
.notice-search { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-top:28px; }
.notice-search label { display:flex; flex-direction:column; gap:8px; color:var(--ink-soft); font-size:14px; }
.notice-search-query { flex:1; min-width:180px; }
.notice-search input,.notice-search select { width:100%; min-height:44px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--paper,#fff); color:var(--ink); font:inherit; }
.notice-search input:focus-visible,.notice-search select:focus-visible { outline:2px solid var(--green); outline-offset:2px; }
@media(max-width:600px) {
  .notice-board { padding-top:40px; }
  .notice-list-link { grid-template-columns:32px minmax(0,1fr); align-items:start; gap:8px 12px; }
  .notice-list-number { grid-row:1 / span 2; }
  .notice-list-link .notice-date { grid-column:2; }
  .notice-search { gap:12px 8px; }
}