* {
  margin: 0;
  padding: 0;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
  outline: none;
}
i,
em {
  font-style: normal;
}
button {
  border: 0;
  cursor: pointer;
}
body {
  font-family: 'Microsoft YaHei', 'Helvetica Neue', Arial, HelveticaNeue,
    Helvetica, 'BBAlpha Sans', sans-serif;
  font-size: 14px;
  position: relative;
  background: #fff;
}
.icons {
  background: url(../images/icons.png) no-repeat;
}

.topFix {
  position: fixed;
  top: 0;
  z-index: 13;
  width: 100%;
  height: 77px;
  background: #fff;
  background-size: cover;
/*   background-color: rgba(0, 0, 0, 0.7); */
}
.logo {
  position: absolute;
  top: 12px;
  left: 36px;
  display: block;
  display: flex;
  align-items: center;
  font-size: 27px;
  color: #fff;
}
.logo img {
  width: 128px;
}
.home-title {
  position: absolute;
  top: 30px;
  left: 210px;
  font-size: 18px;
  color: #757575;
}
.home-title::before {
  content: '';
  display: block;
  position: absolute;
  left: -22px;
  top: -3px;
  width: 2px;
  height: 30px;
  background: #dedede;
}
.top_menu {
  position: absolute;
  top: 30px;
  right:32px;
  display: flex;
}
.wxgzh {
  width: 34px;
  height: 29px;
  position: relative;
  cursor: pointer;
  background-position: 0 0;
}
.wxsq {
  width: 35px;
  height: 29px;
  cursor: pointer;
  margin: 0 50px 0 41px;
  position: relative;
  box-sizing: border-box;
  background-position: 0 -50px;
}
.wxsq::before {
  content: '';
  display: block;
  position: absolute;
  left: -21px;
  top: -3px;
  width: 2px;
  height: 30px;
  background: #dedede;
}
.menu_icon {
  width: 34px;
  height: 29px;
  background-position: 0 -90px;
}
.top_menu img {
  position: absolute;
  display: none;
  top: 0;
  right: 142px;
  width: 132px;
}
.top_menu .wxgzh_img {
  position: absolute;
  top: 68px;
  left: -47px;
}
.wxgzh:hover .wxgzh_img {
  display: block;
}
.wxsq:hover .qwxq_img {
  display: block;
}
.top_menu .qwxq_img {
  position: absolute;
  top: 68px;
  left: -47px;
}
.menu_box {
  position: fixed;
  z-index: 12;
  top: 77px;
  left: 50%;
  width: 1920px;
  margin-left: -960px;
  height: 500px;
 /*  background: url(../images/menu_bg.jpg) no-repeat top center; */
  background: #3d984f;
  transform: translateY(-100%);
  transition: transform .3s;
  -webkit-transition: transform .3s;
  -moz-transition: transform .3s;
  -ms-transition: transform .3s;
  -o-transition: transform .3s;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
}
.menu_box.close {
  transform: translateY(0);
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
}
.menu_close {
  width: 37px;
  height: 37px;
  cursor: pointer;
  position: absolute;
  right: 65px;
  top: 36px;
  background: url(../images/close.png) no-repeat;
}
.menu-icon {
  width: 246px;
  height: 68px;
  background-position: 0 -207px;
  position: absolute;
  left: 220px;
  top: 83px;
}
.zero-icon {
  width: 458px;
  height: 424px;
  background: url(../images/zero.png) no-repeat;
  position: absolute;
  position: absolute;
  right: 415px;
  top: 55px;
}
.menu_main {
 /*  padding: 130px 0 0 480px; */
}
.menu_main ul {
  height: 400px;
  margin-top: 83px;
  margin-left: 535px;
}
.menu_main ul li {
  max-width: 416px;
  margin-bottom: 55px;
  font-weight: bold;
  cursor: pointer;
  position: relative;
  padding-left: 0;
  transition: all .5s;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -ms-transition: all .5s;
  -o-transition: all .5s;
}
.menu_main ul li span:first-child {
  font-size: 24px;
  color: #ffffff;
}
.menu_main ul li span:last-child {
  font-size: 16px;
  color: #91d49e;
  padding-left: 39px;
}
.menu_main ul li:hover {

}
.menu_main ul li.focus {
  padding-left: 36px;
  transition: all .5s;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -ms-transition: all .5s;
  -o-transition: all .5s;
}
.menu_main ul li.focus::before {
  content: ' ';
  display: block;
  width: 30px;
  height: 28px;
  left: -11px;
  top: 3px;
  position: absolute;
  background: url(../images/sr_icon.png) no-repeat;
}
.menu_main ul li.focus span:first-child {
  color: #ffe042;
}
.menu_main ul li.focus span:last-child {
  color: #d2cc46;
}
.game-ty {
  position: absolute;
  display: flex;
  right: 89px;
  bottom: 93px;
  z-index: 4;
}
.ageTip {
  margin-left: 8px;
}
.game-ty-img img {
  width: 117px;
}
.ageTip img {
  width: 110px;
}

.bottom {
  background: #57b769;
}
.public_footer {
  background: #57b769 !important;
}

.copy_right {
  width: 800px;
  margin: 0 auto;
  color: #a1eaae;
  background: #57b769;
  font-size: 14px;
  line-height: 28px;
  padding-bottom: 25px;
}

