body { font: 16px/1.8 "Microsoft Yahei",verdana;}
img{border: none;}
#fp-nav { _display: none; font-size: 12px;}
#fp-nav li { width: 90px; height: 22px; margin: 15px 0 0; vertical-align: middle;}
#fp-nav li a { float: right; width: 22px; height: 22px; color: #8F9DA4; text-decoration: none; text-align: right; background: url(../images/circle_gray.png) no-repeat;}
#fp-nav li .active {background: url(../images/circle_color.png)}
#fp-nav span { display: none;}
.fullPage-tooltip { float: left; top: 0; margin-right: 5px; font: 12px "Microsoft Yahei"; color: #8F9DA4; line-height: 21px;}
.header{width: 100%; height: 100px; position: fixed; top: 0; left: 0; z-index: 9999; background: rgba(255,255,255,.27);}
.header img.fl{margin: 15px 0 0 100px;}
.header img.fr{float:right; margin:20px 100px 0 0}
nav{position: fixed; bottom:60px; width:800px; right: 0; z-index: 9999; height:120px }
nav li{list-style: none; width:94px; height: 94px; text-align: center; float:left; margin: 0 25px 0 0;}
.tansform{ transform: rotateY(360deg); background: #0080b7; transition: ease 1s;}
.tansform-leave{ transform: rotateY(-0deg); background: #2E3E4E  ; transition: ease .8s;}
nav a{text-decoration: none;}
nav li div{width: 100%; height: 100%; background: #2E3E4E  ; box-shadow: 2px 2px 5px rgba(0,0,0,.5); border-radius:18px;  }
nav li div>img{margin: 3px 0 0 0; display:inline-block; height:60px;}
nav li div>p{height: 20px; line-height: 20px; text-align: center; color: #fff; margin: 0;}
.footer{position: absolute; bottom: 0; width: 100%; height: 42px; line-height: 42px; text-align: center; background: #2e3e4e; color: #fff; letter-spacing: 1px;}
.section { position: relative; overflow: hidden;}
.section .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.section .bg img { display: block; width: 100%; height: 100%;}
/*.next-page{position: absolute; bottom:0px; height: 100px; width: 100px; margin-left: 50%; left: -50px;  z-index: 999;}
.next-page a{display: block; width: 100%; height: 100%; background: url(../images/arrow.gif) no-repeat center 30px/50px auto}*/
.section h3 {position: absolute; left: 50%; top: 15%; z-index: 10; width: 512px; height: 45px; margin-left: -256px; font-size: 24px; font-weight: 500; 
color: #748A9E; opacity: 0; -webkit-transform:scale(0.5, 0.5); transform:scale(0.5, 0.5); transition: all 1s;}
.bg11{ position: absolute; left: 50%;  width: 136px; height: 67px;  margin-top: -300px; background: url(../images/words1_1.png) 0 0 no-repeat; transition: all 1s;  opacity: 0; margin-left: -1108px;}
.bg12{ position: absolute; left: 50%;  width: 527px; height: 118px; margin-top: -220px; background: url(../images/words1_2.png) 0 0 no-repeat; transition: all .8s;  opacity: 0; margin-left: 2008px;}
.bg21{position: absolute;  width: 488px; height: 68px; bottom: 260px; left: 100px; transform: rotateZ(-13deg);background: url(../images/words2_1.png) 0 0 no-repeat; transition: all 1.5s;  opacity: 0;}
.bg22{position: absolute;  width: 531px; height: 119px; bottom:130px; left: 130px; background: url(../images/words2_2.png) 0 0 no-repeat; transition: all 1s;  opacity: 0;}
.bg31{ position: absolute;  width: 476px; height: 67px;  margin-left: 220px;  margin-top: -220px; background: url(../images/words3_1.png) 0 0 no-repeat; transition: all 1s;  opacity: 0;}
.bg32{ position: absolute;  left: 350px;  width: 569px; height: 121px; margin-top: -220px; background: url(../images/words3_2.png) 0 0 no-repeat; transition: all .6s;  opacity: 0;}
.bg41{ position: absolute;  width: 276px; height: 67px; 
 margin-top: -300px; right: -200px;background: url(../images/words4_1.png) 0 0 no-repeat; transition: all 1s;
 opacity: 0; }
.bg42{ position: absolute;   width: 415px; height: 105px; margin-top: 500px; right: 300px;background: url(../images/words4_2.png) 0 0 no-repeat; transition: all .8s;  opacity: 0; }
.bg51{ position: absolute; left: 50%;  width: 277px; height: 68px;  margin-top: -300px; background: url(../images/words5_1.png) 0 0 no-repeat; transition: all 1s;  opacity: 0; margin-left: -1108px;}
.bg52{ position: absolute; left: 50%;  width: 401px; height: 111px; margin-top: -220px; background: url(../images/words5_2.png) 0 0 no-repeat; transition: all .8s;  opacity: 0; margin-left: 2008px;}
 
 
/*CSS3动画效果*/
.active .bg11 { opacity: 1; margin-left: -608px; transition-delay: 0.7s;}
.active .bg12 { opacity: 1; margin-left: -608px; transition-delay: 1s;}
.active .bg21 { opacity: 1; transition-delay: 1.2s;}
.active .bg22 { opacity: 1; transition-delay: .5s; transform: rotateZ(-13deg);}
.active .bg31 { opacity: 1; margin-top: -300px; transition-delay: .7s;}
.active .bg32 { opacity: 1; left: 220px; transition-delay: 1.4s;}
.active .bg41 { opacity: 1; margin-right: 630px; transition-delay: 0.7s;}
.active .bg42 { opacity: 1; margin-top: -220px; transition-delay: 1s;}
.active .bg51 { opacity: 1; margin-left: -608px; transition-delay: 0.7s;}
.active .bg52 { opacity: 1; margin-left: -608px; transition-delay: 1s;}


/*Ie10*/

.ltie10 .bg11 { opacity: 1; margin-left: -608px; transition-delay: 0.7s;}
.ltie10 .bg12 { opacity: 1; margin-left: -608px; transition-delay: 1s;}
.ltie10 .bg21 { opacity: 1; transition-delay: 1.2s;}
.ltie10 .bg22 { opacity: 1; transition-delay: .5s; transform: rotateZ(-13deg);}
.ltie10 .bg31 { opacity: 1; margin-top: 220px; transition-delay: 0.7s;}
.ltie10 .bg32 { opacity: 1; left: 220px; transition-delay: 1s;}
.ltie10 .bg41 { opacity: 1; margin-left: 1400px; transition-delay: 0.7s;}
.ltie10 .bg42 { opacity: 1; margin-top: 320px; transition-delay: 1s;}
.ltie10 .bg51 { opacity: 1; margin-left: -608px; transition-delay: 0.7s;}
.activltie10e .bg52 { opacity: 1; margin-left: -608px; transition-delay: 1s;}