.part1 .main{padding-top: 524px;height: 556px;}
/*
.down{width: 491px;height: 211px; background: url('../images/down.png') no-repeat; margin-left: 66px; overflow: hidden;}
.down .qrcode{float: left; width: 164px; height: 164px; position: relative; background: #fff; margin: 26px 0 0 81px;}
.down .down_btn{width: 206px; float: right; margin: 25px 24px 0 0;}
.down .down_btn a{display: block; height: 50px; line-height: 50px; text-align: center; background: url('../images/down_btn.jpg') no-repeat left top; margin-bottom: 8px; font-size: 18px;}
.down .down_btn a:nth-child(even){background-position: left bottom;}
.down .down_btn a:hover{background-position-x: -206px;}
*/
.down_list{width: 470px;height: 194px; padding: 10px 0 0 30px; background: url('../images/down2.png') no-repeat; margin-left: 72px; overflow: hidden;}
.btn_ios,.btn_simulator,.btn_android,.btn_desktop{float: left; width: 202px; height: 84px; margin: 0 14px 2px 0; background: url('https://wp-1302647192.cos.ap-nanjing.myqcloud.com/uploads/69cb32e811d95_1774924520.png') no-repeat -9999px;}
.btn_ios{background-position: 0 0;}
.btn_ios:hover{background-position: 0 -179px;}
.btn_android{background-position: 0 -86px;}
.btn_android:hover{background-position: 0 -265px;}
.btn_simulator{width: 219px;background-position: -217px 0;}
.btn_simulator:hover{background-position: -217px -179px;}
.btn_desktop{width: 219px;background-position: -217px -86px;}
.btn_desktop:hover{background-position: -217px -265px;}
.banner{width: 600px;height: 300px;position: relative;margin-top: 27px;background: #fff;}
.banner .swiper-container{height:300px;overflow:hidden;width:100%}
.banner a{display:block}
.banner_nav{height:30px;position: absolute;bottom: 0;left: 0; width: 100%;z-index: 10;background:#0f1425;display: -webkit-box;display: -webkit-flex;display: flex;}
.banner_nav span{line-height:30px;text-align:center;color: #775d4f;flex: 1;cursor: pointer; font-family: 'Microsoft YaHei';}
.banner_nav .cur{background:#0b163b; color: #b9b9bb;}
.news{width: 520px;height: 290px; padding: 0 30px 10px; position: absolute;bottom: 25px;right: 0; font-family: 'Microsoft YaHei'; background: url('../images/news.jpg') no-repeat;}
.news_tab{height: 62px; position: relative; border-bottom: 1px solid #25252d;}
.news_tab .more{color: #2348be; font-size: 12px; float: right; line-height: 60px;}
.news_tab span{float: left;width: 90px;height: 62px;line-height: 58px;text-align: center;color: #b8b8b8;font-size:20px;cursor: pointer;position: relative;}
.news_tab .cur{font-weight: bold;}
.news_tab .cur::after{content: '';position: absolute; left: 0; bottom: 1px; height: 9px;width: 90px;background: url('../images/news_link.png') no-repeat;}
.news_cont{height: 210px;overflow: hidden;margin-top: 17px;position: relative;}
.recommend{background: #1f306b; overflow: hidden; line-height: 30px; height: 30px; margin-bottom: 10px;}
.recommend span{float: left;position: relative;padding: 0 15px; margin-right: 20px; font-size: 14px; font-weight: bold; background: #0b163b; color: #b8b9bb;}
.recommend span::before{content: ''; border: 4px solid #0b163b;position: absolute;right: -8px;top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent;}
.recommend a{color: #8aa3ef;}
.news_cont ul{width: 100%;position: absolute;top: 0; left: 0;display: none;}
.news_cont ul.on{display: block;}
.news_cont li{width: 100%; line-height: 36px; height: 36px; position: relative;}
.news_cont li:last-child{border: none;}
.news_cont li .title{width: 440px; float: left; text-overflow: ellipsis;white-space: nowrap;overflow: hidden; color: #827569;}
.news_cont li .time,.content .list .time{float: right; color: #77655b;}
.news_cont li a:hover .title,.recommend a:hover{color: #b8b8b8;}
.part2{background: url('../images/p2.jpg') no-repeat center top;}
.part2 .main{height: 992px;}
.part2 .more{position: absolute; left: 739px;top:22px;font-size: 12px; color: #b8b8b8; display: inline-block; text-transform: uppercase; font-family: 'Microsoft YaHei';}
.part2 .more:hover{text-decoration: underline;}
.game_customer{padding-top: 70px; position: relative;height: 140px;z-index: 10;}
.game_customer .item{float: left; margin-right: 20px; width: 141px; height: 140px;-webkit-transition: all .2s linear;transition: all .2s linear;}
.game_customer .item:hover{-webkit-transform: translateY(-5px); transform: translateY(-5px); box-shadow: 0 10px 10px rgba(0, 0, 0, .2);}
.service{width: 450px; height: 192px; background: url('../images/service.png') no-repeat; position: absolute; top: 18px; right: -54px;}
.service .qrcode{width: 106px; height: 106px; float: left; margin: 68px 0 0 46px;}
.service_btn{margin: 65px 0 0 10px; float: left; text-align: center;}
.service_btn a{display: block; font-size: 16px; width: 108px; height: 38px; background: url('../images/service_btn.jpg') no-repeat; margin-top: 12px;}
.service_btn a:hover{background-position: center bottom;}
.role{height: 650px; margin-top: 80px; position: relative;}
.role_tab{position: absolute; left: 0; top: 90px; z-index: 10;}
.role_tab li{width: 339px; cursor: pointer; height: 110px; margin-bottom: 15px; background: url('../images/role_tab.png') no-repeat -999px; font-size: 0; overflow: hidden; text-indent: -999px;}
.role_tab li:nth-child(1){background-position: 0 0;}
.role_tab li:nth-child(2){background-position: 0 -124px;}
.role_tab li:nth-child(3){background-position: 0 -249px;}
.role_tab li:nth-child(4){background-position: 0 -373px;}
.role_tab li.cur{background-position-x: -339px;}
.role_cont{height: 650px; width: 1140px; margin-left: 60px;}
.role_cont .item{position: relative; height: 650px;  display: none;}
.role_img{position: absolute; bottom: 0; left: 0; width: 100%; -webkit-animation: fadeInLeft .5s forwards 300ms 0 ease;-moz-animation: fadeInLeft .5s forwards 300ms 0 ease;-ms-animation: fadeInLeft .5s forwards 300ms 0 ease;animation: fadeInLeft .5s forwards 300ms 0 ease;-moz-animation: fadeInLeft .5s forwards;-webkit-animation: fadeInLeft .5s forwards;-o-animation: fadeInLeft .5s forwards;-ms-animation: fadeInLeft .5s forwards;}
@-webkit-keyframes fadeInRIght{0%{-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0);-webkit-transform:translateX(10%);-moz-transform:translateX(10%);-ms-transform:translateX(10%);-o-transform:translateX(10%);transform:translateX(10%)}100%{-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100);-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}}
@-moz-keyframes fadeInRIght{0%{-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0);-webkit-transform:translateX(10%);-moz-transform:translateX(10%);-ms-transform:translateX(10%);-o-transform:translateX(10%);transform:translateX(10%)}100%{-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100);-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}}
@-ms-keyframes fadeInRIght{0%{-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0);-webkit-transform:translateX(10%);-moz-transform:translateX(10%);-ms-transform:translateX(10%);-o-transform:translateX(10%);transform:translateX(10%)}100%{-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100);-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}}
@-o-keyframes fadeInRIght{0%{-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0);-webkit-transform:translateX(10%);-moz-transform:translateX(10%);-ms-transform:translateX(10%);-o-transform:translateX(10%);transform:translateX(10%)}100%{-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100);-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}}
@keyframes fadeInRIght{0%{-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0);-webkit-transform:translateX(10%);-moz-transform:translateX(10%);-ms-transform:translateX(10%);-o-transform:translateX(10%);transform:translateX(10%)}100%{-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100);-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}}
@-webkit-keyframes fadeInLeft{0%{-webkit-transform:translateX(-10%);-moz-transform:translateX(-10%);-ms-transform:translateX(-10%);-o-transform:translateX(-10%);transform:translateX(-10%);-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0)}100%{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100)}}
@-moz-keyframes fadeInLeft{0%{-webkit-transform:translateX(-10%);-moz-transform:translateX(-10%);-ms-transform:translateX(-10%);-o-transform:translateX(-10%);transform:translateX(-10%);-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0)}100%{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100)}}
@-ms-keyframes fadeInLeft{0%{-webkit-transform:translateX(-10%);-moz-transform:translateX(-10%);-ms-transform:translateX(-10%);-o-transform:translateX(-10%);transform:translateX(-10%);-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0)}100%{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100)}}
@-o-keyframes fadeInLeft{0%{-webkit-transform:translateX(-10%);-moz-transform:translateX(-10%);-ms-transform:translateX(-10%);-o-transform:translateX(-10%);transform:translateX(-10%);-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0)}100%{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100)}}
@keyframes fadeInLeft{0%{-webkit-transform:translateX(-10%);-moz-transform:translateX(-10%);-ms-transform:translateX(-10%);-o-transform:translateX(-10%);transform:translateX(-10%);-webkit-opacity:0;-moz-opacity:0;opacity:0;filter:alpha(opacity=0)}100%{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-opacity:1;-moz-opacity:1;opacity:1;filter:alpha(opacity=100)}}
.skill{width: 82px; height: 82px; position: absolute; text-align: center; cursor: pointer;}
.ico{display: block; width: 82px; height: 82px;  opacity: 0; -webkit-transform: scale(.8); -moz-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8); -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -o-transition: all .2s linear; transition: all .2s linear; background: url('../images/skill.png') no-repeat -999px; border-radius: 50px;}
.text{position: absolute; top: 80px; left: 50%; width: 230px; margin-left: -115px;  text-shadow: 0 0 13px rgba(9, 20, 48, .95); display: none; transition: top .2s linear;}
.text p{font-family: 'Microsoft YaHei';font-size: 12px; line-height: 16px;}
.text .tit{font-size: 22px; color: #f5b64d;}
.skill:hover .text{display: block; top: 80px;}
.skill:hover .ico{opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}
.s1,.s4,.s7,.s10{left: 278px; bottom: 306px;}
.s2,.s5,.s8,.s11{left: 363px; bottom: 161px;}
.s3,.s6,.s9,.s12{left: 542px; bottom: 82px;}
.s3 .text,.s5 .text{width: 260px; margin-left: -130px;}
.s1 .ico{background-position: 0 0;}
.s2 .ico{background-position: -92px 0;}
.s3 .ico{background-position: -184px 0;}
.s4 .ico{background-position: 0 -92px;}
.s5 .ico{background-position: -92px -92px;}
.s6 .ico{background-position: -184px -92px;}
.s7 .ico{background-position: 0 -184px;}
.s8 .ico{background-position: -92px -184px;}
.s9 .ico{background-position: -184px -184px;}
.s10 .ico{background-position: 0 -276px;}
.s11 .ico{background-position: -92px -276px;}
.s12 .ico{background-position: -184px -276px;}
.character{width: 313px; padding: 134px 7px 0 30px; font-size: 16px; line-height: 32px; position: absolute; top: 60px; right: 5px; background: url('../images/character.png') no-repeat; -webkit-opacity: 1;-moz-opacity: 1; opacity: 1; filter: alpha(opacity=100);-moz-animation: fadeInRIght .6s forwards; -webkit-animation: fadeInRIght .6s forwards; -o-animation: fadeInRIght .6s forwards; -ms-animation: fadeInRIght .6s forwards; animation: fadeInRIght .6s forwards;}
.star{display: -webkit-box;display: -webkit-flex;display: flex; align-items: center; margin-bottom: 12px;}
.star i{width: 16px; height: 15px; background: url('../images/star.png') no-repeat; margin-right: 3px;}
.part3{background: url('../images/p3.jpg') no-repeat center top;}
.part3 .main{height: 846px; overflow: hidden;}
.feature{width: 1034px; margin: 195px auto 0;}
.feature .swiper-slide{width: 428px; height: 572px;}
.prev,.next{position: absolute;top:426px;width: 56px;height: 62px; z-index: 10;cursor: pointer; background: url('../images/pn.png') no-repeat;}
.prev{left: 22px;}
.next{right: 22px; -webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-o-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg);}
.pagination{text-align: center;margin-top: 18px;}
.pagination span{display: inline-block;width: 18px; height: 18px; background: #fff; border-radius: 10px; opacity: 1; margin: 0 7px;}
.pagination .swiper-pagination-bullet-active{background: #fff060;}
.side{position: fixed; right: 50px; top: 50%; margin-top: -207px; color: #cfcfcf; text-align: center; width: 220px; height: 387px; background: url('../images/side.png') no-repeat center top / 220px auto; z-index: 10; overflow: hidden;}
.side_tit{font-size: 22px; padding-top: 35px;}
.side .qrcode{width: 150px; height: 150px; border: 1px solid #3d475d; margin: 20px auto 16px;}
.side .qrcode img{display: block;}
.side p{font-size:18px; font-weight: normal;}
.service_link{display: inline-block; margin-top: 8px; width: 180px; height: 53px; background: url('../images/kf_btn.jpg') no-repeat center top / 180px auto; font-size: 0;}
.service_link:hover{background-position: left bottom;}
