@charset "UTF-8";
/*==========================================
作成日：2026.3.21
mainViewのスタイル（初期設定 最大：767px）
===========================================*/
.mainView {
  position: relative;
  background-attachment: fixed; /* 背景を固定 */
}
.bg-slider {
  width: 100vw;
  height: 100vh;
  background-position: center center;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 100;
}
/* -----メイン画像ロゴ----- */
.bg-slider .pc {
  display: none;
}
/* -----共通----- */
.subtitle1, .subtitle2 {
  padding-bottom: 0.5em;
}
.subtitle1 img, .subtitle2 img {
  width: 95%;
  height: auto;
}
img {
  border-radius: 5px;
}
.shadow {
  box-shadow: 2px 2px 4px;
}
/* -----notice-box----- */
.notice-box {
  background: #ffffff;
  border: 1px solid #ccc;
  padding: 16px;
  border-radius: 8px;
  margin: 16px 0;
}
.notice-box h3 {
  margin-top: 0;
  font-size: 1.2em;
}
.notice-box p {
  margin: 8px 0 0 0;
  line-height: 1.5;
}
/* リスト本体の余白リセット */
.notice-box .notice-list {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}
/* 各項目 */
.notice-box .notice-list li {
  position: relative;
  padding-left: 20px; /* マーカー分のインデント */
  margin-bottom: 12px; /* 項目間の余白 */
  line-height: 1.6; /* 読みやすく */
  color: #333; /* テキスト色はお好みで */
  font-size: 0.95em; /* 少し控えめサイズ */
  text-align: left;
}
/* マーカー（前の●） */
.notice-box .notice-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em; /* テキスト行の中央に合うよう調整 */
  width: 6px;
  height: 6px;
  background: #bfa046; /* ゴールド系アクセント */
  border-radius: 50%;
}
/* -----accent（クーポン）----- */
.accent {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.accent img {
  width: 90%;
  border-radius: 5px;
  max-width: 806px;
  margin-top: 1em;
  margin-bottom: 1em;
}
/* -----memo---- */
.memo {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  border: thin solid #FECA4E;
  padding: 10px;
  background-color: hsla(0, 0%, 100%, 0.75);
  text-align: center;
  border-radius: 8px;
}
.memo h3 {
  position: relative; /* 疑似要素を配置するために親を相対位置に */
  margin-bottom: 0.85em; /* 下の余白を少し開ける */
}
.memo h3::after {
  content: ""; /* 空のコンテンツ */
  display: block; /* ブロック要素化 */
  width: 50px; /* 線の長さ（お好みで調整） */
  height: 4px; /* 線の太さ */
  background-color: #FECA4E; /* .memo の枠色と合わせる */
  margin: 0 auto; /* 中央寄せ */
  border-radius: 2px; /* 高さの半分で両端を半円に */
}
.memo p {
  text-align: justify;
}
.memo dl {
  text-align: left;
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 1em;
  margin-bottom: 1em;
}
.memo dl dt {
  background-color: #000000;
  padding: 5px;
  color: #FFFFFF;
  margin-bottom: 0.5em;
}
.memo dl dd {
  margin-bottom: 0.5em;
}
/*==========================================
greetingのスタイル（初期設定 最大：767px）
===========================================*/
#greeting {
  margin-top: 7.5em;
  margin-bottom: 3em;
}
#greeting .greeting-inner {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 2em;
  padding-top: 2em;
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding-left: 20px;
  padding-right: 20px;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}
.content1 .textWrap {
  padding-left: 0.8em;
  padding-right: 0.8em;
}
.textWrap .text1.move_left2 h2 {
  margin-bottom: 1.5em;
  text-align: center;
  font-size: 1.2em;
  padding: 1em;
  font-family: "Libre Baskerville", serif;
  font-weight: 700;
  position: relative;
  color: #7A1818;
  border-bottom: thin solid #7A1818;
  border-top: thin solid #7A1818;
  background-color: hsla(0, 0%, 100%, 0.50);
  line-height: 1.6;
}
.textWrap .text1.move_left2 h2 span.line-break {
  display: block;
  margin-top: 10px;
}
.textWrap .text1.move_left2 p {
  line-height: 1.9;
  margin-bottom: 0.5em;
}
/*==========================================
galleryのスタイル（初期設定 最大：767px）
===========================================*/
.gallery {
  margin-bottom: 3em;
  margin-top: 5.5em;
}
#gallery .gallery-inner {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 2em;
  padding-top: 2em;
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding-left: 20px;
  padding-right: 20px;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  text-align: center;
}
div.vid_contents {
  width: 100%; /*背景色を横幅いっぱいに広げる*/
  text-align: center;
  margin: auto;
}
.gallery-inner > ul:not(.gallery-list) {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  overflow-x: auto;
  white-space: nowrap;
}

