﻿@charset "utf-8";
/*Css Document*/

html { background:#fff;}
body { font-weight:lighter; -webkit-font-smoothing: antialiased;}
a{color:#333; text-decoration:none; cursor:pointer; outline: 0 none;}
a:hover{ text-decoration:none;}
a:focus{-moz-outline-style:none; border:0;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0; padding:0;font-family:"Microsoft Yahei","微软雅黑";}
ol,li,ul,dl,dt,dd{list-style:none;}
img{border:0;}
h1,h2,h3,h4,h5,h6{font-size:inherit; font-weight:lighter;}
table{border-collapse:collapse; border-spacing:0;}
.fl{float: left;}
.fr{float: right;}
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clearfix{ zoom:1;}
.section { display:block; overflow:hidden;position: relative;font: 14px/1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;}
.center{width:1246px;height:100%;margin: 0 auto;position: relative;}
.section p{font-size: 17px;line-height: 30px;letter-spacing:2px;}
.footer{height: 235px;background: #eee;overflow: hidden;}
.footer a{ font-size: 20px;color: #333;text-align: center;display: block;padding:95px 0 10px;}
.footer p{font-size: 33px;color: #00b0e4;text-align: center;}
/*top nav*/
#menu{height: 52px;background-color: rgba(255, 255, 255, .9); position:fixed; top: 0;left: 0;right: 0;z-index: 99999; }
.nav-center{width: 1246px;height: 52px; margin: 0 auto;line-height: 52px;position: relative;z-index: 999;}
.nav-center h1{margin-top: 15px;}
.nav-center ul li{float: left;padding: 0 32px;}
.nav-center ul li a{font-size: 14px;}
.nav-center ul li:last-child{padding-right: 0;}
.nav-center ul .hover:hover{color: #00A0EE;}
.nav-center ul .blue{background: rgba(48, 174, 250, 0.78);border-radius: 20px;display: block;width: 100px;height: 30px;margin-top: 11px;text-align: center;line-height: 30px;}
.nav-center ul .blue:hover{background: rgb(48, 174, 250);}
#menu .phone_div{opacity:0; transform:translateY(395px); position: absolute;top:962%;height:565px;width:395px;transition: all ease-out 0.5s 0s;-webkit-transition: all ease-out 0.5s 0s; -moz-transition: all ease-out 0.5s 0s;}
#menu .phone{height:565px;width:395px;background: url(../images/p3-3.png) center no-repeat;position: relative;z-index:99;}
.phone_img{width: 214px;height: 377px;background: url(../images/sj-1.jpg) center no-repeat;position: absolute;top: 60px;left: 130px;z-index:97;}
.page{position: absolute;top: 60px;left: 130px;width: 214px;height: 377px;opacity: 0;-webkit-transition: all ease-out .1s 0s; -moz-transition: all ease-out .1s 0s;z-index:98;}
.page img{width: 100%;height: 100%;display: block;}
.phone_img.p1,.phone_img.p2,.phone_img.p3{position: absolute;top: 60px;left: 130px;}
.on{opacity:1;transition: all ease-out 1s .5s;-webkit-transition: all ease-out 1s .5s; -moz-transition: all ease-out 1s .5s;}
.phone_div .p1{width: 214px ;height:377px;background: url(../images/sj-2.png) center no-repeat;}
.phone_div .p2{width: 214px ;height:377px;background: url(../images/sj-3.png) center no-repeat;}
.phone_div .p3{width: 214px ;height:377px;background: url(../images/sj-4.png) center no-repeat;}
/* 右侧导航 */
#fullPage-nav { _display: none; font-size: 12px;}
#fullPage-nav li { width: 90px; height: 21px; margin: 10px 0 0; vertical-align: middle;}
#fullPage-nav li a { float: right; width: 21px; height: 21px; color: #8F9DA4; text-decoration: none; text-align: right; background: url(../images/dot.png) 5px 5px no-repeat;}
#fullPage-nav li .active { background-position: 0 bottom;}
#fullPage-nav span { display: none;}
.fullPage-tooltip { float: left; top: 0; margin-right: 5px; font: 12px "Microsoft Yahei"; color: #8F9DA4; line-height: 21px;}

/*概述*/
.header ul>li{position: relative;}

.header ul li dl dd a{padding-top:5px !important;letter-spacing: 2px;}
.menu_box {
    display: none;
    position: absolute;
    top: 72px;
    left: -22px;
    z-index: 100000;
    background: #00b8ee;
    width: 92px;
    font-size: 16px;
    line-height: 31px;
    text-align: center;
}

/*
.section1{height:auto;width: 100%;}
*/
.video1{width:100%;height:100%;position: absolute;left: 0;top: 0;}


.section1 .page1_txt{-webkit-animation:page1_txt 1s ease 1 0.1s;-moz-animation:page1_txt 1s ease  0.1s;animation:page1_txt 1s ease 0.1s;width:450px;height:auto;text-align: center;z-index:111;letter-spacing: 1px; -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity: 0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;position: absolute;top: 50%;margin-top:-65px;}
.section1 .page1_txt h3{font-size:45px;line-height:85px;color: #00b0e4;}
.active .page1_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity: 1;transition: all ease-out 1.5s 1s;-webkit-transition: all ease-out 1.5s 1s; -moz-transition: all ease-out 1.5s 1s;}

.section2{background: url(../images/p2-bg.jpg) center no-repeat;background-size:cover; }
.page2_txt{width: 100%;height:auto;color:#fff; text-align: center;position:absolute; top:50%;margin-top:-105px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity: 0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s; }
.page2_txt h2{font-size: 35px;line-height: 65px;}
.page2_txt .p_2{margin-top: 25px;}
.active .page2_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity: 1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}


.section3{background: url(../images/p3-bg.jpg) center no-repeat;background-size:cover;position: relative;}
.page3_txt{height: auto;width:660px;padding-top:100px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity: 0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s; }
.section3 .rote_3{width:445px;height:480px;position: absolute;left:75.1255%;top:33.555%;background-size: cover;}
.section3 .rote_re{width: 100%;height: 100%;position: relative;}
.section3 .p1{background-size:cover;width: 100%;height: 100%;background: url(../images/B_1.png) center no-repeat;position: absolute;left: 0;top: 0;}
.section3 .p2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;background-size:cover;width: 100%;height: 100%;background: url(../images/B_2.png) center no-repeat;position: absolute;left: 0;top: 0;z-index: 20;}
.section3 .p3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;background-size:cover;width: 100%;height: 100%;background: url(../images/B_3.png) center no-repeat;position: absolute;left: 0;top: 0;z-index: 50;}
.section3 .p4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;background-size:cover;width: 100%;height: 100%;background: url(../images/B_4.png) center no-repeat;position: absolute;left: 0;top: 0;z-index: 56;}
.section3 h2{font-size: 35px;color:#00b0e6;line-height: 50px;}
.section3 h3{font-size: 20px;line-height:70px;}
.active .page3_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s; }

.section4{background: url(../images/p4-bg.jpg) no-repeat center;background-size:cover; }
.section4 .page4_txt{width: 519px;height:314px;background: rgba(255,255,255,.7);text-align: left;padding:110px 28px 90px;margin-left: 295px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;}
.page4_txt h2{font-size: 35px;color:#00b0e6;line-height: 50px;}
.page4_txt h3{margin: 25px 0;font-size: 20px;}
.active .page4_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}

.section4 .rote4_1{width:280px;height:312px;position: absolute;left:91px;top:202px;background-size: cover;}
.rote4_1 .rote_re{opacity:0;-webkit-animation:anim4_1 2s ease 1s infinite;animation:anim4_1 2s ease 1s infinite;width: 100%;height: 100%;position: relative;}
.rote4_1 .p1{background-size:cover;width: 100%;height: 100%;background: url(../images/B_1.png) center no-repeat;position: absolute;left: 0;top: 0;}
.rote4_1 .p2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;background-size:cover;width: 100%;height: 100%;background: url(../images/B_2.png) center no-repeat;position: absolute;left: 0;top: 0;z-index: 20;}
.rote4_1 .p3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;background-size:cover;width: 100%;height: 100%;background: url(../images/B_3.png) center no-repeat;position: absolute;left: 0;top: 0;z-index: 50;}
.rote4_1 .p4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;background-size:cover;width: 100%;height: 100%;background: url(../images/B_4.png) center no-repeat;position: absolute;left: 0;top: 0;z-index: 56;}

.section4 .rote4_2{width:165px;height:165px;position: absolute;right:312px;top:138px;background-size: cover;}
.rote4_2 .rote_re{opacity:0;-webkit-animation:anim4_1 2s ease 2s infinite;animation:anim4_1 2s ease 2s infinite;width: 100%;height: 100%;position: relative;}
.rote4_2 .p1{width: 100%;height: 100%;background: url(../images/B_1.png) center no-repeat;position: absolute;left: 0;top: 0;background-size: 165px 165px;}
.rote4_2 .p2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;width: 100%;height: 100%;background: url(../images/B_2.png) center no-repeat;background-size: 165px 165px;position: absolute;left: 0;top: 0;z-index: 20;}
.rote4_2 .p3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;width: 100%;height: 100%;background: url(../images/B_3.png) center no-repeat;background-size: 165px 165px;position: absolute;left: 0;top: 0;z-index: 50;}
.rote4_2 .p4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;width: 100%;height: 100%;background: url(../images/B_4.png) center no-repeat;background-size: 165px 165px;position: absolute;left: 0;top: 0;z-index: 56;}

