@charset "utf-8";
/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
	position: fixed;
	width: 100%;
	height: 100vh;
	z-index: 999;
	background:#E3ECED;
	text-align:center;
	color:#3198C0;
	margin-top:;
}

@media screen and (max-width: 768px){
#splash {
height: 100%;
margin-top:0;
}
}
/* Loading画像中央配置　*/
#splash_logo {
	position: absolute;
	top: 50%;
	left: 50%;
	
	transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo svg{
width:280px;margin-bottom: 80px;
}
/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width:480px){
#splash_logo svg{
width:200px;margin-bottom: 50px;
}
}
/*--------------------------------------------------------------------------------*/



/*=============== SVGアニメーション内の指定 =================*/

/*アニメーション前の指定*/
#mask path {
		fill-opacity: 0;/*最初は透過0で見えない状態*/
		transition: fill-opacity 1s;/*カラーがつく際のアニメーション0.5秒で変化*/
		fill: none;/*塗りがない状態*/
		stroke: #3198C0;/*線の色*/
	}

/*アニメーション後に.doneというクラス名がで付与された時の指定*/
#mask.done path{
	  fill: #3198C0;/*塗りの色*/
	  fill-opacity: 1;/*透過1で見える状態*/
	  stroke: none;/*線の色なし*/
	}