/* ==========================================================
   photo-fv: 下層ページ共通FV
   写真・文言・object-position 以外のレイアウトはここで統一する。
   ========================================================== */

.photo-fv-section.photo-fv-section {
	position: relative;
	width: 100%;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	overflow: visible;
	background: var(--color-bg);
}

.photo-fv-section.photo-fv-section::before,
.photo-fv-section.photo-fv-section::after {
	display: none;
	content: none;
}

.photo-fv {
	--photo-fv-height: 192px;
	--photo-fv-content-width: 84%;
	--photo-fv-inline-padding: var(--container-gutter-mobile);
	--photo-fv-title-size: var(--fs-h2-mobile);
	--photo-fv-lead-size: var(--fs-body-pc);
	--photo-fv-body-top: var(--space-10);
	--photo-fv-breadcrumb-top: var(--space-3);

	position: relative;
	isolation: isolate;
	display: block;
	width: 100%;
	height: var(--photo-fv-height);
	min-height: var(--photo-fv-height);
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: var(--color-bg);
	aspect-ratio: auto;
}

.photo-fv::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	display: block;
	background: url("../../img/bg_top-fv_sp.png") no-repeat top center / 100% auto;
	content: "";
	pointer-events: none;
}

.photo-fv--no-image {
	background-color: var(--color-bg);
	background-image: url("../../img/bg_top-concrete.webp");
	background-repeat: repeat;
}

.photo-fv .photo-fv__media {
	position: absolute;
	z-index: 0;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: var(--color-bg-subtle);
	aspect-ratio: auto;
	order: initial;
}

.photo-fv .photo-fv__media::before,
.photo-fv .photo-fv__media::after {
	display: none;
	content: none;
}

.photo-fv .photo-fv__image,
.photo-fv .photo-fv__media img {
	position: static;
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	margin: 0;
	border: 0;
	border-radius: 0;
	object-fit: cover;
	object-position: var(--photo-fv-object-position, center);
	aspect-ratio: auto;
	transform: none;
}

.photo-fv .photo-fv__body {
	position: absolute;
	z-index: 2;
	inset: 0 auto 0 0;
	display: flex;
	width: var(--photo-fv-content-width);
	height: var(--photo-fv-height);
	min-height: 0;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	margin: 0;
	padding: var(--photo-fv-body-top) var(--photo-fv-inline-padding) 0;
	color: var(--color-sub);
	background: none;
	text-align: left;
	order: initial;
	transform: none;
}

.photo-fv .photo-fv__title {
	display: block;
	width: 100%;
	min-width: 0;
	max-width: none;
	margin: 0;
	padding: 0;
	border: 0;
	color: var(--color-sub);
	font-size: var(--photo-fv-title-size);
	font-weight: var(--fw-medium);
	letter-spacing: 0.12em;
	line-height: var(--lh-tight);
	text-align: left;
	text-indent: 0;
	white-space: normal;
	transform: none;
}

.photo-fv .photo-fv__title::before,
.photo-fv .photo-fv__title::after {
	display: none;
	content: none;
}

.photo-fv .photo-fv__lead {
	display: block;
	width: auto;
	max-width: none;
	margin: var(--space-2) 0 0;
	padding: 0;
	color: var(--color-sub);
	font-size: var(--photo-fv-lead-size);
	font-weight: var(--fw-normal);
	letter-spacing: 0.05em;
	line-height: var(--lh-loose);
	text-align: left;
	white-space: normal;
	transform: none;
}

.photo-fv .photo-fv__intro {
	display: none;
}

.photo-fv-section > .photo-fv > .page-breadcrumb--hero {
	position: absolute;
	z-index: 3;
	top: var(--photo-fv-breadcrumb-top);
	left: 0;
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0 var(--photo-fv-inline-padding);
	background: none;
}

.photo-fv-section > .photo-fv > .page-breadcrumb--hero::after {
	display: none;
	content: none;
}

.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__list {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: var(--space-2);
	max-width: 100%;
	margin: 0;
	color: var(--color-sub);
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	letter-spacing: 0.08em;
	white-space: nowrap;
}

.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__item {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: var(--space-2);
}

.photo-fv-section > .photo-fv > .page-breadcrumb--hero
	.page-breadcrumb__item
	+ .page-breadcrumb__item::before {
	width: var(--space-2);
	height: var(--space-2);
	border-top: 1px solid var(--color-main);
	border-right: 1px solid var(--color-main);
	content: "";
	transform: rotate(45deg);
}

.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__link {
	color: inherit;
}

.photo-fv .events-hero__shade,
.photo-fv .contact-hero__ornament,
.photo-fv .kodawari-hero__ornament {
	display: none;
}

.menu-hero {
	--photo-fv-object-position: 55% 48%;
}

@media (max-width: 359px) {
	.photo-fv {
		--photo-fv-content-width: 88%;
	}

	.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__list {
		gap: var(--space-1);
		font-size: var(--fs-body-sm);
	}

	.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__item {
		gap: var(--space-1);
	}

	.photo-fv-section > .photo-fv > .page-breadcrumb--hero
		.page-breadcrumb__item
		+ .page-breadcrumb__item::before {
		width: calc(var(--space-2) - 2px);
		height: calc(var(--space-2) - 2px);
	}
}

@media (min-width: 768px) {
	.photo-fv {
		--photo-fv-height: 608px;
		--photo-fv-content-width: 42%;
		--photo-fv-inline-padding: var(--container-gutter);
		--photo-fv-title-size: var(--fs-hero);
		--photo-fv-lead-size: var(--fs-page-lead);
		--photo-fv-body-top: calc(var(--space-13) + var(--space-7));
		--photo-fv-breadcrumb-top: calc(var(--space-10) - var(--space-2));
	}

	.photo-fv::after {
		background-image: url("../../img/bg_top-fv.png");
		background-position: center;
		background-size: cover;
	}

	.photo-fv .photo-fv__title {
		letter-spacing: 0.14em;
	}

	.photo-fv .photo-fv__title::after {
		display: block;
		flex: none;
		width: min(100%, 416px);
		max-width: none;
		height: 0;
		margin-top: var(--space-6);
		border-top: 1px solid var(--color-main);
		background: none;
		content: "";
	}

	.photo-fv .photo-fv__lead {
		margin-top: var(--space-7);
		letter-spacing: 0.12em;
	}

	.photo-fv .photo-fv__intro {
		display: block;
		width: min(100%, 416px);
		max-width: 416px;
		margin: var(--space-6) 0 0;
		padding: 0;
		color: var(--color-text);
		font-size: var(--fs-body-pc);
		letter-spacing: 0.08em;
		line-height: var(--lh-loose);
		text-align: left;
	}

	.photo-fv-section > .photo-fv > .page-breadcrumb--hero {
		padding-inline: var(--photo-fv-inline-padding);
	}

	.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__list {
		gap: var(--space-3);
		font-size: var(--fs-body);
	}

	.photo-fv-section > .photo-fv > .page-breadcrumb--hero .page-breadcrumb__item {
		gap: var(--space-3);
	}

	.menu-hero {
		--photo-fv-object-position: center 45%;
	}

	.photo-fv--compact {
		--photo-fv-height: 320px;
		--photo-fv-body-top: var(--space-10);
		--photo-fv-breadcrumb-top: var(--space-4);
	}
}