.gallery-inner > ul:not(.gallery-list) > li {
  margin-bottom: 1em;
  display: inline-block;
  margin-right: 0.5em;
  margin-left: 0.5em;
}
.gallery-title {
  font-size: 1.4em;
  margin: 30px 0 15px;
  text-align: center;
  font-family: 'Georgia', 'Times New Roman', serif;
  color: #1C110D; /* ← 変更しました */
  letter-spacing: 1px;
  position: relative;
}
.gallery-title::after {
  content: "";
  display: block;
  width: 40px;
  height: 3px; /* 少し太くすると丸みが目立ちやすい */
  background: #1C110D;
  margin: 8px auto 0;
  border-radius: 5px; /* ← ここを大きくすると丸みが出ます */
  opacity: 0.7;
}
/*==========================================
priceのスタイル（初期設定 最大：767px）
===========================================*/
.price {
  margin-bottom: 5.5em;
  margin-top: 3em;
}
#price .price-inner {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 2em;
  padding-top: 2em;
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding-left: 20px;
  padding-right: 20px;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  text-align: center;
}
.plan-table .plan {
  max-width: 820px;
  background-color: #FFFDF5;
  color: #2B2B2B; 
	border: 1px solid #BFA046;
	border-radius: 5px;
  margin-bottom: 1em;
  padding: 1em 0.5em;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  font-weight: bold;
}

.price-inner h3{
  font-size: 1.4em;
  margin: 30px 0 15px;
  text-align: center;
  font-family: 'Georgia', 'Times New Roman', serif;
  color: #1C110D; /* ← 変更しました */
  letter-spacing: 1px;
  position: relative;
}
.price-inner h3::after {
  content: "";
  display: block;
  width: 40px;
  height: 3px; /* 少し太くすると丸みが目立ちやすい */
  background: #1C110D;
  margin: 8px auto 0;
  border-radius: 5px; /* ← ここを大きくすると丸みが出ます */
  }
.plan-item {
  display: flex;
  flex-wrap: wrap; /* 折り返し可 */ justify-content: center;
  align-items: center;
  gap: 0.5em;
  margin-bottom: 1.5em;
}
.plan-item:last-child {
  margin-bottom: 0;
}
.plan-item .plan-prices {
  font-size: 90%;
}
.plan-item .plan-prices .min .en {
  font-size: 70%;
} /* 時間と通常料金の間に「・・・」を挿入（共通では非表示） */ .plan-prices .normal::before {
  content: "・・・";
  display: none;
  margin: 0 0.5em;
} /* プライマリグループ */ 
.plan-campaign {
  display: flex;
  align-items: center;
  gap: 0.25em;
}
.plan-item .arrow {
  font-size: 1em; /* 矢印アイコンのサイズ */ color: inherit; /* 親の文字色に合わせる */ display: inline-block;
  vertical-align: middle;
}
.campaign-label {
  background-color: #c62828;
  color: #fffbe6;
  border: 1px solid #ffd700; /*padding: 1px 4px;*/ border-radius: 3px;
  font-size: 0.65em;
  font-weight: bold;
  letter-spacing: 0.5px;
  margin-right: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.5em;
  line-height: 1.2;
  padding: 0 0.4em;
}
.campaign-price {
  color: #3B1D0E;
}
/* ========== フード：横スクロールのカード列 ========== */

/* 横スクロールの列：高さをそろえる */
.scroll-x {
  display: flex;
  align-items: stretch;                 /* 子要素の高さを行の高さに合わせる */
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 8px 4px 12px;
}

/* 各カード（.plan-table）を“同じ高さ”に */
.scroll-x .plan-table {
  flex: 0 0 100%;                       /* SP: 1枚表示（既存のまま） */
  display: flex;                        /* 子の .plan を伸ばすため */
  scroll-snap-align: start;
  min-width: 0;
}

