/* ハーベスト株式会社 — 共通スタイル
   03_デザイン提案_3案.html のC案パネルから抽出。
   @container → @media、cqi → vw に変換（本番実装のため。02_デザイン仕様.md参照）。
   セレクタ名（.c-*, .comp）はカンプと同一のまま維持（差分レビューしやすくするため）。 */

:root {
  --navy-900: #0A1E3C;
  --navy-800: #12315C;
  --navy-700: #1B4A87;
  --navy-100: #E7EEF7;
  --text: #1A1F2B;
  --text-sub: #56606F;
  --gray-bg: #F5F7FA;
  --on-navy-sub: #A8B6CB;
  --error: #D93025;
  --success: #1A7F52;
}

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/archivo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; } /* ページ内アンカー(#...)を使う箇所向け。現状サイト内に使用箇所は無いが今後のため */
body { margin: 0; color: var(--text); }

/* ============================================================
   カンプ共通の土台
   ============================================================ */
.comp{ font-family:"FOT-ニューロダン ProN M","Hiragino Sans","Yu Gothic",sans-serif; }

/* ============================================================
   C案 — 地域（Chikugo）
   ============================================================ */
.c{ --nv:#12315C; --nv9:#0A1E3C; --cy:#0E7FA8; --ink:#171C26; --sub:#56606F; --lt:#E7EEF7; --ln:#DCE2EB;
  background:#fff; color:var(--ink); font-size:16px; line-height:1.9; }
.c *{ box-sizing:border-box; }
.c .in{ max-width:1240px; margin:0 auto; padding:0 36px; }
@media (max-width:700px){ .c .in{ padding:0 18px; } }
.u-nowrap{ white-space:nowrap; }
.c .lbl{ font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.2em;
  text-transform:uppercase; color:var(--cy); }
.c :focus-visible{ outline:2px solid var(--cy); outline-offset:3px; }
.c-slab :focus-visible,.c-subhero :focus-visible,.c-cv :focus-visible,.c-foot :focus-visible{ outline-color:#7DD3FC; }

.c-hd{ position:sticky; top:0; z-index:3; background:#fff; box-shadow:0 1px 0 rgba(10,30,60,.08); }
.c-hd .in{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 36px; }
@media (max-width:700px){ .c-hd .in{ padding:18px; } }
.c-logo{ display:flex; align-items:baseline; gap:11px; text-decoration:none; }
.c-logo b{ font-family:"Archivo",sans-serif; font-size:20px; font-weight:700; letter-spacing:.12em;
  color:var(--nv9); }
.c-logo span{ font-size:10.5px; color:var(--sub); letter-spacing:.05em; }
.c-nav{ display:flex; gap:28px; font-size:13.5px; }
.c-nav a{ text-decoration:none; color:var(--ink); }
.c-nav a:hover{ color:var(--cy); }
@media (max-width:900px){ .c-nav{ display:none; } }
@media (max-width:700px){
  .c-logo span{ display:none; }
  .c-hd .c-cta{ padding:12px 15px; font-size:12.5px; white-space:nowrap; flex:0 0 auto; }
  .c-hd .in{ gap:10px; }
}
.c-hd .c-cta{ text-decoration:none; background:var(--nv); color:#fff; font-size:13px; font-weight:700;
  padding:13px 24px; }
.c-hd .c-cta:hover{ background:var(--nv9); }

/* ページ階層を示すパンくず。検索エンジン用のBreadcrumbListと同じ順序で表示する。 */
.c-breadcrumb{ background:#fff; border-bottom:1px solid var(--ln); }
.c-breadcrumb .in{ padding-top:11px; padding-bottom:11px; }
.c-breadcrumb ol{ display:flex; align-items:center; flex-wrap:wrap; gap:0; margin:0; padding:0; list-style:none; color:var(--sub); font-size:11px; line-height:1.6; }
.c-breadcrumb li{ display:flex; align-items:center; }
.c-breadcrumb li + li::before{ content:"/"; margin:0 10px; color:#A8B6CB; }
.c-breadcrumb a{ color:var(--sub); text-decoration:none; }
.c-breadcrumb a:hover{ color:var(--cy); }
.c-breadcrumb [aria-current="page"]{ color:var(--nv9); font-weight:700; }
@media (max-width:700px){ .c-breadcrumb .in{ padding-top:9px; padding-bottom:9px; } .c-breadcrumb ol{ font-size:10.5px; } }

.c-hero{ position:relative; padding:0 0 96px; }
.c-hero .in{ position:relative; }

.c-slab{ position:relative; background:var(--nv9); color:#fff;
  padding:64px 0 72px; margin-right:clamp(0px, 7vw, 96px); }
.c-slab-in{ max-width:1204px; margin:0 auto; padding:0 clamp(20px, 3.6vw, 56px); }
.c-hero-grid{ display:grid; grid-template-columns:1.18fr .82fr; align-items:center; gap:0; }
.c-hero h1{ font-size:clamp(27px,3.5vw,44px); line-height:1.28; font-weight:900; margin:22px 0 0;
  letter-spacing:.005em; text-wrap:balance; }
.c-hero h1 em{ font-style:normal; color:#7DD3FC; }
.c-hero .lead{ margin:22px 0 0; font-size:14.5px; line-height:2.1; color:#A8B6CB; max-width:30em; }
.c-btns{ display:flex; flex-wrap:wrap; gap:12px; margin:34px 0 0; }
.c-btns a{ text-decoration:none; font-size:14.5px; font-weight:700; padding:17px 30px; }
.c-b1{ background:#fff; color:var(--nv9); }
.c-b1:hover{ background:var(--lt); }
.c-b2{ color:#fff; box-shadow:inset 0 0 0 1px rgba(255,255,255,.32); }
.c-b2:hover{ box-shadow:inset 0 0 0 1px #7DD3FC; color:#7DD3FC; }
@media (max-width:900px){
  .c-hero-grid{ grid-template-columns:1fr; }
  .c-slab{ padding:46px 0 54px; margin-right:0; }
}
.c-lic{ display:flex; flex-wrap:wrap; gap:0; border-top:1px solid var(--ln); margin-top:0; }
.c-lic div{ flex:1 1 240px; padding:20px 0 20px 26px; border-left:1px solid var(--ln); }
.c-lic div:first-child{ padding-left:0; border-left:0; }
.c-lic dt{ font-size:10.5px; letter-spacing:.11em; color:var(--sub); }
.c-lic dd{ margin:6px 0 0; font-family:"Archivo",sans-serif; font-size:18px; font-weight:700;
  color:var(--nv9); letter-spacing:.03em; font-variant-numeric:tabular-nums; }

.c-sec{ padding:92px 0; }
.c-sec.lt{ background:var(--lt); }
.c-h2{ font-size:clamp(24px,3.2vw,38px); line-height:1.38; font-weight:900; color:var(--nv9);
  margin:16px 0 0; letter-spacing:.005em; max-width:26em; text-wrap:balance; }
.c-sec > .in > .lead{ margin:18px 0 0; font-size:14.5px; line-height:2.05; color:var(--sub); max-width:34em; }

.c-dl{ margin:52px 0 0; display:grid; grid-template-columns:180px 1fr; border-top:1px solid var(--ln); }
.c-dl dt,.c-dl dd{ padding:16px 0; border-bottom:1px solid var(--ln); margin:0; font-size:14px; }
.c-dl dt{ color:var(--sub); font-size:13px; }
.c-dl dd{ padding-left:24px; font-variant-numeric:tabular-nums; }
@media (max-width:620px){ .c-dl{ grid-template-columns:1fr; }
  .c-dl dt{ border-bottom:0; padding-bottom:0; } .c-dl dd{ padding-left:0; } }

.c-cv{ background:var(--nv9); color:#fff; padding:88px 0; }
.c-cv .in{ display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:clamp(28px,5vw,72px); align-items:end; }
.c-cv .in > .lbl,.c-cv .in > h2,.c-cv .in > p{ grid-column:1; }
.c-cv .in > .grp{ grid-column:2; grid-row:1 / span 3; align-self:end; margin-top:0; }
@media (min-width:761px){ .c-cv .in > h2{ font-size:clamp(24px,2.8vw,34px); } }
.c-cv h2{ font-size:clamp(24px,3.4vw,40px); font-weight:900; line-height:1.36; margin:16px 0 0;
  max-width:24em; text-wrap:balance; }
.c-cv p{ color:#A8B6CB; font-size:14.5px; line-height:2.05; margin:18px 0 0; max-width:33em; }
.c-cv .grp{ display:flex; flex-wrap:wrap; gap:14px; margin-top:36px; align-items:stretch; }
.c-cv .tel{ background:#fff; color:var(--nv9); text-decoration:none; padding:18px 30px; }
.c-cv .tel small{ display:block; font-size:10.5px; letter-spacing:.12em; color:var(--sub); }
.c-cv .tel b{ font-family:"Archivo",sans-serif; font-size:28px; font-weight:700;
  font-variant-numeric:tabular-nums; letter-spacing:.02em; line-height:1.25; }
.c-cv .frm{ display:flex; align-items:center; background:var(--cy); color:#fff; text-decoration:none;
  padding:18px 34px; font-size:15px; font-weight:700; }
.c-cv .frm:hover{ background:#0B6E92; }

.c-jb{ padding:30px 0; background:#fff; }
.c-jb .in{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.c-jb strong{ font-size:16px; color:var(--nv9); }
.c-jb p{ margin:5px 0 0; font-size:13px; color:var(--sub); }
.c-jb a{ text-decoration:none; font-size:13px; font-weight:700; color:var(--nv9);
  box-shadow:inset 0 0 0 1px var(--nv9); padding:12px 22px; }
.c-jb a:hover{ background:#fff; }

/* トップページの各セクション末尾「詳細を見る」リンク（新規。2026-08-27追加：
   ヘッダーナビが別ページ遷移とページ内アンカーで挙動が混じっていた指摘を受け、
   全セクションを「概要→詳細ページ」の構造に統一するため） */
.c-more{ display:inline-flex; align-items:center; gap:8px; margin-top:36px; font-size:13.5px;
  font-weight:700; color:var(--nv9); text-decoration:none; }
.c-more::after{ content:"→"; transition:transform .15s ease; }
.c-more:hover{ color:var(--cy); }
.c-more:hover::after{ transform:translateX(3px); }

/* サイト共通フッター（カンプは単一ページ分のみのため新規デザイン。C案のトークンを流用） */
.c-foot{ background:var(--nv9); color:#A8B6CB; padding:48px 0 32px; font-size:13px; }
.c-foot .in{ max-width:1240px; margin:0 auto; padding:0 36px; }
@media (max-width:700px){ .c-foot .in{ padding:0 18px; } }
.c-foot-name{ color:#fff; font-weight:700; font-size:15px; margin:0; }
.c-foot-license{ margin:10px 0 0; line-height:1.9; }
.c-foot-nav{ display:flex; flex-wrap:wrap; gap:18px; margin:24px 0 0; padding-top:20px;
  border-top:1px solid rgba(255,255,255,.15); }
.c-foot-nav a{ color:#A8B6CB; text-decoration:none; }
.c-foot-nav a:hover{ color:#fff; }
.c-foot-copy{ margin:20px 0 0; color:#5C6B85; }

/* 下層ページ用の見出し帯 */
.c-pagehead{ position:relative; overflow:hidden; display:flex; align-items:center; min-height:280px; padding:56px 0 64px; background:var(--nv9); }
.c-pagehead .in{ position:relative; z-index:2; width:100%; }
.c-pagehead .lbl{ color:#7DD3FC; }
.c-pagehead h1{ font-size:clamp(26px,3.6vw,40px); font-weight:900; color:#fff; margin:16px 0 0;
  letter-spacing:.005em; text-wrap:balance; }
.c-pagehead .lead{ margin:16px 0 0; font-size:14.5px; line-height:2.05; color:#A8B6CB; max-width:36em; }
@media (max-width:760px){ .c-pagehead{ min-height:220px; padding:40px 0 52px; } }

/* 簡易フォーム（お問い合わせページ用。新規） */
.c-form{ margin-top:52px; max-width:640px; }
.c-form .row{ margin-bottom:22px; }
.c-form label{ display:block; font-size:13px; font-weight:700; color:var(--nv9); margin-bottom:8px; }
.c-form label .req{ color:var(--error, #D93025); font-weight:700; margin-left:6px; font-size:11px; }
.c-form input[type=text],.c-form input[type=email],.c-form input[type=tel],.c-form select,.c-form textarea{
  width:100%; font:inherit; font-size:14.5px; padding:12px 14px; border:1px solid var(--ln);
  background:#fff; color:var(--ink); }
.c-form textarea{ min-height:140px; resize:vertical; }
.c-form input:focus,.c-form select:focus,.c-form textarea:focus{ outline:2px solid var(--cy); outline-offset:2px; }
.c-form .submit{ border:0; cursor:pointer; background:var(--nv9); color:#fff; text-decoration:none;
  width:100%; padding:16px 36px; font-size:14.5px; font-weight:700; display:block; }
.c-form .submit:hover{ background:var(--nv); }
.c-form .submit:disabled{ cursor:not-allowed; opacity:.52; }
.c-form .hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.c-form .cf-turnstile{ margin-bottom:22px; }

/* お問い合わせページ 2カラム（フォーム＋電話・許可番号サイドバー。v0.9で導入） */
.c-contact-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(32px,5vw,72px); align-items:start; }
.c-contact-grid .c-form{ margin-top:0; max-width:none; }
.c-contact-info{ background:var(--lt); padding:clamp(30px,4vw,44px) clamp(24px,3vw,34px); }
.c-contact-info h2{ margin:14px 0 0; font-size:clamp(19px,2vw,23px); font-weight:900; color:var(--nv9); line-height:1.55; }
.c-contact-info .tel-big{ display:block; margin-top:20px; font-family:"Archivo",sans-serif;
  font-size:clamp(24px,2.6vw,29px); font-weight:700; color:var(--nv9); text-decoration:none; letter-spacing:.02em; }
.c-contact-info .tel-big:hover{ color:var(--cy); }
.c-contact-info .c-contact-note{ margin-top:22px; padding-top:18px; border-top:1px solid var(--ln);
  font-size:11.5px; line-height:1.9; color:var(--sub); }
@media (max-width:860px){ .c-contact-grid{ grid-template-columns:1fr; gap:28px; } }

/* お知らせ一覧・個別記事（icubedsystems.com参考の日付+タグ+見出し1行レイアウトに刷新・2026-09-14） */
.c-news-list{ margin-top:52px; border-top:1px solid var(--ln); }
.c-news-item{ display:grid; grid-template-columns:100px 132px 1fr; align-items:center; gap:20px;
  padding:20px 14px; margin:0 -14px; border-bottom:1px solid var(--ln); text-decoration:none; color:inherit;
  border-radius:6px; transition:background .12s ease; }
.c-news-item:hover{ background:var(--lt); }
.c-news-item time{ font-family:"Archivo",sans-serif; font-size:12.5px; letter-spacing:.04em; color:var(--sub);
  font-variant-numeric:tabular-nums; }
.c-news-item-cat{ justify-self:start; font-size:11.5px; font-weight:700; color:var(--cy);
  box-shadow:inset 0 0 0 1px var(--cy); border-radius:3px; padding:4px 10px; white-space:nowrap; }
.c-news-item-title{ font-size:15.5px; font-weight:700; color:var(--nv9); line-height:1.6; }
.c-news-item:hover .c-news-item-title{ color:var(--cy); }
@media (max-width:620px){
  .c-news-item{ grid-template-columns:1fr; gap:8px; padding:18px 14px; }
  .c-news-item-cat{ justify-self:start; }
}

/* お知らせが0件の時の表示（「未完成」でなく「現在空の一覧」に見せる。v0.9で追加） */
.c-news-empty{ padding:32px 0 40px; border-top:1px solid var(--ln); border-bottom:1px solid var(--ln); }
.c-news-empty .lbl{ display:block; margin-bottom:14px; }
.c-news-empty p{ margin:0; font-size:15px; font-weight:700; color:var(--nv9); }
.c-news-empty p + p{ margin-top:8px; font-size:13px; font-weight:400; color:var(--sub); }

.c-article{ margin-top:36px; max-width:760px; }
.c-article time{ font-family:"Archivo",sans-serif; font-size:12px; letter-spacing:.1em; color:var(--sub); }
.c-article h1{ margin:10px 0 0; font-size:clamp(22px,3vw,32px); font-weight:900; color:var(--nv9); line-height:1.45; }
.c-article .body{ margin-top:36px; font-size:15px; line-height:2.05; color:var(--ink); }
.c-article .body p{ margin:0 0 20px; }
.c-article .body h2{ margin:40px 0 16px; font-size:17px; font-weight:700; color:var(--nv9); }
.c-article .body ul,.c-article .body ol{ margin:0 0 20px; padding-left:1.4em; }
.c-article .body li{ margin-bottom:8px; }
/* プライバシーポリシーは記事よりも横幅を持たせ、本文右側の余白を抑える。 */
.c-privacy .c-article{ max-width:900px; }

.c-sec{ position:relative; overflow:hidden; }
.c-hero{ overflow:hidden; }

/* ============================================================
   和文組版・共通
   ============================================================ */
.comp h1,.comp h2,.comp h3,.c-h2,.c-jb strong,.c-lic dt{
  word-break:keep-all; overflow-wrap:anywhere; }
.comp p,.comp li,.comp dd{ word-break:normal; overflow-wrap:break-word;
  line-break:strict; }
.comp .kw{ white-space:nowrap; }

@media (prefers-reduced-motion:reduce){ *{ transition:none !important; animation:none !important; }
  html{ scroll-behavior:auto; } }

/* ============================================================
   v0.9 subpage editorial system — 2026-09-15
   TOPで確定した LOCAL WORKFORCE GRID の文法を下層へ展開。
   新しい事実を増やさず、タイポ・線・写真・余白で薄い情報量を成立させる。
   ============================================================ */
.c-submain{ overflow:hidden; }
.c-subhero{ background:var(--nv9); color:#fff; padding:clamp(38px,6vw,72px) 0 clamp(44px,7vw,86px); }
.c-subhero-grid{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr); gap:clamp(28px,5vw,72px); align-items:center; }
.c-subhero-copy .lbl{ color:#7DD3FC; }
.c-subhero h1{ margin:18px 0 0; max-width:12em; font-size:clamp(34px,4.9vw,62px); line-height:1.18; font-weight:900; letter-spacing:-.015em; text-wrap:balance; }
.c-subhero .c-reason-title{ font-size:clamp(30px,4.1vw,52px); letter-spacing:-.045em; white-space:nowrap; }
.c-subhero .lead{ margin:24px 0 0; max-width:38em; color:#A8B6CB; font-size:14.5px; line-height:2.05; }
.c-subhero-route{ margin:28px 0 0; font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.13em; color:#7DD3FC; text-transform:uppercase; }
.c-subhero-route span{ color:rgba(255,255,255,.34); padding:0 .35em; }
.c-sub-photo{ margin:0; position:relative; }
.c-sub-photo img{ display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; filter:saturate(.9) contrast(1.03); }
.c-sub-photo figcaption{ display:flex; justify-content:space-between; gap:18px; margin-top:10px; font-family:"Archivo",sans-serif; font-size:10.5px; line-height:1.65; letter-spacing:.12em; color:#A8B6CB; text-transform:uppercase; }
.c-sub-photo figcaption small{ font-family:"FOT-ニューロダン ProN M",sans-serif; font-size:10.5px; letter-spacing:.02em; text-transform:none; white-space:nowrap; color:#71819A; }
/* 下層HEROは見出しとルートラベルを優先し、写真下の重複キャプションは表示しない。
   画像の説明はalt、素材情報はHTMLソースに保持する。TOPのFIELD DOCUMENTARY表記は維持。 */
.c-sub-photo figcaption{ display:none; }

.c-subsec{ padding:clamp(68px,8vw,112px) 0; }
.c-subsec.lt{ background:var(--lt); }
.c-sub-index{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:15px; border-bottom:1px solid var(--ln); font-family:"Archivo",sans-serif; font-size:10.5px; font-weight:700; letter-spacing:.14em; color:var(--sub); text-transform:uppercase; }
.c-sub-index .lbl{ font-size:10.5px; }
.c-sub-intro{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(300px,1.1fr); gap:clamp(32px,7vw,96px); align-items:start; margin-top:34px; }
.c-sub-intro .c-h2{ margin-top:0; }
.c-sub-intro > p{ margin:0; max-width:42em; font-size:14px; line-height:2.1; color:var(--sub); }
.c-sub-intro > p + p{ margin-top:16px; }

/* 長文のメッセージは、主文と補足を分けて視線の入口をつくる。 */
.c-message-copy{ max-width:42em; }
.c-message-copy .c-message-lead{ margin:0; font-size:16px; line-height:2; color:var(--nv9); font-weight:700; }
.c-message-details{ display:grid; gap:18px; margin-top:26px; padding-top:24px; border-top:1px solid var(--ln); }
.c-message-details p{ margin:0; padding-left:16px; border-left:2px solid var(--cy); font-size:13.5px; line-height:2.05; color:var(--sub); }

.c-editorial-rows{ margin-top:50px; border-top:1px solid var(--ln); }
.c-editorial-row{ display:grid; grid-template-columns:90px minmax(190px,.82fr) minmax(280px,1.18fr); gap:clamp(20px,4vw,54px); align-items:start; padding:34px 0 38px; border-bottom:1px solid var(--ln); }
.c-editorial-num{ font-family:"Archivo",sans-serif; font-size:clamp(42px,5.2vw,70px); line-height:1; font-weight:400; letter-spacing:-.04em; color:var(--cy); }
.c-editorial-row .lbl{ margin-top:3px; }
.c-editorial-row h3{ margin:9px 0 0; color:var(--nv9); font-size:clamp(20px,2vw,27px); line-height:1.45; font-weight:900; }
.c-editorial-row p{ margin:2px 0 0; font-size:13.5px; line-height:2.05; color:var(--sub); max-width:46em; }
.c-editorial-row > .c-editorial-copy{ grid-column:3; }
.c-editorial-copy{ display:grid; gap:16px; }
.c-editorial-copy p{ margin:0; }
.c-editorial-copy p + p{ padding-top:16px; border-top:1px solid var(--ln); }

.c-service-pair{ margin-top:50px; border-top:1px solid var(--ln); }
.c-service-item{ display:grid; grid-template-columns:90px minmax(220px,.9fr) minmax(300px,1.1fr); gap:clamp(20px,4vw,54px); padding:36px 0 40px; border-bottom:1px solid var(--ln); align-items:start; }
.c-service-item .num{ font-family:"Archivo",sans-serif; font-size:12px; letter-spacing:.13em; color:var(--cy); font-weight:700; }
.c-service-item h3{ margin:0; color:var(--nv9); font-size:clamp(22px,2.4vw,31px); line-height:1.4; font-weight:900; }
.c-service-item p{ margin:0; font-size:13.5px; line-height:2.05; color:var(--sub); }

.c-linear-flow{ counter-reset:flow; margin:52px 0 0; padding:0; list-style:none; border-top:1px solid var(--ln); }
.c-linear-flow li{ counter-increment:flow; position:relative; display:grid; grid-template-columns:80px minmax(180px,.8fr) minmax(280px,1.2fr); gap:clamp(20px,4vw,48px); padding:27px 0 30px; border-bottom:1px solid var(--ln); }
.c-linear-flow li::before{ content:counter(flow, decimal-leading-zero); font-family:"Archivo",sans-serif; font-size:13px; font-weight:700; letter-spacing:.12em; color:var(--cy); }
.c-linear-flow h3{ margin:0; font-size:17px; line-height:1.65; color:var(--nv9); }
.c-linear-flow p{ margin:0; font-size:13px; line-height:1.95; color:var(--sub); }

.c-route-line{ position:relative; display:grid; grid-template-columns:repeat(5,1fr); margin:56px 0 0; padding:0; list-style:none; }
.c-route-line::before{ content:""; position:absolute; top:10px; left:0; right:0; height:2px; background:var(--cy); }
.c-route-line li{ position:relative; padding:35px 12px 10px 0; min-height:120px; }
.c-route-line li::before{ content:""; position:absolute; top:5px; left:0; width:11px; height:11px; border-radius:50%; background:#fff; border:2px solid var(--cy); }
.c-route-line li.base::before{ background:var(--cy); }
.c-route-line .en{ display:block; font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--sub); }
.c-route-line strong{ display:block; margin-top:8px; font-size:clamp(25px,2.8vw,36px); line-height:1.1; font-weight:900; color:var(--nv9); }
.c-route-line small{ display:block; margin-top:8px; font-size:11px; line-height:1.6; color:var(--cy); font-weight:700; }

.c-field-groups{ margin-top:50px; border-top:1px solid var(--ln); }
.c-field-group{ display:grid; grid-template-columns:90px minmax(240px,.9fr) minmax(280px,1.1fr); gap:clamp(20px,4vw,54px); padding:38px 0 42px; border-bottom:1px solid var(--ln); }
.c-field-level{ font-family:"Archivo",sans-serif; font-size:clamp(48px,6vw,82px); line-height:.95; font-weight:400; letter-spacing:-.05em; color:var(--cy); }
.c-field-group h3{ margin:5px 0 0; font-size:clamp(23px,2.4vw,32px); line-height:1.4; font-weight:900; color:var(--nv9); }
.c-field-group .lbl{ margin-bottom:8px; }
.c-field-list{ display:flex; flex-wrap:wrap; gap:7px 16px; align-content:flex-start; margin:4px 0 0; padding:0; list-style:none; }
.c-field-list li{ position:relative; padding-left:12px; font-size:13px; line-height:1.8; color:var(--sub); }
.c-field-list li::before{ content:""; position:absolute; left:0; top:.78em; width:4px; height:4px; border-radius:50%; background:var(--cy); }
.c-field-bridge{ margin:30px 0 0 90px; padding-left:26px; border-left:2px solid var(--cy); }
.c-field-bridge .lbl{ color:var(--cy); }
.c-field-bridge p{ margin:8px 0 0; font-size:13px; line-height:1.95; color:var(--sub); }

/* ヒアリングで確認できた稼働実績は、抽象的な説明から分けて見せる。 */
.c-case{ display:grid; grid-template-columns:minmax(180px,.7fr) minmax(300px,1.3fr); gap:clamp(24px,5vw,72px); margin-top:48px; padding:26px 0 28px; border-top:2px solid var(--cy); border-bottom:1px solid var(--ln); }
.c-case-label{ display:flex; flex-direction:column; gap:10px; }
.c-case-label strong{ color:var(--nv9); font-size:15px; letter-spacing:.02em; }
.c-case-main{ display:grid; grid-template-columns:minmax(190px,.8fr) 1.2fr; gap:28px; align-items:start; }
.c-case-main h3{ margin:0; color:var(--nv9); font-size:clamp(20px,2.3vw,30px); line-height:1.45; font-weight:900; }
.c-case-main h3 b{ color:var(--cy); font-size:1.25em; }
.c-case-main p{ margin:3px 0 0; color:var(--sub); font-size:13.5px; line-height:2.05; }

.c-inline-link{ display:inline-block; margin-top:30px; color:var(--nv9); font-size:13px; font-weight:700; text-decoration:none; border-bottom:1px solid var(--nv9); padding-bottom:3px; }
.c-inline-link:hover{ color:var(--cy); border-color:var(--cy); }
.c-v09-note{ margin-top:28px; padding:16px 0 0; border-top:1px solid var(--ln); font-size:12px; line-height:1.8; color:var(--sub); }
.c-cost-list{ margin:52px 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid var(--ln); background:var(--ln); }
.c-cost-list > div{ min-height:148px; padding:24px 22px 26px; background:#fff; }
.c-cost-list dt{ font-size:12px; font-weight:700; color:var(--sub); }
.c-cost-list dd{ margin:18px 0 0; }
.c-cost-list dd strong{ display:block; font-size:22px; line-height:1.35; color:var(--cy); }
.c-cost-list dd span{ display:block; margin-top:4px; font-size:13px; line-height:1.8; color:var(--sub); }

@media (max-width:900px){
  .c-subhero-grid{ grid-template-columns:1fr 1fr; gap:28px; }
  .c-subhero h1{ font-size:clamp(31px,5vw,48px); }
  .c-sub-intro{ gap:40px; }
  .c-editorial-row,.c-service-item,.c-field-group{ grid-template-columns:70px minmax(180px,.9fr) minmax(240px,1.1fr); gap:22px; }
  .c-linear-flow li{ grid-template-columns:60px minmax(150px,.8fr) minmax(220px,1.2fr); gap:20px; }
}
@media (max-width:700px){
  .c-subhero{ padding:36px 0 48px; }
  .c-subhero-grid{ grid-template-columns:1fr; }
  .c-subhero h1{ font-size:clamp(34px,10vw,50px); max-width:10em; }
  .c-subhero .c-reason-title{ font-size:clamp(23px,7.2vw,36px); letter-spacing:-.06em; }
  .c-subhero .lead{ font-size:13px; }
  .c-sub-photo img{ aspect-ratio:16/9; }
  .c-sub-photo figcaption{ display:none; }
  .c-sub-index{ align-items:flex-start; flex-direction:column; gap:6px; }
  .c-sub-intro{ grid-template-columns:1fr; gap:22px; margin-top:28px; }
  .c-editorial-row,.c-service-item,.c-field-group{ grid-template-columns:1fr; gap:12px; padding:28px 0 31px; }
  .c-editorial-row p,.c-service-item p,.c-field-list{ grid-column:auto; }
  .c-editorial-row > .c-editorial-copy{ grid-column:auto; }
  .c-editorial-num{ font-size:46px; }
  .c-linear-flow li{ grid-template-columns:46px 1fr; gap:14px; }
  .c-linear-flow li p{ grid-column:2; }
  .c-route-line{ display:block; margin:38px 0 0 7px; }
  .c-route-line::before{ top:0; bottom:0; left:0; right:auto; width:2px; height:auto; }
  .c-route-line li{ padding:16px 0 22px 24px; min-height:0; }
  .c-route-line li::before{ top:23px; left:-5px; }
  .c-route-line strong{ font-size:32px; }
  .c-field-bridge{ margin-left:54px; }
  .c-case{ grid-template-columns:1fr; gap:14px; margin-top:36px; padding:22px 0 24px; }
  .c-case-main{ grid-template-columns:1fr; gap:12px; }
  .c-message-copy .c-message-lead{ font-size:14px; }
  .c-message-details{ margin-top:22px; padding-top:20px; }
  .c-cost-list{ grid-template-columns:1fr; }
  .c-cost-list > div{ min-height:0; padding:20px; }
  .c-cost-list dd{ display:flex; align-items:baseline; gap:8px; margin-top:10px; }
  .c-cost-list dd strong,.c-cost-list dd span{ display:inline; }
}

@media (prefers-reduced-motion:no-preference){
  .c-subhero-copy{ animation:c-sub-rise .6s ease-out both; }
  .c-sub-photo img{ animation:c-sub-photo-in .8s ease-out both; }
  @keyframes c-sub-rise{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:translateY(0); } }
  @keyframes c-sub-photo-in{ from{ opacity:0; transform:scale(1.025); } to{ opacity:1; transform:scale(1); } }
}

/* Mobile navigation: no-JS details menu for provisional release. */
.c-mobile-nav{ display:none; position:relative; }
.c-mobile-nav summary{ list-style:none; cursor:pointer; font-family:"Archivo",sans-serif; font-size:11px; font-weight:700; letter-spacing:.12em; color:var(--nv9); border:1px solid var(--ln); padding:10px 12px; }
.c-mobile-nav summary::-webkit-details-marker{ display:none; }
.c-mobile-panel{ position:absolute; right:0; top:calc(100% + 10px); width:min(300px,calc(100vw - 36px)); padding:10px; background:#fff; border:1px solid var(--ln); box-shadow:0 12px 32px rgba(10,30,60,.12); }
.c-mobile-panel a{ display:block; padding:11px 12px; color:var(--ink); text-decoration:none; font-size:13px; border-bottom:1px solid var(--ln); }
.c-mobile-panel a:last-child{ border-bottom:0; }
.c-mobile-panel a.contact{ margin-top:8px; background:var(--nv9); color:#fff; text-align:center; border:0; font-weight:700; }
@media (max-width:900px){ .c-mobile-nav{ display:block; } }
@media (max-width:700px){ .c-hd .c-cta{ display:none; } }

@media (max-width:760px){
  .c-cv .in{ display:block; }
  .c-cv .in > .grp{ margin-top:30px; }
  .c-cv .grp{ display:grid; grid-template-columns:1fr; width:100%; gap:12px; }
  .c-cv .tel,.c-cv .frm{ width:100%; justify-content:center; text-align:center; }
}

/* reason/draft.html — 営業資料用の図解レイヤー。仕様の線・余白・トークンを継承。 */
.c-reasons-sec{ background:var(--gray-bg); }
/* draft.htmlのFour Reasonsセクションだけの列幅・左寄せ調整（.c-editorial-rowはabout/reason本番ページと共有のため直接上書きしない） */
.c-reasons-sec .c-editorial-row{ grid-template-columns:90px minmax(190px,4fr) minmax(280px,6fr); }
.c-reasons-sec .c-editorial-row .lbl{ text-align:left; }

/* Four Reasonsとは切り離した「事例」インサート。カード列とは違う見た目にして区分けする */
.c-case-sec{ background:var(--gray-bg); }
.c-case-card{ background:#fff; border-left:4px solid var(--cy); padding:clamp(28px,4.5vw,48px) clamp(24px,4.5vw,56px); }
.c-case-head .lbl{ display:block; margin-bottom:10px; }
.c-case-company{ margin:10px 0 0; color:var(--sub); font-size:12.5px; letter-spacing:.02em; }
.c-case-top{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.c-case-photo{ flex:0 0 240px; max-width:240px; order:2; }
.c-case-photo img{ display:block; width:100%; height:auto; border-radius:4px; }
.c-case-head{ flex:1 1 320px; min-width:0; order:1; }
@media (min-width:701px){
  .c-case-photo{ margin-top:37px; }
}
.c-case-qa{ margin-top:22px; display:grid; gap:28px; max-width:56em; }
.c-case-qa-item{ display:grid; gap:8px; }
.c-case-q{ margin:0; display:flex; gap:10px; align-items:baseline; font-size:15px; font-weight:700; color:var(--nv9); line-height:1.6; }
.c-case-q-mark{ flex:0 0 auto; font-family:"Archivo",sans-serif; font-size:13px; font-weight:700; color:var(--cy); }
.c-case-a{ margin:0 0 0 24px; font-size:14px; line-height:2; color:var(--sub); }
@media (max-width:700px){
  .c-case-a{ margin-left:0; }
  .c-case-card{ padding:24px 18px; }
  .c-case-photo{ flex-basis:100%; max-width:none; }
}
.c-editorial-heading{ min-width:0; }
.c-reason-icon{ display:grid; place-items:center; width:56px; height:56px; margin-bottom:16px;
  color:var(--cy); background:#fff; border:1px solid var(--ln); }
.c-reason-icon svg{ display:block; width:34px; height:34px; }
.c-reason-visual{ margin-top:24px; padding:18px 20px 20px; background:#fff; border-top:2px solid var(--cy); }
.c-margin-visual{ margin-top:40px; }
.c-reasons-sec .c-editorial-rows > .c-editorial-row:last-child{ border-bottom:none; }
.c-margin-layout{ display:grid; grid-template-columns:minmax(170px,3fr) minmax(280px,7fr); gap:24px; align-items:start; }
.c-margin-heading .lbl{ display:block; margin-bottom:10px; }
.c-margin-title{ margin:0; color:var(--nv9); font-size:19px; line-height:1.4; font-weight:900; }
.c-margin-sub{ margin:0 0 13px; padding-bottom:13px; border-bottom:1px solid var(--ln); color:var(--sub); font-size:11px; line-height:1.6; }
@media (max-width:700px){
  .c-margin-layout{ grid-template-columns:1fr; gap:16px; }
}
.c-visual-head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding-bottom:13px; border-bottom:1px solid var(--ln); }
.c-visual-head .lbl{ font-size:10px; }
.c-visual-head > span:last-child{ color:var(--sub); font-size:11px; line-height:1.6; }

/* 01: 入学 → 育成（N3/N2）。配属はテキスト側で「柔軟に相談」と案内するため図には含めない */
.c-training-timeline{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:0; padding:27px 0 0; list-style:none; }
.c-training-timeline::before{ content:""; position:absolute; top:31px; left:0; right:0; height:1px; background:var(--cy); }
.c-training-timeline li{ position:relative; min-width:0; padding-right:4px; }
.c-step-marker{ position:relative; z-index:1; display:block; width:10px; height:10px; margin:0 0 13px; background:#fff; border:2px solid var(--cy); }
.c-training-timeline li:first-child .c-step-marker,.c-training-timeline li.is-end .c-step-marker{ background:var(--cy); }
.c-training-timeline b{ display:block; color:var(--nv9); font-family:"Archivo",sans-serif; font-size:15px; line-height:1.35; font-variant-numeric:tabular-nums; }
.c-training-timeline small{ display:block; margin-top:5px; color:var(--sub); font-size:11px; line-height:1.7; }

/* 02: 2つの許可を並列に見せる */
.c-license-diagram{ display:grid; grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr); gap:10px; align-items:center; padding-top:16px; }
.c-license-node{ display:flex; min-height:88px; flex-direction:column; justify-content:center; padding:12px 14px; border:1px solid var(--ln); }
.c-license-node .lbl{ font-size:9px; }
.c-license-node strong{ display:block; margin-top:4px; color:var(--nv9); font-size:18px; line-height:1.35; }
.c-license-node small{ display:block; margin-top:3px; color:var(--sub); font-size:10px; line-height:1.5; }
.c-license-join{ color:var(--cy); font-family:"Archivo",sans-serif; font-size:22px; text-align:center; }

/* 04: 指定された3本だけで構成するマージン率比較 */
.c-margin-chart{ display:grid; gap:13px; padding-top:17px; }
.c-margin-row{ display:grid; grid-template-columns:minmax(128px,.9fr) minmax(110px,1.7fr) auto; gap:12px; align-items:center; color:var(--sub); font-size:11px; line-height:1.45; }
.c-margin-row strong{ min-width:72px; color:var(--nv9); font-family:"Archivo",sans-serif; font-size:13px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.c-margin-row.is-target > span:first-child{ font-size:12.5px; font-weight:700; color:var(--nv9); }
.c-margin-track{ position:relative; height:12px; overflow:hidden; background:var(--navy-100); border-left:1px solid var(--navy-700); border-right:1px solid var(--navy-700); }
.c-margin-fill{ display:block; height:100%; background:var(--navy-800); }
.c-margin-fill.is-secondary{ background:var(--navy-700); }
.c-margin-fill.is-target{ background:var(--cy); }
.c-margin-legend{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:13px 0 0; color:var(--sub); font-size:10.5px; line-height:1.6; }
.c-legend-swatch{ display:inline-block; width:10px; height:10px; border-radius:1px; }
.c-legend-swatch.is-margin{ background:var(--navy-800); }
.c-legend-swatch.is-wage{ background:var(--navy-100); border:1px solid var(--navy-700); }
.c-margin-lead{ margin:15px 0 0; color:var(--nv9); font-size:12.5px; line-height:1.75; }
.c-chart-notes{ margin:10px 0 0; padding:0; list-style:none; display:grid; gap:6px; }
.c-chart-notes li{ position:relative; padding-left:14px; color:var(--sub); font-size:10.5px; line-height:1.75; }
.c-chart-notes li::before{ content:"※"; position:absolute; left:0; }
.c-chart-source{ margin:15px 0 0; color:var(--sub); font-size:10.5px; line-height:1.75; }

@media (max-width:900px){
  .c-reason-visual{ padding-left:16px; padding-right:16px; }
  .c-margin-row{ grid-template-columns:minmax(116px,.9fr) minmax(100px,1.5fr) auto; gap:9px; }
}
@media (max-width:700px){
  /* すべてのカードで「番号｜アイコン＋見出し」を同じヘッダーとして見せる（draft.htmlのFour Reasonsのみ。.c-editorial-rowはabout/reason本番ページと共有のためスコープする）。 */
  .c-reasons-sec .c-editorial-row{ grid-template-columns:44px minmax(0,1fr); grid-template-areas:"num heading" "copy copy";
    column-gap:14px; row-gap:16px; align-items:start; }
  .c-reasons-sec .c-editorial-num{ grid-area:num; align-self:start; padding-top:7px; font-size:34px; line-height:1; }
  .c-editorial-heading{ grid-area:heading; display:grid; grid-template-columns:48px minmax(0,1fr); grid-template-rows:auto auto; column-gap:11px; row-gap:3px; min-width:0; }
  .c-editorial-heading .c-reason-icon{ grid-column:1; grid-row:1 / 3; align-self:center; }
  .c-editorial-heading > .lbl{ grid-column:2; grid-row:1; align-self:end; }
  .c-reasons-sec .c-editorial-row .lbl{ margin-top:0; line-height:1.25; }
  .c-editorial-heading > h3{ grid-column:2; grid-row:2; }
  .c-reasons-sec .c-editorial-row h3{ margin:2px 0 0; font-size:clamp(18px,5.4vw,22px); line-height:1.35; }
  .c-reasons-sec .c-editorial-row > .c-editorial-copy{ grid-area:copy; grid-column:1 / -1; min-width:0; }
  .c-reason-icon{ width:48px; height:48px; margin-bottom:0; flex:0 0 48px; }
  .c-reason-icon svg{ width:30px; height:30px; }

  /* 図解は本文との間隔を一段だけにして、カード内の視線をつなげる。 */
  .c-reason-visual{ margin-top:0; padding:16px 14px 17px; }
  .c-visual-head{ align-items:baseline; flex-direction:row; gap:12px; }
  .c-visual-head .lbl{ flex:0 0 auto; }
  .c-visual-head > span:last-child{ min-width:0; text-align:right; }

  /* 01: 3項目を常に1本の時間軸に収め、単独の折り返し行を作らない。 */
  .c-training-timeline{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding-top:24px; }
  .c-training-timeline::before{ display:block; top:29px; }
  .c-training-timeline li{ padding-right:0; }
  .c-step-marker{ margin-bottom:9px; }
  .c-training-timeline b{ font-size:13.5px; }
  .c-training-timeline small{ font-size:10px; line-height:1.6; }

  /* 02: 2つの経路は縦積み＋中央の「＋」で、狭い幅でも意味を保つ。 */
  .c-license-diagram{ grid-template-columns:minmax(0,1fr); gap:8px; }
  .c-license-node{ min-height:0; padding:11px 12px; }
  .c-license-join{ line-height:1; }

  /* 04: ラベルと数値、棒を段階化して、数値が棒を押しつぶさないようにする。 */
  .c-margin-row{ grid-template-columns:minmax(0,1fr) auto; gap:5px 10px; }
  .c-margin-row .c-margin-track{ grid-column:1 / -1; grid-row:2; min-width:0; width:100%; }
  .c-margin-row strong{ min-width:0; }
}
