@charset "UTF-8";
/* スライドを設定しない場合 */
.fv-background-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('../images/visual01.jpg'); 
	background-size: cover; 
	background-position: center; 
	z-index: 0;
}

/* スライドを設定する場合 */
.fv-background-image-slide {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-color: #000000;
	overflow: hidden;
}

/* 全スライド共通設定 */
.slide-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    animation: slideAnimation 15s infinite; /* 5秒×3枚 = 15秒 */
}

/* 各スライドの画像とタイミング設定 */
.slide-img:nth-child(1) {
    background-image: url('../images/visual01.jpg');
    animation-delay: 0s;
}
.slide-img:nth-child(2) {
    background-image: url('../images/visual02.jpg');
    animation-delay: 5s; /* 5秒ずらす */
}
.slide-img:nth-child(3) {
    background-image: url('../images/visual03.jpg');
    animation-delay: 10s; /* 10秒ずらす */
}

/* 3枚用のフェードアニメーション（15秒サイクル） */
@keyframes slideAnimation {
    0% { opacity: 0; }
    10% { opacity: 1; }  /* フェードイン */
    33% { opacity: 1; }  /* 表示維持 */
    43% { opacity: 0; }  /* フェードアウト */
    100% { opacity: 0; }
}

/* 動画を設定する場合 */
.fv-background-image-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	overflow: hidden; /* 動画がはみ出さないように */
	background-color: #000000; /* 動画読み込み前の背景色 */
}