* { margin: 0; padding: 0; }

body { font-size: 14px; font-family: "microsoft yahei"; }

a { text-decoration: none; }

li { list-style: none; }

img { display: block; }

.clear { clear: both; }

.container { width: 1200px; margin: 0 auto; }

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

.logo { display: block; width: 160px; height: 36px; float: left; background:  no-repeat; margin-top: 22px; }

.nav { width: 100%; height: 80px; background: #eeeeee; line-height: 80px; }
.nav ul { float: right; }
.nav ul li { float: left; width: 130px; height: 80px; line-height: 80px; text-align: right; font-size: 16px; color: #666666; }
.nav ul li a { color: #666666; transition: all .2s; }
.nav ul li a:hover { color: #0e9aff; }

.banner { width: 100%; height: 600px; background: ; margin-bottom: 80px; }
.banner .container { padding-top: 80px; }
.banner .trian { width: 640px; height: 450px; background:  no-repeat 0 -15px; position: relative; }
.banner .trian * { position: absolute; }
.banner .trian .title { width: 470px; height: 185px; background:  -70px -510px; left: 80px; top: 40px; }
.banner .trian .bline { width: 0px; height: 5px; background:  -75px -715px; left: 80px; top: 205px; }
.banner .trian p { color: #0094ff; text-align: center; font-size: 18px; width: 100%; top: 235px; }
.banner .trian p span { display: block; font-weight: bold; width: 100%; position: relative; font-size: 20px; }

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

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

@-webkit-keyframes bouncein { from,
  20%,
  40%,
  60%,
  80%,
  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: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }
  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
.bouncein { -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-name: bouncein; animation-name: bouncein; }

/*--------------------*/
.titles { width: 100%; height: 60px; }
.titles dt { font-size: 32px; color: #666666; }
.titles dt:before { display: block; float: left; content: " "; width: 8px; height: 28px; background:  no-repeat -3px -4px; margin: 9px 10px 0 0; }
.titles dd { color: #999999; font-family: "arial"; text-transform: uppercase; margin-top: 3px; }

.titwh dt { color: #ffffff; }
.titwh dd { color: #cccccc; }

.introdu { width: 100%; height: 270px; position: relative; margin: 25px 0 150px; }
.introdu * { position: absolute; }
.introdu p { width: 740px; text-indent: 2em; top: 40px; left: 40px; }
.introdu .imgbox { width: 350px; height: 250px; right: 30px; background: ; z-index: 9999; bottom: 15px; }
.introdu .imgbox .con { width: 340px; height: 240px; left: 3px; top: 4px; overflow: hidden; }
.introdu .imgbox .con img { transition: all .2s; }
.introdu:after { content: " "; display: block; height: 40px; width: 100%; background: #15a0e5; bottom: 0; position: absolute; }
.introdu:hover .imgbox .con img { transform: scale(1.05); }

.three { width: 100%; height: 500px; position: relative; }
.three .cons { width: 380px; height: 500px; float: left; position: relative; background:  no-repeat 0 -320px; box-shadow: 0px 0px 8px 2px #dad9d9; transition: all .3s; }
.three .cons * { transition: all .3s; }
.three .cons i { display: block; width: 150px; height: 170px; position: absolute; left: 115px; top: -80px; background:  -525px -2px; overflow: hidden; }
.three .cons i:before { content: " "; display: block; width: 50px; height: 55px; background:  no-repeat -37px -13px; margin: 52px 0 0 50px; transition: all .2s; }
.three .cons i.money:before { background-position-x: -116px; }
.three .cons i.art:before { background-position-x: -195px; }
.three .cons h6 { text-align: center; font-size: 24px; color: #ffffff; margin-top: 95px; }
.three .cons p { width: 345px; margin: 65px auto 0; text-indent: 2em; }
.three .cons em { display: block; width: 200px; height: 44px; text-align: center; line-height: 44px; border: 1px solid #536d8a; color: #333333; border-radius: 22px; position: absolute; bottom: 40px; left: 50%; margin-left: -100px; font-size: 18px; cursor: pointer; font-style: normal; }
.three .cons em:hover { background: #ffffff; }
.three .cons:hover { background-position-y: 0; box-shadow: 0 0 8px 2px #ccc; }
.three .cons:hover p { color: #ffffff; margin-top: 50px; }
.three .cons:hover em { border-color: #ffffff; bottom: 55px; color: #ffffff; }
.three .cons:hover em:hover { color: #09acff; }
.three .cons:hover i:before { background-position-y: -73px; }
.three .mid { margin: 0 30px; }
.three .gre { width: 100%; height: 580px; position: absolute; background: #dddddd; top: -80px; display: none; }
.three .gre h6 { padding: 30px 0 50px 35px; color: #333333; font-size: 18px; font-weight: normal; }
.three .gre p { font-size: 14px; line-height: 28px; color: #666666; padding: 0 60px; margin-bottom: 30px; }
.three .gre i { display: block; width: 30px; height: 30px; position: absolute; background:  -717px -311px; right: 40px; top: 40px; cursor: pointer; }
.three .gre a { color: #666666; transition: all .2s; }
.three .gre a:hover { color: #09acff; }
.three .gre1 p { padding: 30px 60px; }
.three .gre1 p a { display: block; width: 50%; float: left; }
.three .gre2 .cc { overflow: scroll; width: 1040px; height: 500px; overflow-x: hidden; margin: 40px auto; }
.three .gre2 .cc p { padding: 0 20px 0 0; }
.three .gre2 .cc::-webkit-scrollbar { border-radius: 5px; width: 5px; background-color: #b3bbc4; }
.three .gre2 .cc::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-box-shadow: inset 0 0 6px rgba(0, 140, 125, 0.3); background-color: #536d8a; }

/*------------milestone ------------*/
.mits { width: 100%; height: 670px; margin: 80px 0; padding-top: 80px; box-shadow: inset 0px 0px 13px 6px #038dd9; position: relative; background:  #04a7ff center fixed no-repeat; }
.mits .mms { width: 100%; height: 495px; background:  no-repeat; margin-top: 40px; position: relative; }
.mits .mms i { display: block; width: 16px; height: 16px; background:  -37px -225px; position: absolute; left: 63px; top: 238px; }
.mits .mms div { width: 340px; position: absolute; display: table; height: 145px; float: left; }
.mits .mms div p { display: table-cell; color: #ffffff; line-height: 36px; padding-left: 150px; vertical-align: middle; }
.mits .mms div.t2 { left: 346px; }
.mits .mms div.t3 { left: 695px; }
.mits .mms div.t4, .mits .mms div.t5, .mits .mms div.t6 { bottom: 0; }
.mits .mms div.t4 { left: 172px; }
.mits .mms div.t5 { left: 520px; }
.mits .mms div.t6 { left: 870px; }

/*--------------tech--------------------*/
p.center { text-align: center; margin: 35px 0; }

.lianchan { width: 100%; height: 400px; background:  no-repeat; position: relative; }
.lianchan * { position: absolute; }
.lianchan .txt { font-size: 16px; color: #ffffff; height: 200px; line-height: 200px; width: 50%; }
.lianchan .txt1 { padding-right: 40px; text-align: right; width: 560px; }
.lianchan .txt2 { left: 50%; top: 50%; padding-left: 40px; }
.lianchan .tit { width: 50%; font-size: 24px; color: #536d8a; height: 200px; line-height: 200px; }
.lianchan .tit1 { left: 50%; padding-left: 40px; }
.lianchan .tit2 { width: 560px; top: 50%; padding-right: 40px; text-align: right; }
.lianchan .img1 { width: 125px; height: 120px; left: 45px; top: 40px; background:  -370px -10px; }
.lianchan .img2 { width: 145px; height: 255px; left: 1025px; top: 70px; background:  no-repeat; }

.youshi { width: 100%; height: 180px; }
.youshi dl { width: 590px; height: 80px; background: #f0f0f0; margin: 0 20px 20px 0; float: left; overflow: hidden; }
.youshi dl dt { width: 80px; height: 80px; float: left; background: #0e9aff; z-index: 9999; position: relative; }
.youshi dl dt:before { content: " "; width: 46px; height: 36px; background:  no-repeat -24px -148px; display: block; margin: 22px 0 0 17px; }
.youshi dl dd { width: 510px; height: 80px; float: left; display: table; position: relative; }
.youshi dl dd:before { content: " "; display: block; position: absolute; left: -510px; top: 0; background: #0e9aff; width: 100%; height: 100%; transition: all .2s; }
.youshi dl dd p { display: table-cell; vertical-align: middle; font-size: 14px; line-height: 28px; color: #666666; padding: 0 20px; z-index: 9999; position: relative; }
.youshi dl.two { margin-right: 0; }
.youshi dl.two dt:before { background-position-x: -85px; }
.youshi dl.thr dt:before { background-position-x: -145px; }
.youshi dl.four { margin-right: 0; }
.youshi dl.four dt:before { background-position-x: -206px; }
.youshi dl:hover dd:before { left: 0; }
.youshi dl:hover dd p { color: #ffffff; }

.suit { width: 100%; height: 620px; background:  no-repeat center; margin: 40px auto 45px; position: relative; color: #ffffff; }
.suit em { position: absolute; display: block; background: ; }
.suit em.l1 { width: 174px; height: 137px; background-position-y: -163px; left: 356px; top: 143px; }
.suit em.l2 { width: 150px; height: 80px; background-position-y: -463px; left: 345px; top: 341px; }
.suit em.l3 { width: 130px; height: 8px; background-position: -10px -572px; left: 360px; top: 457px; }
.suit em.l4 { width: 180px; height: 64px; background-position: -285px -510px; left: 354px; top: 512px; }
.suit em.l5 { width: 268px; height: 149px; background-position-y: 0px; left: 366px; top: 50px; }
.suit em.l6 { width: 264px; height: 149px; background-position-y: -300px; left: 338px; top: 236px; }
.suit em.l7 { width: 163px; height: 97px; background-position: -322px 0; left: 673px; top: 41px; }
.suit em.l8 { width: 168px; height: 55px; background-position: -307px -117px; left: 675px; top: 144px; }
.suit em.l9 { width: 160px; height: 30px; background-position: -290px -190px; left: 687px; top: 242px; }
.suit em.l10 { width: 170px; height: 70px; background-position: -286px -245px; left: 680px; top: 304px; }
.suit em.l11 { width: 170px; height: 120px; background-position: -300px -335px; left: 680px; top: 360px; }
.suit i { position: absolute; font-style: normal; display: block; width: 80px; text-align: center; cursor: pointer; }
.suit i:before { content: " "; display: block; width: 20px; height: 20px; background:  -37px -200px; margin: 0 auto 3px; animation: buling 2s infinite; }
.suit i.i1 { left: 490px; top: 270px; }
.suit i.i2 { left: 457px; top: 400px; }
.suit i.i3 { left: 457px; top: 450px; }
.suit i.i4 { left: 490px; top: 505px; }
.suit i.i5 { left: 570px; top: 190px; }
.suit i.i6 { left: 570px; top: 370px; }
.suit i.i7, .suit i.i8, .suit i.i9, .suit i.i10, .suit i.i11 { left: 640px; }
.suit i.i7 { top: 120px; }
.suit i.i8 { top: 175px; }
.suit i.i9 { top: 240px; }
.suit i.i10 { top: 295px; }
.suit i.i11 { top: 350px; }
.suit i:hover { color: #00a5ff; }
.suit p { position: absolute; width: 350px; padding: 10px 20px; background: #0e9aff; color: #ffffff; font-size: 14px; line-height: 28px; }
.suit p.p1 { top: 106px; }
.suit p.p2 { top: 310px; }
.suit p.p3 { top: 425px; }
.suit p.p4 { top: 520px; }
.suit p.p6 { top: 210px; }
.suit p.p8 { top: 95px; }
.suit p.p9 { top: 210px; }
.suit p.p10 { top: 320px; }
.suit p.p11 { top: 425px; }
.suit em, .suit p { display: none; }
.suit .on { display: block; }

@keyframes buling { 0% { opacity: .5; }
  50% { opacity: 1; }
  100% { opacity: .5; } }
/*---------------------*/
.pros { width: 100%; height: 90px; margin-bottom: 80px; }
.pros dl { width: 238px; height: 68px; font-size: 14px; color: #666666; line-height: 68px; border: 1px solid #cccccc; position: relative; float: left; margin-right: 20px; }
.pros dl a { display: block; width: 100%; height: 100%; }
.pros dl dt { height: 95px; position: absolute; background:  -334px -274px; width: 76px; top: -10px; left: 0; }
.pros dl dd { padding-left: 70px; color: #666666; }
.pros dl:hover { border-color: #ec1b24; }
.pros dl.two dt { background-position-x: -402px; }
.pros dl.two dd { padding-left: 100px; }
.pros dl.thr dt { background-position: -485px -277px; }
.pros dl.thr dd { padding-left: 107px; }
.pros dl.four dt { background-position-x: -575px; width: 105px; }
.pros dl.four dd { padding-left: 120px; }
.pros a.more { display: block; width: 150px; height: 68px; line-height: 68px; color: #999999; float: left; transition: all .2s; text-align: center; }
.pros a.more:hover { color: #ec1b24; }

/*-------------accumu----------------*/
.accu { width: 100%; height: 600px; margin-bottom: 80px; background: #0e9aff; }
.accu .path { width: 0px; height: 600px; background: #0e9aff center center no-repeat; color: #ffffff; padding-left: 180px; overflow: hidden; box-shadow: inset 7px 4px 20px 2px #2d8cd2; float: left; position: relative; transition: background-image .3s; }
.accu .path * { text-indent: 2px; }
.accu .path h5 { font-size: 24px; height: 100px; line-height: 100px; margin-bottom: 20px; font-weight: normal; }
.accu .path p { color: #ffffff; }
.accu .path i { display: block; position: absolute; width: 100px; height: 120px; top: 50%; margin-top: -60px; left: 40px; text-align: center; color: #ffffff; font-style: normal; font-size: 18px; opacity: 1; }
.accu .path i:before { content: " "; display: block; width: 80px; height: 80px; background:  -24px -270px; margin: 0 auto 10px; }
.accu .path1 { width: 760px; padding: 0 40px; }
.accu .path1.on { background-image: ; }
.accu .path1 i { display: none; }
.accu .path1 dl { width: 100%; height: 360px; }
.accu .path1 dl dt { width: 240px; height: 360px; float: left; }
.accu .path1 dl dd { float: left; padding-left: 40px; }
.accu .path1 dl dd span { font-size: 18px; line-height: 36px; display: block; margin: 10px 0 25px; }
.accu .path2 { background-color: #1c95ec; }
.accu .path2.on { background-image: ; }
.accu .path2 i:before { background-position-x: -133px; }
.accu .path2 p { text-indent: 2em; padding-left: 2px; }
.accu .path2 table { width: 100%; font-size: 18px; }
.accu .path2 table td { text-indent: 3px; }
.accu .path2 table thead td { padding-left: 12px; }
.accu .path2 table tr { height: 40px; line-height: 40px; }
.accu .path2 table tbody tr td { position: relative; }
.accu .path2 table tbody tr td:nth-child(2):before, .accu .path2 table tbody tr td:nth-child(3):before, .accu .path2 table tbody tr td.star { content: " "; display: block; width: 118px; height: 22px; background:  repeat-x; }
.accu .path2 table tbody tr td.nine:before { width: 107px; }
.accu .path2 table tbody tr span { position: absolute; display: block; height: 40px; line-height: 40px; left: 140px; top: 0; font-size: 16px; color: #eeeeee; }
.accu .path3 { background-color: #2f93db; }
.accu .path3.on { background-image: ; }
.accu .path3 i:before { background-position-x: -229px; }
.accu .path3 p { border-bottom: 1px solid #cccccc; padding-bottom: 20px; margin-bottom: 20px; }
.accu .path3 table { width: 100%; font-size: 16px; }
.accu .path3 table td { text-align: center; }
.accu .path3 table tr td:first-child { text-align: left; }

/*------------cases--------------*/
.cases { width: 100%; height: 760px; margin-bottom: 40px; position: relative; }
.cases .left { width: 440px; height: 750px; background: #f0f0f0; padding-left: 40px; padding-top: 10px; }
.cases .left dl { width: 385px; margin-top: 35px; }
.cases .left dl dt { width: 100px; height: 100px; float: left; background:  -370px -155px; }
.cases .left dl dt:before { content: " "; width: 60px; height: 54px; background:  -705px -13px; display: block; margin: 20px 0 0 23px; }
.cases .left dl dt.two:before { background-position-y: -89px; }
.cases .left dl dt.thr:before { background-position-y: -160px; }
.cases .left dl dt.four:before { background-position-y: -230px; }
.cases .left dl dd { float: right; width: 270px; font-size: 16px; line-height: 32px; color: #666666; text-align: justify; }
.cases .left dl dd span { font-size: 18px; color: #333333; display: block; line-height: 18px; margin-bottom: 8px; }
.cases h6 { font-size: 24px; font-weight: normal; color: #666666; position: absolute; left: 510px; top: 10px; }
.cases .cimgs { width: 730px; height: 600px; padding: 20px; position: absolute; top: 60px; right: -20px; background: #ffffff; box-shadow: 0 0 7px 2px #dcdcdc; }
.cases .cimgs div { float: left; margin: 0 20px 20px 0; overflow: hidden; }
.cases .cimgs div:hover img { transform: scale(1.05); }
.cases .cimgs img { transition: all .2s; }
.cases .cimgs .right { margin-right: 0; }
.cases .cimgs .big { width: 480px; height: 290px; }
.cases .cimgs .simg { width: 230px; height: 290px; }

.xiaoyi { width: 100%; height: 340px; }
.xiaoyi dl { width: 100%; height: 120px; margin-bottom: 20px; }
.xiaoyi dl dt { width: 120px; height: 120px; background: #f0f0f0; overflow: hidden; float: left; }
.xiaoyi dl dt:before { content: " "; width: 80px; height: 80px; display: block; background:  -260px -10px; margin: 20px 0 0 20px; }
.xiaoyi dl dt.soci:before { background-position-y: -85px; }
.xiaoyi dl dd { width: 1060px; float: right; font-size: 16px; color: #666; line-height: 32px; text-align: justify; }
.xiaoyi dl dd a { color: #ec1b24; }
.xiaoyi dl dd span { font-size: 18px; display: block; }

/*------------liyu------------------*/
.liyu { width: 100%; height: 770px; margin-bottom: 80px; background: #5c5c5c; padding-top: 80px; background:  fixed; }
.liyu p { color: #eeeeee; }
.liyu p.suu { font-size: 16px; margin-top: 35px; text-align: center; }
.liyu .cn { width: 100%; font-size: 20px; color: #ffffff; text-align: center; line-height: 40px; }
.liyu .cn span { font-weight: bold; display: block; }
.liyu a.chat { width: 360px; height: 50px; line-height: 50px; color: #ffffff; font-weight: bold; text-align: center; margin: 20px auto; display: block; font-size: 18px; background:  -373px -403px; }

.fuwu { width: 100%; height: 360px; background:  no-repeat; position: relative; margin: 30px auto 30px; }
.fuwu p { position: absolute; width: 300px; text-align: right; top: 180px; left: 35px; }
.fuwu .fang { width: 840px; float: right; height: 360px; }
.fuwu .fang dl { width: 100%; height: 120px; transition: all .3s; }
.fuwu .fang dl * { transition: all .2s; }
.fuwu .fang dl dt { width: 108px; height: 108px; float: left; border: 6px solid transparent; position: relative; }
.fuwu .fang dl dt:before, .fuwu .fang dl dt:after { display: block; content: " "; position: absolute; background:  no-repeat; transition: all .3s; }
.fuwu .fang dl dt:before { width: 50px; height: 20px; background-position: -79px -194px; left: 30px; top: 23px; }
.fuwu .fang dl dt:after { width: 28px; height: 20px; left: 40px; top: 66px; background-position: -139px -220px; }
.fuwu .fang dl dt.two:after { background-position-x: -171px; }
.fuwu .fang dl dt.thr:after { background-position-x: -203px; }
.fuwu .fang dl dd { width: 700px; height: 120px; float: left; color: #dddddd; font-size: 16px; padding-left: 20px; }
.fuwu .fang dl dd span { font-size: 20px; display: block; height: 70px; line-height: 70px; }
.fuwu .fang dl:hover { background: #666666; }
.fuwu .fang dl:hover dt { border-color: #04a7ff; }
.fuwu .fang dl:hover dt:before { background-position-y: -220px; }
.fuwu .fang dl:hover dt:after { background-position-y: -193px; }
.fuwu .fang dl:hover dd span { color: #04a7ff; }

/*---------------------------------*/
.footer { height: 560px; margin-top: 70px; }
.footer form { width: 100%; }
.footer form p { font-size: 24px; margin-bottom: 25px; transition: all .2s; }
.footer form input { font-size: 16px; color: #999999; text-indent: 10px; }
.footer form input.mid, .footer form input.longer { border: none; outline: none; border-bottom: 1px solid #aaaaaa; height: 40px; line-height: 40px; }
.footer form input.mid { margin-right: 55px; width: 360px; }
.footer form input.nomar { margin-right: 0; }
.footer form input.longer { width: 100%; margin: 25px 0 40px; }
.footer form input.btn { width: 80px; height: 40px; line-height: 40px; text-align: center; color: #536d8a; cursor: pointer; background: #f6f6f6; outline: none; border: none; display: inline-block; margin-right: 20px; transition: all .2s; text-indent: 0; }
.footer form input.btn:hover { background: #3eaeff; color: #ffffff; }
.footer form input.sub { margin-left: 500px; background: #3eaeff; color: #ffffff; }
.footer .needs { width: 100%; height: 150px; margin: 35px 0 40px; }
.footer .needs .left { width: 927px; height: 150px; float: left; padding-left: 80px; }
.footer .needs .left dl { width: 120px; height: 150px; text-align: center; margin-right: 130px; float: left; }
.footer .needs .left dl * { transition: all .2s; }
.footer .needs .left dl dt { width: 100px; height: 100px; margin: 0 auto 10px; border: 1px solid #0e9aff; border-radius: 50%; background:  10px -360px; }
.footer .needs .left dl dt.order { background-position-x: -78px; }
.footer .needs .left dl dt.lower { background-position-x: -173px; }
.footer .needs .left dl dt.tel { background-position-x: -257px; }
.footer .needs .left dl dd { font-size: 16px; color: #666666; }
.footer .needs .left dl.last { margin-right: 0; }
.footer .needs .left dl:hover dt { background-position-y: -430px; background-color: #0e9aff; }
.footer .needs .left dl:hover dd { color: #0e9aff; }
.footer .needs .right { width: 135px; height: 95px; float: right; margin-top: 12px; border-left: 1px solid #dddddd; padding-left: 51px; padding-top: 5px; position: relative; }
.footer .needs .right a { display: block; width: 40px; height: 35px; background:  -490px -176px; float: left; margin-right: 25px; margin-bottom: 20px; transition: all .2s; }
.footer .needs .right a.weibo { background-position-x: -539px; }
.footer .needs .right a.douban { background-position-x: -587px; }
.footer .needs .right a.fb { background-position-x: -633px; }
.footer .needs .right a:hover { background-position-y: -216px; }
.footer .needs .right img { position: absolute; width: 100px; left: 45px; top: 0; border: 1px solid #0e9aff; display: none; }

.copyright { width: 100%; height: 60px; line-height: 60px; font-size: 16px; color: #ffffff; background: #0e82d6; }
.copyright span { float: right; }

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