body{
    margin: 0;
    padding: 0;
}
.wrapper,.wrapper1{
	width:100%;
	position: relative;
}
.wrapper{
	overflow: hidden;
}
.first_bg,.second_bg{
	width: 100%;
	display: block;
}
.wrapper_box{
	width:12rem;
	position: absolute;
	margin: auto;
	top:0;
	left: 0;
	right: 0;
	height: 18.5rem;
}
.wrapper img{
	display: block;
}

.first_top_left{
	position: absolute;
	top: 0.3rem;
	width: 3.1rem;
	left: 0.3rem;
	visibility: hidden;
	animation: slideindown 0.3s ease-out 0.2s;
	z-index: 2;
}
.first_center_left{
	position: absolute;
	top: 2.3rem;
	left: 3.2rem;
	width: 9.3rem;
	visibility: hidden;
	animation: tosmall 0.4s ease-out 0.6s;
}
.box{
	position: absolute;
	top: 2.3rem;
	left: 3.2rem;
	width: 9.3rem;
	visibility: hidden;
	z-index: 2;
	overflow: hidden;
	animation: rightwidth 1s ease-out 1.2s;
}
.first_center_left_1{
	width: 9.3rem;
}
.sd{
	position: absolute;
	width: 5.68rem;
	top: 2.8rem;
	left: -0.7rem;
	visibility: hidden;
	animation: fadein 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55) 1s;
}
.first_left{
	animation: fadein 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55) 0.8s;
	position: absolute;
	visibility: hidden;
	left: 1.3rem;
	top: 1.56rem;
	width: 3.26rem;
}
.sloganbox{
    position: absolute;
    width: 3.26rem;
    top: 2rem;
    left: 1.3rem;
    visibility: hidden;
    animation: slideindown 0.5s ease-out 0.5s;
    z-index: 2;
}
.sub_title{
	animation: rightwidth 1s ease-out 1.2s;
	position: absolute;
	visibility: hidden;
	left: 2.65rem;
	top: 5.95rem;
	width: 4.77rem;
	z-index: 2;
	overflow: hidden;
}
.sub_title img{
	width: 4.77rem;
}
.first_bg_right2{
	position: absolute;
	top: 8.4rem;
	left: 3.1rem;
	width: 5.89rem;
	visibility: hidden;
	z-index: 2;
	overflow: hidden;
	animation: tosmall 0.3s ease-out 1.5s;
}
.first_bg_right2 img{
	width: 5.89rem;
}
.sm{
	position: absolute;
	top: 0.65rem;
	left: 1.8rem;
	width: 3.52rem;
	visibility: hidden;
	z-index: 2;
	overflow: hidden;
	animation: rightwidth 0.5s ease-out 1.8s;
}
.first_bg_right2 .sm img{
	width: 3.52rem;
}
.zjl{
	position: absolute;
	top: 1rem;
	left: 2.5rem;
	width: 2.18rem;
	visibility: hidden;
	z-index: 2;
	overflow: hidden;
	animation: rightwidth 0.5s ease-out 2.3s;
}
.first_bg_right2 .zjl img{
	width: 2.18rem;
}
.bottom_bg{
	position: absolute;
	bottom: 50px;
	left: 70px;
	visibility: hidden;
	z-index: 1;
	animation: slideinright 0.5s ease-out 1.4s;
}
.bottom_light {
    position: absolute;
    width: 464px;
    height: 53px;
    bottom: 0;
    right: 0;
    overflow: hidden;
}
.bottom_light:before {
    content: "";
    position: absolute;
    width: 20px;
    height: 100%;
    top: 0;
    left: -30px;
    overflow: hidden;
    background: -moz-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.4)50%, rgba(255,255,255,0)100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(50%, rgba(255,255,255,.4)), color-stop(100%, rgba(255,255,255,0)));
    background: -webkit-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.4)50%, rgba(255,255,255,0)100%);
    background: -o-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.4)50%, rgba(255,255,255,0)100%);
    -webkit-transform: skewx(-25deg);
    -moz-transform: skewx(-25deg);
    animation: slideinleft2 1s ease-out 2.3s;
}
@keyframes slideinleft
{
from {transform: scale(0.8) translatex(-250px); opacity: 0.5; visibility: hidden;}
to {transform: scale(1) translatex(0px); opacity: 1; visibility: visible;}
}
@keyframes slideinright
{
from {transform: scale(0.8) translatex(250px); opacity: 0.5; visibility: hidden;}
to {transform: scale(1) translatex(0px); opacity: 1; visibility: visible;}
}
@keyframes fadein
{
from {opacity: 0; transform: scale(0.3); visibility: hidden;}
to {opacity: 1; transform: scale(1); visibility: visible;}
}
@keyframes tosmall
{
from {opacity: 0; transform: scale(1.3) translatex(10px); visibility: hidden;}
to {opacity: 1; transform: scale(1) translatex(0); visibility: visible;}
}
@keyframes slideindown
{
from {opacity: 0; transform: scale(0.3) translatey(-150px); visibility: hidden;}
to {opacity: 1; transform: scale(1) translatey(0px); visibility: visible;}
}
@keyframes slideinleft2
{
from {left:-30px; visibility: hidden;}
to {left: 150%; visibility: visible;}
}
@keyframes rotatein
{
from {transform: translatex(150px);visibility: hidden;}
to {transform:translatex(0);visibility: visible;}
}
@keyframes rightwidth
{
from {width: 0px;visibility: hidden;}
to {width:100%;visibility: visible;}
}