/* ===============================
   rooms-overview: 個室・宴会場ページ本文
   FV / 共通CTA / フッターとは独立したスコープ
   =============================== */

.rooms-overview {
	overflow: clip;
	background-color: var(--color-bg);
	background-image: url("../../img/bg_top-concrete.webp");
	background-repeat: repeat;
	color: var(--color-text);
}

.rooms-overview > section > .container {
	max-width: calc(var(--container-max) + var(--container-gutter) + var(--container-gutter));
}

.rooms-overview__section-title {
	font-size: var(--fs-h2);
	font-weight: var(--fw-medium);
	letter-spacing: 0.055em;
	line-height: 1.45;
}

.rooms-overview__section-title::after {
	content: "";
	display: block;
	width: 128px;
	height: 2px;
	margin-top: var(--space-5);
	background: var(--color-main);
}

.rooms-overview__section-title--center {
	text-align: center;
}

.rooms-overview__section-title--center::after {
	margin-inline: auto;
}

.rooms-overview__guide {
	padding-block: var(--space-10) 112px;
}

.rooms-overview__entries {
	margin-top: var(--space-9);
}

.rooms-overview__entry {
	display: grid;
	align-items: center;
	column-gap: var(--space-10);
}

.rooms-overview__entry + .rooms-overview__entry {
	margin-top: 68px;
}

.rooms-overview__entry--private {
	grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
}

.rooms-overview__entry--banquet {
	grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
}

.rooms-overview__entry--banquet .rooms-overview__entry-visual {
	grid-column: 2;
	grid-row: 1;
}

.rooms-overview__entry--banquet .rooms-overview__entry-content {
	grid-column: 1;
	grid-row: 1;
}

.rooms-overview__entry-visual {
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: var(--radius-md);
}

.rooms-overview__entry-photo,
.rooms-overview__scenes-photo,
.rooms-overview__flow-photo,
.rooms-overview__cuisine-photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rooms-overview__entry-photo--private {
	object-position: center 52%;
}

.rooms-overview__entry-photo--banquet {
	object-position: center 58%;
}

.rooms-overview__entry-content {
	min-width: 0;
	padding-inline: var(--space-1);
}

.rooms-overview__entry-title {
	font-size: 34px;
	font-weight: var(--fw-medium);
	letter-spacing: 0.055em;
	line-height: 1.45;
}

.rooms-overview__uses {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2) var(--space-5);
	margin-top: var(--space-5);
	color: var(--color-text-muted);
	font-size: 15px;
	letter-spacing: 0.03em;
	line-height: var(--lh-body);
}

.rooms-overview__entry-description {
	margin-top: var(--space-6);
	font-size: var(--fs-body-pc);
	letter-spacing: 0.035em;
	line-height: var(--lh-body);
}

.rooms-overview__capacity {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 184px));
	gap: var(--space-3);
	margin-top: var(--space-5);
}

.rooms-overview__capacity-item {
	display: flex;
	align-items: baseline;
	justify-content: center;
	min-height: 44px;
	padding: 8px 16px;
	border: 1px solid var(--color-border);
	color: var(--color-text);
	font-size: var(--fs-body-pc);
	line-height: 1.5;
}

.rooms-overview__capacity-item dt,
.rooms-overview__capacity-item dd {
	display: inline;
}

.rooms-overview__link {
	display: inline-flex;
	align-items: center;
	gap: var(--space-5);
	margin-top: var(--space-7);
	color: var(--color-primary);
	font-size: 20px;
	font-weight: var(--fw-medium);
	letter-spacing: 0.055em;
	line-height: 1.5;
	transition: color var(--duration-fast);
}

.rooms-overview__link::after {
	content: "";
	flex: 0 0 auto;
	width: 9px;
	height: 9px;
	border-top: 1px solid currentcolor;
	border-right: 1px solid currentcolor;
	transform: rotate(45deg);
	transition: transform var(--duration-fast);
}

.rooms-overview__link:hover {
	color: var(--color-primary-hover);
}

.rooms-overview__link:hover::after {
	transform: translateX(3px) rotate(45deg);
}

.rooms-overview__scenes {
	padding-block: 0 104px;
	background: transparent;
}

.rooms-overview__scenes-layout {
	display: grid;
	grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
	align-items: center;
	gap: 72px;
	margin-top: var(--space-7);
}

.rooms-overview__scenes-visual {
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: var(--radius-md);
}

