@charset "UTF-8";
/* ステーキ 鉄雅(旧 ステーキ 薫風 ← 日本焼肉 みなと川) — ダーク和モダン型（黒×金・横組み・大判ヒーロー）
   旧「日本焼肉 はせ川」→「日本焼肉 みなと川」(2026-08-29)→「ステーキ 薫風」(2026-09-03 指示)→「ステーキ 鉄雅」(2026-09-17 指示)
   CM 演出の都合で、個室・記念日プレートの情報はファーストビューに出さず
   ページ下部（03・04）に配置している */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  color: #e8e3db;
  background: #12100e;
  font-size: 15px;
  line-height: 1.9;
}
img { max-width: 100%; display: block; }

/* ---------- 画像プレースホルダー ----------
   実ファイルが無い間だけ枠を表示する。images/ に実ファイルを置けば自動で差し替わる */
.ph {
  position: relative;
  aspect-ratio: var(--ph-ar, 16 / 9);
  background: repeating-linear-gradient(-45deg, #241f1a 0 10px, #1d1915 10px 20px);
  border: 1px dashed #4a4136;
  overflow: hidden;
}
.ph::after {
  content: "画像支給待ち " attr(data-ph);
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; letter-spacing: .06em; color: #8e8375; text-align: center; padding: 10px;
}
.ph img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }

/* 実ファイルが入ったら枠(点線・網掛け・「支給待ち」表記)は消す。
   比率が完全に一致しない画像でも枠が透けないようにするため */
.ph:has(img) { border: none; background: none; }
.ph:has(img)::after { display: none; }