.section4 .rote4_3{width:150px;height:165px;position: absolute;right:65px;top:800px;background-size: cover;z-index: 20}
.rote4_3 .rote_re{opacity:0;-webkit-animation:anim4_1 2s ease 2s infinite;animation:anim4_1 2s ease 2s infinite;width: 100%;height: 100%;position: relative;}
.rote4_3 .p1{width: 100%;height: 100%;background: url(../images/B_1.png) center no-repeat;position: absolute;left: 0;top: 0;background-size: 165px 165px;}
.rote4_3 .p2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;width: 100%;height: 100%;background: url(../images/B_2.png) center no-repeat;background-size: 165px 165px;position: absolute;left: 0;top: 0;z-index: 20;}
.rote4_3 .p3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;width: 100%;height: 100%;background: url(../images/B_3.png) center no-repeat;background-size: 165px 165px;position: absolute;left: 0;top: 0;z-index: 50;}
.rote4_3 .p4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;width: 100%;height: 100%;background: url(../images/B_4.png) center no-repeat;background-size: 165px 165px;position: absolute;left: 0;top: 0;z-index: 56;}

.section4 .rote4_4{width:180px;height:180px;position: absolute;right:475px;top:653px;background-size: cover;}
.rote4_4 .rote_re{opacity:0;-webkit-animation:anim4_1 2s ease 2s infinite;animation:anim4_1 2s ease 2s infinite;width: 100%;height: 100%;position: relative;}
.rote4_4 .p1{width: 100%;height: 100%;background: url(../images/B_1.png) center no-repeat;position: absolute;left: 0;top: 0;background-size: 170px 170px;}
.rote4_4 .p2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;width: 100%;height: 100%;background: url(../images/B_2.png) center no-repeat;background-size: 180px 180px;position: absolute;left: 0;top: 0;z-index: 20;}
.rote4_4 .p3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;width: 100%;height: 100%;background: url(../images/B_3.png) center no-repeat;background-size: 180px 180px;position: absolute;left: 0;top: 0;z-index: 50;}
.rote4_4 .p4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;width: 100%;height: 100%;background: url(../images/B_4.png) center no-repeat;background-size: 180px 180px;position: absolute;left: 0;top: 0;z-index: 56;}

.active .rote4_1 .rote_re{opacity:1;transition: all ease-out 1s 2s;-webkit-transition: all ease-out 1s 2s; -moz-transition: all ease-out 1s 2s;}
.active .rote4_2 .rote_re{opacity:1;transition: all ease-out 1s 3s;-webkit-transition: all ease-out 1s 3s; -moz-transition: all ease-out 1s 3s;}
.active .rote4_3 .rote_re{opacity:1;transition: all ease-out 1s 4s;-webkit-transition: all ease-out 1s 4s; -moz-transition: all ease-out 1s 4s;}
.active .rote4_4 .rote_re{opacity:1;transition: all ease-out 1s 5s;-webkit-transition: all ease-out 1s 5s; -moz-transition: all ease-out 1s 5s;}

.active .rote4_2{opacity:0;transition: all ease-out 1s 10s;-webkit-transition: all ease-out 1s 10s; -moz-transition: all ease-out 1s 10s;}
.active .rote4_3{opacity:0;transition: all ease-out 1s 13s;-webkit-transition: all ease-out 1s 13s; -moz-transition: all ease-out 1s 13s;}
.active .rote4_4{opacity:0;transition: all ease-out 1s 15s;-webkit-transition: all ease-out 1s 15s; -moz-transition: all ease-out 1s 15s;}

.pabg60{width: 60%;height:100%;background: url(../images/p4-bg_01.jpg) no-repeat;position: absolute;left: 0;top: 0;background-size: cover;}
.pabg40{width: 40%;height:100%;position: absolute;right: 0;top: 0;}
.pabgtop{width: 100%;height:50%;background: url(../images/p4-bg_02.jpg) no-repeat;position: absolute;left: 0;top: 0;background-size: cover;}
.pabgbottom{width: 100%;height:50%;position: absolute;left: 0;bottom: 0;}
.pabfbl{width: 50%;height:100%;background: url(../images/p4-bg_03.jpg) no-repeat;position: absolute;left: 0;bottom: 0;background-size: cover;}
.pabfbr{width: 50%;height:100%;background: url(../images/p4-bg_04.jpg) no-repeat;position: absolute;right: 0;bottom: 0;background-size: cover;}


