@charset "utf-8";/* CSS Document */

a:hover{ transition:0.5s; -moz-transition:0.5s; -o-transition:0.5s; -webkit-transition:0.5s; }

/* yi ping  */
#header {
-webkit-transform: translateX(0) translateY(-148px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-148px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-148px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-148px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-148px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: header .8s ease-out 0.8s 1 normal forwards;
-moz-animation: header .8s ease-out 0.8s 1 normal forwards;
-ms-animation: header .8s ease-out 0.8s 1 normal forwards;
-o-animation: header .8s ease-out 0.8s 1 normal forwards;
animation: header .8s ease-out 0.8s 1 normal forwards}
@-webkit-keyframes header {0% {-webkit-transform:translateY(-148px)}100% {-webkit-transform:translateY(0)}}
@-moz-keyframes header {0% {-moztransform:translateY(-148px)}100% {-moztransform:translateY(0)}}
@-ms-keyframes header {0% {-ms-transform:translateY(-148px)}100% {-ms-transform:translateY(0)}}
@-o-keyframes header {0% {-o-transform:translateY(-148px)}100% {-o-transform:translateY(0)}}
@keyframes header {0% {transform:translateY(-148px)}100% {transform:translateY(0)}}


#stage-1.stage-state-default .stage-1-icon {
opacity: 0;
-webkit-animation: first-1 .8s ease-out 0s 1 forwards;
-moz-animation: first-1 .8s ease-out 0s 1 forwards;
-ms-animation: first-1 .8s ease-out 0s 1 forwards;
-o-animation: first-1 .8s ease-out 0s 1 forwards;
animation: first-1 .8s ease-out 0s 1 forwards}
@-webkit-keyframes first-1 {0% {opacity:0;-webkit-transform:scale(0.1)}100% {opacity:1;-webkit-transform:scale(1)}}
@-moz-keyframes first-1 {0% {opacity:0;-moz-transform:scale(0.1)}100% {opacity:1;-moz-transform:scale(1)}}
@-ms-keyframes first-1 {0% {opacity:0;-ms-transform:scale(0.1)}100% {opacity:1;-ms-transform:scale(1)}}
@-o-keyframes first-1 {0% {opacity:0;-o-transform:scale(0.1)}100% {opacity:1;-o-transform:scale(1)}}
@keyframes first-1 {0% {opacity:0;transform:scale(0.1)}100% {opacity:1;transform:scale(1)}}


#stage-1.stage-state-in .stage-1-icon {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: none 0s linear 0s infinite normal none;
-moz-animation: none 0s linear 0s infinite normal none;
-ms-animation: none 0s linear 0s infinite normal none;
-o-animation: none 0s linear 0s infinite normal none;
animation: none 0s linear 0s infinite normal none}
#stage-1.stage-state-in .stage-1-icon {
-webkit-transition: opacity .8s ease-out 0s, -webkit-transform .8s ease-out 0s;
-moz-transition: opacity .8s ease-out 0s, -moz-transform .8s ease-out 0s;
-ms-transition: opacity .8s ease-out 0s, -ms-transform .8s ease-out 0s;
-o-transition: opacity .8s ease-out 0s, -o-transform .8s ease-out 0s;
transition: opacity .8s ease-out 0s, transform .8s ease-out 0s}
#stage-1.stage-state-out .stage-1-icon{
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1)}
#stage-1.stage-state-out .stage-1-icon {
-webkit-transition: opacity .8s ease-in 0s, -webkit-transform .8s ease-in 0s;
-moz-transition: opacity .8s ease-in 0s, -moz-transform .8s ease-in 0s;
-ms-transition: opacity .8s ease-in 0s, -ms-transform .8s ease-in 0s;
-o-transition: opacity .8s ease-in 0s, -o-transform .8s ease-in 0s;
transition: opacity .8s ease-in 0s, transform .8s ease-in 0s}

/*  左侧导航  */
#slidebar {/*width: 39px;height: 135px;position: absolute;right: 15px;z-index: 1;margin-top: -67.5px;top: 50%*/width:100%; margin-top:17px;}
#slidebar li {/*width: 7px;height: 7px;padding: 10px 16px;position: relative*/float:left; font-size:18px; font-family:Open Sans,Arial;line-height:40px;}
#slidebar a {display: block;color:#000000; margin-left:53px; -webkit-transition: all .2s linear .2s;-moz-transition: all .2s linear .2s;-ms-transition: all .2s linear .2s;-o-transition: all .2s linear .2s;transition: all .2s linear .2s}
#slidebar .slidebar-text {display: block;width: 100%;height: 100%;font-size: 12px;text-align: center;line-height: 18px;color: #fff;opacity: 0;filter: alpha(opacity=0);-webkit-transition: opacity .2s linear 0s;-moz-transition: opacity .2s linear 0s;-ms-transition: opacity .2s linear 0s;-o-transition: opacity .2s linear 0s;transition: opacity .2s linear 0s}
#slidebar .slidebar-active a {-webkit-transition: all .2s linear 0s;-moz-transition: all .2s linear 0s;-ms-transition: all .2s linear 0s;-o-transition: all .2s linear 0s;transition: all .2s linear 0s; color:#1367af}
#slidebar .slidebar-active .slidebar-text {opacity: 1;filter: alpha(opacity=100);-webkit-transition: opacity .2s linear .2s;-moz-transition: opacity .2s linear .2s;-ms-transition: opacity .2s linear .2s;-o-transition: opacity .2s linear .2s;transition: opacity .2s linear .2s}


