/*
Description: Home css.
*/

/*=========  トップページ画像  =========*/
.top-image {
	height: 100vh; /* 初期表示で画面高さ分を確保 */
	position: relative;
	z-index: 1;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-image:linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)), url('../../../uploads/top01.jpg');
	transition: background-image 0.3s ease; /* 画像切り替え時の滑らかさ */
}
.top-image-box{
	width:100vw;
	height:100vh;
	width: calc(100vw - calc(100vw - 100%));
	display:block;
	overflow:hidden;
	position:relative;
	z-index:2;
}
.top-image-box-in{
	position: absolute;
	top: 0; /* 初期値 */
	width: 100%;
	height: 100%; /* 初期値 */
}
.top-image-box-in-cont{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}





/*========= 遅延表示 (style="sa sa--lr"のように必ずsa入れる。表示高さ変更data-sa_margin="400" 表示時間変更data-sa_delay="400")=========*/
.sa {opacity: 0;transition: all .3s ease;animation-duration: 10s;}
.sa.show {opacity: 1;transform: none;}
.sa--lr {transform: translate(-10%, 0);}
.sa--rl {transform: translate(50%, 0);}
.sa--up {transform: translate(0, 100px);}
.sa--down {transform: translate(0, -100px);}
.sa--scaleUp {transform: scale(.5);}
.sa--scaleDown {transform: scale(1.5);}
.sa--rotateL {transform: rotate(180deg);}
.sa--rotateR {transform: rotate(-180deg);}






/*モバイル表示*/
@media screen and (max-width: 768px) {


}


/* タブレット表示 */
@media (min-width: 769px) and (max-width: 1024px) {

}{