@charset "UTF-8";
* { margin: 0; padding: 0; font-family: "Microsoft Yahei"; }

html { overflow: hidden; }

body { background: url("img/bg_main.jpg") bottom left no-repeat; background-color: #050618; }

.clear { clear: both; }

.hide { display: none; }

li { list-style: none; }

a { text-decoration: none; }

img { display: block; }

.container { width: 1190px; margin: 0 auto; overflow: hidden; }

.logo { display: block; width: 270px; height: 65px; background: url("img/titles.png") no-repeat; margin-top: 30px; }

.mt { width: 750px; height: 675px; background: url("img/bg_mt.png") no-repeat; margin: 20px 0 0 495px; position: relative; }
.mt .pt { width: 617px; height: 500px; background: url("img/man_title.png") no-repeat; position: absolute; top: 50px; left: 20px; display: none; }
.mt .light { width: 617px; height: 500px; background: url("img/light.png") no-repeat; position: absolute; top: 50px; left: 20px; }
.mt dl { color: #ffffff; cursor: pointer; position: absolute; z-index: 9999; }
.mt dl dt { width: 18px; height: 18px; background: url("img/dot.png") no-repeat; margin: 0 auto; animation: dotma 2s linear infinite; }
.mt dl dd { color: #ffffff; transition: all .3s; }
.mt dl:hover dt { background-image: url("img/dot2.png"); }
.mt dl:hover dd { color: #df0a0a; }
.mt dl.p1 { left: 233px; top: -35px; }
.mt dl.p2 { left: 318px; top: -22px; }
.mt dl.p3 { left: 550px; top: 172px; }
.mt dl.p4 { left: 207px; top: 554px; }
.mt dl.p5 { left: 341px; top: 597px; }
.mt dl.p6 { left: -58px; top: 407px; }
.mt dl.p7 { left: -141px; top: 207px; }
.mt dl.p8 { left: 625px; top: 288px; }
.mt dl.p1 dd, .mt dl.p2 dd { line-height: 30px; }
.mt dl.p3 dt, .mt dl.p3 dd, .mt dl.p6 dt, .mt dl.p6 dd, .mt dl.p7 dt, .mt dl.p7 dd, .mt dl.p8 dt, .mt dl.p8 dd { float: left; }
.mt dl.p3 dd, .mt dl.p6 dd, .mt dl.p7 dd, .mt dl.p8 dd { line-height: 16px; margin-right: 4px; }
.mt dl.p3 dt, .mt dl.p8 dt { margin-right: 5px; }
.mt dl.p7 { text-align: center; }
.mt dl.p7 dd { line-height: 22px; }
.mt dl.p7 dt { margin-top: 10px; }

@keyframes dotma { 0% { opacity: 1; }
  50% { opacity: .5; }
  100% { opacity: 1; } }
/*----------*/
.main { width: 100%; position: fixed; margin-top: 150px; height: 700px; left: 0; top: 0; display: none; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

p { color: #333333; font-size: 16px; line-height: 30px; text-align: justify; }

.nav { width: 100%; height: 60px; position: absolute; bottom: 0; background: #0d1037; color: #ffffff; }
.nav li { width: 147px; float: left; text-align: center; line-height: 60px; height: 60px; cursor: pointer; transition: all .2s; margin-right: 1px; }
.nav li:hover, .nav li.on { background: #df0a0a; }

#close { width: 50px; height: 50px; left: 50%; margin-left: 492px; position: absolute; background: rgba(255, 255, 255, 0.95); background: #ffffff\9; line-height: 44px; text-align: center; cursor: pointer; color: #050618; font-size: 60px; transition: all .2s; }
#close:hover { background: rgba(223, 10, 10, 0.95); background: #e0090a\9; }

.main > .bd { width: 980px; height: 530px; background: rgba(255, 255, 255, 0.95); position: absolute; left: 50%; margin-left: -490px; padding-top: 30px; background: #ffffff\9; }

.box { width: 880px; margin: 0 auto; display: none; }

.show { display: block; }

.titles { width: 330px; height: 60px; background: url("img/titles.png") no-repeat; background-position-y: -65px; margin-bottom: 20px; }

.tit2 { background-position-y: -123px; }

.tit3 { background-position-y: -181px; }

.tit4 { background-position-y: -243px; }

.tit5 { background-position-y: -302px; }

.tit6 { background-position-y: -362px; }

.tit7 { background-position-y: -416px; }

.tit8 { background-position-y: -475px; }

/*---------part1-------------*/
.box1 dl { width: 100%; }
.box1 dl dt { width: 260px; float: right; padding-top: 50px; }
.box1 dl dd { width: 590px; float: left; }
.box1 dl dd p { margin-bottom: 25px; }

/*----------part2-------------*/
p.le250 { width: 250px; float: left; }

.box2 .media { width: 604px; height: 400px; float: right; }
.box2 .iv { width: 100%; height: 40px; margin-bottom: 3px; display: none; }
.box2 .iv span { display: block; width: 300px; height: 40px; line-height: 40px; text-align: center; float: left; margin-right: 2px; background: #0c1c4e; transition: all .2s; font-size: 16px; color: #ffffff; cursor: pointer; }
.box2 .iv span:hover, .box2 .iv span.on { background: #df0a0a; }
.box2 .mbox { width: 602px; height: 400px; position: relative; }
.box2 .mbox li { width: 100%; height: 400px; }
.box2 .mbox li img { width: 100%; height: 100%; }
.box2 .mbox li span { display: block; width: 602px; font-size: 14px; line-height: 20px; height: 50px; padding-top: 8px; color: #ffffff; background: rgba(0, 0, 0, 0.3); position: absolute; bottom: 0; z-index: 9999; text-align: center; }
.box2 .mbox a.prev, .box2 .mbox a.next { display: block; width: 22px; height: 50px; background: url("img/icons.png") -20px -222px; position: absolute; top: 50%; margin-top: -25px; opacity: .7; transition: all .2s; }
.box2 .mbox a.prev:hover, .box2 .mbox a.next:hover { opacity: 1; }
.box2 .mbox a.prev { left: 0; }
.box2 .mbox a.next { right: -2px; background-position-x: -60px; }

/*-----------------part3----------------*/
.datas { width: 100%; height: 400px; overflow: scroll; overflow-x: hidden; padding-right: 30px; color: #333333; }
.datas h6 { font-size: 20px; text-align: center; font-weight: normal; margin: 30px auto 40px; }
.datas .dl1, .datas .dl2, .datas .dl3 { width: 100%; height: 150px; }
.datas dl { text-align: center; width: 50%; float: left; }
.datas dl span { font-size: 30px; display: block; }
.datas dl dt { width: 75px; height: 65px; background: url("img/icons.png") no-repeat; margin: 0 auto; background-position-x: 7px; }
.datas dl dt.d2 { background-position-x: -113px; }
.datas dl dt.d3 { background-position-x: -220px; }
.datas dl dt.d4 { background-position-x: -325px; }
.datas dl dt.d5 { background-position-x: -425px; }
.datas dl dt.d6 { background-position-x: -539px; }
.datas dl dt.d7 { background-position-x: -651px; }
.datas dl dt.d8 { background-position-x: -755px; }
.datas dl dt.d9 { background-position-x: -868px; }
.datas .dl2 dl { width: 33%; }
.datas .dl3 dl { width: 25%; }
.datas .cj { margin-top: -25px; }
.datas .cj img { width: 155px; float: left; }
.datas .cj p { float: left; padding-top: 20px; line-height: 45px; }
.datas .cj p span { font-size: 30px; color: #e60012; }

/*---------------*/
.words { width: 537px; height: 300px; background: url("img/icons.png") -468px -90px; position: absolute; left: 200px; }
.words a { color: #0d1037; position: absolute; transition: all .2s; animation: wordgrey 1s linear infinite; }
.words a:hover { color: #df0a0a; opacity: 1; }
.words .w1 { left: 250px; top: 22px; }
.words .w2 { left: 285px; top: 46px; }
.words .w3 { left: 113px; top: 81px; font-size: 14px; }
.words .w4 { left: 222px; top: 75px; }
.words .w5 { left: 94px; top: 107px; font-size: 16px; }
.words .w6 { left: 246px; top: 102px; }
.words .w7 { left: 327px; top: 125px; }
.words .w8 { left: 45px; top: 139px; font-size: 34px; font-weight: bold; }
.words .w9 { left: 24px; top: 190px; }
.words .w10 { left: 176px; top: 190px; }
.words .w11 { left: 370px; top: 190px; font-size: 12px; }
.words .w12 { left: 30px; top: 215px; }
.words .w13 { left: 198px; top: 220px; }
.words .w14 { left: 394px; top: 215px; }
.words .w15 { left: 48px; top: 244px; font-size: 14px; }
.words .w16 { left: 158px; top: 255px; }
.words .w17 { left: 366px; top: 250px; font-size: 18px; }

@keyframes wordgrey { 0% { opacity: 1; }
  50% { opacity: .6; }
  100% { opacity: 1; } }
.cloud { width: 112px; height: 76px; background: url("img/icons.png") -15px -104px; position: absolute; left: 685px; animation: cloud 4s linear infinite; }

@keyframes cloud { 0% { left: 680px; }
  50% { left: 695px; }
  100% { left: 680px; } }
.devs { width: 208px; height: 120px; background: url("img/icons.png") -197px -90px; position: absolute; left: 366px; top: 396px; }

/*------------*/
.pros { width: 800px; height: 325px; margin: 35px auto 0; color: #333333; }
.pros .hd li { float: left; width: 194px; height: 40px; line-height: 40px; text-align: center; cursor: pointer; margin-right: 3px; background: #dcdcdc; transition: all .2s; }
.pros .hd li.on, .pros .hd li:hover { background: #e60012; color: #ffffff; }
.pros .bd { width: 790px; height: 270px; }
.pros .bd dt { width: 240px; float: left; margin-right: 20px; }
.pros .bd dt img { width: 100%; }
.pros .bd dd { width: 515px; float: left; }
.pros .bd dd span, .pros .bd dd em { display: block; font-style: normal; }
.pros .bd dd span { font-size: 18px; }
.pros .bd dd em { font-size: 26px; color: #e60012; margin-bottom: 15px; }
.pros a.prev, .pros a.next { display: block; width: 40px; height: 60px; background: url("img/icons.png") -120px -260px; position: absolute; opacity: .7; transition: all .2s; }
.pros a.prev:hover, .pros a.next:hover { opacity: 1; }
.pros a.prev { left: 10px; top: 50%; }
.pros a.next { right: 10px; top: 50%; background-position-x: -188px; }

/*--------------------*/
.people { width: 600px; height: 360px; float: left; margin-left: 30px; position: relative; }
.people li, .people img { width: 100%; height: 100%; }
.people span { display: block; width: 600px; text-align: center; height: 30px; line-height: 30px; color: #ffffff; position: absolute; bottom: 0; background: rgba(0, 0, 0, 0.3); }
.people a.prev, .people a.next { display: block; width: 22px; height: 50px; background: url("img/icons.png") -20px -222px; position: absolute; top: 50%; margin-top: -25px; opacity: .7; transition: all .2s; }
.people a.prev:hover, .people a.next:hover { opacity: 1; }
.people a.prev { left: 0; }
.people a.next { right: -2px; background-position-x: -60px; }

/*---------年会-------*/
.box7 { height: 410px; }
.box7 .ctrl { width: 130px; float: left; position: relative; height: 400px; overflow: hidden; }
.box7 .ctrl li { width: 130px; height: 87px; margin-bottom: 18px; cursor: pointer; }
.box7 .ctrl li img { width: 100%; height: 100%; }
.box7 .ctrl li.on, .box7 .ctrl li:hover { opacity: .8; }
.box7 .ctrl a.prev, .box7 .ctrl a.next { display: block; width: 50px; height: 20px; background: url("img/icons.png") -25px -302px; position: absolute; left: 50%; margin-left: -25px; transition: all .2s; opacity: .7; }
.box7 .ctrl a.prev:hover, .box7 .ctrl a.next:hover { opacity: 1; }
.box7 .ctrl a.prev { top: 0; }
.box7 .ctrl a.next { background-position-y: -334px; bottom: 0; }
.box7 .ncon { width: 740px; height: 400px; float: right; overflow: hidden; position: relative; }
.box7 .ncon li { position: absolute; left: 0; top: 0; width: 100%; }
.box7 .ncon li img { width: 100%; }

/*----------------*/
.forms { width: 840px; margin: 0 auto; height: 400px; overflow: scroll; overflow-x: hidden; }
.forms dl { width: 100%; float: left; font-size: 16px; color: #333333; margin-bottom: 30px; }
.forms dl dt { margin-bottom: 15px; }
.forms dl dd { width: 60%; height: 34px; text-indent: 15px; border: 1px solid #bfbfbf; margin-bottom: 5px; line-height: 34px; transition: all .2s; }
.forms dl dd.on, .forms dl dd:hover { background: #000000; border-color: #000000; color: #ffffff; cursor: pointer; }
.forms .submit { width: 100px; height: 40px; background: #df0a0a; text-align: center; line-height: 40px; margin: 0 auto; color: #ffffff; cursor: pointer; transition: all .2s; }
.forms .submit:hover { background: #0d1037; }

#result { width: 400px; height: 50px; text-align: center; line-height: 50px; position: absolute; left: 50%; top: 50%; z-index: 9999; background: #df0a0a; color: #ffffff; margin: -50px 0 0 -200px; display: none; overflow: hidden; }

/*--------------*/
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.animated.bounceOut { -webkit-animation-duration: .4s; animation-duration: 0.4s; }

.bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; }

@keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  50%,55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }
@keyframes rotateIn { 0% { transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; }
  0%,to { -webkit-transform-origin: center; }
  to { transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } }
.rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; }

@keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; }
  0%,40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); }
  60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; }
  80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); }
  to { -webkit-transform: perspective(400px); transform: perspective(400px); } }
.flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; }

@keyframes bounceInLeft { 0%,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); }
  75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); }
  to { -webkit-transform: none; transform: none; } }
.bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; }

@keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  50%,55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }
.bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; }

@keyframes rubberBand { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); }
  30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); }
  40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); }
  50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); }
  65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); }
  75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); }
  to { -webkit-transform: scaleX(1); transform: scaleX(1); } }
.rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; }

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