@charset "utf-8";

/*
 * 850px 以下用スタイル（スマホ）
 * このファイルは index.html で media="(max-width: 850px)" により読み込まれる。
 * PC（851px以上）は styles.css のみ。スマホ用の変更はこのファイルで行う。
 */

/* スマホだけ改行：括弧内などを <span class="br-sp">...</span> で囲むと改行される */
.br-sp {
  display: block;
}

.pc-only {
  display: none !important;
}

.sp-only {
  display: block !important;
}

.page {
  padding-top: 50px;
}

.site-header {
  height: 50px;
  padding-top: 0;
}

.site-header.is-nav-open {
  opacity: 1;
  background-color: rgba(255, 255, 255, 1);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  padding: 0;
  gap: 0;
}

.brand {
  height: 50px;
  padding-top: 5px;
}

.brand-logo {
  width: 120px;
  height: 40px;
}

.header-inner__left {
  display: flex;
  align-items: center;
  gap: 5px;
}

.reserve-button {
  display: block;
  width: 24px;
  height: 24px;
}

.reserve-button img {
  width: 100%;
  margin-top: -2px;
}

/* ハンバーガー（スマホのみ。WP移植時はテーマの button に負けないよう背景・線を明示） */
.header-hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer;
  color: var(--color-onsen);
  flex-shrink: 0;
  transition: opacity 0.3s ease;
}

.header-hamburger:hover {
  opacity: 0.7;
}

.header-hamburger__line {
  display: block !important;
  width: 24px;
  height: 2px;
  background: var(--color-onsen) !important;
  border: none;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease;
}

/* 開いたときの×アニメ */
.site-header.is-nav-open .header-hamburger__line:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.site-header.is-nav-open .header-hamburger__line:nth-child(2) {
  opacity: 0;
}

.site-header.is-nav-open .header-hamburger__line:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

.site-nav {
  position: fixed;
  top: 50px;
  left: 0;
  right: 0;
  z-index: 18;
  display: none;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-evenly;
  min-height: calc(100vh - 50px);
  padding: 0 12px;
  background: var(--background-white);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  margin: 0;
  gap: 0;
  text-align: center;
}

.site-header.is-nav-open .site-nav {
  display: flex;
}

.header-drawer__main {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-evenly;
  flex: 1;
  min-height: 0;
}

.site-nav .nav-link {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 48px;
  padding: 14px 12px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text-brown);
  border-bottom: 1px solid var(--border-light);
}

.site-nav .nav-link::after {
  display: none;
}

.header-drawer__sub {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-evenly;
  flex: 1;
  min-height: 0;
  border-top: none;
}

.header-drawer__link {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 48px;
  padding: 12px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text-brown);
  border-bottom: 1px solid var(--border-light);
}

.header-drawer__link:last-of-type {
  border-bottom: none;
}

/* アクセス（3番目）の下のボーダーも消す（次が宿泊予約のため） */
.header-drawer__sub .header-drawer__link:nth-child(4) {
  border-bottom: none;
}

/* 宿泊予約：高さ150px・上余白30px */
.header-drawer__reservation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: 0 0 150px;
  height: 150px;
  min-height: 150px;
  margin-left: -12px;
  margin-right: -12px;
  width: calc(100% + 24px);
  padding: 14px 16px 80px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text-brown);
  background: var(--reservation-btn-bg);
  border-top: none;
}

.header-drawer__reservation-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

/* MV：スマホはウィンドウ高さ100%（ヘッダー50pxぶんを引く） */
.hero {
  min-height: calc(100vh - 76px);
  min-height: calc(100dvh - 76px);
  height: calc(100vh - 76px);
  height: calc(100dvh - 76px);
}

.hero-slider.slick-dotted.slick-slider {
  height: 100%;
}

.hero-caption {
  top: 5vh;
  font-size: 24px;
  line-height: 35px;
  padding: 20px 15px;
}

/* MV News：スマホは「News」の下に日付・タイトルを2行、左余白5% */
.hero-news {
  bottom: 64px;
  /* flex-direction: column; */
  align-items: flex-start;
  gap: 8px;
  width: 90%;
  min-height: 0;
  height: 65px;
  padding: 20px 5% 20px 5%;
}

