/* ============================================================================
 * style-child-header.css — Revival 子テーマ：ヘッダー UI 系
 * ----------------------------------------------------------------------------
 * 基盤（:root / リセット / .gutter / .lp-container / .lp-subpage / .btn-arrow-outline 等）は
 * style-child.css 側にある。本ファイルはヘッダー周辺の UI コンポーネントのみ。
 *
 * コーディング規約は style-child.css のファイルヘッダ参照：
 *  - モバイルファースト一貫（`@media (max-width: ...)` は禁止）
 *  - `@media (min-width: ...)` は **セレクタにネスト**
 *  - `:hover` は **`@media (hover: hover)` で囲む**
 *  - カンマ区切りセレクタは禁止
 *
 * === 目次（行番号は概算）===
 *  L21+   .lp-header / .lp-header__pc / __logo / __nav / __nav-link / __nav-trigger /
 *         __nav-item--has-dropdown / __nav-chevron / __dropdown / __dropdown-link
 *  L119+  .lp-header__sp / __sp-logo / __hamburger / .lp-header-spacer
 *  L157+  .lp-sp-menu（SP ハンバーガー展開：__top-row / __top-link / __body / __link /
 *         __acc-btn / __acc-icon / __acc-body / __acc-link / __cta）
 *  L249+  .lp-floating-cta（右下/下部追従 CTA：__btn / __btn--primary/accent/line / __btn-icon）
 * ============================================================================ */