/* カード本体を縦積み＋高さ100%にして均等化 */
.scroll-x .plan-table .plan {
  max-width: none;
  width: 100%;
  height: 100%;                         /* ← equal height のキモ */
  display: flex;
  flex-direction: column;
}

/* 画像の高さブレを防止（どの比率でも同じ見え方に） */
.scroll-x .plan-table .plan img {
  width: 100%;
  aspect-ratio: 16 / 9;                 /* 任意の比率。固定高にしたいなら height:160px; でも可 */
  object-fit: cover;                     /* 余白なくトリミング */
  display: block;
}
.charge-info {
   text-align: center;
  margin: 2em auto;
  padding: 1em 1.5em;
  max-width: 500px; /* 横幅を限定して中央に配置 */
  background-color: #fffdf5; /* アイボリー背景 */
  border: 1px solid #bfa046; /* ゴールド枠 */
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* ほんのり影 */
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: #3b1d0e; /* ロゴ系の濃茶 */
}

.charge-info p {
  margin: 0.4em 0;
}

.charge-info p span.jp {
  font-weight: 700;
  color: #bfa046; /* ゴールドで強調 */
  margin-right: 0.2em;
}

.charge-info p span.en {
  font-size: 0.9em;
  opacity: 0.8;
  margin-left: 0.2em;
}


/*==========================================
accessImgのスタイル（初期設定 最大：767px）
===========================================*/
#accessImg {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  clear: both;
  padding-top: 2em;
}
#accessImg .accessTitle h2 {
  display: inline-block;
  position: relative;
  margin-top: 2em;
  margin-bottom: 1em;
  color: #030201;
  font-size: 1.5em;
  text-align: center;
}
#accessImg .accessTitle {
  text-align: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
#accessImg .accessTitle h2:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px; /*下線の上下位置調整*/
  display: inline-block;
  width: 50px; /*下線の幅*/
  height: 4px; /*下線の太さ*/
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translate(-50%); /*位置調整*/
  background-color: #030201; /*下線の色*/
}
#accessImg h3 {
  margin-top: 1em;
  font-size: 1em;
  padding: 0.5em;
  color: #030201;
  border: thin solid #030201;
  background-color: hsla(0, 0%, 100%, 0.70);
}
#accessImg ul {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  /* スマホサイズでのみ横スクロール */
  overflow-x: auto; /* 横スクロールを有効化 */
  white-space: nowrap; /* li要素を折り返さない */
}
#accessImg ul li {
  margin-bottom: 1em;
  display: inline-block; /* 横並びにする */
  margin-right: 0.5em; /* li要素間の余白 */
  margin-left: 0.5em; /* li要素間の余白 */
}
.info-inner .info table {
  width: 100%;
}
/*.info .move_left2 img {
	max-width: 507px;
	margin-left: auto;
	margin-right: auto;
}*/
/* アクセス見出しロゴのセンタリング（確実版） */
.info-inner .info h3.move_left2 {
  text-align: center;         /* 親で中央寄せ */
  transform: none !important; /* ← アニメのオフセットを無効化 */
  opacity: 1 !important;      /* ライブラリが触っていれば戻す（保険） */
}

.info-inner .info h3.move_left2 img {
  display: block;             /* インラインだと margin:auto; が効かない */
  margin: 0 auto;             /* 画像自体を中央に */
  max-width: 202px;           /* 既存指定を踏襲 */
  height: auto;
}
/*==========================================
newsのスタイル（初期設定 最大：767px）
===========================================*/
.news {
  margin-bottom: 3em;
  margin-top: 3em;
}
#news .news-inner {
  width: 98%;
  margin-left: auto;
  margin-right: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#news .news-inner h2 {
  text-align: center;
  margin-bottom: 0px;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
  font-family: "Libre Baskerville", serif;
  font-weight: 700;
  border-top: 1px solid #d9c68f;
  border-bottom: 1px solid #d9c68f;
  background: #bfa046;
  color: #FFFFFF;
}
#news .news-inner ul {
  max-height: 230px;
  overflow: scroll;
  background-color: #FFFFFF;
}
#news .news-inner ul li {
  border-bottom: 1px dotted #333;
  padding-left: 1em;
  padding-top: 0.5em;
  padding-bottom: 0.2em;
  margin: 0.5em;
}
#news .news-inner ul li .day {
  margin-right: 1em;
  font-weight: bold;
  margin-bottom: 0.5em;
  display: block;
}
#news .news-inner ul li:first-child .day:before {
  content: "new";
  background-color: #c62828;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 80%;
  border-radius: 3px;
  padding: 5px;
  margin-right: 3px;
}
.tbl-r02 tr .bn_access img {
	max-width: 250px;
}