.section5{background: url(../images/p5-bg.jpg) no-repeat center;background-size:cover; }
.section5 .page5_txt{width:571px;height: auto;padding-top:160px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s; }
.section5 h2{font-size: 35px;color:#00b0e6;line-height: 50px;}
.section5 h3{font-size: 20px;color:#333333;line-height: 50px;}
.section5 .baby{width: 910px;height: 855px;position: absolute;right:-337px;bottom: 0;background: url(../images/baby.png) center no-repeat;z-index: 356;}
.acoustic{-webkit-animation:acoustic 1s linear 0.5s infinite;animation:acoustic 1s linear 0.5s infinite ;width:912px;height: 164px;background: url(../images/acoustic.png) center no-repeat;background-size: cover;position: absolute;left: 50%;
    top: 50%;
    margin: -160px 0 0 -130px; }
.active .page5_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease 1s 0.5s;-webkit-transition: all ease 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}

.section6{background:#000 url(../images/p6-bg.jpg) no-repeat center;}
.section6 .video{width: 500px;height: 200px;position: absolute;left:164px;top: 49px;z-index:1;}
.video_r{width:800px;height: 600px;position: absolute;top: 50%;left: 50%;margin:-382px 0 0 -703px;background: url(../images/p6-1.png) center no-repeat;background-size:800px 600px;z-index: 2;}
.section6 .more{width: 110px;height: 25px;border: 1px solid #7c7e84;text-align: center;line-height: 25px;float: right;margin-top:30px;}
.section6 .more a{color: white;font-size: 18px;letter-spacing: 2px;}
.section6 .page6_txt{opacity:0;width:605px;height:auto;color: #fff;text-align: right;position: absolute;right:-60px; top:60%;margin-top:-207px;  -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s; }
.section6 .page6_txt span{font-size: 35px;}
.section6 .page6_txt h4{font-size: 35px;}
.section6 .page6_txt h5{font-size: 20px;margin:22px 0; }
.active .page6_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}


.section7{background: url(../images/p7-bg.jpg) no-repeat center;background-size:cover; }
.page7_txt{opacity:0;width: 753px;margin-left:auto;margin-right:auto;padding-top:140px;text-align: center;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;}
.page7_txt h2{font-size:35px;color: #333;    text-indent: 46px }
.page7_txt h3{font-size:20px;line-height: 72px;}
.active .page7_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}

.section8{background: url(../images/p8-bg.jpg) no-repeat center;background-size:cover; }
.page8_txt{width:1060px;height:auto;text-align: center;;margin-left:auto;margin-right:auto;padding-top:140px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;}
.page8_txt h2{font-size: 35px;color: #333;}
.page8_txt h3{font-size: 20px;line-height:60px;}
.active .page8_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}

.section9{background: url(../images/p9-bg.jpg) no-repeat center;background-size:cover; }
.page9_txt{width:1011px;height:auto;text-align: center;;margin-left:auto;margin-right:auto;padding-top:120px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;}
.page9_txt h2{font-size:35px;color: #333;}
.page9_txt h3{font-size: 20px;line-height:60px;}
.active .page9_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}

.section10{background: url(../images/p10-bg.jpg) no-repeat center;background-size:cover; }
.section10 .fw{width:100%;height: 210px;position: absolute;top: 50%;margin-top: -105px;}
.page10_txt{height:auto;width:719px;text-align: center;position: absolute;left: 225px;top:-230px;-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease 0.1s 1s;-webkit-transition: all ease 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;}
.page10_txt h2{font-size:35px;color: #333;}
.page10_txt h3{font-size: 20px;color: #333;line-height:60px;}
.active .page10_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s;}

.p10-l1{background: url(../images/p10-l1.png) no-repeat center;width:56px;height: 210px;position: absolute;left:372px;top: 44.8555%;-webkit-transform:translate3d(260px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(260px,0px,0px) scale3d(0,0,0); transform:translate3d(260px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;}
.p10-l2{background: url(../images/p10-l2.png) no-repeat center;width:87px;height: 263px;position: absolute;left:232px;top:39.8555%;-webkit-transform:translate3d(350px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(350px,0px,0px) scale3d(0,0,0); transform:translate3d(350px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.p10-l3{background: url(../images/p10-l3.png) no-repeat center;width:111px;height: 304px;position: absolute;left:73px;top: 36.8555%; -webkit-transform:translate3d(500px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(500px,0px,0px) scale3d(0,0,0); transform:translate3d(500px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;}
.p10-l4{background: url(../images/p10-l4.png) no-repeat center;width:161px;height: 353px;position: absolute;left:-130px;top: 32.8555%;-webkit-transform:translate3d(700px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(700px,0px,0px) scale3d(0,0,0); transform:translate3d(700px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.p10-l5{background: url(../images/p10-l5.png) no-repeat center;width:182px;height:454px;position: absolute;left:-360px;top: 28.8555%; -webkit-transform:translate3d(900px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(900px,0px,0px) scale3d(0,0,0); transform:translate3d(900px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;}

.p10-r1{background: url(../images/p10-r1.png) no-repeat center;width:56px;height: 210px;position: absolute;right:372px;top: 44.8555%;-webkit-transform:translate3d(-260px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(-260px,0px,0px) scale3d(0,0,0); transform:translate3d(-260px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.p10-r2{background: url(../images/p10-r2.png) no-repeat center;width:87px;height: 263px;position: absolute;right:232px;top:39.8555%;-webkit-transform:translate3d(-350px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(-350px,0px,0px) scale3d(0,0,0); transform:translate3d(-350px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.p10-r3{background: url(../images/p10-r3.png) no-repeat center;width:111px;height: 304px;position: absolute;right:73px;top: 36.8555%;-webkit-transform:translate3d(-500px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(-500px,0px,0px) scale3d(0,0,0); transform:translate3d(-500px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.p10-r4{background: url(../images/p10-r4.png) no-repeat center;width:161px;height: 353px;position: absolute;right:-130px;top: 32.8555%;-webkit-transform:translate3d(-700px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(-700px,0px,0px) scale3d(0,0,0); transform:translate3d(-700px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.p10-r5{background: url(../images/p10-r5.png) no-repeat center;width:182px;height:454px;position: absolute;right:-360px;top: 28.8555%; -webkit-transform:translate3d(-900px,0px,0px) scale3d(0,0,0);-moz-transform:translate3d(-900px,0px,0px) scale3d(0,0,0); transform:translate3d(-900px,0px,0px) scale3d(0,0,0);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;}

.active .p10-l1{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-l2{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-l3{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-l4{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-l5{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-r1{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-r2{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-r3{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-r4{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active .p10-r5{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);-moz-transform:translate3d(0,0,0) scale3d(1,1,1); transform:translate3d(0,0,0) scale3d(1,1,1);opacity:1;transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}

.container{width: 1200px;height:100%;margin:0 auto;position: relative; }

.section11{background: url(../images/p11-bg.jpg) no-repeat center;background-size:cover; }
.page11_txt{width:612px;height:auto;position:absolute;right:0;top:50%;margin-top:-145px;opacity: 0; -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s; }
.page11_txt h2{font-size:35px;color: #333;line-height: 100px;}
.page11_txt p{color: #333;font-size: 17px;}
.active .page11_txt{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s; }

.section_{background: url(../images/p12-bg.jpg) no-repeat center;background-size:cover;}
.section12 .ibton-bp{-webkit-transition: all ease-out 1.5s 0.5s; -moz-transition: all ease-out 1.5s 0.5s; -webkit-transform: scale(0.9);-moz-transform: scale(0.9); transform: scale(0.9);opacity:0;width: 1000px;height: 800px;position: absolute;left: 50%;top:50%;margin:-267px 0 0 -515px;background: url(../images/p12-ibotn.png) center no-repeat;background-size: cover;}
.section12 p{font-size: 28px;color: #333333;width:200px;height: 30px;}
.ibotn_1name{ -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;position: absolute;left:0;top: 50%;margin-top:-15px;z-index: 126;}
.ibotn_2name{ -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity:0;transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;position: absolute;right:0;top: 50%;margin-top:-15px;z-index: 125;}
.active .ibotn_1{opacity:1;-webkit-transform:scale(1, 1) translate(0);-moz-transform:scale(1, 1) translate(0); transform:scale(1,1) translate(0);transition: all ease-out 2s 2.5s;-webkit-transition: all ease-out 2s 2.5s; -moz-transition: all ease-out 2s 2.5s;}
.active .ibotn_2{opacity:1;-webkit-transform:scale(1, 1) translate(0);-moz-transform:scale(1, 1) translate(0); transform:scale(1,1) translate(0);transition: all ease-out 1.5s 1s;-webkit-transition: all ease-out 1.5s 1s; -moz-transition: all ease-out 1.5s 1s;}
.active .ibotn_1name{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s; }
.active .ibotn_2name{-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity:1;transition: all ease-out 1s 0.5s;-webkit-transition: all ease-out 1s 0.5s; -moz-transition: all ease-out 1s 0.5s; }
.active .ibton-bp{-webkit-transform: scale(1);-moz-transform: scale(1); transform: scale(1);opacity:1;transition: all ease-out 4s 1.5s;-webkit-transition: all ease-out 4s 1.5s; -moz-transition: all ease-out 4s 1.5s; }

/*概述动画*/
@keyframes page1_txt {
    from{
        -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity: 0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;
    }
    to{
        -webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity: 1;transition: all ease-out 1.5s 1s;-webkit-transition: all ease-out 1.5s 1s; -moz-transition: all ease-out 1.5s 1s;
    }
}
@-webkit-keyframes page1_txt {
    from{
        -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity: 0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;
    }
    to{
        -webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity: 1;transition: all ease-out 1.5s 1s;-webkit-transition: all ease-out 1.5s 1s; -moz-transition: all ease-out 1.5s 1s;
    }
}
@-moz-keyframes page1_txt {
    from{
        -webkit-transform:translate(0,100px);-moz-transform:translate(0,100px); transform:translate(0,100px);opacity: 0;transition: all ease-out 0.1s 1s;-webkit-transition: all ease-out 0.1s 1s; -moz-transition: all ease-out 0.1s 1s;
    }
    to{
        -webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);opacity: 1;transition: all ease-out 1.5s 1s;-webkit-transition: all ease-out 1.5s 1s; -moz-transition: all ease-out 1.5s 1s;
    }
}
@keyframes anim_p2 {
    from{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    to{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

}
@-webkit-keyframes anim_p2 {
    from{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    to{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

}
@-moz-keyframes anim_p2 {
    from{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    to{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

}
@keyframes anim_p3 {
    from{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes anim_p3 {
    from{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-moz-keyframes anim_p3 {
    from{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes anim_p4 {
    from{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes anim_p4 {
    from{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-moz-keyframes anim_p4 {
    from{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes anim_one {
   from{
        opacity:1;
        -webkit-transform: scale(1);transform: scale(1);
    }
   to{
        opacity: 0;
        -webkit-transform: scale(0);transform: scale(0);
    }
}
@-webkit-keyframes anim_one {
   from{
        opacity:1;
        -webkit-transform: scale(1);transform: scale(1);
    }
   to{
        opacity: 0;
        -webkit-transform: scale(0);transform: scale(0);
    }
}
@-moz-keyframes anim_one {
   from{
        opacity:1;
        -webkit-transform: scale(1);transform: scale(1);
    }
   to{
        opacity: 0;
        -webkit-transform: scale(0);transform: scale(0);
    }
}
@keyframes anim4_1 {
    from{
        -webkit-transform: scale(0.8);transform: scale(0.8);
    }
    50%{
        -webkit-transform: scale(1);transform: scale(1);
    }
    to{
        -webkit-transform: scale(0.8);transform: scale(0.8);
    }
}
@-webkit-keyframes anim4_1 {
    from{
        -webkit-transform: scale(0.8);transform: scale(0.8);
    }
    50%{
        -webkit-transform: scale(1);transform: scale(1);
    }
    to{
        -webkit-transform: scale(0.8);transform: scale(0.8);
    }
}
@-moz-keyframes anim4_1 {
    from{
        -webkit-transform: scale(0.8);transform: scale(0.8);
    }
    50%{
        -webkit-transform: scale(1);transform: scale(1);
    }
    to{
        -webkit-transform: scale(0.8);transform: scale(0.8);
    }
}
@keyframes acoustic {
    from{
        -webkit-transform: scaleX(0.8);transform: scaleX(0.8);
    }
    50%{
        -webkit-transform: scaleX(1);transform: scaleX(1);
    }
    to{
        -webkit-transform: scaleX(0.8);transform: scaleX(0.8);
    }
}
@-webkit-keyframes acoustic {
    from{
        -webkit-transform: scaleX(0.8);transform: scaleX(0.8);
    }
    50%{
        -webkit-transform: scaleX(1);transform: scaleX(1);
    }
    to{
        -webkit-transform: scaleX(0.8);transform: scaleX(0.8);
    }
}
@-moz-keyframes acoustic {
    from{
        -webkit-transform: scaleX(0.8);transform: scaleX(0.8);
    }
    50%{
        -webkit-transform: scaleX(1);transform: scaleX(1);
    }
    to{
        -webkit-transform: scaleX(0.8);transform: scaleX(0.8);
    }
}



/*技术*/
.te_section1{height: 926px;background: url(../images/js-p1-bg.jpg) no-repeat center;}
.te_section1 .rote_b{width:255px;height: 255px;position: absolute;left: 50%;top: 50%;margin:-144px 0 0 -287px;}
.txt-b{opacity:0;transition: all ease-out 1s 1.5s;-webkit-transition: all ease-out 1s 1.5s; -moz-transition: all ease-out 1s 1.5s;position: absolute;top: 13px;left: 137px;}
.rote_b .rote_re{opacity:0;width: 100%;height: 100%;position: relative;}
.rote_b .b1{background: url(../images/js-1.png) center no-repeat;background-size:255px 255px;width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.rote_b .b2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;width: 100%;height: 100%;background: url(../images/js-2.png) center no-repeat;background-size:255px 255px;position: absolute;left: 0;top: 0;z-index: 20;}
.rote_b .b3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;width: 100%;height: 100%;background: url(../images/js-3.png) center no-repeat;background-size:255px 255px;position: absolute;left: 0;top: 0;z-index: 50;}
.rote_b .b4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;width: 100%;height: 100%;background: url(../images/js-4.png) center no-repeat;background-size:255px 255px;position: absolute;left: 0;top: 0;z-index: 56;}
.active .rote_b .rote_re{opacity:1;transition: all ease-out 1s 2s;-webkit-transition: all ease-out 1s 2s; -moz-transition: all ease-out 1s 2s;}

.active .txt-b{opacity:1;transition: all ease-out 1s 3.5s;-webkit-transition: all ease-out 1s 3.5s; -moz-transition: all ease-out 1s 3.5s;}


.te_section1 .rote_M{width:255px;height: 255px;position: absolute;left: 50%;top: 50%;margin:-116px 0 0 84px;}
.txt-M{opacity:0;transition: all ease-out 1s 1.5s;-webkit-transition: all ease-out 1s 1.5s; -moz-transition: all ease-out 1s 1.5s;position: absolute;top: 14px;left: 140px;}
.rote_M .rote_re{opacity:0;width: 100%;height: 100%;position: relative;}
.rote_M .M1{background: url(../images/js-1.png) center no-repeat;background-size:255px 255px;width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.rote_M .M2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;width: 100%;height: 100%;background: url(../images/js-2.png) center no-repeat;background-size:255px 255px;position: absolute;left: 0;top: 0;z-index: 20;}
.rote_M .M3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;width: 100%;height: 100%;background: url(../images/js-3.png) center no-repeat;background-size:255px 255px;position: absolute;left: 0;top: 0;z-index: 50;}
.rote_M .M4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;width: 100%;height: 100%;background: url(../images/js-4.png) center no-repeat;background-size:255px 255px;position: absolute;left: 0;top: 0;z-index: 56;}
.active .txt-M{opacity:1;transition: all ease-out 1s 5s;-webkit-transition: all ease-out 1s 5s; -moz-transition: all ease-out 1s 5s;}
.active .rote_M .rote_re{opacity:1;transition: all ease-out 1s 4s;-webkit-transition: all ease-out 1s 4s; -moz-transition: all ease-out 1s 4s;}

.te_section1 .rote_xh{width:200px;height: 200px;position: absolute;left: 50%;top: 50%;margin:118px 0 0 -135px;}
.txt-xh{opacity:0;transition: all ease-out 1s 1.5s;-webkit-transition: all ease-out 1s 1.5s; -moz-transition: all ease-out 1s 1.5s;position: absolute;top: 9px;left: 107px;}
.rote_xh .rote_re{-webkit-animation:anim_xh 2s linear;animation:anim_xh 2s linear;width: 100%;height: 100%;position: relative;}
.rote_xh .xh1{background: url(../images/js-1.png) center no-repeat;background-size:200px 200px;width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.rote_xh .xh2{-webkit-animation:anim_p2 4s linear infinite;animation:anim_p2 4s linear infinite;width: 100%;height: 100%;background: url(../images/js-2.png) center no-repeat;background-size:200px 200px;position: absolute;left: 0;top: 0;z-index: 20;}
.rote_xh .xh3{-webkit-animation:anim_p3 10s linear infinite;animation:anim_p3 10s linear infinite;width: 100%;height: 100%;background: url(../images/js-3.png) center no-repeat;background-size:200px 200px;position: absolute;left: 0;top: 0;z-index: 50;}
.rote_xh .xh4{-webkit-animation:anim_p4 4s linear infinite;animation:anim_p4 4s linear infinite;width: 100%;height: 100%;background: url(../images/js-4.png) center no-repeat;background-size:200px 200px;position: absolute;left: 0;top: 0;z-index: 56;}
.active .txt-xh{opacity:1;transition: all ease-out 1s 2s;-webkit-transition: all ease-out 1s 2s; -moz-transition: all ease-out 1s 2s;}


.te_section1 .te_txt{width: 855px;height: auto;position: absolute;left:50%;top:20px;margin: 0 0 0 -427px;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s; }
.te_section1 .te_txt h2{font-size:35px;text-align: center; }
.te_section1 .te_txt p{font-size:17px;margin-top: 25px;}
.txt-b,.txt-M,.txt-xh{color: #005ae9;font-size: 20px;}
.te_section1 .lt{height: 926px;width:100%;background: url(../images/lt.png) 0 0 no-repeat;background-size: 5760px; -webkit-animation:lt_anim 1s 0.1s steps(3) infinite both;  animation:lt_anim 1s 0.1s steps(3) infinite both;   }
.active.te_section1 .te_txt{ opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}



.te_section2{height: 1886px;background: url(../images/js-p2-bg.jpg) bottom center no-repeat;}
.js_video{width:260px;height: 295px;position: absolute;left: 50%;top: 50%;margin:-870px 0 0 -474px;z-index: 1;}
.te_section2 .te_txt1{width: 472px;height:auto;position: absolute;right:0;top:300px;color: white;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;}
.te_section2 .te_txt1 h2,.te_txt2 h2{font-size:35px;}
.te_section2 .vdeo_txt{width: 800px;height: 600px;position: absolute;top: 50%;left: 50%;margin:-813px 0 0 -711px;background: url(../images/p6-1.png) center no-repeat;background-size:800px 600px;z-index: 2;}
.te_section2 .te_txt1 p, .te_txt2 p{font-size:17px;margin-top: 35px;}
.te_section2 .te_txt2{width: 582px;height:auto;position: absolute;left:0;top:63%;color: white;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;}
.te_section2 .sm_r{ ;width: 805px;height: 805px;background: url(../images/js-sm.png) center no-repeat;position: absolute;left:50%;top: 50%;margin: 90px 0 0 18px;}
.te_section2 .d_1{width: 40px;height: 47px;background: url(../images/js-d_1.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:492px 0 0 530px; transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;opacity: 0; }
.te_section2 .d_2{width: 72px;height: 61px;background: url(../images/js-d_2.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:373px 0 0 238px; transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;opacity: 0; }
.te_section2 .d_3{width: 46px;height: 40px;background: url(../images/js-d_3.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:570px 0 0 474px; transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;opacity: 0; }
.te_section2 .x_1{width: 0;height: 99px;background: url(../images/x1.png) no-repeat  right top; position: absolute;right: 50%;top: 50%;margin:412px -262px 0 0;transition: width ease 2s 1.8s;-webkit-transition: width 2s 1.8s; -moz-transition: width 2s 1.8s;opacity:0; }
.te_section2 .x_2{width:0;height:119px;background: url(../images/x2.png) no-repeat right top; position: absolute;right: 50%;top: 50%;margin:593px -499px 0 0 ; transition: width ease 2s 3s;-webkit-transition: width 2s 3s; -moz-transition: width 2s 3s;opacity:0; }
.te_section2 .sm_txt1{opacity:0;-webkit-transform:translate(0,20px);-moz-transform:translate(0,20px); transform:translate(0,20px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width:100px;height:auto;color: white;font-size:17px;position: absolute;left: 50%;top: 50%;margin:488px 0 0 -82px; text-align: right;}
.te_section2 .sm_txt2{opacity:0;-webkit-transform:translate(0,20px);-moz-transform:translate(0,20px); transform:translate(0,20px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width:190px;height:auto;color: white;font-size:17px;position: absolute;left: 50%;top: 50%;margin:653px 0 0 -173px; text-align: right;}
.active.te_section2 .te_txt1{ opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.te_section2 .te_txt2{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.te_section2 .sm_r{-webkit-animation:sm_anim 3s 0.1s linear infinite ;  animation:sm_anim 3s 0.1s linear  infinite;}
.active.te_section2 .d_1{opacity:1;transition: all ease-out 1.5s 0.5s;-webkit-transition: all ease-out 1.5s 0.5s; -moz-transition: all ease-out 1.5s 0.5s;}
.active.te_section2 .d_3{opacity:1;transition: all ease-out 1.5s 1.5s;-webkit-transition: all ease-out 1.5s 1.5s; -moz-transition: all ease-out 1.5s 1.5s;}
.active.te_section2 .d_2{opacity:1;transition: all ease-out 1.5s 2s;-webkit-transition: all ease-out 1.5s 2s; -moz-transition: all ease-out 1.5s 2s;}
.active.te_section2 .x_1{width: 270px;opacity: 1; }
.active.te_section2 .x_2{width: 482px;opacity: 1; }
.active.te_section2 .sm_txt1{opacity:1;-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);transition: all ease-out 1s 2s;-webkit-transition: all ease-out 1s 2s; -moz-transition: all ease-out 1s 2s; }
.active.te_section2 .sm_txt2{opacity:1;-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);transition: all ease-out 1s 3.5s;-webkit-transition: all ease-out 1s 3.5s; -moz-transition: all ease-out 1s 3.5s; }


.te_section3{height: 874px;background: url(../images/sj-p2-bg.jpg) center no-repeat;}
.te_section3 .scri{width: 997px;height: 512px;background: url(../images/scri.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-58px 0 0 -540px; }
.te_section3 .rote_blue{width: 233px;height: 233px;background: url(../images/rote.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:53px 0 0 -172px;z-index:9;  }
.te_section3 .anmi_bw{width: 984px;height: 141px;background: url(../images/anmi_.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:112px 0 0 -533px;}
.te_section3 .scri_h{width: 233px;height: 233px;background: url(../images/scri-h.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:50px 0 0 -168px;}
.te_section3 .te_txt{width: 714px;height: auto;position: absolute;left: 50%;top: 50%;margin:-327px 0 0 -357px;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;}
.te_section3 .te_txt h2{font-size:35px;text-align: center;}
.te_section3 .te_txt p{font-size:17px;text-align: center;margin-top:35px;}
.active.te_section3 .te_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.te_section3 .rote_blue{-webkit-animation:blue_anim 3s linear  infinite ;  animation:blue_anim 3s linear  infinite;}
.active.te_section3 .anmi_bw{-webkit-animation:bw_anim 5s linear  infinite ;  animation:bw_anim 5s linear  infinite;}

.te_section4{height: 877px;background:#f5f5f5;}
.te_section4 .ibotn_cd{opacity:0;-webkit-transform:translateX(-200px);-moz-transform:translateX(-200px); transform:translateX(-200px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 646px;height: 745px;background: url(../images/ibton-cd.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-370px 0 0 -740px;}
.te_section4 .ljx{width: 302px;height: 30px;background: url(../images/ljx.png) center no-repeat;background-size:302px;position: absolute;left: 50%;  top: 50%;margin:291px 0 0 -252px;}
.te_section4 .cd_wf{width: 541px;height: 295px;background: url(../images/ibton-wf.png) center no-repeat;position: absolute;left: 50%;  top: 50%;margin:135px 0 0 -139px;}
.te_section4 .wifi{width: 92px;height: 125px;background: url(../images/wifi.png) center no-repeat;position: absolute;left: 50%;  top: 50%;margin:105px 0 0 70px;}
.te_section4 .te_txt{ width: 470px;height: auto;position: absolute; left: 50%;  top: 50%;margin:-242px 0 0 -37px;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;}
.te_section4 .te_txt h2{font-size:35px;}
.te_section4 .te_txt p{font-size:17px;margin-top: 35px;}
.active.te_section4 .te_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.te_section4 .ibotn_cd{opacity:1;-webkit-transform:translate(0,0);-moz-transform:translate(0,0); transform:translate(0,0);transition: all ease-out 2s 1s;-webkit-transition: all ease-out 2s 1s; -moz-transition: all ease-out 2s 1s; }
.active.te_section4 .ljx{-webkit-animation:ljx_anim 2s infinite both  ;  animation:ljx_anim 2s  infinite both;}
.active.te_section4 .wifi{-webkit-animation:wifi_anim 2s infinite 2s  ;  animation:wifi_anim 2s  infinite 2s;}

.te_section5{height:1079px;background: url(../images/js-p4-bg.jpg) center no-repeat; }
.te_section5 .te_txt{width: 690px;height: auto;position: absolute;left: 50%;top: 50%;margin:-237px 0 0 -345px;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;}
.te_section5 .te_txt h2{font-size:35px;text-align: center;color: #ffffff;}
.te_section5 .te_txt p{font-size:17px;text-align: center;margin-top: 35px;color:#ffffff;}
.active.te_section5 .te_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}

.te_section6{height:875px;background:#fff; }
.te_section6 .te_txt{width: 714px;height:auto;color: #212121;text-align: center;position: absolute;left: 50%;top: 50%;margin:-323px 0 0 -357px;opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;}
.te_section6 .te_txt h2{font-size:35px;}
.te_section6 .te_txt p{font-size:17px;margin-top: 35px;}
.te_section6 .j1{opacity:0;-webkit-transform:translateX(240px);-moz-transform:translateX(240px); transform:translateX(240px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 82px;height: 276px;background: url(../images/j1.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:-32px 0 0 -655px;}
.te_section6 .j2{opacity:0;-webkit-transform:translateX(240px);-moz-transform:translateX(240px); transform:translateX(240px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 75px;height: 190px;background: url(../images/j2.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:11px 0 0 -487px;}
.te_section6 .j3{opacity:0;-webkit-transform:translateX(238px);-moz-transform:translateX(238px); transform:translateX(238px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 78px;height: 201px;background: url(../images/j3.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:4px 0 0 -328px;}
.te_section6 .j4{opacity:0;-webkit-transform:translateX(243px);-moz-transform:translateX(243px); transform:translateX(243px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 80px;height: 189px;background: url(../images/j4.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:11px 0 0 -167px;}
.te_section6 .j5{opacity:0;-webkit-transform:translateX(257px);-moz-transform:translateX(257px); transform:translateX(257px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 81px;height: 191px;background: url(../images/j5.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:10px 0 0 -5px;}
.te_section6 .j6{opacity:0;-webkit-transform:translateX(178px);-moz-transform:translateX(178px); transform:translateX(178px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 108px;height: 233px;background: url(../images/j6.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:-10px 0 0 160px;}
.te_section6 .j7{opacity:0;-webkit-transform:translateX(84px);-moz-transform:translateX(84px); transform:translateX(84px);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 65px;height: 236px;background: url(../images/j7.png) center no-repeat; position:absolute; left: 50%;top: 50%;margin:-14px 0 0 350px;}
.te_section6 .j8{transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 129px;height: 309px;background: url(../images/j8.png) center no-repeat; position:absolute; left: 50%;top: 50%; margin:-52px 0 0 500px;}
.active.te_section6 .te_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none; }
.active.te_section6 .j7{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 1s 1s;  -webkit-transition: all ease-out 1s 1s;   -moz-transition: all ease-out 1s 1s;}
.active.te_section6 .j6{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active.te_section6 .j5{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 1.1s 1s;-webkit-transition: all ease-out 1.1s 1s; -moz-transition: all ease-out 1.1s 1s;}
.active.te_section6 .j4{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 1.2s 1s;    -webkit-transition: all ease-out 1.2s 1s;     -moz-transition: all ease-out 1.2s 1s;}
.active.te_section6 .j3{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 1.3s 1s;-webkit-transition: all ease-out 1.3s 1s; -moz-transition: all ease-out 1.3s 1s;}
.active.te_section6 .j2{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all cubic-bezier(0.24, 0.32, 0.22, 0.51) 1.4s 1s;-webkit-transition: all cubic-bezier(0.24, 0.32, 0.22, 0.51) 1.4s 1s; -moz-transition: all cubic-bezier(0.24, 0.32, 0.22, 0.51) 1.4s 1s;}
.active.te_section6 .j1{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all cubic-bezier(0.24, 0.32, 0.22, 0.51) 1.5s 1s;-webkit-transition: all cubic-bezier(0.24, 0.32, 0.22, 0.51) 1.5s 1s; -moz-transition: all cubic-bezier(0.24, 0.32, 0.22, 0.51) 1.5s 1s;}

.te_section7{height: 874px;background: #ececec;}
.te_section7 .te_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 714px;height:auto;color: #212121;text-align: center;position: absolute;left: 50%;top: 50%;margin:-360px 0 0 -357px;}
.te_section7 .te_txt h2{font-size:35px;}
.te_section7 .te_txt p{font-size: 17px;margin-top: 35px;}
.te_section7 .dc_1{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 80px;height: 374px;background: url(../images/dc-1.png) center no-repeat; position:absolute; left: 50%;top: 50%; margin:-20px 0 0 -137px;}
.te_section7 .dc_2{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 32px;height: 374px;background: url(../images/dc-2.png) center no-repeat; position:absolute; left: 50%;top: 50%; margin:-20px 0 0 -73px;}
.te_section7 .dc_3{width: 163px;height: 365px;background: url(../images/dc-3.png) center no-repeat; position:absolute; left: 50%;top: 50%; margin:-20px 0 0 -81px;z-index: 188;}
.te_section7 .dc_4{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 75px;height: 368px;background: url(../images/dc-4.png) center no-repeat; position:absolute; left: 50%;top: 50%; margin:-20px 0 0 -2px;}
.te_section7 .dc_5{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0); transform:translateX(0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 144px;height: 375px;background: url(../images/dc-5.png) center no-repeat; position:absolute; left: 50%;top: 50%; margin:-20px 0 0 19px;}
.active.te_section7 .te_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.te_section7 .dc_1{opacity:1;-webkit-transform:translateX(-160px);-moz-transform:translateX(-160px); transform:translateX(-160px);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active.te_section7 .dc_2{opacity:1;-webkit-transform:translateX(-80px);-moz-transform:translateX(-80px); transform:translateX(-80px);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active.te_section7 .dc_4{opacity:1;-webkit-transform:translateX(95px);-moz-transform:translateX(95px); transform:translateX(95px);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active.te_section7 .dc_5{opacity:1;-webkit-transform:translateX(172px);-moz-transform:translateX(172px); transform:translateX(172px);transition: all ease-out 1s 1.5s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}

.te_section8{height: 1076px;background:url(../images/js-p8-bg.jpg) center no-repeat;}
.te_section8 .te_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s; width: 890px;height:auto;color: #fff;text-align: center;position: absolute;left: 50%;top: 50%;margin:-440px 0 0 -445px;}
.te_section8 .te_txt h2{font-size:35px;}
.te_section8 .te_txt p{font-size:17px;margin-top: 35px;}
.active.te_section8 .te_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}

@-webkit-keyframes lt_anim {
    from{background-position: 0 0;}
    to{ background-position:-5760px 0; }
}
@keyframes lt_anim {
    from{background-position: 0 0;}
    to{ background-position:-5760px 0; }
}
@-moz-keyframes lt_anim {
    from{background-position: 0 0;}
    to{ background-position:-5760px 0; }
}

@keyframes sm_anim {
    from{
    -webkit-transform:rotate(0deg) ;
        -moz-transform:rotate(0deg) ;
        -ms-transform:rotate(0deg) ;
        -o-transform:rotate(0deg) ;
        transform:rotate(0deg);
    }
  to{
    -webkit-transform:rotate(360deg) ;
        -moz-transform:rotate(360deg) ;
        -ms-transform:rotate(360deg) ;
        -o-transform:rotate(360deg) ;
        transform:rotate(360deg);
    }

}
@-webkit-keyframes sm_anim {
    from{
    -webkit-transform:rotate(0deg) ;
        -moz-transform:rotate(0deg) ;
        -ms-transform:rotate(0deg) ;
        -o-transform:rotate(0deg) ;
        transform:rotate(0deg);
    }
  to{
    -webkit-transform:rotate(360deg) ;
        -moz-transform:rotate(360deg) ;
        -ms-transform:rotate(360deg) ;
        -o-transform:rotate(360deg) ;
        transform:rotate(360deg);
    }

}
@-moz-keyframes sm_anim {
    from{
    -webkit-transform:rotate(0deg) ;
        -moz-transform:rotate(0deg) ;
        -ms-transform:rotate(0deg) ;
        -o-transform:rotate(0deg) ;
        transform:rotate(0deg);
    }
  to{
    -webkit-transform:rotate(360deg) ;
        -moz-transform:rotate(360deg) ;
        -ms-transform:rotate(360deg) ;
        -o-transform:rotate(360deg) ;
        transform:rotate(360deg);
    }

}

@keyframes blue_anim {
    from{
        -webkit-transform:rotate(0deg) ;
        transform:rotate(0deg);

    }
    to{
        -webkit-transform:rotate(360deg) ;
        transform:rotate(360deg);
    }

}
@-webkit-keyframes blue_anim {
    from{
        -webkit-transform:rotate(0deg) ;
        transform:rotate(0deg);

    }
    to{
        -webkit-transform:rotate(360deg) ;
        transform:rotate(360deg);
    }

}
@-moz-keyframes blue_anim {
    from{
        -webkit-transform:rotate(0deg) ;
        transform:rotate(0deg);

    }
    to{
        -webkit-transform:rotate(360deg) ;
        transform:rotate(360deg);
    }

}
@keyframes bw_anim {
    from{
        -webkit-transform:translateX(0) ;
        transform:translateX(0) ;

    }
    to{
        -webkit-transform:translateX(-500px) ;
        transform:translateX(-500px) ;

    }


}
@-webkit-keyframes bw_anim {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);

    }
    to {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);

    }
}
@-moz-keyframes bw_anim {
    from{
        -webkit-transform:translateX(0) ;
        transform:translateX(0) ;

    }
    to{
        -webkit-transform:translateX(-500px) ;
        transform:translateX(-500px) ;

    }


}
@keyframes ljx_anim {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 50px 0;
    }
}
@-moz-keyframes ljx_anim {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 50px 0;
    }
}
@-webkit-keyframes ljx_anim {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 50px 0;
    }
}

@keyframes wifi_anim {
    from{        -webkit-transform: translate(0,0);
        transform:translate(0,0);

    }
    to{
        -webkit-transform: translate(-20px,0);
        transform: translate(-20px,0);

    }

}
@-webkit-keyframes wifi_anim {
    from{        -webkit-transform: translate(0,0);
        transform:translate(0,0);

    }
    to{
        -webkit-transform: translate(-20px,0);
        transform: translate(-20px,0);

    }

}
@-moz-keyframes wifi_anim {
    from{        -webkit-transform: translate(0,0);
        transform:translate(0,0);

    }
    to{
        -webkit-transform: translate(-20px,0);
        transform: translate(-20px,0);

    }

}



@keyframes anim_xh{

    from{

        opacity: 0;

    }
}

@-webkit-keyframes anim_xh{

    from{

        opacity: 0;

    }
}
@-moz-keyframes anim_xh{

    from{

        opacity: 0;

    }
}


/*设计工艺*/
.de_section1{height: 1078px;background: #f0f0f0;}
.de_section1 .de_ibotn{width: 522px;height: 855px;position: absolute;left:0;top:113px;background: url(../images/de-p1-bg.png) center no-repeat;}
.de_section1 .de_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 500px;height: auto;position: absolute;right:0;top:323px;color: #212121;}
.de_section1 .de_txt h2{font-size: 35px;}
.de_section1 .de_txt p{font-size:17px;margin-top:30px;}
.active.de_section1 .de_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}

.de_txt{z-index: 222;}

.de_section2{height: 1080px;background: url(../images/de-p2-bg.jpg) center no-repeat;}
.de_section2 .de_j1{-webkit-transform:translate(0,0);transform:translate(0,0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 619px;height: 658px;background: url(../images/de-j1.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-205px 0 0 -739px;}
.de_section2 .de_j2{-webkit-transform:translate(0,0);transform:translate(0,0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 611px;height: 660px;background: url(../images/de-j2.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-205px 0 0 -739px;}
.de_section2 .de_j3{-webkit-transform:translate(0,0);transform:translate(0,0);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 909px;height: 1423px;background: url(../images/de-j3.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-634px 0 0 -935px;}
.de_section2 .de_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s; width: 565px;height: auto;position: absolute;right:0;top:407px;color: white;}
.de_section2 .de_txt h2{font-size:35px;}
.de_section2 .de_txt p{font-size:17px;margin-top:30px;}
.active.de_section2 .de_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;;}
.active.de_section2 .de_j1{opacity:1;-webkit-transform:translate(30px,1px);transform:translate(30px,1px);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active.de_section2 .de_j2{opacity:1;-webkit-transform:translate(161px,-125px);transform:translate(161px,-125px);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}
.active.de_section2 .de_j3{opacity:1;-webkit-transform:translate(586px,1px);transform:translate(586px,1px);transition: all ease-out 1s 1s;-webkit-transition: all ease-out 1s 1s; -moz-transition: all ease-out 1s 1s;}


.de_section3{height: 1082px;background: #fff;}
.de_section3 .de_structure{width: 542px;height: 941px;background: url(../images/de-ibotn-p3.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-420px 0 0 -595px;}
.de_section3 .de_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 489px;height: auto;position: absolute;right:0;top:460px;color: #212121;}
.de_section3 .de_txt h2{font-size:35px;}
.de_section3 .de_txt p{font-size:17px;margin-top:30px;}
.active.de_section3 .de_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}

.de_section4{height: 1080px;background: url(../images/de-p4-bg.jpg) center no-repeat;}
.de_section4 .de_k1{ width: 759px;height: 395px;background: url(../images/de-k1.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:44px 0 0 -614px;}
.de_section4 .de_k2{width: 1145px;height: 242px;background: url(../images/de-k2.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:44px 0 0 -616px;}
.de_section4 .de_k3{width: 502px;height: 180px;background: url(../images/de-k3.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:44px 0 0 -334px;}
.de_section4 .de_txt{opacity: 0;text-align:center;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 957px;height: auto;position: absolute;left: 50%;top: 50%;margin:-317px 0 0 -478px;color: white;}
.de_section4 .de_txt h2{font-size:35px;text-align:center;}
.de_section4 .de_txt p{font-size:17px;margin-top:30px;}
.active.de_section4 .de_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.de_section4 .de_k1{-webkit-animation:dek1_anim 15s linear infinite;animation:dek1_anim 15s linear infinite;}
.active.de_section4 .de_k2{-webkit-animation:dek2_anim 10s linear infinite;animation:dek2_anim 10s linear infinite;}
.active.de_section4 .de_k3{-webkit-animation:dek3_anim 12s linear infinite;animation:dek3_anim 12s linear infinite;}

.de_section5{height: 1082px;background: #fff;}
.de_section5 .de_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 543px;height: auto;position: absolute;left:0;top:400px;color: #212121;}
.de_section5 .de_txt h2{font-size:35px;}
.de_section5 .de_txt p{font-size:17px;margin-top:30px;}
.de_section5 .de_ibotn5{opacity:0;-webkit-transform:scale(0.95);transform:scale(0.95);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 866px;height: 916px;background: url(../images/de-p5.png) center no-repeat;position: absolute;left:50%;top: 50%;margin:-369px 0 0  47px;}
.active.de_section5 .de_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.de_section5 .de_ibotn5{opacity:1;-webkit-transform:scale(1);transform:scale(1);transition: all ease-out 7s 1s;-webkit-transition: all ease-out 7s 1s;}

.de_section6{height: 1080px;background: url(../images/de-p6-bg.jpg) center no-repeat;}
.de_section6 .de_ibotn6{opacity:0;-webkit-transform:scale(0.99);transform:scale(0.99);transition: all ease-out 0.1s 1.5s;-webkit-transition: all ease-out 0.1s 1.5s; -moz-transition: all ease-out 0.1s 1.5s;width: 1235px;height: 100%;background: url(../images/de-p6.png) center no-repeat;position: absolute;  top:50%;left: 50%;margin:-540px 0 0 -955px;}
.de_section6 .de_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 489px;height: auto;position: absolute;right:0px;top: 253px;color: #fff;}
.de_section6 .de_txt h2{font-size:35px;}
.de_section6 .de_txt p{font-size:17px;margin-top:30px;}
.active.de_section6 .de_txt{ opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}
.active.de_section6 .de_ibotn6{opacity:1;-webkit-transform:scale(1);transform:scale(1);transition: all ease-out 5s 1s;-webkit-transition: all ease-out 5s 1s;}

.de_section7{height: 1082px;background: #fff;}
.de_section7 .de_ibotn7{width:1920px;height: 706px;background: url(../images/de-p7.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-165px 0 0 -968px;}
.de_section7 .de_txt{opacity: 0;-webkit-transform: translateY(50px);-ms-transform: translateY(50px); transform: translateY(50px);  -webkit-transition: -webkit-transform 1s,opacity 1s;  transition: transform 1s,opacity 1s;width: 848px;height: auto;position: absolute;left: 50%;top: 50%;margin:-403px 0 0 -424px;color: #212121;text-align: center;}
.de_section7 .de_txt h2{font-size:35px;}
.de_section7 .de_txt p{font-size:17px;margin-top:30px;}
.active.de_section7 .de_txt{opacity: 1;  -webkit-transform: none; -ms-transform: none;transform: none;}


@keyframes dek1_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-100px,50px);
        transform: translate(-100px,50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}
@-webkit-keyframes dek1_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-100px,50px);
        transform: translate(-100px,50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}
@-moz-keyframes dek1_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(100px,50px);
        transform: translate(100px,50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}

@keyframes dek2_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(100px,50px);
        transform: translate(100px,50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}
@-webkit-keyframes dek2_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(100px,50px);
        transform: translate(100px,50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}
@-moz-keyframes dek2_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(100px,50px);
        transform: translate(100px,50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}

@keyframes dek3_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-100px,-50px);
        transform: translate(-100px,-50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}
@-webkit-keyframes dek3_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-100px,-50px);
        transform: translate(-100px,-50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}
@-moz-keyframes dek3_anim {
    from{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    50%{
        -webkit-transform: translate(-100px,-50px);
        transform: translate(-100px,-50px);
    }
    to{
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

}

/* UI */
.ui_section1{height:925px;background: url(../images/ui-p1-bg.jpg) center no-repeat;background-size: cover;}
.ui_section1 .ui_txt{width: 512px;height: auto;position: absolute;right:0;top:170px ;color: #212121;}
.ui_section1 .ui_txt h2{font-size:35px;}
.ui_section1 .ui_txt p{font-size:17px;margin-top:30px;}

.ui_section2{height:620px;background: url(../images/ui-p2-bg.jpg) center no-repeat;}
.ui_section2 .ui_txt{width: 461px;height: auto;position: absolute;left:30px;top:150px;color: #212121;}
.ui_section2 .ui_txt h2{font-size:35px;}
.ui_section2 .ui_txt p{font-size:17px;margin-top:30px;}

.ui_section3{height:618px;background: url(../images/ui-p3-bg.jpg) center no-repeat;}
.ui_section3 .ui_txt{width: 428px;height: auto;position: absolute;right:0px;top:115px ;color: #212121;}
.ui_section3 .ui_txt h2{font-size:35px;}
.ui_section3 .ui_txt p{font-size:17px;margin-top:30px;}

.ui_section4{height:620px;background: url(../images/ui-p4-bg.jpg) center no-repeat;}
.ui_section4 .ui_txt{width: 1124px;height: auto;margin:33px auto;color: #212121;text-align: center;}
.ui_section4 .ui_txt h2{font-size:35px;text-align: center;}
.ui_section4 .ui_txt p{font-size:17px;margin-top:22px;}

.ui_section5{height:620px;background: url(../images/ui-p5-bg.jpg) center no-repeat;}
.ui_section5 .ui_txt{width: 441px;height: auto;position: absolute;right:0px;top:223px;color: #212121;}
.ui_section5 .ui_txt h2{font-size:35px;}
.ui_section5 .ui_txt p{font-size:17px;margin-top:30px;}

.ui_section6{height:620px;background: url(../images/ui-p6-bg.jpg) center no-repeat;}
.ui_section6 .ui_txt{width: 800px;height: auto;position: absolute;left: 50%;top: 50%;margin:-242px 0 0 -400px;color: #212121;text-align: center;}
.ui_section6 .ui_txt h2{font-size:35px;text-align: center;}
.ui_section6 .ui_txt p{font-size:17px;margin-top:30px;}


.ui_section7{height:620px;background: #fff;}
.ui_section7 .ui-phone{width:228px;height:357px;background: url(../images/ui-p7.png) center no-repeat;position: absolute;left: 50%;top: 50%;margin:-171px 0 0 -465px; }
.ui_section7 .ui_txt{width: 555px;height: auto;position: absolute;right: 0;top: 50%;margin:-117px 0 0 0;color: #212121;}
.ui_section7 .ui_txt h2{font-size: 35px;}
.ui_section7 .ui_txt p{font-size:17px;margin-top:30px;}


/*参数*/
.pa_section1{height: 950px;background: #f9f9f9 url(../images/pa_1.png) center no-repeat;margin-top: 52px;}
.pa_section{width: 966px;height: auto;margin:0 auto;}
.pa_section2{height: auto;}
.detailed{height: auto;width: 100%;border-bottom: 1px solid #e1e1e1;clear: both;}
.detailed p{font-size: 24px;color: #595757;float: left;width: 204px;margin-top: 70px;}
.detailed ul{font-size: 17px;color: #898989;float: left;margin: 35px 0;letter-spacing: 1px;}
.detailed li{line-height: 60px;}
