:root{
    --navy:#16233B;      /* 基調の濃紺 */
    --navy2:#1F3352;     /* 明るめの紺 */
    --ink:#2A2E35;       /* 本文の墨色 */
    --paper:#FFFFFF;
    --mist:#F5F6F4;      /* 交互セクションの淡色 */
    --gold:#A8895A;      /* 罫線・小見出しの金茶（全体アクセント、変更なし） */
    --gold-strong:#8A6A3D; /* 小見出しラベル(.eyebrow)専用の濃いゴールド。視認性重視 */
    --gold-contact:#E0C28F; /* 濃紺背景（お問い合わせ等）の上の.eyebrow専用。明るいゴールド */
    --gold-cta:#7C5C2E;   /* ヒーローCTAボタン（.btn-primary）専用の濃いゴールド。
                              2026-08-20 ヒロさん指示：ボタンの金色をもう少し濃く。
                              page-ai-shain-lp-v1.php と同内容（プレビュー用複製） */
    --line:#D9DCE1;
    --cream:#FDFBEF;     /* AI社員ができることカードの本文背景。淡いアイボリー */
    --cream-line:#E8E2C8; /* クリーム背景のカード枠線。var(--line)を暖色寄りに調整 */
    --serif:"Yu Mincho","YuMincho","Hiragino Mincho ProN","BIZ UDMincho","MS PMincho",serif;
    --sans:"Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    .reveal{opacity:1 !important;transform:none !important;transition:none !important;}
  }
  body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.9;font-size:16px;}
  img{max-width:100%;}
  a{color:inherit;}
  a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
    outline:2px solid var(--gold);outline-offset:2px;
  }

  /* ---------- ヘッダー ---------- */
  .header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);}
  .header-in{max-width:1080px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
  /* ロゴをサービス名主体に拡大（旧17px→22px）。会社名はロゴから外し
     nav末尾の.nav-companyへ移設したため、旧 .logo small は不要 */
  .logo{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:.06em;color:var(--navy);text-decoration:none;white-space:nowrap;}
  .logo-emphasis{color:#B3261E;}
  /* 会社名はヘッダー右端に配置（2026-08-05 ヒロさん指示：区切り線なし・
     太字で拡大。header-in は justify-content:space-between のため、
     3つ目の子要素として置くだけで自動的に右端に来る）。狭い画面では
     nav の折り返しと衝突するため、640px以下は非表示にする */
  .header-company{font-family:var(--serif);font-size:14px;font-weight:700;letter-spacing:.05em;
    color:var(--navy);white-space:nowrap;}
  .nav{display:flex;align-items:baseline;gap:22px;font-size:13px;letter-spacing:.08em;}
  .nav a{text-decoration:none;color:var(--navy);padding:4px 0;border-bottom:2px solid transparent;}
  .nav a:hover{border-bottom-color:var(--gold);}
  .nav-static,.flinks .nav-static{color:var(--navy);opacity:.45;padding:4px 0;cursor:default;}

  /* ---------- ヒーロー（全面イラスト・フルスクリーン） ---------- */
  /* 文字・CTAは縦中央に配置し、写真は上下均等にカットされる形にする
     （2026-08-05 ヒロさん指示：PC版も下部が間延びしていたため、スマホと
     同じ考え方で中央寄せに変更。align-items:flex-start だった旧値では
     下側に大きな余白が残っていた） */
  .hero{position:relative;overflow:hidden;display:flex;align-items:center;min-height:clamp(560px,86vh,760px);min-height:clamp(560px,86dvh,760px);background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 100%);color:#F2F4F8;}
  .hero-bg{position:absolute;inset:0;background-image:url("./hero.jpg");background-size:cover;background-position:right bottom;background-repeat:no-repeat;}
  .hero-shade{position:absolute;inset:0;background:
    linear-gradient(to right,rgba(13,22,38,.92) 0%,rgba(13,22,38,.80) 32%,rgba(22,35,59,.45) 58%,rgba(22,35,59,.15) 82%,transparent 100%),
    linear-gradient(to bottom,transparent 55%,rgba(13,22,38,.4) 100%);}
  .hero-in{position:relative;width:100%;max-width:1080px;margin:0 auto;padding:120px 24px;}
  .hero-copy{max-width:960px;}
  .hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(30px,4.6vw,52px);line-height:1.55;letter-spacing:.05em;text-shadow:0 2px 14px rgba(10,18,32,.45);color:#F2F4F8;}
  .hero-sub{margin-top:26px;font-size:clamp(17px,2vw,20px);line-height:1.95;color:#DDE4EE;max-width:38em;text-shadow:0 1px 10px rgba(10,18,32,.5);}
  .hero-sub strong{color:#F6F1E7;font-weight:600;}
  .hero-cta{margin-top:40px;display:flex;gap:14px;flex-wrap:wrap;}
  .btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:14px;letter-spacing:.14em;padding:13px 34px;border:1px solid var(--gold);transition:background .25s,color .25s;}
  .btn-primary{background:var(--gold-cta);border-color:var(--gold-cta);color:#FFFFFF;font-weight:700;font-size:16px;}
  .btn-primary:hover{background:transparent;color:#F2F4F8;}
  .btn-outline{color:#F2F4F8;background:rgba(13,22,38,.35);}
  .btn-outline:hover{border-color:#F2F4F8;}
  .btn-arrow{transition:transform .25s;}
  .btn:hover .btn-arrow{transform:translateX(4px);}

  /* ---------- 経営理念（事業内容と同じ体裁のセクション） ---------- */
  .rinen-text{font-family:var(--serif);font-weight:600;font-size:clamp(20px,2.6vw,28px);line-height:2.1;letter-spacing:.1em;color:var(--navy);margin-top:14px;}

  /* ---------- 共通セクション ---------- */
  .section{padding:88px 24px;}
  .section.alt{background:var(--mist);}
  .section-in{max-width:1080px;margin:0 auto;}
  .eyebrow{font-size:12px;font-weight:700;letter-spacing:.34em;color:var(--gold-strong);display:flex;align-items:center;gap:14px;}
  .eyebrow::after{content:"";height:2px;width:56px;background:var(--gold-strong);}
  .heading{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3vw,32px);letter-spacing:.08em;color:var(--navy);margin:14px 0 40px;}
  .lead{max-width:44em;font-size:15px;line-height:2;color:#4B5563;margin-bottom:40px;}

  /* ---------- 共感セクション ---------- */
  .empathy-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 44px;margin-top:10px;}
  .empathy-item{display:flex;gap:14px;align-items:flex-start;font-size:15px;line-height:1.9;}
  .empathy-check{flex:0 0 22px;width:22px;height:22px;border:1px solid var(--gold);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:12px;margin-top:3px;}

  /* ---------- 導入までの流れ（4ステップのフロー図） ---------- */
  .flowmap{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}
  .fstep{min-width:0;display:flex;flex-direction:column;}
  /* 番号の丸と、次のステップへ伸びる横線。最後の1つだけ線を出さない */
  .fstep-badge{position:relative;height:74px;display:flex;align-items:center;margin-bottom:24px;}
  .fstep-badge::after{content:"";position:absolute;left:74px;right:-26px;top:50%;height:1px;background:var(--gold);}
  .fstep:last-child .fstep-badge::after{display:none;}
  .fstep-num{position:relative;z-index:1;flex:0 0 74px;width:74px;height:74px;border-radius:50%;
    background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;
    font-family:var(--serif);font-size:25px;line-height:1;letter-spacing:.06em;}
  .fstep-num small{font-family:var(--sans);font-weight:700;font-size:9px;letter-spacing:.2em;margin-bottom:5px;color:var(--gold-contact);}
  .fstep-tag{position:absolute;left:86px;top:9px;z-index:1;background:var(--gold);color:#fff;
    font-size:11px;letter-spacing:.16em;padding:3px 12px;white-space:nowrap;}
  /* 写真は正方形に切り抜く。height:auto を必ず指定すること——これが無いと
     img の height 属性（presentational hint）が効いてしまい、aspect-ratio が無視される */
  .fstep-photo{margin-bottom:18px;overflow:hidden;background:var(--mist);}
  .fstep-photo img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:center;display:block;}
  /* スマホ幅（1列に折り返された状態）では写真1枚が画面幅いっぱいに大きく出て
     圧迫感が強いため、写真の代わりに簡易アイコンを表示する。PC・タブレットでは
     逆にアイコンを隠す（2026-08-05 ヒロさん指示） */
  .fstep-icon{display:none;color:var(--gold);margin-bottom:18px;}
  .fstep-icon svg{width:52px;height:52px;display:block;}
  @media (max-width:640px){
    .fstep-photo{display:none;}
    .fstep-icon{display:block;}
  }
  .fstep h3{font-family:var(--serif);font-weight:600;font-size:17px;letter-spacing:.04em;color:var(--navy);line-height:1.6;margin-bottom:16px;}
  .fstep-term{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.06em;color:#6B7280;
    padding-bottom:14px;margin-bottom:16px;border-bottom:1px dashed var(--line);}
  .fstep-term .t-line{flex:0 0 22px;height:1px;background:var(--gold);}
  .fstep-term .t-value{font-weight:700;font-size:13px;color:var(--gold-strong);}
  .fstep-desc{font-size:13.5px;line-height:1.95;color:#4B5563;margin-bottom:18px;}
  .fstep-list{list-style:none;background:var(--cream);border:1px solid var(--cream-line);
    padding:16px 18px;font-size:13px;line-height:1.9;color:#4B5563;margin-top:auto;}
  .fstep-list li{position:relative;padding-left:16px;}
  .fstep-list li::before{content:"";position:absolute;left:0;top:10px;width:5px;height:5px;border:1px solid var(--gold);border-radius:50%;}
  .biz-note{margin-top:34px;max-width:46em;font-size:14px;line-height:2;color:#4B5563;}

  /* ---------- AI社員ができること ---------- */
  .cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px;}
  .cap-card{border:1px solid var(--cream-line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;}
  .cap-card-head{background:var(--navy);color:#fff;font-weight:700;font-size:clamp(15px,4vw,20px);text-align:center;letter-spacing:.04em;padding:16px 14px;}
  .cap-card-body{background:var(--cream);padding:22px 22px 26px;flex:1;}
  .cap-lead{font-size:14.5px;font-weight:600;line-height:1.8;color:var(--navy);margin-bottom:22px;}
  .cap-card-body ul{list-style:none;font-size:13.5px;line-height:2.15;color:#4B5563;}
  .cap-card-body li{position:relative;padding-left:18px;margin-bottom:4px;}
  .cap-card-body li::before{content:"●";position:absolute;left:0;top:0;color:var(--navy);font-size:9px;line-height:2.15;}
  /* LP版で全文を1行に短縮（2026-08-05 ヒロさん指示）。max-widthは解除して
     section-in の全幅（1080px）を使い、white-space:nowrap で強制1行化。
     ただしスマホ幅では読めなくなるため、640px以下は通常の折り返しに戻す
     （下の@mediaブロックを参照） */
  .cap-legal-note{margin-top:24px;font-size:10px;letter-spacing:-.01em;line-height:1.8;color:#4B5563;border-left:3px solid var(--gold);
    padding:5px 0 5px 14px;white-space:nowrap;overflow-x:auto;}

  /* ---------- 強み訴求 ---------- */
  .strength-lead{font-family:var(--serif);font-weight:600;font-size:clamp(18px,2.2vw,22px);line-height:1.95;color:var(--navy);max-width:44em;letter-spacing:.03em;}
  .strength-badges{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 30px;}
  .strength-badge{background:var(--navy);color:#fff;font-size:12.5px;letter-spacing:.1em;padding:9px 20px;}
  .strength-note{max-width:46em;font-size:14px;line-height:2;}
  .strength-note + .strength-note{margin-top:16px;}
  .strength-fineprint{max-width:46em;font-size:11.5px;line-height:1.8;color:#7C8DA6;margin-top:8px;}
  .stat-box{margin-top:30px;max-width:46em;border-left:3px solid var(--gold);padding:8px 0 8px 20px;font-size:13.5px;line-height:1.95;color:#4B5563;}

  /* ---------- AI社員紹介（組織図スタイル） ---------- */
  .roster{margin-top:0;}
  .brand-note{margin-top:36px;font-size:13px;color:#4B5563;border-left:3px solid var(--gold);padding:6px 0 6px 18px;}

  .team-ceo-zone{display:flex;flex-direction:column;align-items:center;margin-bottom:8px;}
  .team-ceo{background:var(--navy);color:#F2F4F8;text-align:center;max-width:420px;width:100%;padding:26px 40px;border-top:3px solid var(--gold);}
  .team-ceo-photo{width:96px;height:96px;border-radius:50%;object-fit:cover;border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;background:rgba(242,244,248,.08);color:var(--gold);font-family:var(--serif);font-weight:600;font-size:34px;}
  .team-ceo .tc-role{font-size:11px;letter-spacing:.24em;color:var(--gold);}
  .team-ceo .tc-name{font-family:var(--serif);font-weight:600;font-size:30px;letter-spacing:.16em;margin-top:8px;}
  .team-ceo .tc-trait{font-size:12.5px;letter-spacing:.04em;line-height:1.7;color:#DCE3EE;margin-top:12px;}
  .team-ceo .tc-fn{font-size:12.5px;letter-spacing:.1em;color:#C9D2E0;margin-top:14px;padding-top:14px;border-top:1px solid rgba(242,244,248,.22);}
  .team-stem{width:1px;height:32px;background:var(--gold);}

  .dept-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:32px;}
  .dept-grid.row2{grid-template-columns:repeat(3,1fr);max-width:900px;margin:16px auto 0;}
  .dept-grid.row5{grid-template-columns:repeat(5,1fr);max-width:1120px;margin:32px auto 0;}
  .dept-card{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--navy);padding:22px 20px 18px;display:flex;flex-direction:column;}
  .dept-card-head{display:flex;align-items:center;gap:14px;margin-bottom:2px;}
  .dept-photo{flex:0 0 60px;width:60px;height:60px;border-radius:50%;object-fit:cover;border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;background:var(--navy);color:var(--gold);font-family:var(--serif);font-weight:600;font-size:20px;}
  .dept-card .dc-num{font-family:var(--serif);font-size:12px;letter-spacing:.2em;color:var(--gold);}
  .dept-card h3{font-family:var(--serif);font-weight:600;font-size:16px;color:var(--navy);letter-spacing:.03em;margin:6px 0 10px;line-height:1.5;}
  .dept-card-head h3{margin:3px 0 0;}
  .dept-card .dc-person{font-family:var(--serif);font-weight:600;font-size:14px;color:var(--gold);letter-spacing:.08em;padding-bottom:10px;margin-bottom:10px;border-bottom:1px dashed var(--line);}
  .dept-card .dc-trait{font-size:12.5px;line-height:1.7;color:#4B5563;margin-bottom:12px;}
  .dept-card ul{list-style:none;font-size:12.5px;color:#4B5563;line-height:1.9;flex:1;}
  .dept-card li{padding-left:13px;position:relative;margin-bottom:4px;}
  .dept-card li::before{content:"";position:absolute;left:0;top:9px;width:4px;height:4px;background:var(--gold);}
  .dept-card .dc-count{margin-top:14px;padding-top:10px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.06em;color:var(--gold);text-align:right;}

  .team-stats{margin-top:34px;border:1px solid var(--line);background:var(--paper);display:grid;grid-template-columns:repeat(4,1fr);}
  .team-stats div{padding:20px 10px;text-align:center;border-right:1px solid var(--line);}
  .team-stats div:last-child{border-right:none;}
  .team-stats .v{font-family:var(--serif);font-weight:600;font-size:26px;color:var(--navy);}
  .team-stats .l{font-size:12px;color:#4B5563;margin-top:4px;letter-spacing:.06em;}

  /* ---------- 代表挨拶 ---------- */
  /* 写真を左上に浮かせ、文章を周りに回り込ませる雑誌的なレイアウトに変更
     （2026-08-05 ヒロさん指示）。float解除時（スマホ）は下の@mediaを参照 */
  .greet{overflow:hidden;}
  .greet-photo{float:left;margin:0 36px 20px 0;}
  .greet-photo img{width:220px;height:264px;object-fit:cover;display:block;}
  .greet-photo figcaption{font-size:12px;text-align:center;margin-top:10px;letter-spacing:.1em;color:#4B5563;}
  .greet-body p{margin-bottom:1.4em;max-width:40em;}
  .greet-sign{font-family:var(--serif);font-size:15px;letter-spacing:.1em;color:var(--navy);margin-top:30px;}
  .greet-sign b{font-size:20px;margin-left:10px;}
  .quali{font-size:13px;color:#4B5563;margin-top:6px;}

  /* ---------- 結論（LP新設） ---------- */
  /* 共感セクションの直後に置く、宣言的な一枚岩のセクション。濃紺フルブリード＋
     大きな明朝体で、ページの主張をここで一度言い切る（2026-08-05 ヒロさん指示） */
  .conclusion{background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 100%);color:#F2F4F8;text-align:center;padding:96px 24px;}
  .conclusion-in{max-width:820px;margin:0 auto;}
  .conclusion-eyebrow{font-size:12px;font-weight:700;letter-spacing:.34em;color:var(--gold-contact);margin-bottom:22px;}
  /* 2026-08-05：1文に詰め込んだ結論コピーがごちゃついたため、メインキャッチ
     （太字・大）とサブキャッチ（金茶・やや小）の2階層に整理 */
  .conclusion-main{font-family:var(--serif);font-weight:700;font-size:clamp(26px,4.6vw,42px);
    line-height:1.65;letter-spacing:.03em;color:#fff;margin-bottom:26px;}
  .conclusion-sub{font-family:var(--serif);font-weight:600;font-size:clamp(23px,3.4vw,32px);
    line-height:1.8;letter-spacing:.06em;color:var(--gold-contact);}
  .conclusion-sub strong{color:#fff;border-bottom:2px solid var(--gold);font-weight:600;}

  /* ---------- 導入事例（LP新設） ---------- */
  .case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:8px;}
  .case-card{background:var(--paper);border:1px solid var(--line);overflow:hidden;}
  .case-card-photo{aspect-ratio:4/3;background:var(--mist);display:flex;align-items:center;justify-content:center;color:#9CA6B5;font-size:12px;letter-spacing:.1em;}
  .case-card-body{padding:22px 22px 24px;}
  .case-card .cc-tag{font-size:11px;letter-spacing:.14em;color:var(--gold-strong);font-weight:700;}
  .case-card h3{font-family:var(--serif);font-weight:600;font-size:17px;color:var(--navy);margin:10px 0 12px;line-height:1.6;}
  .case-card p{font-size:13.5px;line-height:1.9;color:#4B5563;margin-bottom:16px;}
  .case-card .cc-link{font-size:13px;color:var(--gold-strong);text-decoration:none;border-bottom:1px solid var(--gold-strong);padding-bottom:1px;}
  .case-empty{border:1px dashed var(--line);background:var(--mist);padding:52px 24px;text-align:center;color:#6B7280;font-size:14px;line-height:2;grid-column:1/-1;}

  /* ---------- LINE公式CTA（LP新設） ---------- */
  /* 本文中の2箇所（CTA①②）・お問い合わせ欄で使い回す横長バナー。QRコードは
     実データ反映済み（2026-08-05）。動画サムネイルは特典動画のイメージ用
     （実写ではなくイメージカット）。中央に再生ボタン・下部に白文字キャプションを
     CSSで重ね、動画コンテンツであることを一目で伝える。サムネイルとQRは
     左カラムに縦積み（2026-08-05 ヒロさん指示でサムネイル拡大・QRを下に配置） */
  .line-cta{background:var(--cream);border:1px solid var(--cream-line);display:flex;align-items:center;gap:28px;padding:30px 34px;}
  .line-cta-media{flex:0 0 220px;}
  .line-cta-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--navy);}
  .line-cta-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  .line-cta-thumb-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
  .line-cta-thumb-play span{width:46px;height:46px;border-radius:50%;background:rgba(22,35,59,.6);
    display:flex;align-items:center;justify-content:center;}
  .line-cta-thumb-play span::before{content:"";border-style:solid;border-width:9px 0 9px 14px;
    border-color:transparent transparent transparent #fff;margin-left:3px;}
  .line-cta-thumb-caption{position:absolute;left:0;right:0;bottom:0;padding:22px 14px 10px;
    background:linear-gradient(to top,rgba(13,22,38,.88) 0%,rgba(13,22,38,.35) 65%,transparent 100%);
    color:#fff;font-family:var(--serif);font-weight:600;font-size:14.5px;line-height:1.5;letter-spacing:.03em;}
  .line-cta-qr{margin:12px auto 0;width:88px;height:88px;background:var(--paper);border:1px solid var(--cream-line);
    display:flex;align-items:center;justify-content:center;padding:5px;}
  .line-cta-qr img{width:100%;height:100%;object-fit:contain;display:block;}
  .line-cta-body{flex:1;min-width:0;}
  .line-cta-eyebrow{font-size:11px;font-weight:700;letter-spacing:.2em;color:var(--gold-strong);margin-bottom:8px;}
  .line-cta h3{font-family:var(--serif);font-weight:600;font-size:18px;color:var(--navy);line-height:1.6;margin-bottom:10px;}
  .line-cta h3 .emp{border-bottom:2px solid var(--gold);}
  .line-cta p{font-size:13.5px;line-height:1.9;color:#4B5563;}
  .line-cta-btn{margin-top:16px;display:inline-block;background:#06C755;color:#fff;font-size:13px;font-weight:700;
    letter-spacing:.06em;padding:11px 26px;text-decoration:none;}

  /* ヒーロー内のLINE公式CTA：小さなテキストバッジから、サムネイル付きの
     大きなクリッカブルカードに変更（2026-08-05 ヒロさん指示：もっと目立たせる） */
  .hero-line-cta{margin-top:24px;display:flex;align-items:center;gap:18px;max-width:480px;
    background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.4);padding:14px 22px 14px 14px;
    text-decoration:none;transition:background .25s,border-color .25s;}
  .hero-line-cta:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.6);}
  .hero-line-cta-thumb{position:relative;flex:0 0 100px;aspect-ratio:16/9;overflow:hidden;}
  .hero-line-cta-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  .hero-line-cta-thumb .line-cta-thumb-play span{width:26px;height:26px;}
  .hero-line-cta-thumb .line-cta-thumb-play span::before{border-width:5px 0 5px 8px;margin-left:2px;}
  /* 幅100pxと狭いため、CTA①②の長いキャプションと違い「特典動画」の
     短い1語だけ載せる（2026-08-05 ヒロさん指示：サムネにテロップを追加） */
  .hero-line-cta-thumb-caption{position:absolute;left:0;right:0;bottom:0;padding:5px 6px 3px;
    background:linear-gradient(to top,rgba(13,22,38,.88) 0%,transparent 100%);
    color:#fff;font-family:var(--serif);font-weight:600;font-size:9px;letter-spacing:.03em;}
  .hero-line-cta-body{flex:1;min-width:0;}
  .hero-line-cta-eyebrow{display:block;font-size:10.5px;font-weight:700;letter-spacing:.18em;color:var(--gold-contact);margin-bottom:6px;}
  .hero-line-cta-title{display:block;font-size:15px;font-weight:700;color:#fff;line-height:1.55;margin-bottom:10px;}
  .hero-line-cta-label{display:inline-flex;align-items:center;gap:6px;background:#06C755;color:#fff;
    font-size:12px;font-weight:700;letter-spacing:.04em;padding:8px 18px;}

  /* ---------- お問い合わせ　二択（LP新設） ---------- */
  .contact-choice{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:44px;}
  .choice-card{border:1px solid rgba(255,255,255,.22);padding:26px 24px;}
  .choice-card .ch-label{font-size:11px;letter-spacing:.18em;color:var(--gold-contact);margin-bottom:10px;}
  .choice-card h4{font-family:var(--serif);font-weight:600;font-size:17px;color:#fff;margin-bottom:10px;}
  .choice-card p{font-size:13px;line-height:1.85;color:#C9D2E0;margin-bottom:16px;}

  /* ---------- 会社概要 ---------- */
  .about-table{width:100%;border-collapse:collapse;max-width:820px;}
  .about-table th,.about-table td{border-bottom:1px solid var(--line);padding:20px 10px;text-align:left;vertical-align:top;font-size:15px;line-height:1.9;}
  .about-table th{width:11em;font-weight:600;color:var(--navy);letter-spacing:.1em;white-space:nowrap;}

  /* ---------- お問い合わせ ---------- */
  .contact{background:var(--navy);color:#EDEFF4;}
  .contact .eyebrow{color:var(--gold-contact);}
  .contact .eyebrow::after{background:var(--gold-contact);}
  .contact .heading{color:#fff;}
  .contact-lead{max-width:40em;margin-bottom:44px;font-size:15px;color:#C9D2E0;}
  .form{max-width:640px;}
  .form-row{margin-bottom:24px;}
  .form label{display:block;font-size:13px;letter-spacing:.14em;margin-bottom:8px;color:#C9D2E0;}
  .form label .req{color:var(--gold);font-size:11px;margin-left:8px;}
  .form input:not([type="submit"]),.form select,.form textarea{
    width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.28);
    color:#F2F4F8;padding:12px 14px;font-size:15px;font-family:var(--sans);border-radius:0;
  }
  .form select option{color:var(--ink);}
  .form textarea{min-height:150px;resize:vertical;}
  .form-note{font-size:12px;color:#9FB0C6;margin:6px 0 26px;}
  .form button,.form input[type="submit"]{
    font-family:var(--sans);font-size:14px;letter-spacing:.2em;cursor:pointer;
    background:transparent;color:#F2F4F8;border:1px solid var(--gold);padding:14px 52px;
    transition:background .25s,color .25s;
  }
  .form button:hover,.form input[type="submit"]:hover{background:var(--gold);color:var(--navy);}
  .form-status{margin-top:18px;font-size:14px;color:var(--gold);min-height:1.5em;}
  /* Contact Form 7 が自動生成する要素の見た目合わせ */
  .form .wpcf7-form-control-wrap{display:block;}
  .form .wpcf7-not-valid-tip{display:block;color:#E8A2A2;font-size:12px;margin-top:6px;}
  .form .wpcf7-response-output{margin-top:18px;font-size:14px;color:var(--gold);border:1px solid var(--gold);padding:12px 16px;}
  .form .wpcf7-spinner{display:inline-block;margin-left:10px;}

  /* お問い合わせ種別の選択（2026-08-09 追加）。
     Contact Form 7 の checkbox（exclusive＝1つだけ選べる）を使う。
     項目を縦に並べ、枠で囲って「ここから1つ選ぶ」と分かる形にした。
     ラジオボタンではなくチェックボックスを使っているのは、CF7の
     ラジオボタンには「必須」の指定が無く、未選択のまま送信できて
     しまうため（checkbox* なら必須にできる） */
  .form .inquiry-type .wpcf7-list-item{display:block;margin:0;border-bottom:1px solid rgba(255,255,255,.14);}
  .form .inquiry-type .wpcf7-list-item:last-child{border-bottom:none;}
  .form .inquiry-type .wpcf7-list-item label{display:flex;align-items:center;gap:12px;
    margin:0;padding:13px 16px;cursor:pointer;font-size:14.5px;letter-spacing:.04em;color:#EDEFF4;
    transition:background .2s;}
  .form .inquiry-type .wpcf7-list-item label:hover{background:rgba(255,255,255,.06);}
  .form .inquiry-type input[type="checkbox"]{width:18px;height:18px;flex:none;accent-color:var(--gold);cursor:pointer;}
  .form .inquiry-type .wpcf7-list-item-label{flex:1;}
  .form .inquiry-type .wpcf7-form-control{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.06);display:block;}

  /* プライバシーポリシー同意（2026-08-09 追加）。
     CF7の [acceptance] タグ。チェックしないと送信できない */
  .form-consent{margin:26px 0 24px;padding:16px 18px;border:1px solid rgba(255,255,255,.28);
                background:rgba(255,255,255,.04);}
  .form-consent .wpcf7-list-item{margin:0;}
  .form-consent label{display:flex;align-items:center;gap:12px;margin:0;cursor:pointer;
                      font-size:14px;letter-spacing:.04em;color:#EDEFF4;}
  .form-consent input[type="checkbox"]{width:18px;height:18px;flex:none;accent-color:var(--gold);cursor:pointer;}
  .form-consent a{color:var(--gold-contact);text-decoration:underline;text-underline-offset:3px;}
  .form-consent a:hover{color:#fff;}

  /* ---------- フッター ---------- */
  .footer{background:#0F1929;color:#8FA0B8;padding:34px 24px;text-align:center;font-size:12px;letter-spacing:.14em;}
  .footer .fname{font-family:var(--serif);color:#D5DCE7;font-size:14px;letter-spacing:.2em;margin-bottom:8px;}
  .footer .fmeta{color:#8FA0B8;font-size:12px;line-height:2;letter-spacing:.08em;margin-bottom:2px;}
  .footer .fmeta a{color:inherit;text-decoration:none;}
  .footer .fmeta a:hover{color:#D5DCE7;}
  .footer .flinks{margin-top:14px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap;}
  .footer .flinks a{color:#8FA0B8;text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;}
  .footer .flinks a:hover{color:#D5DCE7;border-bottom-color:var(--gold);}
  .footer .fcopy{margin-top:16px;font-size:11.5px;color:#6F7F96;letter-spacing:.1em;}

  /* ---------- 出現アニメーション ---------- */
  .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease;}
  .reveal.on{opacity:1;transform:none;}

  /* ---------- AI設計思想（振り分けの基準） ---------- */
  .design-subhead{font-family:var(--serif);font-weight:600;font-size:17px;color:var(--navy);letter-spacing:.08em;margin:54px 0 8px;display:flex;align-items:baseline;gap:12px;}
  .design-subhead::before{content:"";width:22px;height:1px;background:var(--gold);position:relative;top:-5px;}
  .section-in > .design-subhead:first-child{margin-top:0;}

  /* 振り分けのものさし */
  .criteria{margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .crit{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--gold);padding:26px 24px;}
  .crit .c-num{font-family:var(--serif);color:var(--gold);font-size:13px;letter-spacing:.2em;}
  .crit h4{font-family:var(--serif);font-weight:600;font-size:16px;color:var(--navy);letter-spacing:.04em;margin:8px 0 10px;line-height:1.5;}
  .crit p{font-size:13.5px;line-height:1.95;color:#4B5563;}

  /* ---------- よくあるご質問 ---------- */
  .faq{max-width:860px;}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-item:first-of-type{border-top:1px solid var(--line);}
  /* summary の既定マーカー（▶）を消す。WebKit系は別途疑似要素で指定が必要 */
  .faq-q{list-style:none;cursor:pointer;position:relative;display:flex;gap:13px;align-items:flex-start;
    padding:21px 44px 21px 2px;font-size:15.5px;font-weight:600;line-height:1.85;color:var(--navy);}
  .faq-q::-webkit-details-marker{display:none;}
  .faq-q::before{content:"Q";font-family:var(--serif);font-size:15px;color:var(--gold);flex:0 0 auto;}
  .faq-q::after{content:"";position:absolute;right:10px;top:28px;width:10px;height:10px;
    border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);
    transform:rotate(45deg);transform-origin:center;transition:transform .25s;}
  .faq-item[open] .faq-q::after{transform:rotate(-135deg);}
  .faq-q:hover{color:var(--gold-strong);}
  .faq-a{display:flex;gap:13px;padding:0 44px 26px 2px;}
  .faq-a::before{content:"A";font-family:var(--serif);font-size:15px;color:var(--gold);flex:0 0 auto;line-height:1.85;}
  .faq-a-body{font-size:14.5px;line-height:2;color:#4B5563;min-width:0;}
  .faq-a-body p + p{margin-top:1em;}
  .faq-a-body ul{list-style:none;margin:12px 0;}
  .faq-a-body li{position:relative;padding-left:15px;margin-bottom:2px;}
  .faq-a-body li::before{content:"";position:absolute;left:0;top:14px;width:4px;height:4px;background:var(--gold);}
  .faq-a-body .fineprint{font-size:11.5px;line-height:1.8;color:#7C8DA6;margin-top:8px;}
  @media (prefers-reduced-motion: reduce){
    .faq-q::after{transition:none;}
  }

  /* ---------- レスポンシブ ---------- */
  @media (max-width:900px){
    .criteria{grid-template-columns:1fr;}
    .hero-in{padding:96px 24px;}
    .hero-bg{background-position:70% bottom;}
    /* 2列に折り返すと横線が次の行へつながって見えるため、線ごと非表示にする */
    .flowmap{grid-template-columns:repeat(2,1fr);gap:36px 26px;}
    .fstep-badge::after{display:none;}
    .cap-grid{grid-template-columns:repeat(2,1fr);}
    .dept-grid,.dept-grid.row2,.dept-grid.row5{grid-template-columns:repeat(2,1fr);max-width:none;}
    .team-stats{grid-template-columns:repeat(2,1fr);}
    .team-stats div:nth-child(2){border-right:none;}
    .team-stats div:nth-child(1),.team-stats div:nth-child(2){border-bottom:1px solid var(--line);}
    /* 画面が狭いと回り込みが1〜2文字ずつの縦長になり読みにくいため、
       スマホ幅ではfloatを解除して写真を上・文章を下の縦積みに戻す */
    .greet-photo{float:none;margin:0 0 24px;}
    .about-table th{width:8em;}
    .nav{gap:14px;font-size:12px;}
    .logo{font-size:19px;}
    .case-grid{grid-template-columns:repeat(2,1fr);}
    .contact-choice{grid-template-columns:1fr;}
  }
  @media (max-width:640px){
    /* 幅が足りないと「AI社員の賢い雇い方」ロゴと会社名の両方は収まらない
       ため、スマホ幅では会社名を隠しロゴのみ表示する（2026-08-05） */
    .header-company{display:none;}
    .logo{font-size:16px;}
    /* スマホで背景写真が縦長に伸び冗長に見えるため、画面高85%→60%に短縮
       （2026-08-05 ヒロさん指示）。hero-in のpaddingは96px 24pxのまま
       のため、見出し・リード文・ボタン2つは収まりを保てる範囲で確認済み */
    .hero{min-height:50vh;min-height:50dvh;align-items:center;}
    /* 文字・CTAを縦中央に配置し、写真の見える範囲は上下均等にカットされる
       形にする（2026-08-05 ヒロさん指示：下寄せは極端すぎたため中央寄せに修正。
       その後さらに上下を詰めたいとのことで60vh→50vhに再調整） */
    .hero-in{padding:28px 24px;}
    .hero-bg{background-position:65% center;}
    .hero-shade{background:linear-gradient(180deg,rgba(13,22,38,.38) 0%,rgba(13,22,38,.58) 45%,rgba(6,14,34,.82) 100%);}
    .hero-copy{max-width:100%;}
    .hero-cta{flex-direction:column;align-items:stretch;}
    .hero-cta .btn{justify-content:center;}
    .empathy-grid{grid-template-columns:1fr;}
    .flowmap{grid-template-columns:1fr;gap:34px;}
    .cap-grid{grid-template-columns:1fr;}
    .dept-grid,.dept-grid.row2,.dept-grid.row5{grid-template-columns:1fr;}
    /* 統計ブロックは1列4段だと縦に間延びするため、640px以下でも900px時点と
       同じ2×2グリッドを維持する（上の900pxルールをそのまま使い、ここでは
       上書きしない）。数字とパディングだけ、さらに一段小さくする */
    .team-stats div{padding:14px 8px;}
    .team-stats .v{font-size:22px;}
    .team-stats .l{font-size:11px;}
    .faq-q{font-size:14.5px;padding:19px 34px 19px 2px;gap:10px;}
    .faq-q::after{right:4px;top:26px;}
    .faq-a{padding:0 8px 24px 2px;gap:10px;}
    .faq-a-body{font-size:14px;}
    .conclusion{padding:64px 24px;}
    .case-grid{grid-template-columns:1fr;}
    .line-cta{flex-direction:column;text-align:center;padding:26px 22px;}
    .line-cta-media{width:100%;max-width:280px;flex:none;margin:0 auto;}
    .hero-line-cta{max-width:100%;}
    /* PCでは1行に収まる注記文だが、スマホ幅では読めなくなるため
       通常の折り返しに戻す（2026-08-05） */
    .cap-legal-note{white-space:normal;overflow-x:visible;}
  }

  /* ---------- 会社概要・ブログ（紹介デモ用の追加ページ） ---------- */
  .page-hero{background:linear-gradient(160deg,var(--navy) 0%,var(--navy2) 100%);color:#F2F4F8;padding:64px 24px 56px;}
  .page-hero .breadcrumb{font-size:12px;letter-spacing:.08em;color:#C9D2E0;margin-bottom:14px;}
  .page-hero .breadcrumb a{color:#C9D2E0;text-decoration:underline;}
  .page-hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(26px,3.4vw,36px);letter-spacing:.06em;}
  .info-table{width:100%;border-collapse:collapse;margin-top:8px;}
  .info-table th,.info-table td{text-align:left;padding:18px 16px;border-bottom:1px solid var(--line);font-size:14.5px;line-height:1.85;}
  .info-table th{width:9em;color:var(--gold-strong);font-weight:700;letter-spacing:.06em;white-space:nowrap;vertical-align:top;}
  .info-table td{color:var(--ink);}
  .blog-list{display:flex;flex-direction:column;gap:0;margin-top:8px;border-top:1px solid var(--line);}
  .blog-item{padding:28px 0;border-bottom:1px solid var(--line);}
  .blog-item-meta{display:flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.06em;color:var(--gold-strong);margin-bottom:10px;}
  .blog-item-cat{background:var(--mist);color:var(--navy);padding:3px 10px;border-radius:2px;}
  .blog-item h2{font-family:var(--serif);font-weight:600;font-size:19px;color:var(--navy);letter-spacing:.03em;margin-bottom:10px;}
  .blog-item p{font-size:14.5px;color:#4B5563;line-height:1.9;}
  @media (max-width:640px){
    .info-table th,.info-table td{display:block;width:auto;padding:6px 0;}
    .info-table th{padding-top:16px;border-bottom:none;}
    .info-table tr{display:block;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:4px;}
  }