/*
 * 追従ヘッダー（js/fixed-header.js と対になっている）
 * スクロールしたら、電話番号が載っている段だけを画面上部に固定する。
 */

/* 固定中は、ページ内の他の要素（スライダーなど）より手前に出す */
.header.is-stuck {
  z-index: 100;
}

.header .is-fixed-bar {
  position: fixed;
  top: var(--fixed-header-top, 0px);
  left: 0;
  right: 0;
  z-index: 1;
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1);
}

/* 固定中にSPメニューを開いたときは、固定した段のすぐ下から開く
   （通常時の位置は main.js がインラインで指定しているため !important で上書きする） */
.header.is-stuck .modal__nav {
  position: fixed;
  top: var(--fixed-header-bottom, 0px) !important;
  height: calc(100vh - var(--fixed-header-bottom, 0px)) !important;
}

/* ページ内リンクで移動したとき、見出しが固定した段の裏に隠れないようにする */
html {
  scroll-padding-top: var(--fixed-header-bottom, 0px);
}