/* クラカレ 共通CSS（全ページ）。正本の見た目は docs/wire/ の試作（2026-10-14 CEO確定）。
   試作は SP と PC を別々の枠で描いていた（.kp.pc）。実サイトは1枚のHTMLを画面幅で切り替える＝PCの決まりは @media (min-width:960px)。
   ページ固有の部品は {ページ}.css に分ける。 */
:root{
  --ink:#141414; --amber:#F2A91E; --kinari:#E6E2DA; --paper:#F4F2EE; --ink-60:#5B5852; --ink-20:#CFCAC0; --ink-10:#DDD8CF;
  --tile:#EBE5D9; --tile-line:#D8CFBF; --band:#DEDFE0; --st-up:#2B5C8A; --st-closed:#DAD6CE;
  --f-body:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --pc:960px; --wide:1120px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper)}
.kp{position:relative;min-height:100vh;display:flex;flex-direction:column;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.65;font-variant-numeric:tabular-nums}
.kp a{color:inherit}
.kp a:focus-visible,.kp button:focus-visible,.kp summary:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.kp img{max-width:100%}
/* SPだけ・PCだけ。表示する側には display を指定しない（各部品の flex/grid を打ち消さないため。10/14：右枠の隙間が消えていた） */
@media (max-width:959.98px){.pc-only{display:none!important}}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== 共通ヘッダー v3（10/14 CEO）：一番上の黒の帯は不透明。街並みの帯は全面に黒の半透明を重ね、見出しを載せる ===== */
.k-head{position:relative;z-index:7;background:var(--ink);color:var(--kinari);display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:40px}
.k-logo{display:flex;align-items:center;gap:8px;text-decoration:none}
.k-logo svg{height:20px;width:auto;display:block}
.k-nav{display:flex;align-items:center;gap:12px;font-size:11.5px;white-space:nowrap}
.k-nav a{text-decoration:none;color:var(--kinari)}
.k-nav a[aria-current]{border-bottom:2px solid var(--amber);padding-bottom:1px}
.k-nav .menu{font:inherit;font-size:16px;line-height:1;background:none;border:0;color:var(--kinari);padding:4px 0 4px 4px;cursor:pointer}
.drawer{display:none;position:absolute;left:0;right:0;top:40px;z-index:8;background:rgba(20,20,20,.96);color:var(--kinari);padding:6px 16px 14px;box-shadow:0 8px 16px rgba(0,0,0,.25)}
.drawer.on{display:block}
.drawer a{display:flex;justify-content:space-between;align-items:baseline;padding:11px 2px;border-bottom:1px solid #3A3833;text-decoration:none;color:var(--kinari);font-size:14px;font-weight:700}
.drawer a small{font-weight:400;color:#A9A49A;font-size:11px}
.k-strip{--sh:98px;min-height:var(--sh);display:flex;align-items:flex-end;
  background:linear-gradient(rgba(20,20,20,.62),rgba(20,20,20,.62)),url(/assets/city.png) center top/auto 100% repeat-x,#141414;image-rendering:pixelated;border-bottom:3px solid var(--amber)}
/* 帯の下の黄色の線は試作どおり（docs/wire/*・10/14 CEO指摘で復元。段0の実装で漏れていた）。街並みは帯の高さいっぱいに伸ばす（題が長く帯が伸びても下が黒い地にならない。10/14 CEO指摘）。帯の最低の高さは --sh */
.k-tt{width:100%;padding:6px 16px 7px;color:var(--kinari);image-rendering:auto}
.k-h1{font-size:19px;font-weight:900;line-height:1.4;margin:0;text-wrap:balance}
.k-tt .k-h1{font-size:17px;line-height:1.35}
.k-mini{font-size:11.5px;color:var(--ink-60);margin:2px 0 0;line-height:1.55}
.k-mini b{color:var(--ink)}
.k-tt .k-mini{color:#C9C4BA;margin:1px 0 0;font-size:11px}
.k-tt .k-mini b{color:var(--kinari)}
.k-tt .k-mini a{color:var(--kinari)}
.k-tt .k-crumb,.k-tt .k-crumb a{color:#C9C4BA;font-size:11px;text-decoration:none}
.k-tt .k-crumb{margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== 本文・足もと ===== */
.k-body{flex:1;width:100%;padding:12px 16px 0;display:flex;flex-direction:column;gap:14px}
.k-legal{font-size:11px;color:var(--ink-60);line-height:1.7;margin:0}
/* フッター v2（10/15 CEO）：上段＝出口の導線（購読・X）、下段＝ロゴとリンク。上端に琥珀の線（帯の下の線と同じ3px） */
.k-foot{margin-top:24px;background:var(--ink);color:#A9A49A;font-size:11px;padding:0 16px 14px;border-top:3px solid var(--amber)}
.k-foot a{color:var(--kinari);text-decoration:none}
.k-follow{padding:18px 0 16px;border-bottom:1px solid #2E2D2A}
.k-follow-h{margin:0 0 10px;color:var(--kinari);font-size:13px;font-weight:900;letter-spacing:.04em}
.k-follow-g{display:grid;gap:10px}
.fw{background:#1E1D1B;border:1px solid #2E2D2A;border-radius:8px;padding:12px 12px 12px}
.fw-t{display:flex;align-items:center;gap:7px;margin:0 0 4px;color:var(--kinari);font-size:14px;font-weight:700}
.fw-t svg{width:15px;height:15px;color:var(--amber);flex-shrink:0}
.fw-d{margin:0 0 10px;font-size:12px;line-height:1.6;color:#B9B4AA}
.fw-d b{color:var(--kinari);font-weight:700}
.fw-b{display:flex;flex-wrap:wrap;gap:6px}
.fbtn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:6px 14px;border-radius:6px;font-size:13px;font-weight:700;text-decoration:none;flex:1 1 auto}
.k-foot .fbtn-main{background:var(--amber);color:var(--ink)}
.k-foot .fbtn-sub{border:1.5px solid #6B675F;color:var(--kinari)}
.k-foot .fbtn:hover{filter:brightness(1.08)}
.k-foot-in{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding-top:14px}
.k-foot-logo{flex-basis:100%}
.k-foot-logo svg{height:18px;width:auto;display:block}
.k-foot-l{display:flex;flex-wrap:wrap;gap:6px 14px}
.k-foot-c{flex-basis:100%;color:#7E7A72}

/* ===== 状態の札（サイト全体・一覧タブ・カレンダー・X画像で共通。10/13 CEO） ===== */
.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:0 7px 0 6px;border-radius:4px;letter-spacing:.06em;line-height:1.75;white-space:nowrap}
.badge svg{width:11px;height:11px;flex-shrink:0;display:block}
.b-upcoming{background:var(--st-up);color:#fff;border:1.5px solid var(--st-up)}
.b-open{background:var(--amber);color:var(--ink);border:1.5px solid var(--amber)}
.b-funded{background:var(--ink);color:var(--kinari);border:1.5px solid var(--ink)}
.b-closed{background:var(--st-closed);color:var(--ink-60);border:1.5px solid var(--st-closed)}

/* 事業者のファビコン丸（取れない社は頭文字の丸） */
.opfav{width:20px;height:20px;border-radius:50%;background:#fff;border:1px solid var(--ink-20);object-fit:contain;padding:2px;flex-shrink:0;display:inline-grid;place-items:center;font-size:10px;font-weight:900;color:var(--ink);line-height:1;font-style:normal}
.opn{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;min-width:0}
.opn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 欄の見出し：薄いグレーの帯＋墨の角丸マスに線画アイコン */
.k-sec{display:flex;flex-direction:column;gap:8px}
.k-sec>h2{font-size:13.5px;font-weight:900;margin:0;letter-spacing:.04em;display:flex;align-items:center;gap:9px;background:var(--band);padding:5px 10px 5px 5px;border-radius:5px}
.k-sec>h2 .ic{flex-shrink:0;width:24px;height:24px;border-radius:4px;background:var(--ink);color:var(--kinari);display:grid;place-items:center}
.k-sec>h2 .ic svg{width:15px;height:15px;display:block}
.k-sec>h2 .cnt{margin-left:auto;font-size:11.5px;font-weight:700;color:var(--ink-60)}
.more{font-size:12.5px;font-weight:700;text-decoration:none!important;border-bottom:1px solid var(--ink);align-self:flex-end}
.sub-h{font-size:11.5px;font-weight:700;color:var(--ink-60);margin:4px 0 0;display:flex;align-items:center;gap:6px;letter-spacing:.04em}
.sub-h2{font-size:12px;font-weight:700;margin:4px 0 0;color:var(--ink)}
.empty{font-size:12.5px;color:var(--ink-60);margin:0;padding:8px 0;border-top:1px solid var(--ink-20)}
.tag{font-size:10.5px;font-weight:700;border:1px solid var(--ink-20);border-radius:3px;padding:0 5px;line-height:1.6;color:var(--ink-60);background:var(--paper);white-space:nowrap}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0}
.dot.s{background:var(--st-up)}
.dot.c{background:var(--amber);box-shadow:inset 0 0 0 1px #B07A10}

/* 案件カード（SP） */
.cards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border-top:1px solid var(--ink-20)}
.card{border-bottom:1px solid var(--ink-20)}
.card a{display:grid;grid-template-columns:1fr auto;gap:3px 8px;padding:9px 2px;text-decoration:none}
.card .top{grid-column:1/-1;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card .tm{font-size:13px;font-weight:700}
.card .tm small{font-weight:400;color:var(--ink-60);font-size:11px;margin-left:2px}
.card .t{grid-column:1/-1;font-size:13.5px;font-weight:700;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .f{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:2px 12px;font-size:12px;color:var(--ink-60)}
.card .f b{color:var(--ink);font-size:13px}
.card .f .y b{font-size:14px}
.card .bar{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:11px;color:var(--ink-60)}
.card .bar i{flex:1;height:5px;background:var(--tile-line);border-radius:3px;overflow:hidden;display:block}
.card .bar i::before{content:"";display:block;height:100%;width:var(--p);background:var(--ink)}
.fill{font-size:12px;font-weight:700}
.fill b{font-size:15px;font-weight:900}

/* 表（横罫線だけ） */
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{font-size:11px;color:var(--ink-60);font-weight:400;text-align:left;padding:5px 6px;border-bottom:1.5px solid var(--ink)}
.tbl td{padding:8px 6px;border-bottom:1px solid var(--ink-20);vertical-align:middle}
.tbl td.n,.tbl th.n{text-align:right;white-space:nowrap}
.tbl td.t a{font-weight:700;text-decoration:none;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.tbl td.w{white-space:nowrap;font-weight:700}
.tbl td.w small{display:block;font-weight:400;color:var(--ink-60);font-size:11.5px;line-height:1.3}
.tbl td.nw,.tbl th.nw{white-space:nowrap}
.tbl tr:hover td{background:#EFEBE3}

/* ボタン */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;font-weight:700;font-size:13px;border-radius:6px;min-height:40px;padding:6px 12px}
.btn-main{background:var(--ink);color:var(--kinari)!important}
.btn-sub{border:1.5px solid var(--ink);color:var(--ink);background:transparent}

/* 数字の囲み（#EBE5D9）。見出しに12pxの線画アイコン（全ページ共通） */
.tile{background:var(--tile);border:1px solid var(--tile-line);border-radius:8px}
.tl-ic{display:inline-flex;align-items:center;gap:4px}
.tl-ic svg{width:12px;height:12px;flex-shrink:0;display:block}

/* 提携リンク（PR）：ボタンの文言の後ろに「PR」の札（文字と同じ大きさ）＋直下に一行。10/13 CEO 案A */
.pr{flex-shrink:0;white-space:nowrap;font-size:13px;font-weight:700;border:1.5px solid currentColor;border-radius:2px;padding:1px 6px;line-height:1.6;letter-spacing:.08em}
.pr-note{font-size:11px;color:var(--ink-60);margin:4px 0 0;line-height:1.6}

@media (min-width:960px){
  .sp-only{display:none!important}
  .k-head{height:46px;padding:0 max(32px,calc((100% - var(--wide))/2 + 32px))}
  .k-logo svg{height:23px}
  .k-nav{gap:20px;font-size:12.5px}
  .k-nav .menu,.drawer{display:none!important}
  .k-strip{--sh:124px} /* 高さ124pxで画像幅1329px */
  .k-tt{padding:10px max(32px,calc((100% - var(--wide))/2 + 32px)) 11px}
  .k-tt .k-h1{font-size:24px}
  .k-tt .k-mini{font-size:12px}
  .k-h1{font-size:26px}
  .k-body{max-width:var(--wide);margin:0 auto;padding:20px 32px 0;gap:18px}
  .k-foot{padding:0 max(32px,calc((100% - var(--wide))/2 + 32px)) 16px}
  .k-follow{padding:22px 0 20px}
  .k-follow-g{grid-template-columns:1fr 1fr;gap:14px}
  .fw{padding:14px 16px;display:flex;flex-direction:column}
  .fw-b{margin-top:auto}
  .fbtn{flex:0 0 auto}
  .k-foot-logo,.k-foot-c{flex-basis:auto}
  .k-foot-l{flex:1}
}
/* 数字の囲みの見出しアイコン（12px）。全ページ共通（10/14 CEO） */
.k-facts dt svg{width:12px;height:12px;flex-shrink:0;color:var(--ink-60)}