@charset "utf-8";
/* CSS Document */

.box{
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  z-index: 9999;
  -webkit-transition: all 1.2s ease; /* 1.2秒でフェードアウト */
          transition: all 1.2s ease;
  color: #060E31; /* ローディングアニメーションカラー */
  background-color: #fff; /* 背景カラー */
	display: flex;
	align-items: center;
	justify-content: center;
}
.box.loaded{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.loadpos{
	display: flex;
	flex-flow: column;
}

.loader {
	-webkit-animation: spin 1s linear infinite;
	animation: spin 1s linear infinite;
	border: 3px solid #ddd;
	border-top: 3px solid #060E31;
	border-radius: 50%;
	height: 75px;
	width: 75px;
}
@-webkit-keyframes spin {
	to {
		border-top-color: #060E31;
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes spin {
	to {
		border-top-color: #060E31;
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
/* general styling */
/*html, body {
	height: 100%;
	margin: 0;
}
body {
	background-color: #f1f2f3;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.container {
	margin: 0 auto;
}*/