/* ==========================================================================
   mobile.css — スマートフォン専用の調整（767px以下のみ）
   デスクトップ表示には一切影響しない。style.css / premium.css の後に読み込む。
   方針：
   1. 見出しの「章番号」を小さくラベル行に統合し、左の大きな余白をなくす
   2. カード類の巨大な番号を縮め、1画面あたりの情報密度を上げる
   3. 余白・文字サイズをスマホの読みやすい範囲に再調整
   4. 2列以上のインラインgridを確実に1列化
   ========================================================================== */
@media (max-width: 767px) {

  /* ---- 基本のリズム ---- */
  .container, .container-narrow { padding: 0 20px; }
  .section { padding: 56px 0; }
  .section-num-text h2, .section h2 { font-size: clamp(20px, 5.9vw, 24px); line-height: 1.4; text-wrap: balance; }
  .lead { font-size: 17px; line-height: 1.8; }
  p { line-height: 1.85; }
  .breadcrumb { padding: 6px 0; }
  .breadcrumb ol { font-size: 13px; padding: 0 20px; }
  .breadcrumb a { display: inline-block; padding: 10px 0; }
  .btn { min-height: 48px; }

  /* ---- 章見出し：番号を小さくして「01 ── ABOUT」の1行に、見出しは全幅 ---- */
  .section-num-row {
    display: flex !important;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 12px;
    margin-bottom: 0 !important;
  }
  .section-num-text { display: contents; }
  .section-num {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.18em;
    color: var(--gold-600);
    line-height: 1.6;
    margin: 0;
  }
  .section-num::after { content: ""; display: inline-block; width: 20px; height: 1px; background: var(--gold-500); margin-left: 12px; vertical-align: middle; }
  .section-num-text .section-label { margin: 0; line-height: 1.6; font-size: 13px; letter-spacing: 0.18em; }
  .section-num-text h2 { flex: 0 0 100%; margin: 6px 0 8px !important; }
  .section-num-text .lead { flex: 0 0 100%; margin: 0; }
  /* トップの NEWS 行（見出しと「一覧を見る」を横並びにしている）は崩さない */
  .section-num-text[style*="justify-content"] { display: contents !important; }
  .section-num-text[style*="justify-content"] > div { display: contents; }
  .section-num-text[style*="justify-content"] h2 { flex: 0 0 100%; margin: 6px 0 4px !important; }
  .section-num-text[style*="justify-content"] .btn-ghost { flex: 0 0 100%; justify-content: flex-start; padding: 4px 0 !important; margin: 0 0 4px; font-size: 13px; }

  /* ---- 強み・対象・課題などのカード（巨大な番号 → 小さく左に） ---- */
  .strength-list { display: block !important; margin-top: 28px !important; }
  .strength-item {
    display: grid;
    grid-template-columns: 40px 1fr;
    column-gap: 14px;
    padding: 20px 18px;
    border-left: none !important;
    border-top: 1px solid var(--gray-200);
  }
  .strength-item:first-child { border-top: none; }
  .strength-item .num { font-size: 20px; font-weight: 300; line-height: 1.3; margin: 0; grid-row: 1 / span 2; }
  .strength-item h4 { font-size: 17px; margin: 0 0 6px; grid-column: 2; }
  .strength-item p { font-size: 14px; line-height: 1.8; grid-column: 2; margin: 0; }

  /* ---- ヒーロー ---- */
  .hero-premium { min-height: 78vh; padding: 72px 0 56px; }
  .hero-premium h1 { font-size: 30px; line-height: 1.4; margin-bottom: 14px; }
  .hero-premium h1 .accent { display: inline-block; }
  .hero-premium h1 .small-line { font-size: 17px; font-weight: 500; letter-spacing: 0.04em; color: rgba(255,255,255,0.92); margin-top: 12px; text-wrap: balance; }
  .hero-premium .hero-sub { font-size: 15px; line-height: 1.85; margin-bottom: 28px; word-spacing: -0.25em; }
  .hero-tag { font-size: 11px; letter-spacing: 0.24em; }

  /* ---- 引用ブロック ---- */
  .quote-block { padding: 12px 8px 8px; }
  .quote-mark { font-size: 80px; }
  .quote-text { font-size: 19px; line-height: 1.9; margin-bottom: 24px; }

  /* ---- 分割レイアウト（文＋写真） ---- */
  .split { gap: 24px !important; }
  .split-photo { aspect-ratio: 4 / 3; }
  .split h3[style*="font-size: 32px"] { font-size: 24px !important; margin-bottom: 14px !important; }
  .split h4[style*="text-transform: uppercase"] { margin-top: 22px !important; }
  .split ul li[style*="padding: var(--space-3) 0"] { padding: 10px 0 !important; font-size: 14px; }

  /* ---- トップのサービス写真カード ---- */
  .service-photo-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .service-photo-card { aspect-ratio: 1 / 1 !important; }
  .service-photo-card-content { padding: 16px !important; }
  .service-photo-card h3 { font-size: 16px; line-height: 1.4; }
  .service-photo-card p, .service-photo-card-arrow { display: none; }

  /* ---- 信頼ストリップ（トップ） ---- */
  .trust-strip { padding: 28px 0 32px; }
  .trust-label { margin-bottom: 16px; }
  .trust-items { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 8px !important; counter-reset: trust; align-items: stretch !important; }
  .trust-item {
    height: 100%;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid var(--gray-200);
    border-top: 2px solid var(--gold-600);
    padding: 14px 10px 14px;
    gap: 4px;
    text-align: left;
  }
  .trust-item::before {
    counter-increment: trust;
    content: "0" counter(trust);
    font-family: "Inter", sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--gold-600);
    display: block;
    margin-bottom: 6px;
  }
  .trust-item-name { font-size: 13px; font-weight: 600; line-height: 1.45; text-wrap: balance; }
  .trust-item-num { font-size: 12px; color: var(--gray-500); line-height: 1.5; }

  /* ---- インラインgridの1列化（既存ルールの補完） ---- */
  [style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: repeat(2, 1fr)"] { grid-template-columns: 1fr !important; gap: 0 !important; }
  /* 流れ（4ステップ）：巨大な番号を縮め、番号と本文を横並びに */
  [style*="font-size: 60px"] { font-size: 22px !important; font-weight: 400 !important; margin-bottom: 6px !important; }
  [style*="padding: var(--space-10) var(--space-6)"] { padding: 18px 0 !important; }
  [style*="border-right: 1px solid var(--gray-200)"] { border-right: none !important; border-bottom: 1px solid var(--gray-200) !important; }

  /* ---- 専門ドライバーのカード（サービス） ---- */
  .spec-grid { gap: 10px !important; margin-top: 28px !important; }
  .spec-card { padding: 18px 18px !important; }
  .spec-card h4 { font-size: 16px !important; margin-bottom: 6px !important; }
  .spec-card .spec-en { margin-bottom: 4px !important; }

  /* ---- 安全ページの箇条書きカード ---- */
  .safety-bullet { padding: 16px !important; gap: 12px !important; }

  /* ---- CTA ---- */
  .cta-premium { padding: 64px 0 !important; }
  .cta-premium h2 { font-size: 24px; line-height: 1.45; }
  .cta-premium p { font-size: 14px; }
  .cta-premium .btn { width: 100%; }

  /* ---- フッター：リンク列を2列にして縦の長さを半分に ---- */
  .site-footer { padding: 48px 0 24px; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 24px 20px !important; margin-bottom: 0; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-brand p { font-size: 13px; }
  .footer-col h5 { font-size: 13px; margin-bottom: 6px; }
  .footer-col ul { gap: 0 !important; }
  .footer-col a { display: block; padding: 8px 0; font-size: 14px; }
  .footer-bottom { margin-top: 28px; padding-top: 18px; font-size: 12px; gap: 10px; opacity: 0.75; }
  .footer-bottom ul { gap: 20px; }
  .footer-bottom a { display: inline-block; padding: 12px 0; }

  /* ---- お知らせ一覧・サイトマップ・下層ページ ---- */
  .doc h1 { font-size: 26px !important; }
  .news-item { padding: 16px 16px !important; }
  .sitemap-grid { gap: 14px !important; }
  .sitemap-grid .card { padding: 16px 18px !important; }

  /* ======== pass 2（独立批評の反映） ======== */
  /* 下層ページのヒーロー：インライン min-height(60〜75vh) を抑えて本文へ早く到達 */
  .hero-premium[style*="min-height"] { min-height: 56vh !important; padding: 88px 0 64px; }
  /* ヒーローの第2ボタン：紺の写真上で文字が見えない → 白文字に */
  .hero-premium .btn-secondary { color: #fff; border-color: rgba(255, 255, 255, 0.55); }
  /* ハンバーガーのタップ領域を44pxに */
  .hamburger { width: 44px; height: 44px; margin-right: -2px; }
  .hamburger span { left: 11px; }
  .hamburger span:nth-child(1) { top: 16px; }
  .hamburger span:nth-child(2) { top: 21px; }
  .hamburger span:nth-child(3) { top: 26px; }
  /* フォーム：16px未満だとiOSが自動ズームする */
  .form-group input, .form-group textarea, .form-group select { font-size: 16px; }
  .form-group input[type="checkbox"] { width: 22px !important; height: 22px; flex-shrink: 0; accent-color: var(--navy-700); }
  .form-actions .btn { width: 100%; }
  /* お問い合わせ方法カード・フォーム箱：PC値の内側余白(48px 40px)を縮めて本文を1行に */
  [style*="padding: var(--space-12) var(--space-10)"] { padding: 28px 20px !important; }
  [style*="padding: var(--space-12) var(--space-10)"] p { font-size: 15px; }
  /* 安全ページ：3列セル(POLICY/PLAN/CYCLE, BEFORE/DURING/AFTER)の余白と左寄せ */
  [style*="padding: var(--space-10) var(--space-8)"] { padding: 24px 20px !important; text-align: left !important; }
  /* 安全ページ：保険4項目・携行品4項目は2列に */
  [style*="repeat(4, 1fr)"][style*="border: 1px solid"] { grid-template-columns: 1fr 1fr !important; }
  [style*="padding: var(--space-10); background: var(--navy-700)"] { padding: 28px 20px !important; }
  [style*="background: var(--navy-700)"] [style*="repeat(4, 1fr)"] { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  /* 会社情報の箱・待遇の箱：内側余白を縮めて表を広く */
  [style*="padding: var(--space-10); border-radius: 2px; max-width: 900px"] { padding: 24px 20px !important; }
  [style*="padding: var(--space-4) var(--space-8)"] { padding: 8px 20px !important; }
  /* カード共通（募集職種・選ばれる理由・約束・応募の流れ） */
  .card { padding: 24px 20px; }
  .card h3 { font-size: 19px !important; text-wrap: balance; }
  .card-icon { width: 44px; height: 44px; margin-bottom: 14px; }
  .card-icon svg { width: 22px; height: 22px; }
  .card [style*="font-size: 48px"] { font-size: 22px !important; font-weight: 400 !important; margin-bottom: 8px !important; }
  /* 代表挨拶：引用文は見出しより一段小さく */
  #message p[style*="font-size: 26px"] { font-size: 20px !important; line-height: 1.7 !important; margin: 18px 0 20px !important; }
  /* 入れ子のサービスブロック（サービス/BtoB）の上下余白を統一 */
  .section > .section[style*="padding"] { padding: 44px 0 !important; }
  /* 章見出し → 本文の距離を統一 */
  .section-num-row + [style*="margin-top: var(--space-10)"],
  .section-num-row + [style*="margin: var(--space-10) auto 0"] { margin-top: 28px !important; }
  /* 写真背景セクションの上下余白を他章と揃える */
  .safety-feature { padding: 56px 0; }
  /* 送信完了：本文のみ左寄せ */
  .container[style*="max-width: 640px"] p { text-align: left; }
  /* 記事タイトル・本文の行末孤立を抑制（対応ブラウザのみ） */
  .doc h1 { text-wrap: balance; }
  p, .strength-item p, .safety-bullet p, .split ul li, .card p { text-wrap: pretty; }
  .news-item .c, .article-meta .c { font-size: 12px !important; }
  /* ======== pass 3（実機計測の反映：タップ領域 40px 以上） ======== */
  a[href^="tel:"] { display: inline-block; padding: 6px 0; }
  .back { padding: 10px 0; }
  .sitemap-grid h3 a { display: inline-block; padding: 8px 0; }
  .doc .article-body a, .doc .contact-box a, .doc .lead a { display: inline-block; padding: 6px 0; }
  /* ======== pass 4（回帰検証の反映） ======== */
  /* カード一覧（.grid-cards）は1列化しても余白を保つ */
  .grid-cards[style*="grid-template-columns"] { gap: 12px !important; }
  /* 2列で残した保険・携行品セル：内側余白を縮めて見出しの途中折れを防ぐ */
  [style*="repeat(4, 1fr)"][style*="border: 1px solid"] > * { padding: 16px 12px !important; }
  [style*="repeat(4, 1fr)"][style*="border: 1px solid"] > * h4,
  [style*="repeat(4, 1fr)"][style*="border: 1px solid"] > * h3 { font-size: 15px !important; text-wrap: balance; }
  [style*="background: var(--navy-700)"] [style*="repeat(4, 1fr)"] > * { padding: 12px !important; }
  /* フロー4ステップ：タブレット用ルールで戻る右罫線を消す */
  [style*="repeat(4, 1fr)"] > [style*="border-right"] { border-right: none !important; }
}