#slidebar {
-webkit-transform: translateX(80px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(80px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(80px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(80px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(80px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: slidebar .8s ease-out 1.6s 1 normal forwards;
-moz-animation: slidebar .8s ease-out 1.6s 1 normal forwards;
-ms-animation: slidebar .8s ease-out 1.6s 1 normal forwards;
-o-animation: slidebar .8s ease-out 1.6s 1 normal forwards;
animation: slidebar .8s ease-out 1.6s 1 normal forwards}
@-webkit-keyframes slidebar {0% {-webkit-transform:translateX(80px)}100% {-webkit-transform:translateX(0)}}
@-moz-keyframes slidebar {0% {-moztransform:translateX(80px)}100% {-moztransform:translateX(0)}}
@-ms-keyframes slidebar {0% {-ms-transform:translateX(80px)}100% {-ms-transform:translateX(0)}}
@-o-keyframes slidebar {0% {-o-transform:translateX(80px)}100% {-o-transform:translateX(0)}}
@keyframes slidebar {0% {transform:translateX(80px)}100% {transform:translateX(0)}}


/*  er ping  */
.stage-state-wait .stage-description {
-webkit-transition: opacity .6s ease-in .1s, -webkit-transform .6s ease-in .1s;
-moz-transition: opacity .6s ease-in .1s, -moz-transform .6s ease-in .1s;
-ms-transition: opacity .6s ease-in .1s, -ms-transform .6s ease-in .1s;
-o-transition: opacity .6s ease-in .1s, -o-transform .6s ease-in .1s;
transition: opacity .6s ease-in .1s, transform .6s ease-in .1s}
.stage-state-in .stage-description {
-webkit-transition: opacity .6s ease-out 1.1s, -webkit-transform .6s ease-out 1.1s;
-moz-transition: opacity .6s ease-out 1.1s, -moz-transform .6s ease-out 1.1s;
-ms-transition: opacity .6s ease-out 1.1s, -ms-transform .6s ease-out 1.1s;
-o-transition: opacity .6s ease-out 1.1s, -o-transform .6s ease-out 1.1s;
transition: opacity .6s ease-out 1.1s, transform .6s ease-out 1.1s}
.stage-state-out-in .stage-description {
-webkit-transition: opacity .6s ease-out .7s, -webkit-transform .6s ease-out .7s;
-moz-transition: opacity .6s ease-out .7s, -moz-transform .6s ease-out .7s;
-ms-transition: opacity .6s ease-out .7s, -ms-transform .6s ease-out .7s;
-o-transition: opacity .6s ease-out .7s, -o-transform .6s ease-out .7s;
transition: opacity .6s ease-out .7s, transform .6s ease-out .7s}
.stage-state-out .stage-description {
-webkit-transition: opacity .6s ease-in .7s, -webkit-transform .6s ease-in .7s;
-moz-transition: opacity .6s ease-in .7s, -moz-transform .6s ease-in .7s;
-ms-transition: opacity .6s ease-in .7s, -ms-transform .6s ease-in .7s;
-o-transition: opacity .6s ease-in .7s, -o-transform .6s ease-in .7s;
transition: opacity .6s ease-in .7s, transform .6s ease-in .7s}

.stage-state-wait .stage-title, .stage-state-wait .stage-description, .stage-state-wait .button-download {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1)}
.stage-state-wait .stage-title {
-webkit-transition: opacity .6s ease-in .2s, -webkit-transform .6s ease-in .2s;
-moz-transition: opacity .6s ease-in .2s, -moz-transform .6s ease-in .2s;
-ms-transition: opacity .6s ease-in .2s, -ms-transform .6s ease-in .2s;
-o-transition: opacity .6s ease-in .2s, -o-transform .6s ease-in .2s;
transition: opacity .6s ease-in .2s, transform .6s ease-in .2s}
.stage-state-in .stage-title, .stage-state-in .stage-description, .stage-state-in .button-download {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1)}
.stage-state-in .stage-title {
-webkit-transition: opacity .6s ease-out 1s, -webkit-transform .6s ease-out 1s;
-moz-transition: opacity .6s ease-out 1s, -moz-transform .6s ease-out 1s;
-ms-transition: opacity .6s ease-out 1s, -ms-transform .6s ease-out 1s;
-o-transition: opacity .6s ease-out 1s, -o-transform .6s ease-out 1s;
transition: opacity .6s ease-out 1s, transform .6s ease-out 1s}
.stage-state-out-in .stage-title {
-webkit-transition: opacity .6s ease-out .8s, -webkit-transform .6s ease-out .8s;
-moz-transition: opacity .6s ease-out .8s, -moz-transform .6s ease-out .8s;
-ms-transition: opacity .6s ease-out .8s, -ms-transform .6s ease-out .8s;
-o-transition: opacity .6s ease-out .8s, -o-transform .6s ease-out .8s;
transition: opacity .6s ease-out .8s, transform .6s ease-out .8s}
.stage-state-out .stage-title, .stage-state-out .stage-description, .stage-state-out .button-download {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1)}
.stage-state-out .stage-title {
-webkit-transition: opacity .6s ease-in .6s, -webkit-transform .6s ease-in .6s;
-moz-transition: opacity .6s ease-in .6s, -moz-transform .6s ease-in .6s;
-ms-transition: opacity .6s ease-in .6s, -ms-transform .6s ease-in .6s;
-o-transition: opacity .6s ease-in .6s, -o-transform .6s ease-in .6s;
transition: opacity .6s ease-in .6s, transform .6s ease-in .6s}

/*  san ping  */

.stage-2-icon {width:1200px;height: 584px;margin:auto;position: relative;z-index: 2; top:50%; margin-top:-202px;}
.stage-2-icon li {position: absolute; left:0px;}
.stage-2-icon li a{ display:block; width:100%; height:100%;}
#stage-2.stage-state-wait .stage-2-icon .stage-2-icon-1 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}
#stage-2.stage-state-in .stage-2-icon .stage-2-icon-1 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 1.4s, -webkit-transform 1.2s ease-out 1.4s;
-moz-transition: opacity 1.2s ease-out 1.4s, -moz-transform 1.2s ease-out 1.4s;
-ms-transition: opacity 1.2s ease-out 1.4s, -ms-transform 1.2s ease-out 1.4s;
-o-transition: opacity 1.2s ease-out 1.4s, -o-transform 1.2s ease-out 1.4s;
transition: opacity 1.2s ease-out 1.4s, transform 1.2s ease-out 1.4s}
#stage-2.stage-state-out .stage-2-icon .stage-2-icon-1 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}



