@charset "utf-8";
/* =========================================================
   freeeで会社設立バイブル / main.css
   デザインモチーフ：手引書（索引タブ・罫線・朱印）
   ========================================================= */

:root{
  --ink:#141a2e;
  --ink2:#3d465f;
  --ink3:#6d768e;
  --line:#ded8c8;
  --line2:#efebe0;
  --paper:#f7f5ee;
  --paper2:#efece1;
  --card:#ffffff;

  --pri:#2a4bd0;
  --pri-d:#1c339a;
  --pri-l:#e9edfc;
  --acc:#dd4f26;
  --acc-d:#b83c17;
  --acc-l:#fdece5;
  --grn:#0d9377;
  --grn-l:#e2f4ef;
  --ylw:#eeb92c;
  --ylw-l:#fdf3d9;
  --vio:#6b46c1;
  --vio-l:#efe9fb;

  --r-s:6px; --r-m:12px; --r-l:20px;
  --sh-s:0 1px 2px rgba(20,26,46,.06),0 2px 8px rgba(20,26,46,.05);
  --sh-m:0 2px 6px rgba(20,26,46,.07),0 10px 26px rgba(20,26,46,.08);
  --wrap:1140px;
  --ctaH:104px;

  --f-go:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic Medium","Yu Gothic",Meiryo,system-ui,sans-serif;
  --f-mi:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f-go);font-size:16px;line-height:1.9;
  font-feature-settings:"palt" 1;
  padding-bottom:var(--ctaH);
}
img{max-width:100%;height:auto;display:block}
a{color:var(--pri-d);text-underline-offset:.22em;text-decoration-thickness:.08em}
a:hover{color:var(--acc-d)}
button{font-family:inherit}
figure{margin:0}

.fks-wrap{width:min(100% - 32px,var(--wrap));margin-inline:auto}
.fks-wrap-narrow{width:min(100% - 32px,860px);margin-inline:auto}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:18px 0;border:1px solid var(--line);border-radius:var(--r-m);background:#fff}
.tbl-scroll>table{margin:0;min-width:520px;border-collapse:collapse;width:100%}
.tbl-scroll::-webkit-scrollbar{height:8px}
.tbl-scroll::-webkit-scrollbar-thumb{background:#c9c3b3;border-radius:4px}

/* ---------- Skip link ---------- */
.fks-skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;z-index:9999}
.fks-skip:focus{left:8px;top:8px}

/* =========================================================
   ヘッダー
   ========================================================= */
