/* 完コピ helmet <style> を抽出。デザイン不変。 */
*{box-sizing:border-box}
body{margin:0;font-family:'IBM Plex Sans JP',sans-serif;color:#14202B;background:#fff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:#E3F2F9}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
::-webkit-scrollbar{height:8px;width:8px}
::-webkit-scrollbar-thumb{background:#E8ECEF;border-radius:8px}
a{color:inherit}
input{font-family:'IBM Plex Sans JP',sans-serif}

/* style-hover / style-focus="..." の静的化（完コピのホバー挙動を本物のCSSで再現） */
.nav-btn:hover{color:#14202B}
.news-card:hover{border-color:#D4DBE0;box-shadow:0 4px 16px rgba(20,32,43,.05)}
.tree-row:hover{background:#F6F8F9}
.tree-child:hover{background:#F6F8F9}
[data-href]{cursor:pointer}

/* ナビゲーション ドロップダウン（PC: ホバー / スマホ: タップで開閉・data-open 属性で制御） */
.nav-group:hover .nav-dropdown,
.nav-group[data-open="1"] .nav-dropdown {
  display: block !important;
}
.nav-dropdown-item:hover {
  background: #F6F8F9;
  color: #14202B;
}

/* ========================================================================
 * サイト共通：ヒーロー（紺背景 #14202B / 青背景 #2A8FD8 / 濃水色 #155F94 等）
 * 内の H1 と リード <p> を、コンテンツ幅いっぱいに広げる（恒久ルール）.
 * 完コピや dark_hero() のインライン max-width 指定（880px / 760px 等）を
 * !important で確実に上書きする。これによりリードがコンテナの右端
 * （max-width:1180px - padding:32px*2 ≒ 1116px）まで自然に伸びて折り返す。
 * ヒーロー section 内の H1 と直下 div 配下の最初の <p>（リード）のみ対象。
 * （ヒーロー section 内に補足注釈 <p> がある場合は限定子で除外可能）
 * ======================================================================== */
section[style*="background:#14202B"] > div > h1,
section[style*="background:#2A8FD8"] > div > h1,
section[style*="background:#155F94"] > div > h1 {
  max-width: none !important;
  /* 完コピのインライン text-wrap:balance（ブラウザがテキストを複数行にバランス分配する仕様）を
   * 打ち消し、自然折り返しに任せる。短い見出しは 1 行・長い見出しは右端で自動折り返し。
   * 人間（完コピ）が改行位置を強制しない、ブラウザ標準の挙動に戻す。 */
  text-wrap: wrap !important;
}
section[style*="background:#14202B"] > div > p,
section[style*="background:#2A8FD8"] > div > p,
section[style*="background:#155F94"] > div > p {
  max-width: none !important;
  text-wrap: wrap !important;
}

/* ========================================================================
 * §0.8 BORDER トークン上書き：サイト全体の細い線の視認性を確保。
 * 完コピ・Python 組成のどちらにも散在する旧色 #E8ECEF（薄すぎ）を、
 * 細い線のまま新しい BORDER (#C4CDD5) で上書きする。
 * カード枠・テーブル罫線・水平線・タブ下線などに一括で効く。
 * 太さ（1px / 2px）は変更しない＝色だけ濃くする。
 * 背景色用途（border-color が背景と同色のナビアクティブ等）は
 * border 専用パターンに限定しているため副作用なし。
 * ======================================================================== */
[style*="border:1px solid #E8ECEF"],
[style*="border-bottom:1px solid #E8ECEF"],
[style*="border-bottom:2px solid #E8ECEF"],
[style*="border-color:#E8ECEF"] {
  border-color: #C4CDD5 !important;
}

/* ========================================================================
 * レスポンシブ（2026-06-27 追加・段階 0+1）
 *  - ブレークポイント：1024px（タブレット）/ 768px（スマホ）
 *  - 段階 0：.grid-N クラスを 768px 未満で 1 列に、1024px 未満で適宜 2 列に
 *           （受け皿のみ・各関数のインライン grid を上書きするため !important）
 *  - 段階 1：ナビをハンバーガーメニュー化（768px 未満で開閉ボタン表示・
 *           既存横並びナビを畳む・data-open でトグル）
 *  - PC（≥1024px）の表示は変えない＝デグレ防止が最優先
 * ======================================================================== */

/* 段階 0+2：汎用グリッド（class="grid-N" 付与で自動レスポンシブ化）
 * Hiroshi 方針（2026-06-27 段階 2）：スマホは基本シングルカラム・迷ったら 1 列。
 *   - 1024px 未満（タブレット）：grid-3/4/5 → 2 列・grid-2 → 1 列・grid-aside → 1 列
 *   - 768px 未満（スマホ）：grid-2/3/4/5 → 全て 1 列・grid-aside も 1 列
 * grid-aside = 「サイドバー + 本文」の固定列幅ペア（300px 1fr 等）。狭い画面では縦積み。
 */
@media (max-width: 1024px) {
  .grid-5 { grid-template-columns: repeat(2, 1fr) !important; }
  .grid-4 { grid-template-columns: repeat(2, 1fr) !important; }
  .grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
  .grid-2 { grid-template-columns: 1fr !important; }
  .grid-aside { grid-template-columns: 1fr !important; }
  /* sticky aside はスマホでは sticky を解除（画面占有防止）。
     PC 用の内部スクロール（max-height/overflow）も解除し、縦積みで全項目を自然表示する。 */
  .grid-aside > aside { position: static !important; max-height: none !important; overflow: visible !important; }
}
@media (max-width: 768px) {
  .grid-2, .grid-3, .grid-4, .grid-5 {
    grid-template-columns: 1fr !important;
  }
  .grid-aside { grid-template-columns: 1fr !important; }
  /* スマホで広いテーブル・カードの横スクロール緩和 */
  body { overflow-x: hidden; }
}

/* ヘッダー認証ボタン（2026-07-10 Step4・水色ボタン化）。
   背景 #0A72A8 は白文字とのコントラスト約5.3:1（WCAG AA 4.5:1 以上）。 */
.auth-links { display: inline-flex; align-items: center; gap: 8px; }
.auth-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 5px 13px; border-radius: 6px;
  font-family: 'IBM Plex Sans JP', sans-serif; font-size: 12.5px; font-weight: 600;
  line-height: 1.4; white-space: nowrap; text-decoration: none; cursor: pointer;
}
.auth-btn-primary { background: #0A72A8; color: #fff; border: 1px solid #0A72A8; }
.auth-btn-primary:hover { background: #085C86; border-color: #085C86; }
.auth-btn-outline { background: #fff; color: #0A72A8; border: 1px solid #0A72A8; }
.auth-btn-outline:hover { background: #EAF4FB; }
/* PC=header右上を表示・nav内(モバイル用)は非表示。モバイルは逆（下の media query）。 */
.auth-links-mobile { display: none; }

/* 段階 1：ナビ ハンバーガーメニュー化 */
.nav-hamburger {
  display: none;  /* PC では非表示・スマホでのみ表示 */
  background: none;
  border: 1px solid #C4CDD5;
  border-radius: 8px;
  width: 38px;
  height: 38px;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  color: #14202B;
  flex-shrink: 0;
}
.nav-hamburger:hover { background: #F6F8F9; }

/* Facebookアイコンリンク（ヘッダー共通・2026-07-15）。モノクロ既定→hover で Facebookブルー。 */
.header-fb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  color: #56636E;               /* 既定モノクロ（本文 MUTED 相当・背景白でコントラスト AA） */
  text-decoration: none;
  flex-shrink: 0;
  transition: color .15s ease, background .15s ease;
}
.header-fb:hover { color: #1877F2; background: #F6F8F9; }   /* hover=Facebookブルー */
.header-fb:focus-visible { outline: 2px solid #1877F2; outline-offset: 2px; }  /* フォーカスリング可視 */
.header-fb svg { width: 20px; height: 20px; display: block; }
/* PC版=nav行右端に表示（既定）／スマホ版=既定は隠す（下の media query で入替） */
.header-fb-mobile { display: none; }

@media (max-width: 768px) {
  /* スマホ：ハンバーガー表示・ナビ折り畳み */
  .nav-hamburger { display: inline-flex; }
  /* Facebook：PC版(nav行内)は隠し、スマホ版(☰左隣)を表示。タップ領域 44px 四方以上。 */
  .header-fb-pc { display: none !important; }
  .header-fb-mobile { display: inline-flex !important; width: 44px; height: 44px; }

  /* ナビ全体を折り畳む（デフォルト非表示） */
  nav.nav-main {
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 8px 16px 16px !important;
    gap: 0 !important;
  }
  /* ハンバーガーで開いた状態 */
  nav.nav-main[data-open="1"] {
    display: flex !important;
  }
  /* ナビ項目（単独）を縦並び・幅 100% */
  nav.nav-main .nav-btn {
    width: 100% !important;
    padding: 12px 14px !important;
    border-bottom: 1px solid #F0F2F4 !important;
    box-sizing: border-box;
  }
  /* ナビグループ（ドロップダウン）も縦並び化 */
  nav.nav-main .nav-group {
    width: 100% !important;
  }
  nav.nav-main .nav-group > button.nav-btn {
    width: 100% !important;
    text-align: left !important;
    justify-content: space-between !important;
  }
  /* ドロップダウンは absolute をやめて静的配置・全幅 */
  nav.nav-main .nav-dropdown {
    position: static !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
    background: #F6F8F9 !important;
  }
  nav.nav-main .nav-dropdown-item {
    padding: 12px 28px !important;
    border-bottom: 1px solid #E8ECEF !important;
  }
  /* ヘッダー右側の「中立 B2B インテリジェンス」バッジはスマホで隠す（場所確保） */
  .header-trust-badge { display: none !important; }
  /* モバイル：ロゴ副題を隠し＋余白を詰めて ☰（NAV入口）の場所を確保 */
  .logo-subtitle { display: none !important; }
  /* モバイル：ロゴ主題を 15px に（右クラスタに FB アイコンが増えた分、1 行維持のため僅かに縮小） */
  .logo-title { font-size: 15px !important; }
  .header-inner { padding: 14px 16px !important; gap: 12px !important; }
  /* モバイル：header右上の auth を隠し（☰ の場所を確保）、nav 先頭の auth を表示 */
  .auth-links-pc { display: none !important; }
  .header-contact-pc { display: none !important; }
  .auth-links-mobile {
    display: flex !important; gap: 10px;
    padding: 14px 8px 10px !important; width: 100% !important;
    border-bottom: 1px solid #E8ECEF !important;
  }
  .auth-links-mobile .auth-btn { flex: 1 1 auto; justify-content: center; padding: 10px 12px; font-size: 14px; }
}

/* ===== サイト内検索（2026-07-23・自己ホスト・外部送信ゼロ） ===== */
.h2s-form{position:relative;display:flex;align-items:center;gap:0;background:#fff;
  border:1px solid #E8ECEF;border-radius:10px;font-family:'IBM Plex Sans JP',sans-serif}
.h2s-form .h2s-ic{padding:0 6px 0 12px;font-size:13px;line-height:1;color:#8A949D;flex-shrink:0}
.h2s-form .h2s-input{flex:1 1 auto;min-width:0;border:0;outline:none;background:transparent;
  font-size:14px;color:#14202B;padding:9px 10px 9px 2px;font-family:inherit}
.h2s-form .h2s-input::placeholder{color:#9FB0BD}
.h2s-form .h2s-input:focus-visible{outline:none}
.h2s-form:focus-within{border-color:#2A8FD8;box-shadow:0 0 0 3px rgba(42,143,216,.12)}
.h2s-form .h2s-btn{flex-shrink:0;border:0;background:#2A8FD8;color:#fff;font-weight:700;
  font-size:14px;padding:9px 16px;border-radius:0 9px 9px 0;cursor:pointer;font-family:inherit}
.h2s-form .h2s-btn:hover{background:#1E7BC0}
/* ヘッダー(PC)用：コンパクト・幅可変 */
.h2s-pc{width:200px;transition:width .18s ease}
.h2s-pc:focus-within{width:240px}
.h2s-pc .h2s-input{padding-top:7px;padding-bottom:7px;font-size:13.5px}
/* トップ ヒーロー用：大きく目立つ */
.h2s-hero{max-width:640px;margin:0 auto 4px;border-radius:12px}
.h2s-hero .h2s-input{padding-top:14px;padding-bottom:14px;font-size:16px}
.h2s-hero .h2s-ic{font-size:16px;padding-left:16px}
.h2s-hero .h2s-btn{padding:14px 22px;border-radius:0 11px 11px 0}
/* ハンバーガー内：全幅 */
.h2s-mobile{display:none;width:100%;margin:4px 0 2px}
/* 候補ドロップダウン */
.h2s-suggest{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:70;background:#fff;
  border:1px solid #E8ECEF;border-radius:10px;box-shadow:0 6px 24px rgba(20,32,43,.10);
  overflow:hidden;max-height:min(70vh,420px);overflow-y:auto}
.h2s-suggest a{display:block;padding:10px 14px;text-decoration:none;color:inherit;
  border-bottom:1px solid #F0F2F4}
.h2s-suggest a:last-child{border-bottom:0}
.h2s-suggest a:hover,.h2s-suggest a.h2s-active{background:#F6F9FB}
.h2s-suggest .h2s-s-cat{font-family:'IBM Plex Mono',monospace;font-size:10px;color:#2A8FD8;
  letter-spacing:.04em}
.h2s-suggest .h2s-s-title{font-size:13.5px;color:#14202B;line-height:1.5;margin-top:2px}
.h2s-suggest .h2s-s-more{display:block;padding:10px 14px;font-size:12px;color:#56636E;
  background:#F6F8F9;text-decoration:none}
.h2s-suggest mark,.h2s-results mark{background:#FFF1B8;color:inherit;padding:0 1px;border-radius:2px}
/* /search/ 結果 */
.h2s-status{font-family:'IBM Plex Mono',monospace;font-size:12px;color:#8A949D;margin:6px 2px 14px}
.h2s-results{display:flex;flex-direction:column;gap:2px}
.h2s-hit{display:block;padding:16px 4px;border-bottom:1px solid #F0F2F4;text-decoration:none;color:inherit}
.h2s-hit:hover{background:#FAFCFD}
.h2s-hit .h2s-cat{font-family:'IBM Plex Mono',monospace;font-size:11px;color:#2A8FD8;letter-spacing:.04em}
.h2s-hit .h2s-title{font-size:16px;font-weight:700;color:#14202B;line-height:1.55;margin:3px 0 4px}
.h2s-hit .h2s-ex{font-size:13px;color:#56636E;line-height:1.8}
.h2s-hit .h2s-url{font-family:'IBM Plex Mono',monospace;font-size:11px;color:#9FB0BD;margin-top:5px;word-break:break-all}
.h2s-empty-links{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.h2s-empty-links a{color:#2A8FD8;text-decoration:none;font-size:14px}
@media (max-width:768px){
  .h2s-pc{display:none !important}          /* PCヘッダー検索はスマホで隠す（ハンバーガー内に出す） */
  .h2s-mobile{display:flex !important}      /* ハンバーガー内の検索を表示 */
  .h2s-hero .h2s-input{font-size:16px}      /* iOS ズーム防止（16px以上） */
  .h2s-hero{max-width:100%}
}
.hv0:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(20,32,43,.07)}
.hv1:hover{border-color:#2A8FD8}
.hv2:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(20,32,43,.07)}
.hv3:hover{background:#FAFBFC}
.fc0:focus{border-color:#2A8FD8}