#stage-2.stage-state-wait .stage-2-icon .stage-2-icon-2 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}
#stage-2.stage-state-in .stage-2-icon .stage-2-icon-2 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 1.9s, -webkit-transform 1.2s ease-out 1.4s;
-moz-transition: opacity 1.2s ease-out 1.9s, -moz-transform 1.2s ease-out 1.9s;
-ms-transition: opacity 1.2s ease-out 1.9s, -ms-transform 1.2s ease-out 1.9s;
-o-transition: opacity 1.2s ease-out 1.9s, -o-transform 1.2s ease-out 1.9s;
transition: opacity 1.2s ease-out 1.9s, transform 1.2s ease-out 1.9s}
#stage-2.stage-state-out .stage-2-icon .stage-2-icon-2 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}


#stage-2.stage-state-wait .stage-2-icon .stage-2-icon-3 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}
#stage-2.stage-state-in .stage-2-icon .stage-2-icon-3 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 2.4s, -webkit-transform 1.2s ease-out 2.4s;
-moz-transition: opacity 1.2s ease-out 2.4s, -moz-transform 1.2s ease-out 2.4s;
-ms-transition: opacity 1.2s ease-out 2.4s, -ms-transform 1.2s ease-out 2.4s;
-o-transition: opacity 1.2s ease-out 2.4s, -o-transform 1.2s ease-out 2.4s;
transition: opacity 1.2s ease-out 2.4s, transform 1.2s ease-out 2.4s}
#stage-2.stage-state-out .stage-2-icon .stage-2-icon-3 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}


#stage-2.stage-state-wait .stage-2-icon .stage-2-icon-4 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}
#stage-2.stage-state-in .stage-2-icon .stage-2-icon-4 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 2.9s, -webkit-transform 1.2s ease-out 2.9s;
-moz-transition: opacity 1.2s ease-out 2.9s, -moz-transform 1.2s ease-out 2.9s;
-ms-transition: opacity 1.2s ease-out 2.9s, -ms-transform 1.2s ease-out 2.9s;
-o-transition: opacity 1.2s ease-out 2.9s, -o-transform 1.2s ease-out 2.9s;
transition: opacity 1.2s ease-out 2.9s, transform 1.2s ease-out 2.9s}
#stage-2.stage-state-out .stage-2-icon .stage-2-icon-4 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}


