.recommendHeader {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 3rem;
    background: linear-gradient(0deg, #222222 0%, #383838 100%);
    z-index: 999;
}

.recommendHeader .center {
    width: 80rem;
    padding-right: 8rem;
    box-sizing: border-box;
}

.recommendHeader .center .icon {
    width: 11.56rem;
    height: 1.88rem;
    margin-right: 2.5rem;
}

.recommendHeader .center ul {
    /* margin-right: 12.37rem; */
    height: 100%;
}

.recommendHeader .center ul li {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    height: 100%;
    margin-right: 3.63rem;
}

.recommendHeader .center ul li:last-child {
    margin-right: 0;
}

.recommendHeader .center ul li .line {
    width: 1.75rem;
    height: 0.25rem;
    background: #FFAF00;
    border-radius: 0.13rem;
    margin-top: 0.28rem;
    opacity: 0;
    position: relative;
    left: 0;
    bottom: 0;
}

.recommendHeader .center ul li.active a {
    color: #fff;
}

.recommendHeader .center ul li.active .line {
    opacity: 1;
}

.recommendHeader .center ul li a {
    display: block;
    font-weight: 400;
    font-size: 0.88rem;
    color: #999;
}

.recommendHeader .center .userBox {
    /* margin-right: 9.13rem; */
    line-height: 3rem;
}

.recommendHeader .center .userBox .icons {
    width: 2.25rem;
    height: 2.25rem;
    margin-right: 0.62rem;
    border-radius: 50%;
}

.recommendHeader .center .userBox span {
    font-size: 1rem;
    color: #FFFFFF;
    line-height: 3rem;
    text-align: center;
}

body {
    width: 100vw;
    min-height: 100vh;
    background: #FFFFFF;
    margin-top: 3rem;

}

.bodyContent {
    width: 1280px;
    margin: 0 auto;
}

.bodyContent .tabIcon {

    margin-top: 10px;

}

.bodyContent .tabIcon .icon {
    width: 28px;
    height: 24px;
    margin-right: 28px;
    cursor: pointer;
}


.bodyContent .tabIcon .tabli a li {
    background: #EDEDED;
    border-radius: 22px;
    margin-right: 24px;
    padding: 6px 16px 6px 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    color: #3C3C3C;
    cursor: pointer;
}

.bodyContent .tabIcon .tabli a:nth-child(1) li {
    background: linear-gradient(270deg, #5196FF 0%, #01C5FF 100%);
    color: #FFFFFF;
}

.bodyContent .tabIcon .tabli .active {
    background: linear-gradient(270deg, #FF8E01 0%, #FFAC01 100%);
    color: #FFFFFF;
}

.bodyContent .tabIcon .tabli a li img {
    width: 32px;
    height: 32px;
    margin-right: 8px;
}

.bodyContent .tabIcon .tabli a:nth-child(3) li {
    background: none;
}

.bodyContent .tabIcon .tabli a li .discount {
    width: 128px;
    height: 44px;
}

.bodyContent .title {
    margin-top: 16px;
    margin-bottom: 12px;
}

.bodyContent .title .values {
    font-size: 22px;
    color: #000000;
    letter-spacing: 1px;
}

.bodyContent .title .title_desc {
    color: #FF3F02;
    font-size: 18px;
    font-weight: bold;
}

.bodyContent .title .line {
    width: 6px;
    height: 24px;
    background: #FF7A00;
    margin-right: 7px;
}

.bodyContent .title .more {
    border-radius: 6px;
    border: 1px solid #FF7A00;
    margin-left: 16px;
    padding: 2px 4px 2px 10px;
    box-sizing: border-box;
    font-size: 12px;
    color: #FF7A00;
    text-align: left;
    font-style: normal;
}

.bodyContent .title .server_hot {
    width: 23px;
    height: 25px;
    background: url('//images.sooyooj.com/20240724/7ZB6VT70NZnPLVPx.gif') no-repeat;
    background-size: 100% 100%;
    margin-left: 2px;
}

.bodyContent .title .more a {
    color: #FF7A00;

}

.bodyContent .title .more img {
    width: 8px;
    height: 8px;
    margin-left: 2px;
}



.bodyContent .hotrecommendation {
    width: 100%;
    height: auto;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 10px;
}

.bodyContent .hotrecommendation .hotItem {
    width: 242px;
    background: #F6F6F6;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    border-radius: 6px;
    transition: all .3s;
    position: relative;
}

.bodyContent .hotrecommendation .hotItem .hotTop {
    width: 100%;
    height: 142px;
    border-radius: 6px 6px 0 0;
    overflow: hidden;
    position: relative;
}

.bodyContent .hotrecommendation .hotItem .hotTop img {
    width: 100%;
    height: 100%;
    position: relative;
}

.bodyContent .hotrecommendation .hotItem .hotTop .topMask {
    width: 100%;
    height: 24px;
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 0 10px;
}

.bodyContent .hotrecommendation .hotItem .hotTop .topMask span {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.8);
}

.bodyContent .hotrecommendation .hotItem .hotTop .topMask .palynum {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.8);
    position: relative;
}

.bodyContent .hotrecommendation .hotItem .hotTop .topMask .palynum::after {
    content: '';
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background: url(//images.sooyooj.com/20240709/Ywa2upWuGCsfj3bq.png) no-repeat;
    background-size: 100% 100%;
    top: 50%;
    margin-top: -9px;
    left: -20px;
}

.bodyContent .hotrecommendation .hotItem .hotBottom {
    padding: 12px 10px;
    flex: 1;
    box-sizing: border-box;
}

.bodyContent .hotrecommendation .hotItem .hotBottom .gameTitle strong {
    display: block;
    width: 100%;
    font-size: 14px;
    color: #131313;
    position: relative;
}

.bodyContent .hotrecommendation .hotItem .hotBottom .gameTitle strong .icons {
    position: absolute;
    width: 48px;
    height: 20px;
    right: -24px;
    top: 0;
}

.bodyContent .hotrecommendation .hotItem .hotBottom .gameTitle strong .icons.disc1 {
    background: url('//images.sooyooj.com/20240717/GwD38Qb0kx3rMkHJ.png') no-repeat;
    background-size: 100% 100%;
}

.bodyContent .hotrecommendation .hotItem .hotBottom .gameTitle strong .icons.disc2 {
    background: url('//images.sooyooj.com/20240717/dLWgtDQMqN36jYgb.png') no-repeat;
    background-size: 100% 100%;
}

.bodyContent .hotrecommendation .hotItem .hotBottom p {
    font-size: 12px;
    color: #999999;
    margin-top: 8px;
}

.bodyContent .hotrecommendation .hotItem:hover {
    box-shadow: 3px 3px 6px 0px #8F8E8E;

}

.bodyContent .hotrecommendation .hotItem:hover .hot-item-qrcode {
    display: flex;

}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    display: none;
    z-index: 1;
    border-radius: 6px;
    overflow: hidden;
    transition: all .3s;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode .qrcode {
    width: 112px;
    height: 112px;
    border: 2px solid #FFA715;
    margin-right: 12px;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode span {
    font-weight: bold;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 26px;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode .qrcode img {
    width: 102px;
    height: 102px;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode .qrode-wrap {
    width: 100%;
    height: 142px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 6px 6px 0px 0px;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode .hot-item {
    background: #fff;
    width: 100%;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode .hot-item .btns {
    width: 101px;
    height: 44px;
}

.bodyContent .hotrecommendation .hotItem .hot-item-qrcode .hot-item .btns:last-child {
    margin-left: 12px;
}

.bodyContent .discountGame .discountGameItem {
    width: 170px;
    height: 294px;
    background: #FFFFFF;
    box-shadow: 2px 2px 6px 0px rgba(139, 139, 139, 0.5);
    border-radius: 6px;
    position: relative;
}

.bodyContent .discountGame .discountGameItem .dis_img {
    position: absolute;
    top: 3px;
    right: -10px;
    width: 70px;
    height: 42px;
    z-index: 1;
}

.bodyContent .discountGame .discountGameItem:nth-child(-n+7) {
    margin-bottom: 26px;
}

.bodyContent .discountGame .discountGameItem .img {
    width: 100%;
    height: 236px;
    border-radius: 6px 6px 0px 0px;
    overflow: hidden;
}

.bodyContent .discountGame .discountGameItem .img img {
    width: 100%;
    height: 100%;
}

.bodyContent .discountGame .discountGameItem .mask {
    width: 100%;
    padding: 4px 10px;
    box-sizing: border-box;
}

.bodyContent .discountGame .discountGameItem .mask strong {
    font-size: 14px;
    color: #131313;
}

.bodyContent .discountGame .discountGameItem .mask .tag {
    display: flex;
}

.bodyContent .discountGame .discountGameItem .mask .tag span {
    border-radius: 3px;
    ;
    padding: 1px 4px;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    font-style: normal;
    margin-top: 5px;
}

.bodyContent .discountGame .discountGameItem .mask .tag span:nth-child(1) {
    color: #FF8D21;
    border: 1px solid rgba(255, 141, 33, 0.5);
    margin-right: 6px;

}

.bodyContent .discountGame .discountGameItem .mask .tag span:nth-child(2) {
    color: #22A03C;
    border: 1px solid rgba(34, 160, 60, 0.5);

}

.bodyContent .discountGame .discountGameItem:hover .hide-item {
    opacity: 1;
}

.bodyContent .discountGame .discountGameItem .hide-item {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #fff;
    top: 0;
    left: 0;
    border-radius: 6px;
    transition: all .3s;
    opacity: 0;
}

.bodyContent .discountGame .discountGameItem .hide-item .disc_btn {
    /* position: absolute; */
    position: relative;
    width: 100%;
}

.bodyContent .discountGame .discountGameItem .hide-item .subscript_ims {
    position: absolute;
    top: 0;
    left: 0;
    width: 52px;
    height: 54px;
    /* background: rgba(0, 0, 0, 0.5); */
}

.bodyContent .discountGame .discountGameItem .hide-item .btn_mask {
    width: 100%;
    height: 26px;
    background: rgba(0, 0, 0, 0.5);
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    line-height: 26px;
    color: #fff;
}

.bodyContent .discountGame .discountGameItem .hide-item .btn {
    background-color: #CE8F07;

}

.bodyContent .discountGame .discountGameItem .hide-item .btn img {
    width: 150px;
    height: 50px;
}

.bodyContent .mobile_wrap {
    border: 1px solid #D9D9D9;
    border-top: 2px solid #FF7A00;
    padding: 22px;
    box-sizing: border-box;
}

.bodyContent .mobile_wrap .item {
    position: relative;
    margin-right: 40px;
}

.bodyContent .mobile_wrap .item:nth-child(-n+4) {
    margin-bottom: 22px;
}

.bodyContent .mobile_wrap .item .desc_info {
    width: 146px;
    margin-left: 8px;
}

.bodyContent .mobile_wrap .item .desc_info .subject {
    font-size: 14px;
    color: #3C3C3C;
}

.bodyContent .mobile_wrap .item .desc_info .tags_wrap .mobile_icons {
    width: 48px;
    height: 16px;
    background: url('//images.sooyooj.com/20240723/Mooabs6svCLMVzSK.png') no-repeat;
    background-size: 100% 100%;
    margin-right: 8px;
}

.bodyContent .mobile_wrap .item .desc_info .mobile_btn_wrap {}

.bodyContent .mobile_wrap .item .desc_info .mobile_btn_wrap .btn {
    width: 60px;
    height: 24px;
    border: 1px solid #FF5C23;
    color: #FF5C23;
    font-size: 12px;
    text-align: center;
    line-height: 22px;
    border-radius: 4px;
}

.bodyContent .mobile_wrap .item .desc_info .mobile_btn_wrap .btn:first-child:hover {
    /* border: 1px solid #FF5C23; */
    color: #fff;
    background-color: #FF5C23;
}

.bodyContent .mobile_wrap .item .desc_info .mobile_btn_wrap .btn:last-child {
    border-color: #CECECE;
    color: #3C3C3C;
    margin-left: 10px;
}

.bodyContent .mobile_wrap .item .desc_info .mobile_btn_wrap .btn:last-child:hover {
    border-color: #FF5C23;
    color: #FF5C23;
}

.bodyContent .mobile_wrap .item .desc_info .tags_wrap {
    font-size: 12px;
    color: #999999;
}

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

.bodyContent .mobile_wrap .item .imgs {
    width: 124px;
    height: 74px;
}

.bodyContent .mobile_wrap .item .dis_img {
    position: absolute;
    left: -5px;
    top: -5px;
    width: 47px;
    height: 17px;
}



.bodyContent .freeBox {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    margin-top: 18px;
}

.bodyContent .freeBox .countdown {
    width: 100%;
    height: 53px;
    background: url(https://images.sooyooj.com/20240510/rQiUpFNL8si1jXlK.png) no-repeat;
    background-size: 100% 100%;
    margin-top: -10px;
}

.bodyContent .freeBox .times {
    flex-direction: row-reverse;
    margin-top: 4px;
}

.bodyContent .freeBox .countdown .count .time {
    font-weight: 800;
    font-size: 14px;
    color: #763017;
    text-align: center;
    font-style: normal;
}

.bodyContent .freeBox .countdown .count .time p {
    width: 28px;
    height: 28px;
    background: linear-gradient(180deg, #B5663A 0%, #7E361B 100%);
    border-radius: 4px;
    border: 1px solid #FFFFFF;
    font-weight: bold;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 28px;
    text-align: center;
}

.bodyContent .freeBox .countdown .count .time p:nth-child(1) {
    margin-left: 10px;
}

.bodyContent .freeBox .countdown .count .time span {
    font-weight: 800;
    font-size: 22px;
    color: #763017;
    text-align: left;
    font-style: normal;
    margin-left: 5px;
    margin-right: 5px;
}

.bodyContent .freeBox .countdown .count .num {
    margin-left: 38px;
    font-size: 14px;
    color: #763017;
    text-align: center;
    font-style: normal;
    margin-right: 18px;
}

.bodyContent .freeBox .freeSwiper {
    width: 100%;
    position: relative;
}


.bodyContent .freeBox .freeSwiper .swiper-box {
    position: relative;
    margin: 10px 0;
    height: auto;
    padding: 0 8px;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper {
    overflow: hidden;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper,
.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper {
    width: 100%;
    height: 100%;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide {
    width: 100%;
    height: auto;
}

.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-prev,
.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    min-height: 52px;
    background-color: #FF8A00;
    z-index: 9;
}


.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-prev.swiper-button-disabled span,
.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-next.swiper-button-disabled span {
    color: #fff;
}

.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-next.swiper-button-disabled {
    color: #fff;
}

.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-prev {
    width: 30px;
    height: 52px;
    background: rgba(0, 0, 0, 0.1);
    left: -30px;
}

.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-prev span,
.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-next span {
    display: block;
    width: 100%;
    height: 100%;
    color: #FF7A00;
    font-size: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bodyContent .freeBox .freeSwiper .swiper-box .swiper-navigation-next {
    width: 30px;
    height: 52px;
    background: rgba(0, 0, 0, 0.1);
    right: -30px;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide {
    width: 162px;
    height: 162px;
    margin-left: 12px;

}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide:first-child {
    margin-left: 0;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item {
    width: 100%;
    height: 100%;
    background: url(//images.sooyooj.com/20240723/ZXLVcqyo7DUkWZZP.png) no-repeat;
    background-size: 100% 100%;
    padding: 6px 15px;
    position: relative;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .cornerMark {
    position: absolute;
    right: 0;
    top: 0;
    width: 56px;
    height: 47px;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .iconandtag .icon {
    width: 44px;
    height: 44px;
    margin-right: 4px;
}


.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .iconandtag .tag {

    font-weight: bold;
    font-size: 12px;
    color: #8C3F22;
    padding: 1px 5px;
    background: rgba(255, 255, 255, 0.53);
    border-radius: 4px;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .titleandplaynum {
    margin-top: 12px;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .titleandplaynum .title {
    font-weight: bold;
    font-size: 12px;
    color: #7A3319;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .titleandplaynum p {
    font-size: 12px;
    color: #FFF4D9;
    margin-top: 7px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.bodyContent .freeBox .freeSwiper .swiper-box .revealSwiper .swiper-wrapper .swiper-slide .item .btn {
    width: 134px;
    height: 40px;
    margin: 0 auto;
    cursor: pointer;
    margin-top: 6px;
    background: url('//images.sooyooj.com/20240723/V2lJhTUhKWO8wluz.png') no-repeat;
    background-size: 100% 100%;
}


.bodyContent .severBox {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    margin-bottom: 18px;
    padding: 12px 22px;
    box-sizing: border-box;
}

.bodyContent .severBox .severItem {
    width: 274px;
    height: 36px;
    color: #131313;
    font-size: 12px;
    line-height: 36px;
    text-align: left;
    font-style: normal;
    padding: 0 2px;
    box-sizing: border-box;
}

.bodyContent .severBox .severItem a span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bodyContent .severBox .severItem a span:nth-of-type(2) {
    color: #DF2B10;
}

.bodyContent .severBox .severItem:hover {
    background: #DF2B10;
    color: #FFFFFF;
}

.bodyContent .severBox .severItem:hover a span {
    color: #FFFFFF;

}

.bodyContent .downimg {
    margin-bottom: 1.94rem;
}

.sider-dowlad {
    width: 13.63rem;
    position: fixed;
    top: 4.25rem;
    left: 4.75rem;
    display: none;
    z-index: 99;
}

.sider-dowlad .sider {
    width: 12.5rem;
    height: 28.63rem;
    background: #1F1F1F;
    border-radius: 0.56rem;
    padding: 0 1.06rem;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
}

.sider-dowlad .disc {
    width: 13.63rem;
    height: 15rem;
    margin-top: 3.13rem;
}

.sider-dowlad .disc img {
    width: 100%;
    height: 100%;
}

.sider-dowlad .close {
    position: absolute;
    width: 1.25rem;
    height: 1.25rem;
    right: .53rem;
    top: .25rem;
    cursor: pointer;
}

.sider-dowlad .close img {
    width: 100%;
    height: 100%
}

.sider-dowlad .sider-content {
    width: 100%;
    height: 100%;
    margin-top: 1.56rem;
}

.sider-dowlad .sider-content #down_ewm {
    width: 10rem;
    height: 11.88rem;
    background: #FFFFFF;
    border-radius: 0.44rem;
    border: 0.13rem solid #FF8A00;
    padding: 0.69rem;
    box-sizing: border-box;
    margin-bottom: 1.19rem;
}

.sider-dowlad .sider-content #down_ewm .androidText {
    font-weight: bold;
    font-size: 1rem;
    color: #000000;
    line-height: 1.31rem;
    text-align: left;
}

.sider-dowlad .sider-content #down_ewm .androidText img {
    width: 1.25rem;
    height: 1.25rem;
}

.sider-dowlad .sider-content #down_ewm .ewm {
    width: 8.69rem;
    height: 8.69rem;
    margin-top: 0.63rem;
}

.sider-dowlad .sider-content .iconList {
    margin-top: 0.75rem;
}

.sider-dowlad .sider-content .iconList p {
    font-size: 0.88rem;
    color: #fff;
    text-align: center;
    margin-right: 0.13rem;
}

.sider-dowlad .sider-content .iconList .side-icon img {
    width: 1.13rem;
    height: 1.13rem;
    margin-right: 0.13rem;
}

.sider-dowlad .sider-content .title {
    width: 10.38rem;
    height: 12.31rem;
    margin-bottom: 1.25rem;
    margin-top: 1.56rem;
}

.sider-dowlad .sider-content .title img {
    margin: 0 auto;
    width: 100%;
    height: 100%
}




.sider-dowlad .sider-content .btn {
    width: 10rem;
    height: 3rem;
    background: #F04848;
    border-radius: 0.38rem;
    margin: 0 auto;
    margin-bottom: 0.69rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sider-dowlad .sider-content .btn img {
    width: 1.75rem;
    height: 1.75rem;
}

.sider-dowlad .sider-content .btn p {
    color: #fff;
    font-size: 1rem;
    margin-left: 0.5rem;
}

.sider-dowlad .sider-content .pcDown {
    background: #0298ff
}

.giftBad-box {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;

}

.giftBad-inner {
    position: absolute;
    width: 464px;
    height: 481px;
    background: url("//img158.sooyooj.com/20210204/AOron8LAARAgatRz.png") no-repeat;
    background-size: 100% 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.giftBad-content {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 99;
}

.giftBad-content .giftBad-title {
    font-size: 28px;
    text-align: center;
    font-weight: 700;
    color: #955210;
    padding-top: 50px;
}

.giftBad-content .giftBad-code {
    display: flex;
    height: 33px;
    width: 440px;
    align-items: center;
    color: #3e3e3e;
    font-size: 16px;
    margin: 0 auto;
    padding: 10px 30px;
    margin-top: 30px;
    padding-left: 80px;
}

.giftBad-content .giftBad-code .code {
    margin-right: 10px;
    font-size: 16px;
    font-weight: 600;
    width: 250px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.giftBad-content .giftBad-code .copy {
    color: #3352ef;
    font-size: 16px;
    cursor: pointer;
    white-space: nowrap;
}

.giftBad-content .giftBad-desc {
    width: 327px;
    height: 90px;
    font-size: 16px;
    font-weight: 400;
    color: #666;
    line-height: 22px;
    margin: 0 auto;
    margin-top: 20px;
}

.giftBad-content .giftBad-tip {
    width: 327px;
    font-size: 16px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #666;
    line-height: 22px;
    margin: 0 auto;
}

.giftBad-content .playGame-btn {
    width: 367px;
    height: 72px;
    background-image: url("//img158.sooyooj.com/20210204/FiuNf99DuL5DTW9P.png");
    background-size: 100% 100%;
    font-size: 22px;
    text-align: center;
    line-height: 64px;
    font-weight: 400;
    color: #fff;
    cursor: pointer;
    position: absolute;
    bottom: 40px;
    left: 48px;
}

.giftBad-box .mask {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: -1;
}

.giftBad-box .gift_close {
    position: absolute;
    bottom: -45px;
    left: calc(50% - 16px);
    cursor: pointer;
}

.nexticon,
.previcon {
    cursor: pointer;
    width: 2rem;
    height: 2rem;
    background: url('//images.sooyooj.com/20240513/Oz8zl3iLlIIbXCC7.png') no-repeat;
    background-size: 100% 100%;
}

.nexticon {
    background: url('//images.sooyooj.com/20240513/cqOAGrkEWYTdSuWY.png') no-repeat;
    background-size: 100% 100%;
}

.nexticon {
    margin-left: .4rem;
}

.nexticon:hover {
    background: url('//images.sooyooj.com/20240515/ztM4xng1B3Iywvkt.png') no-repeat;
    background-size: 100% 100%;
}

.previcon:hover {
    background: url('//images.sooyooj.com/20240515/t5sJPMAPvyb1IXQz.png') no-repeat;
    background-size: 100% 100%;
}

.user_content_wrap {
    position: fixed;
    width: 100%;
    top: 3rem;
    left: 0;
    z-index: 1;
    /* top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto;
    background: rgba(0, 0, 0, .5); */
}

.user_content {
    width: 86rem;
    height: 28.19rem;
    background: #EFF3F5;
    margin: 0 auto;
    padding: 2.5em 6rem 0;
}

.user_content .user_game {}

.user_content .user_game .recentlyBox {
    margin-bottom: 2.5rem;
}

.user_content .user_game .titleBox {
    margin-bottom: 1rem;
}

.user_content .user_game .titleBox span {
    font-weight: bold;
    font-size: 1.13rem;
}

.user_content .user_game .titleBox .mores {
    cursor: pointer;
}

.user_content .user_game .titleBox .mores span {
    font-size: 0.88rem;
    color: #FF8A00;
}

.user_content .user_game .recentlyBox .recentlyItem {
    margin-right: 1.44rem;
}

.user_content .user_game .recentlyBox .recentlyItem:last-child {
    margin-right: 0;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox {
    position: relative;
    margin-bottom: .5rem;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox .maskBox {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1.75rem;
    background: rgba(0, 0, 0, .66);
    border-radius: .38rem;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox .maskBox .sportsBox span {
    padding: .06rem .16rem;
    color: #fff;
    font-size: .75rem;
    border-radius: 0.13rem;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox .maskBox .sportsBox span:first-child {
    background: #448CE5;
    margin: .5rem;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox .maskBox .sportsBox span:last-child {
    background: #FF5745;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox .maskBox .text {
    font-size: 0.88rem;
    color: #FFFFFF;
    font-weight: bold;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox img {
    width: 13.13rem;
    height: 6.88rem;
    border-radius: 0.38rem;
}

.user_content .user_game .recentlyBox .recentlyItem .playGameBox .flexBox {}

.flexBox .flexItem {
    font-size: 0.75rem;
    color: #3588E6;

}

.flexBox .flexItem img {
    width: .75rem;
    height: .75rem;
    margin-right: .2rem;
}

.flexBox .flexItem:first-child {}

.flexBox .flexItem:nth-of-type(2) {
    color: #2BB56F;
}

.user_content .user_game .guess {}


.user_content .user_game .guess .guessItem {
    background: #FFFFFF;
    margin-right: 1.38rem;
}

.user_content .user_game .guess .guessItem:last-child {
    margin-right: 0;
}

.user_content .user_game .guess .guessItem img {
    width: 9.5rem;
    height: 5rem;
}

.user_content .user_game .guess .guessItem p {
    padding: .63rem;
    font-weight: 400;
    font-size: 0.88rem;
    color: #222222;
}

.user_info {
    width: 26.25rem;
    margin-left: 5.8rem;
}

.user_info .userInfoBox {}

.user_info .userInfoBox .usericon {
    width: 5rem;
    height: 5rem;
    overflow: hidden;
}

.user_info .userInfoBox .usericon img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.user_info .userInfoBox .nameBox {
    margin-left: 1.13rem;

}

.user_info .userInfoBox .nameBox p:first-child {
    font-weight: bold;
    font-size: 1.25rem;
    color: #222222;
}

.user_info .userInfoBox .nameBox p {
    font-size: 0.88rem;
    color: #999999;
    margin-bottom: .5rem;
}

.user_info .userInfoBox .nameBox p:last-child {
    margin-bottom: 0;
}

.user_info .userInfoBox .btn {
    width: 6.13rem;
    height: 2.38rem;
    background: linear-gradient(90deg, #FFAE00 0%, #FF8A00 100%);
    border-radius: 0.38rem;
    text-align: center;
    line-height: 2.38rem;
    font-weight: bold;
    font-size: 0.88rem;
    color: #FFFFFF;
}

.user_info .gradeBox {
    margin-top: 1.75rem;
    background: #fff;
    padding-bottom: 1.25rem;
}

.user_info .gradeBox .gradeleft {
    width: 11.31rem;
    height: 5.19rem;
    background: url(//images.sooyooj.com/20230306/aLvcyVLHgtNZPhWv.png) no-repeat;
    background-size: 100% 100%;
    padding-top: 1.19rem;
    padding-left: 1.31rem;
    box-sizing: border-box;
    font-size: .88rem;
    color: #666;
}

.user_info .gradeBox .gradeleft .lv {
    font-weight: bold;
    font-size: 1.5rem;
    color: #444444;
    margin-top: .4rem;
}

.user_info .gradeBox .graderight {
    padding-top: 3.31rem;
}

.user_info .gradeBox .graderight p {
    font-size: 0.88rem;
    color: #444;

}

.user_info .gradeBox .graderight p span {
    font-size: 0.88rem;
    color: #FF8A00;
}

.user_info .gradeBox .gradeleft .lv img {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: .5rem;
}

.user_info .line_wrap {
    padding: 0 1.25rem;
}

.user_info .line_wrap .line {
    width: 100%;
    height: 0.38rem;
    background: rgba(0, 0, 0, .1);
    border-radius: 0.19rem;
    position: relative;
}

.user_info .line_wrap .line .color {
    position: absolute;
    height: 100%;
    z-index: 1;
    background: #ff8a00;
    border-radius: 0.19rem;

}

.user_info .btnBox {
    margin-top: 1.88rem;
}

.user_info .btnBox .btnItem {
    width: 12.69rem;
    height: 3rem;
    background: #FFFFFF;
    margin-bottom: .88rem;
}

.user_info .btnBox .btnItem img {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: .2rem;
}

.user_info .btnBox .btnItem span {
    font-size: 1rem;
    color: #666666;
}

.page-wrap-toast {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: rgba(0, 0, 0, .5);
    z-index: 999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-wrap-toast .content {
    width: 420px;
    background: #FFFFFF;
    border-radius: 4px;
    padding: 30px 30px 40px;
    box-sizing: border-box;
    position: relative;
}

.page-wrap-toast .title {
    font-size: 18px;
    font-weight: bold;
    color: #222222;
    margin-bottom: 12px;
}

.page-wrap-toast .userlist .item {
    width: 100%;
    padding: 13px 14px;
    box-sizing: border-box;
    border-bottom: 1px solid #DCE1E5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.page-wrap-toast .userlist .item .item-info .img {
    width: 54px;
    height: 54px;
    overflow: hidden;
    margin-right: 14px;
}

.page-wrap-toast .userlist .item .item-info .img img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.page-wrap-toast .userlist .item .item-info .value p {
    color: #222222;
    font-size: 16px;
    margin-bottom: 7px;
}

.page-wrap-toast .userlist .item .item-info .value p:last-child {
    font-size: 14px;
    color: #999999;
}

.page-wrap-toast .userlist .item .checkout {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid #B0B0B0;
    padding: 2px;
    box-sizing: border-box;


}

.page-wrap-toast .userlist .item .checkout span {
    display: none;
}

.page-wrap-toast .userlist .item.active .checkout {
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: #FF8A00;


}

.page-wrap-toast .userlist .item.active .checkout span {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
    background: #FF8A00;
}

.page-wrap-toast .userlist {
    width: 100%;
    height: 280px;
    overflow-y: auto;
    background: #F0F3F6;
    border-radius: 6px;

}

.page-wrap-toast .item:last-child {
    border-bottom: none;
}

.page-wrap-toast .btn {
    margin-top: 28px;
    width: 100%;
    height: 48px;
    background: linear-gradient(90deg, #FFAE00 0%, #FF8A00 100%);
    border-radius: 5px;
    font-size: 16px;
    color: #fff;
    line-height: 48px;
    text-align: center;
    cursor: pointer;
}

.page-wrap-toast .otherbtn {
    text-align: center;
    color: #FF8A00;
    font-size: 16px;
    margin-top: 15px;
    cursor: pointer;
}

.page-wrap-toast .close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 17px;
    height: 17px;
    cursor: pointer;

}


.page-wrap-toast .title {
    font-size: 18px;
    font-weight: bold;
    color: #222222;
    margin-bottom: 12px;
}

.page-wrap-toast .info {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    margin-bottom: 23px;
}

.page-wrap-toast .input-wrap {
    width: 100%;
    height: 48px;
    border: 1px solid #D2D8DE;
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 20px;
    position: relative;




}

.page-wrap-toast .input-wrap input {
    display: block;
    outline: none;
    border: none;
    width: 100%;
    color: #222222;
    height: 100%;
    line-height: 48px;
    padding-left: 13px;
    font-size: 14px;
    box-sizing: border-box;
}

.page-wrap-toast .input-wrap .code {
    width: 98px;
    height: 44px;
    background: #EBEBEB;
    border-radius: 2px;
    position: absolute;
    text-align: center;
    line-height: 44px;
    font-size: 14px;
    color: #222222;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10000;
    cursor: pointer;
}

.page-wrap-toast .bind-info-title {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    margin-bottom: 12px;
}

.page-wrap-toast .value p {
    color: #666666;
    font-size: 12px;
    margin-bottom: 12px;
}

.page-wrap-toast .btn {
    margin-top: 28px;
    width: 100%;
    height: 48px;
    background: linear-gradient(90deg, #FFAE00 0%, #FF8A00 100%);
    border-radius: 5px;
    font-size: 16px;
    color: #fff;
    line-height: 48px;
    text-align: center;
    cursor: pointer;
}

.page-wrap-toast .close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 17px;
    height: 17px;
    cursor: pointer;

}

.recommendHeader .arrow {
    width: 24px !important;
    height: 24px !important;
}

.recommendHeader .arrow.active {
    transform-origin: center center;
    transform: rotate(180deg);
    transition: transform 0.2s;
}

.user_connt_mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: rgba(0, 0, 0, .6);
}

.success_wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background-color: rgba(0, 0, 0, .66);
}

.success_wrap .content {
    width: 21.5rem;
    height: 29.88rem;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    background: url('//images.sooyooj.com/20240613/A4HUfa2JAEW2XBXf.png') no-repeat;
    background-size: 100% 100%;
    padding-top: 1.8rem;
}

.success_wrap .title {
    padding: 0 2rem;
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 1rem;
    color: #FFFFFF;
    line-height: 1.5rem;
}

.success_wrap .title span {
    color: #FFEE2E;

}

.success_wrap .card_img {
    width: 100%;
    height: 6.63rem;
    padding: 0 .81rem;
    margin-top: .7rem;
}

.success_wrap .card_img .imgs {
    width: 100%;
    height: 100%;
    background: url('//images.sooyooj.com/20240613/G6N0wMysAcbxTnXe.png') no-repeat;
    background-size: 100% 100%;
}

.success_wrap .card_img .imgs.imgs_disc {
    background: url('//images.sooyooj.com/20240613/DCiBKbqghuVDg7og.png') no-repeat;
    background-size: 100% 100%;
}

.success_wrap .card_img .imgs.imgs_disct {
    background: url('//images.sooyooj.com/20240717/9GlVIUIm2FScgMgD.png') no-repeat;
    background-size: 100% 100%;
}

.success_wrap .user {
    margin-top: 1rem;
    padding: 0 1.52rem 0 1.5rem;
    margin-bottom: 1.63rem;
}

.success_wrap .user p {
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 0.88rem;
    color: #222222;
    margin-bottom: .63rem;
}

.success_wrap .user .upgrade span {
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 0.88rem;
    color: #F95B4E;
}

.success_wrap .user .upgrade .upgrade_btn {
    width: 3.38rem;
    height: 1.5rem;
    background: #F8584D;
    border-radius: 0.25rem;
    text-align: center;
    line-height: 1.5rem;
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 0.88rem;
    color: #FFFFFF;
}

.success_wrap .close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: url(//images.sooyooj.com/20240613/vbQJnGWLib8kw5sa.png) no-repeat;
    width: 20px;
    height: 20px;
}

.success_wrap .line_title {
    font-family: Microsoft YaHei;
    font-weight: 400;
    font-size: 0.88rem;
    color: #999999;
    position: relative;
    text-align: center;
    width: 100%;
    margin-bottom: .94rem;
}

.success_wrap .line_title::after {
    content: '';
    display: block;
    width: 3.75rem;
    height: 0.06rem;
    background: #D8D8D8;
    position: absolute;
    left: 3.56rem;
    top: 50%;
    transform: translateY(-50%);
}

.success_wrap .line_title::before {
    content: '';
    display: block;
    width: 3.75rem;
    height: 0.06rem;
    background: #D8D8D8;
    position: absolute;
    right: 3.56rem;
    top: 50%;
    transform: translateY(-50%);
}

.success_wrap .gameitem {
    margin-top: .94rem;
    padding: 0 1.62rem;
}

.success_wrap .gameitem .games_icon {
    width: 3.75rem;
    height: 3.75rem;
    background: #000000;
    border-radius: 0.75rem;
    margin-right: .63rem;
}

.success_wrap .gameitem .games_icon img {
    width: 100%;
    height: 100%;
}

.success_wrap .gameitem .gamedes .subject {
    margin-bottom: .63rem;
    font-family: Microsoft YaHei;
    font-weight: bold;
    font-size: 1rem;
    color: #222222;
}

.success_wrap .gameitem .gamedes .tags span {
    display: block;
    padding: .19rem .25rem;
    font-weight: 400;
    font-size: 0.75rem;
    border-radius: 0.13rem;
    color: #EE4242;
    background: #FFE1E1;
    margin-right: .5rem;
}

.success_wrap .gameitem .gamedes .tags span:last-child {
    color: #0EB134;
    background: #DAF2E0;
}

.success_wrap .btns {
    width: 10.25rem;
    height: 3rem;
    background: linear-gradient(90deg, #FFAE00 0%, #FF8A00 100%);
    border-radius: 0.5rem;
    text-align: center;
    line-height: 3rem;
    color: #fff;
    font-weight: bold;
    font-size: 1.13rem;
    margin: 0 auto;
    margin-top: 1.44rem;
}

.success_wrap .content.active {
    height: 22.63rem;
    background: url('//images.sooyooj.com/20240613/Ked7B678mkbgcLMa.png') no-repeat;
    background-size: 100% 100%;
}

.success_wrap .content.active .gameitem {
    display: none;
}

.success_wrap .content.active .line_title {
    display: none;
}

.success_wrap .content.active .card_img .imgs {
    display: block;
}

.success_wrap .content.active .card_img .imgs.imgs_disc {
    display: none;
}


.bind-phone-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background-color: rgba(0, 0, 0, .66);
}

.bind-phone-dialog .content {
    padding: 1.88rem;
    background: #fff;
    position: relative;
    border-radius: .25rem;
}

.bind-phone-dialog .content .title {
    color: #222;
    font-size: 1.13rem;
    font-weight: bold;
}

.bind-phone-dialog .content .close {

    position: absolute;
    top: 1rem;
    right: 1rem;
    background: url(//images.sooyooj.com/20220701/9k3eavb0cGdH0UsX.png) no-repeat;
    width: 20px;
    height: 20px;
}

.bind-phone-dialog .content .desc {
    width: 22.5rem;
    font-size: .88rem;
    color: #666;
    line-height: 1.5rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.bind-phone-dialog .content .inputs {
    width: 22.4rem;

}

.bind-phone-dialog .content .inputs input {
    display: block;
    width: 100%;
    height: 3rem;
    border: 1px solid #d2d8de;
    font-size: .88rem;
    color: #222;
    padding: 0 .8rem;
    line-height: 3rem;
    margin-bottom: 1.25rem;
    box-sizing: border-box;
}

.bind-phone-dialog .content .btns {
    width: 22.5rem;
    height: 3rem;
    background: linear-gradient(90deg, #FFAE00 0%, #FF8A00 100%);
    border-radius: 0.31rem;
    margin: 0 auto;
    font-weight: 400;
    font-size: 1rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 3rem;
}

.red {
    color: #d22;
}

.yellow {
    color: #ff8a00;
}


.moreTopics {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #D9D9D9;
    margin-bottom: 18px;
    padding: 16px 22px;
    box-sizing: border-box;
}

.moreTopics .item {
    padding: 10px 6px;
    box-sizing: border-box;
    font-size: 12px;
    text-align: left;
    font-style: normal;
    margin-right: 10px;
    margin-bottom: 10px;
}

.realNameIcon {
    width: 108px;
    height: 108px;
    background: url(//images.sooyooj.com/20240813/MoEuzz3cIU5LlPHI.gif) no-repeat;
    background-size: 100% 100%;
    position: fixed;
    top: 50%;
    right: 13px;
    z-index: 1;
}

.realNameBoot .mask {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 10000001;
}

.realNameBoot .realNameBox {
    width: 288px;
    height: 368px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url(//images.sooyooj.com/20240821/DMXtuigV6xAcr3c7.png) no-repeat;
    background-size: 100% 100%;
    z-index: 10000002;
}

.realNameBoot .realNameBox .btn {
    width: 160px;
    height: 44px;
    background: linear-gradient(90deg, #FFD43F 0%, #FFE464 100%);
    box-shadow: 0px 6px 6px 0px rgba(110, 27, 4, 0.2);
    border-radius: 22px;
    margin: 0 auto;
    margin-top: 308px;
    cursor: pointer;
    font-weight: bold;
    font-size: 16px;
    color: #8E200E;
    text-align: center;
    line-height: 44px;
}

.bind-phone-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000009;
    background-color: rgba(0, 0, 0, .66);
}

.bind-phone-dialog .content {
    padding: 16px;
    background: #fff;
    position: relative;
    border-radius: 4px;
}

.bind-phone-dialog .content .bd-title {
    color: #222;
    font-size: 16px;
    font-weight: bold;
}

.bind-phone-dialog .content .close {

    position: absolute;
    top: 10px;
    right: 10px;
    background: url(//images.sooyooj.com/20220701/9k3eavb0cGdH0UsX.png) no-repeat;
    width: 20px;
    height: 20px;
}

.bind-phone-dialog .content .desc {
    width: 260px;
    font-size: 12px;
    color: #666;
    line-height: 16px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.bind-phone-dialog .content .inputs {
    width: 260px;
    position: relative;
}

.bind-phone-dialog .content .inputs input {
    display: block;
    width: 100%;
    height: 32px;
    border: 1px solid #d2d8de;
    font-size: 12px;
    color: #222;
    padding: 0 10px;
    line-height: 32px;
    margin-bottom: 14px;
    box-sizing: border-box;
}

.bind-phone-dialog .content .btns {
    width: 260px;
    height: 32px;
    background: linear-gradient(90deg, #FFAE00 0%, #FF8A00 100%);
    border-radius: 3px;
    margin: 0 auto;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
    text-align: center;
    line-height: 32px;
}

.bind-phone-dialog.realname-dialog .desc-realname {
    font-size: 12px;
    color: #222;
    margin-top: 6px;
    width: 260px;
}

.bind-phone-dialog .desc-info {
    color: #999;
    font-size: 12px;
    margin-top: 4px;
    width: 260px;
}

.bind-phone-dialog .tip {
    color: #d22;
    font-size: 12px;
    width: 260px;
}

.bind-phone-dialog.realname-dialog .btns {
    width: 260px;
    margin-top: 10px;
}

.bind-phone-dialog.realname-dialog .inputs {
    width: 260px;
    margin-top: 10px;
}

.bind-phone-dialog .inputs .forgetsendcode,
.bind-phone-dialog .inputs .modify_sendcode {
    position: absolute;
    top: 0;
    right: 0;
    width: 75px;
    height: 32px;
    background: #EBEBEB;
    border-radius: 1px;
    font-size: 12px;
    color: #222222;
    text-align: center;
    line-height: 32px;
}