.hero-news a {
  margin-top: -10px;
}

.hero-news-label {
  line-height: 20px;
}

.hero-news-divider {
  height: 38px;
  margin-top: -5px;
}

.hero-news-ticker {
  width: 100%;
  height: auto;
  overflow: visible;
}

.hero-news-ticker__link {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
}

.hero-news-date,
.hero-news-title {
  display: block;
}

.hero-news-date {
  white-space: normal;
}

/* .hero-news-divider {
  width: 100%;
  height: 1px;
} */

/* タイトルは1行で省略記号表示 */
.hero-news-title {
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.noren-menu {
  display: none;
}

.noren-link {
  font-size: 18px;
}

.reservation-cta {
  top: auto;
  right: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 5px 16px;
  z-index: 15;
  background: var(--reservation-btn-bg);
  opacity: 0.8;
}

/* topへ戻る：スマホのみの差分（宿泊予約バーより上・前面に表示） */
.pagetop-cta {
  bottom: 28px;
  right: 5px;
  z-index: 16;
}

.reservation-text {
  font-size: 10pt;
  line-height: 1.2;
  writing-mode: horizontal-tb;
}

.reservation-cta .reservation-icon {
  width: 16px;
  height: 16px;
}

.main-sections-bg {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
  padding: 80px 0 60px;
  background-image: url(../assets/decor/bg_mobile.png?20260221);
  background-repeat: repeat;
}

.main-sections-bg section + section {
  margin-top: 60px;
}

.onsen-section,
.dining-section,
.stay-section {
  overflow-x: hidden;
  box-sizing: border-box;
}

.onsen-section {
  overflow: visible;
}

.top .onsen-stage,
.top .dining-stage,
.top .stay-stage {
  width: 94%;
}

.onsen-stage,
.dining-stage,
.stay-stage {
  width: 90%;
  max-width: 100%;
  height: auto;
  min-height: 320px;
  margin: 0 auto;
  overflow: hidden;
  box-sizing: border-box;
}

/* 温泉セクション：写真・説明文・もっと見るはフロー、雲だけabsoluteで写真に重ねる */
.onsen-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  overflow: visible;
  min-height: 0;
}

.onsen-badge {
  left: auto;
  right: -5px;
  top: -10px;
  width: 100px;
  height: auto;
  aspect-ratio: 140 / 82;
  z-index: 3;
}

.onsen-badge .badge-text,
.dining-badge .badge-text,
.stay-badge .badge-text {
  font-size: 18px;
  /* 白文字を太く見せる（WP別fontでboldが使えないため） */
  text-shadow:
    0.1px 0 0 var(--color-white),
    -0.1px 0 0 var(--color-white),
    0 0.1px 0 var(--color-white),
    0 -0.1px 0 var(--color-white),
    0.1px 0.1px 0 var(--color-white),
    -0.1px -0.1px 0 var(--color-white);
}

.onsen-badge .badge-text {
  margin: -4px 3px 0 0;
}

.dining-badge .badge-text {
  margin: -59px 4px 0 0;
}

.stay-badge .badge-text {
  margin: 12px 1px 0 0;
}

.onsen-photo {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  width: 80%;
  margin-top: 25px;
  margin-right: 5%;
  height: auto;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  z-index: 1;
}

.onsen-photo::before {
  background-size: cover;
  background-position: center;
}

.onsen-cloud {
  position: absolute;
  left: 0;
  top: 56vw;
  width: 90%;
  height: 24vw;
  padding: 9vw 0 0;
  gap: 1vw;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 2;
}

.onsen-cloud-text {
  position: absolute;
  top: 12vw;
  left: 14vw;
  right: auto;
  font-size: 4.5vw;
  line-height: 1.4;
  margin: 0;
  text-shadow:
    0.1px 0 0 var(--text-dark),
    -0.1px 0 0 var(--text-dark),
    0 0.1px 0 var(--text-dark),
    0 -0.1px 0 var(--text-dark),
    0.1px 0.1px 0 var(--text-dark),
    -0.1px -0.1px 0 var(--text-dark),
    0.1px -0.1px 0 var(--text-dark),
    -0.1px 0.1px 0 var(--text-dark),
    0 -2px 2px var(--color-white),
    2px 2px 3px var(--color-white);
}

