/* =========================
全体
========================= */
.single-menu .section-inner{
  max-width:980px;
  margin:0 auto;
  padding:100px 40px; /* ←増やす */
}

/* ブロック間余白 */

.menu-header{
  margin-bottom:50px;
}

.menu-gallery{
  margin-bottom:60px;
}

/* タイトル */
.menu-title{
  font-size:26px;
  font-weight:300;
  letter-spacing:0.15em;
}

.title-br{
	font-size:20px;
}

.menu-sub{
  color:#888;
  font-size:14px;
  letter-spacing:0.1em;
}

.menu-desc,
.menu-contents,
.menu-price,
.menu-star{
  margin:40px 0;
  line-height:2;
  color:#444;
}

/* 説明 */
.menu-desc{
  margin:40px 0;
  line-height:2;
  color:#444;
}

.menu-desc strong{
  display:block;
  margin:32px 0 12px;

  font-size:14px;
  letter-spacing:.12em;
  font-weight:600;
}

.menu-desc .u{
    text-decoration: underline 
}

.dec-row{
	padding:20px;
	border-bottom: 1px solid rgba(0,0,0,0.06);
	transition: background .4s ease;
	}

/* 内容 */
.contents-row{
	padding:20px;
	border-bottom: 1px solid rgba(0,0,0,0.06);
	transition: background .4s ease;
}

/* =========================
画像
========================= */

/* 外枠 */
.menu-gallery{

  position:relative;

  margin-bottom:120px; /* pagination分も含める */

  overflow:visible !important;

}

/* Swiper本体 */
.menu-gallery .swiper{
  height:100%;
  overflow:visible !important;
}

.menu-gallery .swiper-wrapper{
  overflow:visible;
}

.menu-gallery .swiper-slide{
  opacity:.3;
  transition:opacity .8s ease;
}

.menu-gallery .swiper-slide-active{
  opacity:1;
}

.menu-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* =========================
矢印
========================= */

.menu-gallery .swiper-button-prev,
.menu-gallery .swiper-button-next{

  width:42px;
  height:42px;

  top:50%;
  transform:translateY(-50%);

  z-index:100;

  border-radius:50%;

  background:rgba(255,255,255,.42);

  backdrop-filter:blur(12px);

  border:1px solid rgba(255,255,255,.18);

  color:#fff !important;

  transition:.4s;
}

.menu-gallery .swiper-button-prev{
  left:20px;
}

.menu-gallery .swiper-button-next{
  right:20px;
}

.menu-gallery .swiper-button-prev:hover,
.menu-gallery .swiper-button-next:hover{
  background:rgba(255,255,255,.65);
}

.menu-gallery .swiper-button-prev:after,
.menu-gallery .swiper-button-next:after{
  font-size:13px;
}

/* =========================
ページネーション
========================= */

.menu-gallery .swiper-pagination{

  bottom:25px !important;

  z-index:100;
}

.menu-gallery .swiper-pagination-bullet{

  width:8px;
  height:8px;

  background:rgba(255,255,255,.45);

  opacity:1;

  margin:0 5px !important;
}

.menu-gallery .swiper-pagination-bullet-active{

  background:#fff;

  width:36px;

  opacity:1;
  border-radius:999px;

  transition:.4s;
}



/* =========================
SP
========================= */

@media(max-width:768px){

  .menu-gallery{

    padding-bottom:70px;
  }

  .menu-gallery .swiper-button-prev{
    left:10px;
  }

  .menu-gallery .swiper-button-next{
    right:10px;
  }

  .menu-gallery .swiper-pagination{
    bottom:15px !important;
  }

}

/* =========================================================
Block Title
========================================================= */

.menu-block-title{
  display:flex;
  align-items:center;
  gap:14px;
  max-width:200px;
  font-size:14px;
  letter-spacing:.25em;
  font-weight:500;
  color:#888;
}

/* line */

.menu-block-title::after{
  content:'';

  flex:1;

  height:1px;

  background:rgba(0,0,0,.25);
}
/* =========================
Price：視線設計
========================= */

/* 行全体 */
.price-row{
  display: grid;
    /* 左：可変 / 右2つ：固定幅 */
  grid-template-columns: 1fr 110px 150px;
  align-items: center;
  padding: 20px 20px;
	border-bottom: 1px solid rgba(0,0,0,0.06);
	transition: background .4s ease;
}

/* 補足（menu_add） */
.price-add{
  font-size: 13px;
  color: #444;
  text-align: left;
  letter-spacing: 0.03em;
}

/* 時間（menu_time） */
.price-time{
  font-size: 12px;
  color: #aaa;
  text-align: right;
  letter-spacing: 0.08em;
}

/* 価格（menu_price）←主役 */
.price-main{
  font-size: 18px;
  font-weight: 500;
  text-align: right;
  letter-spacing: 0.05em;
  color: var(--accent);
}

.price-time,
.price-main{
  font-variant-numeric: tabular-nums;
}

@media (max-width: 768px){

  .price-row{
    grid-template-columns: 1fr 150px;
    grid-template-rows: auto auto;
    gap: 6px 10px;
  }

  .price-add{
    grid-column: 1 / -1;
  }

  .price-time{
    grid-column: 1;
    text-align: left;
  }

  .price-main{
    grid-column: 2;
    text-align: right;
  }

}

/* 評価 */
.star-row{
  display:flex;
  justify-content:space-between;
  padding:10px 20px;
  border-bottom:1px solid #eee;
}

.star-value{
  letter-spacing:2px;
  font-size:13px;
  color:#c5a46d; /* ←ゴールド寄せ */
}

/* =========================
Star（完全一致方式）
========================= */
.star-rating{
  --star-size: 14px;
  --star-color: #ddd;
  --star-active: #c5a46d;

  display:inline-block;
  font-size: var(--star-size);
  font-family: serif; /* ←重要（安定させる） */
  letter-spacing: 1.5px;
	position: relative;
	transform:translateY(-1px);
}

/* 背景（グレー） */
.star-rating::before{
  content: "★★★★★";
  color: var(--star-color);
}

/* 前景（ゴールド） */
.star-rating::after{
  content: "★★★★★";
  color: var(--star-active);

  position:absolute;
  left:0;
  top:0;

  width: calc(var(--rating) / 5 * 100%);
  overflow:hidden;
  white-space:nowrap;

  transition: width .6s ease;
}

/* ボタン */
.reserve-btn{
  margin-top:80px;
  padding:18px;
  letter-spacing:0.2em;
  font-size:12px;
  border:1px solid #000;
  background:#000;
  color:#fff;
}

.reserve-btn:hover{
  background:#fff;
  color:#000;
}