@charset "UTF-8";

:root {
  --active-color: #49b2fe;
  --main-color: #808080;
}

/* ================公共样式 开始================ */
/* 版心 */
.wp {
  position: relative;
  width: 1200px;
  margin: 0 auto;
}

/* 特定宽度 */
.w-215 {
  width: 215px;
}

.w-260 {
  width: 260px;
}

.w-285 {
  width: 285px;
}

.w-390 {
  width: 390px;
}

.w-790 {
  width: 790px;
}

.w-895 {
  width: 895px;
}

/* 特定 内上边距 */
.pt-460 {
  padding-top: 460px;
}

/* 特定 内外下边距 */
.mb-15 {
  margin-bottom: 15px;
}

.mb-30 {
  margin-bottom: 30px;
}

/* 特定 外左边距 */
.ml-15 {
  margin-left: 15px;
}

.ml-20 {
  margin-left: 20px;
}

/* 特定 5像素的边框 */
.br5 {
  border-radius: 5px;
  background-color: #fff;
}

#header,
#section,
#footer {
  width: 100%;
}

#section {
  position: relative;
}

#footer {
  background-color: #282928;
}

/* 公共标题 */
.com-title {
  margin-bottom: 20px;
}

.com-title .title {
  float: left;
  margin-right: 20px;
  font-size: 20px;
  color: #484848;
}

.com-title .title i {
  display: inline-block;
  width: 3px;
  height: 17px;
  background-color: #49b2fe;
  margin-right: 12px;
}

.com-title .more {
  display: block;
  float: right;
  height: 14px;
  padding-right: 17px;
  background: url(../images/com_more_btn.png) no-repeat right center;
  font-size: 12px;
  color: #b0afb1;
}

.com-title .more:hover {
  color: var(--active-color);
}

/* ================公共样式 结束================ */

/* 悬浮菜单 */

.fixed .list .item,
.fixed .list .item .pic,
.fixed .list .item .box {
  width: 46px;
  height: 46px;
}

.fixed {
  position: fixed;
  right: 0;
  bottom: 0;
  width: 46px;
  z-index: 999;
}

.fixed .list .item {
  position: relative;
  box-sizing: border-box;
  margin-bottom: 10px;
  background-color: #feda49;
  cursor: pointer;
}

.fixed .list .item .pic {
  overflow: hidden;
}

.fixed .list .item .pic img {
  transition: all 0.2s ease;
}

.fixed .list .item:hover .pic img {
  transform: translateX(-46px);
}

.fixed .list .item .box {
  position: absolute;
  left: 46px;
  top: 0;
  box-sizing: border-box;
  padding: 3px 5px;
  background-color: #dcdcdc;
  text-align: center;
  color: #484848;
  transition: all 0.2s ease;
}

.fixed .list .item .prop {
  display: none;
  position: absolute;
  right: 56px;
  top: 7px;
  padding: 5px;
  width: 200px;
  height: 22px;
  line-height: 22px;
  color: #484848;
  text-align: right;
  overflow: hidden;
  white-space: nowrap;
}

.fixed .list .item .prop span {
  padding: 5px;
  background-color: #dcdcdc;
}

.fixed .list .item .box-code {
  display: none;
  position: absolute;
  right: 56px;
  top: 0;
  width: 100px;
  height: 100px;
}

.fixed .list .item .box>a {
  color: #484848;
}

.fixed .list .item .box>a:hover {
  color: var(--active-color);
}

.fixed .list .item:hover .box {
  left: 0;
}

.fixed .list .item:hover .box,
.fixed .list .item:hover .prop,
.fixed .list .item:hover .box-code {
  display: block;
}


/* ==========================index首页 开始========================== */
/* 顶部小条 开始 */
#header .hd-top {
  width: 100%;
  height: 40px;
  line-height: 40px;
  background-color: #282828;
  font-size: 12px;
}

.hd-top a {
  float: left;
  font-family: PingFangSC-Regular;
  color: #c6c5c9;
}

.hd-top .tb-1,
.hd-top .tb-2 {
  position: relative;
  padding-left: 20px;
}

.hd-top .tb-1 i,
.hd-top .tb-2 i {
  position: absolute;
  left: 0;
  top: 12px;
  width: 14px;
  height: 13px;
  background: url(../images/top_btns.png) no-repeat center center;
  transition: all 0.2s ease;
}

