@charset "utf-8";
.loading_base {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		z-index: 5000;
		background-repeat: repeat, repeat-y;
		background-position: 0 0, center 200vh;
		background-size: 50px, 2600px;
		background-image: url("../images/texture_bg-1.png"), url("../images/body_bg_pc.jpg");
}
.loading_logo {
		width: 330px;
		position: absolute;
		top: calc(50% - 36px);
		left: calc(50% - 165px);
}
.loading_logo img {
		width: 100%;
		height: auto;
}
@media(max-width: 767px) {
		.loading_base {
				position: fixed;
				top: 0;
				left: 0;
				width: 100%;
				height: 100vh;
				z-index: 5000;
				background-repeat: repeat, repeat-y;
				background-position: 0 0, center center;
				background-size: 50px, 900px;
				background-image: url("../images/texture_bg-1.png"), url("../images/body_bg_pc.jpg");
		}
		.loading_logo {
				width: 240px;
				top: calc(50% - 16px);
				left: calc(50% - 120px);
		}
}
.loading_kv {
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		opacity: 0;
		transition: opacity 0.8s;
}
.loading_kv.isStart {
		opacity: 1
}
.loading_kv img {
		width: 100%;
		height: auto;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		background-image: url("../images/kv-1_pc.jpg");
		display: block;
		mask-image: url("../images/kv_mask_pc.png");
		mask-repeat: no-repeat;
		mask-position: center center;
		mask-size: 480px;
		-webkit-mask-image: url("../images/kv_mask_pc.png");
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-position: center center;
		-webkit-mask-size: 480px;
		transition: all 1.2s;
		transition-delay: 1.5s;
}
@media(max-width: 767px) {
		.loading_kv img {
				background-image: url("../images/kv-1_sp.jpg");
		}
}
.loading_kv.isStart img {
		-webkit-mask-size: 110vw;
		mask-size: 110vw;
}
.loading_kv_bg {
		width: 1225px;
		position: absolute;
		top: calc(50% - 330px);
		left: calc(50% - 612px)
}
.loading_kv_bg img {
		width: 100%;
		height: auto;
}
.loading_kv_bg div {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s;
		opacity: 0;
		transform: translateY(80px);
}
.loading_kv_bg.isStart div {
		opacity: 1;
		transform: translateY(0px);
}
.loading_kv_bg.isStart div.loading_kv_bg_item-2 {
		transition-delay: 0.1s
}
.loading_kv_bg.isStart div.loading_kv_bg_item-3 {
		transition-delay: 0.15s
}
.loading_kv_bg.isStart div.loading_kv_bg_item-4 {
		transition-delay: 0.2s
}
.loading_kv_bg.isStart div.loading_kv_bg_item-5 {
		transition-delay: 0.25s
}
@media(max-width: 1400px) {
		.loading_logo {
				width: 200px;
				left: calc(50% - 100px);
		}
		.loading_kv_bg {
				width: 740px;
				position: absolute;
				top: calc(50% - 200px);
				left: calc(50% - 370px)
		}
		.loading_kv img {
				mask-size: 300px;
				-webkit-mask-size: 300px;
		}
}
@media(max-width: 767px) {
		.loading_kv_bg {
				width: 100vw;
				position: absolute;
				top: 50px;
				left: 0;
		}
		.loading_kv img {
				mask-size: 58vw;
				-webkit-mask-size: 58vw;
		}
		.loading_kv.isStart img {
				-webkit-mask-size: 250vw;
				mask-size: 250vw;
		}
}