/* ============================================================
   スマホ表示の修正（2026-10-01）
   全ページの </head> 直前で最後に読み込み、既存CSSの後勝ちで上書きする
   ============================================================ */

/* ---- ヘッダー：ロゴ・相談ボタン・メニューを画面内に収める ---- */
@media (max-width: 560px) {
  header .h-inner { padding-inline: 16px; gap: 8px; }
  header .h-logo { min-width: 0; flex: 0 1 auto; }
  header .h-logo img { width: 150px; height: auto; }
  header .h-cta { gap: 8px; flex: none; }
  header .h-cta .btn.solid { padding: 10px 12px; font-size: 12px; }
  header .menu-btn { flex: 0 0 44px; }
}

/* ---- スマホメニュー：ヘッダー高さに合わせ、最下部までスクロールできるように ---- */
@media (max-width: 1100px) {
  nav.g-nav.open {
    max-height: calc(100vh - 74px);
    max-height: calc(100dvh - 74px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}

/* ---- トップ：メイン画像（文字入り 16:9）を切らずに全体表示 ---- */
@media (max-width: 800px) {
  .kv-frame { aspect-ratio: 16 / 9; height: auto; }
  .kv-frame .kv-item.is-composed { position: absolute; inset: 0; }
  .kv-frame .kv-item.is-composed .img { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; }
  .kv-item.is-composed .img img { object-fit: contain; object-position: center; }
}

/* ---- トップ：サービス紹介をスマホでは1列に ---- */
@media (max-width: 860px) {
  .svc, .svc.rev { grid-template-columns: minmax(0, 1fr); }
  .svc > div:first-child, .svc.rev > div:first-child { min-width: 0; padding: 28px 24px; }
  .svc .fig, .svc.rev .fig { margin: 0 24px 24px; aspect-ratio: 16 / 10; }
}

/* ---- トップ：会社概要表を縦積みに（固定幅の見出し列で本文が潰れるため） ---- */
@media (max-width: 560px) {
  .co-table, .co-table tbody, .co-table tr, .co-table th, .co-table td { display: block; width: auto; }
  .co-table th { white-space: normal; padding-bottom: 4px; border-bottom: none; }
  .co-table td { min-width: 0; padding-top: 4px; overflow-wrap: anywhere; }
}

/* ---- フォーム：送信ボタンを枠内に、iOSで入力時に拡大されないよう16px ---- */
@media (max-width: 560px) {
  #form .form-sec { padding: 24px 20px; }
  .f-submit .btn { min-width: 0 !important; width: 100%; max-width: 320px; padding-inline: 20px; }
  .tower-box .btn { width: 100%; padding-inline: 12px; }
}
@media (max-width: 768px) {
  input[type="text"], input[type="email"], input[type="tel"], select, textarea,
  .form-box input[type="text"], .form-box input[type="email"], .form-box input[type="tel"],
  .form-box select, .form-box textarea { font-size: 16px; }
}

/* ---- 追従CTAがページ最下部を隠さないように ---- */
@media (max-width: 768px) {
  body:has(.sticky-cta) { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
  .sticky-cta { padding-bottom: env(safe-area-inset-bottom); }
  body:has(.sticky-cta) .pagetop { bottom: calc(76px + env(safe-area-inset-bottom)); }
}

/* ---- 読みにくい小さな文字を12pxに ---- */
@media (max-width: 560px) {
  .def-table .sub, .effect-note { font-size: 12px; line-height: 1.8; }
  .client-grid span { font-size: 12px; }
  .area-tbl td .own { font-size: 12px; line-height: 1.7; }
  .org-col .cname small, .org-lb, .media-type { font-size: 12px; }
}

/* ---- フッターのリンクを指で押しやすく ---- */
@media (max-width: 560px) {
  .ft-col li > a { display: flex; align-items: center; min-height: 40px; }
  .svc-more .btn { min-height: 44px; }
}

/* ---- 会社情報：代表写真の枠が潰れないように ---- */
@media (max-width: 768px) {
  .msg-photo { width: min(100%, 220px); }
}

/* ===== 全体点検（2026-10-02） ===== */
/* 見出し・ボタン・短い項目で「1文字だけ次の行」に落ちないよう、文節で折り返す */
h1, h2, h3, h4, .btn, .sub-h, .client-grid span, .crumb .wrap > span {
  word-break: auto-phrase;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
p, li, dd { text-wrap: pretty; }
/* パンくず: 区切りの「/」だけが行末に残らないように */
.crumb .wrap { flex-wrap: wrap; row-gap: 2px; }

/* スマホ: 2列の表（見出し列＋内容）は横スクロールさせず、項目名の下に内容を積む */
@media (max-width: 620px) {
  .tbl-scroll .def-table:not(:has(thead)) { min-width: 0; }
  .def-table:not(:has(thead)) tbody th,
  .def-table:not(:has(thead)) tbody td { display: block; width: auto; }
  .def-table:not(:has(thead)) tbody th { padding: 12px 14px 4px; border-bottom: none; font-size: 12px; color: var(--ink-3); }
  .def-table:not(:has(thead)) tbody td { padding: 4px 14px 14px; border-top: none; font-size: 14px; }
}
@media (max-width: 620px) {
  /* 見出し行が「項目／内容」の2列だけの表も同じく積む（見出し行は不要なので隠す） */
  .tbl-scroll .def-table:has(thead tr > th:nth-child(2):last-child) { min-width: 0; }
  .def-table:has(thead tr > th:nth-child(2):last-child) thead { display: none; }
  .def-table:has(thead tr > th:nth-child(2):last-child) tbody th,
  .def-table:has(thead tr > th:nth-child(2):last-child) tbody td { display: block; width: auto; }
  .def-table:has(thead tr > th:nth-child(2):last-child) tbody th { padding: 12px 14px 4px; border-bottom: none; font-size: 12px; color: var(--ink-3); }
  .def-table:has(thead tr > th:nth-child(2):last-child) tbody td { padding: 4px 14px 14px; border-top: none; font-size: 14px; }
}