/* ===== ヘッダー ===== */
.hd {
  background: rgba(18,16,14,.94); border-bottom: 1px solid #2c2721;
  position: sticky; top: 0; z-index: 20;
}
.hd-in {
  max-width: 1280px; margin: 0 auto; padding: 16px 34px;
  display: flex; align-items: center; gap: 34px;
}
.brand-ja {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 21px; letter-spacing: .18em; color: #f3ede2;
}
.brand-en { font-size: 9.5px; letter-spacing: .3em; color: #a8916a; margin-top: 3px; }
.nav { margin-left: auto; }
.nav ul { list-style: none; display: flex; gap: 28px; }
.nav li { font-size: 13px; letter-spacing: .1em; color: #b4aa9c; cursor: pointer; }
.nav li.on { color: #d4b877; border-bottom: 1px solid #d4b877; padding-bottom: 3px; }

/* ===== ヒーロー ===== */
.hero { position: relative; overflow: hidden; }
.hero-ph { border: none; aspect-ratio: 16 / 9; }
/* キャッチコピーと重ならないよう、枠の表記は下端に寄せる */
.hero-ph::after { align-items: flex-end; padding-bottom: 26px; }
/* 画像の明暗にかかわらずキャッチが読めるよう、横方向＋上方向の二重グラデーションをかける */
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(10,8,7,.9) 0%, rgba(10,8,7,.58) 46%, rgba(10,8,7,.18) 100%),
    linear-gradient(180deg, rgba(10,8,7,.5) 0%, rgba(10,8,7,0) 38%);
}
.hero-copy { position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 3; width: 100%; }
.hero-copy > * { max-width: 1280px; margin: 0 auto; padding: 0 34px; }
.hero-sub { font-size: 11px; letter-spacing: .34em; color: #d4b877; margin-bottom: 20px; }
.hero-copy h1 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 62px; font-weight: 400; letter-spacing: .1em; line-height: 1.35; color: #fff;
  text-shadow: 0 2px 24px rgba(0,0,0,.6);
}
.hero-copy p {
  font-size: 15px; letter-spacing: .14em; color: #dcd4c6; margin-top: 18px;
  text-shadow: 0 2px 18px rgba(0,0,0,.6);
}

/* ===== セクション ===== */
.sec { max-width: 1280px; margin: 0 auto; padding: 72px 34px; }
.sec.dark { max-width: none; background: #1a1613; }
.sec.dark > * { max-width: 1280px; margin-left: auto; margin-right: auto; }
.sec-head { display: flex; align-items: baseline; gap: 18px; margin-bottom: 38px; }
.sec-no {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 12px; letter-spacing: .2em; color: #a8916a;
  border: 1px solid #4a4136; padding: 4px 11px;
}
.sec h2 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 28px; font-weight: 400; letter-spacing: .16em; color: #f3ede2;
}

/* お品書き */
.menu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: start; }
.menu-list dl { border-bottom: 1px solid #2c2721; padding: 20px 0; }
.menu-list dl:first-child { border-top: 1px solid #2c2721; }
.menu-list dt {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 18px; letter-spacing: .08em; color: #f3ede2;
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
}
.menu-list .yen { color: #d4b877; font-size: 16px; white-space: nowrap; }
.menu-list dd { font-size: 13.5px; color: #a9a094; margin-top: 8px; line-height: 1.95; }
.menu-list dd b { color: #d4b877; font-weight: 400; }

/* お席のご案内 */
.room { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: center; }
.room img { width: 100%; height: 420px; object-fit: cover; }
.room-tx p { font-size: 15px; line-height: 2.15; color: #cfc6b8; margin-bottom: 24px; }
.room-tx b { color: #d4b877; font-weight: 400; }
.room-spec { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.room-spec tr { border-bottom: 1px solid #2c2721; }
.room-spec tr:first-child { border-top: 1px solid #2c2721; }
.room-spec th {
  text-align: left; padding: 12px 16px; width: 120px; font-weight: 400;
  color: #8e8375; letter-spacing: .08em; vertical-align: top;
}
.room-spec td { padding: 12px 16px; color: #d8d0c4; }

/* 記念日 */
.anniv { display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 34px; align-items: start; }
.anniv figcaption { font-size: 12px; color: #8e8375; margin-top: 10px; letter-spacing: .06em; }
.anniv-tx h3 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 21px; font-weight: 400; letter-spacing: .1em; color: #d4b877; margin-bottom: 16px;
}
.anniv-tx p { font-size: 14.5px; line-height: 2.1; color: #cfc6b8; margin-bottom: 20px; }
.anniv-tx b { color: #f3ede2; font-weight: 400; border-bottom: 1px solid #6b5b3d; }
.anniv-list { list-style: none; }
.anniv-list li {
  font-size: 13.5px; color: #a9a094; padding: 9px 0 9px 18px;
  border-bottom: 1px dashed #2c2721; position: relative;
}
.anniv-list li::before { content: "・"; position: absolute; left: 0; color: #a8916a; }
.anniv-list b { color: #e8e3db; font-weight: 400; }

/* 店舗案内 */
.access { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: center; }
.access-tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.access-tbl tr { border-bottom: 1px solid #2c2721; }
.access-tbl tr:first-child { border-top: 1px solid #2c2721; }
.access-tbl th {
  text-align: left; padding: 12px 16px; width: 110px; font-weight: 400;
  color: #8e8375; letter-spacing: .08em; vertical-align: top;
}
.access-tbl td { padding: 12px 16px; color: #d8d0c4; }
.reserve { display: flex; align-items: center; gap: 20px; margin-top: 34px; flex-wrap: wrap; }
.btn-res {
  background: #d4b877; color: #1a1613; border: none; padding: 16px 52px;
  font-size: 15px; letter-spacing: .16em; cursor: pointer; font-family: inherit; font-weight: 700;
}
.reserve span { font-size: 12.5px; color: #8e8375; }

/* ===== フッター ===== */
.ft { border-top: 1px solid #2c2721; padding: 44px 34px; background: #0e0c0b; }
.ft-in { max-width: 1280px; margin: 0 auto; text-align: center; }
.ft-brand {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-size: 17px; letter-spacing: .2em; color: #d4b877; margin-bottom: 18px;
}
.ft-note { font-size: 12px; color: #8e8375; }
.ft-copy { font-size: 10.5px; color: #6b6257; margin-top: 10px; letter-spacing: .18em; }

/* 横はみ出し防止 */
.menu-grid > *, .room > *, .access > *, .anniv > * { min-width: 0; }