#stage-2.stage-state-wait .stage-2-icon .stage-2-icon-5 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}
#stage-2.stage-state-in .stage-2-icon .stage-2-icon-5 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 3.4s, -webkit-transform 1.2s ease-out 3.4s;
-moz-transition: opacity 1.2s ease-out 3.4s, -moz-transform 1.2s ease-out 3.4s;
-ms-transition: opacity 1.2s ease-out 3.4s, -ms-transform 1.2s ease-out 3.4s;
-o-transition: opacity 1.2s ease-out 3.4s, -o-transform 1.2s ease-out 3.4s;
transition: opacity 1.2s ease-out 3.4s, transform 1.2s ease-out 3.4s}
#stage-2.stage-state-out .stage-2-icon .stage-2-icon-5 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity 1.2s ease-out 0s, -webkit-transform 1.2s ease-out 0s;
-moz-transition: opacity 1.2s ease-out 0s, -moz-transform 1.2s ease-out 0s;
-ms-transition: opacity 1.2s ease-out 0s, -ms-transform 1.2s ease-out 0s;
-o-transition: opacity 1.2s ease-out 0s, -o-transform 1.2s ease-out 0s;
transition: opacity 1.2s ease-out 0s, transform 1.2s ease-out 0s}





.stage-2-icon-1 {bottom: 36px;left: 102px;z-index: 4; }
.stage-2-icon-1 .stage-2-icon-large {width: 847px;height: 584px;bottom: 0;left:202px;background:url(../img/feiji.png) no-repeat center;}
#stage-2.stage-state-in .stage-2-icon-1 .stage-2-icon-large {
-webkit-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: slide-tr 1.2s ease-in-out 2.5s infinite alternate none;
-moz-animation: slide-tr 1.2s ease-in-out 2.5s infinite alternate none;
-ms-animation: slide-tr 1.2s ease-in-out 2.5s infinite alternate none;
-o-animation: slide-tr 1.2s ease-in-out 2.5s infinite alternate none;
animation: slide-tr 1.2s ease-in-out 2.5s infinite alternate none}
@-webkit-keyframes slide-tr {0% {-webkit-transform:translate(10px, 0px)}100% {-webkit-transform:translate(0, 0)}}
@-moz-keyframes slide-tr {0% {-moz-transform:translate(10px, 0px)}100% {-moz-transform:translate(0, 0)}}
@-ms-keyframes slide-tr {0% {-ms-transform:translate(10px, 0px)}100% {-ms-transform:translate(0, 0)}}
@-o-keyframes slide-tr {0% {-o-transform:translate(10px, 0px)}100% {-o-transform:translate(0, 0)}}
@keyframes slide-tr {0% {transform:translate(10px, 0px)}100% {transform:translate(0, 0)}}


