/* 洋食店版 公開トップ（承認済みの静的試作 prototypes/restaurant-western-product/css/western.css を移したもの）。1024px 以下は縦に組み、1025px 以上は完成図（幅 904px）の寸法を --u で写す */
:root {
	--wr-wine: #2c0a12;
	--wr-wine-deep: #1c070c;
	--wr-black: #120c0a;
	--wr-charcoal: #262322;
	--wr-cream: #ece5d9;
	--wr-white: #f7f4ee;
	--wr-ink: #1d1916;
	--wr-text: #4f473f;
	--wr-on-dark: #f4eee3;
	--wr-on-dark-soft: #d8cfc1;
	--wr-gold: #836c4b;
	--wr-gold-line: #bfa77d;
	--wr-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Noto Serif CJK JP", "Yu Mincho", "YuMincho", serif;
	--wr-sans: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans CJK JP", "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif;
	--wr-gutter: clamp(20px, 6vw, 56px);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 16px;
}

body {
	margin: 0;
	background: var(--wr-black);
	color: var(--wr-text);
	font-family: var(--wr-serif);
	font-size: 15px;
	line-height: 1.9;
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}

img,
svg {
	display: block;
}

img {
	max-width: 100%;
}

h1,
h2,
h3,
p,
ol,
ul,
figure,
address {
	margin: 0;
	padding: 0;
	font-style: normal;
}

ol,
ul {
	list-style: none;
}

a {
	color: inherit;
	text-decoration: none;
}

a:focus-visible,
button:focus-visible {
	outline: 2px solid var(--wr-gold-line);
	outline-offset: 2px;
}

[hidden] {
	display: none !important;
}

.wr-defs,
.wr-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.wr-page {
	position: relative;
	width: 100%;
	max-width: 1440px;
	margin-inline: auto;
	container-type: inline-size;
	background: var(--wr-black);
}

.wr-frame {
	position: relative;
	overflow: hidden;
	background: var(--wr-charcoal);
}

.wr-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ヘッダー */
.wr-header {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-height: 60px;
	padding: 8px var(--wr-gutter);
	color: var(--wr-on-dark);
}

.wr-logo {
	display: flex;
	align-items: center;
	min-height: 44px;
	font-size: 19px;
	font-weight: 500;
	letter-spacing: 0.06em;
	white-space: nowrap;
}

.wr-menu-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid rgb(244 238 227 / 55%);
	border-radius: 2px;
	background: rgb(18 12 10 / 45%);
	color: var(--wr-on-dark);
	font: inherit;
	font-size: 13px;
	letter-spacing: 0.08em;
	cursor: pointer;
}

.wr-menu-button__bars {
	display: block;
	width: 18px;
	height: 12px;
	border-top: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	background: linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat;
}

.wr-nav {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	display: none;
	padding: 8px var(--wr-gutter) 16px;
	background: var(--wr-wine);
}

.wr-nav.is-open {
	display: grid;
}

.wr-nav a {
	display: flex;
	align-items: center;
	min-height: 48px;
	border-bottom: 1px solid rgb(244 238 227 / 16%);
	font-size: 15px;
	letter-spacing: 0.08em;
}

.wr-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 48px;
	padding: 0 20px;
	background: var(--wr-gold);
	color: #fff;
	font-size: 14.5px;
	letter-spacing: 0.08em;
}

.wr-cta svg,
.wr-outline svg,
.wr-rail__button svg {
	flex: none;
	width: 7px;
	height: 12px;
}

.wr-header .wr-header__cta {
	display: none;
}

/* ヒーロー */
.wr-hero {
	position: relative;
	background: var(--wr-black);
}

.wr-hero__photo {
	position: relative;
	aspect-ratio: 5 / 6;
	margin-top: 236px;
	overflow: hidden;
}

.wr-hero__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, var(--wr-black), rgb(18 12 10 / 0%) 34%);
}

.wr-hero {
	--wr-focus: var(--wr-image-focus-sp, 50% 50%);
	--wr-video-focus: var(--wr-video-focus-sp, 50% 50%);
}

.wr-hero__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--wr-focus);
}

.wr-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--wr-video-focus);
}

.wr-hero__copy {
	position: absolute;
	top: 78px;
	left: var(--wr-gutter);
	right: var(--wr-gutter);
	z-index: 2;
	color: var(--wr-on-dark);
}

.wr-hero__title {
	font-size: clamp(28px, 8.2vw, 44px);
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.5;
}

.wr-ornament {
	display: block;
	width: 40px;
	height: 1px;
	margin-top: 14px;
	background: var(--wr-gold-line);
}

