/*热贴页*/
.pageHot {}

i {
    font-style: normal;
    padding: 0;
    margin: 0;
}

.k5 {
    height: 10px;
    display: block;
    clear: both;
    clear: both;
}

.k4 {
    height: 7px;
    display: block;
    clear: both;
    clear: both;
}

a {
    text-decoration: none;
}

.list_detail img {
    height: auto !important;
    max-width: 100% !important;
    text-align: center;
    margin: 0 auto;
    /*display: block;*/
}

.Hottitle {
    height: 44px;
    line-height: 44px;
    overflow: hidden;
    font-size: 16px;
    font-weight: bold;
    padding-right: 14px;
    background-color: var(--bg-color-1);
}

.Hoticon1 {
    background: var(--bg-color-1) url("../images/Hot-title1.png") no-repeat 12px center;
    background-size: 20px 20px;
    padding-left: 36px;
}

.Hoticon2 {
    background: var(--bg-color-1) url("../images/Hot-title2.png") no-repeat 12px center;
    background-size: 20px 20px;
    padding-left: 36px;
}

.Hoticon3 {
    background: var(--bg-color-1) url("../images/Hot-title3.png") no-repeat 12px center;
    background-size: 20px 20px;
    padding-left: 36px;
}

.Hoticon4 {
    background: var(--bg-color-1) url("../images/Hot-title4.png") no-repeat 12px center;
    background-size: 20px 20px;
    padding-left: 36px;
}

.Hoticon6 {
    background: var(--bg-color-1) url("../images/Hot-title6.png") no-repeat 12px center;
    background-size: 20px 20px;
    padding-left: 36px;
}

.switchnav {padding: 10px;}
.switchnav .switchbtn {background: var(--bg-color-4);color: var(--text-color-2);font-size: 14px;padding: 5px 20px;margin-right: 5px;border-radius: 4px;display: inline-block;cursor: pointer;}
.switchnav .switchbtn.on {background: var(--second-color);color: var(--text-white);}
.switchnav .link {color:var(--text-color-2);font-size:14px;line-height: 30px;float:right;}


.hide {
    width: 24px;
    height: 44px;
    float: right;
    text-align: center;
    font-weight: normal;
    color: var(--text-color-3);
    font-size: 18px !important;
}

.hide-off {
    background: url("../images/font-display.svg") no-repeat center center;
    background-size: 20px 20px;
}

.hide-on {
    background: url("../images/font-hide.svg") no-repeat center center;
    background-size: 20px 20px;
}

.change {
    height: 44px;
    line-height: 44px;
    background: url("../images/font-refresh.svg") no-repeat left center;
    background-size: 15px 15px;
    float: right;
    padding-left: 18px;
    font-size: 12px;
    font-weight: 400;
    color: var(--text-hightlight-1);
}

.Hottitle a.link {
    float: right;
    font-weight: normal;
    font-size: 14px;
    color: var(--text-color-2);
}

.shottitle {
    float: left;
    background: var(--bg-color-1);
    width: 75px;
    padding: 6px 10px;
    text-align: center;
}

.shottitle .shotimg {
    width: auto;
    height: 38px;
    vertical-align: middle;
    margin: 5px auto;
}

.shottitle .change {
    background: var(--bg-hightlight-9);
    height: 20px;
    line-height: 20px;
    padding: 0;
    margin: 0 3px;
    border-radius: 20px;
    float: none;
    display: block;
}

.hotwrapul.shot {
    padding: 10px 10px 10px 0;
    border: none;
}

.hotwrapul.shot li.subpage {
    width: calc(20% - 10px);
    margin: 0 5px;
}

.hotwrapul.shot li.subpage .headicon {
    width: 36px;
    height: 36px;
}

ul.hotwrapul {
    padding: 0 10px 10px 10px;
    overflow: hidden;
    background: var(--bg-color-1);
    border-bottom: 1px solid var(--border-1);
}

.hotwrapul li.subpage {
    float: left;
    width: calc(20% - 16px);
    overflow: hidden;
    margin: 0 8px;
    text-align: center;
    border: 0;
    padding: 0;
}

.hotwrapul li.subpage .headicon {
    border-radius: 50%;
    width: 50px;
    height: 38px;
    margin: 0 auto;
    position: relative;
}

.hotwrapul li.subpage .headicon img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.hotwrapul li.subpage .headicon .dotred {
    height: 6px;
    width: 6px;
    border-radius: 50%;
    position: absolute;
    top: 0px;
    right: 0px;
    display: block;
    z-index: 8;
    background: var(--red60);
}

.hotwrapul li.subpage .headicon .starnew {
    width: 16px;
    height: 16px;
    background: url(../Images/starnew2.svg) no-repeat center center;
    background-size: 16px;
    position: absolute;
    top: 0;
    right: 0;
}

.hotwrapul li.subpage span {
    color: var(--text-color-1);
    font-size: 12px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 4px;
    display: block;
}

.Line {
    height: 1px;
    background-color: var(--border-1);
    display: block;
    clear: both;
    clear: both;
}

.pageHot .item {
    padding: 3px 6px;
    background: var(--bg-hightlight-2);
    border-bottom: 1px solid var(--border-1);
}

.list_hot {
    clear: both;
    background: var(--bg-color-1);
    position: relative;
    border-bottom: 1px solid var(--border-1);
}

.listy_hotw {
    padding: 12px;
    clear: both;
    position: relative;
}

.lge {
    display: flex;
    background: var(--bg-color-1);
    border-bottom: 1px solid var(--border-1);
    padding: 6px;
    overflow-x: auto;
}