/* ────────── スマホだけ（767px以下） ────────── */
@media screen and (max-width: 767px) {

  /* 1アイテム全体：左寄せ＋改行前提の余白と区切り線 */
  .plan-item {
    flex-wrap: wrap;                /* 横幅が足りない時に改行 */
    justify-content: flex-start;    /* 左寄せ */
    width: 100%;
    padding: 8px 0;                 /* ブロックの余白 */
    margin-bottom: 0;               /* 余白はpaddingに集約 */
    border-bottom: 1px solid rgba(191,160,70,.35);
  }
  .plan-item:last-child {
    border-bottom: none;
  }

  /* “名前＋価格”ラッパー：flex指定を打ち消し、縦並びへ */
  .plan-item .plan-prices {
    display: block !important;      /* ← ここが肝：flexを無効化 */
    width: 100%;
    text-align: left;               /* 基準は左寄せ */
  }

  /* 1行目：メニュー名（日本語＋英語） */
  .plan-item .plan-prices .min {
    display: block;
    text-align: left;
    line-height: 1.4;
  }

  /* 2行目：価格（右寄せ・強調） */
  .plan-item .plan-prices .normal {
    display: block;
    text-align: right;
    margin-top: 0.25em;
    font-weight: 700;
    color: #715E27;                 /* ゴールドで視認性UP */
    font-variant-numeric: tabular-nums; /* 桁揃えでブレ減少 */
    letter-spacing: 0.02em;
  }

  /* 価格の前：短い装飾ドット（長すぎると改行しやすいので控えめに） */
  .plan-prices .normal::before {
    content: "······";                 /* 例：「・」3つ。長さは好みで調整可 */
    display: inline;
    margin-right: 0.25em;
    opacity: .6;
  }

  /* キャンペーン行（既存仕様を維持） */
  .plan-campaign {
    flex-basis: 100%;
    align-self: flex-start;
    margin-top: -0.8em;
    justify-content: center;
  }
.plan-item.before-heading {
  border-bottom: none;
}
  .charge-info {
    font-size: 0.95rem;
    padding: 0.8em 1em;
    margin: 1.5em auto;
  }

  /* 既存：不要なら削除可（block化後はgapの効果は薄い） */
  /* .plan-prices { gap: 1em; } */
}

