/*
 * --------------------------------------------------------------
 * 0. フッターナビ「お問い合わせ」の縦ずれ（全幅）
 *    Studio書き出しで .gmftr__sd-8 にだけ height:17px が焼き込まれている
 *    （他6項目は height:auto）。要素は display:flex なので17pxの箱に27pxの
 *    行が入り、中央寄せの結果テキストが浮く。タブレットで約5px、PCで約4px。
 *    固定高さを解除して他のリンクと同じ扱いに戻す。（2026-08-14 坂本さん指摘）
 * -------------------------------------------------------------- */
.gmftr__sd-8 { height: auto; }

/*
 * 意図的なデザイン修正のみを書くファイル。
 * native/css/*.css は Studio書き出しからの機械生成なので手を入れない。
 * ここは手で管理し、常に最後に読み込む。
 *
 * --------------------------------------------------------------
 * 1. タブレット幅（〜840px）のフッター
 *    現行サイトでは sd-1 / sd-2 / sd-6 が縦積みに切り替わり、
 *    ロゴも社名もナビも中途半端に右へ寄って崩れていた。
 *    PC版の意図（左=ロゴ+社名 / 右=ナビ）に揃える。
 *    ナビ7項目は840px幅では1行に収まらないので折り返し＋右揃え。
 *    （2026-08-13 坂本さん指摘）
 * -------------------------------------------------------------- */

/* タブレット帯だけに限定する。max-width:840px だけだとスマホ(〜540px)にも効いてしまい、
   横並びを強制した結果ナビが1文字ずつ折り返す状態になった（実測で確認済み）。
   スマホはStudio既定の縦積みのままが正しい。 */
@media (min-width: 541px) and (max-width: 840px) {

  /* フッター内側：横並びに戻し、左右に振り分ける */
  .gmftr__sd-1 {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    align-content: flex-start;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
    gap: 0 32px;
  }
  .gmftr__sd-1 > * { --gap-h: 32px; --gap-v: 0px; }

  /* 左ブロック（ロゴ＋社名・住所）は左端に寄せ、縮みすぎないようにする */
  .gmftr__sd-2 {
    flex-direction: row;
    align-items: flex-start;
    align-content: flex-start;
    justify-content: flex-start;
    flex: 0 1 auto;
  }
  .gmftr__sd-3 {
    align-items: flex-start;
    align-content: flex-start;
    text-align: left;
  }

  /* 右ブロック（ナビ）は横並び・折り返し・右揃え */
  .gmftr__sd-6 {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    justify-content: flex-end;
    flex: 1 1 auto;
    gap: 12px 20px;
    text-align: right;
  }
  .gmftr__sd-6 > * { --gap-h: 20px; --gap-v: 12px; }
}