.onsen-cloud-text--top {
  top: 4.5vw;
  left: 6vw;
}

.onsen-body {
  position: relative;
  left: auto;
  right: auto;
  top: 18vw;
  width: 80%;
  margin-top: 15px;
  margin-right: 5%;
  min-width: 140px;
  max-width: 100%;
  font-size: 15px;
  line-height: 1.6;
  text-align: left;
  z-index: 2;
}

.onsen-more {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  margin-top: 18vw;
  margin-right: 5%;
  overflow: visible;
  z-index: 2;
}

/* 食事セクション：温泉の左右反転（写真左・雲・テキスト左） */
.dining-section {
  overflow: visible;
}

.dining-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  overflow: visible;
  min-height: 0;
}

.dining-badge {
  position: absolute;
  left: 0;
  right: auto;
  top: -3px;
  width: 80px;
  height: auto;
  aspect-ratio: 50 / 50;
  z-index: 3;
}

.dining-photo {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  width: 80%;
  margin-top: 25px;
  margin-left: 5%;
  margin-right: 0;
  height: auto;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  z-index: 1;
}

.dining-photo::before {
  background-size: cover;
  background-position: center;
}

.dining-photo-logo {
  left: 5px;
  bottom: 5px;
  transform: scale(0.6);
  transform-origin: bottom left;
}

.dining-cloud {
  position: absolute;
  left: auto;
  right: 0;
  top: 52vw;
  width: 80%;
  height: 38vw;
  padding: 9vw 0 0;
  gap: 1vw;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 2;
}

.dining-cloud-text {
  position: absolute;
  top: 19.5vw;
  left: auto;
  right: 0vw;
  font-size: 4.5vw;
  line-height: 1.4;
  margin: 0;
  text-shadow:
    0.1px 0 0 var(--text-dark),
    -0.1px 0 0 var(--text-dark),
    0 0.1px 0 var(--text-dark),
    0 -0.1px 0 var(--text-dark),
    0.1px 0.1px 0 var(--text-dark),
    -0.1px -0.1px 0 var(--text-dark),
    0.1px -0.1px 0 var(--text-dark),
    -0.1px 0.1px 0 var(--text-dark),
    0 -2px 2px var(--color-white),
    2px 2px 3px var(--color-white);
}

.dining-cloud-text--top {
  top: 12vw;
  left: 10vw;
  right: auto;
}

.dining-body {
  position: relative;
  left: auto;
  right: auto;
  top: 21vw;
  width: 80%;
  margin-top: 15px;
  margin-left: 5%;
  margin-right: 0;
  min-width: 140px;
  max-width: 100%;
  font-size: 15px;
  line-height: 1.6;
  text-align: left;
  z-index: 2;
}

.dining-more {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  margin-top: 21vw;
  margin-left: 5%;
  margin-right: 0;
  overflow: visible;
  z-index: 2;
}

/* 宿泊セクション：温泉と同じ配置（写真右・雲・テキスト右） */
.stay-section {
  overflow: visible;
}

.stay-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  overflow: visible;
  min-height: 0;
}

.stay-badge {
  position: absolute;
  left: auto;
  right: 0;
  top: 0;
  width: 70px;
  height: auto;
  aspect-ratio: 52 / 48;
  z-index: 3;
}

.stay-photo {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  width: 80%;
  margin-top: 25px;
  margin-right: 5%;
  margin-left: 0;
  height: auto;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  z-index: 1;
}

.stay-photo::before {
  background-size: cover;
  background-position: center;
}

.stay-photo-logo {
  right: 5px;
  bottom: 5px;
  transform: scale(0.6);
  transform-origin: bottom right;
}

.stay-cloud {
  position: absolute;
  left: 0;
  right: auto;
  top: 56vw;
  width: 90%;
  height: 24vw;
  padding: 9vw 0 0;
  gap: 1vw;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 2;
}

