/* AI組み合わせナビ /ai-kumiawase  2026-09-25
   このファイルと kumiawase.js / kumiawase-logic.js / kumiawase.json を消せば、ページは本文だけに戻る。
   色と角丸は /ai-tools（aitools.css）と同じものを使っている。 */
:root{
  --kmw-sky:#1AC2F1; --kmw-sky-d:#0E9BC4; --kmw-ink:#0D1B2A;
  --kmw-bg:#f7f8fa; --kmw-card:#fff; --kmw-txt:#12212e; --kmw-sub:#61707d; --kmw-line:#eaeef2;
  --kmw-r:12px; --kmw-sh:0 1px 2px rgba(13,27,42,.04),0 4px 14px rgba(13,27,42,.05);
  --kmw-font:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}
body.ai-kumiawase{margin:0;background:var(--kmw-bg);color:var(--kmw-txt);
 font-family:var(--kmw-font);font-size:15px;line-height:1.75;letter-spacing:.01em;-webkit-font-smoothing:antialiased}
.kmw *,.kmw-static *{box-sizing:border-box}
.kmw a,.kmw-static a{color:var(--kmw-sky-d);text-decoration:none}
.kmw a:hover,.kmw-static a:hover{text-decoration:underline}
.kmw button{cursor:pointer;border:0;background:none;font:inherit;color:inherit;font-family:inherit}
.kmw input,.kmw textarea{font:inherit;color:inherit}
.kmw img{max-width:100%}
.kmw .wrap,.kmw-static .wrap{max-width:1240px;margin:0 auto;padding:0 18px}