.hd-top .tb-1 i {
  background-position: 0 0;
}

.hd-top .tb-2 i {
  background-position: -24px 0;
}

.hd-top .tb-1:hover i {
  background-position: 0 -22px;
}

.hd-top .tb-2:hover i {
  background-position: -24px -21px;
}

.hd-top .app {
  height: 40px;
}

.hd-top .app .icon {
  display: block;
  width: 26px;
  height: 26px;
  background: var(--active-color) url(../images/top_btn_3.png) no-repeat center center;
  border-radius: 4px;
  margin-right: 6px;
}

.hd-top .app .txt {
  box-sizing: border-box;
  display: block;
  width: 132px;
  height: 25px;
  line-height: 23px;
  padding: 0 35px 0 13px;
  border: 1px solid var(--active-color);
  border-radius: 4px;
  font-family: PingFangSC-Heavy;
  color: var(--active-color);
  background: url(../images/top_btn_4.png) no-repeat 102px center;
}

.hd-top .fr {
  position: relative;
}

.hd-top .fr span {
  float: left;
  margin: 0 7px;
  font-weight: bold;
}

.hd-top .all-list {
  background: #484748;
  padding: 0 10px;
}

.hd-top .all-list i {
  display: inline-block;
  width: 9px;
  height: 6px;
  margin-left: 10px;
  vertical-align: middle;
  margin-top: -3px;
  background: url(../images/top_btn_5.png) no-repeat center center;
}

.hd-top a:hover {
  color: var(--active-color);
}

.hd-top .all-list:hover {
  background-color: #3EB9FF;
  color: #fff;
}

.hd-top .all-list:hover i {
  background: url(../images/all_list_on_icon.png) no-repeat center center;
}

/* 所有游戏列表 */
.all-game-list {
  display: none;
  position: absolute;
  top: 40px;
  right: 0px;
  width: 690px;
  height: 245px;
  background-color: #fff;
  z-index: 9999;
}

.all-game-list .fl {
  box-sizing: border-box;
  width: 479px;
  height: 100%;
  padding: 25px 8px;
  border-right: 1px solid #d2d2d2;
}

.all-game-list .fl .com-title {
  border-bottom: 1px solid #d2d2d2;
}

.all-game-list .fl .com-title>a {
  display: block;
  float: right;
  height: 40px;
  line-height: 40px;
  background: none;
  font-size: 12px;
  color: #545454;
}

.all-game-list .fl .com-title>a:hover {
  color: var(--active-color);
  text-decoration: underline;
}

.all-game-list .fl .list {
  height: 134px;
  overflow: hidden;
}

.all-game-list .fl .list li {
  float: left;
  box-sizing: border-box;
  width: 25%;
  height: 40px;
  line-height: 40px;
  margin-bottom: 7px;
  padding: 0 20px;
  font-size: 12px;
  color: #5b5b5b;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.all-game-list .fl .list li a {
  color: #5b5b5b;
}

.all-game-list .fl .list li a i {
  display: inline-block;
  width: 10px;
  height: 11px;
  vertical-align: middle;
  margin-left: 5px;
}

.all-game-list .fl .list li a i.hot {
  background: url(../images/all_list_icon_hot.png) no-repeat center center;
}

.all-game-list .fl .list li a i.new {
  background: url(../images/all_list_icon_new.png) no-repeat center center;
}

.all-game-list .fl .list li a:hover {
  color: var(--active-color);
}

.all-game-list .fr {
  width: 210px;
  height: 100%;
}

.all-game-list .fr .pic {
  float: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.all-game-list .fr .pic img {
  width: 140px;
}


/* 顶部小条 结束 */

/* 导航栏 开始 */
#header #nav {
  height: 84px;
  background-color: #fff;
}

.logo,
.nav,
.nav li,
.nav li a,
.nav-box .nav-line i,
.search .search-input,
.search .search-btn {
  float: left;
}

.nav,
.nav li,
.nav li a {
  height: 85px;
}

/* logo图标 */
.logo {
  width: 192px;
  height: 63px;
  padding-top: 8px;
  overflow: hidden;
}

/* logo图标 结束 */

/* 导航栏样式 开始 */
.nav {
  margin-left: 40px;
  position: relative;
}

.nav li {
  width: 94px;
  text-align: center;
}

