.wraper {
  position: relative;
  min-width: 1200px;
  overflow: hidden;
}
.wraper .gwTop {
  width: 100%;
  height: 60px;
  text-align: center;
  padding-top: 5px;
  background-color: #fff;
  font-size: 16px;
}
.wraper .gwTop .gw_list {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 220px;
  height: 60px;
  color: #fff;
  background: #56C026;
  vertical-align: middle;
  line-height: 60px;
  cursor: pointer;
}
.wraper .gwTop .downApp {
  line-height: 60px;
  display: block;
  width: 220px;
  height: 60px;
  border-left: 1px #ddd solid;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}
.wraper .mainBannerBox{
  width: 100%;
  margin-top: -11px;
  height: 1011px;
  background-image: url(../images/main_banner.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding-top: 590px;
}

.mainBannerBox .mainPlayer{
  width: 446px;
  height: 102px;
  left:38%;
  padding-top: 11px;
  background-image: url(../images/main_player_contain.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.mainPlayerContain {
  width: 36px;
  height: 44px;
  margin: 0 auto;
}
.mainPlayerContain img {
  width: 100%;
  position: relative;
}
.mainPlayer .btn{
  width: 100px;
  height: 100px;
  position: absolute;
  display: block;
  left: 50%;
  margin-left: -39px;
}
.mainPlayer .btn img{
  width: 80px;
  height: 80px;
}
@keyframes myRotate
{
  0% {transform: rotate(0deg)}
  50%{
    transform: rotate(180deg)
  }
  100% {transform: rotate(360deg)}
}
 
@-webkit-keyframes myRotate /* Safari 与 Chrome */
{
  0% {transform: rotate(0deg)}
  50%{
    transform: rotate(180deg)
  }
  100% {transform: rotate(360deg)}
}
.mainPlayer .btn1{
  z-index: 100;
}
.mainPlayer .btn1 img{
  animation: myRotate 2s infinite linear;
}
.mainPlayer .btn1 img:hover{
  animation: myRotate 2s infinite linear;
  animation-play-state:paused;
  -webkit-animation-play-state:paused; /* Safari 和 Chrome */
}
.mainBannerBtns {
  position: absolute;
  left: 54%;
  transform: translate(-50%, 0);
  margin-top: 5px;
}
.mainBannerBtns .downloadAndroid{
  background-image: url(../images/main_banner_android.png);
  margin-top: 15px;
}
.mainBannerBtns .downloadIOS{
  background-image: url(../images/main_banner_ios.png);
}
.main_code{
  position: absolute;
  left: -145px;
  top: 7px;
}
.mainBannerBtns .download{
  width: 229px;
  height: 66px;
  display: block;
  margin-top: 6px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.mulTitle{
  width: 1200px;
  margin: 0 auto;
  height: 70px;
}
.mulTitle.newsTitle {
  margin-top: 120px;
}
.videoTitle{
  margin-top: 94px;
}
.mulTitle img {
  width: 100%;
}
.newsContain{
  width: 1235px;
  background: url('../images/news_outer.png') top center no-repeat;
  background-size: cover;
  height: 394px;
  margin: 54px auto 0;
  padding: 13px 17px  0 18px;
}
.wraper .body {
  background: url("../images/body_bg_1.png") 0 0 no-repeat,url("../images/body_bg_2.jpg") center 150px no-repeat;
  min-height: 1500px;
  width: 100%;
  position: relative;
  z-index: 3;
  margin-top: -50px;
}
.wraper .body .navbox {
  height: 93px;
  background-color: rgba(30, 2, 0, 0.3);
  border-bottom: 1px #C48270 solid;
}
.wraper .body .navbox > div {
  width: 1100px;
  margin: 0 auto;
}
.wraper .body .navbox .game {
  margin-right: 30px;
  vertical-align: middle;
}
.wraper .body .navbox .nav {
  width: 900px;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
}
.wraper .body .navbox .nav li {
  float: left;
  padding-top: 15px;
  width: 150px;
}
.wraper .body .navbox .nav li a {
  display: block;
  text-align: center;
  color: #fff;
  font-size: 18px;
}
.wraper .body .navbox .nav li a span {
  font-size: 12px;
}
.wraper .body .navbox .nav li.active a {
  font-weight: bold;
}
.wraper .body .mulBox .mul_left {
  width: 200px;
  background: #000;
}
.wraper .body .mulBox .mul_left .and {
  margin-top: 5px;
  margin-bottom: 6px;
}
.wraper .body .mulBox .mul_left a {
  display: block;
}
.wraper .body .mulBox .mul_left img {
  display: block;
  width: 100%;
  height: auto;
}
.wraper .body .mulBox .tabsbox {
  background: url('../images/bannerbg.png') center no-repeat;
  background-size: contain;
  width: 600px;
  float: left;
  height: 376px;
  padding-bottom: 25px;
}
.wraper .body .mulBox .tabsbox .tabs > ul > li {
  float: left;
  display: inline-block;
  width: 120px;
  height: 60px;
  padding: 15px;
  border-top: 5px transparent solid;
  text-align: center;
  font-size: 18px;
  cursor: pointer;
  color: #EFCE9A;
  font-weight: bold;
}
.wraper .body .mulBox .tabsbox .tabs > ul > li.active {
  border-top: 5px #4B3F2E solid;
}
.wraper .body .mulBox .tabsbox .tabs a {
  float: right;
  margin-top: 22px;
  margin-right: 27px;
  display: inline-block;
  color: #EFCE9A;
  font-size: 18px;
}
.wraper .body .mulBox .newsContent {
  height: 280px;
  overflow: hidden;
  padding: 0 15px;
}
.wraper .body .mulBox .newsContent .recommend {
  text-align: left;
  background: rgba(0, 0, 0, 0.24);
  padding: 0 20px;
  height: 46px;
  width: 560px;
  margin: 0 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 16px;
}
.wraper .body .mulBox .newsContent .recommend > a {
  display: inline-block;
  font-weight: bold;
  color: #EFCE9A;
  font-size: 18px;
  line-height: 46px;
}
.wraper .body .mulBox .newsContent .recommend .tips {
  display: inline-block;
  background: url('../images/recommend_bg.png') center no-repeat;
  background-size: contain;
  width: 57px;
  height: 25px;
  color: #4C4639;
  font-size: 16px;
  margin-right: 15px;
  line-height: 25px;
  text-align: center;
}
.wraper .body .mulBox .newsContent .news_ul {
  display: none;
}
.wraper .body .mulBox .newsContent .news_ul > li {
  padding: 4px 0;
}
.wraper .body .mulBox .newsContent .news_ul > li a {
  display: inline-block;
  width: 380px;
  color: #EFCE9A ;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 400;
}
.wraper .body .mulBox .newsContent .news_ul > li span {
  font-size: 14px;
  color: #EFCE9A ;
  float: right;
}


/* ----------------------------------------------------------- */

 .wraper .body .mulBox .strategyBox {
  display: flex;
  width: 1220px;
  height: 224px;
  margin: 8px auto 123px;
  overflow: hidden;
  justify-content: center;
  align-items: flex-end;
} 
.strategyBox .stra_box1{
  width: 380px;
  height: 224px;
  background:url('../images/strategy1.png') center no-repeat;
  background-size: contain;
  margin-right: 41px;
  position: relative;
}

.box_text {
  display: block;
  width: 121px;
  height: 40px;
  font-size: 30px;
  font-weight: bold;
  color: #C09D66;
  position:absolute;
  top: 96px;
  right: 33px;
}

.box_moreDetail {
  display: block;
  width: 137px;
  height: 32px;
  background: url('../images/detail_bg.png') center no-repeat;
  background-size: contain;
  overflow: hidden;
  position: absolute;
  top: 150px;
  right: 23px;
}

.box_moreDetail>span {
  display: block;
  width: 64px;
  height: 15px;
  background: url('../images/detail_text.png') center no-repeat;
  background-size: contain;
  margin: 8px 37px 9px 36px;
}

.strategyBox .stra_box2{
  width: 379px;
  height: 202px;
  background:url('../images/strategy2.png') center no-repeat;
  background-size: contain;
  margin-right: 41px;
  position: relative;
}

.strategyBox .stra_box2 .box_text {
  top: 74px;
  right: 33px;
}

.strategyBox .stra_box2 .box_moreDetail {
  top: 127px;
}

.strategyBox .stra_box3{
  width: 379px;
  height: 217px;
  background:url('../images/strategy3.png') center no-repeat;
  background-size: contain;
  position: relative;
}

.strategyBox .stra_box3 .box_text {
  top: 89px;
  right: 33px;
}

.strategyBox .stra_box3 .box_moreDetail {
  top: 143px;
}


.wraper .body .linkBox {
  width: 930px;
  margin: 0 auto;
  text-align: center;
  padding-bottom: 60px;
}
.wraper .body .linkBox .link {
  display: inline-block;
  width: 133px;
  height: 33px;
  border: 1px solid rgba(255, 196, 98, 0.2);
  color: #966E47;
  line-height: 30px;
  text-align: center;
  margin-bottom: 20px;
}
.wraper .body .linkBox a {
  display: inline-block;
  color: #7E5439;
  font-size: 14px;
  padding: 5px 10px;
}
.banner {
  width: 600px;
  height: 376px;
}
.banner .swiper-slide img {
  display: block;
  width: 100%;
}
.banner-pagination {
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  bottom: 0!important;
  z-index: 2;
  height: 40px;
  line-height: 40px;
  padding-left: 20px;
}
.banner-pagination span {
  border-radius: 0;
  transform: rotate(45deg);
}
.swiperbox {
  width: 778px;
  height: 490px;
}
.swiper-pagination-bullet {
  opacity: 1;
  background-color: #ECD39C;
}
.swiper-pagination-bullet-active {
  background-color: #FF5C00 !important;
}
.icon-list {
  width: 19px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  background: url('../images/icon-list.png') top center no-repeat;
  background-size: contain;
}
.icon-app {
  width: 30px;
  height: 30px;
  display: inline-block;
  vertical-align: middle;
  background: url('../images/icon-app.png') top center no-repeat;
  background-size: contain;
}
.logo1 {
  background: url('../images/logo1.png') top center no-repeat;
  background-size: contain;
  width: 155px;
  height: 47px;
  display: inline-block;
}
.icon-hot {
  background: url('../images/hot.png') center no-repeat;
  background-size: contain;
  width: 24px;
  height: 24px;
  display: inline-block;
  vertical-align: middle;
}
.icon-time {
  background: url('../images/time.png') center no-repeat;
  background-size: contain;
  width: 24px;
  height: 24px;
  vertical-align: middle;
  display: inline-block;
}
/* .game {
  background: url('../images/game.png') top center no-repeat;
  background-size: contain;
  width: 164px;
  height: 86px;
  display: inline-block;
} */
.tip_cheng {
  font-size: 12px;
  color: #fff;
  padding: 1px 2px;
  background-color: #FFA200;
}
.tip_lan {
  font-size: 12px;
  color: #fff;
  padding: 1px 2px;
  background-color: #00D3D6;
}
.tip_lv {
  font-size: 12px;
  color: #fff;
  padding: 1px 2px;
  background-color: #79C600;
}
.tip_red {
  font-size: 12px;
  color: #fff;
  padding: 1px 2px;
  background-color: #C70000;
}
.tip_black {
  font-size: 12px;
  color: #fff;
  padding: 1px 2px;
  background-color: #4E4E4E;
}
.flag {
  background: url('../images/flag.png') center no-repeat;
  background-size: contain;
  width: 237px;
  height: 334px;
  position: fixed;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  text-align: center;
  padding-top: 40px;
}
.flag img {
  width: 148px;
  height: 148px;
}

/* 新增 */
.top {
  height: 105px;
  width: 100%;
  background-image: url(../images/top_bg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 2;
}
.top-inner{
  width: 1200px;
  margin: 0 auto;
  padding: 30px 30px 0;
  position: relative;
}
.top-inner .item{
  padding: 0 30px;
  font-size: 18px;
  height: 28px;
  line-height: 28px;
  color: #fff4db;
  float: left;
}
.top-inner .item.checked{
  color: #F88048;
  font-weight: bold;
}
.top-inner .item img{
  height: 8px;
  display: block;
  margin: 4px auto;
}
.slantingBar {
  float: left;
}
.slantingBar img{
  height: 33px;
  margin-top: 7px;
}
.fr{
  float: right;
}
.logoBox{
  width: 230px;
  padding-right: 1px;
  position: absolute;
  top: 0;
  left: 40%;
  z-index: 2;
  /*margin-left: -86px;*/
}
.logoBox img{
  width: 100%;
}
.fixed{
  width: 233px;
  height: 341px;
  background: url('../images/fixed_bg.png') no-repeat top center ;
  background-size: cover;
  position: fixed;
  bottom: 50px;
  left: calc(50%  + 667px);
  z-index: 10000;
  padding-top: 17px;
}
.fixed .ewm {
  width: 157px; 
  height: 158px;
  display: block;
  margin: 0 auto;
  display: block;
}
.fixed .name{
  color: #fff;
  text-align: center;
  font-size: 18px;
  line-height: 40px;
  margin-bottom: 14px;
}
.fixed .btn {
  width: 173px;
  height: 66px;
  display: block;
  background: url('../images/fixed_btn_bg.png') no-repeat top center;
  background-size: cover;
  font-size: 20px;
  text-align: center;
  line-height: 52px;
  color: #FED88D;
  margin: 0 auto;
  margin-top: -14px;
}
.w1200{
  width: 1200px;
  margin: 0 auto;
}
.videoContain{
  padding-left: 360px;
}
.videoBig{
  width: 779px;
  height: 441px;
  background: url('../images/video_bg.png') no-repeat top center;
  background-size: cover;
  padding: 18px 17px 4px 18px;
  position: relative;
  margin-top: 90px;
}
.videoBig .game{
  width: 744px;
  height: 419px;
  display: block;
}
.wraper .body .videoBig .play{
  width: 121px;
  height: 119px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -60px;
  margin-top: -55px;
}

.videoSmall{
  width: 236px;
  height: 132px;
  float: left;
  margin-top: 48px;
  margin-right: 5px;
  margin-left: 15px;
}
.videoSmall img{
  display: block;
  width: 100%;
}
.dataTitle{
  margin-top: 173px;
  margin-bottom: 65px;
}
.dataContain .dataMain{
  width: 837px;
  margin-left: 40px;
  height: 659px;
  padding-top: 1px;
  background: url('../images/data_bg.png') no-repeat top center;
  background-size: cover;
}
.dataContain .dataTitle{
  height: 63px;
  width: 266px;
  margin: 54px auto 20px;
  line-height: 63px;
  text-align: center;
  color: #FDDAB0;
  background: url('../images/data_title_bg.png') no-repeat top center;
  background-size: cover;
}
.dataContain .dataContent {
  font-size: 14px;
  color:#FDDAB0 ;
  line-height: 30px; 
  width: 670px;
  margin: 0 auto;
  height: 60px;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-bottom: 40px;
}
.skillList{
  width: 680px;
  padding-left: 9px;
  margin: 0 auto;
  border-bottom: 1px solid #725F4B;
  padding-bottom: 22px;
}
.skillList .skillItem{
  margin-right: 46px;
  float: left;
  width: 95px;
  position: relative;
}
.skillList .skillItem:last-child{
  margin-right: 0;
}
.skillItem .skillIcon{
  display: block;
  width: 95px;
  height: 96px;
}
.skillItem .skillActive{
  position: absolute;
  bottom: -22px;
  width: 9px;
  left: 50%;
  margin-left: -5px;
  display: none;
}
.skillItem.active .skillActive{
  display: block;
}
.skillTips{
  color: #fff;
  width: 690px;
  margin: 0 auto;
  font-size: 14px;
  line-height: 20px;
  padding-top: 26px;
  display: none;
}
.skillTips.active {
  display: block;
}
.dataLinks{
  padding-left: 79px;
  padding-top: 14px;
}
.dataLink{
  width: 207px;
  height: 66px;
  border: 1px solid #3E3B35;
  color: #FDDAB0;
  font-size: 20px;
  text-align: center;
  display: block;
  float: left;
  margin-right: 29px;
  line-height: 66px;
  background-color: #100a04;
  margin-top: 29px;
  text-decoration: underline;
}
.dataLink:hover{
  color: #F88048;
}
.featureTitle{
  margin-top: 181px;
  margin-bottom: 38px;
}
.feature .pc-slide{
  width: 904px;
  height: 580px;
  text-align: center;
  position: relative;
  margin: 0 auto;
  background-size: contain;
}
.feature .view{
  height: 580px;
}
.feature .swiper-container{
  height: 500px;
}
.view img {
  width: 770px;
}
.feature_01{
  text-align: center;
  width: 1400px;
}
:root{
  --swiper-theme-color: #000;
}
.feature .swiper-button-prev:after,.feature .swiper-container-rtl .swiper-button-next:after,
.feature .swiper-button-next:after,.feature .swiper-container-rtl .swiper-button-prev:after{
  display: none;
  content: '';
}
.feature .swiper-button-prev img,.feature .swiper-button-next img{
  width: 48px;
}
.feature .swiper-button-prev,.feature .swiper-container-rtl .swiper-button-next{
  left: -94px;
}
.feature .swiper-button-next,.feature .swiper-container-rtl .swiper-button-prev{
  right: -94px;
}
.footer{
  background-color: #1b1b1b;
}
.footer_nr{
  overflow: hidden;
  width: 1200px;
  margin: 0 auto;
  padding-bottom: 30px;
  padding-top: 20px;
}
.footer_01{
  float: left;
  width: 220px;
  margin-top: 15px;
}
.footer_01 img{
 width: 100%;
}
.footer_02 {
  width: 52px;
  margin-left: 50px;
  float: left;
}
.footer_02 img{
  width: 100%;
  margin-top: 25px;
}
.footer_03{
  width: 710px;
  float: right;
  font-size: 12px;
  color: #dcdcdc;
  line-height: 200%;
  text-align: left;
}


.mask{ background:#000; opacity:0.75!important; left:0;top:0; width:100%; height:100%; position:fixed;z-index:1000;display: none;}

.player{width:980px;height:551px;top:50%;left:50%;margin:-275.5px 0 0 -490px;z-index:19991;display:none;position:fixed;}
.player .close{width:50px; height:50px;background: url('../images/v_close.png') no-repeat 0 0;background-size:100% auto;bottom:-70px;left:465px;cursor:pointer;position:absolute;}
.player #video{width:100%;height:100%;object-fit:fill;cursor:pointer;top:0;left:0;bottom: 0;right:0;background:#000;z-index:191;position:absolute;}
.IIV::-webkit-media-controls-play-button,
.IIV::-webkit-media-controls-start-playback-button{opacity:0;pointer-events:none;width:5px;}
#bannerVideo{
  display: block;
  position: absolute;
  top: 105px;
  left: 50%;
  transform: translateX(-50%);
}