.lp-header {
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:50;
  background:var(--color-white);
  color:var(--color-primary);
  transition:background-color .3s,color .3s;
}
body.is-lp-front .lp-header:not(.is-scrolled) {
  background:rgba(0,0,0,0);
  color:var(--color-white);
}
.lp-header__pc {
  display:none;
  align-items:center;
  justify-content:space-between;
  height:6rem;
  padding-left:5rem;
  padding-right:5rem;
  @media (min-width: 1024px) {
    display:flex;
  }
}
.lp-header__logo {
  flex-shrink:0;
  display:block;
}
.lp-header__logo-img {
  display:block;
  width:72px;
  height:72px;
}
.lp-header__nav {
  display:flex;
  align-items:center;
  gap:1.5rem;
  color:inherit;
}
.lp-header__nav-link {
  font-size:1rem;
  font-weight:500;
  white-space:nowrap;
  color:inherit;
  transition:color .2s;
}
.lp-header__nav-item--has-dropdown {
  position:relative;
  display:flex;
  align-items:center;
  gap:.5rem;
  @media (hover: hover) {
    &:hover .lp-header__dropdown {
      display:block;
    }
  }
}
.lp-header__nav-chevron {
  display:block;
  width:.875rem;
  height:.875rem;
}
.lp-header__dropdown {
  display:none;
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  background:var(--color-white);
  min-width:200px;
  padding:.5rem 0;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  z-index:200;
}
.lp-header__dropdown-link {
  display:block;
  padding:.55rem 1.25rem;
  font-size:1rem;
  color:var(--color-primary);
  white-space:nowrap;
  transition:background .2s,color .2s;
}
.is-revival-lp .lp-header__dropdown-link {
  @media (hover: hover) {
    &:hover {
      background:var(--color-primary);
      color:var(--color-white);
    }
  }
}
.lp-header__sp {
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:4rem;
  padding:0 1rem;
  background:var(--color-white);
  @media (min-width: 1024px) {
    display:none;
  }
}
.lp-header__sp-logo {
  height:4rem;
  display:flex;
  align-items:center;
}
.lp-header__sp-logo-img {
  height:3rem;
  width:3rem;
}
.lp-header__hamburger {
  display:flex;
  flex-direction:column;
  gap:.375rem;
  padding:.5rem;
}
.lp-header__hamburger-bar {
  display:block;
  width:1.5rem;
  height:.125rem;
  background:var(--color-primary);
}
.lp-header-spacer {
  height:4rem;
  @media (min-width: 1024px) {
    height:6rem;
  }
}
.lp-sp-menu {
  display:none;
  position:fixed;
  inset:4rem 0 0 0;
  z-index:60;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  background:var(--color-primary);
  color:var(--color-white);
  font-size:1rem;
  font-weight:500;
}
.lp-sp-menu.is-open {
  display:block;
}
.lp-sp-menu__top-row {
  display:flex;
  border-bottom:1px solid hsla(0,0%,100%,.1);
}
.lp-sp-menu__top-link {
  flex:1;
  text-align:center;
  padding:.625rem 0;
  color:var(--color-white);
  transition:color .2s;
}
.lp-sp-menu__top-link:not(:last-child) {
  border-right:1px solid hsla(0,0%,100%,.1);
}
.lp-sp-menu__body {
  padding:1rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:.25rem;
}
/* SP メニュー展開中は背面（body）をスクロールさせない（JS が body に付与） */
body.is-menu-open {
  overflow:hidden;
}
.lp-sp-menu__link {
  display:block;
  padding:.625rem 0;
  border-bottom:1px solid hsla(0,0%,100%,.1);
  color:var(--color-white);
  transition:color .2s;
}
.lp-sp-menu__acc-btn {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.625rem 0;
  border:0;
  border-bottom:1px solid hsla(0,0%,100%,.1);
  background:rgba(0,0,0,0);
  color:inherit;
  font:inherit;
  cursor:pointer;
  transition:color .2s;
}
.lp-sp-menu__acc-icon {
  width:.875rem;
  height:.875rem;
  opacity:.5;
  transition:transform .2s;
}
.lp-sp-menu__acc-icon.is-open {
  transform:rotate(180deg);
}
.lp-sp-menu__acc-body {
  display:none;
  flex-direction:column;
  gap:.125rem;
  background:hsla(0,0%,100%,.05);
  border-radius:0 0 .25rem .25rem;
  padding:.25rem 1rem;
  border-bottom:1px solid hsla(0,0%,100%,.1);
}
.lp-sp-menu__acc-body.is-open {
  display:flex;
}
.lp-sp-menu__acc-link {
  display:block;
  padding:.5rem 0;
  border-bottom:1px solid hsla(0,0%,100%,.1);
  transition:color .2s;
}
.lp-sp-menu__acc-link:last-child {
  border-bottom:0;
}
.lp-sp-menu__cta {
  display:block;
  margin-top:.75rem;
  background:var(--color-accent);
  color:var(--color-primary);
  font-weight:700;
  text-align:center;
  padding:.75rem 0;
  border-radius:9999px;
}
.lp-floating-cta {
  position:fixed;
  bottom:0;
  inset-inline:0;
  z-index:40;
  display:flex;
  flex-direction:row;
  overflow:hidden;
  border-top:1px solid hsla(0,0%,100%,.3);
}
@media (min-width: 1024px) {
  .lp-floating-cta {
    top:auto !important;
    inset-inline:auto !important;
    right:0 !important;
    /* 下限 8.5rem = ページトップボタン (bottom 1.5rem + 4rem) と重ならない高さを確保 */
    bottom:max(8.5rem, 100vh - 850px) !important;
    transform:none !important;
    flex-direction:column !important;
    border:1px solid var(--color-white) !important;
  }
}
.lp-floating-cta>*+* {
  border-left:1px solid hsla(0,0%,100%,.3);
  @media (min-width: 1024px) {
    border-left:0;
    border-top:1px solid hsla(0,0%,100%,.3);
  }
}
.lp-floating-cta__btn {
  flex:1;
  height:3.5rem;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:.5rem;
  padding:.5rem;
  font-size:.75rem;
  font-weight:500;
  line-height:1.25;
  @media (min-width: 1024px) {
    flex:none;
    height:80px;
    flex-direction:column;
    gap:.25rem;
    padding:.5rem .75rem;
  }
}
.lp-floating-cta__btn--primary {
  background:var(--color-primary);
  color:var(--color-white);
}
.is-revival-lp .lp-floating-cta__btn--primary {
  @media (hover: hover) {
    &:hover {
      color:var(--color-white);
    }
  }
}
.lp-floating-cta__btn--accent {
  background:var(--color-accent);
  color:var(--color-primary);
}
.is-revival-lp .lp-floating-cta__btn--accent {
  @media (hover: hover) {
    &:hover {
      color:var(--color-primary);
    }
  }
}
.lp-floating-cta__btn--line {
  background:var(--color-white);
  color:var(--color-line);
}
.is-revival-lp .lp-floating-cta__btn--line {
  @media (hover: hover) {
    &:hover {
      color:var(--color-line);
    }
  }
}
.lp-floating-cta__btn-icon {
  width:1.5rem;
  height:1.5rem;
  @media (min-width: 1024px) {
    width:1.25rem;
    height:1.25rem;
  }
}