.rooms-overview__scenes-photo {
	object-position: center 62%;
}

.rooms-overview__scenes-list {
	border-top: 1px solid var(--color-border-soft);
}

.rooms-overview__scenes-list li {
	display: flex;
	align-items: center;
	min-height: 70px;
	padding-inline: var(--space-2);
	border-bottom: 1px solid var(--color-border-soft);
	font-size: 20px;
	letter-spacing: 0.055em;
	line-height: 1.5;
}

.rooms-overview__flow {
	padding-block: 88px 96px;
	background: transparent;
}

.rooms-overview__flow-layout {
	display: grid;
	grid-template:
		"meeting dining" auto
		"copy copy" auto
		"equipment equipment" auto
		/ minmax(0, 1fr) minmax(0, 1fr);
	gap: 0 var(--space-4);
	margin-top: var(--space-7);
}

.rooms-overview__flow-visual {
	overflow: hidden;
	aspect-ratio: 12 / 5;
	border-radius: var(--radius-md);
}

.rooms-overview__flow-visual--meeting {
	grid-area: meeting;
}

.rooms-overview__flow-visual--dining {
	grid-area: dining;
}

.rooms-overview__flow-photo {
	object-position: center 60%;
}

.rooms-overview__flow-copy {
	grid-area: copy;
	margin-top: var(--space-5);
	font-size: var(--fs-body-pc);
	letter-spacing: 0.035em;
	line-height: var(--lh-body);
}

.rooms-overview__equipment {
	grid-area: equipment;
	margin-top: var(--space-5);
	font-size: 15px;
	font-weight: var(--fw-medium);
	letter-spacing: 0.035em;
	line-height: var(--lh-body);
}

.rooms-overview__cuisine {
	padding-block: 104px;
	background: transparent;
}

.rooms-overview__cuisine-layout {
	display: grid;
	grid-template:
		"title visual" auto
		"copy visual" 1fr
		/ minmax(0, 0.82fr) minmax(0, 1.18fr);
	align-items: start;
	gap: 0 68px;
}

.rooms-overview__cuisine-title {
	grid-area: title;
	margin-top: var(--space-3);
	font-size: 34px;
}

.rooms-overview__cuisine-visual {
	grid-area: visual;
	overflow: hidden;
	aspect-ratio: 2.1 / 1;
	border-radius: var(--radius-md);
}

.rooms-overview__cuisine-photo {
	object-position: center 48%;
}

.rooms-overview__cuisine-copy {
	grid-area: copy;
	margin-top: var(--space-8);
	font-size: var(--fs-body-pc);
	letter-spacing: 0.035em;
	line-height: var(--lh-body);
}

.rooms-overview__cuisine-copy .rooms-overview__link {
	margin-top: var(--space-7);
}

.rooms-overview__closing {
	position: relative;
	overflow: hidden;
	background: transparent;
}

.rooms-overview__closing::after {
	content: "";
	position: absolute;
	right: var(--space-8);
	bottom: -42px;
	width: 260px;
	height: 220px;
	background: url("../../assets/images/common/cta-plant-right.svg") no-repeat center / contain;
	opacity: 0.13;
	pointer-events: none;
}

.rooms-overview__closing-inner {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 184px;
	text-align: center;
}

.rooms-overview__closing-title {
	font-size: 34px;
	font-weight: var(--fw-medium);
	letter-spacing: 0.07em;
	line-height: 1.8;
}

.rooms-overview__closing-title::after {
	content: "";
	display: block;
	width: 128px;
	height: 2px;
	margin: var(--space-4) auto 0;
	background: var(--color-main);
}

