@charset "UTF-8";
/*
 * 共通ヘッダー(header.php)のナビ項目が途中で折り返して2行になる問題の修正(2026-10-19)
 * - app.css は直接編集せず、header.php で app.css の直後に読み込む
 * - スマホ表示(767px以下=ハンバーガー)には影響させない(すべて min-width: 768px 以上で指定)
 * - 品質経営Web(header-qdm.php)では読み込まない
 *
 * 1行に必要な幅の概算(ナビ8項目・本文フォント游ゴシック等):
 *   12px・字間0.05em・左右15px … ナビ約940px → 画面幅 約1400px 以上で収まる
 *   (ナビに使える幅 = 画面幅 - ロゴ172px - 右ボタン284px)
 *   それ未満の幅帯だけ、余白→字間→文字サイズの順に段階的に詰める
 */

@media screen and (min-width: 768px) {
  /* ラベルを折り返さない */
  .header__nav__item__ja {
    white-space: nowrap;
  }
}

/* 1320〜1439px: 左右余白 15→10px・字間 0.05em→0 */
@media screen and (min-width: 1320px) and (max-width: 1439px) {
  .header__nav__item {
    padding: 0 10px;
    letter-spacing: 0;
  }
}

/* 1181〜1319px: 文字 12→11px・字間0・左右余白7px・ロゴ左余白 49→30px・ナビ右余白 13→0 */
@media screen and (min-width: 1181px) and (max-width: 1319px) {
  .header__logo {
    margin-left: 30px;
  }

  .header__nav {
    padding-right: 0;
  }

  .header__nav__item {
    padding: 0 7px;
    font-size: 11px;
    letter-spacing: 0;
  }

  .header__nav__item__inner:after {
    width: calc(100% + 10px);
  }
}

/* 768〜1180px(ヘッダーは最小1120px幅で固定): 文字10.5px・字間0・左右余白6px・ロゴ左余白24px・ナビ右余白0 */
@media screen and (min-width: 768px) and (max-width: 1180px) {
  .header__logo {
    margin-left: 24px;
  }

  .header__nav {
    padding-right: 0;
  }

  .header__nav__item {
    padding: 0 6px;
    font-size: 10.5px;
    letter-spacing: 0;
  }

  .header__nav__item__inner:after {
    width: calc(100% + 8px);
  }
}