.nav li a {
  width: 100%;
  color: var(--main-color);
  font-size: 18px;
  line-height: 85px;

}

a {
  transition: color 200ms ease-out,
  background-color 200ms ease-out,
  border-color 200ms ease-out,
  opacity 200ms ease-out;
}

.nav li:hover a,
.nav li.cur a {
  color: var(--active-color);
}

.nav-box .nav-line {
  border-bottom: 4px solid #09ebfe;
  position: absolute;
  left: 0;
  bottom: -3px;
  height: 4px;
  font-size: 0;
  width: 94px;
  z-index: 99;
}

.nav-box .nav-line i {
  border-bottom: 4px solid var(--active-color);
  width: 100%;
}

/* 导航栏样式 结束 */
/* 搜索块 开始 */
.search {
  float: right;
  width: 210px;
  height: 33px;
  margin-top: 25px;
  border: 1px solid #c6c5c9;
  border-radius: 4px;
  background-color: #fff;
  overflow: hidden;
}

.search .search-input {
  box-sizing: border-box;
  width: 178px;
  height: 33px;
  line-height: 33px;
  border: none;
  background-color: none;
  padding: 0 15px;
}

.search .search-btn {
  width: 32px;
  height: 33px;
  background: var(--active-color) url(../images/search_btn_bg.png) no-repeat center center;
  border: none;
  outline: none;

}


/* 搜索块 结束 */

/* 导航栏 结束 */

/* 顶部轮播图 开始 */
.banner,
.ban-list,
.ban-list .list-item,
.ban-list .list-item img {
  width: 100%;
  height: 600px;
}

.banner {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
}

.ban-list {
  position: relative;
  overflow: hidden;
}

.ban-list .list-item {
  position: absolute;
  left: 0;
  top: 0;
  transition: all 1.5s ease;
  opacity: 0;
}

.ban-list .active {
  opacity: 1;
  z-index:20;
}

.banner .point {
  z-index:21;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  bottom: 150px;
  width: 100%;
  height: 10px;
}

.banner .point span {
  display: block;
  width: 40px;
  height: 8px;
  border-radius: 10px;
  background-color: #fff;
  margin: 0 4px;
  cursor: pointer;
  transition: all 0.2s linear;
}

.banner .point .active {
  background-color: var(--active-color);
}

/* 顶部轮播图结束 */

/* 登录&推荐 开始 */
.mod {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 330px;
  padding: 15px 10px;
  background: rgba(255, 255, 255, .8);
  z-index: 20;
}

.mod>.item {
  position: relative;
  box-sizing: border-box;
  height: 300px;
  border: 2px solid #ebeae9;
  overflow: hidden;
  transition: all 0.2s ease;
}

.mod>.item>.item-link {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}
.mod>.item .hot-tag {
  position: absolute;
  left: 0;
  top: 0;
  width: 41px;
  height: 41px;
  background: url(../images/hot_tag.png) no-repeat;
}

.mod>.item .item-pic {
  width: 211px;
  height: 260px;
}


.mod>.item .item-txt {
  width: 100%;
  height: 36px;
  line-height: 36px;
  font-family: PingFangSC-Heavy;
  font-size: 18px;
  color: #575b60;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.item-hover {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  top: -260px;
  width: 211px;
  height: 260px;
  background: rgba(0, 0, 0, .3);
  transition: all 0.3s ease;
}

.item-hover .start-btn {
  display: block;
  width: 135px;
  height: 34px;
  line-height: 34px;
  border-radius: 20px;
  background-color: rgb(253, 231, 1);
  font-family: PingFangSC-Heavy;
  color: #575b60;
  text-align: center;
  transition: all 0.2s linear;
  z-index: 20;
}

.item-hover .start-btn:hover {
  background: rgba(253, 231, 1, .9);
}

.item-hover .start-link {
  margin-top: 15px;
  font-family: PingFangSC-Heavy;
  color: #fff;
  z-index: 30;
}

.item-hover .start-link a {
  color: #fff;
}

.item-hover .start-link span {
  margin: 0 4px;
}

.mod>.item:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, .2);
}

.mod>.item:hover .item-hover {
  top: 0;
}

/* 登录块 256*296 */
.mod-login {
  position: relative;
  box-sizing: border-box;
  height: 300px;
  padding: 50px 12px 0;
  border: 2px solid #ebeae9;
  background-color: #fff;
}

