/* ===== Top Text Menu (Header下) ===== */
.lp-bottom-nav{
  position: relative;
  background: #fff;
  border-top: 1px solid #E5E7EB;
  border-bottom: 1px solid #E5E7EB;
  z-index: 50;
  padding: 6px 0;
}

.lp-bottom-nav__inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 20px;
  font-family: "Zen Old Mincho", serif;
}

.lp-bottom-nav__link{
  color: #1A1A1A;
  text-decoration: none;
  font-size: clamp(12px, 2.0vw, 15px);
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
  padding: 6px 18px;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: all .25s ease;
}
.lp-bottom-nav__link:hover{
  color: #007AC6;
  background: rgba(0,122,198,.08);
}

.lp-divider{
  width: 1px;
  background: #000;
  opacity: .25;
  margin: 0;
}

/* 1024px以下 */
@media (max-width: 1024px){
  .lp-bottom-nav{
    padding: 12px 0;
    border-top: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
    background: #fff;
  }
  .lp-bottom-nav__inner{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, auto);
    grid-auto-flow: row;
    column-gap: 14px;
    row-gap: 12px;
    justify-items: stretch;
    align-items: stretch;
  }
  .lp-divider{ display: none; }

  /* 2行目は自然に左から3つ並ぶ */
  .lp-bottom-nav__inner > a:nth-of-type(5),
  .lp-bottom-nav__inner > a:nth-of-type(6),
  .lp-bottom-nav__inner > a:nth-of-type(7){
    grid-column: auto;
  }

  /* <br>を消して中央1行表示・文字小さめ・ボックス控えめ */
  .lp-bottom-nav__link br{ display:none; }
  .lp-bottom-nav__link{
    font-size: 12px;
    padding: 6px 8px;
    line-height: 1.3;
    background: rgba(255,255,255,0.9);
    border: 1px solid #E5E7EB;
    border-radius: 0;
    width: 100%;
    justify-content: center;
  }
  .lp-bottom-nav__link:hover{ background: rgba(0,122,198,0.06); }
}

/* 旧lp-bottom-nav非表示（グローバルナビに統一） */
.lp-bottom-nav {
  display: none !important;
}

/* ▼ MENUボタンのスタイルはheader.cssに移動 ▼ */

/* モバイルナビゲーション設定 */
@media (max-width: 768px){
  /* ▼ モバイルでは通常ナビをオーバーレイ表示（初期は非表示） */
  .lp-bottom-nav{
    position:fixed;
    top:64px;
    left:0; right:0;
    background:#fff;
    border-top:1px solid #E5E7EB;
    border-bottom:1px solid #E5E7EB;
    box-shadow:0 10px 24px rgba(0,0,0,.14);
    padding:12px 0;
    z-index:110;
    display:none;
  }
  .lp-bottom-nav.is-open{ display:block; }

  .lp-bottom-nav__inner{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, auto);
    grid-auto-flow: row;
    gap:12px 14px;
    max-width:1100px;
    margin:0 auto;
    padding:0 16px;
  }

  .lp-divider{ display:none; }
  .lp-bottom-nav__link br{ display:none; }

  .lp-bottom-nav__link{
    font-size:12px;
    line-height:1.3;
    padding:8px 10px;
    background:#fff;
    border:1px solid #E5E7EB;
    border-radius:0;
    width:100%;
    justify-content:center;
  }
}

/* 767px以下 */
@media (max-width: 767px){
  .lp-bottom-nav__inner{
    grid-template-columns: repeat(2, 1fr); /* ✅ 2列 */
    grid-template-rows: repeat(4, auto);   /* ✅ 4行 */
    max-width: 420px;
    margin: 0 auto;
  }
  .lp-bottom-nav__link{ font-size:11px; padding:7px 8px; }

  /* 最後の1項目だけ2列ぶち抜きで中央寄せ */
  .lp-bottom-nav__inner > a:nth-of-type(7){
    grid-column: 1 / span 2;
    justify-self: center;
    width: 60%;
  }
}

/* モバイル用オーバーレイ背景 */
.lp-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 109;
  display: none;
  transition: opacity 0.3s ease;
  opacity: 0;
}
.lp-overlay.is-active{
  display: block;
  opacity: 1;
}
