<style type="text/css">
body {font-family:Arial, Helvetica, sans-serif,"Microsoft YaHei";color:#fff;background-color:#3b49a2;margin:0;padding: 0;}
html{font-size: 16px;height: 100%;min-width: 320px;overflow-x: hidden;}
a:active,a:hover{outline:1;}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}img{vertical-align:middle;border:0}
body, h1, h2, h3, h4, h5, h6, ul, ol, li, i, form, input, p, div, span, img, a, label, select, dl, dt, dd {margin: 0;padding: 0;}
ul,ol,li{list-style:none;}
a{text-decoration:none;color:#393939;}
.clear{clear:both;}
.more{float:right;background: url(more.png) no-repeat;width:52px;height:28px;font-size: 14px;text-align: center;line-height: 31px;margin-right: 365px;margin-top: -45px;}
.more a{color:#3b49a2;}

/*通用头部*/
.header2_top{height:29px;border-bottom:1px #dddddd solid;margin:0px;padding:0px;font-size:12px;background:#f0f0f0;position: relative;
    z-index: 1000;}
.header2_top_main{width:980px;height:29px;margin:0 auto;font-size: 12px;}
.header2_top_main .nhhy{ling-height:23px;}
.header2_top_main_index{width:65px;height:29px;background:url("/img/video_fz.jpg") 3px center no-repeat;float:left;color:red;line-height:29px;padding-left:25px;color:red;}
.header2_top_main_index:hover{color:red;}
.header2_top_main_name{height:29px;line-height:29px;float:left;background:url("/img/phone.gif") 0 center no-repeat;padding-left:10px;font-family:"΢ź";color:red;margin:0 20px 0 17px;}
.header2_top_main_name:hover{color:red;}
.header2_top_main p{color:#676767;height:29px;line-height: 30px;_line-height: 29px;float:left;}
.header2_top_main span{width:56px;height:16px;display:block;float:right;margin:6px 13px 0 0;}
.header2_top_main span a{display:block;width:28px;height:16px;float:right;color:#2b2b2b;text-align:center;line-height:16px;}
.header2_top_main span a:hover{background:#cf0015;color:#fff;line-height:16px;}
.dlxg{float:right;width:400px;overflow:hidden;}
.login_before{width:400px;margin-top:3px;overflow:hidden;}
.login_before .text{width:96px;hegiht:18px;bordeR:1px solid #ccc;}
.login_before .btn{width:33px;font-size:12px;padding:1px;padding-top:0;color: #000;}
.login_before label{margin-left:5px;color:#676767;}
.con_login_name{width:380px;line-height:23px;text-align:right;padding-right:20px;color:#676767;}
.con_login_name a {color:#333;}
.con_login_name .logout{color:#C90000;}

/*通用底部*/
.footer{width:1200px;height:206px;margin:0 auto;border-top: 1px dotted #fff;margin-top: 80px;}
.footer_top{width:1000px;height:38px;color:#3c3c3c;border-top:1px #5c5c5c solid;border-bottom:1px #5c5c5c solid;line-height:38px;}
.footer_top a{margin:0 .5em;color:#1B0000;}
.footer_main{width:1200px;height:166px;}
.footer_left{width:63px;height:166px;background:url("/img/web_nn1.jpg") 0 no-repeat;float:left;}
.footer_right{width:59px;height:166px;background:url("/img/web_nn2.jpg") 0 no-repeat;float:right;}
.footer_center{width:600px;height:136px;margin:0 auto;text-align:center;padding-top:30px;}
.footer_center span{display:block;height: 0;}
.footer_center span a{margin:0 5px;color:#fff;}
.footer_center p{margin-bottom:3px;font-size:12px;line-height:12px;color:#fff;}
.footer_center p a{color:#fff;}

/*头部*/
.headerWrapper {height: 982px;background: url(head1.jpg) no-repeat top center;position:relative;}
.star {display: block;margin-left: 520px;margin-top: 53px;width: 28px;height: 33px;background: url(star.png) no-repeat;-webkit-animation: heartbeat 2000ms linear infinite;-moz-animation: heartbeat 2000ms linear infinite;-o-animation: heartbeat 2000ms linear infinite;animation: heartbeat 2000ms linear infinite;}
/*星星的放大缩小动画*/
lesshat-selector {-lh-property: 0;}
 @-webkit-keyframes heartbeat {
    0% {-webkit-transform: scale(1)}
   20% {-webkit-transform: scale(1)}
   25% {-webkit-transform: scale(1.5)}
   30% {-webkit-transform: scale(1)}
   35% {-webkit-transform: scale(1.3)}
   40% {-webkit-transform: scale(1)}
  100% {-webkit-transform: scale(1)}
}

@-moz-keyframes heartbeat {
    0% {-moz-transform: scale(1)}
   20% {-moz-transform: scale(1)}
   25% {-moz-transform: scale(1.5)}
   30% {-moz-transform: scale(1)}
   35% {-moz-transform: scale(1.3)}
   40% {-moz-transform: scale(1)}
  100% {-moz-transform: scale(1)}
}

@-o-keyframes heartbeat {
    0% {-o-transform: scale(1)}
   20% {-o-transform: scale(1)}
   25% {-o-transform: scale(1.5)}
   30% {-o-transform: scale(1)}
   35% {-o-transform: scale(1.3)}
   40% {-o-transform: scale(1)}
   100% {-o-transform: scale(1)}
}

@keyframes heartbeat {
    0% {-webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
       }
   20% {-webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
       }
   25% {-webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        transform: scale(1.5);
       }
   30% {-webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
       }
   35% {-webkit-transform: scale(1.3);
        -moz-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
       }
   40% {-webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
       }
  100% {-webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
       }
}  

/*气泡背景图的集合*/
.bubble{width:1920px;position:absolute;top:0;left:50%;margin-left:-960px;}
.ball {position: absolute;width: 1920px;height: 800px;top: 0;left: 0;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
    -webkit-perspective-origin: 50% 510px;
    -moz-perspective-origin: 50% 510px;
    perspective-origin: 50% 510px;}
.ball .ball {position: absolute;-webkit-transition-duration: 6000ms;-moz-transition-duration: 6000ms;-o-transition-duration: 6000ms;transition-duration: 6000ms;}
.ball .ball .ball-content {width: 100%;height: 100%;background: url(bubble1.png) no-repeat;}
.ball .ball-half1 {width: 259px;height: 259px;top: -150px;left: 241px;}
.ball .ball-half1 .ball-content {background-position: -5px 0;}
.ball .ball-half2 {width: 44px;height: 44px;top: -11px;left: 1618px;}
.ball .ball-half2 .ball-content {background-position: -202px -316px;}
.ball .ball-half3 {width: 47px;height: 47px;top: -5px;left: 795px;}
.ball .ball-half3 .ball-content {background-position: -200px -264px;}
.ball .ball-1 {width: 67px;height: 67px;top: 373px;left: 327px;}
.ball .ball-1 .ball-content {background-position: -110px -947px;}
.ball .ball-2 {width: 200px;height: 200px;top: 319px;left: 505px;}
.ball .ball-2 .ball-content {background-position: 5px -670px;}
.ball .ball-3 {width: 59px;height: 59px;top: 235px;left: 146px;}
.ball .ball-3 .ball-content {background-position: 0px -988px;}
.ball .ball-4 {width: 32px;height: 32px;top: 102px;left: 1502px;}
.ball .ball-4 .ball-content {background-position: -204px -365px;}
.ball .ball-5 {width: 32px;height: 32px;top: 535px;left: 552px;}
.ball .ball-5 .ball-content {background-position: -204px -402px;}
.ball .ball-6 {width: 64px;height: 64px;top: 339px;left: 1192px;}
.ball .ball-6 .ball-content {background-position: -184px -947px;}
.ball .ball-7 {width: 198px;height: 198px;top: 137px;left: 1702px;}
.ball .ball-7 .ball-content {background-position: -5px -467px;}
.ball .ball-8 {width: 59px;height: 59px;top: 798px;left: 1705px;}
.ball .ball-8 .ball-content {background-position: -186px -1016px;}
.ball .ball-9 {width: 69px;height: 69px;top: 271px;left: 1590px;}
.ball .ball-9 .ball-content {background-position: -184px -873px;}
.ball .ball-10 {width: 69px;height: 69px;top: 537px;left: 1309px;}
.ball .ball-10 .ball-content {background-position: -110px -873px;}
.ball .ball-11 {width: 106px;height: 108px;top: 388px;left: 1537px;}
.ball .ball-11 .ball-content {background-position: 0px -873px;}
.ball .ball-12 {width: 198px;height: 198px;top: 450px;left: 112px;}
.ball .ball-12 .ball-content {background-position: -5px -464px;}

.front-item-wrapper {position: absolute;width: 1920px;height: 800px;top: 0;left: 0;-webkit-perspective: 1000px;-moz-perspective: 1000px;perspective: 1000px;-webkit-perspective-origin: 50% 510px;-moz-perspective-origin: 50% 510px;perspective-origin: 50% 510px;}
.front-item-wrapper .ball {position: absolute;-webkit-transition-duration: 6000ms;-moz-transition-duration: 6000ms;-o-transition-duration: 6000ms;transition-duration: 6000ms;}
.front-item-wrapper .ball .ball-content {width: 100%;height: 100%;background: url(bubble2.png) no-repeat;}
.front-item-wrapper .ball-1 {width: 30px;height: 30px;top: 229px;left: 1411px;}
.front-item-wrapper .ball-1 .ball-content {background-position: -112px -166px;}
.front-item-wrapper .ball-2 {width: 104px;height: 103px;top: 98px;left: 418px;}
.front-item-wrapper .ball-2 .ball-content {background-position: -2px -160px;}
.front-item-wrapper .ball-3 {width: 177px;height: 156px;top: -50px;left: 1180px;}
.front-item-wrapper .ball-3 .ball-content {background-position: -3px 0;}
.front-item-wrapper .ball-4 {width: 100px;height: 97px;top: 156px;left: 600px;}
.front-item-wrapper .ball-4 .ball-content {background-position: -115px -95px;}
.front-item-wrapper .item {position: absolute;}
.front-item-wrapper .item .item-content {width: 100%;height: 100%;background-repeat: no-repeat;}
.front-item-wrapper .item-1 {width: 264px;height: 225px;top: 50px;left: 500px;}
.front-item-wrapper .item-1 .item-content {background-image: url(left1.png);}
.front-item-wrapper .item-2 {width: 257px;height: 217px;top: 120px;left: 1265px;}
.front-item-wrapper .item-2 .item-content {background-image: url(right1.png);}
.front-item-wrapper .item-3 {width: 248px;height: 217px;top: 192px;left: 300px;}
.front-item-wrapper .item-3 .item-content {background-image: url(left2.png);}
.front-item-wrapper .item-4 {width: 292px;height: 252px;top: 480px;left: 1165px;}
.front-item-wrapper .item-4 .item-content {background-image: url(right2.png);}
.front-item-wrapper .item-5 {width: 301px;height: 227px;top: 392px;left: 400px;}
.front-item-wrapper .item-5 .item-content {background-image: url(left3.png);}

/*创客*/
/*.maker{position:relative;z-index:5;float:left;margin-top: 115px;margin-left: 282px;-webkit-animation:bobble 1.5s infinite;-moz-animation:bobble 1.5s infinite;-o-animation:bobble 1.5s infinite;animation: bobble 1.5s infinite;}*/
.maker img{width:737px;height:538px;}
.maker{float:left;margin-top: 123px;margin-left: 235px;}
@-webkit-keyframes bobble {
    0% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
    50% {
        transform: translate3d(50px, 50px, 0px);
        animation-timing-function: ease-out;
    }
    100% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
}
@-moz-keyframes bobble {
    0% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
    50% {
        transform: translate3d(50px, 50px, 0px);
        animation-timing-function: ease-out;
    }
    100% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
}
@-o-keyframes bobble {
    0% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
    50% {
        transform: translate3d(50px, 50px, 0px);
        animation-timing-function: ease-out;
    }
    100% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
}
@keyframes bobble {
    0% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
    50% {
        transform: translate3d(50px, 50px, 0px);
        animation-timing-function: ease-out;
    }
    100% {
        transform: translate3d(50px, 40px, 0px);
        animation-timing-function: ease-in;
    }
}
h1{text-indent: -9999em;font-weight: normal;}
.container{height:6518px;background: url(bg.jpg) repeat top center;}
.midle{width:1200px;margin:0 auto;}


/*创客动态*/
.ckdt{padding-top:60px;height:612px;}
.ckdt .robot{text-align: center;}

.slideshow {float: left;position: relative;z-index: 1;height: 388px;width: 478px;margin-top: 60px;}
.slideshow * {outline: none;}
.slideshow .slider-track {-webkit-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);-ms-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);}
.slideshow .item {height: 100%;position: relative;z-index: 1;}
.slideshow .item img {width: 100%;-webkit-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);-ms-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);-webkit-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2);}
.slideshow .item.slick-active img {-webkit-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);-moz-transform: scale(1);transform: scale(1);}
.slideshow .item .txt{text-align: center;overflow:hidden;margin-top:10px;}
.slideshow .item a{color:#fff;font-size:18px;}

.newslist{float:right;width: 680px;margin-top: 20px;}
.newslist .list{margin-top:40px;}
.newslist .list1{width:600px;float: right;}
.newslist .list2{width:600px;float: left;}
.newslist .list h2{font-size:20px;height: 24px;overflow: hidden;}
.newslist .list h2 a{color:#fff;}
.newslist .list p{text-indent:2em;font-size:16px;line-height: 22px;margin-top: 18px;height: 45px;overflow: hidden;}
.newslist .list p a{color:#fff;font-size:16px;}

/*创客故事*/
.ckgs{padding-top:60px;}
.robot,.ckgs .robot{text-align: center;}
.story{margin-top: 60px;}
.story .first img{position:relative;z-index:1;float:left;}
.story .first a{display:block;float:left;position:absolute;z-index:2;background: url(xq.png) no-repeat;width:108px;height:52px;font-size: 16px;text-align: center;line-height: 52px;color:#3c4fa7;margin-top: 266px;margin-left: 478px}
.story .first a:hover{display:block;float:left;position:absolute;z-index:2;background: url(xq.png) no-repeat;width:108px;height:52px;font-size: 16px;text-align: center;line-height: 52px;color:#3c4fa7;margin-top: 266px;margin-left: 478px;animation:swing 1.5s ease 0s both;-ms-animation:swing 1.5s ease 0s both; 
  -moz-animation:swing 1.5s ease 0s both; 
  -webkit-animation:swing 1.5s ease 0s both; 
  -o-animation:swing 1.5s ease 0s both;}
.story .second img{position:relative;z-index:1;float:left;}
.story .second a{display:block;float:right;position:absolute;z-index:2;background: url(xq.png) no-repeat;width:108px;height:52px;font-size: 16px;text-align: center;line-height: 52px;color:#3c4fa7;margin-top: 414px;margin-left: 593px;}
.story .second a:hover{display:block;float:right;position:absolute;z-index:2;background: url(xq.png) no-repeat;width:108px;height:52px;font-size: 16px;text-align: center;line-height: 52px;color:#3c4fa7;margin-top: 414px;margin-left: 593px;animation:swing 1.5s ease 0s both;-ms-animation:swing 1.5s ease 0s both; 
  -moz-animation:swing 1.5s ease 0s both; 
  -webkit-animation:swing 1.5s ease 0s both; 
  -o-animation:swing 1.5s ease 0s both;}
.story .third img{position:relative;z-index:1;float:left;margin-left: 3px;}
.story .third a{display:block;float:left;position:absolute;z-index:2;background: url(xq.png) no-repeat;width:108px;height:52px;font-size: 16px;text-align: center;line-height: 52px;color:#3c4fa7;margin-top: 382px;margin-left: 727px;}
.story .third a:hover{display:block;float:left;position:absolute;z-index:2;background: url(xq.png) no-repeat;width:108px;height:52px;font-size: 16px;text-align: center;line-height: 52px;color:#3c4fa7;margin-top: 382px;margin-left: 727px;animation:swing 1.5s ease 0s both;-ms-animation:swing 1.5s ease 0s both; 
  -moz-animation:swing 1.5s ease 0s both; 
  -webkit-animation:swing 1.5s ease 0s both; 
  -o-animation:swing 1.5s ease 0s both;}

.xlbd{margin-top: 60px;}
.xlbd h3{font-weight:normal;font-size:18px;color: #fff;}
.xlbd .video{position: relative;margin-top:20px;float:left;margin-right: 58px;}
.xlbd .video-right{position: relative;margin-top:20px;float:right;}
.xlbd .video,.xlbd .video-right{width:256px;height:183px;}
.xlbd .video a{display:block; position:relative;}
.xlbd .video a:before{content: ""; display:block; position:absolute; background: rgba(0,0,0,0.2); transition: all 0.3s linear;width:256px; height:183px; }
.xlbd .video a:hover:before {background: none;}
.xlbd .video-right a{display:block; position:relative;}
.xlbd .video-right a:before{content: ""; display:block; position:absolute; background: rgba(0,0,0,0.2); transition: all 0.3s linear;width:256px; height:183px; }
.xlbd .video-right a:hover:before {background: none;}
.xlbd .play{position:absolute;width:60px;height:60px;top:50%;left:50%;background:url(play.png) no-repeat center;margin-left:-30px;margin-top:-30px;z-index: 10;}

/*VR看双创*/
.vr{padding-top:60px;}
#vrFrame{margin-top: 60px;}

/*VR看双创*/

.zcjd img{text-align:center;margin-top: 60px;}

/*h5微观*/
.h5{padding-top:60px;}
.show{margin-top: 60px;}
.show .phone{float:left;margin-right: 109px;}
.show .phone-right{float:right;}

/*创客风采*/
.photo{padding-top:60px;}
.photo ul{margin-top:60px;}
.photo li{display:inline-block;}
.photo .left{margin-right:23px;}
.photo .left-s{width:237px;height:200px;}
.photo .left-m{width:376px;height:200px;}
.photo .left-d{margin-top:30px;}
.photo .right{float:right;}
.photo .right-b{width:532px;height:429px;}

.box{ position: relative;-webkit-perspective: 1000px;-moz-perspective: 1000px;-o-perspective: 1000px;-moz-perspective: 1000px;-ms-perspective: 1000px;}
.box .box-img{-webkit-transform: rotateY(0);-moz-transform: rotateY(0);-o-transform: rotateY(0);transform: rotateY(0);-ms-transform: rotateY(0);-webkit-transition: all 0.50s ease-in-out 0s;-moz-transition: all 0.50s ease-in-out 0s;-o-transition: all 0.50s ease-in-out 0s;-ms-transition: all 0.50s ease-in-out 0s;transition: all 0.50s ease-in-out 0s;}
.box:hover .box-img{-webkit-transform: rotateY(-90deg);-moz-transform: rotateY(-90deg);-o-transform: rotateY(-90deg);-ms-transform: rotateY(-90deg);transform: rotateY(-90deg);}
.box .box-img img{width: 100%;height: auto;}
.box .box-content{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    background: rgba(84, 35, 230, 0.5);
    transform: rotateY(90deg);-webkit-transform: rotateY(90deg);-moz-transform: rotateY(90deg);-o-transform: rotateY(90deg);-ms-transform: rotateY(90deg);
    transition: all 0.50s ease-in-out 0s;-webkit-transition: all 0.50s ease-in-out 0s;-moz-transition: all 0.50s ease-in-out 0s;-o-transition: all 0.50s ease-in-out 0s;-ms-transition: all 0.50s ease-in-out 0s;}
.box:hover .box-content{transform: rotateY(0);-webkit-transform: rotateY(0);-moz-transform: rotateY(0);-o-transform: rotateY(0);-ms-transform: rotateY(0);}
.box .title{font-size: 18px; line-height: 20px; color: #fff;font-weight: normal;padding: 20px 20px;height: 20px;overflow: hidden;margin-top: 58px;}
.box .title a{color:#fff;}
.box .title:after,{content: "";width: 80%;display: block;margin: 15px auto;}



</style>