.mod-login .title {
  height: 30px;
  line-height: 30px;
  font-family: PingFangSC-Heavy;
  color: #6a6a6a;
  text-align: center;
  margin-bottom: 30px;
}

.mod-login .title span {
  color: var(--active-color);
}

.login-form .form-item {
  margin-bottom: 10px;
}

.login-form .form-item .input-box {
  box-sizing: border-box;
  width: 176px;
  height: 62px;
  border: 1px solid #c6c5c9;
  border-right: 0;
  padding: 0 12px;
}

.login-form .form-item .input-box input {
  box-sizing: border-box;
  width: 100%;
  height: 29px;
  color: #9fa0a0;
  padding-left: 30px;
  background: #fff;
  border: none;
}

.login-form .form-item .input-box .name {
  height: 31px;
  border-bottom: 2px solid #e3e3e3;
  background: url(../images/input_btn_1.png) no-repeat left center;
}

.login-form .form-item .input-box .pwd {
  background: url(../images/input_btn_2.png) no-repeat left center;
}

.login-form .form-item .btn-login {
  width: 60px;
  height: 62px;
  background: var(--active-color);
  border: none;
  outline: none;
  font-family: PingFangSC-Heavy;
  font-size: 16px;
  color: #f2f2f2;
}

.login-form .fun-item {
  height: 15px;
  margin-bottom: 55px;
  font-size: 12px;
}

.login-form .fun-item input {
  cursor: pointer;
}

.login-form .fun-item span {
  color: #9fa0a0;
  margin-left: 4px;
}

.login-form .fun-item a {
  color: #9fa0a0;
}

.login-form .fun-item a:hover {
  color: var(--active-color);
}

.login-form .others {
  justify-content: flex-end;
  height: 24px;
}