.wr-hero__lead {
	margin-top: 12px;
	color: var(--wr-on-dark);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.85;
	word-break: auto-phrase;
}

.wr-rail {
	display: grid;
	grid-template-columns: 1fr 42%;
	gap: 8px 16px;
	align-items: center;
	padding: 24px var(--wr-gutter);
	background: var(--wr-wine);
	color: var(--wr-on-dark);
}

.wr-rail[data-wr-empty] {
	display: none;
}

.wr-rail__icon {
	display: none;
}

.wr-rail__title {
	grid-column: 1 / -1;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.14em;
}

.wr-rail__text {
	font-size: 14.5px;
	letter-spacing: 0.08em;
	line-height: 1.8;
}

.wr-rail__photo {
	aspect-ratio: 118 / 88;
}

.wr-rail__button {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 48px;
	margin-top: 6px;
	border: 1px solid var(--wr-gold-line);
	font-size: 14.5px;
	letter-spacing: 0.08em;
}

/* コース */
.wr-course {
	position: relative;
	padding: 48px var(--wr-gutter) 44px;
	overflow: hidden;
	background: #170d0a;
	color: var(--wr-on-dark);
	text-align: center;
}

.wr-course__curtain {
	position: absolute;
	top: 0;
	width: 34%;
	height: 220px;
	object-fit: cover;
	opacity: 0.8;
	mask-composite: intersect;
}

.wr-course__curtain--left {
	left: 0;
	mask-image: linear-gradient(90deg, #000 45%, transparent), linear-gradient(180deg, #000 55%, transparent);
}

.wr-course__curtain--right {
	right: 0;
	mask-image: linear-gradient(270deg, #000 45%, transparent), linear-gradient(180deg, #000 55%, transparent);
}

.wr-course__eyebrow,
.wr-course__title,
.wr-course__lead,
.wr-course__list {
	position: relative;
}

.wr-course__eyebrow {
	color: var(--wr-gold-line);
	font-size: 12px;
	letter-spacing: 0.18em;
}

.wr-course__title {
	margin-top: 6px;
	font-size: clamp(19px, 5.6vw, 30px);
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.5;
}

.wr-course__lead {
	margin-top: 10px;
	color: var(--wr-on-dark-soft);
	font-size: 14px;
	letter-spacing: 0.06em;
	line-height: 1.85;
	word-break: auto-phrase;
}

.wr-course__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px 8px;
	margin-top: 26px;
}

.wr-course__list li {
	display: grid;
	justify-items: center;
	align-content: start;
}

.wr-course__list img {
	width: min(100%, 92px);
	height: auto;
	aspect-ratio: 1;
	border: 1px solid var(--wr-gold-line);
	border-radius: 50%;
	object-fit: cover;
}

.wr-course__list strong {
	margin-top: 8px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.5;
}

.wr-course__list span {
	color: var(--wr-on-dark-soft);
	font-size: 12.5px;
	letter-spacing: 0.02em;
	line-height: 1.5;
	word-break: auto-phrase;
}

/* 共通の見出し */
.wr-heading {
	font-size: clamp(25px, 7vw, 32px);
	font-weight: 500;
	letter-spacing: 0.14em;
	line-height: 1.4;
}

.wr-heading::after {
	content: "";
	display: block;
	width: 28px;
	height: 2px;
	margin-top: 8px;
	background: currentColor;
}

.wr-lead {
	margin-top: 14px;
	font-size: 17.5px;
	font-weight: 500;
	letter-spacing: 0.06em;
	line-height: 1.7;
}

.wr-body {
	margin-top: 10px;
	font-size: 14.5px;
	letter-spacing: 0.06em;
	line-height: 1.85;
	word-break: auto-phrase;
}

.wr-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	min-height: 48px;
	margin-top: 18px;
	padding: 0 22px;
	border: 1px solid var(--wr-ink);
	color: var(--wr-ink);
	font-size: 14.5px;
	letter-spacing: 0.06em;
}

/* お料理 */
.wr-dish {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	background: var(--wr-cream);
	color: var(--wr-ink);
}

.wr-dish__copy {
	grid-column: 1 / -1;
	padding: 44px var(--wr-gutter) 32px;
	background: var(--wr-cream);
}

.wr-dish .wr-body {
	color: var(--wr-text);
}

.wr-dish__main {
	grid-column: 1 / -1;
	aspect-ratio: 464 / 256;
}

.wr-badge {
	position: relative;
	z-index: 1;
	grid-column: 2;
	grid-row: 3;
	justify-self: end;
	display: grid;
	place-content: center;
	justify-items: center;
	width: 92px;
	height: 92px;
	margin-right: var(--wr-gutter);
	border-radius: 50%;
	background: var(--wr-wine);
	color: var(--wr-on-dark);
	line-height: 1.3;
	transform: translateY(-60%);
}