@media screen and (min-width:768px) {
  /*==========================================
mainViewのスタイル（最小：768px）
===========================================*/
  /*  .mainView:before {
    background-image: url("../img/bg-body-pc.webp");
  }*/
  /* video */
  /* -----メイン画像ロゴ----- */
  .bg-slider .sp {
    display: none;
  }
  .bg-slider .pc {
    display: block;
  }
  /* -----共通----- */
  .subtitle2 img {
    width: 50%;
    height: auto;
  }
  /* -----memo---- */
  .memo {
    width: 70%;
    padding: 20px;
  }
  /* -----notice-box----- */
  .notice-box {
    width: 90%; /* 画面幅の90% */
    max-width: 700px; /* 最大700pxまで */
    margin: 16px auto; /* 上下マージンは16px、左右は自動中央寄せ */
  }
  /*==========================================
greetingのスタイル（最小：768px）
===========================================*/
  #greeting .greeting-inner {
    padding: 2em;
  }
  .textWrap .text1.move_left2 h2 {
    font-size: 1.3em;
  }
  /*==========================================
galleryのスタイル（最小：768px）
===========================================*/
  #gallery .gallery-inner {
    width: 95%;
    padding: 5em 2em;
  }
  #gallery .gallery-inner .subtitle2 {
    margin-bottom: 2em;
  }
  .gallery-inner ul {
    display: flex; /* Flexboxでレイアウト管理 */
    flex-wrap: wrap; /* 折り返し可能にする */
    justify-content: center; /* 中央揃え */
    gap: 1em; /* 間隔を統一 */
    padding: 0; /* デフォルトの余白をなくす */
  }
  .gallery-inner ul li {
    width: 48%; /* 2つずつ並べる */
    display: flex; /* flexを適用して高さを均等に */
    justify-content: center; /* 画像を中央に配置 */
    align-items: center;
    text-align: center;
    box-sizing: border-box; /* 幅計算のズレを防ぐ */
    margin: 0; /* 余分なマージンを削除 */
  }
  .gallery-inner ul li img {
    width: 100%; /* 画像のサイズを親要素の幅に合わせる */
    height: auto;
    display: block;
  }
  .notice-box {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
  }
  /*==========================================
priceのスタイル（最小：768px）
===========================================*/
  #price .price-inner {
    width: 95%;
    padding: 5em 2em;
    margin-left: auto;
  }
  .plan-item {
    /*flex-wrap: nowrap;*/ /* 折り返し禁止 */
  }
  .plan-campaign {
    flex-basis: auto; /* 幅は中身に合わせる */
    align-self: center; /* 中央揃え */
    margin-top: 0; /* マージンもリセット */
  }
  .plan-prices .normal::before {
    display: inline; /* 「・・・」を表示 */
  }
	  /* 2行レイアウト前提：折り返しOK＋見やすい余白と区切り線 */
  .price .plan-item {
    display: flex;
    flex-wrap: wrap;           /* ← nowrap を確実に打ち消す */
    justify-content: flex-start;
    width: 100%;
    padding: 8px 0;
    margin-bottom: 0;          /* 余白はpaddingに集約 */
    border-bottom: 1px solid rgba(191,160,70,.35);
  }
  .price .plan-item:last-child { border-bottom: none; }

  /* “名前＋価格”コンテナを縦並びに固定（PC用ブロックと同じ効果） */
  .price .plan-item .plan-prices {
    display: block !important; /* ← これがキモ（横並びを打ち消す） */
    width: 100%;
    text-align: left;
  }

  /* 1行目：メニュー名（左） */
  .price .plan-item .plan-prices .min {
    display: block;
    text-align: left;
    line-height: 1.4;
  }

  /* 2行目：価格（右寄せ・強調） */
  .price .plan-item .plan-prices .normal {
    display: block;
    text-align: right;
    margin-top: 0.25em;
    font-weight: 700;
    color: #715E27;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
  }

  /* 価格前のドット（スマホ/PCに合わせて短めに統一） */
  .price .plan-prices .normal::before {
    content: "···";
    display: inline;
    margin-right: 0.25em;
    opacity: .6;
  }

  /* 見出し直前の .plan-item の線を消す（あなたのクラス） */
  .price .plan-item.before-heading { border-bottom: none; }

.charge-info {
    font-size: 1rem;
  }
  /* -----.coupon----- */
  .price-inner .flexbox .coupon p {
    width: 55%;
    display: inline-block;
  }
  .coupon p img {
    border-radius: 5px;
    width: 100%;
  }
  /* -----.note----- */
  .flexbox.cf .plan-table.matchHeight .note {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2.5em;
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 2em;
  }
  .price-inner .accent4 {
    width: 50%;
  }
  .option {
    width: 80%;
  }
	/* タブレット：2枚見せる */
