.icon-arms1{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1120px -688px;
   background-size: 1275px 1266px;
   width: 90px;
   height: 89px;
}
.icon-arms2{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1060px -1031px;
   background-size: 1275px 1266px;
   width: 90px;
   height: 89px;
}
.icon-arms3{
   display:inline-block;
   background: url('../img/icon.png') no-repeat 0px -1177px;
   background-size: 1275px 1266px;
   width: 90px;
   height: 89px;
}
.icon-arms4{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -840px -1031px;
   background-size: 1275px 1266px;
   width: 90px;
   height: 89px;
}
.icon-arms5{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -950px -1031px;
   background-size: 1275px 1266px;
   width: 90px;
   height: 89px;
}
.icon-arms_list1{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -691px -940px;
   background-size: 1275px 1266px;
   width: 154px;
   height: 46px;
}
.icon-arms_list2{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -943px -834px;
   background-size: 1275px 1266px;
   width: 154px;
   height: 46px;
}
.icon-arrow_left{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1160px -218px;
   background-size: 1275px 1266px;
   width: 48px;
   height: 61px;
}
.icon-arrow_right{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1160px -299px;
   background-size: 1275px 1266px;
   width: 48px;
   height: 61px;
}
.icon-close{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1160px -380px;
   background-size: 1275px 1266px;
   width: 50px;
   height: 51px;
}
.icon-down{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1230px -389px;
   background-size: 1275px 1266px;
   width: 43px;
   height: 43px;
}
.icon-gw{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1230px -452px;
   background-size: 1275px 1266px;
   width: 43px;
   height: 43px;
}
.icon-left_sm{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1230px 0px;
   background-size: 1275px 1266px;
   width: 45px;
   height: 369px;
}
.icon-left_text{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -344px -940px;
   background-size: 1275px 1266px;
   width: 327px;
   height: 70px;
}
.icon-list1_text{
   display:inline-block;
   background: url('../img/icon.png') no-repeat 0px -940px;
   background-size: 1275px 1266px;
   width: 324px;
   height: 71px;
}
.icon-list2_focus{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -873px -1177px;
   background-size: 1275px 1266px;
   width: 78px;
   height: 79px;
}
.icon-list2_nav{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -971px -1177px;
   background-size: 1275px 1266px;
   width: 78px;
   height: 79px;
}
.icon-list3_list{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -943px -218px;
   background-size: 1275px 1266px;
   width: 197px;
   height: 215px;
}
.icon-list3_list_hover{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -943px -453px;
   background-size: 1275px 1266px;
   width: 197px;
   height: 215px;
}
.icon-nav{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1230px -515px;
   background-size: 1275px 1266px;
   width: 23px;
   height: 23px;
}
.icon-nav_focus{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -1230px -558px;
   background-size: 1275px 1266px;
   width: 23px;
   height: 23px;
}
.icon-number2{
   display:inline-block;
   background: url('../img/icon.png') no-repeat 0px -722px;
   background-size: 1275px 1266px;
   width: 267px;
   height: 198px;
}
.icon-number3{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -574px -722px;
   background-size: 1275px 1266px;
   width: 267px;
   height: 198px;
}
.icon-number4{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -943px 0px;
   background-size: 1275px 1266px;
   width: 267px;
   height: 198px;
}
.icon-number5{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -287px -722px;
   background-size: 1275px 1266px;
   width: 267px;
   height: 198px;
}
.icon-right2_wz{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -222px -320px;
   background-size: 1275px 1266px;
   width: 202px;
   height: 382px;
}
.icon-right3_img1{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -531px -1031px;
   background-size: 1275px 1266px;
   width: 157px;
   height: 126px;
}
.icon-right3_img2{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -943px -688px;
   background-size: 1275px 1266px;
   width: 157px;
   height: 126px;
}
.icon-right3_img3{
   display:inline-block;
   background: url('../img/icon.png') no-repeat 0px -1031px;
   background-size: 1275px 1266px;
   width: 157px;
   height: 126px;
}
.icon-right3_img4{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -177px -1031px;
   background-size: 1275px 1266px;
   width: 157px;
   height: 126px;
}
.icon-right3_img5{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -354px -1031px;
   background-size: 1275px 1266px;
   width: 157px;
   height: 126px;
}
.icon-right3_wz{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -667px -320px;
   background-size: 1275px 1266px;
   width: 202px;
   height: 375px;
}
.icon-right4_wz{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -444px -320px;
   background-size: 1275px 1266px;
   width: 203px;
   height: 379px;
}
.icon-right5_wz{
   display:inline-block;
   background: url('../img/icon.png') no-repeat 0px -320px;
   background-size: 1275px 1266px;
   width: 202px;
   height: 382px;
}
.icon-skill1{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -437px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-skill2{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -328px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-skill3{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -764px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-skill4{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -110px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-skill5{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -219px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-skill6{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -546px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-skill7{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -655px -1177px;
   background-size: 1275px 1266px;
   width: 89px;
   height: 89px;
}
.icon-slogan{
   display:inline-block;
   background: url('../img/icon.png') no-repeat 0px 0px;
   background-size: 1275px 1266px;
   width: 923px;
   height: 300px;
}
.icon-video{
   display:inline-block;
   background: url('../img/icon.png') no-repeat -708px -1031px;
   background-size: 1275px 1266px;
   width: 112px;
   height: 112px;
}

*{margin:0;padding:0;}
li{ list-style:none;}
a{ text-decoration:none;outline: none}
img{ border:none; vertical-align:top;}
i ,em{ font-style:normal;}
.clear{clear: both;}
.clear:after{content: ".";height: 0;font-size: 0;visibility: hidden;clear: both;}
body{font-family:"Microsoft YaHei","Helvetica Neue",Arial,HelveticaNeue,Helvetica,"BBAlpha Sans",sans-serif;font-size: 12px;position: relative;overflow: hidden;}

.main{width: 500%;position: absolute;left: 0;top: 0;background: #000}
.icon-gw{position: fixed;top: 25px;right: 100px;z-index: 2}
.icon-down{position: fixed;top: 25px;right: 50px;z-index: 2}
.list{width: 20%;height: 100%;float: left;position: relative;overflow: hidden;background: #0c1127}

.left{height: 100%;width: 468px;position: absolute;left: 0;top: 0;z-index: 2}
.left_back{width: 60px;height: 100%;background: #000;opacity: 0.9;position: absolute;top: 0;right: 0;text-align: center;z-index: 1}
.icon-left_sm{margin-top: 35px;text-indent: -99999px;}
.icon-number2 ,.icon-number3 ,.icon-number4,.icon-number5{position: absolute;right: 60px;bottom: 156px;text-indent: -99999px;}
.icon-left_text{position: absolute;right: 60px;bottom: 57px;text-indent: -99999px;}
.right{height: 100%;width: 1452px;position: relative;margin-left: 468px;background: #0c1127;overflow: hidden;}
.icon-right2_wz ,.icon-right3_wz ,.icon-right4_wz,.icon-right5_wz{position: absolute;left: 79px;top: 95px;text-indent: -999999px;z-index: 2}

/*导航*/
.list1 .nav{bottom: 50%;right: 38px;margin-bottom:-100px }
.nav{position: absolute;z-index: 3;width: 23px;right: 17px;bottom: 114px;}
.nav span{cursor: pointer;}
.nav i{display: block;height: 19px;background: #45454b;width: 1px;margin: 2px auto}

/*第一屏*/
.list1{background:url(../img/list1.jpg) center top no-repeat;}
.logo{position: absolute;left: 15px;top: 16px;z-index: 2}
.icon-slogan{position: absolute;top:180px;left: 50%;margin-left: -463px;text-indent: -999999px;z-index: 2;}
.icon-video{position: absolute;top:548px;left: 50%;margin-left: -56px;text-indent: -999999px;cursor: pointer;z-index: 2}
.icon-list1_text{position: absolute;top:720px;left: 50%;margin-left: -162px;text-indent: -999999px;z-index: 2}

/*第二屏*/
.list2 .left{background:#171926 url(../img/left_2.jpg) right top no-repeat;}
.list2 .right{background:url(../img/right_2.jpg) right top no-repeat;}
.tab_list{display: none;}
.right_text{position: absolute;color: #323c68;top: 510px;left: 79px;z-index: 2}
.right_text h2{font-weight: normal;font-size: 24px;padding-bottom: 5px;}
.right_text p{font-size: 20px;line-height: 30px;}
.list2_male{background:url(../img/list2_male.png) right top no-repeat;width: 1380px;height: 696px;position: absolute;right: 0;top: 180px;}
.list2_female{background:url(../img/list2_female.png) right top no-repeat;width: 1272px;height: 631px;position: absolute;right: 181px;top: 185px;}
.list2_auto{background:url(../img/list2_auto.png) right top no-repeat;width: 561px;height: 556px;position: absolute;right: 255px;top: 157px;z-index: 3;text-align: center;color: #fff;line-height: 30px;}
.list2_auto h2{font-size: 40px;margin: 102px 0 22px}
.list2_auto h3{font-size: 24px;font-weight: normal}
.list2_auto p{font-size: 16px;margin-top: 35px;}
.list2_icon1{background:url(../img/list2_icon1.png) right top no-repeat;width: 1523px;height: 609px;position: absolute;right: 0;top: 341px;}
.list2_icon2{background:url(../img/list2_icon2.png) right top no-repeat;width: 667px;height: 659px;position: absolute;right: 203px;top: 110px;z-index: 3}
.list2_icon2 div{font-size: 30px;color: #fff;text-align: center;line-height: 79px;cursor: pointer;}
.list2_icon2_1{position: absolute;top: 386px;right: -21px;}
.list2_icon2_2{position: absolute;top: 519px;right: 58px;}
.list2_icon2_3{position: absolute;top: 611px;right: 207px;}

/*第三屏*/
.list3 .left{background:url(../img/left_3.jpg) right top no-repeat;}
.list3 .right{background:url(../img/right_3.jpg) right top no-repeat;}
.list3_btm{position: absolute;left: 46px;bottom: 76px;font-size: 0;}
.list3_btm_text{font-size: 20px;color: #323c68;line-height: 28px;text-align: right;margin-bottom: 50px;}
.icon-list3_list{text-align: center;position: relative;margin-left: 26px;cursor: pointer;}
.icon-list3_list h3{font-size: 22px;color: #204c92;font-weight: normal;position: absolute;left: 21px;top: -10px;}
.icon-list3_list div{margin-top: 36px;}

/*第四屏*/
.list4 .left{background:url(../img/left_4.jpg) right top no-repeat;}
.list4 .right{background:url(../img/right_4.jpg) right top no-repeat;}
.skill_y{background:url(../img/skill_y.png) no-repeat;width: 730px;height: 731px;position: absolute;top: 69px;left: 375px;}
.skill_gif{width: 385px;height: 385px;background: #090f1b;border-radius: 200px;position: absolute;left: 173px;top: 175px;overflow: hidden;}
.skill_png{width: 347px;height: 108px;position: absolute;left: 194px;top: 452px;}
.skill_tab{position: absolute;bottom: 120px;left: 284px;}
.skill_tab li{float: left;width: 101px;height: 101px;border-radius: 100px;text-align: center;background: rgba(255, 255,255, 0.3) none repeat scroll !important;background: #fff;filter: Alpha(opacity=20);margin-right: 20px;cursor: pointer;border:2px solid rgba(255,255,255,0)}
.skill_tab li div{position: relative;margin-top: 6px;}
.skill_tab li.skill_focus{border: 2px solid #cda257}

/*第五屏*/
.list5 .left{background:url(../img/left_5.jpg) right top no-repeat;}
.list5 .right{background:url(../img/right_5.jpg) right top no-repeat;}
.arms_top{background:url(../img/arms_bor.png) no-repeat;width: 751px;height: 483px;position: absolute;left: 349px;top: 189px;}
.arms_top span{position: absolute;top: -19px;font-size: 22px;text-align: center;line-height: 46px;cursor: pointer;letter-spacing: 10px}
.arms_top1{left: 189px;}
.arms_top2{left: 394px;}
.icon-arms_list1{color: #30456d;}
.icon-arms_list2{color: #fff;}
.arms_top_img{width:726px;height: 433px;position: absolute;left: 11px;top: 34px;border: 2px solid #c49037 }
.arms_btm{position: absolute;bottom: 120px;left: 410px;}
.arms_btm li{float: left;width: 102px;height: 101px;border-radius: 100px;text-align: center;background: rgba(255, 255,255, 0.3) none repeat scroll !important;background: #fff;filter: Alpha(opacity=20);margin-right: 20px;cursor: pointer;border:2px solid rgba(255,255,255,0)}
.arms_btm li div{position: relative;margin-top: 6px;}
.arms_btm li.arms_focus{border: 2px solid #cda257}

/*弹窗*/
.mask{width: 100%;height: 100%;background: #000;opacity: 0.8;position: fixed;left: 0;top: 0;z-index: 20;display: none;}
.popup{width: 727px;height: 433px;position: fixed;left: 50%;margin-left: -363px;top: 50%;margin-top: -267px;z-index: 21;display: none;}
.popup_img{width: 727px;height: 433px;overflow: hidden;border: 2px solid #c49037;background: #000;position: relative}
.popup_img img{display: none;position: absolute;left: 0;top: 0;}
.popup_bor{background:url(../img/popup_bor.png) no-repeat;width: 751px;height: 459px;position: absolute;left: -11px;top: -12px;}
.icon-arrow_left{position: absolute;left: -100px;top: 210px;cursor: pointer;}
.icon-arrow_right{position: absolute;right: -100px;top: 210px;cursor: pointer;}
.close{background:url(https://img1.ssl.q1.com/lw/images/20170215_main/close_v1.png?v=1) no-repeat; width:33px; height:32px; position:absolute; top:5px; right:-60px; cursor:pointer;z-index: 21}
.close:hover{-webkit-transform: rotate(360deg);transform: rotate(360deg);-webkit-transition: 1s;transition: 1s; display:block}

.popup_video{width: 800px;height: 500px;position: fixed;left: 50%;margin-left: -400px;top: 50%;margin-top: -250px;z-index: 21;background: #000;display: none;}


/*动画*/
.icon-slogan,.icon-video ,.icon-list1_text ,.left,.icon-right2_wz ,.right_text ,.icon-right3_wz ,.list3_btm ,.icon-right4_wz,.icon-right5_wz ,.skill_tab,.arms_top,.arms_btm{opacity: 0;-webkit-transition: all .6s ease;transition: all .6s ease;}
.icon-slogan,.list3_btm{-webkit-transform: translate(0,-100px);transform: translate(0,-100px);}
.icon-video,.icon-list1_text,.right_text,.skill_tab{-webkit-transform: translate(0,100px);transform: translate(0,100px);}
.left{-webkit-transform: translate(-200px,0);transform: translate(-200px,0);}
.arms_top{-webkit-transform: translate(100px,0);transform: translate(100px,0);}
.arms_btm{-webkit-transform: translate(-100px,0);transform: translate(-100px,0);}
.icon-right2_wz,.icon-right3_wz,.icon-right4_wz,.icon-right5_wz{-webkit-transform: translate(100px,0);transform: translate(100px,0);}
.animate .icon-slogan,.animate .icon-video,.animate .icon-list1_text,.animate .left, .animate .icon-right2_wz ,.animate .right_text,.animate .icon-right3_wz ,.animate .list3_btm, .animate .icon-right4_wz, .animate .icon-right5_wz ,.animate .skill_tab ,.animate .arms_top,.animate .arms_btm{-webkit-transform: translate(0px,0px);transform: translate(0px,0px);opacity: 1;}

@media screen and (max-height: 901px){
  .icon-right2_wz ,.icon-right3_wz ,.icon-right4_wz,.icon-right5_wz{top: 20px;}
  .skill_y{top: 10px;}
  .skill_tab{bottom: 30px;}
  .arms_top{top: 100px}
  .arms_btm{bottom: 40px}
  .list3_btm{bottom: 20px}
}
@media screen and (max-height: 770px){
  .skill_y{top: -90px;}
  .arms_top{top: 30px}
  .arms_btm{bottom: 20px}
  .list3_btm{bottom: 20px}

  .list2_male{right: 0;top: 80px;}
  .list2_female{top: 85px;}
  .list2_auto{top: 57px;}
  .list2_icon2{top: 0;}

  .icon-slogan{top: 80px}
  .icon-video{top: 428px}
  .icon-list1_text{top: 560px}
}


/*# sourceMappingURL=app.css.map */