@font-face {
    font-family: 'jy';
    src: url('../font/SourceHanSansCN-Light.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

* {
    margin: 0;
    padding: 0;
    font-family: 'jy', sans-serif;
}

html,
body {
    width: 100%;
}

ul,
ol,
li {
    list-style: none;
}

a {
    text-decoration: none;
}

/* 修改滚动条的宽度 */
::-webkit-scrollbar {

    width: 6px;
    /* 纵向滚动条的宽度 */
    height: 6px;
    /* 横向滚动条的高度 */
}

/* 滚动条轨道部分 */
::-webkit-scrollbar-track {
    background-color: #f0f0f0;
    border-radius: 10px;
}

/* 滚动条滑块部分 */
::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
    cursor: pointer;

}

/* 鼠标悬停在滑块上时 */
::-webkit-scrollbar-thumb:hover {
    background-color: #555;
    cursor: pointer;

}

/* 版心 */
.conter {
    width: 1200px;
    display: block;
    margin: 0 auto;
}


/* 顶部导航条 ------------------------------------------------------------*/
.navTop {
    position: sticky;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 110;
    background: #F5F5F5;

}

.navTopOne {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 60px;
}

.navTopOne .navTopLeft {
    width: 160px;
    height: 60px;
    background: #E9E9E9;
    font-weight: 600;
    font-size: 14px;
    color: #393939;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.navTopOne .navTopLeft:hover {
    color: #fff;
    background: #393939;


}

.navTopOne .navTopRight {
    display: flex;
    align-items: center;
    justify-content: center;
}

.navTopOne .navTopRight li {
    position: relative;
}

.navTopOne .navTopRight li a {
    width: 100%;
    height: 100%;
    font-weight: 400;
    font-size: 18px;
    padding: 0 10px;
    display: block;
    color: #2D2D2D;
    position: relative;

}

.navTopOne .navTopRight li a:hover {
    color: #0D2252;
    font-weight: bold;
}

.navTopOne .navTopRight li::after {
    position: absolute;
    height: 14px;
    right: 0;
    top: calc(50% - 7px);
    width: 2px;
    background: #2D2D2D;
    content: ' ';
}

.navTopOne .navTopRight li:last-child::after {
    display: none;

}

.navTop .navTopTwo {
    height: 60px;
    width: 100%;
    background: #0D2252;
}

.navTop .navTopTwo .nav {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: 200px;
}

.navTop .navTopTwo .nav li {
    height: 60px;
    position: relative;
    overflow: hidden;
}

.navTop .navTopTwo .nav li.act::after {
    position: absolute;
    content: '';
    width: 30px;
    height: 5px;
    background: #fff;
    border-radius: 2px 2px 0 0;
    bottom: -1px;
    left: calc(50% - 15px);

}

.navTop .navTopTwo .nav li a {
    height: 60px;
    font-weight: 400;
    font-size: 20px;
    color: #fff;
    width: 136px;
    display: flex;
    align-items: center;
    justify-content: center;

}

.navTop .navTopTwo .nav li a:hover {
    background: #fff;
    color: #0D2252;
    font-weight: bold;
}

/* foot ---------------------------------------------------------*/

.foot {
    width: 100%;
    height: 280px;
    background: #FFFFFF;
    margin-top: 50px;
    padding-top: 60px;
}

.foot .tabs {
    display: flex;
    align-items: center;
    justify-content: center;

}

.foot .tabs a {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    width: 100px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #2D2D2D;
}

.foot .tabs a:hover {
    color: #1A98EC;
}

.foot .tabs a:last-child {
    border-right: none;
}

.foot .topBox {
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 16px;
    color: #989797;
    height: 20px;

}

.foot .topBox a {
    height: 20px;
    font-weight: 400;
    font-size: 16px;
    color: #989797;
    margin-right: 6px;
    display: flex;
    align-items: center;
}

.foot .topBox a:hover {
    color: #361bcf;

}

.foot .topBox span {
    display: inline-block;
    display: flex;
    align-items: center;
    height: 20px;
    padding-left: 16px;
    margin-left: 10px;
    position: relative;
    /* background: red; */

}

.foot .topBox span::after {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    background: #989797;
    width: 1px;
    height: 20px;


}

.foot .xian {
    width: 984px;
    height: 1px;
    background: #979797;
    opacity: 0.1;
    margin: 40px auto;
}

.foot .imgBox {
    display: flex;
    align-items: center;
    justify-content: center;

}

.foot .imgBox .img {
    width: 124px;
    height: 47px;
    margin: 0 10px;
    cursor: pointer;
}

.foot .imgBox .img img {
    width: 124px;
    height: 47px;
}

/* 登录页面 注册 忘记密码 ---------------------------------------------------*/
.loginBox {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: calc(100vh - 120px);
    min-height: 620px;
    background: url(../img/loginBg.png) no-repeat;
    background-size: 100% auto;
}

.loginBox .loginBoxCenter {
    width: 1200px;
    display: flex;
    align-items: center;
    justify-content: center
}

.loginBox .loginBoxCenter .left {
    width: 570px;
    height: 580px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px 0 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding-bottom: 80px;

}

.loginBox .loginBoxCenter .left .centers .logo {
    width: 180px;
    height: 180px;
    background: #FFFFFF;
    border-radius: 10px;
    margin: 0 auto;
    overflow: hidden;

}

.loginBox .loginBoxCenter .left .centers .logo img {
    width: 100%;
    height: 100%;
}

.loginBox .loginBoxCenter .left .centers .logoName {
    font-weight: 600;
    font-size: 26px;
    color: #FFFFFF;
    text-align: center;
    margin-top: 39px;
}

.loginBox .loginBoxCenter .center {
    width: 20px;
    height: 580px;
    background: rgba(255, 255, 255, 0.4);
    position: relative;

}

.loginBox .loginBoxCenter .center::after {
    content: "";
    position: absolute;
    top: -20px;
    right: 0;
    border-top: 20px solid rgba(255, 255, 255, 0);
    border-right: 20px solid rgba(255, 255, 255, 0.4);
    width: 0;
    height: 0;
}

.loginBox .loginBoxCenter .center::before {
    content: "";
    position: absolute;
    bottom: -20px;
    right: 0;
    border-bottom: 20px solid rgba(255, 255, 255, 0);
    border-right: 20px solid rgba(255, 255, 255, 0.4);
    width: 0;
    height: 0;
}

.loginBox .loginBoxCenter .inputBox {
    width: 590px;
    height: 620px;
    background: #FFFFFF;
    box-shadow: 0px 0px 18px 0px rgba(77, 77, 77, 0.1);
    border-radius: 0px 10px 10px 0px;
    box-sizing: border-box;
    padding: 40px 100px;
}

.loginBox .loginBoxCenter .inputBox .tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
}

.loginBox .loginBoxCenter .inputBox .tabs .item {
    font-family: Source Han Sans CN;
    font-weight: 600;
    font-size: 24px;
    color: #999999;
    cursor: pointer;
}

.loginBox .loginBoxCenter .inputBox .tabs .item.itemBox {
    display: flex;
    align-items: center;
}

.loginBox .loginBoxCenter .inputBox .tabs .itemBox span {
    font-weight: 600;
    font-size: 24px;
}