.stay-cloud-text {
  position: absolute;
  top: 12vw;
  left: 40vw;
  right: auto;
  font-size: 4.5vw;
  line-height: 1.4;
  margin: 0;
  text-shadow:
    0.1px 0 0 var(--text-dark),
    -0.1px 0 0 var(--text-dark),
    0 0.1px 0 var(--text-dark),
    0 -0.1px 0 var(--text-dark),
    0.1px 0.1px 0 var(--text-dark),
    -0.1px -0.1px 0 var(--text-dark),
    0.1px -0.1px 0 var(--text-dark),
    -0.1px 0.1px 0 var(--text-dark),
    0 -2px 2px var(--color-white),
    2px 2px 3px var(--color-white);
}

.stay-cloud-text:first-child {
  top: 4.5vw;
  left: 11vw;
}

.stay-body {
  position: relative;
  left: auto;
  right: auto;
  top: 18vw;
  width: 80%;
  margin-top: 15px;
  margin-right: 5%;
  margin-left: 0;
  min-width: 140px;
  max-width: 100%;
  font-size: 15px;
  line-height: 1.6;
  text-align: left;
  z-index: 2;
}

.stay-more {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  margin-top: 18vw;
  margin-right: calc(5% + 20px);
  margin-left: 0;
  overflow: visible;
  z-index: 2;
}

.stay-reservation {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  margin-top: 10px;
  margin-right: 5%;
  margin-left: 0;
  overflow: visible;
  z-index: 2;
}

/* フッター：スマホでウィンドウ幅に収める */
.site-footer {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
}

.footer-top,
.footer-main,
.footer-bar {
  overflow-x: hidden;
  box-sizing: border-box;
  padding-top: 30px;
  padding-bottom: 80px;
}

.footer-top__inner,
.footer-main__inner,
.footer-bar__inner {
  max-width: 100%;
  box-sizing: border-box;
}

