@charset "UTF-8";
/* =============================================================================
 * global-scale.css  —  サイト全体の表示倍率（v1.64.0）
 * -----------------------------------------------------------------------------
 * 長谷川さんのご指摘：
 *   「全体的に横長でのっぺりしているのをスリムにしたい」
 *   「テキストサイズも大きすぎかと」
 *   「PC100%表示だとここまでデカい。7割8割ぐらいスリムにしてもいいかと」
 *
 * 原因は、これまでの確認をブラウザの表示倍率 75% で行っていたこと。
 * 100% で見ると、文字もボックスも 1.33 倍の大きさで表示されていた。
 *
 * そこで「ブラウザを 75% にしたときと同じ見え方」を CSS 側で再現する。
 * zoom は文字・余白・ボックス・画像・線まで全部まとめて縮むので、
 * 個々の数値を触る必要がなく、TOP・LP・採用・事例など全ページに同じように効く。
 *
 * ■ 倍率を変えたいとき
 *     下の --pm-zoom の値を変えるだけ（0.8 なら 80%、0.7 なら 70%）。
 * ■ 元に戻したいとき
 *     functions.php の読み込み1ブロックとこのファイルを消せば、完全に戻る。
 *
 * ■ スマホ・タブレットには掛けていない
 *     スマホは元から 100% で見られていて、今の大きさで問題がないため。
 *     1025px 以上（＝PC表示）のときだけ縮める。
 * ========================================================================== */

:root{
  /* サイト全体の表示倍率。0.75＝ブラウザの75%表示と同じ大きさ */
  --pm-zoom: .75;
}

@media (min-width: 1025px){

  html{ zoom: var(--pm-zoom); }

  /* --- zoom と vw の組み合わせだけ手当てが必要 ---------------------------
     zoom を掛けても vw（画面幅）は変わらないため、
     「画面の右端まで伸ばす」指定だけがズレる。倍率で割って辻褄を合わせる。
     サイト全体で vw を使った幅指定はここ1か所だけ（LP表紙のイラスト）。 */
  .pm-mock.lp-rich .lpr-hero--wide .lprw-illust{
    right: calc(50% - 50vw / var(--pm-zoom)) !important;
  }
}

/* 印刷時は等倍に戻す */
@media print{
  html{ zoom: 1; }
}