.scroll-x .plan-table { flex-basis: calc((100% - 24px) / 2); }
  /*==========================================
accessImgのスタイル（最小：768px）
===========================================*/
  #accessImg .accessTitle {
    width: 50%;
  }
  .accessvideo {
    width: 40%;
  }
  #accessImg h3 {
    padding: 1em;
    display: inline-block;
  }
  #accessImg h3 br {
    display: none;
  }
  #accessImg ul {
    width: 100%;
  }
  #accessImg ul li {
    width: 48%;
    margin-bottom: 1.5em;
    display: inline-block;
  }
  /*==========================================
newsのスタイル（最小：768px）
===========================================*/
  #news .news-inner {
    width: 95%;
    padding: 2em;
  }
}
@media screen and (min-width:1025px) {
  /*==========================================
mainViewのスタイル（最小：1025px）
===========================================*/
  /* -----notice-box----- */
  .notice-box {
    width: 40%; /* 画面幅の80% */
    max-width: 400px; /* 最大900pxまで */
    margin: 24px auto; /* 上下マージンを少し大きめに */
  }
  /* -----memo---- */
  .memo {
    width: 40%;
    padding: 30px;
  }
  /*==========================================
greetingのスタイル（最小：1025px）
===========================================*/
  #greeting {
    margin-bottom: 4em;
  }
  #greeting .greeting-inner {
    width: 80%;
    border-radius: 8px;
  }
  .content1 {
    display: flex;
    align-items: center; /* 縦方向の中央揃え */
  }
  .content1 .textWrap {
    width: 49%;
    margin-right: auto; /* 右側に配置 */
  }
  .greeting .content1 .photo1 {
    width: 48%;
  }
  .box {
    display: flex;
    justify-content: center; /* 水平方向の中央揃え */
    align-items: center; /* 縦方向の中央揃え */
  }
  .textWrap .text1.move_left2 h2 {
    font-size: 1.5em;
  }
  /*==========================================
galleryのスタイル（最小：1025px）
===========================================*/
  #gallery .gallery-inner {
    width: 90%;
    padding: 4em 2em;
    border-radius: 8px;
  }
  .gallery-inner ul {
    width: 90%;
    padding: 0.5em 0em;
    border-radius: 8px;
  }
  .gallery-inner ul li {
    width: 30%;
  }
  /*==========================================
priceのスタイル（最小：1025px）
===========================================*/
.scroll-x {
    overflow-x: visible;          /* 横スクロールOFF */
    scroll-snap-type: none;       /* スナップOFF */
    flex-wrap: wrap;              /* 折り返して並べる */
    justify-content: center;      /* 最終行を中央寄せ（左寄せなら flex-start） */
    gap: 24px;                    /* 列間を少し広め＝カードが“細め”に見える */
    padding-left: 0;
    padding-right: 0;
  }

#price .price-inner {
    width: 90%;
    padding: 4em 2em;
    border-radius: 8px;
  }
  .plan-item {
    gap: 1em;
  }
  .option {
    width: 40%;
  }
	/* PC：3枚見せる */
	 /* gap:24px が2つ入るので 48px を引いて3等分。
     さらに “- 8px” でカードをほんの少し細くする微調整 */
  .scroll-x .plan-table {
    flex: 0 0 calc((100% - 48px) / 3 - 8px);
  }
  /* -----.coupon----- */
  .accent #coupon {
    padding-top: 3em;
    padding-bottom: 3em;
  }
  /* -----.note----- */
  .flexbox.cf .plan-table.matchHeight .note {
    width: 40%;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    padding-left: 2.5em;
  }
  .price-inner .accent4 {
    width: 30%;
  }
	/* === すべての画面幅で統一：名前1行 + 価格1行（右寄せ） + 区切り線 + 短いドット === */
.price .plan-item {
  /* 2行レイアウト前提 */
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  width: 100%;

  /* 見やすさ（余白と区切り） */
  padding: 8px 0;
  margin-bottom: 0; /* 余白はpaddingに集約 */
  border-bottom: 1px solid rgba(191,160,70,.35);
}
.price .plan-item:last-child { border-bottom: none; }

/* “名前＋価格”ラッパー：縦並びに確定 */
.price .plan-item .plan-prices {
  display: block !important;      /* ← flex指定を確実に打ち消し */
  width: 100%;
  text-align: left;               /* 基準は左寄せ */
}

/* 1行目：メニュー名（日本語＋英語） */
.price .plan-item .plan-prices .min {
  display: block;
  text-align: left;
  line-height: 1.4;
}

/* 2行目：価格（右寄せ・強調） */
.price .plan-item .plan-prices .normal {
	display: block;
	text-align: right;
	margin-top: 0.25em;
	font-weight: 700;
	color: #715E27;                      /* ゴールドで視認性UP */
	font-variant-numeric: tabular-nums;  /* 桁揃え */
	letter-spacing: 0.02em;
}

/* 価格の前：短い装飾ドット（長いと折返しやすいので控えめに） */
.price .plan-prices .normal::before {
  content: "···";
  display: inline;
  margin-right: 0.25em;
  opacity: .6;
}