.copy_right a {
  font-size: 14px;
  color: #a1eaae;
}

/* .content,
.tit {
  transition: all .3s linear;
  opacity: 0;
}

.ani {
  -webkit-animation: fadeInAni .6s linear forwards;
}

@keyframes fadeInAni {
  0% {
    opacity: 0;
    transform: translateY(100px)
  }

  100% {
    opacity: 1;
    transform: translateY(0)
  }
} */
.hero-name-icons {
  background: url(../images/hero_name_icons.png) no-repeat;
}

.hero-type_sh {
  background-position: 0 0;
}
.hero-type_cs {
  background-position: 0 -65px;
}
.hero-type_ss {
  background-position: 0 -130px;
}
.hero-type_xy {
  background-position: 0 -195px;
}
.hero-type_pt {
  background-position: 0 -260px;
}

.sh_roleIocns {
  background: url(../images/sh_icons.png) no-repeat;
}
.cs_roleIocns {
  background: url(../images/cs_icons.png) no-repeat;
}
.ss_roleIocns {
  background: url(../images/shishi_icons.png) no-repeat;
}
.xy_roleIocns {
  background: url(../images/xy_icons.png) no-repeat;
}
.pt_roleIocns {
  background: url(../images/pt_icons.png) no-repeat;
}


.icon_spts {
  background-position: -38px -104px;
}
.icon_mrnj {
  background-position: -184px -104px;
}
.icon_cxzl {
  background-position: -331px -104px;
}
.icon_htbk {
  background-position: -477px -104px;
}
.icon_dd {
  background-position: -624px -104px;
}
.icon_db {
  background-position: -770px -104px;
}
.icon_slzs {
  background-position: -917px -104px;
}
.icon_lm {
  background-position: -1063px -104px;
}
.icon_xmsf {
  background-position: -38px -293px;
}
.icon_swk{
  background-position: -184px -293px;
}
.icon_ayls {
  background-position: -331px -293px;
}
.icon_ym {
  background-position: -477px -293px;
}
.icon_l {
  background-position: -624px -293px;
}
.icon_jdm {
  background-position: -770px -293px;
}
.icon_bn {
  background-position: -917px -293px;
}
.icon_jr {
  background-position: -1063px -293px;
}
.icon_mlbt {
  background-position: -38px -483px;
}
.icon_lh {
  background-position: -184px -483px;
}
.icon_srss {
  background-position: -331px -483px;
}
.icon_blxz {
  background-position: -477px -483px;
}
.icon_wjds {
  background-position: -624px -483px;
}
.icon_jh {
  background-position: -770px -483px;
}
.icon_cs {
  background-position: -917px -483px;
}
.icon_qwwz {
  background-position: -1063px -483px;
}
.icon_fkll {
  background-position: -38px -673px;
}
.icon_bszz{
  background-position: -184px -673px;
}
.icon_kpbl{
  background-position: -331px -673px;
}
.icon_bnz{
  background-position: -477px -673px;
}
/* 传说英雄 */
.icon_srm {
  background-position: -37px -96px;
}
.icon_sqs {
  background-position: -183px -96px;
}
.icon_hys {
  background-position: -328px -96px;
}
.icon_zsj {
  background-position: -474px -96px;
}
/* 史诗英雄
 */
.icon_xs {
  background-position: -36px -91px;
}
.icon_dctk{
  background-position: -182px -91px;
}
.icon_ds{
  background-position: -328px -91px;
}
.icon_ar{
  background-position: -474px -91px;
}
.icon_lr{
  background-position: -622px -91px;
}
/* 稀有英雄 */
.icon_hqr {
  background-position: -37px -87px;
}
.icon_xem {
  background-position: -183px -87px;
}
.icon_gcs {
  background-position: -330px -87px;
}
.icon_xz {
  background-position: -476px -87px;
}
.icon_sx {
  background-position: -623px -87px;
}
/* 普通英雄 */
.icon_sr {
  background-position: -36px -87px;
}
.icon_sys {
  background-position: -183px -87px;
}
.icon_zs {
  background-position: -330px -87px;
}
.icon_zdb {
  background-position: -476px -87px;
}
.icon_gjs {
  background-position: -623px -87px;
}

.clear{clear:both;height: 0;overflow: hidden;}
.public_footer{background:#57b769;color:#a1eaae;line-height:20px;/* padding-bottom: 20px; */font-size: 12px;}
.public_footer_cent{background:url(/images//logo.png?v=1) no-repeat 0 50px;padding-left:200px;width:800px;margin:0 auto;position: relative;padding: 40px 0 40px 200px;color:#a1eaae;}
.public_footer ,.public_footer a{ color:#ccfab5;}
.public_footer a:hover{ color:#ccfab5; text-decoration:underline;}
.public_footer span{ display:block;}
.public_footer_tips{background: #2b3145;text-align: center;height: 37px;line-height: 37px;border-bottom: 1px solid #505668;border-top: 1px solid #545a6d;font-size: 14px;color: #9ea4b4}
.dzIcon{background:url(https://img.ssl.q1.com/ws/images/common/dzIcon.png?v=1);width:41px;height:47px;position: absolute;top:50px;right:30px;}