.wr-badge strong {
	font-size: 17px;
	font-weight: 500;
}

.wr-badge span {
	font-size: 12px;
}

.wr-badge small {
	font-size: 11px;
}

.wr-dish__sub {
	aspect-ratio: 190 / 118;
	background: var(--wr-black);
}

.wr-dish__sub--a {
	grid-column: 1;
	grid-row: 3;
}

.wr-dish__sub--b {
	grid-column: 2;
	grid-row: 3;
}

/* お席 */
.wr-seats {
	display: grid;
	gap: 28px;
	padding: 44px var(--wr-gutter);
	background: var(--wr-charcoal);
	color: var(--wr-on-dark);
}

.wr-seats .wr-body {
	color: var(--wr-on-dark-soft);
}

.wr-seats__list {
	display: grid;
	gap: 22px;
}

.wr-seats__list .wr-frame {
	aspect-ratio: 16 / 10;
}

.wr-seats__list h3 {
	margin-top: 10px;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-align: center;
}

.wr-seats__list p {
	color: var(--wr-on-dark-soft);
	font-size: 14px;
	letter-spacing: 0.04em;
	line-height: 1.7;
	text-align: center;
}

.wr-plan {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: 0;
}

.wr-plan__plant {
	width: 42px;
	height: auto;
	margin-right: -8px;
	mix-blend-mode: lighten;
}

.wr-plan__map {
	width: min(66%, 240px);
	height: auto;
}

/* 料理人 */
.wr-chef {
	display: grid;
	background: var(--wr-cream);
	color: var(--wr-ink);
}

.wr-chef__copy {
	padding: 44px var(--wr-gutter) 24px;
}

.wr-chef .wr-body {
	color: var(--wr-text);
}

.wr-chef__photo {
	aspect-ratio: 400 / 240;
	background: none;
}

.wr-chef__quote {
	padding: 28px var(--wr-gutter) 44px;
}

.wr-quote {
	font-size: 19px;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.7;
}

.wr-chef__rule {
	display: block;
	width: 28px;
	height: 2px;
	margin-top: 14px;
	background: var(--wr-ink);
}

.wr-chef__name {
	margin-top: 12px;
	font-size: 15.5px;
	letter-spacing: 0.08em;
}

/* ご予約方法 */
.wr-reserve {
	padding: 40px var(--wr-gutter) 44px;
	background: var(--wr-white);
	color: var(--wr-ink);
}

.wr-reserve__ways {
	margin-top: 22px;
}

.wr-reserve__note {
	font-size: 15px;
	letter-spacing: 0.06em;
	line-height: 1.7;
	word-break: auto-phrase;
}

.wr-reserve__buttons {
	display: grid;
	gap: 12px;
	margin-top: 12px;
}

.wr-way {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 100%;
	min-height: 60px;
	padding: 0 16px;
	border: 1px solid #76716a;
	background: transparent;
	color: var(--wr-ink);
	font: inherit;
	font-size: 15.5px;
	letter-spacing: 0.08em;
	cursor: pointer;
}

.wr-way--tel {
	border-color: var(--wr-gold);
	background: var(--wr-gold);
	color: #fff;
}

.wr-way__icon {
	flex: none;
	width: 22px;
	height: 22px;
}

.wr-way__chevron {
	flex: none;
	width: 7px;
	height: 12px;
	margin-left: 8px;
}

.wr-pick__list {
	display: grid;
	gap: 8px;
	margin-top: 12px;
}

.wr-pick__link {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 4px 16px;
	border-left: 2px solid var(--wr-gold);
	background: #ece7dd;
	font-size: 15px;
	letter-spacing: 0.04em;
}

/* 店舗情報 */
.wr-shop {
	display: grid;
	background: var(--wr-charcoal);
	color: var(--wr-on-dark);
}

.wr-shop__info {
	padding: 40px var(--wr-gutter) 36px;
}

.wr-shop__lead {
	margin-top: 12px;
	color: var(--wr-on-dark-soft);
	font-size: 14.5px;
	letter-spacing: 0.06em;
	line-height: 1.75;
}

.wr-shop__name {
	margin-top: 16px;
	font-size: 15.5px;
	font-weight: 500;
	letter-spacing: 0.08em;
}

.wr-shop__address {
	display: grid;
	color: var(--wr-on-dark-soft);
	font-size: 14.5px;
	letter-spacing: 0.04em;
	line-height: 1.75;
}

.wr-outline--dark {
	border-color: var(--wr-on-dark-soft);
	color: var(--wr-on-dark);
}

