﻿
/* ローディング
--------------------------------------------------*/
.loader-wrap {
	/*position: fixed;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 10000;*/

	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0,0,0,0.65);
	z-index: 10000;
}

	.loader-wrap .loader,
	.loader-wrap .loader:after {
		border-radius: 50%;
		width: 10em;
		height: 10em;
	}

	.loader-wrap .loader {
		/*margin: 60px auto;*/
		font-size: 10px;
		position: relative;
		text-indent: -9999em;
		border-top: 1.1em solid rgba(155,184,0, 0.2);
		border-right: 1.1em solid rgba(155,184,0, 0.2);
		border-bottom: 1.1em solid rgba(155,184,0, 0.2);
		border-left: 1.1em solid #9bb800;
		-webkit-transform: translateZ(0);
		-ms-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-animation: load8 1.1s infinite linear;
		animation: load8 1.1s infinite linear;
	}

@-webkit-keyframes load8 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes load8 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}


/* Loading
----------------------------------*/
/* ↓↓↓ローディングのスタイル↓↓↓ */
.waiting {
	z-index: 11000;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,0.65);
	align-items: center;
	justify-content: center;
}

.progress_loader {
	z-index: 11100;
	position: absolute;
	width: 10em; /*ローディングアイコンの横サイズ*/
	height: 10em; /*ローディングアイコンの縦サイズ*/
	/*top: 50%;*/
	top: 50vh;
	left: 45%;
	margin-left: -30px;
	margin-top: -30px;
	border-radius: 50%; /*CSS3で円を書く*/
	border-top: 1.1em solid rgba(155,184,0, 0.2);
	border-right: 1.1em solid rgba(155,184,0, 0.2);
	border-bottom: 1.1em solid rgba(155,184,0, 0.2);
	border-left: 1.1em solid #9bb800;

	-webkit-animation: load8 1s infinite linear; /*回転のアニメーションをつける*/
	-moz-animation: load8 1s infinite linear;
}
/* ↑↑↑ローディングのスタイル↑↑↑ */


