/*--手机端内容--*/
@charset "utf-8";
body{position:inherit;}

#main { width:100%; height:auto;overflow:hidden;}
.main_bg { position:absolute; width:100%; height:100%; left:0; top:0; z-index:1;}
.main_content { position:absolute; width:100%; height:100%; left:0; top:0; margin:0 auto; z-index:3;}
.waplogo img { position:absolute; width:20%; height:auto; z-index:50;}
.house {position:absolute; z-index:2; bottom:0;}
.mymaintitle { position:absolute; width:82%;left:9%; top:20%; margin:0px auto;}
.mymaintitle1 {
	position:absolute;
	width:100%;
	bottom:0%;
	 z-index:10;
	margin:0px auto;
}
.mysubtitle { 
    position: absolute;
    width:50%;
    top: 36%;
    left:25%;
    z-index: 35;
    overflow: hidden;}
.di { position:absolute; width:90%; bottom:-1%; z-index:20; overflow:hidden; left:10%;}
.logo{ 
    position: absolute;
    width: 72%;
    top: 8%;
    z-index: 20;
    overflow: hidden;
    left: 14%;}
	
.logo1{ position:absolute; width:100%; bottom:0; z-index:20; overflow:hidden; left:0%;}
.moveFromLeftFade {
	-webkit-animation: moveFromLeftFade .8s ease both;
	animation: moveFromLeftFade .8s ease both;
}

@-webkit-keyframes moveFromLeftFade {
	from { opacity: 0; -webkit-transform: translateX(-1200px); }
}
@keyframes moveFromLeftFade {
	from { opacity: 0; -webkit-transform: translateX(-1200px); transform: translateX(-1200px); }
}


.moveFromLeftFade2{
-webkit-animation:fadeInUp 1s .2s ease both;
-moz-animation:fadeInUp 1s .2s ease both;}
@-webkit-keyframes fadeInUp{
0%{opacity:0;
-webkit-transform:translateY(90px)}
100%{opacity:1;
-webkit-transform:translateY(0)}
}
@-moz-keyframes fadeInUp{
0%{opacity:0;
-moz-transform:translateY(90px)}
100%{opacity:1;
-moz-transform:translateY(0)}
}

.moveFromLeftFade3{
-webkit-animation:fadeInUp 1s .8s ease both;
-moz-animation:fadeInUp 1s .8s ease both;}
@-webkit-keyframes fadeInUp{
0%{opacity:0;
-webkit-transform:translateY(90px)}
100%{opacity:1;
-webkit-transform:translateY(0)}
}
@-moz-keyframes fadeInUp{
0%{opacity:0;
-moz-transform:translateY(90px)}
100%{opacity:1;
-moz-transform:translateY(0)}
}


.moveFromLeftFade1 {
	-webkit-animation: moveFromLeftFade1 1.2s ease both;
	animation: moveFromLeftFade1 1.2s ease both;
}

@-webkit-keyframes moveFromLeftFade1 {
	from {-webkit-transform: translateX(-1200px); }
}
@keyframes moveFromLeftFade1 {
	from { -webkit-transform: translateX(-1200px); transform: translateX(-1200px); }


.delay100 {
	-webkit-animation-delay: .1s;
	animation-delay: .1s;
}
.delay200 {
	-webkit-animation-delay: .2s;
	animation-delay: .2s;
}

.delay300 {
	-webkit-animation-delay: .3s;
	animation-delay: .3s;
}

.delay400 {
	-webkit-animation-delay: .4s;
	animation-delay: .4s;
}

.delay600 {
	-webkit-animation-delay: .6s;
	animation-delay: .6s;
}

.delay800 {
	-webkit-animation-delay: .8s;
	animation-delay: .8s;
}

.delay1000 {
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}
.delay1200 {
	-webkit-animation-delay: 3s;
	animation-delay: 3s;
}

.clear{ clear:both;}


.main_maskx { position:relative; top:0; bottom:0; left:0; right:0;}
.main_mask1 { position:absolute; width:100%; height: auto; margin:0 auto; top:0px; background:url(mask.png) repeat; display:none;z-index:30;}
.main_btn{ position:absolute;right:0.2%;z-index:40;width:72px;height:72px; display:none; top:4.5%;}