@media (max-width: 767px) {
	.rooms-overview > section > .container {
		padding-inline: var(--container-gutter-mobile);
	}

	.rooms-overview__section-title {
		font-size: var(--fs-h2-mobile);
		letter-spacing: 0.04em;
		line-height: 1.55;
	}

	.rooms-overview__section-title--center {
		font-size: 20px;
		letter-spacing: 0.015em;
		line-height: 1.55;
		white-space: nowrap;
	}

	.rooms-overview__section-title::after {
		width: 48px;
		height: 2px;
		margin-top: var(--space-2);
	}

	.rooms-overview__guide {
		padding-block: var(--space-3) 28px;
	}

	.rooms-overview__entries {
		margin-top: var(--space-5);
	}

	.rooms-overview__entry {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.rooms-overview__entry + .rooms-overview__entry {
		margin-top: var(--space-7);
	}

	.rooms-overview__entry--banquet .rooms-overview__entry-visual,
	.rooms-overview__entry--banquet .rooms-overview__entry-content {
		grid-column: auto;
		grid-row: auto;
	}

	.rooms-overview__entry-visual {
		aspect-ratio: 16 / 9;
	}

	.rooms-overview__entry-content {
		padding-inline: 0;
	}

	.rooms-overview__entry-title {
		margin-top: var(--space-4);
		font-size: var(--fs-h2-mobile);
		letter-spacing: 0.035em;
		line-height: 1.55;
	}

	.rooms-overview__uses {
		gap: 2px var(--space-4);
		margin-top: var(--space-2);
		font-size: 14px;
		line-height: 1.75;
	}

	.rooms-overview__entry-description {
		margin-top: var(--space-3);
		font-size: var(--fs-body-pc);
		line-height: var(--lh-body);
	}

	.rooms-overview__capacity {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-3);
		margin-top: var(--space-3);
	}

	.rooms-overview__capacity-item {
		min-height: 44px;
		padding-inline: var(--space-2);
		font-size: 14px;
		white-space: nowrap;
	}

	.rooms-overview__link {
		justify-content: center;
		width: 100%;
		min-height: 48px;
		gap: var(--space-5);
		margin-top: var(--space-4);
		padding: var(--space-2) var(--space-7);
		border: 1px solid var(--color-primary);
		border-radius: var(--radius-sm);
		font-size: var(--fs-body-pc);
		line-height: 1.5;
		text-align: center;
	}

	.rooms-overview__scenes {
		padding-block: 28px;
	}

	.rooms-overview__scenes-layout {
		display: block;
		margin-top: var(--space-4);
	}

	.rooms-overview__scenes-visual {
		display: none;
	}

	.rooms-overview__scenes-list li {
		min-height: 44px;
		padding-block: var(--space-2);
		padding-inline: 0;
		font-size: var(--fs-body-pc);
		line-height: 1.75;
	}

	.rooms-overview__flow {
		padding-block: var(--space-7);
	}

	.rooms-overview__flow-title {
		font-size: 19px;
		letter-spacing: 0.01em;
		text-align: center;
		white-space: nowrap;
	}

	.rooms-overview__flow-title::after {
		margin-inline: auto;
	}

	.rooms-overview__flow-layout {
		display: flex;
		flex-direction: column;
		margin-top: var(--space-5);
	}

	.rooms-overview__flow-visual {
		aspect-ratio: 16 / 9;
	}

	.rooms-overview__flow-copy {
		margin-top: var(--space-4);
		font-size: var(--fs-body-pc);
		line-height: var(--lh-body);
	}

	.rooms-overview__flow-visual--dining {
		margin-top: var(--space-5);
	}

	.rooms-overview__equipment {
		margin-top: var(--space-4);
		font-size: 14px;
		font-weight: var(--fw-normal);
		line-height: var(--lh-body);
	}

	.rooms-overview__cuisine {
		padding-block: var(--space-7);
	}

	.rooms-overview__cuisine-layout {
		display: grid;
		grid-template:
			"title" auto
			"visual" auto
			"copy" auto
			/ 1fr;
		gap: 0;
	}

	.rooms-overview__cuisine-title {
		margin-top: 0;
		font-size: var(--fs-h2-mobile);
	}

	.rooms-overview__cuisine-visual {
		margin-top: var(--space-5);
		aspect-ratio: 16 / 9;
	}

	.rooms-overview__cuisine-copy {
		margin-top: var(--space-4);
		font-size: var(--fs-body-pc);
		line-height: var(--lh-body);
	}

	.rooms-overview__cuisine-copy .rooms-overview__link {
		margin-top: var(--space-5);
	}

	.rooms-overview__closing::after {
		right: -48px;
		bottom: -28px;
		width: 160px;
		height: 140px;
		opacity: 0.1;
	}

	.rooms-overview__closing-inner {
		min-height: 120px;
	}

	.rooms-overview__closing-title {
		font-size: 19px;
		letter-spacing: 0.015em;
		line-height: 1.75;
	}

	.rooms-overview__closing-title::after {
		width: 48px;
		height: 2px;
		margin-top: var(--space-3);
	}

	.rooms-overview__pc-break {
		display: none;
	}
}

@media (max-width: 359px) {
	.rooms-overview__section-title--center,
	.rooms-overview__flow-title {
		font-size: 19px;
		white-space: normal;
	}
}