@charset "utf-8";
/*
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
株式会社サンロイヤル新潟　カスタム対応
	ver.2025.05.30.Custom-SunroyalNiigata
	採用ページスライドショー　スタイルシート
────────────────────────────────────────
FileName:		/resources/css/recruit-background-slider.css
Editor:			TRUSTEC
Description:	採用ページスライドショー　スタイルシート
────────────────────────────────────────
2025/05/30:		サンプル開発開始。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
*/



/* :::::  [SECTION : BACKGROUND-SLIDESHOW] ::::: */

/* Section
--------- --------- --------- ------- */
#index-slideshow {
}

/* Slideshow Setting
--------- --------- --------- ------- */
.background-slider {
}

.background-slider .slider-item {
	background-size: cover;

	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;

	opacity: 0;
	/*
	 3枚を4s毎で計12s
	 infiniteで繰り返す
	 */
	animation: pseudoAnimation 12s infinite;
}
.slider-item img{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

.background-slider .slider-item.slider-item1 {
}
.background-slider .slider-item.slider-item2 {
	animation-delay: 4s;
}
.background-slider .slider-item.slider-item3 {
	animation-delay: 8s;
}


/* 12sのうち最初の約4sだけ表示する */
@keyframes pseudoAnimation {
	0% {	opacity: 0;	}
	5% {	opacity: 1;	} /* 表示タイミングをずらしてフェードイン風に */
	35% {	opacity: 1;	}
	40% {	opacity: 0;	}
	100% {	opacity: 0;	}
}



/*
--------- --------- --------- ------- */
header {
	background-color: transparent;
	border-bottom: none;
}



/*
--------- --------- --------- ------- */
#firstview {
/*	position: relative;
	top: 86vh;*/

	margin-top: 84vh;
}
.firstview-over {
	background-color: #303030;
	transition: 0.7s;
}