@charset "utf-8";

/*
************************************************************************
* スプラッシュ画面
* @copyright Revolme Inc.
* 
* 読み込み待ち、初期表示するスプラッシュ画面
************************************************************************
*/
#progressBar
{
	position:fixed;
	top:0px;
	left:0px;
	width:0%;
	height:4px;
	transition-duration:0.3s;
	transition-property:width;
}
#splash
{
	position:fixed;
	
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	
	width:100%;
	height:100%;
}
#splash .splash-contents-wrapper
{
	width:100%;
	height:100%;
}
#splash .splash-contents-wrapper .splash-contents
{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
}
#splash .splash-contents-wrapper .splash-contents .splash-spiner
{
	width:0px;
	height:0px;
	margin:50px auto;
}
body.loaded #splash
{
	animation-name:loadedProgres;
	animation-duration:0.3s;
	animation-timing-function:ease-out;
	animation-iteration-count:1;
	animation-delay:0.4s;
	animation-fill-mode:forwards;
}
@keyframes loadedProgres {
	0% {
		transform: translateY(0%);
		opacity:1;
	}
	99% {
		transform: translateY(-100%);
		opacity:0.8;
	}
	100% {
		transform: translateY(-100%);
		opacity:0.0;
		display:none;
	}
}

/* == タブレットサイズ ==========================================================*/
@media screen and (max-width: 1200px) {
}
/* == スマートフォンサイズ ==========================================================*/
@media screen and (max-width: 640px) {
	#splash .splash-contents-wrapper .splash-contents
	{
		width:100%;
	}
}