/* 見出し直前の .plan-item だけ下線を消す（あなたが付けたクラス用） */
.price .plan-item.before-heading { border-bottom: none; }
  .charge-info {
    font-size: 1.1rem;
    padding: 1.2em 2em;
  }
  /*==========================================
accessImgのスタイル（最小：1025px）
===========================================*/
  #accessImg .accessTitle {
    width: 40%;
  }
  #accessImg h3 {
    font-size: 1.2em;
  }
  #accessImg ul {
    width: 90%;
    padding: 0.5em 0em;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #accessImg ul li {
    width: 20%;
    margin-bottom: 1.5em;
    margin-left: 1%;
    margin-right: 1%;
  }
  /*==========================================
newsのスタイル（最小：1025px）
===========================================*/
  #news .news-inner {
    width: 80%;
    padding: 4em;
    border-radius: 8px;
    background-color: hsla(0, 0%, 100%, 0.00);
  }
  #news .news-inner h2 {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
  }
  #news .news-inner ul {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
  }
  #news .news-inner ul li {
    padding-top: 1em;
    padding-bottom: 1em;
  }
}

/* ===== gallery v2 ===== */
.gallery-list {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  list-style: none;

  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;

  display: block;
  text-align: left; /* ← center→leftに変更 */
}

.gallery-list li {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: top;

  width: 100%;
  max-width: none;
  min-width: 0;
  aspect-ratio: 3 / 4;

  margin: 0;
  padding: 0;
  box-sizing: border-box;

  border-radius: 10px;
  overflow: hidden;
  scroll-snap-align: start;
  position: relative;
  background: #111; /* 下地は暗めに */
}

/* 縦画像 */
.gallery-list li.photo-vertical img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

/* 横画像 */
.gallery-list li.photo-horizontal img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
 /* background: #f3efe9;*/
}
.gallery-list li .gallery-link {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none; /* ← 下線を消す */
}

.gallery-list li .gallery-link img {
  display: block; /* ← 下の隙間を消す */
}
.gallery-list li.photo-horizontal::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("../img/bg-gallery.webp");
  /*background-size: cover;*/
	background-size: 110%;
  background-position: center;
  z-index: 1;
	opacity: 0.85;
	filter: contrast(1.1) brightness(1.08); /* ←少し強く */
  pointer-events: none;
}

.gallery-list li .gallery-link {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  position: relative;
  z-index: 3;
}

.gallery-list li .gallery-link img {
  display: block;
  position: relative;
  z-index: 3;
}
.gallery-list li.photo-horizontal::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(to bottom,
      rgba(0,0,0,0.25) 0%,
      rgba(0,0,0,0.10) 15%,
      rgba(0,0,0,0.00) 35%,
      rgba(0,0,0,0.00) 65%,
      rgba(0,0,0,0.10) 85%,
      rgba(0,0,0,0.25) 100%
    );
	pointer-events: none;
}
/* ===== 768px以上（タブレット） ===== */
@media screen and (min-width: 768px) {
  .gallery-list {
    white-space: normal;
    overflow-x: visible;
    overflow-y: visible;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1em;

    width: min(90%, 980px);
  }

  .gallery-list li {
    width: calc(50% - 0.5em);   /* ← 2列 */
    max-width: 420px;
    margin: 0;
  }
}

/* ===== 1025px以上（PC） ===== */
@media screen and (min-width: 1025px) {
  .gallery-list {
    display: grid;
    grid-template-columns: repeat(3, 320px); /* ← 固定 */
    justify-content: center;
    gap: 1em;

    width: 100%;
    max-width: 1040px; /* ← 全体幅も制限 */
    margin-left: auto;
    margin-right: auto;
  }

  .gallery-list li {
    width: 100%;
    max-width: none;
    margin: 0;
  }
}
/* ==========================
   Lightbox
========================== */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  justify-content: center;
  align-items: center;
  padding: 20px;
  background: rgba(0, 0, 0, 0.85);
}

.lightbox.is-open {
  display: flex;
}

.lightbox-image {
  max-width: min(92vw, 1200px);
  max-height: 88vh;
  width: auto;
  height: auto;
  display: block;
  border-radius: 10px;
}

.lightbox-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: rgba(255,255,255,0.9);
  font-size: 28px;
  cursor: pointer;
}

body.lightbox-open {
  overflow: hidden;
}