.lge::after {
    content: "";
    display: block;
    clear: both;
}

.lge li {
    color: var(--text-color-2);
    float: left;
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    padding: 0 2px;
    transition: all 0.2s linear;
}

.lge li.on {
    color: var(--text-hightlight-1);
    position: relative;
}

.lge li.on::after {
    content: "";
    position: absolute;
    bottom: -6px;
    width: 0;
    height: 0;
    border-top: 0;
    border-bottom: 5px solid var(--second-color);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.lge li.recom .star {
    font-size: 12px;
    font-weight: normal;
    color: var(--text-color-3);
}

.lge li.recom.on {
    color: #eb533b;
    font-weight: bold;
}

.lge li.recom.on::after {
    content: "";
    border: none;
}

.lge li.recom.on .star {
    color: #eb533b;
}

.publish-btn {
    position: fixed;
    right: 5%;
    bottom: 9%;
    width: 46px;
    height: 46px;
    line-height: 46px;
    text-align: center;
    border-radius: 50%;
    z-index: 999;
    background: linear-gradient(to bottom, rgba(49, 145, 255, 0.9) 0%, rgba(2, 120, 255, 0.8) 40%, rgba(0, 120, 233, 0.95) 100%, #FFFFFF 100%);
    -webkit-box-shadow: 0px 0px 10px rgb(50 150 251 / 60%);
    box-shadow: 0px 0px 10px rgb(50 150 251 / 60%);
}

.publish-btn .publish {
    font-size: 18px;
    color: var(--white);
}

.hotmatchs {
    padding: 0px 10px 5px 10px;
    overflow: hidden;
    background: var(--bg-color-1);
    border-bottom: 1px solid var(--border-1);
}

.rela-match {
    margin-bottom: 5px;
}

.rela-match .hoticon {
    background: #eb533b;
    color: var(--text-white);
    font-size: 11px;
    line-height: 16px;
    text-align: center;
    padding: 0 3px;
    border-radius: 3px;
    margin: 0 5px;
    display: inline-block;
}

.rela-match a {
    color: var(--text-color-1);
    font-size: 14px;
    line-height: 20px;
}

.rela-match a span {
    color: var(--text-color-2);
    padding-right: 8px;
}

.rela-match a.against {
    display: inline-block;
    max-width: 214px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.rela-match i {
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 4px solid var(--text-color-3);
    border-bottom: 0 none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    margin: 2px;
    transform: rotate(-90deg);
}

.listyhot_one .rela-match {
    display: block;
    float: left;
    margin: 0;
}

.listyhot_one .rela-match a,
.listyhot_one .rela-match a span {
    color: var(--text-color-3);
    font-size: 12px;
}

.list_item {
    height: 20px;
    display: block;
}

@media only screen and (min-width: 414px) {
    .rela-match a.against {
        max-width: 250px;
    }
}

.listyhot_one {
    clear: both;
}

.listyhot_icon {
    width: 40px;
    height: 40px;
    float: left;
    margin-right: 8px;
    border: 2px solid var(--bg-color-1);
    border-radius: 50%;
    position: relative;
}

.listyhot_icon img {
    border-radius: 50%;
    overflow: hidden;
}

.listyhot_icon2 {
    width: 22px;
    height: 22px;
    float: left;
    margin-right: 5px;
}

.listyhot_icon2 img {
    border-radius: 50%;
    overflow: hidden;
}

.listyhot_icon.GM{border-color:#ec632c !important;}
.listyhot_icon.cur{border-color:#e62129 !important;}
.listyhot_icon.vip{border-color:#4098e0 !important;}
.listyhot_icon.subGM{border-color:#058d2e !important;}

.listyhot_icon.GM::before {content:"吧主";background-color:#ec632c;}
.listyhot_icon.subGM::before {content:"副吧";background-color:#058d2e;}
.listyhot_icon.vip::before {content:"认证";background-color:#4098e0;}
.listyhot_icon.cur::before {content:"楼主";background-color:#e62129;}

.listyhot_icon.GM::before,
.listyhot_icon.cur::before,
.listyhot_icon.vip::before,
.listyhot_icon.subGM::before {
    position: absolute;
    top: auto;
    bottom: -4px;
    left: 50%;
    width: 24px;
    color: var(--text-white);
    outline: 1px solid var(--bg-color-2);
    font-size: 9px;
    line-height: 14px;
    text-align: center;
    padding: 0 4px;
    border-radius: 10px;
    transform: translate(-50%, 0) rotate(0);
    display: block;
}

.data2 {
    float: left;
    width: calc(100% - 45px);
}

.list_namea {
    color: var(--primary-color);
    font-size: 12px;
    float: left;
}

.list_namea a {
    color: var(--text-color-1);
    font-weight: 500;
}

.list_nameb {
    color: var(--text-hightlight-1);
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    float: left;
}
.list_nameb::after {content:"·";color: var(--text-color-2);margin: 0 2px;}

.list_hot_latelywp {
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px 0;
}

.list_hot_lately {}

.PostBar_right {
    color: var(--text-color-3);
    position: absolute;
    top: 10px;
    right: 12px;
    text-align: center;
    font-size: 14px;
    line-height: normal;
    line-height: 25px;
}

.browseh {
    line-height: 25px;
}

.PostBar_right .browseh {
    font-size: 13px;
}

.PostBar_right .renew {
    color: var(--text-hightlight-1);
    font-size: 13px;
    margin-right: 4px;
}

.icon-font-QB:before {
    margin-right: 2px;
}

.PostBar_right .icon-font-QB {
    color: var(--text-hightlight-5);
}

.price {
    line-height: 25px;
}

.pagbox {
    margin-top: 4px;
}

.pagbox::after {
    content: "";
    clear: both;
    display: block;
}

.pay-view {
    color: var(--text-hightlight-5);
    border: 1px solid var(--border-hightlight-2);
    font-size: 12px;
    width: max-content;
    padding: 0 8px;
    border-radius: 50px;
    float: left;
}

.repurchasebox {
    float: right;
    /*position: absolute;top:32px;right: 12px;*/
}

.repurchase {
    color: #ff6600;
    background: var(--bg-hightlight-1);
    font-size: 11px;
    padding: 1px 5px 1px 7px;
    margin-left: 5px;
    border-radius: 3px;
    position: relative;
    animation: gradient 1s linear infinite;
}

.repurchase:after {
    content: "";
    width: 12px;
    height: 12px;
    background: var(--bg-hightlight-1);
    transform: rotate(45deg);
    position: absolute;
    left: -5px;
    top: 2px;
    border-radius: 3px;
}

@keyframes gradient {
    0% {
        color: var(--yellow60);
    }

    50% {
        color: #ff6600;
    }

    100% {
        color: var(--yellow60);
    }
}

.price span {
    color: #4098e2;
    font-weight: 500;
}

.scoreBox {
    margin: 16px 0 0 !important;
}

.hide-content {
    background-color: #FFFbf0;
    margin: 14px;
    border: 1px solid #ffddaa;
    border-radius: 8px;
    position: relative;
    padding: 20px 0;
}

.hide-content-tip {
    background: var(--bg-color-1);
    color: var(--text-color-2) !important;
    font-size: 14px;
    text-align: center;
    width: max-content;
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translate(-50%);
    padding: 5px 15px;
    border: 1px solid rgba(255,208,78,0.5);
    border-radius: 4px;
}
/* .hide-content .zk-tips {top: auto;bottom: 15%;}
.hide-content .countdownbox ~ .zk-tips {bottom: 5%;}
.countdownbox ~ .buwrap {top: 68%;} */
.countdownbox {font-size: 14px;text-align: center;padding: 5px;margin: 10px auto;position: relative;z-index: 1; /*transform: translateX(-50%);top: 15px;left: 50%;position: absolute;*/}
.countdownbox .counttime {font-size: 18px;font-weight: bold;margin: 5px 0;}
.countdownbox .counttime span {background: var(--bg-color-1);padding: 6px;margin: 0 5px;border-radius: 4px;box-shadow: 0 0 8px var(--black20);display: inline-block;}

/*.show-say::after {content: ""; width: 100%;height: 0; display: inline-block; vertical-align: -2px; border-bottom: 1px dashed var(--border-2);}*/


/*球吧页*/
.serchPub {
    padding: 12px 10px;
    position: relative;
}

.serchPub input {
    margin: 0 auto;
    line-height: 34px;
    height: 34px;
    display: inline-block;
    border: none;
    width: 70%;
    border-radius: 4px;
    text-align: left;
    font-size: 14px;
    background: var(--bg-color-2) url(../Images/font-search.svg) no-repeat 5px;
    background-size: 18px 18px;
    background-position: 8px center;
    padding-left: 30px;
    color: var(--text-color-1);
}

.create {
    width: 28%;
    font-size: 14px;
    margin-top: 0;
    background: var(--bg-hightlight-4);
    color: var(--text-white);
    line-height: 32px;
    font-weight: normal;
    float: right;
    position: static;
    border-radius: 3px;
    text-align: center;
    padding: 0;
}

.create:before {
    display: inline-block;
    content: '+';
    font-size: 18px;
    font-weight: bold;
    margin-right: 2px;
}

.list_bar {
    clear: both;
    background: var(--bg-color-1);
    position: relative;
    border-bottom: 1px solid var(--border-1);
    padding: 14px 14px 14px 0;
    margin-left: 14px;
    clear: both;
    position: relative;
    height: 74px;
}

.baricon {
    width: 45px;
    height: 45px;
    float: left;
    margin-right: 8px;
}

.baricon img {
    border-radius: 50%;
    overflow: hidden;
}

.bar-mainbav {
    margin-right: 0.1rem;
    font-size: 16px;
    color: #4098e2;
    margin-top: 3px;
}

.bar-mainbav a.mameas {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color-1);
    margin-right: 16px;
}

.bar-mainbav span.fansCout {
    font-size: 12px;
    color: var(--text-color-3);
    margin-right: 16px;
}

.bar-mainbav span.fubCout {
    font-size: 12px;
    color: var(--text-color-3);
}

.describe {
    margin-top: 2px;
    font-size: 14px;
    color: var(--text-color-2);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.list_bar .nova {
    position: absolute;
    top: 0;
    right: -6px;
    background: var(--bg-hightlight-3) url(../Images/vip/nova.png) no-repeat 8px center;
    color: var(--text-white);
    font-size: 12px;
    height: 20px;
    line-height: 20px;
    transform: scale(0.9);
    word-spacing: 10px;
    background-size: 12px;
    padding: 0 10px 0 24px;
    border-radius: 0 0 0 10px;
    display: inline-block;
}

/*球吧主页*/
.barpersonal_page {
    clear: both;
    position: relative;
    height: 231px;
    display: block;
    overflow: hidden;
}

.barpersonal {
    clear: both;
    position: relative;
    height: auto;
    display: block;
    overflow: hidden;
}

.barbg {
    height: 44px;
    position: absolute;
    width: 100%;
    text-align: center;
    line-height: 44px;
    font-size: 16px;
    font-weight: normal;
    color: #fff;
    display: block;
    z-index: 8;
}

.barbg_topb {
    width: 100%;
    line-height: 45px;
    position: relative;
    display: block;
    height: 45px;
}

.barbg_back {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    margin-left: 15px;
    width: 12px;
    height: 12px;
    display: inline-block;
    position: absolute;
    left: 5px;
    top: 15px;
    border-left: 2px solid #FFF;
    border-bottom: 2px solid #FFF;
    z-index: 9999;
}

.bar_ban {
    position: absolute;
    top: 0;
    right: 10px;
    z-index: 9999;
}

.bar_ban .setup {
    width: 24px;
    height: 24px;
    position: unset;
    margin: 10px 5px 0 0;
    display: inline-block;
}

.bar_ban_edit {
    height: 24px;
    width: 24px;
    display: inline-block;
    z-index: 8;
    background: url(../images/font-edit.svg) no-repeat;
    background-size: 24px;
    margin: 10px 5px 0;
}

.bar_ban_setup {
    height: 24px;
    width: 24px;
    display: inline-block;
    z-index: 8;
    background: url(../images/font-setup.svg) no-repeat;
    background-size: 24px;
    float: right;
    margin: 10px 5px 0;
}

.bar_ban_rstatistics {
    height: 24px;
    width: 24px;
    display: inline-block;
    z-index: 8;
    background: url(../images/font-rstatistics.svg) no-repeat;
    background-size: 24px;
    float: right;
    margin: 10px 5px 0;
}

.bar_ban_ranalyst {
    height: 24px;
    width: 24px;
    display: inline-block;
    z-index: 8;
    background: url(../images/font-ranalyst.svg) no-repeat;
    background-size: 24px;
    float: right;
    margin: 10px 5px 0;
}

.rtopbgblur {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.rtopbgblack50 {
    background-color: rgba(15, 14, 14, 0.7);
    width: 100%;
    height: 231px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.rtopbg {
    width: 100%;
    height: auto;
    display: block;
    z-index: 1;
    position: relative;
}

.rtopbg::before {
    content: "";
    background-color: rgba(15, 14, 14, 0.7);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.barbg_userimg {
    height: 54px;
    width: 54px;
    position: absolute;
    top: 0px;
    left: 14px;
    display: block;
    z-index: 8;
}

.barbg_userimg img {border-radius:50%;}
.prohibit {background: #ff6600;color: var(--text-white);font-size: 11px;line-height: normal;width: max-content;padding: 0 6px;border-radius: 20px;bottom: -2px;left: 50%;transform: translateX(-50%);position: absolute;z-index: 1;}
.prohibit2 {
    background: #ff6600;
    color: var(--text-white);
    font-size: 12px;
    line-height: normal;
    width: max-content;
    padding: 1px 6px;
    border-radius: 20px;
    transform: translateX(-50%);
    margin-left: 5px;
}
.barbg_user_name {
    line-height: 38px;
    color: var(--text-white);
    text-align: left;
    position: absolute;
    top: 0px;
    left: 80px;
    z-index: 8;
    min-width: 110px;
    font-size: 16px;
    font-weight: 600;
    width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.barbg_user_name .sale {position: unset;border: none;font-weight: normal;}
.barbg_user_name .tgbtn {margin: 0;}
.appeal {background:#ff6600;color:var(--text-white);font-size:11px;text-align:center;line-height:20px;font-weight:normal;border-radius:10px;padding:0 6px;margin:0;display:inline-block;cursor:pointer;transition:all 0.2s linear;}

.barbg_user_two {
    line-height: 30px;
    color: #fff;
    text-align: left;
    position: absolute;
    top: 26px;
    left: 80px;
    z-index: 8;
    min-width: 110px;
    font-size: 12px;
    font-weight: normal;
    width: 75%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.barbg_user_two a.master {
    font-size: 12px;
    margin-right: 16px;
}

/* .barbg_user_two span.fansCout {background: url(../images/font-fans2.svg) no-repeat left center;padding-left: 16px;height: 18px;background-size: auto 78%;font-size: 12px;color: #fff;margin-right: 16px;}
.barbg_user_two span.fubCout {background: url(../images/font-fublish2.svg) no-repeat left center;padding-left: 16px;height: 18px;background-size: auto 78%;font-size: 12px;color: #fff;} */
.barbg_user_two span.fansCout {
    font-size: 12px;
    color: var(--text-white);
    margin-right: 16px;
}

.barbg_user_two span.fubCout {
    font-size: 12px;
    color: var(--text-white);
}

.barbg_user_two .icon-font-fans::before,
.barbg_user_two .icon-font-fublish::before {
    color: var(--text-color-4);
}

.barbg_addfavbt {
    height: 26px;
    position: absolute;
    top: 6px;
    right: 16px;
    display: block;
    z-index: 8;
    padding: 0 5px;
}

.rrbtred2 {
    border-radius: 2px;
    height: 30px;
    display: block;
    text-align: center;
    line-height: 30px;
    background: var(--second-color);
    cursor: pointer;
    font-size: 14px;
    font-weight: normal;
    color: #fff;
    padding:0 10px;
    border-radius: 4px;
}

.rrbtred2:before {
    /* display: inline-block;
    content: '+';
    font-size: 18px;
    margin-right: 2px; */
}

.rrbtred2_now {
    border-radius: 2px;
    height: 26px;
    display: block;
    text-align: center;
    line-height: 26px;
    background: var(--white40);
    cursor: pointer;
    font-size: 14px;
    font-weight: normal;
    color: var(--white80);
    padding: 0 6px;
    position: relative;
}
.rrbtred2_now i {background: var(--red40);width: 5px;height: 5px;border-radius: 50%;top: 0;right: 0;position: absolute;}

.barbg_user_sm_wep {
    width: 100%;
    height: 24px;
    position: relative;
    margin-top: 10px;
}

.barbg_user_sm {
    line-height: 16px;
    color: var(--white80);
    text-align: left;
    position: absolute;
    top: 0px;
    left: 14px;
    z-index: 999;
    min-width: 180px;
    font-size: 14px;
    font-weight: normal;
    width: 92%;
    height: 24px;
}

.active_per {
    width: 100%;
    height: 73px;
    position: relative;
    margin-top: 18px;
}

.active_wrap {
    height: 73px;
    background-color: var(--bg-color-1);
    border-bottom: 5px solid var(--border-1);
    padding: 15px 0;
    border-radius: 10px 10px 0 0;
    position: absolute;
    top: 0.rtopbgpx;
    left: 0px;
    z-index: 8;
    width: 100%;
    line-height: 73px;
    overflow: hidden;
}

.active_wrap2 {
    height: 40px;
    line-height: 40px;
    padding-left: 15px;
    /*background: url(../images/font-huowo.png) no-repeat 12px center;*/
    background-size: auto 43%;
    font-weight: 600;
    float: left;
    width: 17%;
}

.active_spacing {
    width: 3%;
    height: 40px;
    line-height: 40px;
    background: url(../images/spacing.png) no-repeat center center;
    background-size: auto 50%;
    float: left;
}

.active_wrap ul.active_ul {
    padding-left: 1px;
    float: left;
    overflow: hidden;
    width: 80%;
    height: 43px;
}

.active_wrap ul.active_ul li.aee {
    float: left;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    display: inline-block;
}

.aee img {
    border-radius: 50%;
}

.navbar_wrap {
    line-height: 44px;
    height: 44px;
    border-bottom: solid 1px var(--border-1);
    display: flex;
}
.navbar_wrap .sort{ 
    flex:1;
    padding:0;
    display: flex;
    justify-content: center;
}
.navbar_wrap .sort .Row{
    font-size: 15px;
    color: var(--text-color-2);
}
.navbar_wrap .navb {
    display: block;
    flex:1;
    background: inherit;
    -webkit-box-flex: 1;
    margin: 0 0px 0 0;
    padding: 0px;
    -webkit-box-sizing: border-box;
    float: left;
    height: 43px;
}

.navbar_wrap .navb a,
.navbar_wrap a {
    font-size: 15px;
    display: block;
    color: var(--text-color-2);
    line-height: 44px;
}

.navbar_wrap .navb a,
.navbar_wrap .navb a.selectb {
    line-height: 44px;
    text-align: center;
}

.navbar_wrap .navb a.selectb {
    color: #333333;
    font-size: 16px;
    font-weight: bold;
    position: relative;
    /* display: block;
    border-bottom: solid 2px var(--text-hightlight-1);
    font-size: 14px;
    height: 43px;
    border-radius: 0;
    padding: 0;
    margin: 0;
    color: var(--text-hightlight-1);
    font-weight: 600;
    text-align: center; */
}
.navbar_wrap .navb a.selectb::after{
    content: '';
    position: absolute;
    left:50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: var(--text-hightlight-1);
    height: 4px;
    width: 20%;
    border-radius: 100px;
}

.navbar_wrap .tit{
    line-height: 44px;
    color: #333333;
    font-size: 16px;
    font-weight: bold; 
    padding:0 10px;
    box-sizing: border-box;
}
/*话题详细*/
.content {
    background-color: var(--bg-color-1);
    padding-bottom: 10px;
}

.ba_title {
    font-size: 20px;
    margin-bottom: 0px;
    font-weight: 600;
    line-height: 28px;
    border-bottom: none;
    padding: 10px 14px 5px 14px;
}
.tabtit2 .ba_title {padding: 0;line-height: 20px;}
.tabtit2 .ba_title .sale {padding: 0 3px;vertical-align: -1px;}

.bawrap {
    color: var(--text-color-3);
    font-size: 12px;
    padding: 0 14px 10px;
}

.bawrap::after {
    content: "";
    clear: both;
    display: block;
}

.bawrap_left {
    float: left;
}

.bawrap_right {
    float: right;
}

.Ulock {
    background: var(--bg-hightlight-11);
    color: var(--red40);
    padding: 0 5px;
}

.bainfo {
    padding: 10px 14px;
    position: relative;
    overflow: hidden;
}
.promoticon {background: #eb533b;color: var(--text-white);font-size: 11px;line-height: 18px;letter-spacing: 2px;font-style: normal;padding: 0 6px;border-radius: 0 0 0 8px;top: 0;right: 0;position: absolute;}
.baheadwrap {
    float: left;
    width: 40px;
    height: 40px;
    position: relative;
    margin-right: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.baheadwrap .icon {
    width: 36px;
    height: 36px;
    overflow: hidden;
    background: #e1e1e1;
    border-radius: 50%;
    float: left;
    margin: 0 2px;
}

.baheadwrap .icon img {
    border-radius: 50%;
}

.BZ {
    background: #e62129;
    color: #fff;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    border: 1px solid #e62129;
    width: 26px;
    position: absolute;
    top: 21px;
    left: 50%;
    margin-left: -14px;
    text-align: center;
    padding: 0 1px;
    font-style: normal;
    border-radius: 2px;
    transform: scale(0.8);
    transform-origin: center center;
    vertical-align: middle;
    display: block;
}

.subBZ {
    background: #5fb825;
    color: #fff;
    font-size: 9px;
    line-height: 12px;
    font-weight: 400;
    border: 1px solid #5fb825;
    width: 30px;
    position: absolute;
    top: 22px;
    left: 50%;
    margin-left: -15px;
    text-align: center;
    padding: 0;
    font-style: normal;
    border-radius: 2px;
    transform: scale(0.8);
    transform-origin: center center;
}

.anaBZ {
    background: #ff8929;
    color: #fff;
    font-size: 9px;
    line-height: 12px;
    font-weight: 400;
    border: 1px solid #ff8929;
    width: 36px;
    position: absolute;
    top: 22px;
    left: 50%;
    margin-left: -18px;
    text-align: center;
    padding: 0;
    font-style: normal;
    border-radius: 2px;
    transform: scale(0.8);
    transform-origin: center center;
}

.date .BZ,
.date .subBZ,
.date .anaBZ {
    width: auto;
    position: static;
    padding: 0 4px;
    margin: 0 4px 0 0;
    font-size: 9px;
    line-height: 15px;
    border-radius: 10px;
    transform: scale(0.9);
}

.infowrap {
    height: 40px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    position: relative;
}

/* .infowrap .date .name {color: var(--text-hightlight-1);} */
.infowrap .name {
    color: var(--text-color-1);
    font-size: 13px;
    padding: 0;
    margin: 0 4px;
    display: inline-block;
    font-weight: 600;
}

.infowrap .list_lately,
.infowrap .list_hot_lately,
.infowrap .fans,
.infowrap .red-history-log {
    margin-left: 4px;
}

.infowrap .follow {
    background: linear-gradient(90deg, #ff8b50, #F14444);
    color: var(--text-white);
    border-color: #f76c52;
}

.infowrap .followon {
    background: var(--bg-color-2);
    color: var(--text-color-2);
    border-color: var(--border-3);
}

.hotion {background:var(--bg-hightlight-11);color:var(--red40);min-width:48px;font-size:12px;text-align:center;line-height:18px;padding:0 8px 0 5px;border-radius:20px;float:right;}
.bainfo .phase-trend {text-align: left;padding: 0;margin-top: 8px;}
.phase-trend .date {color:var(--text-color-2);line-height:15px;font-size:11px;display:inline-flex;align-items:center;justify-content:flex-start;}
.phase-trend .date .W-icon,.phase-trend .date .D-icon,.phase-trend .date .L-icon {background: var(--red40);color: var(--text-white);line-height: 14px;text-align: center;width: 14px;height: 14px;margin: 0 1px;border-radius: 50%;}
.phase-trend .date .D-icon {background: var(--blue50);}
.phase-trend .date .L-icon {background: var(--green60);}

.open-main-content,
.hide-main-content {
    margin-bottom: 12px;
}

.follow {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -13px;
    padding: 1px 0;
    width: 60px;
    text-align: center;
    background: var(--bg-color-1);
    border: solid 1px var(--border-hightlight-1);
    color: var(--text-hightlight-1);
    border-radius: 20px;
    font-size: 12px;
}

/*关注*/
.followon {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -13px;
    padding: 1px 0;
    width: 60px;
    text-align: center;
    background: var(--bg-color-1);
    border: solid 1px var(--border-2);
    color: var(--text-color-2);
    border-radius: 20px;
    font-size: 12px;
}

/*已关注*/
.synopsis {
    font-size: 12px;
    color: var(--text-color-2);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: calc(100% - 70px);
    line-height: 20px;
    margin: 0 0 0 5px;
    vertical-align: middle;
    display: inline-block;
}

.discpage {
    border-bottom: 1px solid var(--border-1);
    margin-top: 12px;
    padding-bottom: 6px;
}

.infoBtn {
    background: url(../Images/jt36x36.png) no-repeat center center;
    height: 30px;
    width: 10px;
    display: block;
    background-size: 12px auto;
    position: absolute;
    right: 10px;
    top: 0;
}

#addBtn {
    width: 50px;
    height: 55px;
    float: none;
    margin: 0 auto 10px;
}

#addBtn .like {
    float: left;
    width: 55px;
    height: 55px;
    background: url(../images/font-fabulous.svg) top center no-repeat;
    background-size: 100% auto;
    text-align: center;
    font-size: 15px;
    cursor: pointer;
    margin: 0 10px;
}

#addBtn .give {
    float: left;
    width: 50px;
    height: 55px;
    background: url(../images/font-reward.svg) top center no-repeat;
    background-size: 100% auto;
    text-align: center;
    font-size: 15px;
    cursor: pointer;
    margin: 0 10px;
}

.hidewrap {
    margin: 13px 16px 15px;
    padding: 12px 11px 14px;
    background-color: #e8f3ff;
    border: 1px solid var(--border-hightlight-1);
    border-radius: 4px;
}

.theme--dark .hidewrap {
    background-color: #0f223a;
}

.hidewrap2 {
    width: 100%;
    background-image: url(../images/hidebg.svg);
    background-repeat: repeat-x;
}

.hidewrap .word {
    font-size: 14px;
    color: var(--text-color-2);
    text-align: center;
    width: 100%;
    line-height: 20px;
}


.comment_wrap {}

.sort {
    right: 0 !important;
}

.Row {
    display: block;
    float: right;
    padding-right: 15px;
    line-height: 44px;
    z-index: 99;
    position: relative;
    right: 0px;
}

.Row i.tira2 {
    z-index: 9999;
    bottom: 30px;
    border-top-color: var(--text-color-2);
    border-right-color: var(--text-color-2);
    top: 15px;
    right: 0;
    left: auto;
}

i.tira2 {
    width: 8px;
    height: 8px;
    position: absolute;
    left: 50%;
    margin-left: -5px;
    bottom: -5px;
    content: "";
    background: var(--bg-color-1);
    transform: rotate(135deg);
    border-top: 1px solid #ababab;
    border-right: 1px solid #ababab;
    z-index: 9999;
}

.list_com {
    position: relative;
    border-bottom: solid 1px var(--border-1);
    padding: 10px 14px;
    float: left;
    width: calc(100% - 28px);
}

.comment_wrap .linec {
    position: relative;
    border-bottom: solid 1px #f5f5f5;
    width: 100%;
    padding: 10px 14px;
}

.list_com i {
    position: absolute;
    right: 14px;
    top: 10px;
    color: #999;
}

.comment_icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    float: left;
    margin-right: 5px;
}

.comment_icon img {
    border-radius: 50%;
    overflow: hidden;
}

.comment_wrap .data {
    float: left;
    width: calc(100% - 45px);
    line-height: 22px;
}

.comment_wrap .namereview {
    font-size: 15px;
    font-weight: 600;
    color: #4098e2;
}

p {
    margin: 0;
    padding: 0;
}

.pubtime {
    color: #999;
    font-size: 12px;
    margin-top: 5px;
}

.comment_wrap .data p {
    line-height: 20px;
    margin-top: 2px;
}

.collectwep {
    float: right;
    height: 20px;
    position: relative;
}

.collect {
    width: 40px;
    height: 20px;
    line-height: 20px;
    background: url(../images/collect.png) no-repeat right center;
    background-size: auto 20px;
    float: right;
}

.theme--dark .collect {
    background: url(../images/collect2.png) no-repeat right center;
    background-size: auto 20px;
}

.collect_Popup {
    position: absolute;
    right: 35px;
    top: -8px;
    border-radius: 4px;
    height: 36px;
    padding: 0 6px;
    width: 280px;
}

.collect_Popup_piece {
    height: 36px;
    line-height: 36px;
    font-size: 14px;
    color: var(--text-color-1);
    float: right;
    background-color: var(--bg-color-1);
    width: 0px;
    text-align: center
}

.data2 .collect_Popup_piece img {
    vertical-align: middle;
    width: 18px;
    height: 18px;
    display: inline-block;
}

.collect_Popup span {
    width: 1px;
    height: 36px;
    display: none;
    float: right;
}

.replywrap {
    background-color: var(--bg-color-2);
    padding: 2px 13px;
    border-radius: 4px;
    margin-top: 8px;
}

.replywrap .fabulous {
    background: url(../images/font-heart.svg) no-repeat left 13px;
    background-size: auto 12px;
    line-height: 20px;
    font-size: 11px;
    padding: 8px 0 6px 18px;
}

.replywrap .fabulous span {
    color: #4098e2;
    padding-right: 4px;
}

.replywhole {
    position: relative;
}

.replywrap .reply {
    line-height: 18px;
    padding-top: 8px;
}

.replywrap .reply span {
    color: #4098e2;
    font-weight: 600;
}

.replywrap .more3 {
    color: #4098e2;
    display: block;
    margin-top: 9px;
}

.data2 img {
    max-width: 50%;
    display: block;
    clear: both;
    margin: 10px 0;
}

.replywhole ul {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: -33px;
    background: #fff;
    border: solid 1px #e3e3e3;
    border-radius: 2px;
    padding: 0 5px;
    text-align: center;
    width: 60px;
    font-size: 14px;
    z-index: 99999;
}

.replywhole ul li {
    font-size: 14px;
    line-height: 30px;
    border-bottom: 1px solid #f5f5f5;
}

.commentmore {
    background: #f5f5f5 !important;
    border-bottom: none !important;
    height: 25px !important;
    line-height: 25px !important;
    margin-top: 5px;
}

.barpublish {
    width: calc(100% - 26px);
    border-top: solid 1px var(--border-1) padding: 10px 13px 12px;
    margin: 0 auto
}

.barpublish input {
    line-height: 34px;
    height: 34px;
    display: inline-block;
    border: none;
    width: calc(100% - 42px);
    border-radius: 20px;
    text-align: left;
    font-size: 14px;
    background: var(--bg-color-2) url(../Images/barpublish.svg) no-repeat 5px center;
    background-size: 18px 18px;
    background-position: 16px center;
    padding-left: 42px;
    color: var(--text-color-3);
}

.setup {
    background: url(../images/font-setup.svg) center center no-repeat;
    background-size: auto 24px;
    width: 30px;
    height: 30px;
    position: absolute;
    right: 40px;
    top: 50%;
    margin-top: -15px;
}

.tit {
    line-height: 28px;
}

.sale {
    width: 30px;
    text-align: center;
    height: 20px;
    line-height: 20px;
    background-color: var(--bg-hightlight-5);
    color: #fff;
    font-size: 11px;
    padding: 1px 3px;
    border-radius: 3px
}

.yellowButton {
    font-size: 12px;
    font-weight: 400;
    line-height: 28px;
    padding-left: 6px;
}

.examine {
    background: var(--bg-hightlight-3);
    color: var(--text-white);
    font-size: 12px;
    font-weight: normal;
    padding: 0 4px;
    margin-left: 6px;
    border-radius: 3px;
    vertical-align: 2px;
}

.examine.un {
    background: var(--text-color-3);
}

.more-tip {
    position: absolute;
    top: 0;
    right: 45px !important;
    width: 34px;
    height: 45px;
    line-height: 45px;
    float: right;
    z-index: 99;
}

.more-tip span {
    background-color: #fff;
    position: absolute;
    border-radius: 3px;
    top: 22px;
    right: 15px;
    display: inline-block;
    height: 2px;
    width: 24px;
    font: 0/0 a;
}

.more-tip span,
.more-tip span::before,
.more-tip span::after {
    background-color: #fff;
    border-radius: 3px;
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    height: 3px;
}

.more-tip span::before {
    margin-top: -7px;
}

.more-tip span::after {
    margin-top: 7px;
}


/*成员统计*/
.allwrap {
    padding: 10px 13px 11px;
    background: var(--bg-color-1);
    border-bottom: 1px solid var(--border-1);
    height: 63px;
}

.allicon {
    width: 40px;
    height: 40px;
    margin: 1px 6px 1px 0;
    float: left;
}

.allicon img {
    border-radius: 50%;
}

.allname {
    height: 42px;
    line-height: 42px;
    font-size: 14px;
    font-weight: 700;
    float: left;
}

.allpost {
    height: 42px;
    line-height: 42px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
}

.allpost .BZ {
    background: var(--bg-hightlight-5);
    color: #fff;
    font-size: 11px;
    line-height: 15px;
    text-align: center;
    padding: 0;
    border-radius: 2px;
    transform: scale(1);
    transform-origin: center center;
    display: inline-block;
    padding: 0 4px;
    position: initial !important;
    width: auto !important;
}

.allpost .subBZ {
    background: var(--bg-hightlight-7);
    color: #fff;
    font-size: 11px;
    line-height: 15px;
    text-align: center;
    padding: 0;
    border-radius: 2px;
    transform: scale(1);
    transform-origin: center center;
    display: inline-block;
    padding: 0 4px;
    position: initial !important;
    width: auto !important;
}

.allpost .anaBZ {
    background: var(--bg-hightlight-3);
    color: #fff;
    font-size: 11px;
    line-height: 15px;
    text-align: center;
    padding: 0;
    border-radius: 2px;
    transform: scale(1);
    transform-origin: center center;
    display: inline-block;
    padding: 0 4px;
    position: initial !important;
    width: auto !important;
}

.alljun {
    font-size: 12px;
    height: 42px;
    line-height: 42px;
    color: var(--text-color-3);
    float: right;
    padding-left: 6px;
}

.alljun span {
    color: var(--text-hightlight-3);
}

.sort {
    display: block;
    float: right;
    /* background:url("../Images/down_tir.png") no-repeat right center;background-size:14px;*/
    padding-right: 15px;
    line-height: 40px;
    z-index: 99;
    position: relative;
    right: 14px;
}

.sort ul {
    box-shadow: #6666664f 0px -2px 10px 0px;
    position: absolute;
    top: 35px;
    width: 100px;
    right: 0;
    background: var(--bg-color-1);
    border: solid 1px var(--border-1);
    border-radius: 2px;
    padding: 5px;
    text-align: center
}

.sort ul li {
    font-size: 14px;
    line-height: 30px;
}

.sort ul li.on {
    background: var(--bg-hightlight-5);
    border-radius: 4px;
    font-weight: bold;
    color: #FFF;
}

.sort ul li:last-child {
    border: none;
}

.sort i.tir2 {
    z-index: 9999;
    bottom: 30px;
    border-top-color: #666;
    border-right-color: #666;
    top: 12px;
    right: 0;
    left: auto;
}

.tabPopup {
    padding: 0 5px;
    box-shadow: 1px 1px 1px RGBA(0, 0, 0, 0.5);
    z-index: 999;
    width: 60%;
    background: #333333;
    position: absolute;
    top: 120px;
    left: 20%;
    border-radius: 15px;
}

.tabPopup>i.tir {
    border-top: 5px solid #333333;
}

.tabPopup>span {
    width: 29.9%;
    font-size: 12px;
    display: block;
    float: left;
    text-align: center;
    color: #fff;
    line-height: 30px;
    border-right: solid 1px RGBA(255, 255, 255, 0.3);
}

.tabPopup span:last-child {
    border: none;
}


/* -----svg----- */
.icon-font-small-document::before {
    margin-right: 2px;
}

.icon-font-fans::before,
.icon-font-fublish::before {
    margin-right: 3px;
    font-size: 14px;
}

/* 高解锁球吧 */
.topbarbox {background: linear-gradient(100deg,rgb(0,113,255,0.15),rgb(127,221,255,0.1) 40%,rgb(255,56,0,0.1));padding: 10px;margin: 10px 14px;border-radius: 8px;display: flex;align-items: center;}
.topbarbox .barpic {width: 36px;height: 36px;border-radius: 50%;object-fit: cover;}
.topbarbox .barbox {font-size: 14px;font-weight: bold;flex: 1;margin-left: 6px;}
.topbarbox .barlis {font-size: 12px;font-weight: normal;margin-right: 6px;display: inline-block;}
.topbarbox .barlis span {color: var(--text-color-3);font-size: 11px;margin-right: 3px;}
.topbarbox .icon {background: none;color: var(--text-color-3);font-size: 14px;}