/* =========================================================
   SITE 114 — responsive.css
   1440+ / 1024-1439 / 768-1023 / 480-767 / 〜479(390基準)
   横スクロール禁止・本文16px維持・タップ44px・固定UI被りなし
   ========================================================= */

/* ---------- 基準（〜767px。390pxを正とする） ---------- */
.hdr__nav, .hdr__tel, .hdr__cta-full { display: none; }
.hdr__cta-short { display: inline; }
.ctabar { display: block; }
.castgrid { grid-template-columns: repeat(2, 1fr); }
.eventgrid { grid-template-columns: 1fr; }
.menugrid { grid-template-columns: repeat(2, 1fr); }
.gallerygrid { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: 1fr; }
.grid-2 { grid-template-columns: 1fr; }
.today { grid-template-columns: repeat(2, 1fr); }
.ftr__grid { grid-template-columns: 1fr; gap: var(--sp-5); }
.castdetail { grid-template-columns: 1fr; }
.castdetail__media { max-width: 280px; margin-inline: auto; }
.accessgrid { grid-template-columns: 1fr; }
.pricetable { display: none; }
.pricecards { display: block; }
.termcards { grid-template-columns: 1fr; }
.endcta__in { flex-direction: column; align-items: flex-start; }
main#main, #main { padding-bottom: calc(var(--h-ctabar) + var(--sp-6)); }

/* 日付タブ: 7日横スクロールにせず、3日＋「週間」ボタン運用（JS側は7日分描画するが、CSSで3件分の表示幅に収め、残りは週間ボトムシートで見せる） */
.datetabs__scroll { overflow-x: visible; flex-wrap: nowrap; }
.datetab { flex: 1 1 0; min-width: 0; padding-inline: 4px; }
.datetab.js-extra-day { display: none; }

/* ---------- 480px〜767px ---------- */
@media (min-width: 480px) {
  .castgrid { grid-template-columns: repeat(2, 1fr); }
  .today { grid-template-columns: repeat(4, 1fr); }
  .accessgrid { grid-template-columns: 1fr; }
}

/* ---------- 768px〜1023px ---------- */
@media (min-width: 768px) {
  .castgrid { grid-template-columns: repeat(3, 1fr); }
  .menugrid { grid-template-columns: repeat(3, 1fr); }
  .gallerygrid { grid-template-columns: repeat(3, 1fr); }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-2 { grid-template-columns: repeat(2, 1fr); }
  .eventgrid { grid-template-columns: repeat(2, 1fr); }
  .ftr__grid { grid-template-columns: 1fr 1fr; }
  .pricetable { display: table; }
  .pricecards { display: none; }
  .termcards { grid-template-columns: repeat(2, 1fr); }
  .castdetail { grid-template-columns: 260px 1fr; }
  .castdetail__media { max-width: none; margin-inline: 0; }
  .accessgrid { grid-template-columns: 1fr 1fr; }
  .datetab.js-extra-day { display: flex; }
  .datetabs__week { display: none; }
}

/* ---------- 1024px〜1439px ---------- */
@media (min-width: 1024px) {
  .hdr__tel { display: flex; }
  .hdr__nav { display: block; }
  .hdr__cta-full { display: inline; }
  .hdr__cta-short { display: none; }
  .hdr__menu { display: none; }
  .ctabar { display: none; }
  main#main, #main { padding-bottom: 0; }
  .ftr__grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .castdetail { grid-template-columns: 320px 1fr; }
}

/* ---------- 1440px以上 ---------- */
@media (min-width: 1440px) {
  .castgrid { grid-template-columns: repeat(4, 1fr); }
  .menugrid { grid-template-columns: repeat(4, 1fr); }
  .gallerygrid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- ドロワーは 1024px 以上で使わない ---------- */
@media (min-width: 1024px) {
  .drawer { display: none !important; }
}