.wr-shop__exterior {
	aspect-ratio: 373 / 225;
}

.wr-shop__panel {
	position: relative;
	color: #fff;
}

.wr-shop__interior {
	aspect-ratio: 314 / 240;
}

.wr-shop__interior::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgb(14 8 6 / 72%), rgb(14 8 6 / 0%) 62%);
}

.wr-shop__closing {
	position: absolute;
	left: var(--wr-gutter);
	right: var(--wr-gutter);
	bottom: 20px;
	display: grid;
	justify-items: start;
	gap: 10px;
	font-size: 15.5px;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.6;
}

/* フッター */
.wr-footer {
	display: grid;
	justify-items: center;
	gap: 8px;
	padding: 28px var(--wr-gutter);
	background: var(--wr-wine-deep);
	color: var(--wr-on-dark);
}

.wr-footer__logo {
	display: flex;
	align-items: center;
	min-height: 44px;
	font-size: 18px;
	letter-spacing: 0.06em;
}

.wr-footer__nav,
.wr-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.wr-footer__nav a,
.wr-footer__legal a {
	display: flex;
	align-items: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 8px;
	color: var(--wr-on-dark-soft);
	font-size: 13px;
	letter-spacing: 0.06em;
}

/* 追尾 CTA（1024px 以下） */
.wr-sticky {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 20;
	padding: 8px var(--wr-gutter) calc(8px + env(safe-area-inset-bottom));
	background: var(--wr-wine);
	box-shadow: 0 -6px 18px rgb(0 0 0 / 30%);
}

.wr-sticky a {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	background: var(--wr-gold);
	color: #fff;
	font-size: 15px;
	letter-spacing: 0.08em;
}

