@charset "utf-8";

img {
	border: none;
	vertical-align: top;
}
.loading_section {
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
}
.loading_inner {
	height: 37.5vw;
	width: 100%;	
	display: flex;
	justify-content: center;
	align-items: center;
}

.loading_body {
	width: 20%;
	min-width: 325px;	
}
.loading_body img {
	width: 100%;
	height: auto;
}
.loading_body .loading_lead {
	position: relative;
}
.loading_body .loading_lead::after {
	content: '';
	display: block;
	position: absolute;
	z-index: 15;
	top: 0;
	left: 0;
	background: #fff;
	width: 100%;
	height: 40px;
	transform-origin: center top;
	animation: leadActive 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
	animation-delay: 0.8s;
	transform: scale(1);
}
.loading_line {
    height: 2px;
    margin: 0px;
    background: #666;
    transform-origin: center left;
    transform: scale(0);
    animation: lineActive 1.3s cubic-bezier(0.19, 1, 0.22, 1) forwards;
    position: relative;
    z-index: 50;
}
.loading_logo {
	position: relative;
}
.loading_logo::after {
	content: '';
	display: block;
	position: absolute;
	z-index: 15;
	top: 0;
	left: 0;
	background: #fff;
	width: 100%;
	height: 100%;
	transform-origin: center bottom;
	animation: leadActive 0.8s cubic-bezier(0.19, 1, 0.22, 1) forwards;
	animation-delay: 1.1s;
	transform: scale(1);
}

 @keyframes lineActive {
0% {
 transform: scale(0);
}
100% {
 transform: scale(1);
}
}
 @keyframes leadActive {
0% {
 transform: scaleY(1)
}
 100% {
 transform: scaleY(0)
}
}
 @keyframes logoActiveUp {
0% {
 transform: translateY(-100px);
}
100% {
 transform: translateY(0px);
}
}


@media(max-width: 767px) {
.loading_inner {
	height: 120vw;
	min-height: inherit;
}
.loading_body {
	width: 62%;
	min-width: inherit;	
}
}