.loginBox .loginBoxCenter .inputBox .tabs .itemBox .img {
    margin-left: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loginBox .loginBoxCenter .inputBox .tabs .itemBox .img img {
    width: 24px;
    height: 24px;
}

.loginBox .loginBoxCenter .inputBox .tabs .item.act {

    color: #2D2D2D;
}

.loginBox .loginBoxCenter .inputBox .tabs .item:hover {
    font-weight: 600;
    color: #2D2D2D;


}

.loginBox .loginBoxCenter .inputBox .tabs .shu {
    width: 2px;
    height: 22px;
    background: #999999;
    margin: 0 28px;
}

.loginInput{
    display: none;
}
 .loginInput.show{
    display: block;
}
.loginInput .inputDiv {
    margin-top: 16px;
    width: 390px;
    height: 50px;
    background: #FFFFFF;
    border-radius: 4px;
    border: 2px solid #D3D3D3;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 22px;

}

.loginBox .loginBoxCenter .inputBox .loginInput .inputDiv .pbone {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    padding-left: 18px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.loginBox .loginBoxCenter .inputBox .loginInput .inputDiv .pbone .img {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 9px;
    margin-right: 19px;

}

.loginBox .loginBoxCenter .inputBox .loginInput .inputDiv .pbone .img img {
    width: 16px;
    height: 16px;
}

.loginBox .loginBoxCenter .inputBox .loginInput .inputDiv .pbone::after {
    content: "";
    width: 2px;
    height: 18px;
    font-weight: 400;
    background: #999999;
    position: absolute;
    right: 0;
    top: calc(50% - 9px);
}

.loginBox .loginBoxCenter .inputBox .loginInput .codeInput {
    display: flex;
    align-items: center;
    margin-top: 16px;


}

.loginBox .loginBoxCenter .inputBox .loginInput .codeInput .inputDiv {
    display: flex;
    align-items: center;
    height: 50px;
    background: #FFFFFF;
    border-radius: 4px;
    border: 2px solid #D3D3D3;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 22px;
    flex: 1;
    margin: 0;
}

.loginBox .loginBoxCenter .inputBox .loginInput .codeInput .codeBtn {
    width: 112px;
    height: 50px;
    background: #F3990F;
    border-radius: 4px;
    margin-left: 15px;
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.loginBox .loginBoxCenter .inputBox .loginInput .codeInput .codeBtn:hover {
    background: #fd9801;

}

.loginBox .loginBoxCenter .inputBox .loginInput .inputDiv img {
    width: 14px;
    height: 16px;
}

.input_text {
    padding-left: 18px;
    flex: 1;
    outline: none;
    border: none;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    height: 100%;

}

.input_text::placeholder {
    font-weight: 400;

    font-size: 16px;
    color: #999999;
}

.inputDiv input {
    padding-left: 18px;
    flex: 1;
    outline: none;
    border: none;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    height: 100%;

}

.inputDiv input::placeholder {
    font-weight: 400;

    font-size: 16px;
    color: #999999;
}

.loginInput .bottomDic {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 26px;
}

.loginInput .bottomDic .ledt {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    cursor: pointer;

}

.loginInput .bottomDic .right {
    font-weight: 400;
    font-size: 16px;
    color: #1A98EC;
    cursor: pointer;

}

.loginInput .regBotom {
    display: flex;
    align-items: center;
    margin-top: 30px;
}

.loginInput .regBotom a {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    padding-right: 20px;
}

.loginInput .regBotom a:last-child {
    padding-left: 20px;

}

.loginBox .loginBoxCenter .inputBox .loginInput .regBotom a span {
    color: #1A98EC;
}

.loginBox .loginBoxCenter .inputBox .loginInput .regBotom .su {
    width: 2px;
    height: 15px;
    background: #666;
}

.loginInput button {
    width: 386px;
    height: 56px;
    background: #F3823E;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 22px;
    color: #FFFFFF;
    margin-top: 60px;
    border: none;
    cursor: pointer;
}

.loginInput button:hover {
    background: #e7600b;

}


.loginBox .loginBoxCenter .inputBox .loginInput .checkbox {
    display: flex;
    align-items: center;

    margin-top: 40px;

}

.loginBox .loginBoxCenter .inputBox .loginInput .checkbox a {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
}

.loginBox .loginBoxCenter .inputBox .loginInput .checkbox input[type='checkbox'] {
    margin-right: 10px;
    border: none !important;
    width: 14px;
    height: 14px;
    background: #F5F4F4;
    border-radius: 2px;
    -webkit-appearance: none;
}

.loginBox .loginBoxCenter .inputBox .loginInput .checkbox input[type='checkbox']:checked {
    background: #F3823E;

}

.loginBox .loginBoxCenter .inputBox .otherLogin {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    text-align: center;
    margin-top: 100px;
}

.loginBox .loginBoxCenter .inputBox .otherLoginLis {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}

.loginBox .loginBoxCenter .inputBox .otherLoginLis .imgbox {
    margin: 0 20px;
    width: 44px;
    height: 44px;
    cursor: pointer;
}

.loginBox .loginBoxCenter .inputBox .otherLoginLis .imgbox img {
    width: 44px;
    height: 44px;
}

.loginBox .loginBoxCenter .inputBox .wxCode {
    width: 240px;
    height: 240px;
    background: #ECECEC;
    border-radius: 10px;
    overflow: hidden;
    margin: 0 auto;
}

.loginBox .loginBoxCenter .inputBox .wxCode img {
    width: 240px;
    height: 240px;
    border-radius: 10px;

}

.loginBox .loginBoxCenter .inputBox .wxCodeText {
    font-weight: 400;
    font-size: 18px;
    color: #2D2D2D;
    margin-top: 20px;
    text-align: center;
}

.loginBox .loginBoxCenter .inputBox .wxbottom {
    width: 180px;
    height: 40px;
    background: rgba(236, 236, 236, 0.5);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 100px auto 0;
    cursor: pointer;
}

.loginBox .loginBoxCenter .inputBox .wxbottom:hover {
    background: rgba(236, 236, 236, 1);

}

.loginBox .loginBoxCenter .inputBox .wxbottom img {
    width: 16px;
    height: 16px;
}

.loginBox .loginBoxCenter .inputBox .wxbottom span {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    margin-left: 14px;
}


.loginBox .loginBoxCenter .homeBack {
    width: 40px;
    height: 180px;
    background: #F3823E;
    border-radius: 0px 10px 10px 0px;
    box-sizing: border-box;
    padding: 34px 0;
    cursor: pointer;

}

.loginBox .loginBoxCenter .homeBack:hover {
    background: #e7600b;

}

.loginBox .loginBoxCenter .homeBack a {
    width: 100%;
    height: 100%;
    display: block;

}

.loginBox .loginBoxCenter .homeBack a span {
    writing-mode: vertical-rl;
    /* 文字从上到下，从右到左 */
    font-weight: 400;
    font-size: 20px;
    color: #FFFFFF;
    display: block;
    margin: 0 auto;


}

.loginBox .loginBoxCenter .homeBack a img {
    width: 20px;
    height: 20px;
    display: block;
    margin: 14px auto 0;
}

/* 首页 */
.home {
    background: #F5F5F5;
    position: relative;
}

/* 首页 轮播图---------------------------------------------------*/
.bg {

    background: url(../img/banBg.png) no-repeat;
    background-size: 100% 730px;
    height: 730px;
    min-width: 1280px;
}

.bg .swiper {
    width: 100%;
    font-size: 0;
}

.bg .swiper .swiper-slide img {
    width: 100%;
}

.bg .conter {
    position: relative;
}

.bg .swiper-pagination {
    bottom: 20px;
}

.bg .swiper-pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #F4F4F4;
}

.bg .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 20px;
    height: 6px;
    background: #FFFFFF !important;
    border-radius: 3px;
}

/* 首页 中间部分  搜索 购物车  登录---------------------------------------------------*/
.centerBtnBox {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 99;
    margin-top: -30px;
}

.centerBtnBox .form {
    display: flex;
    align-items: center;
    width: 620px;
    margin-right: 60px;
}

.centerBtnBox .form .souInput {
    height: 46px;
    background: #FFFFFF;
    flex: 1;
    box-sizing: border-box;
    border: none;
    padding-left: 40px;
    outline: none;
    border: none;
}

.centerBtnBox .form .btnBox {
    border: none;
    cursor: pointer;
}

.centerBtnBox .btnBox {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 46px;
    background: #464D54;

}

.centerBtnBox .btnBox:hover {
    background: #282d31;

}

.centerBtnBox .btnBox img {
    width: 20px;
    height: 20px;
}

.centerBtnBox .carBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 132px;
    height: 46px;
    background: #E05C28;
    margin-right: 10px;

}

.centerBtnBox .carBtn:hover {
    background: #f55516;

}

.centerBtnBox .carBtn .img {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;

}

.centerBtnBox .carBtn .img img {
    width: 20px;
    height: 20px;
}

.centerBtnBox .carBtn span {
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
}

.centerBtnBox .loginGo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 46px;
    background: #6FA3B4;
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
}

.centerBtnBox .loginGo:hover {
    background: #68cff1;

}

/* 登录状态 显示个人中心 */
.loginShow {
    position: fixed;
    right: 60px;
    /* bottom: 200px; */
    top: 160px;
    width: 260px;
    height: 138px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px 0px rgba(102, 102, 105, 0.16);
    border-radius: 8px;
    box-sizing: border-box;
    padding: 12px 30px;
    z-index: 99;
}

.loginShow .top {
    display: flex;
    align-items: center;
}

.loginShow .top .header {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    background: #F3F1F0;
    margin-right: 12px;

}

.loginShow .top .header img {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    background: #F3F1F0;
}


.loginShow .top .right div {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;

}

.loginShow .outLogin {
    width: 200px;
    height: 40px;
    background: #308FF0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    cursor: pointer;
    margin-top: 14px;
}

.loginShow .outLogin:hover {
    background: #e61717;

}

/* 游戏分类 ------------------------------------------------------- */

.gameTypeBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 40px;
    height: auto;
}

.gameTypeBox .left {
    width: 230px;
    /* min-height: 314px; */
    background: #FFFFFF;
    box-shadow: 0px 0px 12px 0px rgba(130, 128, 128, 0.1);
}

.gameTypeBox .left .title {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
}