/* タブレット（600〜1024px）：要素を左右に組み、読める文字の大きさを保つ */
@media (min-width: 600px) and (max-width: 1024px) {
	.wr-hero__photo {
		aspect-ratio: 16 / 10;
		margin-top: 0;
	}

	.wr-hero {
		--wr-focus: var(--wr-image-focus-tablet, 50% 62%);
		--wr-video-focus: var(--wr-video-focus-tablet, 50% 50%);
	}

	.wr-hero__photo::after {
		background: linear-gradient(90deg, rgb(14 8 6 / 76%), rgb(14 8 6 / 0%) 62%);
	}

	.wr-hero__copy {
		top: 92px;
		right: 40%;
	}

	.wr-rail {
		grid-template-columns: 1fr 1fr 1fr;
	}

	.wr-rail__title {
		grid-column: 1;
	}

	.wr-rail__text {
		grid-column: 2;
		grid-row: 1;
	}

	.wr-rail__photo {
		grid-column: 3;
		grid-row: 1 / span 2;
	}

	.wr-rail__button {
		grid-column: 1 / span 2;
		margin-top: 0;
	}

	.wr-course__curtain {
		width: 22%;
		height: 100%;
		mask-composite: add;
	}

	.wr-course__curtain--left {
		mask-image: linear-gradient(90deg, #000 45%, transparent);
	}

	.wr-course__curtain--right {
		mask-image: linear-gradient(270deg, #000 45%, transparent);
	}

	.wr-course__list {
		grid-template-columns: repeat(6, minmax(0, 1fr));
		max-width: 88%;
		margin-inline: auto;
	}

	.wr-dish__copy {
		grid-column: 1;
		grid-row: 1;
	}

	.wr-dish__main {
		grid-column: 2;
		grid-row: 1;
		aspect-ratio: auto;
		height: 100%;
	}

	.wr-seats {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.wr-seats__list {
		grid-column: 1 / -1;
		grid-row: 2;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 12px;
	}

	.wr-plan {
		grid-column: 2;
		grid-row: 1;
	}

	.wr-chef {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wr-chef__photo {
		grid-column: 2;
		grid-row: 1;
		height: 100%;
		aspect-ratio: auto;
	}

	.wr-chef__quote {
		grid-column: 1 / -1;
		padding-top: 8px;
	}

	.wr-reserve__buttons {
		grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
		grid-auto-flow: column;
	}

	.wr-shop {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wr-shop__exterior {
		height: 100%;
		aspect-ratio: auto;
	}

	.wr-shop__panel {
		grid-column: 1 / -1;
	}

	.wr-shop__interior {
		aspect-ratio: 16 / 7;
	}
}

/* PC：完成図（幅 904px）の 1px を --u として写す */
@media (min-width: 1025px) {
	.wr-page {
		--u: calc(100cqw / 904);
	}

	.wr-sticky,
	.wr-menu-button {
		display: none !important;
	}

	.wr-header {
		display: block;
		height: calc(var(--u) * 58);
		min-height: 0;
		padding: 0;
	}

	.wr-logo {
		position: absolute;
		top: calc(var(--u) * 7);
		left: calc(var(--u) * 47);
		font-size: calc(var(--u) * 17);
		letter-spacing: 0.04em;
		line-height: calc(var(--u) * 26);
	}

	.wr-nav {
		position: absolute;
		top: calc(var(--u) * 13);
		right: auto;
		left: calc(var(--u) * 262);
		display: flex;
		padding: 0;
		background: none;
	}

	.wr-nav a {
		justify-content: center;
		min-width: 44px;
		min-height: 44px;
		padding: 0 calc(var(--u) * 13);
		border: 0;
		font-size: max(11.5px, calc(var(--u) * 9.4));
		letter-spacing: 0.04em;
	}

	.wr-header .wr-header__cta {
		position: absolute;
		top: calc(var(--u) * 12);
		left: calc(var(--u) * 776);
		display: inline-flex;
		width: calc(var(--u) * 119);
		min-height: max(44px, calc(var(--u) * 34));
		padding: 0;
		font-size: max(12px, calc(var(--u) * 9.8));
		white-space: nowrap;
	}

	.wr-hero {
		--wr-focus: var(--wr-image-focus-pc, 50% 50%);
		--wr-video-focus: var(--wr-video-focus-pc, 50% 50%);
		height: calc(var(--u) * 372);
		overflow-x: clip;
		background: var(--wr-wine);
	}

	.wr-hero__photo {
		position: absolute;
		top: 0;
		left: 0;
		width: calc(var(--u) * 767);
		height: calc(var(--u) * 370);
		margin: 0;
		aspect-ratio: auto;
	}

	.wr-hero__photo::after {
		content: none;
	}

	.wr-hero__copy {
		top: calc(var(--u) * 106);
		left: calc(var(--u) * 53);
		right: auto;
		width: calc(var(--u) * 330);
	}

	.wr-hero__title {
		font-size: calc(var(--u) * 35.6);
		letter-spacing: 0.07em;
		line-height: calc(var(--u) * 52);
	}

	.wr-ornament {
		position: relative;
		width: calc(var(--u) * 37);
		margin-top: calc(var(--u) * 13);
	}

	.wr-ornament::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: calc(var(--u) * 4);
		height: calc(var(--u) * 4);
		background: var(--wr-gold-line);
		transform: translate(-50%, -50%) rotate(45deg);
	}

	.wr-hero__lead {
		margin-top: calc(var(--u) * 19);
		font-size: max(13px, calc(var(--u) * 11.6));
		letter-spacing: 0.1em;
		line-height: calc(var(--u) * 21);
		white-space: nowrap;
	}

	.wr-rail {
		position: absolute;
		top: 0;
		left: calc(var(--u) * 767);
		z-index: 2;
		display: block;
		width: calc(var(--u) * 137);
		height: calc(var(--u) * 370);
		padding: 0;
	}

	.wr-rail__icon {
		display: block;
		width: calc(var(--u) * 22);
		height: calc(var(--u) * 22);
		margin: calc(var(--u) * 81) auto 0;
		color: var(--wr-gold-line);
	}

	.wr-rail__title {
		margin-top: calc(var(--u) * 6);
		font-size: calc(var(--u) * 12.6);
		line-height: calc(var(--u) * 20);
		text-align: center;
	}

	.wr-rail__title::after {
		content: "";
		display: block;
		width: calc(var(--u) * 58);
		height: 1px;
		margin: calc(var(--u) * 21) auto 0;
		background: var(--wr-gold-line);
	}

	.wr-rail__text {
		margin: calc(var(--u) * 21) 0 0 calc(var(--u) * 19);
		font-size: max(12px, calc(var(--u) * 10.6));
		letter-spacing: 0.08em;
		line-height: calc(var(--u) * 16.6);
		white-space: nowrap;
	}

	.wr-rail__photo {
		position: absolute;
		top: calc(var(--u) * 238);
		left: calc(var(--u) * 10);
		width: calc(var(--u) * 118);
		height: calc(var(--u) * 88);
		aspect-ratio: auto;
	}

	.wr-rail__button {
		position: absolute;
		top: calc(var(--u) * 329);
		left: calc(var(--u) * 18);
		width: calc(var(--u) * 105);
		min-height: max(44px, calc(var(--u) * 29));
		margin: 0;
		gap: calc(var(--u) * 6);
		font-size: max(11px, calc(var(--u) * 9));
		letter-spacing: 0.04em;
		white-space: nowrap;
	}

	.wr-cta svg,
	.wr-outline svg,
	.wr-rail__button svg {
		width: calc(var(--u) * 5);
		height: calc(var(--u) * 9);
	}

	/* コース（y 372〜620） */
	.wr-course {
		height: calc(var(--u) * 248);
		padding: calc(var(--u) * 13) 0 0;
	}

	.wr-course__curtain {
		height: 100%;
		opacity: 1;
		mask-composite: add;
	}

	.wr-course__curtain--left {
		width: calc(var(--u) * 232);
		mask-image: linear-gradient(90deg, #000 70%, transparent);
	}

	.wr-course__curtain--right {
		width: calc(var(--u) * 228);
		mask-image: linear-gradient(270deg, #000 70%, transparent);
	}

	.wr-course__eyebrow {
		font-size: calc(var(--u) * 10);
		letter-spacing: 0.1em;
		line-height: calc(var(--u) * 18);
	}

	.wr-course__title {
		margin-top: calc(var(--u) * 4);
		font-size: calc(var(--u) * 21.6);
		letter-spacing: 0.05em;
		line-height: calc(var(--u) * 34);
	}

	.wr-course__lead {
		margin-top: calc(var(--u) * 6);
		font-size: max(12.5px, calc(var(--u) * 9.8));
		letter-spacing: 0.05em;
		line-height: calc(var(--u) * 17);
	}

	.wr-course__list {
		position: absolute;
		top: calc(var(--u) * 124);
		left: calc(var(--u) * 73);
		grid-template-columns: repeat(6, calc(var(--u) * 127));
		width: calc(var(--u) * 762);
		margin: 0;
		gap: 0;
	}

	.wr-course__list::before {
		content: "";
		position: absolute;
		top: calc(var(--u) * 36);
		left: calc(var(--u) * 5);
		right: calc(var(--u) * 7);
		height: 1px;
		background: var(--wr-gold-line);
	}

	.wr-course__list li {
		position: relative;
	}

	.wr-course__list img {
		width: calc(var(--u) * 72);
		height: calc(var(--u) * 72);
	}

	.wr-course__list strong {
		margin-top: calc(var(--u) * 7);
		font-size: max(12px, calc(var(--u) * 10.2));
		line-height: calc(var(--u) * 16);
	}

	.wr-course__list span {
		font-size: max(11.5px, calc(var(--u) * 9.8));
		line-height: calc(var(--u) * 16);
		white-space: nowrap;
	}

	/* 見出し */
	.wr-heading {
		font-size: calc(var(--u) * 21.4);
		letter-spacing: 0.12em;
		line-height: calc(var(--u) * 30);
	}

	.wr-heading::after {
		width: calc(var(--u) * 27);
		height: max(1px, calc(var(--u) * 1.4));
		margin-top: calc(var(--u) * 7);
	}

	.wr-lead {
		margin-top: calc(var(--u) * 14);
		font-size: calc(var(--u) * 13.8);
		letter-spacing: 0.06em;
		line-height: calc(var(--u) * 21.4);
	}

	.wr-body {
		margin-top: calc(var(--u) * 10);
		font-size: max(12.5px, calc(var(--u) * 10.1));
		letter-spacing: 0.05em;
		line-height: calc(var(--u) * 16.8);
		white-space: nowrap;
	}

	.wr-outline {
		gap: calc(var(--u) * 16);
		min-height: max(44px, calc(var(--u) * 31));
		margin-top: calc(var(--u) * 12);
		padding: 0 calc(var(--u) * 16) 0 calc(var(--u) * 28);
		font-size: max(12px, calc(var(--u) * 10));
	}

	/* お料理（y 620〜878） */
	.wr-dish {
		display: block;
		height: calc(var(--u) * 258);
		background: linear-gradient(90deg, var(--wr-cream) calc(var(--u) * 330), var(--wr-black) calc(var(--u) * 330));
	}

	.wr-dish__copy {
		position: relative;
		z-index: 2;
		height: 100%;
		width: calc(var(--u) * 268);
		padding: calc(var(--u) * 21) 0 0 calc(var(--u) * 47);
	}

	.wr-dish__main {
		position: absolute;
		top: 0;
		left: calc(var(--u) * 250);
		width: calc(var(--u) * 464);
		height: calc(var(--u) * 258);
		aspect-ratio: auto;
		background: none;
		mask-image: linear-gradient(90deg, transparent, #000 12%);
	}

	.wr-badge {
		position: absolute;
		top: calc(var(--u) * 102);
		left: calc(var(--u) * 625);
		width: calc(var(--u) * 80);
		height: calc(var(--u) * 80);
		margin: 0;
		transform: none;
	}

	.wr-badge strong {
		font-size: calc(var(--u) * 14);
		line-height: calc(var(--u) * 19);
	}

	.wr-badge span {
		font-size: calc(var(--u) * 10);
		line-height: calc(var(--u) * 14);
	}

	.wr-badge small {
		font-size: calc(var(--u) * 8.4);
		line-height: calc(var(--u) * 12);
	}

	.wr-dish__sub {
		position: absolute;
		left: calc(var(--u) * 714);
		width: calc(var(--u) * 190);
		aspect-ratio: auto;
	}

	.wr-dish__sub--a {
		top: calc(var(--u) * 10);
		height: calc(var(--u) * 112);
	}

	.wr-dish__sub--b {
		top: calc(var(--u) * 125);
		height: calc(var(--u) * 125);
	}

	/* お席（y 878〜1108） */
	.wr-seats {
		position: relative;
		display: block;
		height: calc(var(--u) * 230);
		padding: calc(var(--u) * 26) 0 0 calc(var(--u) * 47);
	}

	.wr-seats__list {
		position: absolute;
		top: calc(var(--u) * 24);
		left: calc(var(--u) * 221);
		grid-template-columns: calc(var(--u) * 163) calc(var(--u) * 156) calc(var(--u) * 151);
		column-gap: calc(var(--u) * 6);
	}

	.wr-seats__list .wr-frame {
		height: calc(var(--u) * 152);
		aspect-ratio: auto;
	}

	.wr-seats__list h3 {
		margin-top: calc(var(--u) * 6);
		font-size: calc(var(--u) * 11);
		line-height: calc(var(--u) * 16);
	}

	.wr-seats__list p {
		font-size: max(11.5px, calc(var(--u) * 9.4));
		line-height: calc(var(--u) * 15);
		white-space: nowrap;
	}

	.wr-plan {
		position: absolute;
		top: calc(var(--u) * 25);
		left: calc(var(--u) * 722);
		display: block;
		width: calc(var(--u) * 170);
		height: calc(var(--u) * 190);
	}

	.wr-plan__map {
		position: absolute;
		top: 0;
		left: calc(var(--u) * 14);
		width: calc(var(--u) * 146);
	}

	.wr-plan__plant {
		position: absolute;
		top: calc(var(--u) * 65);
		left: 0;
		z-index: 1;
		width: calc(var(--u) * 42);
		margin: 0;
	}

	/* 料理人（y 1108〜1335） */
	.wr-chef {
		position: relative;
		display: block;
		height: calc(var(--u) * 227);
	}

	.wr-chef__copy {
		position: relative;
		z-index: 2;
		padding: calc(var(--u) * 26) 0 0 calc(var(--u) * 47);
	}

	.wr-chef__photo {
		position: absolute;
		top: calc(var(--u) * 4);
		left: calc(var(--u) * 236);
		width: calc(var(--u) * 400);
		height: calc(var(--u) * 222);
		aspect-ratio: auto;
		mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	}

	.wr-chef__quote {
		position: absolute;
		top: calc(var(--u) * 39);
		left: calc(var(--u) * 637);
		z-index: 2;
		padding: 0;
	}

	.wr-quote {
		font-size: calc(var(--u) * 14.6);
		letter-spacing: 0.06em;
		line-height: calc(var(--u) * 25);
		white-space: nowrap;
	}

	.wr-chef__rule {
		width: calc(var(--u) * 24);
		height: max(1px, calc(var(--u) * 1.4));
		margin: calc(var(--u) * 13) 0 0 calc(var(--u) * 11);
	}

	.wr-chef__quote .wr-body {
		margin: calc(var(--u) * 13) 0 0 calc(var(--u) * 11);
		line-height: calc(var(--u) * 18);
	}

	.wr-chef__name {
		margin: calc(var(--u) * 11) 0 0 calc(var(--u) * 11);
		font-size: calc(var(--u) * 11);
	}

	/* ご予約方法（y 1335〜1468） */
	.wr-reserve {
		position: relative;
		min-height: calc(var(--u) * 133);
		padding: calc(var(--u) * 14) 0 calc(var(--u) * 14) calc(var(--u) * 47);
	}

	.wr-reserve__ways {
		position: absolute;
		top: calc(var(--u) * 26);
		left: calc(var(--u) * 327);
		width: calc(var(--u) * 534);
		margin: 0;
	}

	.wr-reserve__note {
		font-size: max(13px, calc(var(--u) * 12));
		line-height: calc(var(--u) * 20);
		text-align: center;
	}

	.wr-reserve__buttons {
		display: flex;
		gap: calc(var(--u) * 15);
		margin-top: calc(var(--u) * 12);
	}

	.wr-pick,
	.wr-way--tel {
		flex: 0 1 calc(var(--u) * 263);
	}

	.wr-way {
		min-height: max(44px, calc(var(--u) * 47));
		font-size: max(13px, calc(var(--u) * 11.6));
	}

	.wr-way__icon {
		width: calc(var(--u) * 18);
		height: calc(var(--u) * 18);
	}

	.wr-way__chevron {
		width: calc(var(--u) * 5);
		height: calc(var(--u) * 9);
		margin-left: calc(var(--u) * 16);
	}

	.wr-pick__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		margin-top: calc(var(--u) * 8);
	}

	.wr-pick__link {
		min-height: max(44px, calc(var(--u) * 30));
		font-size: max(12px, calc(var(--u) * 10));
	}

	/* 開いた一覧のぶんだけ欄を伸ばす */
	.wr-reserve:has(.wr-pick__list:not([hidden])) {
		min-height: calc(var(--u) * 178);
	}

	/* 店舗情報（y 1468〜1693） */
	.wr-shop {
		position: relative;
		display: block;
		height: calc(var(--u) * 225);
	}

	.wr-shop__info {
		position: relative;
		z-index: 2;
		width: calc(var(--u) * 217);
		height: 100%;
		padding: calc(var(--u) * 14) 0 0 calc(var(--u) * 47);
		background: var(--wr-charcoal);
	}

	.wr-shop__lead {
		margin-top: calc(var(--u) * 3);
		font-size: max(11.5px, calc(var(--u) * 10));
		letter-spacing: 0.05em;
		line-height: calc(var(--u) * 16.6);
		white-space: nowrap;
	}

	.wr-shop__name {
		margin-top: calc(var(--u) * 11);
		font-size: calc(var(--u) * 10.6);
		line-height: calc(var(--u) * 17);
	}

	.wr-shop__address {
		margin-top: calc(var(--u) * 2);
		font-size: max(11.5px, calc(var(--u) * 10));
		line-height: calc(var(--u) * 16.4);
		white-space: nowrap;
	}

	.wr-outline--dark {
		display: flex;
		width: calc(var(--u) * 165);
		min-height: max(44px, calc(var(--u) * 29));
		margin-top: calc(var(--u) * 7);
		padding: 0;
	}

	.wr-shop__exterior {
		position: absolute;
		top: 0;
		left: calc(var(--u) * 217);
		width: calc(var(--u) * 373);
		height: 100%;
		aspect-ratio: auto;
	}

	.wr-shop__panel {
		position: absolute;
		top: 0;
		left: calc(var(--u) * 590);
		width: calc(var(--u) * 314);
		height: 100%;
	}

	.wr-shop__interior {
		height: 100%;
		aspect-ratio: auto;
	}

	.wr-shop__interior::after {
		content: none;
	}

	.wr-shop__closing {
		left: calc(var(--u) * 27);
		right: auto;
		bottom: calc(var(--u) * 10);
		gap: calc(var(--u) * 8);
		font-size: calc(var(--u) * 11.6);
		line-height: calc(var(--u) * 18);
	}

	.wr-shop__closing .wr-cta {
		width: calc(var(--u) * 152);
		min-height: max(44px, calc(var(--u) * 33));
		padding: 0;
		font-size: max(11.5px, calc(var(--u) * 9.8));
	}

	/* フッター（y 1693〜1740） */
	.wr-footer {
		position: relative;
		display: block;
		height: calc(var(--u) * 47);
		padding: 0;
	}

	.wr-footer__logo {
		position: absolute;
		top: 50%;
		left: calc(var(--u) * 46);
		font-size: calc(var(--u) * 13.4);
		transform: translateY(-50%);
	}

	.wr-footer__nav {
		position: absolute;
		top: 50%;
		left: calc(var(--u) * 176);
		flex-wrap: nowrap;
		transform: translateY(-50%);
	}

	.wr-footer__nav a {
		padding: 0 calc(var(--u) * 13);
		font-size: max(11px, calc(var(--u) * 8.4));
		white-space: nowrap;
	}

	.wr-footer__legal {
		position: absolute;
		top: 50%;
		right: calc(var(--u) * 26);
		flex-wrap: nowrap;
		transform: translateY(-50%);
	}

	.wr-footer__legal a {
		padding: 0 calc(var(--u) * 8);
		font-size: max(11px, calc(var(--u) * 7.6));
		white-space: nowrap;
	}

	.wr-footer__legal a + a {
		border-left: 0;
		box-shadow: -1px 0 0 0 rgb(244 238 227 / 30%);
		background-clip: padding-box;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}