/* フッター上部：absolute で配置（温泉・食事・宿泊 → 区切り → ナビ左右） */
.footer-top__inner {
  position: relative;
  min-height: 260px;
  padding: 20px 5%;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.footer-top__inner .footer-features {
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 56px;
  padding: 0;
}

.footer-top__inner .footer-divider--v:first-of-type {
  position: absolute;
  top: 120px;
  left: 5%;
  right: 5%;
  width: auto;
  height: 1px;
  min-height: 0;
  margin: 0;
  margin-top: 20px;
}

.footer-top__inner .footer-divider--v:last-of-type {
  display: none;
}

.footer-top__inner .footer-nav--left {
  position: absolute;
  top: 140px;
  left: calc(50% - 145px);
}

.footer-top__inner .footer-nav--right {
  position: absolute;
  top: 140px;
  right: calc(50% - 145px);
}

.footer-top__inner .footer-nav {
  width: 150px;
  max-width: 100%;
  margin: 35px 0;
}

/* footer-main（レイアウト変更）：しんわ・秋田屋ロゴを space-between で横並び、宿泊予約は秋田屋ロゴの下、住所はその下で元のまま */
.footer-main__inner {
  width: 100%;
  display: grid;
  grid-template-areas:
    "logo-shinwa logo-akitaya"
    ".            reservation"
    "brand-info  brand-info";
  grid-template-columns: 1fr 1fr;
  gap: 0 16px;
  align-items: start;
  padding: 0 calc((100vw - 290px) / 2);
  box-sizing: border-box;
}

.footer-main {
  position: relative;
  border-top: none;
  padding: 60px 0 40px 0;
}

.footer-main::before {
  content: "";
  position: absolute;
  top: 0;
  left: 5%;
  right: 5%;
  height: 1px;
  background: var(--footer-divider);
}

.footer-brand {
  display: contents;
}

.footer-reservation {
  display: contents;
}

.footer-brand__logo-wrap {
  grid-area: logo-shinwa;
  justify-self: start;
}

.footer-brand__logo-wrap .footer-brand__logo {
  width: 135px;
  height: auto;
  margin-top: 8px;
}

.footer-akitaya-logo {
  grid-area: logo-akitaya;
  justify-self: end;
  width: 130px;
  height: auto;
}

.footer-reservation__row {
  grid-area: reservation;
  justify-self: end;
  margin: 0;
}

.footer-brand__info {
  grid-area: brand-info;
  align-items: stretch;
  width: 100%;
  max-width: 320px;
  text-align: left;
  margin-top: 40px;
  margin-bottom: 20px;
  justify-self: start;
}

.footer-info-row {
  display: grid;
  grid-template-columns: 8.5em 1fr;
  gap: 0 12px;
  align-items: baseline;
  justify-items: start;
  width: 100%;
}

.footer-brand__info .footer-info-label,
.footer-brand__info .footer-info-value,
.footer-brand__info .footer-contact__name {
  font-size: 14px;
  color: var(--text-brown);
}

.footer-brand__info .footer-info-value {
  font-weight: 500;
}

.footer-brand__info .footer-info-label {
  white-space: normal;
}

/* 赤ブロック（footer-bar）：上余白30px、SNSとcopyrightの間30px */
.footer-bar__inner {
  flex-direction: column;
  align-items: center;
  gap: 30px;
  text-align: center;
}

/* info-section（営業時間・入浴料・アクセス等）：スマホは上余白60px */
.info-section {
  padding: 60px 0 0;
}

/* 営業時間セクション：スマホでウィンドウ幅に収める */
.hours-section {
  overflow-x: hidden;
  box-sizing: border-box;
}

.hours-box {
  width: 90%;
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
  padding: 60px 0;
}

.hours-container {
  max-width: 100%;
  box-sizing: border-box;
  padding: 0 5%;
}

.hours-blocks {
  max-width: 100%;
  box-sizing: border-box;
  margin-top: 20px;
}

.hours-block {
  min-width: 0;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  height: auto;
  min-height: 50px;
}

.hours-block + .hours-block {
  height: auto;
  min-height: 80px;
}

/* ロゴは中央表示、サイズ120px固定 */
.hours-block-brand {
  min-width: 0;
  width: 100%;
  display: flex;
  justify-content: center;
}

.hours-section .hours-block-logo,
.hours-section .hours-block-logo--akitaya {
  width: 120px;
  height: auto;
}

.hours-block-sep {
  width: 100%;
  min-height: 1px;
  height: 1px;
  margin: 4px 0;
}

/* 項目名・時間を1行で、時間の位置を揃える。小さい画面ではみ出さないよう縮小可に */
.hours-block-content--grid {
  flex: 1 1 100%;
  min-width: 0;
  grid-template-columns: minmax(0, 8em) minmax(0, 1fr);
  gap: 4px 16px;
  align-items: baseline;
}

.hours-block-time {
  min-width: 0;
  text-align: right;
  white-space: normal;
  word-break: break-all;
  overflow-wrap: break-word;
}

.hours-block-cat {
  white-space: normal;
  min-width: 0;
}

.hours-block-content p {
  white-space: normal;
}

@media (max-width: 360px) {
  .hours-section .hours-block-content,
  .hours-section .hours-block-cat,
  .hours-section .hours-block-time {
    font-size: 4.4vw;
  }
  .access-section .access-info-label,
  .access-section .access-info-value,
  .access-section .access-detail-title-box,
  .access-section .access-detail-list,
  .access-section .access-detail-list li,
  .access-section .access-shuttle-title,
  .access-section .access-shuttle-desc {
    font-size: 4.4vw;
  }
  .pricing-section .pricing-cat,
  .pricing-section .pricing-price,
  .pricing-section .pricing-more .more-button-text {
    font-size: 4.4vw;
  }
}

/* 入浴料セクション：スマホでウィンドウ幅に収める */
.pricing-section {
  overflow-x: hidden;
  box-sizing: border-box;
}

.pricing-box {
  width: 90%;
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
  padding: 60px 5%;
}

.access-box {
  width: 90%;
  max-width: 100%;
  margin: 0 auto;
  padding: 60px 5%;
  box-sizing: border-box;
}

/* アクセス：flex やめてブロックで縦積み、項目左・内容右は col 内グリッドで */
.access-info {
  display: block;
}

.access-info-col {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px 13px;
  align-items: baseline;
  min-width: 0;
  margin-bottom: 35px;
}

.access-info-row {
  display: contents;
}

.access-info-label {
  white-space: nowrap;
}

.access-info-value {
  text-align: right;
  min-width: 0;
}

.access-detail {
  display: block;
  margin-bottom: 32px;
}

.access-subheading {
  margin: 0 0 24px;
  font-size: 20px;
  text-align: center;
  white-space: nowrap;
}

.access-detail-cols {
  flex-direction: column;
  gap: 24px;
}

.access-detail-col {
  flex: none;
  max-width: none;
  align-items: stretch;
}

.access-detail-title-box {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

.access-shuttle {
  display: block;
}

.access-shuttle-title {
  display: block;
  margin: 0 0 24px;
  font-size: 20px !important;
  text-align: center;
  white-space: nowrap;
}

/* 地図：スマホは横幅ウィンドウサイズ・縦400px（ズレ防止） */
.access-section .exception-section .exception-section__inner {
  width: 100%;
  max-width: 100%;
}

.access-map iframe {
  width: 100%;
  height: 400px;
}

.pricing-container {
  max-width: 100%;
  box-sizing: border-box;
}

/* 小学生と幼児の間を他行と同じ25pxに（列間gapは0で .pricing-row の margin-bottom のみ） */
.pricing-table {
  flex-wrap: wrap;
  gap: 0;
  max-width: 100%;
}

.pricing-col {
  flex: 1 1 100%;
  max-width: 100%;
  min-width: 0;
}

.pricing-row {
  min-width: 0;
}

.pricing-cat,
.pricing-price {
  white-space: normal;
  word-break: break-all;
}

.pricing-footer {
  padding-right: 0;
  max-width: 100%;
}

/* NEWSセクション：上の余白60px、左右余白5%（3%から変更） */
.news-section .container {
  width: 90%;
}

.news-section {
  padding-top: 60px;
}

.news-header {
  margin-bottom: 40px;
}

.pricing-header {
  margin-bottom: 40px;
}

.hours-header {
  margin-bottom: 40px;
}

.news-list {
  padding-inline-start: unset;
}

.news-meta ul {
  padding-left: 0;
}

.news-date {
  margin-right: 10px;
  margin-bottom: 5px;
}

.news-tag {
  margin-right: 4px;
  margin-bottom: 3px;
}

.news-item__link {
  padding: 20px 5%;
  gap: 15px;
}

.news-more {
  padding-bottom: 100px;
}

/* 施設案内：3つのボタンは縦並び・間隔10px */
.facility-actions {
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 40px;
  margin-bottom: 40px;
}

/* 施設案内セクション：上下余白 */
.facilities-section {
  padding: 60px 0 80px;
}

/* 施設案内スライダー：スマホは横幅100%・breakpoint 850 のみ（JS側） */
.facilities-section .exception-section .exception-section__inner {
  width: 100%;
  max-width: 100%;
}

.facilities-header {
  margin-bottom: 40px;
}

.facilities-section .facilities-header {
  display: block;
  width: 100%;
  position: relative;
  z-index: 1;
}

.facilities-section .facilities-title {
  display: block;
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  color: var(--text-brown);
}

.facility-carousel {
  width: 100%;
  --facility-slide-size: 34vw;
}

.facility-carousel .slick-list {
  padding: 0 2% !important;
  height: var(--facility-slide-size) !important;
}

.facility-carousel .slick-track {
  height: var(--facility-slide-size) !important;
}

.facility-carousel .slick-slide,
.facility-carousel .slick-slide > div {
  width: var(--facility-slide-size) !important;
  height: var(--facility-slide-size) !important;
  box-sizing: border-box;
}

.facility-slide {
  width: var(--facility-slide-size) !important;
  height: var(--facility-slide-size) !important;
  box-sizing: border-box;
}

.facility-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}