@charset "UTF-8";
/**
 * FV スライドショー
 * 設置場所: wp-content/themes/rokkasen/assets/css/fv-slider.css
 */

.fv-slider {
	/* --fv-interval / --fv-fade は PHP 側から inline で注入 */
	--fv-interval: 3000ms;
	--fv-fade: 1000ms;

	/* ▼ 現行の動画FVと同じ高さに合わせる（要調整） */
	--fv-height: 72svh;
	max-height: 768px;
	position: relative;
	width: 90%;
	height: var(--fv-height);
	overflow: hidden;
	background-color: #000;
	margin-left: auto;
	border-radius: 80px 0 0 0;
}
@media (max-width: 1024px) {
	.fv-slider {
		--fv-height: 64svh;
	}

}
@media (max-width: 767px) {
	.fv-slider {
		--fv-height: 72svh;
		max-height: 400px;
	width: 100%;
	}
}

/* ---------- スライド ---------- */
.fv-slider__stage {
	position: absolute;
	inset: 0;
}

.fv-slider__item {
	position: absolute;
	inset: 0;
	margin: 0;
	opacity: 0;
	transition: opacity var(--fv-fade) ease;
	will-change: opacity;
}

.fv-slider__item.is-active {
	opacity: 1;
	z-index: 1;
}

.fv-slider__item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	/* ゆっくりズーム（動画FVの"動き"を引き継ぐ演出）。不要なら下2行と .is-active img を削除 */
	transform: scale(1);
	transition: transform calc(var(--fv-interval) + var(--fv-fade)) linear;
	will-change: transform;
}

/* 初期状態は等倍。ズームは is-ready が付いてから始める */
.fv-slider__item.is-active img {
	transform: scale(1);
}

.fv-slider.is-ready .fv-slider__item.is-active img {
	transform: scale(1.06);
}

/* ---------- 暗幕・オーバーレイ ---------- */
.fv-slider__veil {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
/* 	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, .40) 0%,
		rgba(0, 0, 0, .10) 40%,
		rgba(0, 0, 0, .45) 100%
	); */
}

.fv-slider__overlay {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: grid;
	place-items: center;
	pointer-events: none; /* 画像側のクリックを塞がない */
}

.fv-slider__overlay > * {
	pointer-events: auto;
}

/* ---------- モーション配慮 ---------- */
@media (prefers-reduced-motion: reduce) {
	.fv-slider__item,
	.fv-slider__item img {
		transition: none;
	}
	.fv-slider__item.is-active img {
		transform: none;
	}
}
.fv-slider__overlay {
	place-items: end; /* 右下（align-items: end / justify-items: end） */
}

.fv-slider__label {
	margin: 0  auto 1em auto;
	padding:0 0.5em;
	max-width: 100%;
	color: #fff;
	line-height: 1.6;
	letter-spacing: 0.08em;
	text-align: right;
	text-shadow:
		0 1px 2px rgba(0, 0, 0, 0.6),
		0 4px 18px rgba(0, 0, 0, 0.7);
	opacity: 0;
	transition: opacity var(--fv-fade) ease;
	font-size: 42px;
	font-weight:600;
	position:relative;
}
@media (max-width: 767px) {
.fv-slider__label {
	font-size: 24px;
	}
}
.fv-slider__label:after{
	content:"";
	display:inline-block;
	width:100%;
	height:2px;
	background:#c08b52;
	position:absolute;
	right:0;
	bottom:0.1em;
}
.fv-slider__label.is-visible {
	opacity: 1;
}