.fks-utility{background:var(--ink);color:#cfd4e4;font-size:11.5px;letter-spacing:.02em}
.fks-utility .fks-wrap{display:flex;gap:12px;align-items:center;justify-content:space-between;min-height:32px;padding-block:5px;flex-wrap:wrap}
.fks-utility p{margin:0}
.fks-utility .fks-u-note{color:#9aa3bd}
.fks-utility a{color:#fff;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.45)}

.fks-head{
  position:sticky;top:0;z-index:120;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.4) blur(8px);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 rgba(20,26,46,.02);
}
.fks-head-in{display:flex;align-items:center;gap:14px;min-height:64px;padding-block:8px}
.fks-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex:1 1 auto;min-width:0}
.fks-brand svg{flex:0 0 auto}
.fks-brand-t{display:flex;flex-direction:column;min-width:0}
.fks-brand-t b{font-size:16px;line-height:1.28;font-weight:800;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fks-brand-t b i{font-style:normal;color:var(--acc)}
.fks-brand-t span{font-size:10.5px;color:var(--ink3);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.fks-nav{display:flex;align-items:center;gap:4px}
.fks-nav a,.fks-nav button{
  font-size:13px;font-weight:700;color:var(--ink2);text-decoration:none;
  padding:9px 11px;border-radius:var(--r-s);background:none;border:0;cursor:pointer;white-space:nowrap
}
.fks-nav a:hover,.fks-nav button:hover{background:var(--pri-l);color:var(--pri-d)}
.fks-nav .fks-nav-cta{background:var(--acc);color:#fff;padding:9px 15px;border-radius:999px;box-shadow:0 2px 0 var(--acc-d)}
.fks-nav .fks-nav-cta:hover{background:var(--acc-d);color:#fff}

.fks-burger{display:none;width:42px;height:38px;border:1px solid var(--line);border-radius:var(--r-s);background:#fff;align-items:center;justify-content:center;gap:4px;flex-direction:column;cursor:pointer}
.fks-burger i{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;transition:.18s}
.fks-burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.fks-burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.fks-burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* メガパネル（カテゴリー） */
.fks-mega{display:none;border-top:1px solid var(--line);background:#fff;box-shadow:var(--sh-m);max-height:min(72vh,620px);overflow:auto}
.fks-mega.is-open{display:block}
.fks-mega-in{padding:18px 0 24px}
.fks-mega h2{font-size:12px;letter-spacing:.14em;color:var(--ink3);margin:0 0 10px;font-weight:800}
.fks-mega-grid{display:grid;gap:6px;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))}
.fks-mega-grid a{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;text-decoration:none;color:var(--ink2);padding:8px 10px;border-radius:var(--r-s);line-height:1.5}
.fks-mega-grid a:hover{background:var(--paper2);color:var(--pri-d)}
.fks-mega-grid a svg{flex:0 0 auto;margin-top:1px}
.fks-mob{display:none;border-top:1px solid var(--line);background:#fff;padding:12px 0 18px}
.fks-mob.is-open{display:block}
.fks-mob a{display:block;padding:11px 12px;border-radius:var(--r-s);text-decoration:none;color:var(--ink);font-weight:700;font-size:14px;border-bottom:1px dotted var(--line)}

/* 検索フォーム */
.fks-search{display:flex;border:2px solid var(--ink);border-radius:999px;overflow:hidden;background:#fff;max-width:520px}
.fks-search input[type=search]{flex:1 1 auto;border:0;padding:10px 16px;font-size:14px;min-width:0;background:transparent;font-family:inherit}
.fks-search input[type=search]:focus{outline:2px solid var(--pri);outline-offset:-4px}
.fks-search button{border:0;background:var(--ink);color:#fff;padding:0 18px;font-weight:800;font-size:13px;cursor:pointer}
.fks-search button:hover{background:var(--pri-d)}

/* =========================================================
   パンくず
   ========================================================= */
.fks-crumbs{font-size:11.5px;color:var(--ink3);padding:12px 0 0}
.fks-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.fks-crumbs li::after{content:"›";margin-left:6px;color:#b9b3a2}
.fks-crumbs li:last-child::after{content:""}
.fks-crumbs a{color:var(--ink3);text-decoration:none;border-bottom:1px solid var(--line)}
.fks-crumbs a:hover{color:var(--pri-d)}

/* =========================================================
   共通パーツ
   ========================================================= */
.fks-sec{padding:44px 0}
.fks-sec-h{display:flex;align-items:flex-end;gap:14px;justify-content:space-between;flex-wrap:wrap;margin-bottom:20px}
.fks-sec-h h2{
  margin:0;font-size:clamp(20px,4.2vw,27px);font-weight:800;letter-spacing:.01em;line-height:1.4;
  position:relative;padding-left:16px
}
.fks-sec-h h2::before{content:"";position:absolute;left:0;top:.22em;bottom:.22em;width:6px;border-radius:3px;background:linear-gradient(180deg,var(--pri),var(--acc))}
.fks-sec-h p{margin:6px 0 0;font-size:13px;color:var(--ink3)}
.fks-more{display:inline-block;max-width:100%;font-size:12.5px;font-weight:800;text-decoration:none;color:var(--pri-d);border:1px solid var(--pri);border-radius:999px;padding:7px 16px;line-height:1.6;text-align:center;overflow-wrap:anywhere}
.fks-more:hover{background:var(--pri);color:#fff}

.fks-chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;padding:4px 10px;border-radius:999px;background:var(--pri-l);color:var(--pri-d);text-decoration:none;line-height:1.6}
.fks-chip:hover{background:var(--pri);color:#fff}
.fks-chip.is-acc{background:var(--acc-l);color:var(--acc-d)}
.fks-chip.is-grn{background:var(--grn-l);color:#08715c}
.fks-chip.is-ylw{background:var(--ylw-l);color:#8a6a06}
.fks-chip.is-vio{background:var(--vio-l);color:#54329f}

/* =========================================================
   記事カード（ルール10：1件ずつ見た目を変える）
   ========================================================= */
/* align-items:start：カードを行の高さに追従させない。追従させると背の低いカードに余白が出る */
.fks-list{display:grid;gap:14px;align-items:start;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
.fks-list.is-wide{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
/* カード幅で判定するためのコンテナ。カード自身は自分のコンテナクエリで変えられないのでラッパーを噛ませる */
.fks-card-w{container-type:inline-size;display:flex;min-width:0}
.fks-card{flex:1 1 auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;position:relative;display:flex;flex-direction:column;min-width:0}
.fks-card:hover{box-shadow:var(--sh-m);border-color:#c8c1ae}
.fks-card a.fks-card-t{text-decoration:none;color:var(--ink)}
.fks-card a.fks-card-t:hover{color:var(--pri-d)}
.fks-card-b{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1 1 auto;min-width:0}
.fks-card h3{margin:0;font-size:15.5px;line-height:1.55;font-weight:800}
.fks-card p{margin:0;font-size:12.5px;color:var(--ink2);line-height:1.75}
.fks-card-m{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:11px;color:var(--ink3);margin-top:auto;padding-top:4px}
.fks-card-img{background:var(--paper2)}
.fks-card-img a{display:block}
/* セクション画像は文字入りのイラスト。cover で切り抜くと文字が読めなくなるので contain で全体を出す */
.fks-card img{width:100%;aspect-ratio:16/9;object-fit:contain;background:var(--paper2)}

/* v1 画像上（標準） */
.fks-card--v1 .fks-card-b{border-top:3px solid var(--pri)}
/* v2 画像左・v3 画像右：既定は縦積み。横並びは下の @container で、カードが広いときだけ出す。
   縦積みのときに v1 と同じ見た目にならないよう、v2 は画像を上・v3 は画像を下に置いて分ける（ルール10）*/
.fks-card--v2 .fks-card-b{border-top:3px solid var(--acc)}
.fks-card--v3{flex-direction:column-reverse}
.fks-card--v3 .fks-card-b{border-bottom:3px solid var(--grn)}
/* v4 画像なし・色帯 */
.fks-card--v4{background:linear-gradient(180deg,var(--ylw-l),#fff 62%)}
.fks-card--v4 .fks-card-b{padding-top:18px}
.fks-card--v4::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--ylw)}
/* v5 画像を上に大きく1カラム */
.fks-card-w--v5{grid-column:1/-1}
.fks-card--v5 .fks-card-img{max-width:720px;margin-inline:auto;width:100%}
.fks-card--v5 img{aspect-ratio:16/9;height:auto;object-fit:contain}
.fks-card--v5 h3{font-size:19px}
.fks-card--v5 .fks-card-b{padding:18px 20px 20px}
/* v6 枠線強調・番号 */
.fks-card--v6{border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.fks-card--v6 .fks-card-b{padding-top:16px}
/* v7 ペーパー */
.fks-card--v7{background:repeating-linear-gradient(180deg,#fff,#fff 30px,#f3f1e7 30px,#f3f1e7 31px);border-left:5px solid var(--vio)}

/* --------------------------------------------------------
   画像左(v2)・画像右(v3)の横並び
   カード幅が 480px 以上のときだけ横並びにする。
   16:9 の画像は幅の 0.56 倍の高さにしかならないので、カードが狭いと
   画像側が 80px 前後、本文側が 300px 前後になって釣り合わない
   （1280px・3列＝カード370pxで実測 244〜305px の空白が出ていた）。
   480px あれば本文列に 240px 前後を確保できる。
   横並びのときは見出しと抜粋を2行に抑え、画像列は背景色を敷いて
   1枚の面として見せる（縦の余りは意図した余白になる）。
   -------------------------------------------------------- */
@container (min-width:480px){
  .fks-card--v2{flex-direction:row;align-items:stretch}
  .fks-card--v3{flex-direction:row-reverse;align-items:stretch}
  .fks-card--v3 .fks-card-b{border-bottom:0}
  .fks-card--v2 .fks-card-img,.fks-card--v3 .fks-card-img{
    flex:0 0 46%;max-width:300px;align-self:stretch;
    display:flex;align-items:center;background:var(--paper2)
  }
  .fks-card--v2 .fks-card-img a,.fks-card--v3 .fks-card-img a{width:100%}
  .fks-card--v2 .fks-card-b{border-top:0;border-left:3px solid var(--acc)}
  .fks-card--v3 .fks-card-b{border-top:0;border-right:3px solid var(--grn)}
  .fks-card--v2 h3,.fks-card--v3 h3{
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
  }
  .fks-card--v2 p,.fks-card--v3 p{
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
  }
}

.fks-card-no{position:absolute;top:0;right:0;background:var(--ink);color:#fff;font-size:10.5px;font-weight:800;padding:4px 10px;border-bottom-left-radius:10px;letter-spacing:.05em;z-index:2}

@media (max-width:640px){
  .fks-card--v6{box-shadow:3px 3px 0 var(--ink)}
}

/* =========================================================
   カテゴリーカード（索引タブ）
   ========================================================= */
.fks-cats{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(255px,100%),1fr))}
.fks-cat{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:0 var(--r-m) var(--r-m) var(--r-m);
  padding:16px 16px 14px;text-decoration:none;color:var(--ink);display:flex;gap:11px;min-width:0
}
.fks-cat::before{
  content:attr(data-tab);position:absolute;left:-1px;top:-19px;height:19px;line-height:19px;
  background:#fff;border:1px solid var(--line);border-bottom:0;border-radius:6px 6px 0 0;
  font-size:10px;font-weight:800;letter-spacing:.08em;padding:0 10px;color:var(--ink3)
}
.fks-cat:hover{border-color:var(--pri);box-shadow:var(--sh-m)}
.fks-cat:hover::before{border-color:var(--pri);color:var(--pri-d)}
.fks-cat-i{flex:0 0 40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--pri-l);color:var(--pri-d)}
.fks-cat-x{min-width:0}
.fks-cat b{display:block;font-size:14px;line-height:1.5;font-weight:800;margin-bottom:4px;word-break:auto-phrase}
.fks-cat span{display:block;font-size:11.5px;color:var(--ink2);line-height:1.7}
.fks-cat em{display:inline-block;font-style:normal;font-size:10.5px;color:var(--ink3);margin-top:6px;border-top:1px dotted var(--line);padding-top:5px}
.fks-cats>.fks-cat:nth-child(6n+2) .fks-cat-i{background:var(--acc-l);color:var(--acc-d)}
.fks-cats>.fks-cat:nth-child(6n+3) .fks-cat-i{background:var(--grn-l);color:#08715c}
.fks-cats>.fks-cat:nth-child(6n+4) .fks-cat-i{background:var(--ylw-l);color:#8a6a06}
.fks-cats>.fks-cat:nth-child(6n+5) .fks-cat-i{background:var(--vio-l);color:#54329f}
.fks-cats>.fks-cat:nth-child(6n+6) .fks-cat-i{background:#e7eef5;color:#2c5a7a}
.fks-cats>.fks-cat:nth-child(5n+3){border-radius:var(--r-m) 0 var(--r-m) var(--r-m)}
.fks-cats>.fks-cat:nth-child(5n+3)::before{left:auto;right:-1px;border-radius:6px 6px 0 0}
.fks-cats>.fks-cat:nth-child(7n+5){background:linear-gradient(180deg,#fbfaf5,#fff)}

/* =========================================================
   記事本文
   ========================================================= */
.fks-single{padding:20px 0 10px}
.fks-art-head{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:22px 22px 18px;box-shadow:var(--sh-s);position:relative;overflow:hidden}
.fks-art-head::after{content:"";position:absolute;right:-40px;top:-40px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle at 40% 40%,var(--pri-l),transparent 70%)}
.fks-art-head h1{margin:10px 0 12px;font-size:clamp(22px,5.2vw,33px);line-height:1.45;font-weight:800;letter-spacing:.005em;position:relative}
.fks-art-meta{display:flex;flex-wrap:wrap;gap:8px 14px;font-size:11.5px;color:var(--ink3);align-items:center;position:relative}
.fks-art-lead{margin:14px 0 0;font-size:14px;color:var(--ink2);line-height:1.9;position:relative}
.fks-art-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;position:relative}

.fks-body{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-l);
  padding:26px clamp(14px,3.4vw,34px) 30px;margin-top:16px;box-shadow:var(--sh-s);
  font-size:16px;line-height:2.0;overflow-wrap:anywhere
}
.fks-body>*:first-child{margin-top:0}
.fks-body p{margin:0 0 1.35em}
.fks-body h2{font-size:clamp(19px,4.4vw,25px);line-height:1.5;margin:2.4em 0 .9em;font-weight:800;scroll-margin-top:92px}
.fks-body h3{font-size:clamp(17px,3.6vw,20px);line-height:1.55;margin:2em 0 .7em;font-weight:800}
.fks-body h4{font-size:16px;margin:1.6em 0 .5em;font-weight:800}
.fks-body ul,.fks-body ol{margin:0 0 1.35em;padding-left:1.5em}
.fks-body li{margin-bottom:.5em}
.fks-body img{border-radius:var(--r-m);margin-inline:auto}
.fks-body figure{margin:22px 0}
.fks-body figcaption{font-size:11.5px;color:var(--ink3);margin-top:8px;text-align:center;line-height:1.7}
.fks-body table{width:100%;font-size:13.5px;line-height:1.7}
.fks-body th,.fks-body td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
.fks-body thead th{background:var(--paper2);font-weight:800;white-space:nowrap}
.fks-body blockquote{margin:22px 0;padding:14px 18px;background:var(--paper);border-left:4px solid var(--ink3);border-radius:0 var(--r-s) var(--r-s) 0;font-size:14.5px}
.fks-body code{background:var(--paper2);padding:2px 6px;border-radius:4px;font-size:.9em}
.fks-body hr{border:0;border-top:1px dashed var(--line);margin:34px 0}
.fks-body a{color:var(--pri-d)}

/* 出典（ルール4） */
.fks-src{
  margin:18px 0 6px;font-size:12.5px;line-height:1.75;background:var(--paper);
  border:1px solid var(--line);border-left:4px solid var(--ink);border-radius:0 var(--r-s) var(--r-s) 0;
  padding:10px 13px;color:var(--ink2)
}
.fks-src b{font-size:10.5px;letter-spacing:.1em;color:var(--ink3);display:block;margin-bottom:2px;font-weight:800}
.fks-src a{word-break:break-all}

/* 読者向けブロック */
.fks-for{border:2px dashed var(--pri);border-radius:var(--r-m);background:var(--pri-l);padding:16px 18px;margin:0 0 24px}
.fks-for b{display:block;font-size:13px;color:var(--pri-d);margin-bottom:6px;letter-spacing:.03em}
.fks-for p{margin:0 0 .6em;font-size:14px;line-height:1.9}
.fks-for p:last-child{margin-bottom:0}
.fks-close{border:0;border-top:4px solid var(--acc);background:var(--acc-l);border-radius:0 0 var(--r-m) var(--r-m);padding:18px 18px 20px;margin:34px 0 0}
.fks-close b{display:block;font-size:14px;color:var(--acc-d);margin-bottom:8px}
.fks-close p{margin:0 0 .7em;font-size:14px;line-height:1.9}
.fks-close p:last-child{margin-bottom:0}

/* 目次 */
.fks-toc{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:16px 18px;margin:22px 0 26px;box-shadow:var(--sh-s)}
.fks-toc>b{display:flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.06em;margin-bottom:10px}
.fks-toc>b::before{content:"目次";background:var(--ink);color:#fff;font-size:10px;padding:3px 9px;border-radius:999px;letter-spacing:.14em}
.fks-toc ol{list-style:none;counter-reset:t;margin:0;padding:0;display:grid;gap:2px;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
.fks-toc li{counter-increment:t}
.fks-toc li a{display:flex;gap:9px;font-size:13px;text-decoration:none;color:var(--ink2);padding:7px 8px;border-radius:var(--r-s);line-height:1.6}
.fks-toc li a::before{content:counter(t,decimal-leading-zero);font-weight:800;color:var(--acc);font-size:11px;flex:0 0 auto;padding-top:2px}
.fks-toc li a:hover{background:var(--paper);color:var(--pri-d)}
.fks-toc ol ol{margin-left:18px;grid-template-columns:1fr}
.fks-toc ol ol li a{font-size:12px;color:var(--ink3)}
.fks-toc ol ol li a::before{content:"–";color:var(--ink3)}

/* 役に立った */
.fks-helpful{margin:30px 0 0;background:var(--grn-l);border:1px solid #bde3d8;border-radius:var(--r-m);padding:18px;text-align:center}
.fks-helpful p{margin:0 0 10px;font-size:13.5px;font-weight:700}
.fks-helpful button{
  border:2px solid var(--grn);background:#fff;color:#08715c;border-radius:999px;
  padding:10px 24px;font-size:14px;font-weight:800;cursor:pointer;display:inline-flex;gap:8px;align-items:center
}
.fks-helpful button:hover{background:var(--grn);color:#fff}
.fks-helpful button[disabled]{opacity:.7;cursor:default}
.fks-helpful small{display:block;margin-top:8px;font-size:11px;color:var(--ink3)}

/* 紹介サイト（ルール2） */
.fks-refs{margin:34px 0 0;background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:22px clamp(14px,3vw,26px)}
.fks-refs>h2{margin:0 0 6px;font-size:clamp(17px,3.8vw,21px);font-weight:800;line-height:1.5}
.fks-refs>.fks-refs-note{margin:0 0 16px;font-size:11.5px;color:var(--ink3);line-height:1.7}
.fks-refs ol{list-style:none;margin:0;padding:0;counter-reset:r;display:grid;gap:9px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.fks-refs li{counter-increment:r;border:1px solid var(--line2);border-radius:var(--r-s);padding:10px 12px 10px 40px;position:relative;background:#fdfdfb;min-width:0}
.fks-refs li::before{content:counter(r);position:absolute;left:10px;top:10px;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center}
.fks-refs li a{font-size:13.5px;font-weight:700;text-decoration:none;display:block;line-height:1.55;word-break:break-word}
.fks-refs li a:hover{text-decoration:underline}
.fks-refs li span{display:block;font-size:11.5px;color:var(--ink2);line-height:1.65;margin-top:3px}
.fks-refs li cite{display:block;font-style:normal;font-size:10px;color:var(--ink3);margin-top:4px;word-break:break-all}
.fks-refs li:nth-child(4n+2){background:#fff;border-left:3px solid var(--pri)}
.fks-refs li:nth-child(4n+3){background:var(--paper);border-style:dashed}
.fks-refs li:nth-child(4n+3)::before{background:var(--acc)}
.fks-refs li:nth-child(4n){border-left:3px solid var(--grn)}

/* 関連記事 */
.fks-rel{margin:30px 0 0}
.fks-rel>h2{font-size:clamp(17px,3.8vw,21px);margin:0 0 14px;font-weight:800}

/* 記事下ナビ */
.fks-adjacent{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));margin:26px 0 0}
.fks-adjacent a{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:13px 15px;text-decoration:none;color:var(--ink);font-size:13px;line-height:1.6}
.fks-adjacent a:hover{border-color:var(--pri);color:var(--pri-d)}
.fks-adjacent a b{display:block;font-size:10.5px;color:var(--ink3);letter-spacing:.1em;margin-bottom:4px}

/* 著者 */
.fks-author{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:16px 18px;margin:26px 0 0;align-items:flex-start;flex-wrap:wrap}
.fks-author-a{flex:0 0 52px;height:52px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800}
.fks-author-b{flex:1 1 260px;min-width:0}
.fks-author-b b{display:block;font-size:14px;margin-bottom:4px}
.fks-author-b p{margin:0;font-size:11.5px;color:var(--ink2);line-height:1.75}

/* =========================================================
   アーカイブ
   ========================================================= */
.fks-arch-head{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:22px clamp(16px,3vw,28px);margin:16px 0 22px;position:relative;overflow:hidden}
.fks-arch-head::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:linear-gradient(180deg,var(--pri),var(--grn))}
.fks-arch-head h1{margin:0 0 8px;font-size:clamp(21px,4.6vw,30px);line-height:1.45;font-weight:800;padding-left:8px}
.fks-arch-head p{margin:0;font-size:13.5px;color:var(--ink2);line-height:1.9;padding-left:8px}
.fks-arch-head .fks-arch-count{font-size:11.5px;color:var(--ink3);margin-top:10px;padding-left:8px}

.fks-tagbar{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px;background:var(--paper2);border:1px dashed var(--line);border-radius:var(--r-m);padding:12px 14px}
.fks-tagbar b{width:100%;font-size:11px;letter-spacing:.1em;color:var(--ink3);margin-bottom:2px}
.fks-tagbar a{font-size:11.5px;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 11px;color:var(--ink2)}
.fks-tagbar a:hover,.fks-tagbar a[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}

.fks-sns{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));margin:26px 0 0}
.fks-sns a{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px;text-decoration:none;color:var(--ink);font-size:12.5px;font-weight:700;line-height:1.5}
.fks-sns a:hover{border-color:var(--ink);box-shadow:var(--sh-s)}
.fks-sns a span{display:block;font-size:10.5px;color:var(--ink3);font-weight:400;margin-top:2px}
.fks-sns a i{flex:0 0 34px;height:34px;border-radius:9px;background:var(--paper2);display:flex;align-items:center;justify-content:center}

.fks-pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:30px 0 0}
.fks-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-s);background:#fff;text-decoration:none;font-size:13.5px;font-weight:700;color:var(--ink2)}
.fks-pager .page-numbers.current{background:var(--ink);border-color:var(--ink);color:#fff}
.fks-pager a.page-numbers:hover{border-color:var(--pri);color:var(--pri-d)}

/* =========================================================
   フロントページ
   ========================================================= */
.fks-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(1000px 380px at 88% -10%,rgba(42,75,208,.10),transparent 62%),
    radial-gradient(700px 320px at 4% 108%,rgba(221,79,38,.10),transparent 60%),
    repeating-linear-gradient(-45deg,rgba(20,26,46,.022) 0 2px,transparent 2px 11px),
    var(--paper);
  border-bottom:1px solid var(--line)
}
.fks-hero-in{padding:36px 0 40px;display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));align-items:center}
.fks-hero-badge{display:inline-flex;align-items:center;gap:7px;background:var(--ink);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.1em;padding:5px 13px;border-radius:999px}
.fks-hero h1{margin:14px 0 12px;font-size:clamp(25px,6vw,42px);line-height:1.36;font-weight:800;letter-spacing:-.01em}
.fks-hero h1 mark{background:linear-gradient(transparent 62%,var(--ylw) 62%);color:inherit;padding:0 2px}
.fks-hero p{margin:0 0 18px;font-size:14.5px;line-height:1.95;color:var(--ink2)}
.fks-hero-cta{display:flex;gap:9px;flex-wrap:wrap}
.fks-btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:800;font-size:14px;padding:13px 24px;border-radius:999px;border:2px solid var(--ink);background:var(--ink);color:#fff}
.fks-btn:hover{background:var(--pri-d);border-color:var(--pri-d);color:#fff}
.fks-btn.is-ghost{background:#fff;color:var(--ink)}
.fks-btn.is-ghost:hover{background:var(--paper2);color:var(--ink);border-color:var(--ink)}

.fks-hero-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);box-shadow:var(--sh-m);padding:18px 18px 16px;position:relative}
.fks-hero-panel h2{margin:0 0 12px;font-size:13px;letter-spacing:.08em;display:flex;align-items:center;gap:8px}
.fks-hero-panel h2::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--acc)}
.fks-steps{list-style:none;margin:0;padding:0;counter-reset:s;display:grid;gap:8px}
.fks-steps li{counter-increment:s;display:flex;gap:11px;font-size:13px;line-height:1.7;padding:9px 10px;border-radius:var(--r-s);background:var(--paper);align-items:flex-start}
.fks-steps li::before{content:"STEP " counter(s);flex:0 0 auto;font-size:9.5px;font-weight:800;letter-spacing:.06em;background:var(--ink);color:#fff;padding:3px 7px;border-radius:4px;margin-top:2px}
.fks-steps li b{display:block;font-size:13px}
.fks-steps li span{display:block;font-size:11.5px;color:var(--ink3);line-height:1.65}

.fks-stats{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.fks-stat{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:16px 16px 14px;position:relative;overflow:hidden;min-width:0}
.fks-stat::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--pri)}
.fks-stat:nth-child(4n+2)::after{background:var(--acc)}
.fks-stat:nth-child(4n+3)::after{background:var(--grn)}
.fks-stat:nth-child(4n)::after{background:var(--ylw)}
.fks-stat b{display:block;font-size:clamp(24px,5vw,32px);font-weight:800;line-height:1.2;letter-spacing:-.01em}
.fks-stat b i{font-style:normal;font-size:14px;font-weight:700;margin-left:3px}
.fks-stat strong{display:block;font-size:12.5px;margin:4px 0 6px;font-weight:800}
.fks-stat p{margin:0;font-size:11px;color:var(--ink2);line-height:1.7}
.fks-stat a{font-size:10.5px;word-break:break-all}

.fks-band{background:var(--ink);color:#e8ebf5;border-radius:var(--r-l);padding:24px clamp(16px,3vw,30px)}
.fks-band h2{margin:0 0 10px;color:#fff;font-size:clamp(18px,4vw,24px);font-weight:800}
.fks-band p{margin:0 0 8px;font-size:13.5px;line-height:1.9;color:#c9d0e4}
.fks-band a{color:#ffd47a}

/* =========================================================
   固定CTA（ルール8）
   ========================================================= */
.fks-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:300;
  background:linear-gradient(180deg,#1b2340,#141a2e);
  border-top:3px solid var(--acc);
  box-shadow:0 -6px 22px rgba(20,26,46,.22);
  color:#fff
}
.fks-cta-in{display:flex;align-items:center;gap:12px;padding:9px 0 7px;flex-wrap:wrap}
.fks-cta-t{flex:1 1 260px;min-width:0}
.fks-cta-t b{display:block;font-size:13.5px;line-height:1.45;font-weight:800}
.fks-cta-t b i{font-style:normal;color:var(--ylw)}
.fks-cta-b{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;background:var(--acc);color:#fff;
  text-decoration:none;font-weight:800;font-size:15px;padding:12px 26px;border-radius:999px;
  box-shadow:0 3px 0 var(--acc-d);white-space:nowrap
}
.fks-cta-b:hover{background:#e9673f;color:#fff;transform:translateY(-1px)}
.fks-cta-note{margin:0;padding:0 0 7px;font-size:9.5px;line-height:1.55;color:#9aa3bd}
.fks-cta-note.is-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fks-cta-more{background:none;border:0;color:#c7cee2;font-size:9.5px;text-decoration:underline;cursor:pointer;padding:0 0 6px;display:none}

@media (max-width:640px){
  :root{--ctaH:132px}
  .fks-cta-in{gap:8px;padding:8px 0 5px}
  .fks-cta-t b{font-size:12px}
  .fks-cta-b{font-size:13.5px;padding:10px 18px;flex:1 1 auto;justify-content:center}
  .fks-cta-note{font-size:9px}
  .fks-cta-more{display:inline-block}
}

/* =========================================================
   フッター
   ========================================================= */
.fks-foot{background:#101527;color:#aeb6cc;margin-top:44px;padding:38px 0 26px;font-size:12.5px;line-height:1.85}
.fks-foot a{color:#dfe4f2;text-decoration:none}
.fks-foot a:hover{color:#fff;text-decoration:underline}
.fks-foot-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
.fks-foot h2{font-size:11.5px;letter-spacing:.14em;color:#7c86a3;margin:0 0 10px;font-weight:800}
.fks-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.fks-foot-brand b{display:block;color:#fff;font-size:15px;margin-bottom:8px}
.fks-foot-cats{display:flex;flex-wrap:wrap;gap:5px}
.fks-foot-cats a{font-size:11px;border:1px solid #2a3252;border-radius:999px;padding:4px 10px}
.fks-foot-bottom{border-top:1px solid #232b47;margin-top:26px;padding-top:16px;font-size:10.5px;color:#78819e;line-height:1.8}

/* =========================================================
   その他
   ========================================================= */
.fks-404{text-align:center;padding:50px 0}
.fks-404 b{font-size:clamp(50px,14vw,90px);font-weight:800;color:var(--pri);line-height:1;display:block}
.fks-note{font-size:11.5px;color:var(--ink3);line-height:1.75;background:var(--paper2);border-radius:var(--r-s);padding:10px 12px;margin:16px 0}

@media (max-width:900px){
  .fks-nav .fks-nav-hide{display:none}
  .fks-burger{display:flex}
  .fks-mega{display:none !important}
}
@media (max-width:400px){
  body{font-size:15.5px}
  .fks-wrap,.fks-wrap-narrow{width:min(100% - 20px,var(--wrap))}
  .fks-body{padding:20px 12px 24px}
  .fks-brand-t span{display:none}
}
/* ---------- はみ出し防止の保険（ルール9） ---------- */
.fks-body .row{margin-left:0;margin-right:0}
.fks-body img,.fks-body svg,.fks-body video,.fks-body iframe{max-width:100%}
.fks-body pre,.fks-body code{white-space:pre-wrap;word-break:break-word}
.fks-body a{overflow-wrap:anywhere}
.fks-refs li a,.fks-refs li cite{overflow-wrap:anywhere}
.fks-card p,.fks-card h3{overflow-wrap:anywhere}
.fks-cat b,.fks-cat span{overflow-wrap:anywhere}
.fks-mega-grid a span{overflow-wrap:anywhere}
.fks-tagbar a{max-width:100%;overflow-wrap:anywhere}
.fks-crumbs li{max-width:100%;overflow-wrap:anywhere}
.fks-stat p a{overflow-wrap:anywhere}
.fks-body figure{max-width:100%}

@media print{
  .fks-cta,.fks-head,.fks-utility,.fks-foot{display:none}
  body{padding-bottom:0;background:#fff}
}
