/* =========================
   基本
   ========================= */
:root{
  --navy:#0b2a5b;
  --navy-weak:#0b2a5b1a;
  --bg:#ffffff;
  --text:#111111;
  --muted:#666666;
  --line:#e5e5e5;
  --line-strong:#dedede;
  --accent:#0b5bd3;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic","Meiryo",sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.container{ width:min(1080px,92%); margin:0 auto; }

/* =========================
   ヘッダー（紺/白・太字・やや大きめ）
   ========================= */
.site-header{ background:var(--navy); color:#fff; }
.header-inner{
  display:flex; align-items:center; justify-content:space-between; padding:14px 0;
}
.brand{
  color:#fff; text-decoration:none; font-weight:800; font-size:1.35rem; letter-spacing:.02em;
}
.nav a{
  color:#fff; text-decoration:none; margin-left:16px; font-weight:700; font-size:1rem;
}
.nav a:hover{ opacity:.9; }

/* =========================
   メイン
   ========================= */
.main{ padding:24px 0 56px; }

/* =========================
   フラッシュメッセージ
   ========================= */
.flash{ margin-bottom:16px; }
.flash-item{
  background:#f2f6ff; color:#123; padding:10px 12px;
  border:1px solid #d9e4ff; border-radius:6px;
}

/* =========================
   フッター（リンクは下線なし）
   ========================= */
.site-footer{
  border-top:1px solid var(--line); color:#555; padding:16px 0; font-size:.95rem;
}
.site-footer .ext{ color:var(--accent); text-decoration:none; margin-left:6px; }
.site-footer .ext:hover{ text-decoration:none; opacity:.9; }

/* =========================
   カード
   ========================= */
.card{
  border:1px solid var(--line); border-radius:.7rem; background:#fff; padding:1rem;
}
.card-title{ font-weight:800; color:var(--navy); margin:.1rem 0 .6rem; }

/* =========================
   ボタン
   ========================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.55rem .9rem; border:1px solid transparent; border-radius:.5rem;
  font-weight:700; font-size:.95rem; text-decoration:none; cursor:pointer; line-height:1.2;
  transition:transform .02s ease, opacity .15s ease, box-shadow .15s ease;
  color:var(--text); background:#f5f7fa;
}
.btn:hover{ opacity:.92; }
.btn:active{ transform:translateY(1px); }
.btn:focus{ outline:2px solid var(--navy-weak); outline-offset:2px; }

.btn-primary{ background:var(--navy); color:#fff; border-color:var(--navy); }
.btn-primary:hover{ opacity:.94; }
.btn-primary:disabled{ opacity:.55; cursor:not-allowed; }

.btn-outline{ background:#fff; color:var(--navy); border-color:var(--navy); }
.btn-outline:hover{ background:#f0f4ff; }

.btn-danger{ background:#b3261e; color:#fff; border-color:#b3261e; }

.btn-sm{ padding:.4rem .7rem; font-size:.85rem; border-radius:.45rem; }
.btn-lg{ padding:.75rem 1.1rem; font-size:1.05rem; border-radius:.6rem; }
.btn-icon{ padding:.4rem; width:2.25rem; height:2.25rem; }

.btn-row{ display:flex; gap:.6rem; flex-wrap:wrap; }

.btn-line{ background:#06C755; color:#ffffff; border-color:#06C755; }
.btn-line:hover{ opacity:.93; }

/* =========================
   テーブル
   ========================= */
.table-wrap{ width:100%; overflow:auto; }
.table{
  width:100%; border-collapse:separate; border-spacing:0; background:#fff;
  border:1px solid var(--line-strong); border-radius:.6rem; overflow:hidden;
}
.table thead th{
  background:#f6f8fb; color:var(--navy); text-align:left; font-weight:800;
  padding:.65rem .75rem; border-bottom:1px solid var(--line-strong); font-size:.92rem;
}
.table tbody td{
  padding:.6rem .75rem; border-bottom:1px solid #eee; vertical-align:top;
}
.table tbody tr:last-child td{ border-bottom:none; }
.table tbody tr:hover{ background:#fafcff; }
.table-narrow thead th, .table-narrow tbody td{ padding:.45rem .6rem; }
.table-centered td, .table-centered th{ text-align:center; }

/* =========================
   フォーム
   ========================= */
.input,
input[type="text"], input[type="email"], input[type="tel"],
input[type="date"], input[type="number"], input[type="password"],
select, textarea{
  width:100%; padding:.55rem .65rem; border:1px solid #cfcfcf; border-radius:.5rem;
  font-size:.95rem; background:#fff; color:var(--text);
  transition:border-color .15s ease, box-shadow .15s ease;
}
input:focus, select:focus, textarea:focus{
  border-color:var(--navy); box-shadow:0 0 0 2px var(--navy-weak); outline:0;
}
label{ font-weight:700; color:var(--navy); font-size:.9rem; }

.form-row{ display:grid; gap:.75rem; }
.form-row.cols-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.form-row.cols-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width: 700px){
  .form-row.cols-2, .form-row.cols-3{ grid-template-columns:1fr; }
}

/* チェックボックス・ラジオの整形（軽め） */
input[type="checkbox"], input[type="radio"]{
  accent-color: var(--navy);
}

/* =========================
   ユーティリティ
   ========================= */
.muted{ color:var(--muted); }
.hr{ border:none; border-top:1px solid var(--line); margin:1rem 0; }

/* =========================
   印刷（PDF出力ページの邪魔をしない）
   ========================= */
@media print{
  .site-header, .site-footer, .nav, .btn, .flash{ display:none !important; }
  .card{ border:none; padding:0; }
}

/* =========================
   アクセシビリティ
   ========================= */
a:focus-visible, button:focus-visible, .btn:focus-visible{
  outline:3px solid var(--navy-weak);
  outline-offset:2px;
}

/* =========================
   404/空表示補助（任意）
   ========================= */
.empty{
  border:1px dashed var(--line-strong); border-radius:.6rem; padding:1rem; color:var(--muted);
}