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

.loading-box-bk{
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 5000;
	background: #5d7e48;
    animation: fadeinctrl 2s ease;
	opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}
@keyframes fadeinctrl{
	0%{
	 opacity: 1;
     -webkit-transform: scale(1);
     -moz-transform: scale(1);
     -o-transform: scale(1);
     transform: scale(1);	
		
	}
	80%{
	 opacity: 1;
     -webkit-transform: scale(1);
     -moz-transform: scale(1);
     -o-transform: scale(1);
     transform: scale(1);	
	}
	99%{
	  opacity: 0;
     -webkit-transform: scale(1);
     -moz-transform: scale(1);
     -o-transform: scale(1);
     transform: scale(1);	
	}
	100%{
		opacity: 0;
     -webkit-transform: scale(0);
     -moz-transform: scale(0);
     -o-transform: scale(0);
     transform: scale(0);			
	}
}
.logo-show-front{
	width: 360px;
	position: absolute;
	left:0;
	right: 0;
	top: 37%;
	margin: auto;
	z-index: 6000;
	animation: logoslide 1.5s ease;
}
.logo-show-front img{
	max-width: 360px;
	width: 100%;
	height: auto;
}
@keyframes logoslide{
	0%{
		opacity: 0;
		-webkit-transform: translate(0,-230px);
		-moz-transform: translate(0,-230px);
		-o-transform: translate(0,-230px);
		transform: translate(0,-230px);	
	}

	100%{
		opacity: 1;
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);	
	}
}

@media only screen and (max-width : 1440px){
.logo-show-front{
	width: 240px;
	top: 37%;
}
}
@media only screen and (max-width : 414px){
.logo-show-front{
	width: 200px;
	top: 37%;
}
}