.stage-2-icon-1 .stage-2-icon-mini {width: 181px;height: 51px;bottom:282px;left:16px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:51px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-1 .stage-2-icon-mini {
-webkit-animation: popup-tr 1.2s linear 2.5s infinite alternate none;
-moz-animation: popup-tr 1.2s linear 2.5s infinite alternate none;
-ms-animation: popup-tr 1.2s linear 2.5s infinite alternate none;
-o-animation: popup-tr 1.2s linear 2.5s infinite alternate none;
animation: popup-tr 1.2s linear 2.5s infinite alternate none}

@-webkit-keyframes popup-tr {0% {left:16px;}100% {left:6px;}}
@-moz-keyframes popup-tr {0% {left:16px;}100% {left:6px;}}
@-ms-keyframes popup-tr {0% {left:16px;}100% {left:6px;}}
@-o-keyframes popup-tr {0% {left:16px;}100% {left:6px;}}
@keyframes popup-tr {0% {left:16px;}100% {left:6px;}}


.stage-2-icon-2 {bottom:36px; margin-bottom:152px; margin-left:197px;z-index: 5;}
.stage-2-icon-2 .stage-2-icon-large {width: 181px;height: 51px;bottom:224px;left:-4px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:51px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-2 .stage-2-icon-large {
-webkit-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: slide-bl 1.2s ease-in-out 2.5s infinite alternate none;
-moz-animation: slide-bl 1.2s ease-in-out 2.5s infinite alternate none;
-ms-animation: slide-bl 1.2s ease-in-out 2.5s infinite alternate none;
-o-animation: slide-bl 1.2s ease-in-out 2.5s infinite alternate none;
animation: slide-bl 1.2s ease-in-out 2.5s infinite alternate none}
@-webkit-keyframes slide-bl {0% {-webkit-transform:translate(10px, 0px)}100% {-webkit-transform:translate(0, 0)}}
@-moz-keyframes slide-bl {0% {-moz-transform:translate(10px, 0px)}100% {-moz-transform:translate(0, 0)}}
@-ms-keyframes slide-bl {0% {-ms-transform:translate(10px, 0px)}100% {-ms-transform:translate(0, 0)}}
@-o-keyframes slide-bl {0% {-o-transform:translate(10px, 0px)}100% {-o-transform:translate(0, 0)}}
@keyframes slide-bl {0% {transform:translate(10px, 0px)}100% {transform:translate(0, 0)}}


.stage-2-icon-2 .stage-2-icon-mini {width: 210px;height: 51px;bottom:0px;left:-30px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:51px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-2 .stage-2-icon-mini {
-webkit-animation: popup-bl 1.2s linear 2.8s infinite alternate none;
-moz-animation: popup-bl 1.2s linear 2.8s infinite alternate none;
-ms-animation: popup-bl 1.2s linear 2.8s infinite alternate none;
-o-animation: popup-bl 1.2s linear 2.8s infinite alternate none;
animation: popup-bl 1.2s linear 2.8s infinite alternate none}

@-webkit-keyframes popup-bl {0% {left:-30px;}100% {left:-40px;}}
@-moz-keyframes popup-bl {0% {left:-30px;}100% {left:-40px;}}
@-ms-keyframes popup-bl {0% {left:-30px;}100% {left:-40px;}}
@-o-keyframes popup-bl {0% {left:-30px;}100% {left:-40px;}}
@keyframes popup-bl {0% {left:-30px;}100% {left:-40px;}}


.stage-2-icon-3 {bottom:36px; margin-bottom:71px;margin-left: 380px;z-index: 5;}
.stage-2-icon-3 .stage-2-icon-large {width: 144px;height: 50px;top: 0;left:-76px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:50px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-3 .stage-2-icon-large, #stage-2.stage-state-in .stage-2-icon-6 .stage-2-icon-large, #stage-2.stage-state-in .stage-2-icon-7 .stage-2-icon-large {-webkit-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: slide-br 1.2s ease-in-out 2.5s infinite alternate none;
-moz-animation: slide-br 1.2s ease-in-out 2.5s infinite alternate none;
-ms-animation: slide-br 1.2s ease-in-out 2.5s infinite alternate none;
-o-animation: slide-br 1.2s ease-in-out 2.5s infinite alternate none;
animation: slide-br 1.2s ease-in-out 2.5s infinite alternate none}
@-webkit-keyframes slide-br {0% {-webkit-transform:translate(10px, 0px)}100% {-webkit-transform:translate(0, 0)}}
@-moz-keyframes slide-br {0% {-moz-transform:translate(10px, 0px)}100% {-moz-transform:translate(0, 0)}}
@-ms-keyframes slide-br {0% {-ms-transform:translate(10px, 0px)}100% {-ms-transform:translate(0, 0)}}
@-o-keyframes slide-br {0% {-o-transform:translate(10px, 0px)}100% {-o-transform:translate(0, 0)}}
@keyframes slide-br {0% {transform:translate(10px, 0px)}100% {transform:translate(0, 0)}}

.stage-2-icon-3 .stage-2-icon-mini {width: 137px;height: 51px;bottom:0px;left: -68px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:51px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-3 .stage-2-icon-mini {
-webkit-animation: popup-br 1.2s linear 2.5s infinite alternate none;
-moz-animation: popup-br 1.2s linear 2.5s infinite alternate none;
-ms-animation: popup-br 1.2s linear 2.5s infinite alternate none;
-o-animation: popup-br 1.2s linear 2.5s infinite alternate none;
animation: popup-br 1.2s linear 2.5s infinite alternate none}
@-webkit-keyframes popup-br {0% {left:-68px;}100% {left:-78px;}}
@-moz-keyframes popup-br {0% {left:-68px;}100% {left:-78px;}}
@-ms-keyframes popup-br {0% {left:-68px;}100% {left:-78px;}}
@-o-keyframes popup-br {0% {left:-68px;}100% {left:-78px;}}
@keyframes popup-br {0% {left:-68px;}100% {left:-78px;}}




.stage-2-icon-4 {bottom: 36px; margin-bottom:104px; margin-left: 597px;z-index: 6;}
.stage-2-icon-4 .stage-2-icon-large {width: 292px;height: 51px;left: 0;bottom: 338px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:51px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-4 .stage-2-icon-large {
-webkit-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: slide-tl 1.2s ease-in-out 2.5s infinite alternate none;
-moz-animation: slide-tl 1.2s ease-in-out 2.5s infinite alternate none;
-ms-animation: slide-tl 1.2s ease-in-out 2.5s infinite alternate none;
-o-animation: slide-tl 1.2s ease-in-out 2.5s infinite alternate none;
animation: slide-tl 1.2s ease-in-out 2.5s infinite alternate none}

@-webkit-keyframes slide-tl {0% {-webkit-transform:translate(10px, 0px)}100% {-webkit-transform:translate(0, 0)}}
@-moz-keyframes slide-tl {0% {-moz-transform:translate(10px, 0px)}100% {-moz-transform:translate(0, 0)}}
@-ms-keyframes slide-tl {0% {-ms-transform:translate(10px, 0px)}100% {-ms-transform:translate(0, 0)}}
@-o-keyframes slide-tl {0% {-o-transform:translate(10px, 0px)}100% {-o-transform:translate(0, 0)}}
@keyframes slide-tl {0% {transform:translate(10px, 0px)}100% {transform:translate(0, 0)}}
.stage-2-icon-4 .stage-2-icon-mini {width: 290px;height: 51px;left:0;bottom: 0;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:51px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-4 .stage-2-icon-mini {
-webkit-animation: popup-b5 1.2s linear 2.8s infinite alternate none;
-moz-animation: popup-b5 1.2s linear 2.8s infinite alternate none;
-ms-animation: popup-b5 1.2s linear 2.8s infinite alternate none;
-o-animation: popup-b5 1.2s linear 2.8s infinite alternate none;
animation: popup-b5 1.2s linear 2.8s infinite alternate none}

@-webkit-keyframes popup-b5 {0% {left:0px;}100% {left:-10px;}}
@-moz-keyframes popup-b5 {0% {left:0px;}100% {left:-10px;}}
@-ms-keyframes popup-b5 {0% {left:0px;}100% {left:-10px;}}
@-o-keyframes popup-b5 {0% {left:0px;}100% {left:-10px;}}
@keyframes popup-b5 {0% {left:0px;}100% {left:-10px;}}




.stage-2-icon-5 {bottom: 36px; margin-bottom:171px; margin-left: 1045px;z-index: 7;}
.stage-2-icon-5 .stage-2-icon-large {width: 144px;height: 48px;left: 0;bottom: 189px;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:48px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-5 .stage-2-icon-large {
-webkit-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(10px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-animation: slide-t6 1.2s ease-in-out 2.5s infinite alternate none;
-moz-animation: slide-t6 1.2s ease-in-out 2.5s infinite alternate none;
-ms-animation: slide-t6 1.2s ease-in-out 2.5s infinite alternate none;
-o-animation: slide-t6 1.2s ease-in-out 2.5s infinite alternate none;
animation: slide-t6 1.2s ease-in-out 2.5s infinite alternate none}

@-webkit-keyframes slide-t6 {0% {-webkit-transform:translate(10px, 0px)}100% {-webkit-transform:translate(0, 0)}}
@-moz-keyframes slide-t6 {0% {-moz-transform:translate(10px, 0px)}100% {-moz-transform:translate(0, 0)}}
@-ms-keyframes slide-t6 {0% {-ms-transform:translate(10px, 0px)}100% {-ms-transform:translate(0, 0)}}
@-o-keyframes slide-t6 {0% {-o-transform:translate(10px, 0px)}100% {-o-transform:translate(0, 0)}}
@keyframes slide-t6 {0% {transform:translate(10px, 0px)}100% {transform:translate(0, 0)}}
.stage-2-icon-5 .stage-2-icon-mini {width: 144px;height: 49px;left:0;bottom: 0;background:#fff; background:rgba(255,255,255,0.17); border:1px solid #8bd2fb; border-radius:3px; font-size:18px;line-height:49px; text-align:center;}
#stage-2.stage-state-in .stage-2-icon-5 .stage-2-icon-mini {
-webkit-animation: popup-b6 1.2s linear 2.8s infinite alternate none;
-moz-animation: popup-b6 1.2s linear 2.8s infinite alternate none;
-ms-animation: popup-b6 1.2s linear 2.8s infinite alternate none;
-o-animation: popup-b6 1.2s linear 2.8s infinite alternate none;
animation: popup-b6 1.2s linear 2.8s infinite alternate none}

@-webkit-keyframes popup-b6 {0% {left:0px;}100% {left:-10px;}}
@-moz-keyframes popup-b6 {0% {left:0px;}100% {left:-10px;}}
@-ms-keyframes popup-b6 {0% {left:0px;}100% {left:-10px;}}
@-o-keyframes popup-b6 {0% {left:0px;}100% {left:-10px;}}
@keyframes popup-b6 {0% {left:0px;}100% {left:-10px;}}


.stage-2-title {width:100%;height:100%;position:absolute;z-index: 1; top:0px; background:url(../img/sanbei.jpg) no-repeat center; background-size:100% 100%;}

.stage-2-description {width: 742px;position: relative;z-index: 1}
#stage-2 .button-download {position: relative;z-index: 1}


/*  si ping  */
.stage-3-title {width:100%;height:100%;position:absolute;z-index: 1; top:0px; left:0px; background:url(../img/siping.jpg) no-repeat center; background-size:100% 100%;}
#stage-3 .stage-content {width:100%;height:100%; top:0px; left:0px;}
.stage-3-icon {margin:auto;position: relative;z-index: 1;}
.stage-3-icon-chameleon {z-index: 3;}
.stage-3-description {position: relative;z-index: 2}
#stage-3.stage-state-wait .stage-3-icon {
opacity: 0;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-3.stage-state-in .stage-3-icon {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-3.stage-state-out .stage-3-icon {
opacity: 0;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}


.stage-3-icon-chameleon-turnplate {width: 387px; padding:0 20px; padding-bottom:18%; margin-top:3%;left: 0px;overflow: hidden;z-index: 2;background:#fff; background:rgba(255,255,255,.17)}
.stage-3-icon-chameleon-turnplate {position: absolute;z-index:3;}
#stage-3.stage-state-wait .stage-3-icon-chameleon-turnplate {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-3.stage-state-in .stage-3-icon-chameleon-turnplate {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-3.stage-state-out .stage-3-icon-chameleon-turnplate {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}

.stage-3-icon-fragment {width: 713px; padding-left:40px; padding-right:20px; padding-bottom:3.3%;position: absolute;overflow: hidden;z-index: 1;margin-left: 427px;margin-top: 3%}
.stage-3-icon-fragment { background:#000; background:rgba(0,0,0,0.29)}
.stage-3-icon-fragment-cycle {width: 100%;height: 100%;position: absolute;top: 0;left: 0;background-repeat: no-repeat;}
#stage-3.stage-state-wait .stage-3-icon-fragment {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-3.stage-state-in .stage-3-icon-fragment {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-3.stage-state-out .stage-3-icon-fragment {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}




/*  wu ping  */
.zuoshang { width:479px; height:497px; position:absolute; background:url(../img/zuoshang.png) no-repeat center; left:0px; top:0px; z-index:2;}
#stage-4.stage-state-wait .zuoshang {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-4.stage-state-in .zuoshang {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 0.8s, transform .8s ease-out 0.8s}
#stage-4.stage-state-out .zuoshang {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}

.youxia { width:661px; height:520px; position:absolute; background:url(../img/youxia.png) no-repeat center; right:0px; bottom:0px; z-index:2;}
#stage-4.stage-state-wait .youxia {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-4.stage-state-in .youxia {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 0.8s, -webkit-transform .8s ease-out 0.8s;
-moz-transition: opacity .8s ease-out 0.8s, -moz-transform .8s ease-out 0.8s;
-ms-transition: opacity .8s ease-out 0.8s, -ms-transform .8s ease-out 0.8s;
-o-transition: opacity .8s ease-out 0.8s, -o-transform .8s ease-out 0.8s;
transition: opacity .8s ease-out 0.8s, transform .8s ease-out 0.8s}
#stage-4.stage-state-out .youxia {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}

#stage-4.stage-state-wait .duanyi {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-4.stage-state-in .duanyi {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-4.stage-state-out .duanyi {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}


#stage-4.stage-state-wait .duaner {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-4.stage-state-in .duaner {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-4.stage-state-out .duaner {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}


/*  liu ping  */
#stage-6.stage-state-wait .zhaopianqiang {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-6.stage-state-in .zhaopianqiang {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 0.8s, transform .8s ease-out 0.8s}
#stage-6.stage-state-out .zhaopianqiang {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}


#stage-6.stage-state-wait .liup {
opacity: 0;
-webkit-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-moz-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-ms-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-o-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-6.stage-state-in .liup {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-6.stage-state-out .liup {
opacity: 0;
-webkit-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-moz-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-ms-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-o-transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
transform: translateX(0) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(0.3);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}

#stage-6.stage-state-wait .dianhua6 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-6.stage-state-in .dianhua6 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-6.stage-state-out .dianhua6 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}

#stage-6.stage-state-wait .youxiang6 {
opacity: 0;
-webkit-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-6.stage-state-in .youxiang6 {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 1.4s, transform .8s ease-out 1.4s}
#stage-6.stage-state-out .youxiang6 {
opacity: 0;
-webkit-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(-300px) translateY(0px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}


#stage-6.stage-state-wait .banquan {
opacity: 0;
-webkit-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}
#stage-6.stage-state-in .banquan {
opacity: 1;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .8s ease-out 1.4s, -webkit-transform .8s ease-out 1.4s;
-moz-transition: opacity .8s ease-out 1.4s, -moz-transform .8s ease-out 1.4s;
-ms-transition: opacity .8s ease-out 1.4s, -ms-transform .8s ease-out 1.4s;
-o-transition: opacity .8s ease-out 1.4s, -o-transform .8s ease-out 1.4s;
transition: opacity .8s ease-out 0.8s, transform .8s ease-out 0.8s}
#stage-6.stage-state-out .banquan {
opacity: 0;
-webkit-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-moz-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-ms-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-o-transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
transform: translateX(0) translateY(-300px) translateZ(0) rotateX(0) rotateY(0) rotateZ(0) rotate(0) scale(1);
-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;
-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;
-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;
-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;
transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}



#stages, .stage {width: 100%;height: 100%;position: relative}
#stages {font-size: 32px;z-index: 0}
.stage {position: absolute;top: 0;left: 0;overflow: hidden}
.stage-content {position: absolute;top: 50%}
.package-info {width: 100%;text-align: center;line-height: 12px}
.package-info li {display: inline;margin: 0 5px;font-size: 12px;color: #b7b7b7}
.button-download {display: block;width: 240px;height: 70px;margin: 0 auto 15px;overflow: hidden;text-indent: -999px;background-repeat: no-repeat;}
.button-next {width: 128px;height: 64px;position: absolute;bottom: 85px;z-index: 1;text-align: center;cursor: pointer;background: url(http://liulanqi.baidu.com/mainsite/theme/img/home/bg-scroll-arrow_95a71ba.png) no-repeat center bottom;opacity: 0;margin-left: -64px;left: 50%}
.button-next-text {font-size: 16px;color: #787878}
.button-next-icon {width: 100%;height: 24px;position: absolute;bottom: 0;left: 0}
.button-next-weixin {width: 380px;margin-left: -190px}
.button-next-weixin .button-next-guide {padding-left: 22px;position: relative;color: #00c500}
.button-next-weixin .button-next-guide-icon {width: 16px;height: 16px;margin: -8px 0 0 -22px;position: absolute;top: 50%;background: url(http://liulanqi.baidu.com/mainsite/theme/img/home/icon-weixin_a81e328.png) no-repeat 0 -16px}
.button-next-weixin .button-next-link {text-decoration: underline;color: #1cadf0}

.stage-state-wait {z-index: 0}
.stage-state-in {z-index: 1}
.stage-state-out {z-index: 0}

.stage-state-wait .button-download {-webkit-transition: opacity .6s ease-in 0s, -webkit-transform .6s ease-in 0s;-moz-transition: opacity .6s ease-in 0s, -moz-transform .6s ease-in 0s;-ms-transition: opacity .6s ease-in 0s, -ms-transform .6s ease-in 0s;-o-transition: opacity .6s ease-in 0s, -o-transform .6s ease-in 0s;transition: opacity .6s ease-in 0s, transform .6s ease-in 0s}

.stage-state-in .button-download {-webkit-transition: opacity .6s ease-out 1.2s, -webkit-transform .6s ease-out 1.2s;-moz-transition: opacity .6s ease-out 1.2s, -moz-transform .6s ease-out 1.2s;-ms-transition: opacity .6s ease-out 1.2s, -ms-transform .6s ease-out 1.2s;-o-transition: opacity .6s ease-out 1.2s, -o-transform .6s ease-out 1.2s;transition: opacity .6s ease-out 1.2s, transform .6s ease-out 1.2s}
.stage-state-out-in .button-download {-webkit-transition: opacity .6s ease-out .6s, -webkit-transform .6s ease-out .6s;-moz-transition: opacity .6s ease-out .6s, -moz-transform .6s ease-out .6s;-ms-transition: opacity .6s ease-out .6s, -ms-transform .6s ease-out .6s;-o-transition: opacity .6s ease-out .6s, -o-transform .6s ease-out .6s;transition: opacity .6s ease-out .6s, transform .6s ease-out .6s}
.stage-state-out .button-download {-webkit-transition: opacity .6s ease-in .8s, -webkit-transform .6s ease-in .8s;-moz-transition: opacity .6s ease-in .8s, -moz-transform .6s ease-in .8s;-ms-transition: opacity .6s ease-in .8s, -ms-transform .6s ease-in .8s;-o-transition: opacity .6s ease-in .8s, -o-transform .6s ease-in .8s;transition: opacity .6s ease-in .8s, transform .6s ease-in .8s}









