@charset "utf-8";
/* loading */

#loadingWrap {
	display: none;
}

#loadingWrap.isShown.hideCont {
	/* visibility: collapse; */
	opacity: 0;
	
	-webkit-transition: all .4s;
	transition: all .4s;
}

#loadingWrap.isShown {
	display: block;
	visibility: visible;
	width: 100%;
	height: 100vh;
	/* background: rgba(255, 255, 255, 1.0); */
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999999999;
	overflow: hidden;
	
	opacity: 1;
	
}

#loadingWrap.isShown .sectionTop {
	visibility: visible;
	width: 100%;
	height: 50vh;
	background: rgba(255, 255, 255, 1.0);
	position: absolute;
	top: 0;
	left: 0;
	
	opacity: 1;
	
}

#loadingWrap.isShown.hideCont .sectionTop {
	top: -50%;
	
	-webkit-transition: all .4s .4s;
	transition: all .4s .4s;
}

#loadingWrap.isShown .sectionBottom {
	visibility: visible;
	width: 100%;
	height: 50vh;
	background: rgba(255, 255, 255, 1.0);
	position: absolute;
	bottom: 0;
	left: 0;
	
	opacity: 1;
	
}

#loadingWrap.isShown.hideCont .sectionBottom {
	bottom: -50%;
	
	-webkit-transition: all .4s .4s;
	transition: all .4s .4s;
}


#loadingWrap.isShown .barWrap {
	visibility: visible;
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	
	opacity: 1;
	
}



#loadingWrap.isShown.hideCont .barWrap {
	left: 150%;
	
	-webkit-transition: all .2s;
	transition: all .2s;
}

#loadingWrap.isShown .barWrap .progress {
	width: 100%;
	height: 1px;
	background: rgba(255, 255, 255, 1);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 5;
}



#loadingWrap.isShown .barWrap .progress .act {
	width: 50%;
	height: 1px;
	background: rgba(229, 0, 18, 1.0);
	position: absolute;
	top: 0;
	left: 0;
}

#loadingWrap.isShown .barWrap .text.up {
	position: relative;
	top: 10vh;
	font-size: 13px;
	z-index: 5;
}

#loadingWrap.isShown .barWrap .text.lower {
	position: relative;
	top: 15px;
	font-size: 13px;
	z-index: 5;
	top: 12vh;
}



#loadingWrap.isShown .movWrap {
	visibility: visible;
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	z-index: 0;
	opacity: 1;
	
}

#loadingWrap.isShown .movWrap video {
	max-width: 100%;
}