/*
 * 今のサイトの表示の不具合を直す CSS（暫定サイトで足したもの）
 *   - 今のサイトの style.css は直さない。直すものはここに足す
 *   - 全ページで、style.css の後に読み込む（content/ の head。取り込みのスクリプト tools/import_content.py が足す）
 *   - どれも今のサイトでも同じように崩れていた（2026-10-22、Web Archive の HTML で確かめた）
 */

/* 1. 横スクロール: 左右2列の grid の左の列が auto のため、大きな見出しの幅に引っ張られて画面より広くなっていた
 *    （/work/agent/・/work/recruiting/ は幅 768 以上のすべてで、右の文章が画面の外に切れていた。/business/agent/・/business/recruiting/ は幅 768 前後）
 *    左の列を minmax(0, 1fr) にする。はみ出していなかった幅では見た目は変わらない（ピクセル単位で 0.00%） */
@media screen and (min-width: 768px) {
  .jdsc-header__content { grid-template-columns: minmax(0, 1fr) 25%; }
  .dvss-header__inner,
  .tmsg-header__inner { grid-template-columns: minmax(0, 1fr) 66.6666666667%; }
}
@media screen and (min-width: 1024px) {
  .jdsc-header__content { grid-template-columns: minmax(0, 1fr) 29.1666666667%; }
}

/* 2. 幅 768〜1023 のヘッダー: PC 用のナビゲーションが収まらず、ENTRY のボタンが右端で切れ、「新卒採用」が2行に折り返していた
 *    この幅だけ、項目の間と文字を少し詰める */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .st-header .g-navigation { column-gap: .75rem; }
  .st-header .g-navigation__lists { column-gap: .75rem; }
  .st-header .g-navigation-list__inner { font-size: .875rem; letter-spacing: .02em; }
  .st-header .g-navigation-entry { width: 6.5rem; }
  .st-header .g-logo__label { white-space: nowrap; }
}

/* 3. /message/ の幅 768〜1023: 社長のコピーの1行が画面の右に 8px はみ出していた。この幅だけ文字を少し小さくして2行に収める
 *    （コピーが「Message」の見出しに重なるのは今のサイトと同じ。直していない） */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .tmsg-header-copy { font-size: 2.125rem; }
}