.login-form .others .others-link {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  font-size: 0;
  background: url(../images//others_link_bg.png) no-repeat center center;
  transition: all 0.2s ease;
}

.login-form .others .for-qq {
  margin-right: 7px;
  background-color: #70d4f9;
  background-position: 5px 3px;
}

.login-form .others .for-weixin {
  margin-right: 45px;
  background-color: #14c145;
  background-position: -28px 5px;
}

.login-form .others .for-qq:hover {
  background-position: 5px -27px;
}

.login-form .others .for-weixin:hover {
  background-position: -28px -25px;
}

.login-form .others .btn-reg {
  font-size: 12px;
  color: #fd878a;
}

.login-form .others .btn-reg:hover {
  color: var(--active-color);
}

/* 登录&推荐 结束 */

/* 新闻公告 开始 */
.news-list {
  box-sizing: border-box;
  height: 250px;
  padding: 15px 20px;
  background-color: #fff;
}

.options {
  float: left;
  box-sizing: border-box;
  height: 25px;
  border-radius: 20px;
  border: 1px solid #b0afb1;
  overflow: hidden;
}

.options span {
  display: inline-block;
  line-height: 23px;
  padding: 0 12px;
  font-size: 13px;
  color: #8d8d8d;
  text-align: center;
  cursor: pointer;
}

.options .active {
  background-color: #363636;
  color: #f4f4f4;
}

.news-list .news-left {
  position: relative;
  width: 575px;
  height: 220px;
  overflow: hidden;
}

.news-banner {
  position: absolute;
  left: 0;
  top: 0;
  width: 300%;
  height: 220px;
  overflow: hidden;
}

.news-banner li {
  float: left;
  width: 575px;
  height: 220px;
}

.news-banner-bottom {
  box-sizing: border-box;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 45px;
  padding: 0 20px;
  background: rgba(0, 0, 0, .5);
}

.news-banner-bottom .name {
  display: none;
  float: left;
  width: 300px;
  height: 45px;
  line-height: 45px;
  font-size: 20px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.news-banner-bottom .name.active {
  display: block;
}

.news-banner-bottom .point {
  float: right;
  width: 100px;
  height: 45px;
  line-height: 45px;
  text-align: right;
}

.news-banner-bottom .point span {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #fff;
  margin-right: 10px;
  cursor: pointer;
}

.news-banner-bottom .point .active {
  background-color: #fef610;
}

.news-list .news-right {
  box-sizing: border-box;
  width: 585px;
  height: 220px;
  padding: 5px 25px;
}

.news-list .news-right ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
}

.news-list .news-right ul li .txt {
  max-width: 450px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.news-list .news-right ul li .txt span {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: #b0afb1;
  vertical-align: middle;
}

.news-list .news-right ul li .txt a,
.news-list .news-right ul li .time {
  color: #b9b9b9;
}

.news-list .news-right ul li:hover .txt span {
  background-color: #49b2fe;
}

.news-list .news-right ul li:hover .txt a,
.news-list .news-right ul li:hover .time {
  color: #797979;
}

/* 新闻公告 结束 */

/* 开服&游戏 开始 */
.kf-news {
  height: 696px;
  overflow: hidden;
}

/* 开服列表 */
.kf-left-list {
  box-sizing: border-box;
  height: 646px;
  background-color: #fff;
  border-radius: 10px;
  padding: 0 15px;
}

.kf-left-list .title {
  display: flex;
  box-sizing: border-box;
  height: 55px;
  line-height: 55px;
}

.kf-left-list .title span {
  display: block;
  width: 50%;
  height: 55px;
  line-height: 55px;
  border-bottom: 2px solid #d6d6d6;
  font-size: 15px;
  color: #484848;
  text-align: center;
  cursor: pointer;
}

.kf-left-list .title .active {
  color: var(--active-color);
  border-color: var(--active-color);
}

.kf-left-list .area-list {
  height: 528px;
  margin-top: 10px;
  overflow: hidden;
}

.kf-left-list .area-list li {
  position: relative;
  box-sizing: border-box;
  height: 44px;
  padding-left: 15px;
  border-bottom: 1px solid #d6d6d6;
}

.kf-left-list .area-list li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
}

.kf-left-list .area-list li a span {
  display: block;
  width: 76px;
  font-size: 12px;
  color: #a9a9a9;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kf-left-list .area-list li a span.name {
  color: #4a4b4c;
}

.kf-left-list .area-list li>i {
  position: absolute;
  left: 3px;
  top: 17px;
  width: 7px;
  height: 7px;
  border: 1px solid #4f4f4f;
  border-radius: 50%;
}

.kf-left-list .area-list li:hover a span {
  color: var(--active-color);
}

.kf-left-list .area-pages {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 35px;
  margin-top: 10px;
}

.kf-left-list .area-pages span {
  display: block;
  width: 30px;
  height: 5px;
  border-radius: 2px;
  background-color: #d6d6d6;
  margin: 0 4px;
  cursor: pointer;
}

.kf-left-list .area-pages span:hover,
.kf-left-list .area-pages .active {
  background-color: #49b2fe;
}

/* 右侧 */
.kf-right-list {
  height: 696px;
}

.kf-right-list .com-title .title i {
  background-color: #fe5600;
}

/* 热门页游 */

.page-game .con {
  height: 440px;
  overflow: hidden;
}

.page-game .con .item {
  position: relative;
  box-sizing: border-box;
  float: left;
  width: 285px;
  height: 133px;
  padding-left: 15px;
  margin-right: 20px;
  margin-bottom: 20px;
  background: linear-gradient(to right, #fffefd, #faf2df);
  overflow: hidden;
  cursor: pointer;
}

.page-game .con .item:nth-child(3n) {
  margin-right: 0;
}

.page-game .con .item .item-pic {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.page-game .con .item .item-pic img {
  /*transform: scale(1);*/
  transition: all 0.2s linear;
}

.page-game .con .item:hover .item-pic img {
  transform: scale(1.2);
}

.page-game .con .item .info {
  margin-top: 15px;
  transition: all 0.2s linear;
}

.page-game .con .item .info h6 {
  height: 20px;
  line-height: 20px;
  font-size: 18px;
  color: #484848;
  margin-bottom: 5px;
}

.page-game .con .item .info p {
  height: 20px;
  line-height: 20px;
  color: #8e8e8e;
  margin-bottom: 5px;
}

.page-game .con .item .info .tag {
  width: 38px;
  height: 16px;
  transition: all 0.2s linear;
}

.page-game .con .item .info .hot {
  background: url(../images/tag_hot.png) no-repeat center center;
}

.page-game .con .item .info .new {
  background: url(../images//tag_new.png) no-repeat center center;
}

.page-game .con .item:hover .info .tag {
  transform: translateX(-60px);
}

.page-game .con .item:hover .info {
  transform: translateY(10px);
}

.page-game .con .item .item-menu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  bottom: -35px;
  width: 100%;
  height: 35px;
  padding: 0 20px;
  background: rgba(0, 0, 0, 0.5);
  transition: all 0.2s linear;
}

.page-game .con .item .item-menu .menu-left {
  width: 86px;
  height: 20px;
  line-height: 20px;
  background-color: #fde701;
  border-radius: 10px;
  font-size: 14px;
  text-align: center;
  color: #333;
  transition: all 0.2s ease;
}

.page-game .con .item .item-menu .menu-left:hover {
  opacity: .8;
}

.page-game .con .item .item-menu .menu-right {
  height: 20px;
  line-height: 20px;
  color: #fff;
}

.page-game .con .item .item-menu .menu-right a {
  color: #fff;
}

.page-game .con .item .item-menu .menu-right span {
  margin: 0 10px;
}

.page-game .con .item:hover .item-menu {
  bottom: 0;
}

.page-game .con .item .item-menu .menu-right a:hover {
  text-decoration: underline;
}

/* 热门H5 */

.h5-game .con {
  height: 141px;
  overflow: hidden;
}

.h5-game .con .item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  float: left;
  box-sizing: border-box;
  width: 285px;
  height: 141px;
  padding: 15px;
  margin-right: 20px;
  background-color: #fff;
}

.h5-game .con .item:nth-child(3n) {
  margin-right: 0;
}

.h5-game .con .item-pic {
  width: 105px;
  height: 105px;
  border-radius: 5px;
}

.h5-game .con .item-pic a {
  display: block;
  width: 105px;
  height: 105px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.h5-game .con .item-pic a img {
  width: 100%;
}

.h5-game .con .item-info {
  box-sizing: border-box;
  width: 140px;
  height: 105px;
  padding-top: 10px;
}

.h5-game .con .item-info h6 {
  font-size: 16px;
  color: #484848;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.h5-game .con .item-info p {
  margin-top: 5px;
  font-size: 13px;
  color: #b9b2ae;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.h5-game .con .item-info .btns {
  display: flex;
  height: 26px;
  margin-top: 15px;
}

.h5-game .con .item-info .btns a {
  display: block;
  box-sizing: border-box;
  width: 60px;
  height: 26px;
  line-height: 24px;
  border: 1px solid #e1e1e1;
  border-radius: 10px;
  font-size: 13px;
  color: #6f6f6f;
  text-align: center;
  margin-right: 8px;
}

.h5-game .con .item-info .btns a:nth-child(2) {
  border-color: #9b9b9b;
}


.h5-game .con .item-pic:hover a {
  transform: translateY(-3px);
}

.h5-game .con .item-info .btns a:hover {
  border-color: #FDE701;
  background-color: #FDE701;
}

/* 开服&游戏 结束 */


/* 快速通道&手机游戏 开始 */
.fast-pg {
  overflow: hidden;
}

/* 330 * 240 */
.fast-track {
  box-sizing: border-box;
  height: 265px;
  padding: 10px 20px 15px;
  background-color: #fff;
}

.bdb-b9 {
  border-bottom: 1px solid #b9b9b9;
}

.fast-track .fast-menu {
  box-sizing: border-box;
  width: 330px;
  height: 55px;
  margin: 0 10px;
}

.fast-track .fast-menu li {
  display: flex;
  align-items: center;
  float: left;
  width: 100px;
  height: 55px;
  overflow: hidden;
  white-space: nowrap;
  margin-right: 10px;
}

.fast-track .fast-menu li img {
  width: 20px;
  margin-right: 5px;
}

.fast-track .fast-menu li a {
  display: block;
  width: 75px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  color: #807f7f;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: all 0.3s ease;
}

.fast-track .fast-menu li a:hover {
  transform: translateX(5px);
}

.fast-track .custom {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 60px;
  border-radius: 5px;
  margin-top: 5px;
  background-color: #f3f3f3;
}

.fast-track .custom .pic {
  width: 40px;
  height: 40px;
}

.fast-track .custom>h6 {
  width: 40px;
  height: 40px;
  line-height: 20px;
  font-size: 16px;
  color: #807f7f;
  overflow: hidden;
  text-align: center;
  margin: 0 5px;
}

.fast-track .custom .info {
  height: 40px;
}

.fast-track .custom .info p {
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fast-track .custom .info .tel {
  font-size: 20px;
  color: #807f7f;
}

.fast-track .custom .info .time {
  font-size: 13px;
  color: #b9b9b9;
}

/* 游戏礼包 */
.phone-gift {
  height: 265px;
  overflow: hidden;
}

.phone-gift .item {
  display: flex;
  align-items: center;
  position: relative;
  float: left;
  box-sizing: border-box;
  width: 250px;
  height: 120px;
  padding: 15px;
  margin-bottom: 25px;
  margin-right: 20px;
  background-color: #fff;
  border-radius: 5px;
}

.phone-gift .item:nth-child(3n) {
  margin-right: 0;
}

.phone-gift .item .pic {
  display: block;
  width: 90px;
  height: 90px;
  border-radius: 10px;
  margin-right: 10px;
}

.phone-gift .item .pic img {
  transition: all 0.2s ease;
}

.phone-gift .item .info {
  width: 120px;
  height: 90px;
}

.phone-gift .item .info h6 {
  line-height: 20px;
  font-size: 16px;
  color: #484848;
  margin-top: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phone-gift .item .info p {
  line-height: 20px;
  font-size: 12px;
  color: #b4b4b4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phone-gift .item .info .name,
.phone-gift .item .info .num {
  margin-top: 3px;
}

.phone-gift .item .info .num span {
  font-size: 16px;
  color: #ff8d12;
}

.phone-gift .item .btn-link {
  display: block;
  position: absolute;
  right: 10px;
  bottom: 5px;
  width: 60px;
  height: 20px;
  line-height: 20px;
  background-color: #fff;
  border: 1px solid #b9b9b9;
  border-radius: 10px;
  font-size: 12px;
  color: #484848;
  text-align: center;
}

.phone-gift .item .btn-link:hover {
  border-color: #fffc11;
  background-color: #fffc11;
}

.phone-gift .item .pic:hover img {
  transform: translateY(-3px);
}

/* 快速通道&手机游戏 结束 */



/* 友情链接 开始 */
.link-box {
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid #535353;
  padding: 40px 0;
}

.link-box>p {
  line-height: 20px;
  margin-bottom: 10px;
  font-size: 12px;
  color: #cfcfcf;
}

.link-box>p a {
  margin-right: 15px;
  color: #616161;
}

/* 友情链接 结束 */

/* 版权 开始 */
.coinfo {
  box-sizing: border-box;
  display: flex;
  margin-top: 40px;
  padding: 0 20px;
}

.coinfo .f_logo {
  display: block;
  width: 85px;
  height: 70px;
  margin-right: 35px;
}

.coinfo .f_nav {
  line-height: 20px;
  margin-bottom: 15px;
  color: #5e5e5e;
}

.coinfo .f_nav a {
  color: #cfcfcf;
}

.coinfo p {
  color: #5e5e5e;
  line-height: 16px;
  margin-bottom: 10px;
}

.coinfo p a {
  color: #5e5e5e;
}

.coinfo .f_icon {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 10px 0;
  overflow: hidden;
}

.coinfo .f_icon a {
  margin-right: 20px;
}


#footer a:hover {
  color: var(--active-color);
}

/* 版权 结束 */

/* ==========================index首页 结束========================== */

/* ==========================game_detile游戏详情页 开始========================== */
.game-dtl-bg {
  background-color: #000;
  overflow: hidden;
}

/* 游戏背景图 */
.dtl_bg {
  width: 100%;
  height: 900px;
}

.dtl_bg .bg_img {
  width: 100%;
  height: 100%;
}

.dtl_bg .wp {
  position: relative;
}

.dtl_bg .download-box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  bottom: 25px;
  width: 100%;
  height: 135px;
}

.dtl_bg .download-box .dtl_pic {
  width: 135px;
  height: 135px;
  margin-right: 15px;
}

.dtl_bg .download-box .txt {
  box-sizing: border-box;
  width: 60px;
  height: 115px;
  line-height: 28px;
  padding-left: 15px;
  border-left: 2px solid #fff;
  font-size: 26px;
  color: #fff;
  text-align: center;
  overflow: hidden;
}

.dtl_bg .download-box .dtl_code {
  width: 120px;
  height: 120px;
  background-color: #fff;
}

.dtl_bg .download-box .dtl_btns {
  margin-left: 10px;
  height: 128px;
}

.dtl_bg .download-box .dtl_btns a {
  display: block;
  width: 180px;
  height: 59px;
  font-size: 0;
  /*background-color: #F1AE45;*/
  border-radius: 5px;
  transition: all 0.2s ease;
}


.dtl_bg .download-box .dtl_btns a:first-child {
  margin-bottom: 10px;
}

/*.dtl_bg .download-box .btns1 a:nth-child(2) {*/
/*  background-color: #514CA8;*/
/*}*/

/*.dtl_bg .download-box .btns2 a:nth-child(1) {*/
/*  background-color: #F17144;*/
/*}*/

/*.dtl_bg .download-box .btns2 a:nth-child(2) {*/
/*  background-color: #48BBDC;*/
/*}*/


/* .dtl_bg .download-box .dtl_btns a:hover {
  transform: skew(-15deg);
} */

/* 公告内容块 */
.notice {
  display: flex;
}

.notice .pic {
  width: 595px;
  height: 330px;
  margin-right: 10px;
}

.notice .pic img {
  width: 100%;
  height: 100%;
}

.notice .notice_right {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 595px;
  height: 330px;
  background-color: #3c2b5a;
}

.notice .notice_right .bg {
  box-sizing: border-box;
  width: 573px;
  height: 282px;
  padding: 6px;
  background: url(../images//dtl_bg_1.png) no-repeat;
  background-size: 100% 100%;
}

.notice .notice_right .bg .border {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 20px 30px;
  border: 1px solid #fff;
}

.notice-list {
  width: 499px;
  height: 228px;
  overflow: hidden;
}

.notice-list .item {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 18px;
  line-height: 18px;
  margin-top: 20px;
  padding-left: 20px;
  font-size: 13px;
  color: #fff;
}

.notice-list li i {
  position: absolute;
  left: 5px;
  top: 5px;
  width: 8px;
  height: 8px;
  border: 1px solid #fff;
  transform: rotate(45deg);
}

.notice-list .item .txt {
  display: block;
  float: left;
  max-width: 400px;
  font-size: 13px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notice-list .item .time {
  float: right;
  font-size: 16px;
  color: #9d9d9d;
}

.notice-list .cont {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 75px;
  padding-left: 20px;
  border-bottom: 1px dotted #9a9a9a;
}

.notice-list .cont .txt {
  display: block;
  height: 20px;
  line-height: 20px;
  font-size: 13px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 8px;
}

.notice-list .cont .info {
  height: 40px;
  line-height: 20px;
  font-size: 12px;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
}

.notice-list li .txt:hover {
  color: var(--active-color);
}

/* 游戏特色 */

.game-special .special-tit {
  width: 816px;
  height: 109px;
  margin: 0 auto;
}

/* 游戏特色轮播图 开始*/
.swiper-area {
  width: 1200px;
  height: 602px;
  margin: 50px auto 0;
  padding: 0 67px;
  position: relative;
  overflow: hidden;
}

.swiper-area .gallery_wrap {
  width: 100%;
  height: 100%;
}

.gallery_wrap .gallery_container {
  position: absolute;
  -webkit-perspective: 1300px;
  perspective: 1300px;
  left: -547.5px;
}

.gallery_item {
  position: absolute;
  left: 50%;
  top: 0;
  z-index: -1;
  opacity: 0;
  -webkit-transition: all ease;
  -moz-transition: all ease;
  -ms-transition: all ease;
  -o-transition: all ease;
  transition: all ease;
}

.gallery_item,
.gallery_item img {
  width: 803px;
  height: 602px;
}

.gallery_left_middle {
  z-index: 3;
  opacity: 1;
}

.gallery_active {
  opacity: 1;
  z-index: 5;
}

.gallery_right_middle {
  z-index: 3;
  opacity: 1;
}

.swiper-area .swiper-button-next,
.swiper-area .swiper-button-prev {
  position: absolute;
  width: 57px;
  height: 98px;
  top: 252px;
  cursor: pointer;
}

.swiper-area .swiper-button-prev {
  left: 0;
  background: url("../images/swiper_btn_left.png") no-repeat left top;
}

.swiper-area .swiper-button-next {
  right: 0;
  background: url("../images/swiper_btn_right.png") no-repeat left top;
}

/* 游戏特色轮播图 结束*/
/* ==========================game_detile游戏详情页 结束========================== */