/* ヘッダー */
.kmw .k-hd{background:var(--kmw-ink);color:#fff;padding:30px 0 26px}
.kmw .k-ttl{font-size:27px;font-weight:900;margin:0 0 8px;letter-spacing:.01em;line-height:1.35}
.kmw .k-ttl .k-tw{color:var(--kmw-sky)}
.kmw .k-lead{margin:0 0 12px;font-size:14.5px;color:#cdd8e2;max-width:800px}
.kmw .k-src{margin:0;font-size:12.5px;color:#93a4b3}
.kmw .k-src b{color:#dfe8ef;font-weight:700}

/* 本体 */
.kmw .k-body{display:grid;grid-template-columns:326px 1fr;gap:24px;padding:22px 18px 60px;align-items:start}

/* 入力 */
.kmw .k-askwrap{position:sticky;top:14px}
.kmw .k-ask{background:var(--kmw-card);border:1px solid var(--kmw-line);border-radius:var(--kmw-r);
 box-shadow:var(--kmw-sh);overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - 28px)}
.kmw .k-askhd{flex:none;display:flex;align-items:center;justify-content:space-between;
 padding:13px 16px;background:#f2f6f9;font-size:13.5px;font-weight:700;border-bottom:1px solid var(--kmw-line)}
.kmw .k-aclose{display:none;font-size:13px;color:var(--kmw-sub)}
.kmw .k-asks{overflow-y:auto;padding:4px 16px 8px;-webkit-overflow-scrolling:touch}
.kmw .k-askft{flex:none;padding:10px 16px;border-top:1px solid var(--kmw-line);background:#fafcfd}
.kmw .k-reset{font-size:12.5px;color:var(--kmw-sub);text-decoration:underline}
.kmw .k-q{padding:14px 0;border-bottom:1px solid var(--kmw-line)}
.kmw .k-q:last-child{border-bottom:0}
.kmw .k-qt{display:flex;align-items:center;gap:8px;margin:0 0 9px;font-size:13.5px;font-weight:700;line-height:1.4}
.kmw .k-qn{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:none;
 background:var(--kmw-ink);color:#fff;font-size:11.5px;font-weight:700;border-radius:3px}
.kmw .k-qt em{font-style:normal;font-size:11.5px;font-weight:500;color:var(--kmw-sub)}
.kmw .k-qn2{margin:8px 0 0;font-size:11.5px;color:var(--kmw-sub);line-height:1.6}
.kmw .k-opts{display:flex;flex-wrap:wrap;gap:6px}
.kmw .k-op{position:relative;display:inline-flex}
.kmw .k-op input{position:absolute;opacity:0;width:100%;height:100%;left:0;top:0;margin:0;cursor:pointer}
.kmw .k-op>span{display:block;padding:7px 11px;border:1px solid #dde4ea;border-radius:6px;background:#fff;
 font-size:12.5px;line-height:1.4;transition:.12s}
.kmw .k-op input:hover+span{border-color:#b9c7d3;background:#f7fafc}
.kmw .k-op input:checked+span{border-color:var(--kmw-sky-d);background:#e8f8fe;font-weight:700;
 box-shadow:inset 0 0 0 1px var(--kmw-sky-d)}
.kmw .k-op input:focus-visible+span{outline:2px solid var(--kmw-sky-d);outline-offset:1px}
.kmw .k-op-s>span{min-width:62px;text-align:center}
.kmw .k-op-w{display:block;width:100%}
.kmw .k-op-w>span{padding:9px 12px}
.kmw .k-op-w b{display:block;font-size:12.5px;font-weight:700}
.kmw .k-op-w em{display:block;font-style:normal;font-size:11px;color:var(--kmw-sub);margin-top:2px;line-height:1.5}
.kmw .k-op-w input:checked+span em{color:#3f5768}
.kmw .k-op-have>span{display:flex;align-items:center;gap:5px}
.kmw .k-op-have img{border-radius:3px;flex:none}
.kmw .k-num{display:flex;align-items:center;gap:7px;margin-top:9px;font-size:11.5px;color:var(--kmw-sub)}
.kmw .k-num input{width:88px;padding:6px 9px;border:1px solid #dde4ea;border-radius:6px;font-size:14px;
 text-align:right;background:#fff}
.kmw .k-num input:focus{outline:2px solid var(--kmw-sky-d);outline-offset:-1px;border-color:var(--kmw-sky-d)}

/* 最初の案内 */
.kmw .k-start{background:var(--kmw-card);border:1px solid var(--kmw-line);border-radius:var(--kmw-r);
 padding:56px 24px;text-align:center;box-shadow:var(--kmw-sh)}
.kmw .k-stt{margin:0 0 6px;font-size:17px;font-weight:700}
.kmw .k-stt b{color:var(--kmw-sky-d)}
.kmw .k-sts{margin:0;font-size:13px;color:var(--kmw-sub)}

/* 結果の見出し */
.kmw .k-rhd{margin:0 0 16px}
.kmw .k-rt{margin:0 0 5px;font-size:21px;font-weight:900;line-height:1.45}
.kmw .k-rs{margin:0;font-size:13px;color:var(--kmw-sub)}

/* お金のまとめ */
.kmw .k-cost{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--kmw-line);
 border:1px solid var(--kmw-line);border-radius:var(--kmw-r);overflow:hidden;margin:0 0 8px}
.kmw .k-cst{background:var(--kmw-card);padding:13px 14px}
.kmw .k-cst>span{display:block;font-size:11.5px;color:var(--kmw-sub);font-weight:700;margin-bottom:3px}
.kmw .k-cst>b{display:block;font-size:18px;font-weight:900;line-height:1.35;letter-spacing:-.01em}
.kmw .k-cst>em{display:block;font-style:normal;font-size:11px;color:var(--kmw-sub);margin-top:3px;line-height:1.5}
.kmw .k-cst-y{background:#f4fbfe}
.kmw .k-cst-y>b{color:var(--kmw-sky-d)}
.kmw .k-costn{margin:0 0 20px;font-size:11.5px;color:var(--kmw-sub);line-height:1.65}

/* 段 */
.kmw .k-ph{margin:0 0 26px}
.kmw .k-pht{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 12px;
 font-size:12.5px;font-weight:500;color:var(--kmw-sub);line-height:1.6}
.kmw .k-phn{display:inline-block;background:var(--kmw-ink);color:#fff;font-size:13.5px;font-weight:700;
 padding:4px 11px;border-radius:4px;flex:none}
.kmw .k-ph[data-ph=m3] .k-phn{background:#2b4d66}
.kmw .k-ph[data-ph=m6] .k-phn{background:#4a6b82}
.kmw .k-cases .k-phn{background:var(--kmw-sky-d)}
.kmw .k-ringi .k-phn{background:#2b4d66}
.kmw .k-phe,.kmw .k-phw{margin:6px 0 0;font-size:12px;color:var(--kmw-sub)}
.kmw .k-phsk{margin:8px 0 0;padding-left:1.2em;font-size:12px;color:var(--kmw-sub);list-style:disc}
.kmw .k-phsk li{list-style:disc}
.kmw .k-tcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(296px,1fr));gap:12px}

/* ツールのカード */
.kmw .k-tc{background:var(--kmw-card);border:1px solid var(--kmw-line);border-radius:var(--kmw-r);
 padding:15px 16px 14px;box-shadow:var(--kmw-sh)}
.kmw .k-tc-free{background:#fcfdfe}
.kmw .k-tch{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.kmw .k-tch .k-lg{width:34px;height:34px;flex:none;border-radius:6px;object-fit:contain;background:#fff}
.kmw .k-tch .k-lgt{display:inline-flex;align-items:center;justify-content:center;background:#eef3f7;
 font-size:12px;font-weight:700;color:#5a6b7a}
.kmw .k-tcn{min-width:0;flex:1}
.kmw .k-tcn b{display:block;font-size:15.5px;font-weight:800;line-height:1.35}
.kmw .k-tcn span{display:block;font-size:11px;color:var(--kmw-sub);margin-top:1px}
.kmw .k-tcj{flex:none;background:#eef6fb;color:#1f5975;font-size:11px;font-weight:700;padding:3px 9px;border-radius:4px}
.kmw .k-tcp{padding:9px 11px;background:#f5f8fa;border-radius:6px;margin-bottom:8px}
.kmw .k-tcp b{display:block;font-size:16px;font-weight:900;letter-spacing:-.01em}
.kmw .k-tcp span{display:block;font-size:11.5px;color:var(--kmw-sub);margin-top:2px}
.kmw .k-tcpn{margin:0 0 9px;font-size:11px;color:var(--kmw-sub);line-height:1.6}
.kmw .k-tcw{margin:0 0 9px}
.kmw .k-tcwt{display:block;font-size:11px;font-weight:700;color:#3f5768;margin-bottom:3px}
.kmw .k-tcw ul{margin:0;padding-left:1.15em;font-size:12px;line-height:1.7;color:#2b3f50;list-style:disc}
.kmw .k-tcw li{list-style:disc;margin:0}
.kmw .k-tcw li::marker{color:#9fb0bd;font-size:11px}
.kmw .k-tcg{margin:0 0 7px;font-size:12.5px;line-height:1.7}
.kmw .k-tcc{margin:0 0 9px;font-size:11.5px;color:#6b5a3f;background:#fdfaf3;border-left:3px solid #e6d5a8;
 padding:7px 10px;line-height:1.65}
.kmw .k-tcc span{display:block;font-weight:700;color:#8a7442;font-size:10.5px}
.kmw .k-tcl{display:flex;gap:12px;flex-wrap:wrap;padding-top:3px}
.kmw .k-kl{font-size:12px;font-weight:700}
.kmw .k-kl-out::after{content:"↗";font-size:10px;margin-left:2px}

/* 事例 */
.kmw .k-cls{display:grid;grid-template-columns:repeat(auto-fill,minmax(296px,1fr));gap:12px}
.kmw .k-cl{background:var(--kmw-card);border:1px solid var(--kmw-line);border-radius:var(--kmw-r);padding:14px 16px}
.kmw .k-cl h4{margin:0 0 5px;font-size:14px;font-weight:700;line-height:1.55}
.kmw .k-clm{margin:0 0 6px;font-size:11px;color:var(--kmw-sub)}
.kmw .k-clr{margin:0 0 6px;font-size:12.5px;line-height:1.7;padding-left:10px;border-left:3px solid var(--kmw-sky)}
.kmw .k-cls2{margin:0;font-size:11px;color:var(--kmw-sub);line-height:1.6}
.kmw .k-clf{margin:12px 0 0;font-size:12.5px}

/* 社内で説明する用の1枚 */
.kmw .k-ringi{margin:0 0 20px}
.kmw .k-rgb{position:relative;background:var(--kmw-card);border:1px solid var(--kmw-line);border-radius:var(--kmw-r);
 padding:14px 16px 16px;box-shadow:var(--kmw-sh)}
.kmw .k-rgc{position:absolute;right:16px;top:14px;background:var(--kmw-ink);color:#fff;font-size:12.5px;
 font-weight:700;padding:8px 16px;border-radius:6px;transition:.15s}
.kmw .k-rgc:hover{background:#1c3549}
.kmw .k-rgc.k-ok{background:var(--kmw-sky-d)}
.kmw .k-rgt{display:block;width:100%;margin-top:40px;border:1px solid var(--kmw-line);border-radius:6px;
 padding:13px 14px;font-size:12.5px;line-height:1.85;background:#fbfcfd;resize:vertical;
 font-family:"SFMono-Regular",Consolas,"Hiragino Sans",Meiryo,monospace;white-space:pre}

/* 下半分（JSなしでも読める） */
.kmw-static{background:var(--kmw-card);border-top:1px solid var(--kmw-line);padding:36px 0 44px}
.kmw-static .k-ks{max-width:880px;margin:0 auto 30px}
.kmw-static h2{margin:26px 0 10px;font-size:18px;font-weight:800;line-height:1.5}
.kmw-static .k-ks>h2:first-child{margin-top:0}
.kmw-static p{margin:0 0 12px;font-size:14px;line-height:1.85}
.kmw-static .k-kst{margin:0 0 6px}
.kmw-static .k-kst dt{font-size:13.5px;font-weight:800;color:var(--kmw-sky-d);margin-top:12px}
.kmw-static .k-kst dd{margin:2px 0 0;font-size:14px;line-height:1.85}
.kmw-static .k-ksl{margin:0 0 12px;padding-left:1.3em;font-size:14px;line-height:1.85;list-style:disc}
.kmw-static .k-ksl li{list-style:disc}
.kmw-static .k-ksq dt{font-size:14px;font-weight:800;margin-top:16px}
.kmw-static .k-ksq dd{margin:4px 0 0;font-size:14px;line-height:1.85}

/* スマホで入力を下から出すボタン */
.kmw .k-mfab{display:none}

@media(max-width:1000px){
  .kmw .k-body{grid-template-columns:1fr;padding-bottom:84px}
  .kmw .k-askwrap{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:60;transform:translateY(102%);
   transition:transform .22s ease;padding:0 10px 10px}
  .kmw.k-askopen .k-askwrap{transform:translateY(0)}
  .kmw .k-ask{max-height:82vh;border-radius:14px 14px 0 0}
  .kmw .k-aclose{display:inline-block}
  .kmw .k-mfab{display:block;position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(255,255,255,.96);
   border-top:1px solid var(--kmw-line);padding:10px 14px;box-shadow:0 -2px 12px rgba(13,27,42,.07)}
  .kmw .k-mo{display:block;width:100%;background:var(--kmw-ink);color:#fff;font-size:15px;font-weight:700;
   padding:13px;border-radius:8px}
  .kmw.k-askopen .k-mfab{display:none}
  .kmw .k-cost{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .kmw .k-hd{padding:22px 0 20px}
  .kmw .k-ttl{font-size:23px}
  .kmw .k-lead{font-size:13.5px}
  .kmw .k-rt{font-size:18px}
  .kmw .k-cost{grid-template-columns:1fr}
  .kmw .k-cst>b{font-size:17px}
  .kmw .k-tcs,.kmw .k-cls{grid-template-columns:1fr}
  .kmw .k-rgc{position:static;display:block;width:100%;margin-bottom:12px}
  .kmw .k-rgt{margin-top:0}
  .kmw-static{padding:26px 0 34px}
}
@media(prefers-reduced-motion:reduce){
  .kmw .k-askwrap{transition:none}
}

/* 条件に合っている点（短い言葉で並べる） */
.kmw .k-tcg2{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 9px}
.kmw .k-tcg2 span{background:#eef3f7;color:#455a6b;font-size:10.5px;font-weight:500;
 padding:3px 8px;border-radius:3px;line-height:1.5}

/* 1か月目のものをその部署でも使う形 */
.kmw .k-tc-re{background:#fafbfc;border-style:dashed}
.kmw .k-tcp-re{background:#eef3f7}
.kmw .k-tcp-re b{font-size:14px;color:#455a6b}

/* その業種でAIが使われているところ（事例データベースから数えた事実で書いたもの） */
.kmw .k-indtxt{margin:0 0 16px;padding:12px 15px;background:#f2f7fa;border-left:3px solid var(--kmw-sky);
 font-size:13.5px;line-height:1.85;color:#2b3f50}
@media(max-width:600px){.kmw .k-indtxt{font-size:13px;padding:11px 13px}}

/* 計算の途中（稟議に貼った人が検算できるように） */
.kmw .k-shiki{display:block;font-size:11px;color:#6b7c8a;margin-top:3px;font-variant-numeric:tabular-nums}