.gameTypeBox .left .title .img {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

.gameTypeBox .left .title .img img {
    width: 18px;
    height: 17px;
}

.gameTypeBox .left .title span {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
}

.gameTypeBox .left .heng {
    height: 2px;
    background: #BBD5DE;
    opacity: 0.2;
}

.gameTypeBox .left ul {
    min-height: 240px;
}

.gameTypeBox .left ul li {
    position: relative;
    height: 80px;
}

.gameTypeBox .left ul li span {
    cursor: pointer;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.gameTypeBox .left ul li:hover {
    background: #464D54;
    color: #FFFFFF;
}

.gameTypeBox .left ul li img {
    position: absolute;
    width: 18px;
    height: 18px;
    right: 20px;
    top: calc(50% - 9px);
    cursor: pointer;

}

.gameTypeBox .left ul li .show {
    display: block;
}

.gameTypeBox .left ul li .hide {
    display: none;
}

.gameTypeBox .left ul li:hover .show {
    display: none;

}

.gameTypeBox .left ul li:hover .hide {
    display: block;

}

.gameTypeBox .left ul li .typeListBox {
    /* 1200 - 230 */
    width: 970px;
    position: absolute;
    top: -82px;
    left: 229px;
    display: none;
    z-index: 110;

}

.gameTypeBox .left ul li:hover .typeListBox {
    display: block;
}

.gameTypeBox .left ul li .typeListBox .typeList {
    float: right;
    background: #fff;
    width: 930px;
    box-shadow: 0px 0px 12px 0px rgba(51, 52, 55, 0.18);
    box-sizing: border-box;
    padding: 10px 30px;
}

.gameTypeBox .left ul li .typeListBox .typeList .name {
    font-size: 18px;
    color: #333;
    margin-right: 60px;
    height: 60px;
    line-height: 60px;
    display: inline-block;
    cursor: pointer;
}

.gameTypeBox .left ul li .typeListBox .typeList .name:hover {
    font-weight: 600;
}

.gameTypeBox .right {
    width: 930px;
    /* height: 314px; */
    height: 100%;
    box-sizing: border-box;
    padding-top: 20px;
    margin-left: 20px;
    flex-wrap: 1;
}

.gameTypeBox .right .box {
    height: 100%;
    background: #FFFFFF;
    box-shadow: 0px 0px 12px 0px rgba(130, 128, 128, 0.1);
    box-sizing: border-box;
    padding: 10px 30px;
    position: relative;
}

.gameTypeBox .right .box::after {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    background: #FFFFFF;
    width: 400px;
    height: 20px;


}

.gameTypeBox .right .box::before {
    content: "";
    position: absolute;
    top: -20px;
    left: 400px;
    border-bottom: 20px solid #FFFFFF;
    border-right: 20px solid #F5F5F5;
    width: 0;
    height: 0;
}

.gameTypeBox .right .box .title {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0px;
    left: 35px;
    z-index: 99;
}

.gameTypeBox .right .box .title .img {
    width: 18px;
    height: 18px;
    margin-right: 11px;
}

.gameTypeBox .right .box .title .img img {
    width: 18px;
    height: 18px;
}

.gameTypeBox .right .box .title span {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
}

.gameTypeBox .right .box .more {
    font-weight: 400;
    font-size: 14px;
    color: #2D2D2D;
    position: absolute;
    cursor: pointer;
    top: 0px;
    right: 35px;
    display: flex;
    align-items: center;
    padding-left: 10px;
    padding-top: 15px;
}

.gameTypeBox .right .box .games {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 0;
    margin-top: 30px;
}

.gameTypeBox .right .box .games li {
    box-sizing: border-box;
    padding: 5px;


}

.gameTypeBox .right .box .games li a {
    box-sizing: border-box;
    display: block;
    width: 280px;
    height: 120px;
    overflow: hidden;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;

}

.gameTypeBox .right .box .games li a img {
    width: 280px;
    height: 120px;
}

.gameTypeBox .right .box .games li a:hover img {
    transform: scale(1.2);
}

/* 公告滚动------------------------------------- */
.mp {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 40px;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 0 60px;
    margin: 40px auto;
}

.mp .ggtext {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    margin-left: 8px;
    margin-right: 8px;
}

.mp .img {
    width: 18px;
    height: 16px;
}

.mp .img img {
    width: 18px;
    height: 16px;
}

.mp .marquee {
    flex: 1;
}

.mp .marquee .item {
    display: inline-block;
    margin-right: 1100px;
    font-weight: 400;
    font-size: 16px;
    color: #E48912;
    cursor: pointer;
}

.mp .more {
    font-weight: 400;
    font-size: 14px;
    color: #2D2D2D;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding-left: 20px;
}

/* 猜你喜欢  每日签到   每日惊喜  ------------------------- */

.guessBox {
    display: flex;
    align-items: center;
    justify-content: space-between;

}

.guessBox .title {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
    padding-top: 18px;
    padding-left: 20px;

}

.guessBox .left {
    width: 880px;
    height: 630px;
    background: #FFFFFF;
}

.guessBox .left .list {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 0 10px;
}

.guessBox .left .list a {
    margin-top: 10px;
    margin-right: 20px;
    width: 156px;
    padding-bottom: 16px;
    cursor: pointer;
}

.guessBox .left .list a:hover .img {
    padding: 0px;

}

.guessBox .left .list a:hover .name {
    font-weight: 600;
}

.guessBox .left .list a:hover .text {
    font-weight: 600;
}

.guessBox .left .list a:hover .pic {
    font-weight: 600;
}

.guessBox .left .list a .img {
    width: 156px;
    height: 180px;
    box-sizing: border-box;
    background: #F3F1F0;
    padding: 6px;
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.guessBox .left .list a .img img {
    width: 100%;
    height: 100%;
}

.guessBox .left .list a:nth-child(5n) {
    margin-right: 0;
}

.guessBox .left .list a .name {
    margin-top: 8px;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.guessBox .left .list a .text {
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.guessBox .left .list a .pic {
    font-weight: 600;
    font-size: 20px;
    color: #E81313;
    margin-top: 9px;
}

.guessBox .right {
    margin-left: 20px;
    flex: 1;
}

.guessBox .right .top {
    width: 300px;
    height: 230px;
    background: #FFFFFF;
}

.guessBox .right .top .qdBtn {
    width: 203px;
    height: 47px;
    background: #F3823E;
    border-radius: 24px;
    margin: 20px auto 16px;
    font-weight: 600;
    font-size: 18px;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.guessBox .right .top .qdBtn:hover {
    background: #f16c1a;
}

.guessBox .right .top .text {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    text-align: center;
}

.guessBox .right .top .nologin {
    font-weight: 400;
    font-size: 16px;
    color: #7B7B7B;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 12px;
}

.guessBox .right .top .nologin a {
    font-weight: 400;
    font-size: 16px;
    color: #308FF0;
    cursor: pointer;
}

.guessBox .right .bottom {
    margin-top: 20px;
    width: 300px;
    height: 380px;
    background: #FFFFFF;
    overflow: hidden;
}

.guessBox .right .bottom .ul {
    box-sizing: border-box;
    padding: 9px 19px;

}


.guessBox .right .bottom .ul a {
    display: block;
    padding-top: 19px;
    padding-bottom: 19px;
    line-height: 1.2;
    font-weight: 400;
    font-size: 16px;
    color: #7B7B7B;
    border-bottom: 2px solid rgba(223, 224, 224, 0.2);

    padding-left: 10px;
    position: relative;
    box-sizing: border-box;
}

.guessBox .right .bottom .ul a::after {
    content: '';
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: #7B7B7B;
    left: 4px;
    top: 12px;
}


/* 推荐游戏 -------------------------------------- */

.recommendGame {
    width: 1200px;
    height: 236px;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 40px 56px;
    padding-right: 102px;
    margin-top: 40px;
}

.recommendGame .title {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;

}

.recommendGame .title .img {
    width: 20px;
    height: 18px;
    margin-right: 10px;
}

.recommendGame .title .img img {
    width: 20px;
    height: 18px;
}

.recommendGame .list {
    display: flex;
    justify-content: space-between;
    margin-top: 25px;
}

.recommendGame .list .ul {
    display: flex;
    align-items: center;
    flex: 1;
    width: 954px;
    position: relative;
}

.recommendGame .list .ul .a:hover .img img {
    transform: scale(1.2);
}

.recommendGame .list .ul .a {
    margin-right: 18px;
}

.recommendGame .list .ul .a .img {
    width: 88px;
    height: 88px;
    background: #FFFFFF;
    border-radius: 2px;
    border: 2px solid #B5B3B3;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recommendGame .list .ul .a .img img {
    width: 78px;
    height: 58px;
}

.recommendGame .list .ul .a p {
    width: 88px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    text-align: center;
    padding-top: 8px;
}

.recommendGame .list .moreBox:hover .img img {
    transform: scale(1.2);
}

.recommendGame .list .moreBox {
    cursor: pointer;

}

.recommendGame .list .moreBox .img {
    width: 88px;
    height: 88px;
    background: #FFFFFF;
    border-radius: 2px;
    border: 2px solid #B5B3B3;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recommendGame .list .moreBox .img img {
    width: 38px;
    height: 38px;
}

.recommendGame .list .moreBox p {
    width: 88px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    text-align: center;
    padding-top: 8px;
}

/* 热卖推荐---------------------------------------- */

.rmtjTile {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
    margin-top: 60px;
}

.rmtjBox {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

}

.rmtjBox .item {
    width: 290px;
    height: 470px;
    background: #FFFFFF;
    margin-right: 13px;
    box-sizing: border-box;
    padding: 10px;
    margin-top: 20px;
    cursor: pointer;
}

.rmtjBox .item:hover .img img {
    transform: scale(1.2);

}

.rmtjBox .item:nth-child(4n) {
    margin-right: 0;
}

.rmtjBox .item .img {
    width: 270px;
    height: 330px;
    overflow: hidden;
}

.rmtjBox .item .img img {
    width: 270px;
    height: 330px;
}

.rmtjBox .item .name {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    height: 44px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-top: 20px;
}

.rmtjBox .item .picBox {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.rmtjBox .item .picBox .pic {
    font-weight: 600;
    font-size: 20px;
    color: #E81313;
}

.rmtjBox .item .picBox .oldPic {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    text-decoration-line: line-through;
    margin-left: 12px;
    flex: 1;
    padding-top: 5px;
}

.rmtjBox .item .picBox .btn {
    width: 75px;
    height: 30px;
    background: #F3823E;
    border-radius: 2px;
    font-weight: 400;
    font-size: 15px;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rmtjBox .item .picBox .btn:hover {
    background: #f3660f;

}

/* 专区 ------------------------------------------- */

.zqBox {
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 10px;
    margin-top: 60px;
}

.zqBox .title {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
}

.zqBox .list.show {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.zqBox .list {
    display: none;
}

.zqBox .list a {
    margin-right: 16px;
    width: 156px;
    padding-bottom: 16px;
    cursor: pointer;
}

.zqBox .list a:nth-child(7n) {
    margin-right: 0px;

}

.zqBox .list a:hover .img {
    padding: 0px;

}

.zqBox .list a:hover .name {
    font-weight: 600;
}

.zqBox .list a:hover .text {
    font-weight: 600;
}

.zqBox .list a:hover .pic {
    font-weight: 600;
}

.zqBox .list a .img {
    width: 156px;
    height: 180px;
    box-sizing: border-box;
    background: #F3F1F0;
    padding: 6px;
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.zqBox .list a .img img {
    width: 100%;
    height: 100%;
}

.zqBox .list a:nth-child(5n) {
    margin-right: 0;
}

.zqBox .list a .name {
    margin-top: 8px;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.zqBox .list a .text {
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.zqBox .list a .pic {
    font-weight: 600;
    font-size: 20px;
    color: #E81313;
    margin-top: 9px;
}

.zqBox .list .picBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding-right: 2px;
}

.zqBox .list a .picBox .oldPic {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    text-decoration-line: line-through;
    padding-top: 12px;
}

.zqBox .tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10px 0;
}

.zqBox .tabs .btn {
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zqBox .tabs .btn:hover img {
    transform: scale(1.2);
}

.zqBox .tabs .btn img {
    width: 18px;
    height: 18px;
}

.zqBox .tabs .swiper {
    width: 1100px;
    height: 40px;
    margin: 0 10px;
}

.zqBox .tabs .swiper .swiper-slide .a {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.zqBox .tabs .swiper .swiper-slide .a.act {
    position: relative;
}

.zqBox .tabs .swiper .swiper-slide .act::after {
    position: absolute;
    content: '';
    width: 40px;
    height: 2px;
    background: #2D2D2D;
    bottom: 0;
    left: calc(50% - 20px);
}

.zqBox .tabs .swiper .swiper-slide .a:hover {
    color: #1A98EC;
}

/* 游戏商品  中间搜索 */
.gameCenterBox {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 99;
    margin: 40px auto;
}

.gameCenterBox .form {
    display: flex;
    align-items: center;
    width: 620px;
}

.gameCenterBox .form .souInput {
    height: 46px;
    background: #FFFFFF;
    flex: 1;
    box-sizing: border-box;
    padding-left: 40px;
    outline: none;
    border: none;
}

.gameCenterBox .form .btnBox {
    border: none;
    cursor: pointer;
}

.gameCenterBox .btnBox {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 46px;
    background: #464D54;

}

.gameCenterBox .btnBox:hover {
    background: #282d31;

}

.gameCenterBox .btnBox img {
    width: 20px;
    height: 20px;
}

/* 游戏商品  游戏内容---------------------------------*/

.gameConBox {
    display: flex;

}

.gameConBoxleft {
    width: 280px;
    margin-right: 20px;
}

.gameConBoxleft .top {
    width: 280px;
    height: 590px;
    background: #FFFFFF;
}

.gameConBoxleft .title {
    height: 72px;
    display: flex;
    align-items: center;
    border-bottom: 2px solid rgba(187, 213, 222, 0.2);
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
}

.gameConBoxleft .title .img {
    width: 24px;
    height: 24px;
    margin-right: 10px;
    margin-left: 20px;
}

.gameConBoxleft .title .img img {
    width: 24px;
    height: 24px;
}



.gameConBox .top .ul {
    height: 500px;

}

.gameConBoxleft .ul .a {
    display: flex;
    align-items: center;
    width: 260px;
    height: 100px;
    background: #FFFFFF;
    box-shadow: 0px 0px 8px 0px rgba(130, 128, 128, 0.08);
    border-radius: 10px;
    margin: 20px auto 0;
    position: relative;
}

.gameConBoxleft .ul .a .logo {
    width: 80px;
    height: 80px;
    background: #FFFFFF;
    border-radius: 10px;
    overflow: hidden;
    margin-right: 16px;
}

.gameConBoxleft .ul .a .aright {
    width: 160px;
}

.gameConBoxleft .ul .a .aright .name {
    font-weight: 600;
    font-size: 18px;
    color: #2D2D2D;
    overflow: hidden;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    box-sizing: border-box;

    /*white-space: nowrap;*/
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.gameConBoxleft .ul .a .aright .text {
    font-weight: 400;
    font-size: 16px;
    color: #424141;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
    padding-top: 10px;
    padding-bottom: 16px;
}

.gameConBoxleft .ul .a .aright .time {
    font-weight: 400;
    font-size: 14px;
    color: #918E8E;
}

.gameConBoxleft .ul .a .logo img {
    width: 80px;
    height: 80px;
}

.gameConBoxleft .ul .a .topImg {
    position: absolute;
    top: 0;
    right: 0;
    width: 28px;
    height: 28px;
}

.gameConBoxleft .ul .a .topImg img {
    width: 28px;
    height: 28px;
}

.gameConBoxleft .ul .a:first-child .topImg {
    top: -14px;
}

.gameConBoxleft .ul .a:nth-child(n + 4) .topImg {
    display: none;
}

.gameConBoxleft .bottom {
    width: 280px;
    height: 340px;
    background: #FFFFFF;
    margin-top: 20px;
}

.gameConBoxleft .bottom .ul {
    height: 250px;
}

.gamePageGameBox {
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 10px 20px;
    width: 900px;
    min-height: 950px;
    padding-bottom: 60px;
}

.gamePageGameBox .list.show {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    box-sizing: border-box;
    margin-top: 10px;
}

.gamePageGameBox .list {
    display: none;
}

.gamePageGameBox .list a {
    margin-right: 20px;
    width: 156px;
    cursor: pointer;
    height: 280px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px 0px rgba(102, 102, 105, 0.16);
    margin-bottom: 40px;
}

.gamePageGameBox .list a:nth-child(7n) {
    margin-right: 0px;

}

.gamePageGameBox .list a:hover .img {
    padding: 0px;

}

.gamePageGameBox .list a:hover .name {
    font-weight: 600;
}

.gamePageGameBox .list a:hover .text {
    font-weight: 600;
}

.gamePageGameBox .list a:hover .pic {
    font-weight: 600;
}

.gamePageGameBox .list a .img {
    width: 156px;
    height: 180px;
    box-sizing: border-box;
    background: #F3F1F0;
    padding: 6px;
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.gamePageGameBox .list a .img img {
    width: 100%;
    height: 100%;
}

.gamePageGameBox .list a:nth-child(5n) {
    margin-right: 0;
}

.gamePageGameBox .list a .name {
    margin-top: 8px;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    /*white-space: nowrap;*/
    display: -webkit-box;

    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    box-sizing: border-box;
    padding: 0 6px;
}

.gamePageGameBox .list a .text {
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
    padding: 0 6px;
}

.gamePageGameBox .list a .pic {
    font-weight: 600;
    font-size: 18px;
    color: #E81313;
}

.gamePageGameBox .list .picBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding-right: 2px;
    box-sizing: border-box;
    padding: 0 6px;
    margin-top: 4px;
}

.gamePageGameBox .list a .picBox .oldPic {
    font-weight: 400;
    font-size: 12px;
    color: #666666;
    text-decoration-line: line-through;
}

.gamePageGameBox .tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10px 0;
}

.gamePageGameBox .tabs .btn {
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gamePageGameBox .tabs .btn:hover img {
    transform: scale(1.2);
}

.gamePageGameBox .tabs .btn img {
    width: 18px;
    height: 18px;
}

.gamePageGameBox .tabs .swiper {
    width: 800px;
    height: 40px;
    margin: 0 10px;
}

.gamePageGameBox .tabs .swiper .swiper-slide .a {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.gamePageGameBox .tabs .swiper .swiper-slide .a.act {
    position: relative;
}

.gamePageGameBox .tabs .swiper .swiper-slide .act::after {
    position: absolute;
    content: '';
    width: 40px;
    height: 2px;
    background: #2D2D2D;
    bottom: 0;
    left: calc(50% - 20px);
}

.gamePageGameBox .tabs .swiper .swiper-slide .a:hover {
    color: #1A98EC;
}

/* 优质代练 ----------------------------------------------- */

.caiOrNew {
    height: 180px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10px 20px;
}

.caiOrNew .item .top {
    display: flex;
    align-items: center;
    height: 40px;
}

.caiOrNew .item .top .icon {
    width: 28px;
    height: 18px;
    margin-right: 6px;
}

.caiOrNew .item .top .icon img {
    width: 28px;
    height: 18px;
}

.caiOrNew .item .top .name {
    flex: 1;
    font-weight: 400;
    font-size: 18px;
    color: #2D2D2D;
}

.caiOrNew .item .top .more {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
}

.caiOrNew .item .xis {
    width: 550px;
    height: 2px;
    background: #BBD5DE;
    opacity: 0.2;
}

.caiOrNew .item .swiper {
    width: 550px;
    height: 100px;
    margin-top: 11px;
}

.caiOrNew .item .swiper .a {}

.caiOrNew .item .swiper .a .img {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.caiOrNew .item .swiper .a .img img {
    width: 60px;
    height: 60px;
}

.caiOrNew .item .swiper .a .gameName {
    font-weight: 400;
    font-size: 14px;
    color: #2D2D2D;
    margin-top: 12px;
    text-align: center;
}

/* 优质代练   内容筛选*/

.gameSelectBox {}

.gameSelectBox .tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10px 20px;
    height: 62px;
    background: #FFFFFF;
    margin-top: 20px;
    border-bottom: 2px solid rgba(145, 142, 142, 0.1);
}


.gameSelectBox .tabs .btn {
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gameSelectBox .tabs .btn:hover img {
    transform: scale(1.2);
}

.gameSelectBox .tabs .btn img {
    width: 18px;
    height: 18px;
}

.gameSelectBox .tabs .swiper {
    width: 1100px;
    height: 60px;
    margin: 0 10px;
}

.gameSelectBox .tabs .swiper .swiper-slide .a {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.gameSelectBox .tabs .swiper .swiper-slide .a.act {
    position: relative;
    color: #2D2D2D;

}

.gameSelectBox .tabs .swiper .swiper-slide .act::after {
    position: absolute;
    content: '';
    width: 40px;
    height: 2px;
    background: #2D2D2D;
    bottom: 0;
    left: calc(50% - 20px);
}

.gameSelectBox .tabs .swiper .swiper-slide .a:hover {
    color: #1A98EC;
}

.gameSelectBox .serverType {
    display: flex;
    min-height: 58px;
    border-bottom: 2px solid rgba(145, 142, 142, 0.1);
    background: #FFFFFF;


}

.gameSelectBox .serverType .typeName {
    width: 100px;
    padding-left: 40px;
    height: 58px;
    line-height: 58px;

}

.gameSelectBox .serverType .ul {
    flex: 1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.gameSelectBox .serverType .ul .a {
    position: relative;
    cursor: pointer;
    width: 100px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 58px;
    line-height: 58px;
    font-weight: 400;
    font-size: 18px;
    color: #666666;
}

.gameSelectBox .serverType .ul .a:hover {
    color: #1A98EC;
}

.gameSelectBox .serverType .ul .a.act {
    color: #2D2D2D;
}

.gameSelectBox .serverType .ul .a.act::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 2px;
    background: #2D2D2D;
    bottom: 0;
    left: calc(50% - 10px);
}

.gameSelectBox .serverTypeP {
    display: flex;
    min-height: 80px;
    border-bottom: 2px solid rgba(145, 142, 142, 0.1);
    background: #FFFFFF;
    display: flex;
    align-items: center;
}

.gameSelectBox .serverTypeP .typeName {
    width: 100px;
    padding-left: 40px;
    height: 58px;
    line-height: 58px;

}

.gameSelectBox .serverTypeP .inputBiox {
    display: flex;
    align-items: center;

}

.gameSelectBox .serverTypeP .inputBiox .numInput {
    width: 120px;
    height: 40px;
    background: #F6F6F6;
    border-radius: 6px;
    outline: none;
    border: none;
    text-align: center;
}

.gameSelectBox .serverTypeP .inputBiox .heng {
    width: 29px;
    height: 2px;
    background: #C1BDBD;
    margin: 0 20px;
}

.gameSelectBox .serverTypeP .newinputBiox {
    width: 310px;
    height: 40px;
    background: #F6F6F6;
    border-radius: 6px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: 20px;
}

.gameSelectBox .serverTypeP .newinputBiox .souInpuit {
    outline: none;
    border: none;
    background: none;
    height: 100%;
    flex: 1;
    font-size: 16px;

}

.gameSelectBox .serverTypeP .newinputBiox .souInpuit::placeholder {
    font-weight: 400;
    font-size: 16px;
    color: #999999;
}

.gameSelectBox .serverTypeP .newinputBiox .imgBtn {
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.gameSelectBox .serverTypeP .newinputBiox .imgBtn img {
    width: 20px;
    height: 20px;
}

.gameSelectBox .serverTypeS {
    height: 62px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
}

.gameSelectBox .serverTypeS .typeName {
    width: 100px;
    padding-left: 40px;
}

.gameSelectBox .serverTypeS .sortBox {
    display: flex;
    flex: 1;
    align-items: center;
}

.gameSelectBox .serverTypeS .sortBox .a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    cursor: pointer;
    font-weight: 400;
    font-size: 18px;
    color: #2D2D2D;
}

.gameSelectBox .serverTypeS .sortBox .a .img {
    width: 20px;
    height: 20px;
    margin-left: 10px;
}

.gameSelectBox .serverTypeS .sortBox .a .img img {
    width: 20px;
    height: 20px;
}

.gameSelectBox .serverTypeS .sortBox .souBtn {
    width: 80px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #F3823E;
    border-radius: 4px;
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    margin-left: 20px;

}

.gameSelectBox .serverTypeS .sortBox .souBtn:hover {
    background: #f36913;

}

.gameSelectBox .serverTypeS .sortBox .clreaAll {
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 18px;
    color: #999999;
    padding-right: 30px;

}

.gameSelectBox .serverTypeS .sortBox .clreaAll .img {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.gameSelectBox .serverTypeS .sortBox .clreaAll .img img {
    width: 18px;
    height: 18px;
}

.gameSelectBox .tableTile {
    display: flex;
    align-items: center;
    height: 56px;
    font-weight: 400;
    font-size: 16px;
    color: #999999;
}

.gameSelectBox .tableTile .lef1 {
    width: 350px;
}

.gameSelectBox .tableTile .lef2 {
    width: 372px;
    padding-left: 60px;
    box-sizing: border-box;

}

.gameSelectBox .tableTile .lef3 {
    width: 160px;
    text-align: center;
}


.gameSelectBox .tableTile .lef4 {
    width: 160px;
    text-align: center;
}

.gameSelectBox .tableLis {
    height: 242px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 10px;
    margin-bottom: 20px;

}

.gameSelectBox .tableLis .lef1 {
    width: 340px;
    height: 222px;
    background: #F3F1F0;
}

.gameSelectBox .tableLis .lef1 img {
    width: 340px;
    height: 222px;
    background: #F3F1F0;
}

.gameSelectBox .tableLis .lef2 {
    box-sizing: border-box;
    width: 372px;
    padding: 10px 20px;
}

.gameSelectBox .tableLis .lef2 .tiop {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: #0D2252;
    border-radius: 13px;
    box-sizing: border-box;
    padding: 0 22px;
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
    max-width: 320px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

}

.gameSelectBox .tableLis .lef2 .name {
    font-weight: 600;
    font-size: 18px;
    color: #2D2D2D;
    margin-top: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gameSelectBox .tableLis .lef2 .text {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    margin-top: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gameSelectBox .tableLis .lef2 .tips {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    padding-top: 9px;
    box-sizing: border-box;
    height: 73px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}

.gameSelectBox .tableLis .lef2 .time {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    margin-top: 6px;
}

.gameSelectBox .tableLis .lef3 {
    font-weight: 600;
    font-size: 20px;
    color: #E95216;
    width: 160px;
    text-align: center;
}

.gameSelectBox .tableLis .lef4 {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
    width: 160px;

    text-align: center;

}

.gameSelectBox .tableLis .lef5 {
    display: flex;
    align-items: center;
    justify-content: center;

}

.gameSelectBox .tableLis .lef5 .btn {
    width: 130px;
    height: 40px;
    line-height: 40px;
    background: #F3823E;
    border-radius: 6px;
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    text-align: center;
    cursor: pointer;
}

.gameSelectBox .tableLis .lef5 .btn:hover {
    background: #ff6a0e;

}

/* 大神玩家内容 ----------------------------------------------- */
.dashenLis {
    min-height: 380px;
    background: #FFFFFF;
    margin-bottom: 20px;
    box-sizing: border-box;
    padding: 20px;
}

.dashenLis .top {
    display: flex;
    align-items: center;
}

.dashenLis .top .logo {
    width: 60px;
    height: 60px;
    background: #202C3E;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
}

.dashenLis .top .logo img {
    width: 60px;
    height: 60px;

}

.dashenLis .top .nameBox {
    flex: 1;
    margin-left: 22px;
}

.dashenLis .top .nameBox .name {
    display: flex;
    align-items: center;
}

.dashenLis .top .nameBox .name .text {
    font-weight: 400;
    font-size: 18px;
    color: #2D2D2D;
    cursor: pointer;

}

.dashenLis .top .nameBox .name .tab {
    height: 20px;
    line-height: 20px;
    padding: 0 6px;
    background: #F88037;
    border-radius: 9px;
    font-weight: 400;
    font-size: 14px;
    color: #FFFFFF;
    margin-left: 26px;
}

.dashenLis .top .nameBox .serverBox {
    display: flex;
    align-items: center;
}

.dashenLis .top .nameBox .serverBox .bbnum {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    width: 176px;
}

.dashenLis .top .nameBox .serverBox .servernum {
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    flex: 1;
}

.dashenLis .top .nameBox .serverBox .servernum .sername {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
}

.dashenLis .top .nameBox .serverBox .servernum .type {
    height: 28px;
    line-height: 28px;
    background: #F6F6F6;
    border-radius: 8px;
    padding: 0 8px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    margin-left: 10px;
    cursor: pointer;

}

.dashenLis .top .nameBox .serverBox .btnBox {
    display: flex;
    align-items: center;
}

.dashenLis .top .nameBox .serverBox .btnBox .btn {
    width: 80px;
    height: 36px;
    border-radius: 8px;
    font-weight: 400;
    font-size: 16px;
    box-sizing: border-box;
    margin-left: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.dashenLis .top .nameBox .serverBox .btnBox .btn.mian {
    background: #F88037;
    color: #FFFFFF;


}

.dashenLis .top .nameBox .serverBox .btnBox .btn.mian:hover {
    background: #e75f0a;

}

.dashenLis .top .nameBox .serverBox .btnBox .btn.xian {
    border: 1px solid #F88037;
    background: #FFFFFF;
    color: #2D2D2D;
}

.dashenLis .top .nameBox .serverBox .btnBox .btn.xian:hover {
    border: 1px solid #e75f0a;
    background: #FFFFFF;
    color: #e75f0a;
}

.dashenLis .shopBox {
    display: flex;
    margin-top: 20px;
    flex-wrap: wrap;
}

.dashenLis .shopBox .item {
    margin-right: 20px;
    cursor: pointer;
    width: 216px;
    margin-bottom: 20px;

}

.dashenLis .shopBox .item:nth-child(5n) {
    margin-right: 0px;
}

.dashenLis .shopBox .item:hover .logo {
    padding: 0px;

}

.dashenLis .shopBox .item:hover .logo img {
    width: 216px;
    height: 180px;

}

.dashenLis .shopBox .item .logo {
    width: 216px;
    height: 180px;
    background: #F9F9F9;
    border-radius: 20px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 4px;
    font-size: 0;

}

.dashenLis .shopBox .item .logo img {
    width: 208px;
    height: 172px;
    border-radius: 20px;

}

.dashenLis .shopBox .item .name {
    margin-top: 4px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    height: 43px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;

}

.dashenLis .shopBox .item .picBox {
    display: flex;
    align-items: self-end;
    margin-top: 13px;
}

.dashenLis .shopBox .item .picBox .pic {
    font-weight: 600;
    font-size: 20px;
    color: #E95216;
}

.dashenLis .shopBox .item .picBox .cjnum {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    margin-left: 20px;
}

/* 游戏援助 ------------------------------------------ */
.gameYz {}

.gameYz .topBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.gameYz .topBox .messageBox {
    width: 300px;
    height: 260px;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 20px;
    overflow: hidden;
}

.gameYz .topBox .messageBox .title {
    display: flex;
    justify-content: space-between;
    align-items: self-end;

}

.gameYz .topBox .messageBox .title .name {
    font-weight: 400;
    font-size: 18px;
    color: #2D2D2D;
}

.gameYz .topBox .messageBox .title .more {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
}

.gameYz .topBox .messageBox .ul {}

.gameYz .topBox .messageBox .ul .a {
    border-bottom: 1px solid rgba(223, 224, 224, 0.3);
    display: block;
    height: 68px;
    box-sizing: border-box;
    padding-top: 14px;
    cursor: pointer;
}

.gameYz .topBox .messageBox .ul .a:hover {
    border-bottom: 1px solid rgba(223, 224, 224, 1);

}

.gameYz .topBox .messageBox .ul .a .cont {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
    padding-left: 8px;
    position: relative;
}

.gameYz .topBox .messageBox .ul .a .cont::after {
    content: '';
    position: absolute;
    width: 2px;
    height: 2px;
    background: #666666;
    border-radius: 50%;
    top: calc(50% - 1px);
    left: 2px;

}

.gameYz .topBox .messageBox .ul .a .time {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    text-align: right;
    padding-top: 6px;
}

.gameYz .tipBox {
    width: 420px;
    height: 260px;
    position: relative;

}

.gameYz .tipBox .swiper-pagination {
    bottom: 4px;
}

.gameYz .tipBox .swiper-pagination .swiper-pagination-bullet-active {
    width: 18px;
    height: 2px;
    background: #fff;
    border-radius: 0;

}

.gameYz .tipBox .swiper-pagination .swiper-pagination-bullet {
    width: 18px;
    height: 2px;
    background: #F9F9F9;
    border-radius: 0;
}

.gameYz .topBox .tipBox .tipBoxItem {
    background: #5D81EA;
    box-sizing: border-box;
    padding: 20px 15px;
    position: relative;
    width: 420px;
    height: 260px;

}

.gameYz .topBox .tipBox .xian {
    position: absolute;
    width: 100px;
    height: 2px;
    background: #FFD40F;
    border-radius: 1px;
    top: 28px;
    right: 38px;
}

.gameYz .topBox .tipBox .xian::after {
    position: absolute;
    content: '';
    width: 2px;
    height: 2px;
    background: #FFD40F;
    border-radius: 1px;
    top: 0;
    left: -4px;
}

.gameYz .topBox .tipBox .xian::before {
    position: absolute;
    content: '';
    width: 2px;
    height: 2px;
    background: #FFD40F;
    border-radius: 1px;
    top: 0;
    left: -8px;


}

.gameYz .topBox .tipBox .tipImg {
    position: absolute;
    width: 96px;
    height: 32px;
    top: 9px;
    left: 15px;
    font-size: 0;

}

.gameYz .topBox .tipBox .tipImg img {
    width: 96px;
    height: 32px;
}

.gameYz .topBox .tipBox .jgImg {
    position: absolute;
    width: 34px;
    height: 34px;
    right: 6px;
    bottom: 14px;
    font-size: 0;
}

.gameYz .topBox .tipBox .jgImg img {
    width: 34px;
    height: 34px;
}

.gameYz .topBox .tipBox .box {
    background: #FFFFFF;
    border-radius: 16px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 20px 10px 20px 0;

}

.gameYz .topBox .tipBox .box .a {
    display: flex;
    height: 46px;
    margin-top: 10px;
}

.gameYz .topBox .tipBox .box .a:hover .num {
    background: #ffab03;

}

.gameYz .topBox .tipBox .box .num {
    width: 28px;
    height: 24px;
    background: #F5A200;
    border-radius: 0px 6px 6px 0px;
    font-weight: bold;
    font-size: 18px;
    color: #FFFFFF;
    text-align: center;
    justify-content: center;
    margin-right: 10px;
}

.gameYz .topBox .tipBox .box .content {
    width: calc(100% - 38px);
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;

}

.gameYz .topBox .noLogin {
    width: 440px;
    height: 260px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url("../img/gameyzbg.png");
    background-size: 100% 100%;

}

.gameYz .topBox .noLogin .btnBox {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gameYz .topBox .noLogin .btn {
    width: 120px;
    height: 40px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 10px;
    box-sizing: border-box;
    cursor: pointer;
}

.gameYz .topBox .noLogin .btn.mian {
    background: #F3823E;
    color: #FFFFFF;


}

.gameYz .topBox .noLogin .btn.mian:hover {
    background: #f36d1a;

}

.gameYz .topBox .noLogin .btn.xian {
    border: 2px solid #F3823E;
    background: #fff;
    color: #F3823E;
}

.gameYz .topBox .noLogin .btn.xian:hover {
    border: 2px solid #f36d1a;
    background: #fff;
    color: #f36d1a;
}

.gameYz .topBox .loginIng {
    width: 440px;
    height: 260px;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 10px;
}

.gameYz .topBox .loginIng .user {
    display: flex;
    align-items: center;
    border-bottom: 2px solid #F5F5F5;
    height: 70px;
}

.gameYz .topBox .loginIng .user .header {
    width: 60px;
    height: 60px;
    background: #ECECEC;
    border-radius: 8px;
    overflow: hidden;
    font-size: 0;
    margin-right: 12px;

}

.gameYz .topBox .loginIng .user .header img {
    width: 60px;
    height: 60px;
    border-radius: 8px;
}

.gameYz .topBox .loginIng .user .right {
    flex: 1;
}

.gameYz .topBox .loginIng .user .right .name {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
}

.gameYz .topBox .loginIng .user .right .renzheng {
    display: flex;
    align-items: center;
    margin-top: 16px;
}

.gameYz .topBox .loginIng .user .right .renzheng .itemz {
    display: flex;
    align-items: center;
    margin-right: 20px;
    cursor: pointer;
}

.gameYz .topBox .loginIng .user .right .renzheng .itemz .icon {
    width: 16px;
    height: 16px;
    width: 16px;
    height: 16px;
    font-size: 0;
    margin-right: 6px;
}

.gameYz .topBox .loginIng .user .right .renzheng .itemz .icon img {
    width: 16px;
    height: 16px;
}

.gameYz .topBox .loginIng .user .right .renzheng .itemz .ds {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
}

.gameYz .topBox .loginIng .user .right .renzheng .itemz .ds:hover {
    color: #1A98EC;
}

.gameYz .topBox .loginIng .contsg {
    display: flex;
    align-items: center;
    margin-top: 10px;
    width: 420px;
    height: 84px;
    background: #FAFAFA;
}

.gameYz .topBox .loginIng .contsg .itmn {
    width: 25%;

}

.gameYz .topBox .loginIng .contsg .tit {
    font-weight: 400;
    font-size: 16px;
    color: #308FF0;
    text-align: center;
}

.gameYz .topBox .loginIng .contsg .num {
    font-weight: 600;
    font-size: 18px;
    color: #2D2D2D;
    text-align: center;
    padding-top: 14px;

}

.gameYz .topBox .loginIng .btnBox {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
}

.gameYz .topBox .loginIng .btnBox .btn {
    width: 120px;
    height: 40px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    margin: 0 10px;
    cursor: pointer;
}

.gameYz .topBox .loginIng .btnBox .btn.mian {
    background: #F3823E;
    color: #FFFFFF;
}

.gameYz .topBox .loginIng .btnBox .btn.xian {
    background: #fff;
    color: #F3823E;
    border: 2px solid #F3823E;

}

.gameYz .topBox .loginIng .btnBox .btn.mian:hover {
    background: #f0630b;
    color: #FFFFFF;
}

.gameYz .topBox .loginIng .btnBox .btn.xian:hover {
    background: #fff;
    color: #f0630b;
    border: 2px solid #f0630b;
}

/* 游戏援助条件筛选 -------------------------------- */
.gameYzType {
    margin-top: 40px;
}

.gameYzType .serverType {
    display: flex;
    min-height: 60px;
    border-bottom: 2px solid rgba(145, 142, 142, 0.1);
    background: #FFFFFF;


}

.gameYzType .serverType .typeName {
    width: 100px;
    padding-left: 40px;
    height: 58px;
    line-height: 58px;

}

.gameYzType .serverType .ul {
    flex: 1;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.gameYzType .serverType .ul .a {
    position: relative;
    cursor: pointer;
    width: 100px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 58px;
    line-height: 58px;
    font-weight: 400;
    font-size: 18px;
    color: #666666;
}

.gameYzType .serverType .ul .a:hover {
    color: #1A98EC;
}

.gameYzType .serverType .ul .a.act {
    color: #2D2D2D;
}

.gameYzType .serverType .ul .a.act::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 2px;
    background: #2D2D2D;
    bottom: 0;
    left: calc(50% - 10px);
}

.gameYzType .serverTypes {
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 0 40px;

}

.gameYzType .serverTypes .left {
    display: flex;
    align-items: center;
}

.gameYzType .serverTypes .left .btns {
    min-width: 100px;
    padding: 0 6px;
    font-size: 18px;
    color: #666666;
    height: 40px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    border-radius: 10px;

}

.gameYzType .serverTypes .left .btns.act {
    background: #FCF2DF;
    color: #2D2D2D;
}

.gameYzType .serverTypes .left .btns:hover {
    background: #ecd19d;


}

.gameYzType .serverTypes .right {
    display: flex;
    align-items: center;
}

.gameYzType .serverTypes .right .btnsg {
    font-weight: 400;
    font-size: 18px;
    width: 120px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 20px;
    box-sizing: border-box;
}

.gameYzType .serverTypes .right .btnsg .icon {
    font-size: 0;
    width: 19px;
    height: 19px;
    margin-right: 10px;
}

.gameYzType .serverTypes .right .btnsg .icon img {
    width: 19px;
    height: 19px;
}



.gameYzType .serverTypes .right .btnsg.mian {
    color: #FFFFFF;
    background: #308FF0;


}

.gameYzType .serverTypes .right .btnsg.xian {
    color: #308FF0;
    border: 2px solid #308FF0;

}

.gameYzType .serverTypes .right .btnsg.mian:hover {
    background: #007cf7;


}

.gameYzType .serverTypes .right .btnsg.xian:hover {
    color: #007cf7;
    border: 2px solid #007cf7;

}

/* 游戏援助内容 表头 --------------------------------------- */
.contTabH {
    display: flex;
    align-items: center;
    height: 56px;
    margin-top: 20px;
    box-sizing: border-box;
    padding-left: 40px;
}

.contTabH .tabi {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
}

.contTabH .tabi1 {
    width: 300px;
}

.contTabH .tabi2 {
    text-align: center;
    width: 160px;

}

.contTabH .tabi3 {
    text-align: center;
    width: 120px;

}

.contTabH .tabi4 {
    text-align: center;
    width: 120px;

}

.contTabH .tabi5 {
    text-align: center;
    width: 160px;

}

.contTabH .tabi6 {
    text-align: center;
    width: 160px;

}

.contTabH .tabi7 {
    text-align: center;
    width: 160px;

}



/* 游戏援助内容 表格 --------------------------------------- */
.contTabLis {
    height: 180px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: 40px;
    margin-bottom: 10px;

}

.contTabLis .tabi1 {
    width: 300px;
}

.contTabLis .tabi1 .nbame {
    font-weight: 600;
    font-size: 18px;
    color: #2D2D2D;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}

.contTabLis .tabi1 .nbame:hover {
    color: #007cf7;
}

.contTabLis .tabi1 .text {
    width: 300px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    margin-top: 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.contTabLis .tabi1 .tips {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    margin-top: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}


.contTabLis .tabi2 {
    text-align: center;
    width: 160px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
}

.contTabLis .tabi3 {
    text-align: center;
    width: 120px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;

}

.contTabLis .tabi4 {
    text-align: center;
    width: 120px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;

}

.contTabLis .tabi5 {
    text-align: center;
    width: 160px;
    font-weight: 600;
    font-size: 16px;
    color: #E95216;
}

.contTabLis .tabi6 {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 160px;

}

.contTabLis .tabi6 .type {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 40px;
    background: #F6F6F6;
    border-radius: 6px;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;

}

.contTabLis .tabi7 {
    width: 160px;
    display: flex;
    align-items: center;
    justify-content: center;

}

.contTabLis .tabi7 .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 40px;
    background: #F3823E;
    border-radius: 6px;
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
    cursor: pointer;

}

.contTabLis .tabi7 .btn:hover {
    background: #ee620a;

}


/* 商品详情页面------------------------------ */

.routerNav {
    display: flex;
    align-items: center;
    height: 60px;
}

.routerNav .home {
    font-weight: 400;
    font-size: 20px;
    color: #918E8E;
    text-align: center;
    padding-left: 20px;
}

.routerNav .home:hover {
    color: #E05C28;
    cursor: pointer;
}

.routerNav .img {
    width: 20px;
    height: 20px;
    font-size: 0;
    margin-right: 6px;
    padding-top: 4px;
}

.routerNav .img img {
    width: 20px;
    height: 20px;
    font-size: 0;
}

.routerNav span {
    font-weight: 400;
    font-size: 20px;
    color: #E05C28;
}

.goodInfoBox {
    display: flex;

}

.goodInfoBox .left {
    width: 280px;
    margin-right: 20px;
}

.goodInfoBox .left .top {
    width: 280px;
    height: 590px;
    background: #FFFFFF;
}

.goodInfoBox .left .title {
    height: 72px;
    display: flex;
    align-items: center;
    border-bottom: 2px solid rgba(187, 213, 222, 0.2);
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
    font-weight: 600;
    box-sizing: border-box;
    padding-left: 20px;
}




.goodInfoBox .top .ul {
    height: 500px;

}

.goodInfoBox .left .ul .a {
    display: flex;
    align-items: center;
    width: 260px;
    height: 100px;
    background: #FFFFFF;
    box-shadow: 0px 0px 8px 0px rgba(130, 128, 128, 0.08);
    border-radius: 10px;
    margin: 20px auto 0;
    position: relative;
}

.goodInfoBox .left .ul .a .logo {
    width: 80px;
    height: 80px;
    background: #FFFFFF;
    border-radius: 10px;
    overflow: hidden;
    margin-right: 16px;
}

.goodInfoBox .left .ul .a .aright {
    width: 160px;
}


.goodInfoBox .left .ul .a .aright .text {
    font-weight: 400;
    font-size: 16px;
    color: #424141;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
    padding-top: 4px;
    padding-bottom: 10px;
}


.goodInfoBox .left .ul .a .logo img {
    width: 80px;
    height: 80px;
}

.goodInfoBox .left .ul .a .topImg {
    position: absolute;
    top: 0;
    right: 0;
    width: 28px;
    height: 28px;
}

.goodInfoBox .left .ul .a .topImg img {
    width: 28px;
    height: 28px;
}

.goodInfoBox .left .ul .a:first-child .topImg {
    top: -14px;
}

.goodInfoBox .left .ul .a:nth-child(n + 4) .topImg {
    display: none;
}

.goodInfoBox .left .bottom {
    width: 280px;
    height: 340px;
    background: #FFFFFF;
    margin-top: 20px;
}

.goodInfoBox .left .bottom .ul {
    height: 250px;
}

.goodInfoBox .right {
    background: #FFFFFF;
    box-sizing: border-box;
    width: 900px;
    min-height: 950px;
    padding-bottom: 60px;
}

.goodInfoBox .right .infoBox {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 20px;
    width: 900px;
    height: 260px;
    background: #FFFFFF;
}

.goodInfoBox .right .infoBox .img {
    width: 420px;
    height: 220px;
    background: #F3F1F0;
    border-radius: 20px;
    overflow: hidden;
    margin-right: 20px;
}

.goodInfoBox .right .infoBox .img img {
    width: 420px;
    height: 220px;
    border-radius: 20px;
}

.goodInfoBox .right .infoBox .infoRight {}

.goodInfoBox .right .infoBox .infoRight .name {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}

.goodInfoBox .right .infoBox .infoRight .picBox {
    display: flex;
    align-items: flex-end;
    margin-top: 18px;
}

.goodInfoBox .right .infoBox .infoRight .picBox .tit {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
}

.goodInfoBox .right .infoBox .infoRight .picBox .pic {
    font-weight: 600;
    font-size: 24px;
    color: #E95216;
}

.goodInfoBox .right .infoBox .infoRight .picBox .oldPic {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    text-decoration-line: line-through;
    margin-left: 18px;
}

.goodInfoBox .right .infoBox .infoRight .fh {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    margin-top: 18px;

}

.goodInfoBox .right .infoBox .infoRight .nulm {
    display: flex;
    align-items: center;
    margin-top: 18px;

}

.goodInfoBox .right .infoBox .infoRight .nulm .tisg {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;


}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox {
    display: flex;
    align-items: center;
    font-size: 0;
}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #FFFFFF;
    border: 1px solid #E0E0E0;
    cursor: pointer;
}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox .icon:first-child {
    border-radius: 2px 0 0 2px;

}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox .icon:last-child {
    border-radius: 0 2px 2px 0;

}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox .icon img {
    width: 13px;
    height: 13px;
}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox .num {
    width: 80px;
    height: 32px;
    background: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-left: none;
    border-right: none;
    outline: none;
    text-align: center;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
}

/* 去掉上下箭头 */
.goodInfoBox .right .infoBox .infoRight .nulm .jsBox input::-webkit-inner-spin-button,
.goodInfoBox .right .infoBox .infoRight .nulm .jsBox input::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
}

.goodInfoBox .right .infoBox .infoRight .nulm .jsBox input[type='number'] {
    appearance: textfield;
}

.goodInfoBox .right .infoBox .infoRight .nulm .tips {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    margin-left: 12px;
    padding-top: 10px;
}

.goodInfoBox .right .souBox {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 60px;
    height: 64px;
    border-top: 2px solid #F5F5F5;
    border-bottom: 2px solid #F5F5F5;
}

.goodInfoBox .right .souBox .icon {
    width: 18px;
    height: 18px;
    font-size: 0;
}

.goodInfoBox .right .souBox .icon img {
    width: 18px;
    height: 18px;
}

.goodInfoBox .right .souBox .scText {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    margin-left: 12px;
    margin-right: 12px;
}

.goodInfoBox .right .souBox .souBtn {
    cursor: pointer;
    display: flex;
    align-items: center;
}

.goodInfoBox .right .souBox .scTextkh {
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    flex: 1;
}

.goodInfoBox .right .souBox .btnBox {
    display: flex;
    align-items: center;
    padding-right: 40px;
}

.goodInfoBox .right .btn {
    cursor: pointer;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 18px;
    width: 140px;
    height: 40px;
    background: #FFFFFF;
    border-radius: 6px;
    margin: 0 20px;

}

.goodInfoBox .right  .btn.xian {
    color: #F3823E;
    border: 1px solid #F3823E;

}

.goodInfoBox .right .btn.mian {
    color: #fff;
    background: #F3823E;

}

.goodInfoBox .right .btn.xian:hover {
    color: #ee630d;
    border: 1px solid #ee630d;

}

.goodInfoBox .right  .btn.mian:hover {
    color: #fff;
    background: #ee630d;

}

.goodInfoBox .right .tabs {
    height: 62px;
    box-sizing: border-box;
    padding: 0 60px;
    background: #FFFFFF;
    border-bottom: 2px solid #F5F5F5;
    display: flex;
    align-items: center;
}

.goodInfoBox .right .tabs .item {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    margin-right: 60px;
    cursor: pointer;
}

.goodInfoBox .right .tabs .item:hover {
    color: #F3823E;
}

.goodInfoBox .right .tabs .item.act::after {
    content: '';
    position: absolute;
    width: 40px;
    height: 4px;
    background: #F3823E;
    bottom: 1px;
    left: calc(50% - 20px);
}

.goodInfoBox .right .info {
    box-sizing: border-box;
    padding: 20px;
    display: none;
}

.goodInfoBox .right .info.show {
    display: block;

}

/* 游戏资讯内容 ------------------------------------------------*/
.gameZx {
    height: 360px;
    background: #F6F6F6;
    border-radius: 6px;
    position: relative;

}

.gameZx .swiper {
    width: 100%;
    height: 360px;
    overflow: hidden;
    font-size: 0;
}

.gameZx .swiper .swiper-slide img {
    width: 100%;

}


.gameZx .swiper-pagination {
    bottom: 20px;
}

.gameZx .swiper-pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #F4F4F4;
}

.gameZx .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 20px;
    height: 6px;
    background: #FFFFFF !important;
    border-radius: 3px;
}

.gameZxBox {
    display: flex;
    margin-top: 20px;

}

.gameZxBox .leftBox {
    width: 240px;
    height: 1100px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px 0px rgba(102, 102, 105, 0.16);
    border-radius: 20px;
    margin-right: 10px;
}

.gameZxBox .leftBox .item {
    font-weight: 400;
    font-size: 18px;
    color: #2D2D2D;
    width: 240px;
    height: 60px;
    background: #F9F9F9;
    margin-bottom: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
}

.gameZxBox .leftBox .item:first-child {
    border-radius: 20px 20px 0px 0px;
    overflow: hidden;
}

.gameZxBox .leftBox .item:hover {
    color: #F6F6F6;
    background: #F5A200;
    font-weight: 600;
}

.gameZxBox .leftBox .item.act {
    color: #F6F6F6;
    background: #F5A200;
}

.gameZxBox .leftBox .act::after {
    content: '';
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 20px solid #F5A200;
    position: absolute;
    top: calc(50% - 10px);
    right: -10px;
}

.gameZxBox .rightBox.show {
    display: block;
}

.gameZxBox .rightBox {
    display: none;
    width: 950px;
    min-height: 1100px;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 0 20px;
}

.gameZxBox .rightBox .titleBox {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.gameZxBox .rightBox .titleBox .name {
    font-weight: 600;
    font-size: 20px;
    color: #2D2D2D;
}

.gameZxBox .rightBox .titleBox .more {
    cursor: pointer;
    font-weight: 400;
    font-size: 14px;
    color: #2D2D2D;
}

.gameZxBox .rightBox .activeUl {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

}

.gameZxBox .rightBox .activeUl .li {
    width: 290px;
    margin-right: 20px;
    cursor: pointer;
    margin-bottom: 20px;
}

.gameZxBox .rightBox .activeUl .li:hover .img img {
    transform: scale(1.2);

}

.gameZxBox .rightBox .activeUl .li .img {
    width: 290px;
    height: 180px;
    font-size: 0;
    background: #F3F1F0;
    overflow: hidden;
}

.gameZxBox .rightBox .activeUl .li .img img {
    width: 290px;
    height: 180px;
}

.gameZxBox .rightBox .activeUl .li .imgBotom {
    width: 290px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px 0px rgba(102, 102, 105, 0.16);
    box-sizing: border-box;
    padding: 8px 14px;
}

.gameZxBox .rightBox .activeUl .li .name {
    font-weight: 600;
    height: 50px;
    font-size: 16px;
    color: #343536;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}

.gameZxBox .rightBox .activeUl .li .text {
    font-weight: 400;
    font-size: 14px;
    margin-top: 6px;
    margin-bottom: 6px;
    height: 40px;
    color: #666666;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}

.gameZxBox .rightBox .activeUl .li .bottom {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
}

.gameZxBox .rightBox .activeUl .li:nth-child(3n) {
    margin-right: 0;

}

.gameZxBox .rightBox .messAgeLi {
    position: relative;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding-left: 26px;
    padding-right: 20px;
    width: 910px;
    height: 40px;
    background: #F9F9F9;
    margin-bottom: 10px;
}

.gameZxBox .rightBox .messAgeLi:hover {
    background: #e4e0e0;

}

.gameZxBox .rightBox .messAgeLi::after {
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #343536;
    top: calc(50% - 2px);
    left: 18px;
}

.gameZxBox .rightBox .messAgeLi .text {
    font-weight: 400;
    font-size: 16px;
    color: #343536;
    flex: 1;
}

.gameZxBox .rightBox .messAgeLi .time {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
}

.gameZxBox .rightBox .jsLi {
    height: 180px;
    background: #F9F9F9;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    cursor: pointer;
    margin-bottom: 20px;
}

.gameZxBox .rightBox .jsLi .img {
    font-size: 0;
    width: 290px;
    height: 180px;
    background: #F3F1F0;
    overflow: hidden;
}

.gameZxBox .rightBox .jsLi .img img {
    width: 290px;
    height: 180px;
}

.gameZxBox .rightBox .jsLi .righbs {
    flex: 1;
    box-sizing: border-box;
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
}

.gameZxBox .rightBox .jsLi .righbs .name {
    font-weight: 600;
    font-size: 18px;
    color: #343536;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.gameZxBox .rightBox .jsLi .righbs .text {
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    height: 93px;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    /* 显示的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
}

.gameZxBox .rightBox .jsLi .righbs .time {
    font-weight: 400;
    font-size: 14px;
    color: #999999;
}

.gameZxBox .rightBox .jsLi:hover {
    background: #cecaca;

}

.gameZxBox .rightBox .jsLi:hover .img img {
    transform: scale(1.2);

}

/* 玩家曝光内容 ------------------------------------------------*/
.pubtopBox {
    width: 100%;
    min-width: 1200px;
    height: 340px;
    background: url(../img/pubtop.jpg) center center no-repeat;
    display: block;
}

.pubtopBox .pubtop {
    position: relative;
    height: 340px;

}

.pubtopBox .pubtop .btn {
    position: absolute;
    bottom: 12px;
    right: 21px;
    width: 220px;
    height: 53px;
    cursor: pointer;
}

.pubtopBox .pubtop .btn1 {
    position: absolute;
    top: 123px;
    right: 230px;
    width: 130px;
    font-size: 15px;
    font-weight: 700;
    height: 35px;
    line-height: 35px;
    -webkit-transform: rotate(3.5deg);
    -ms-transform: rotate(3.5deg);
    transform: rotate(3.5deg);
    color: #4a4b6c;
    text-align: center;
}

.pubtopBox .pubtop .btn2 {
    position: absolute;
    top: 159px;
    right: 230px;
    width: 130px;
    font-size: 15px;
    font-weight: 700;
    height: 35px;
    line-height: 35px;
    -webkit-transform: rotate(3.5deg);
    -ms-transform: rotate(3.5deg);
    transform: rotate(3.5deg);
    color: #4a4b6c;
    text-align: center;
}

.pubtopBox .pubtop .btnHover:hover {
    color: #007cf7;
}

.pubtopBox .pubtop .userInfo {
    /* background: rgba(255, 0, 0, 0.233); */
    position: absolute;
    top: 101px;
    left: 48px;
    display: flex;
    align-items: center;


}

.pubtopBox .pubtop .userInfo .header {
    border-radius: 50%;
    border: 2px solid #fff;
    width: 80px;
    height: 80px;
    overflow: hidden;
    margin-right: 20px;
}

.pubtopBox .pubtop .userInfo .header img {
    width: 80px;
    height: 80px;
}

.pubtopBox .pubtop .userInfo .right .tip {
    color: #fff;
    font-weight: 400;
    font-size: 16px;
}

.bgTabs {
    margin-top: 20px;
    box-sizing: border-box;
    padding: 0 20px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px 0px rgba(102, 102, 105, 0.16);
}

.bgTabs .isg {
    width: 220px;
    border-bottom: #FF6600 solid 2px;
    color: #FF6600;
    font-size: 19px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bgTabs .conTent {
    padding: 20px;
    background: #FFFFFF;
    
}
.bgTabs .nodata {
    padding: 100px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;

}
.bgTabs .nodata .cont .img {
    width: 100px;
    height: 100px;
}
.bgTabs .nodata .cont .img img{
    width: 100px;
    height: 100px;
}
.bgTabs .nodata .cont  .zs{
    text-align: center;
    font-size: 16px;
    color: #ccc;
    padding-top: 20px;
}


/* 首页分类样式 变化 背景 和 字体颜色

*/
/* object-fit: cover;   在图片可能出现变形的地方
.xxx{
    font-size:0;
    width:xxx;
    height:xxx;
}


*/
img{ width:100%; height:100%;object-fit: cover;}
/* 支付弹窗 -------------------------------------*/
.payMode {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 500px;
    min-width: 1000px;
    z-index: 180;
    background: rgba(0, 0, 0, 0.4);
    display: none;
}

.payMode .modeBox {
    background: #fff;
    border-radius: 20px;
    box-sizing: border-box;
    width: 480px;
    min-height: 400px;
    box-sizing: border-box;
    padding: 20px;
    position: absolute;
    top: calc(50% - 200px);
    left: calc(50% - 240px);


}

.payMode .modeBox .colse {
    font-size: 0;
    position: absolute;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.payMode .modeBox .colse img {
    width: 100%;
    height: 100%;
}

.payMode .modeBox .tab {
    display: flex;
    align-items: center;
    height: 62px;
    box-sizing: border-box;
    background: #FFFFFF;
    border-bottom: 2px solid #F5F5F5;
}

.payMode .modeBox .tab .item {
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    margin-right: 60px;
    cursor: pointer;
    min-width: 80px;
    text-align: center;
}

.payMode .modeBox .tab .item.act::after {
    content: '';
    position: absolute;
    width: 40px;
    height: 4px;
    background: #F3823E;
    bottom: 1px;
    left: calc(50% - 20px);
}

.payMode .modeBox .loginInput {
    display: none;
}

.payMode .modeBox .loginInput.show {
    display: block;
}

.payMode .modeBox .loginInput .inputDiv {
    margin-top: 16px;
    height: 50px;
    background: #FFFFFF;
    border-radius: 4px;
    border: 2px solid #D3D3D3;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 22px;
}

.payMode .modeBox .loginInput .inputDiv img {
    width: 30px;
    height: 30px;
}

.payMode .modeBox .inputDiv input {
    padding-left: 18px;
    flex: 1;
    outline: none;
    border: none;
    font-weight: 400;
    font-size: 16px;
    color: #2D2D2D;
    height: 100%;
}

.payMode .modeBox .loginInput button {
    height: 56px;
    width: 100%;
    background: #F3823E;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 22px;
    color: #FFFFFF;
    margin-top: 60px;
    border: none;
    cursor: pointer;
}

.payMode .modeBox .loginInput button:hover {
    background: #f56f1c;

}