:root{
    --primary-color: #5C9A2D;
    --primary-color-btn: #71B838;
    --background-color: rgba(67, 44, 137, 1);
    --background-color-btn: #65559E;
    --warning-color: #FE9A03;
    --primary-font-color: #1A1A1A;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0;
    color: var(--primary-font-color);
    background-color: #f5f5f5;
    min-height: 100%;
}

input,
button,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    outline: none;
    resize: none;
}

.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.flex-row {
    flex-direction: row;
}

.content-center {
    justify-content: center;
}

.content-between {
    justify-content: space-between;
}

.content-around {
    justify-content: space-around;
}

.content-end {
    justify-content: flex-end;
}

.items-center {
    align-items: center;
}

.item-start {
    align-items: flex-start;
}

.item-end {
    align-items: flex-end;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.h28 {
    height: 28px;
}

input::-webkit-input-placeholder,
/* WebKit browsers */
textarea::-webkit-input-placeholder {
    /* WebKit browsers */
    color: rgb(204, 204, 204);
}

input:-moz-placeholder,
/* Mozilla Firefox 4 to 18 */
textarea:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: rgb(204, 204, 204);
}

input::-moz-placeholder,
/* Mozilla Firefox 19+ */
textarea::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: rgb(204, 204, 204);
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    /* important 增加权重*/
    color: rgb(204, 204, 204) !important;
}

input::-ms-clear {
    display: none;
}

input::-ms-reveal {
    display: none;
}

input::-webkit-contacts-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
    position: absolute;
    right: 0;
}

/* 底部置地*/
/* html,body,.wrap {height:100%;font-size:100%;background:#f3f6f7;min-width:1200px;} */
img {
    max-width: 100%;
    border-style: none;
    vertical-align: middle;
    object-fit: cover;
}

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

ul,
li {
    list-style: none;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
}

.markdown-body ul {
    list-style: initial !important;
}

.markdown-body ul li {
    display: list-item !important;
}

th {
    font-weight: normal;
}

a {
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    text-decoration: none;
    color: inherit;
}

.mcolor {
    color: #59B6D7;
}

.tcolor {
    color: #666666;
}

.ucolor {
    color: #777777;
}

.ccolor {
    color: #999999;
}

.gcolor {
    color: #CCCCCC;
}

.lcolor {
    color: #EDEDED;
}

.wcolor {
    color: white !important;
}

.c1a1a1a {
    color: #1a1a1a;
}

.round {
    border-radius: 50%;
}

.pointer {
    cursor: pointer;
}

.font12 {
    font-size: 12px;
}

.font14 {
    font-size: 14px;
}

.font16 {
    font-size: 16px;
}

.font18 {
    font-size: 18px;
}

.font20 {
    font-size: 20px;
}

.fl {
    float: left !important;
}

.fr {
    float: right !important;
}

.margin0 {
    margin: 0;
}

.padding0 {
    padding: 0;
}

.h40 {
    height: 40px;
}

.mt0 {
    margin-top: 0;
}

.mt4 {
    margin-top: 4px;
}

.mt5 {
    margin-top: 5px;
}

.mt10 {
    margin-top: 10px;
}

.mt12 {
    margin-top: 12px;
}

.mt15 {
    margin-top: 15px;
}

.mt16 {
    margin-top: 16px;
}

.mt20 {
    margin-top: 20px;
}

.mt-20 {
    margin-top: -20px;
}

.mt25 {
    margin-top: 25px;
}

.mt30 {
    margin-top: 30px;
}

.mt40 {
    margin-top: 40px;
}

.mr0 {
    margin-right: 0;
}

.mr2 {
    margin-right: 2px;
}

.mr10 {
    margin-right: 10px;
}

.mr12 {
    margin-right: 12px;
}

.mr20 {
    margin-right: 20px;
}

.mb0 {
    margin-bottom: 0;
}

.mb10 {
    margin-bottom: 10px;
}

.mb12 {
    margin-bottom: 12px;
}

.mb15 {
    margin-bottom: 15px;
}

.mb16 {
    margin-bottom: 16px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb50 {
    margin-bottom: 50px;
}

.mb30 {
    margin-bottom: 30px;
}

.mb40 {
    margin-bottom: 40px;
}

.ml0 {
    margin-left: 0;
}

.ml8 {
    margin-left: 8px;
}

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

.ml10 {
    margin-left: 10px;
}

.ml20 {
    margin-left: 20px;
}

.ml24 {
    margin-left: 24px;
}

.h100 {
    height: 100px;
}

.h90 {
    height: 90px;
}

.w260 {
    width: 260px;
}

.gray {
    background: #f3f6f7;
}

.bgwhite {
    background-color: white;
}

.icon {
    font-size: 1.5em;
    overflow: hidden;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -2px;
}

.txt-hide {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.clearfix {
    margin: 0
}

.clearfix:after {
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
    content: '.';
}

.hide {
    display: none !important;
}

.block-important {
    display: block !important;
}

.inline {
    display: inline-block;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.text-pre {
    white-space: pre-wrap;
}

.display-block {
    display: block;
}

.display-none {
    display: none;
}

.display-flex {
    display: flex;
}

.mh400 {
    min-height: 400px;
}

.bgf {
    background: #ffffff;
}

.p-zIndex {
    z-index: 3;
}

/* 顶部 */

.nav {
    width: 100%;
    background: #fff;
}

.order-nav {
    background-image: url(../images/mixue/top_bg2.svg);
    background-size: 100%;
}

.nav .nav_right {
    top: 24px;
    right: 20px;
}

.nav .nav_right .message-box {
    width: 24px;
    height: 24px;
}

.nav .nav_right .message-box>img {
    width: 100%;
}

.nav .nav_right .nav_avatar_box .frame img {
    width: 28px;
    height: 28px;
    margin: 6px 10px;
    display: block;
}

.nav .nav_right .nav_avatar_box .nav_menu {
    top: 40px;
    right: 0;
}

.nav .nav-inner {
    width: 100%;
    padding: 0 24px;
    height: 76px;
    background-color: var(--background-color);
}

.nav .nav-inner .nav-logo {
    height: 76px;
    line-height: 76px;
}

.nav .nav-inner .nav_left {
    float: left;
    width: 10%;
}

@media screen and (max-width: 1440px) {
    .nav .nav-inner .nav_left {
        width: 6%;
    }
}

.nav .nav-inner .nav-logo>.nav_logo {
    max-width: 100%;
    height: 26px;
    display: inline-block;
}

.nav .nav-inner .nav-logo>.nav_logo img {
    height: 100%;
    object-fit: contain;
}

.nav .nav-inner .nav-search {
    width: 240px;
    height: 40px;
    border-radius: 20px;
    padding: 10px 16px;
    box-sizing: border-box;
    border: 1px solid #fff;
}

.nav .nav-inner .nav-search .sel {
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    line-height: 16px;
    cursor: pointer;
}

.nav .nav-inner .nav-search .sel>img {
    width: 8px;
    vertical-align: baseline;
    margin-left: 6px;
}

.nav .nav-inner .nav-search .sel-inner {
    position: absolute;
    top: 38px;
    left: -10px;
    background: #ffffff;
    z-index: 6;
    /*display: flex;*/
    padding: 16px 24px;
    box-sizing: border-box;
    border-radius: 4px;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    display: none;
    width: max-content;
}

.nav .nav-inner .nav-search .sel-item {
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-font-color);
    line-height: 16px;
    margin-top: 16px;
}

.nav .nav-inner .nav-search .sel-item:first-of-type {
    margin-top: 0;
}

.nav .nav-inner .nav-search .sel-active {
    color: var(--primary-color);
}

.nav .nav-inner .nav-search .shu {
    width: 1px;
    height: 20px;
    background: rgba(222, 222, 222, 0.9333);
    margin: 0 13px;
}

.nav .nav-inner .nav-search .input {
    flex-grow: 1;
    background: rgba(0, 0, 0, 0);
    border: none;
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    line-height: 16px;
    width: 100px;
}

.nav .nav-inner .nav-search .input::placeholder {
    color: rgba(255, 255, 255, 0.8pc/images/shentong/arrow_search.svg);
}

.nav-list {
    width: 960px;
    height: 30px;
    margin-left: calc((100% - 1200px) / 2);
}

.nav-list>.nav-item {
    width: auto;
    height: 100%;
    margin-top: 23px;
    margin-right: 36px;
    color: rgba(255, 255, 255, 0.5);
    font-weight: 500;
    font-size: 14px;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;
    position: relative;
}

.nav-list>.nav-item:hover {
    color: #fff;
}

.nav-list>.nav-item.nav-has-child::after {
    content: '\25be';
    font-size: 12px;
    margin-left: 3px;
    transition: transform 0.3s;
    display: inline-block;
    height: 30px;
    line-height: 30px;
    color: #cccccc;
}

.nav-list>.nav-item span {
    display: inline-block;
    height: 30px;
    line-height: 30px;
}

.nav-list>.nav-item:first-of-type {
    border-left: none;
    /* border-radius: 6px 0px 0px 6px; */
}

.nav-list>div.nav-item:first-of-type {
    /* border-left: 1px solid rgba(255,255,255,0.93); */
    /* border-radius: 0px 6px 6px 0px; */
}

.nav-list>.nav-item:last-child {
    margin: 0;
}

.nav-list>.nav-active {
    font-weight: 600;
    color: #fff;
}

.nav-list>.nav-active>span,
.nav-list>.nav-active>a {
    position: relative;
    display: block;
    height: 100%;
    line-height: 30px;
}

.nav-list>.nav-active>span::after,
.nav-list>.nav-active>a::after {
    content: "";
    position: absolute;
    width: 100%;
    left: 0;
    bottom: -2px;
    height: 2px;
    background: #fff;
}

.nav-list>.nav-item .nav-child {
    position: absolute;
    left: 0;
    top: 30px;
    z-index: 999;
    display: none;
    margin-left: -20px;
}

.nav-list>.nav-item .nav-child>div {
    margin-top: 8px;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    background: #fff;
    border-radius: 4px;
    padding: 13px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.nav-list>.nav-item:hover .nav-child {
    display: block;
}

.nav-list>.nav-item .nav-child-item {
    font-size: 16px;
    font-weight: 400;
    color: #666666;
    line-height: 19px;
    text-align: center;
    margin-top: 20px;
    display: block;
}

.nav-list>.nav-item .nav-child-item:first-of-type {
    margin-top: 0;
}

.nav-list>.nav-item .nav-child-item.nav-active,
.nav-list>.nav-item .nav-child-item:hover {
    color: var(--primary-color);
}

.nav-list>.nav-item .nav-more {
    position: absolute;
    left: 0;
    top: 52px;
    min-width: 170px;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    padding: 20px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: none;
    text-align: center;
    z-index: 9;
}

.nav-list>.nav-item .nav-more-item {
    font-size: 16px;
    font-weight: 400;
    color: #666666;
    line-height: 19px;
    text-align: center;
    margin-top: 20px;
    display: block;
    padding: 0 20px;
    width: max-content;
}

.nav-list>.nav-item .nav-more-item:first-of-type {
    margin-top: 0;
}

.nav-list>.nav-item .nav-more-item.nav-active,
.nav-list>.nav-item .nav-more-item:hover {
    color: var(--primary-color);
}

.nav-post-create-dropdown {
    width: 110px;
    height: 40px;
    padding: 10px 20px;
    border-radius: 20px;
    background: #fff;
    color: var(--background-color);
    font-size: 14px;
    position: relative;
    text-align: center;
}

.nav-post-create-dropdown .send-p {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
}

.nav-post-create-dropdown .send-p img {
    margin-right: 8px;
}

.nav-post-create-dropdown .shu {
    width: 1px;
    height: 20px;
    background: rgba(222, 222, 222, 0.9333);
    margin: 0 13px;
}

.nav-post-create-dropdown .nav-post-type-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    min-width: 125px;
    margin-top: 12px;
}

.nav-post-create-dropdown .nav-post-type-dropdown ul {
    margin: 0;
    padding: 10px 0;
    list-style: none;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 17px 16px;
}

.nav-post-create-dropdown .nav-post-type-dropdown li {
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: background-color 0.2s;
    font-size: 14px;
    color: var(--primary-font-color);
}

.nav-post-create-dropdown .nav-post-type-dropdown li:hover {
    color: var(--primary-color);
}

.nav-post-create-dropdown .nav-post-type-dropdown li i {
    margin-right: 10px;
    font-size: 16px;
    color: #666;
    width: 16px;
    text-align: center;
}

.nav-post-create-dropdown .nav-post-type-dropdown li a {
    flex: 1;
}

.nav-post-create-dropdown .send-p.active .icon-arrow-down {
    transform: rotate(180deg);
}

.nav .nav-inner .index-banner {
    margin-top: 16px;
    width: 1200px;
    height: 200px;
    border-radius: 6px;
    overflow: hidden;
}


/*导航*/
.header {
    position: relative;
    width: 100%;
    height: 190px;
    min-width: 1200px;
    background: no-repeat;
    background-size: 100%;
    /* background-image: url(./img/top_bg.svg); */
}

.header .header-top {
    margin: auto;
    width: 715px;
    height: 124px;
    padding: 32px;
}

.header .header-top .header-logo {
    width: 267px;
    height: 60px;
    display: inline-block;
}

.header .header-top .header-logo img {
    width: 100%;
    object-fit: cover;
}

.header .header-top .header-search {}

.header .header-nav {}

.header .header-nav li {}

.header .header-nav li .active {}


.nav_logo_img {
    vertical-align: top !important;
}

.nav_beta {
    display: inline-block;
    float: left;
    margin-left: -2px;
    padding-top: 32px;
    color: #59b6d7;
}

.nav_list {
    width: 1200px;
    margin: auto;
    padding: 20px 0;
    height: 80px;
    line-height: 40px;
}

.nav_list .navs {
    display: flex;
    height: 38px;
    margin-bottom: 0;
    justify-content: flex-start;
    align-items: center;
    float: left;
}

.nav_list .navs li {
    float: left;
    text-align: center;
    margin-right: 15px;
    transition: all .3s;
    position: relative;
}

.nav_list .navs li a {
    display: inline-block;
    margin: 0 10px;
    color: #343434;
    font-size: 16px;
    transition: all .1s;
    border-bottom: 2px solid transparent;
}

.nav_list .navs li a:hover {
    color: #0387FB !important;
    border-bottom: 2px solid #0387FB;
}

.nav_list .navs li a.selected {
    color: #0387FB !important;
    border-bottom: 2px solid #0387FB;
}

.nav_list .navs li a:link,
.nav_list .navs li a:visited,
.nav_list .navs li a:hover {
    text-decoration: none;
}

.nav_list .navs .child_navs {
    display: none;
    position: absolute;
    z-index: 99;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 1px 22px #e2e0e0;
    min-width: 120px;
}

.nav_list .navs .child_navs a {
    display: block;
    font-size: 16px;
    margin: 0;
    padding: 10px;
    color: #343434;
    transition: all .1s;
    border-bottom: none;
}

.nav_list .navs .child_navs a:hover {
    color: #59b6d7 !important;
    border-bottom: none;
}

.nav_list .nav_search {
    position: relative;
    width: 160px;
    height: 28px;
    border-radius: 14px;
    border: 1px solid #ECECEC;
    margin-top: 5px;
    margin-right: 20px;
    line-height: 28px;
}

.nav_right .message-box {
    width: 40px;
    cursor: pointer;
    position: relative;
    text-align: center;
    margin-right: 10px;
}

#nav-message .unread_div {
    position: absolute;
    top: -1px;
    left: 16px;
    height: 14px;
    min-width: 14px;
    max-width: 24px;
}

#nav-message .unread_div>span {
    display: block;
    font-size: 12px;
    text-align: center;
    color: #fff;
    border-radius: 7px;
    background: #ff2121;
    min-width: 14px;
    height: 14px;
    line-height: 14px;
    padding: 0 3px;
}

.nav_list .nav_input {
    width: calc(100% - 35px);
    height: 100%;
    font-size: 12px;
    color: #333;
    border: none;
    outline: none;
    background: transparent;
    padding-left: 15px;
    vertical-align: top;
}

.nav_list .nav_search_icon {
    cursor: pointer;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    color: #ECECEC;
}

.head_search {
    display: none;
    z-index: 999;
    position: absolute;
    background: #fff;
    width: 235px;
    font-size: 14px;
    box-shadow: 0 1px 22px #e2e0e0;
    top: 30px;
}

.head_search .history {
    display: none;
}

.head_search .history p {
    font-size: 14px;
    color: #ccc;
    padding: 20px 15px;
    margin: 0;
}

.head_search .history ul {
    display: block;
    margin: 0;
    padding: 0px 15px;
    overflow: hidden;
}

.head_search .history ul li {
    width: 205px;
    float: left;
    overflow: hidden;
}

.head_search .history ul li span {
    cursor: pointer;
    width: 170px;
    font-size: 12px;
    color: #999;
    display: block;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.head_search .history ul li i {
    display: block;
    cursor: pointer;
    width: 32px;
    height: 40px;
    float: right;
    vertical-align: sub;
    background-image: url(./img/close_icon.png);
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: center;
    content: '';
}

.head_search .history .clear {
    font-size: 12px;
    line-height: 40px;
    display: block;
    height: 40px;
    cursor: pointer;
    text-align: center;
    color: #999;
    background: #F6F6F6;
}

.head_search .search_types {
    display: none;
}

.head_search .search_types ul {
    display: block;
    margin: 0;
    padding: 20px 20px 0px 20px;
    overflow: hidden;
}

.head_search .search_types ul li {
    color: #666;
    width: 100%;
    cursor: pointer;
    float: left;
    margin-bottom: 20px;
    overflow: hidden;
    line-height: 18px;
}

.head_search .search_types ul li .keywords {
    color: #0387FB;
    max-width: 110px;
    line-height: 18px;
    display: inline-block;
    vertical-align: text-top;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav_right {
    float: right;
}

.nav_right_info {
    display: flex;
    float: right;
    gap: 20px;
}

.nav_right .role-icon {
    position: absolute;
    width: 14px;
    height: 14px;
    bottom: -3px;
    left: 20px;
}

.nav_right a.nava {
    font-size: 14px;
    color: #666;
}

.nav_right a.nava:hover {
    color: #0387FB;
}

.nav_right .avatar {
    width: 32px;
    height: 32px;
    margin-right: 5px;
    cursor: pointer;
    border-radius: 50%;
}

.nav_name {
    display: inline-block;
    float: left;
    overflow: hidden;
    width: 84px;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #343434;
}

.nav_menu {
    position: absolute;
    z-index: 99;
    top: 42px;
    right: -41px;
    display: none;
    width: 122px;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    text-align: center;
}

.nav_menu .hover_cover {
    position: absolute;
    left: 0;
    width: 100%;
    height: 80px;
}

/*.nav_menu .triangle {margin-left:128px;margin-top:-23px;}*/
.nav_menu ul li {
    font-size: 14px;
    height: 38px;
    line-height: 38px;
}

.nav_menu ul li a {
    display: inline-block;
    height: 100%;
    color: var(--primary-font-color);
    outline: none;
    width: 58px;
    text-align: left;
}

/* .nav_menu ul li a:hover {color:#e60012 !important;} */
.nav_menu ul li a svg {
    margin-top: -4px;
    margin-right: 15px;
}

.breadcrumb {
    color: rgb(153, 153, 153);
    width: 1200px;
    font-size: 14px;
    margin: 16px auto 0px;
}

/*底部*/
/* .footer {position:relative;z-index:1;clear:both;width:100%;height:225px;margin-top:-225px;text-align:center;border-top:1px solid #e5e5e5;background:#000000;} */
.footer_cont {
    width: 1080px;
    margin: 0 auto;
    color: #999999
}

.footer_cont ul {
    margin-top: 50px;
}

.footer_cont ul li {
    display: inline-block;
    margin-left: 10px;
}

.footer_cont ul li a {
    font-size: 12px;
    padding-right: 10px;
    color: #808080;
    border-right: 1px solid #ccc;
}

.footer_cont ul li a:hover {
    color: #59b6d7;
}

.footer_cont ul li:last-child a {
    border-right: 0;
}

.footer_cont .rights {
    margin: 20px 0 30px;
    color: #808080;
}

.footer_cont .developer {
    font-size: 12px;
    margin-top: 50px;
    color: #ccc;
}

.footer_cont .developer span {
    display: inline-block;
    margin: 0 5px;
    color: #333;
}

/*内容*/
.main {
    float: left;
    clear: both;
    width: 100%;
    padding-bottom: 18px;
    /* background: linear-gradient(0deg, #f0f1f7 0%, #f9f7f8); */
    background-color: #f5f5f5;
    min-height: calc(100vh - 316px);
}

.main .caidai {
    position: relative;
}

.main .caidai::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 408px;
    background-image: url(img/caidai.svg);
    background-size: 100%;
    background-position: center;
}

.order-main {
    float: left;
    clear: both;
    width: 100%;
    padding-bottom: 30px;
    background: #FAF2F2;
    background-size: 100%;
    background-image: url(../images/mixue/page_bg2.svg);
}

.container {
    margin: 16px auto 0 auto;
    width: 1200px;
}

.plaza-cover {
    position: relative;
    margin-bottom: 16px;
}

.plaza-cover .cover-img {
    width: 100%;
    aspect-ratio: 4.3;
    border-radius: 6px;
}

.plaza-cover .action {
    position: absolute;
    bottom: 20px;
    left: 100px;
    display: flex;
    gap: 12px;
}

.plaza-cover .action .u-btn {
    background: #fff;
    border-radius: 30px;
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
}

.plaza-cover .action .u-btn.action-btn {
    background: #0176FF;
    padding: 13px 32px;
    color: #fff;
}

.plaza-cover.group .action .u-btn.link-btn {
    color: var(--primary-color);
}

.plaza-cover.group .action .u-btn.action-btn {
    background: var(--primary-color);
}

.plaza-cover .action .u-btn.link-btn {
    background: #fff;
    padding: 13px 32px;
    color: #0176FF;
}

/*左侧导航*/
.left_menu {
    float: left;
    width: 150px;
    padding-top: 20px;
}

.left_menu ul li {
    position: relative;
    margin-bottom: 36px;
}

.left_menu ul li a {
    font-size: 16px;
    color: #333;
}

.left_menu ul li a:link {
    text-decoration: none;
}

.left_menu .icon {
    font-size: 30px;
    vertical-align: -8px;
    margin-right: 10px;
}

.left_menu .selected {
    color: #59b6d7 !important;
}

/*右侧内容*/
.right_container {
    width: 350px;
    float: left;
}

/*左侧内容*/
.left_container {
    margin-right: 16px;
    float: left;
    width: 830px;
}

/*弹出提示*/
.noticebox {
    position: fixed;
    z-index: 19891016;
    top: 62px;
    display: none;
    width: 100%;
    text-align: center;
}

.authnoticebox {
    top: 82px;
}

.noticebox .notice {
    font-size: 14px;
    line-height: 50px;
    z-index: 9999;
    height: 50px;
    margin: auto;
    text-align: center;
    color: #666;
    background: #fff;
    box-shadow: 0 0 22px #ededed;
}

.noticebox .notice img {
    margin-right: 10px;
}

/*右侧浮动*/
.right_extras {
    position: fixed;
    z-index: 99;
    right: 80px;
    bottom: 80px;
}

.right_extras a {
    display: block;
    width: 48px;
    height: 48px;
    margin-bottom: 10px;
    text-align: center;
    border-radius: 50%;
}

.right_extras svg {
    font-size: 34px;
    display: block;
    margin-bottom: 10px;
    padding-top: 11px;
    padding-left: 12px;
    color: #fff;
}

.right_extras .app {
    background: #dedede;
    position: relative;
}

.right_extras .app:hover {
    background: #59b6d7;
}

#change_cn:hover {
    background: #59b6d7;
}

#change_cn {
    background: #dedede;
}

#change_en:hover {
    background: #59b6d7;
}

#change_en {
    background: #dedede;
}

.right_extras .app .qrcode-wrap {
    position: absolute;
    right: 120%;
    top: -20px;
    padding: 10px;
    background-color: #fff;
    display: none;
    width: 140px;
    height: 160px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.09);
}

.right_extras .app:hover .qrcode-wrap {
    display: flex;
}

.right_extras .app .qrcode-wrap img {
    width: 120px;
    height: 120px;
}

.right_extras .app .qrcode-wrap span {
    display: block;
    height: 10px;
    line-height: 10px;
    margin-top: 10px;
    color: #999;
    font-size: 14px;
}

.right_extras .icon_gotop {
    display: inline-block;
    width: 17px;
    height: 20px;
    background-image: url(./img/backtop.svg);
}

.right_extras .gotop {
    width: 60px;
    height: 60px;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.10);
    padding: 10px;
    color: #b2b2b2;
    font-size: 13px;
}

/* .right_extras .gotop:hover .icon_gotop{
  background-image: url("./img/backtop_on.svg");
} */
/*.right_extras .gotop:hover {background:#59b6d7;}*/
.right_extras .gotop svg {
    font-size: 40px !important;
    padding-left: 8px !important;
}

/*热门用户*/
.hot_users {
    width: 100%;
    background: #fff;
}

.hot_users .hot_users_title {
    text-align: center;
    color: #333;
    font-size: 18px;
    padding: 20px 0px;
}

.hot_users ul {
    width: 100%;
    float: left;
    padding: 0px 20px;
    margin-bottom: 0px;
}

.hot_users ul li {
    float: left;
    width: 100%;
    padding: 20px 0px;
    border-top: 1px solid #ededed;
}

.hot_user_avatar {
    float: left;
}

.hot_user_avatar img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.hot_user_info {
    width: 125px;
    float: left;
    margin-left: 10px;
}

.hot_user_info span {
    display: block;
}

.hot_user_info .hot_user_name {
    font-size: 14px;
    color: #333;
}

.hot_user_info .hot_user_intro {
    font-size: 14px;
    height: 44px;
    line-height: 22px;
    color: #999;
    margin-top: 10px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box;
    word-break: break-all;
}

/*推荐用户*/
/* .recusers {width:100%;border-radius:3px;background:#fff;margin-bottom:30px;} */
/* .recusers .u-tt{padding: 15px;text-align: center;font-weight: 500;font-size: 18px;border-bottom: 1px solid #ededed;} */
.recusers p.nodata {
    line-height: 50px;
    width: 100%;
    height: 50px;
    margin: 0;
    text-align: center;
}

/* .recusers ul {display:inline-block;margin-bottom: 20px;}
.recusers li {float:left;width:50px;margin:0 12px 0 15px;text-align:center;}
.recusers li > a {position:relative;}
.recusers li > a > img.role-icon {position:absolute;right:0;top:10px;width:18px;height:18px;border-radius:50%;}
.recusers li img {width:50px;height:50px;border-radius:50%;margin-top:20px;}
.recusers li span {font-size:12px;overflow:hidden;width:50px;margin-top:10px;white-space:nowrap;text-overflow:ellipsis;color:#666;line-height: 1;}
.recusers li span a {color:#333;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; display:block;margin-top:10px;}
.recusers .recmore {font-size:12px;line-height:40px;display:block;height:40px;cursor:pointer;text-align:center;color:#999;background:#f8fcff;}
.recusers .recmore {color:#999;} */

.recusers .change {
    font-size: 13px;
    font-weight: 400;
    text-align: LEFT;
    color: #999999;
    line-height: 13px;
    float: right;
    margin-top: 8px;
}

.recusers .change>img {
    width: 12px;
    height: 12px;
    margin-right: 5px;
}

.recusers li {
    padding: 12px 0;
    border-bottom: 1px solid rgba(229, 229, 229, 1);
    display: flex;
}

.recusers li:last-child {
    border: 0;
}

.recusers li a.avatar {
    display: inline-block;
    width: 54px;
    height: 54px;
}

.recusers li a.avatar>img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.recusers li a.avatar>img.avatar-border {
    transform: scale(1);
}

.recusers li .item-info {
    display: inline-block;
    width: calc(100% - 136px);
    margin-left: 12px;
}

.recusers li .item-info a.user-info {
    display: -webkit-box;
    font-size: 14px;
    font-weight: 500;
    line-height: 28px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.recusers li .item-info a.user-info.flex {
    display: flex;
    align-items: center;
}

.recusers li .item-info a.user-info.flex>span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    width: calc(100% - 50px);
}

.recusers li .item-info a.user-info.flex>.role-icon {
    margin-left: 4px;
}

.recusers li .item-info a.desc {
    display: block;
    color: #999999;
    font-size: 12px;
    font-weight: 400;
}

.recusers li .send {
    display: flex;
    align-items: center;
}

.recusers li .send>a {
    width: 56px;
    height: 24px;
    display: block;
    background: var(--primary-color);
    border-radius: 20px;
    color: #fff;
    text-align: center;
    line-height: 24px;
}

.recusers li .reward {
    display: flex;
    align-items: center;
}
.recusers li .reward>a {
    width: 70px;
    height: 24px;
    display: block;
    background: var(--primary-color);
    border-radius: 20px;
    color: #fff;
    text-align: center;
    line-height: 24px;
}

/*近期热点*/
.hot_news {
    width: 100%;
    margin-bottom: 30px;
    padding: 0 15px 0;
    border: 1px solid #ededed;
    background-color: #fff;
}

.hot_news .title {
    font-size: 18px;
    padding: 20px 0 15px;
    text-align: center;
    color: #333;
    border-bottom: 1px solid #ededed;
}

.hot_news .time_menu {
    display: inline-block;
    width: 203px;
    margin: 0;
    padding-top: 16px;
    border-bottom: 1px solid #ededed;
    background-color: #fff;
}

.hot_news .time_menu li {
    float: left;
    width: 33.3%;
    cursor: pointer;
    text-align: center;
}

.hot_news .time_menu li a {
    display: inline-block;
    height: 40px;
    padding: 0 10px;
    color: #999;
}

.hot_news .time_menu li a.hover {
    color: #333;
    border-bottom: 2px solid #59b6d7;
}

.hot_news_list li {
    font-size: 14px;
    overflow: hidden;
    padding: 15px 0;
    border-bottom: 1px solid #ededed;
}

.hot_news_list li:last-child {
    border-bottom: 0;
}

.hot_news_list li span {
    font-size: 12px;
    display: inline-block;
    width: 16px;
    text-align: center;
    color: #fff;
    border-radius: 3px;
    background: #59b6d7;
}

.hot_news_list li span.grey {
    background: #ccc;
}

.hot_news_list li a {
    line-height: 22px;
    display: -webkit-box;
    float: right;
    overflow: hidden;
    width: 177px;
    color: #666;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.hot_news_list .no_news {
    font-size: 14px;
    padding: 15px 0 5px 0;
    text-align: center;
    color: #999;
}

/* 热门问题 */
.hot-issues,
.answer-rank {
    width: 100%;
    margin-bottom: 30px;
    padding: 0 15px 0;
    background-color: #fff;
}

.hot-issues .title,
.answer-rank .title {
    font-size: 18px;
    padding: 20px 0 15px;
    text-align: center;
    color: #333;
    border-bottom: 1px solid #ededed;
    margin-top: 30px;
}

.hot-issues-list {
    font-size: 14px;
    padding-bottom: 1px;
}

.hot-issues-list>.hot-title {
    counter-increment: HotIndex;
    display: flex;
    flex-direction: row;
}

.hot-issues-list>.hot-title::before {
    content: counter(HotIndex);
    display: flex;
    width: 20px;
    height: 20px;
    background-color: #ccc;
    text-align: center;
    border-radius: 4px;
    flex: none;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.hot-issues-list>.hot-title.top3::before {
    background-color: #59b6d7;
    color: #fff;
}

.hot-issues-list>.hot-title>a {
    display: block;
    word-break: break-word;
    flex: auto;
    margin-left: 8px;
}

.answer-rank-list {
    font-size: 14px;
    overflow: hidden;
}

.answer-rank-list>li {
    display: table;
    margin: 30px 0px;
}

.answer-rank-list .rank-num {
    display: table-cell;
    width: 30px;
}

.answer-rank-list .rank-avatar,
.answer-rank-list .rank-info {
    display: table-cell;
    vertical-align: middle;
}

.answer-rank-list .rank-num>span {
    font-size: 12px;
    line-height: 16px;
    display: block;
    width: 16px;
    height: 16px;
    text-align: center;
    color: #fff;
    border-radius: 3px;
}

.answer-rank-list .rank-num .blue {
    background: #59b6d7;
}

.answer-rank-list .rank-num .grey {
    background: #ccc;
}

.no-data {
    text-align: center;
    padding: 15px 0;
    color: #777;
}

/* end 热门问题 */
/* 问答达人排行榜 */
.answer-rank .rank-tab {
    font-size: 14px;
    height: 42px;
    line-height: 42px;
    display: table;
    width: 100%;
}

.answer-rank .rank-tab span {
    display: table-cell;
    text-align: center;
    border-bottom: 1px solid #EDEDED;
    cursor: pointer;
    color: #777;
}

.answer-rank .rank-tab span.active {
    color: #333;
    border-bottom: 2px solid #59B6D7;
}

.answer-rank-list .rank-num {
    vertical-align: middle;
}

.answer-rank-list .rank-avatar {
    width: 75px;
    position: relative;
}

.answer-rank-list .rank-avatar>img.role-icon {
    position: absolute;
    left: 40px;
    bottom: 4px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
}

.answer-rank-list .rank-info>span {
    width: 100%;
    display: inline-block;
    padding-bottom: 7px;
}

/* end 问答达人排行榜 */
/*缺省图*/
.no_data_div {
    display: table;
    background: white;
    width: 100%;
}

.no_data {
    display: table-cell;
    width: 100%;
    height: 500px;
    text-align: center;
    vertical-align: middle;
}
.no_data_w {
    display: table-cell;
    width: 100%;
    height: 240px;
    text-align: center;
    vertical-align: middle;
}

.no_data_w p,
.no_data p {
    font-size: 14px;
    margin: 10px 0;
    color: #B2B2B2;
}

/*评论*/
.dy_comit .del_comment,
.dy_cen .J-reply-comment,
.comment_right .del_comment,
.comment_right .J-reply-comment {
    font-size: 12px;
    margin-left: 15px;
    cursor: pointer;
    color: #59b6d7;
}

/*分享*/
.detail_third_share {
    font-size: 14px;
    float: right;
    margin-top: 14px;
    color: #666;
}

.detail_third_share svg {
    margin-bottom: 4px;
}

.detail_third_share span a {
    border: none !important;
}

.third_share {
    font-size: 1.8em;
}

.third_share_weibo {
    fill: #f97d72
}

.third_share_qq {
    fill: #5fbddf;
}

.third_share_weixin {
    fill: #54c58c;
}

.weixin_qrcode {
    display: none;
    padding: 40px;
}

/*图片裁剪*/
.avatar-container {
    margin: 20px;
}

.avatar-upload {
    margin: 10px 0;
}

.avatar-save {
    font-size: 14px;
    padding: 2px 8px;
}

.save-btn {
    text-align: right;
}

.save-btn>span {
    margin-right: 20px;
    color: #ccc;
    font-size: 12px;
}

.avatar-wrapper {
    overflow: hidden;
    width: 100%;
    height: 230px;
    margin: 15px auto;
    background-color: #fcfcfc;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .25);
}
.cover-wrapper {
    overflow: hidden;
    width: 100%;
    height:330px;
    margin: 15px auto;
    background-color: #fcfcfc;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .25);
}

.avatar-preview {
    float: left;
    overflow: hidden;
    margin-top: 15px;
    margin-right: 15px;
    border: 1px solid #eee;
    border-radius: 4px;
    background-color: #fff;
}

.avatar-upload .avatar-input {
    display: none;
}

.formitm .video-input {
    display: none;
}

.avatar-upload label.avatar-file {
    display: inline-block;
    padding: 0 16px;
    margin-top: -10px;
    border-radius: 3px;
    background-color: #efefef;
    font-size: 14px;
    line-height: 32px;
    text-align: center;
    cursor: pointer;
    border: 1px solid #ccc;
}

.avatar-upload label.avatar-file:hover {
    background-color: #ddd;
}

.ai_face_box {
    /* display: inline-block; */
    width: 160px;
    height: 80px;
    background: #f5f5f5;
    border: 1px solid #e4e4e4;
    border-radius: 3px;
    position: relative;
    float: left;
}

.ai_face_box::after {
    content: '';
    width: 35px;
    height: 35px;
    background: url(img/upload.svg) no-repeat 100%;
    position: absolute;
    left: calc(50% - 17px);
    top: 20px;
}

.ai_face_box>img {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.ai_face_box.ai_video_box::after {
    display: none;
}

.progress-container {
    width: 100%;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    position: absolute;
    top: 81px;
    left: 0;
}

.progress-bar {
    height: 100%;
    width: 0%;
    background-color: var(--primary-color);
    transition: width 0.2s ease;
}

.ai_video_box i.icon-close {
    position: absolute;
    top: -5px;
    right: -4px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    border: 1px solid #bbb;
    border-radius: 50%;
    background-image: url(../images/close_remove.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px;
}

.ai_upload {
    position: absolute;
    top: 0;
}

.ai_upload input {
    position: absolute;
    width: 230px;
    height: 163px;
    cursor: pointer;
    opacity: 0;
}

/* Override Cropper's styles */
.upload-box .cropper-face,
.upload-box .cropper-view-box {
    border-radius: 50%;
}

/*签到*/
.checkin_cont {
    margin-bottom: 30px;
}

.checkin_user {
    position: relative;
    width: 100%;
    height: 100px;
    border-radius: 3px;
    background: #fff;
}

.checkin_user span {
    display: inline-block;
    margin: 30px 0 0 20px;
    color: #f87d72;
    width: 94px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.checkin_user .avatar {
    position: absolute;
    top: -10px;
    right: 10px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.checkin_user .role-icon {
    width: 28px;
    position: absolute;
    right: 5px;
    top: 72px;
}

.checkin_div {
    font-size: 20px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
    color: #fff;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    background: #f87d72;
}

.checked_div {
    background: grey;
}

.checkin_div span {
    font-size: 14px;
    display: inline-block;
    margin-left: 5px;
}

.checkin_div svg {
    font-size: 23px;
    margin-right: 5px;
    vertical-align: text-bottom;
}

.loading {
    font-size: 14px;
    /*padding:0 0 10px 0;*/
    text-align: center;
    color: #999;
    padding: 10px 0;
}

.click_loading {
    line-height: 40px;
    height: 40px;
    margin-top: 10px;
    text-align: center;
}

.click_loading span {
    color: var(--primary-color);
    position: relative;
    display: block;
    cursor: pointer;
}

.click_loading svg {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: var(--primary-color);
}

img.load {
    width: 50px;
}

@-webkit-keyframes icon-load {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes icon-load {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/*  模拟 select */
.zy_select {
    display: inline-block;
    position: relative;
    white-space: normal;
    cursor: pointer;
    text-align: center;
}

.zy_select a {
    color: inherit;
    cursor: pointer;
}

.zy_select>i {
    overflow: hidden;
    float: right;
    position: relative;
    display: block;
    margin-top: 4px;
    margin-left: 4px;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    transform-origin: center;
    transition: all .2s;
}

.zy_select>i::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-top-color: #000;
    transform: translate(-50%, -25%);
    content: "";
}

.zy_select span {
    text-align: left;
}

.zy_select>ul {
    display: none;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 5;
    margin: 0;
    padding: 0;
    width: calc(100% + 2px);
    background: #fff;
}

.zy_select>ul>li {
    overflow: hidden;
    display: block;
    margin-bottom: 1px;
    padding: 5px;
    width: 100%;
    min-height: 20px;
    text-overflow: ellipsis;
    cursor: pointer;
}

.zy_select>ul>li.active,
.zy_select>ul>li:hover {
    background-color: #dfdfdf;
    color: #fff;
}

.zy_select.gap12>ul {
    left: 50%;
    margin-top: 12px;
    padding: 15px 0 5px;
    min-width: 115px;
    border-radius: 2px;
    box-shadow: 0 0 9px 0 rgba(0, 0, 0, .1);
    transform: translateX(-50%);
}

.zy_select.gap12>ul li {
    background: none !important;
    padding: 5px;
    margin-bottom: 10px;
}

.zy_select.gap12>ul li.active,
.zy_select.gap12>ul li:hover {
    color: #59b6d7;
}

.zy_select.border {
    padding: 5px;
    border: 1px solid #dfdfdf;
}

.zy_select.border>ul {
    left: -1px;
    border: 1px solid #dfdfdf;
    transform: none;
}

.zy_select.open>span {
    color: #59b6d7;
}

.zy_select.open>i {
    transform: rotate(180deg);
}

.zy_select.open>ul {
    display: block;
}

.select-gray span {
    color: #999;
}

.select-gray>i:after {
    border-top-color: #999;
}

/*收入达人排行榜*/
.income-rank {
    width: 100%;
    margin-bottom: 30px;
    padding: 0 15px 0;
    border: 1px solid #ededed;
    background-color: #fff;
}

.income-rank .title {
    font-size: 16px;
    padding: 20px 0 15px;
    text-align: center;
    color: #333;
    border-bottom: 1px solid #ededed;
}

.income-rank .income-list {
    overflow: hidden;
    padding: 15px 0;
    font-size: 14px;
}

.income-rank .income-list li {
    display: flex;
    margin-bottom: 20px;
    align-items: center;
}

.income-rank .fans-span {
    display: block;
    margin-right: 15px;
    width: 16px;
    height: 16px;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    border-radius: 3px;
    background: #ccc;
}

.income-rank li:nth-child(1) .fans-span,
.income-rank li:nth-child(2) .fans-span,
.income-rank li:nth-child(3) .fans-span {
    background: #59b6d7;
}

.income-rank .income-avatar {
    overflow: hidden;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #f4f5f5;
    flex: 0 0 auto;
    cursor: pointer;
}

.income-rank .income-avatar>img {
    display: block;
}

.income-rank .income-name {
    display: flex;
    margin-left: 15px;
    height: 60px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-around;
    flex: 1 1 auto;
}

.income-rank .income-name .name {
    color: #333;
}

.income-rank .answers-count {
    color: #999;
}

/*广告位*/
.news_ad img {
    margin-bottom: 10px;
}

/*积分规则*/
.w_815 {
    width: 815px;
    margin: auto;
}

.int_top {
    width: 100%;
    height: 160px;
    margin: 40px auto 30px;
    background: #fff;
}

.intTop_left {
    float: left;
    width: 4px;
    height: 160px;
    border-radius: 3px;
    background: #fbbeb9;
}

.intTop_num {
    font-size: 42px;
    float: left;
    margin: 48px auto 18px 68px;
    color: #333;
}

.int_this {
    font-size: 14px;
    display: block;
    color: #999;
}

.int_sign {
    font-size: 18px;
    line-height: 40px;
    float: right;
    width: 153px;
    height: 40px;
    margin-top: 60px;
    margin-right: 70px;
    cursor: pointer;
    text-align: center;
    color: #fff;
    border-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    background: #f87d72;
}

.int_cont {
    width: 815px;
    padding: 0 70px 50px;
    background: #fff;
}

.int_rule {
    margin-top: 18px;
    border-bottom: 1px solid #ededed;
}

.int_li {
    margin-right: 40px;
    margin-left: 30px !important;
}

.int_li2 {
    margin: 0 !important;
}

.int_pm {
    line-height: 60px !important;
    height: 60px !important;
    padding-right: 30px;
    padding-left: 30px;
}

.int_operation {
    width: 290px !important;
}

.int_pm span {
    color: #666 !important;
}

.operation_ul {
    font-size: 14px;
    padding-top: 10px;
    padding-left: 30px;
}

.list_div {
    font-size: 14px;
}

.c_f8 {
    color: #f87e73 !important;
}

.list_div1 {
    width: 290px;
}

.list_div2 {
    color: #59b6d7;
}

.list_div3 {
    float: right;
    padding-right: 30px;
}

.operation_ul li {
    margin-bottom: 36px;
}

.operation_ul li:last-child {
    margin-bottom: 10px;
}

.int_page {
    margin: 30px auto 0;
    text-align: center;
}

.div_right {
    float: right;
    margin-right: 30px;
}

.int_b {
    margin-bottom: 50px;
}

.sign_img {
    width: 16px;
    margin-right: 10px;
    vertical-align: -2px;
}

.dy_center .top-menu-left {
    position: relative;
    height: 60px;
}

/* btn style reference bootstrap */
.btn {
    display: inline-block;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
}

.btn-comment {
    width: 68px;
    height: 34px;
    line-height: 32px;
    text-align: center;
    opacity: 1;
    border-radius: 30px;
    display: inline-block;
    border: 1px solid transparent;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    padding: 0;
}

.btn-lg {
    padding: 8px 22px;
    font-size: 16px;
    line-height: 1.3;
    border-radius: 3px;
}

.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-primary {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-warning {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.bt1ed {
    border-bottom: 1px solid #EDEDED;
}

.btn-cancel {
    color: #333333;
    background-color: #d4d4d4;
    border-color: #d4d4d4;
}

/*发帖按钮*/
.btn-release {
    display: inline-block;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 0;
    width: 87px;
    height: 40px;
    background: rgba(216, 9, 53, 1);
    border-radius: 3px;
    color: #fff;
    background-color: #ff6661;
    border-color: #ff6661;
}

.btn-default {
    color: #333333;
    background-color: #ffffff;
    border: 1px solid rgba(239, 239, 239, 1);
    display: inline-block;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    width: 87px;
    border-radius: 20px;
    height: 40px;
}

.btn-grey {
    color: #b2b2b2;
    background: #f5f5f5;
    border: 1px solid #e4e4e4;
    display: inline-block;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    width: 87px;
    border-radius: 20px;
    height: 40px;
}


/*分享列表评论*/
.comment_line {
    margin-top: 18px;
    border-top: 1px solid #efefef;
    margin-bottom: 20px;
    height: 1px;
    position: relative;
}

.comment_line>.tr2 {
    width: 10px;
    height: 10px;
    position: absolute;
    top: -15px;
    left: 98px;
}

.comment_line>.tr2:before,
.comment_line>.tr2:after {
    content: '';
    display: block;
    position: absolute;
    border: 8px solid transparent;
    left: 0;
}

.comment_line>.tr2:before {
    border-bottom: 7px solid #efefef;
    top: -1px;
}

.comment_line>.tr2:after {
    border-bottom: 7px solid #fff;
}

.comment_body {
    font-size: 12px;
    color: #999;
}

.comment_textarea {
    margin: 10px 0 10px;
}

/* .comment_textarea .input-wrap textarea {width:100%;height:78px;padding:12px;border:1px solid #ededed;background:#f3f6f7;color:#333;outline:none;resize:none;overflow:hidden;} */
.comment_post {
    line-height: 31px;
    height: 37px;
    position: relative;
}

.comment_post .dy_cs {
    position: absolute;
    right: 5px;
    top: -40px;
}

.comment_post .post_button {
    line-height: 32px;
    float: right;
    width: 85px;
    height: 32px;
    text-align: center;
    color: #fff;
    border: 0;
    cursor: pointer;
    border-radius: 3px;
    background: #59b6d7;
}

.comment_post_nums {
    font-size: 12px;
    margin-left: 385px;
}

/* 评论 */
.no-comments {
    width: 100%;
    height: 50px;
    background: rgba(255, 255, 255, 1);
    opacity: 1;
    border-radius: 3px;
    line-height: 50px;
    text-align: center;
    font-size: 14px;
    color: var(--primary-font-color);
}

.comment_box {
    margin-bottom: 16px;
    padding: 30px 40px;
    background: white;
}

.comment_box .comment_con {
    word-break: break-all;
    margin-bottom: 16px;
}

.comment_box .comment_con a {
    color: #59b6d7;
}

.comment_box .comment_con a.mouse {
    cursor: pointer;
    display: none;
    margin-left: 5px;
}

/*详情评论*/
.comment_title {
    margin-top: 40px;
    margin-bottom: 20px;
}

.comment_count {
    font-size: 22px;
    color: #59b6d7;
}

.comment_box .input-wrap {
    position: relative;
}

.comment_box .input-wrap .comment_editor {
    font-size: 14px;
    width: 100%;
    min-height: 77px;
    padding: 10px;
    resize: none;
    color: #666;
    border: 1px solid #ededed;
    outline: none;
    background: #f3f6f7;
    z-index: 102;
}

.comment_box .input-wrap .mirror {
    position: absolute;
    top: 0;
    display: none;
}

.comment_box .input-wrap .ev-mention-list {
    position: absolute;
    background-color: #fff;
    z-index: 105;
    display: none;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 2px;
    box-shadow: 0 2px 8px 1px rgba(0, 0, 9, .2);
}

.comment_box .input-wrap .ev-mention-list .list-content,
.comment_box .input-wrap .ev-mention-list .list-title {
    font-size: 12px;
    cursor: pointer;
    list-style: none;
}

.comment_box .input-wrap .ev-mention-list .list-content.active {
    color: #59b6d7;
    background-color: #fff;
}

.comment_box .comment_tool {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.comment_box .comment_tool .comment_at {
    position: relative;
    cursor: pointer;
}

.comment_box .mention-btn {
    position: relative;
    display: inline-block;
    cursor: pointer;
}


.comment_box #at-search-box {
    position: absolute;
    width: 250px;
    border: 1px solid #ddd;
    background: #fff;
    z-index: 9999;
    padding: 10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    font-size: 12px;
}

.comment_box #at-search-box input {
    width: 100%;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.comment_box #at-search-results {
    margin-top: 5px;
    max-height: 200px;
    overflow-y: auto;
    color: #999;
}

.comment_box .at-result-item {
    padding: 5px;
    cursor: pointer;
    color: #333;
}

.comment_box .at-result-item:hover {
    background: #f5f5f5;
}

.comment_box .no-result {
    padding: 10px;
    text-align: center;
    color: #999;
}





.comment_list .comment_item .left-avatar .forum-userreply-box-title {
    display: flex;
    flex-direction: column;
}

.comment_list .comment_item dt.left-avatar {
    width: 40px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.comment_list .comment_item .left-avatar .forum-userreply-box-title a {
    font-size: 14px;
    flex-shrink: 0;
    margin-bottom: 4px;
    text-align: center;
}

.comment_list .comment_item .left-avatar .forum-userreply-box-title a span {
    display: block;
}

.comment_list .comment_item .left-avatar .forum-userreply-box-title a span.reply_realname {
    font-size: 12px;
}

.comment_list .comment_item .reply_body {
    margin: 12px 0;
}

.comment_list .comment_item .reply_body p {
    margin: 0;
}

.comment_list .comment_item dd {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.forum-userreply-box {
    width: 650px;
    height: auto;
}

.forum-userreply-box-title {
    color: #333;
    margin-top: 10px;
}

.reply_time_r {
    float: right;
    font-size: 12px;
    color: #999999;
}

/*子级回复*/
.child-comment-box {
    font-size: 12px;
    color: #666666;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #ededed;
}

.child-comment-box .comment_item:last-of-type {
    border-bottom: none;
    padding-bottom: 0;
}

.more-comment {
    cursor: pointer;
    color: var(--primary-color) !important;
    display: block;
    margin-left: 60px;
    padding-top: 20px;
    padding-bottom: 20px;
    border-top: 1px solid #ededed;
}

.more-comment:hover {
    color: var(--primary-color) !important;
}


.dialog-mention-select {
    position: absolute;
    display: flex;
    left: 0;
    top: 100%;
    width: 239px;
    min-height: 300px;
    z-index: 10;
    background-color: #fff;
    box-shadow: 0px 2px 9px 0px rgba(22, 23, 23, 0.09);
    flex-direction: column;
    cursor: default;
}

.repostable-mention .dialog-mention-select {
    top: auto;
    bottom: 60px;
}

.dialog-mention-select .search-wrap {
    border-bottom: 1px solid #E4E4E4;
    font-size: 12px;
}

.dialog-mention-select .search-wrap input {
    border: none;
    line-height: 37px;
}

.dialog-mention-select .hot {
    color: #ccc;
    margin-top: 20px;
    cursor: default;
}

.dialog-mention-select .follow-users {
    display: flex;
    flex-flow: row wrap;
}

.dialog-mention-select .follow-users>li {
    display: inline-block;
    width: 100%;
    cursor: pointer;
    padding: 0 15px;
}

.dialog-topic-select {
    position: absolute;
    display: flex;
    left: 0;
    top: 100%;
    width: 400px;
    height: 300px;
    z-index: 10;
    padding: 20px 40px;
    background-color: #fff;
    box-shadow: 0px 2px 9px 0px rgba(22, 23, 23, 0.09);
    flex-direction: column;
    cursor: default;
}

.repostable-topic .dialog-topic-select {
    top: auto;
    bottom: 60px;
}

.dialog-topic-select .search-wrap,
.dialog-mention-select .search-wrap {
    border-bottom: 1px solid #E4E4E4;
    font-size: 12px;
    width: 210px;
    margin-left: 15px;
    display: inline-block;
}

.dialog-topic-select .search-wrap input,
.dialog-mention-select .search-wrap input {
    border: none;
    height: 35px;
}

.dialog-topic-select .hot,
.dialog-mention-select .hot {
    color: #ccc !important;
    margin-top: 20px;
    cursor: default !important;
}

.dialog-topic-select .topic-list,
.dialog-mention-select .follow-users {
    display: flex;
    flex-flow: row wrap;
}

.dialog-topic-select .topic-list>li,
.dialog-mention-select .follow-users>li {
    display: inline-block;
    width: 100%;
    cursor: pointer;
    line-height: 37px;
    padding: 0 15px;
}

.dialog-mention-select .follow-users>li:hover {
    background: rgba(245, 245, 245, 1);
}

/* 小标签 */
.selected-topics {
    display: flex;
    flex-flow: row wrap;
    margin-top: 10px;
}

.selected-topics .selected-topic-item {
    background-color: rgba(89, 182, 215, 0.15);
    padding: 0 6px;
    border-radius: 3px;
    color: #59b6d7;
    font-size: 12px;
    margin-right: 6px;
    margin-bottom: 6px;
    height: 24px;
    line-height: 24px;
}

.selected-topics .selected-topic-item .close {
    height: 24px;
    line-height: 24px;
    cursor: pointer;
}

.selected-topics .selected-topic-item svg {
    transform: scale(0.7);
}

.comment_buttons {
    float: left;
}

.comment_tool .text_stats {
    margin-right: 20px;
    font-size: 14px;
    color: #777;
}

.comment-list-box {
    padding: 30px 40px;
    background: white;
}

.comment-list-box .comment-hint {
    font-size: 20px;
    font-weight: 400;
    color: rgba(26, 26, 26, 1);
    margin-top: 0;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    justify-content: space-between;
}

.comment-list-box .comment-hint .hide-btn {
    font-size: 14px;
    color: var(--primary-font-color);
    display: inline-flex;
}

.comment-list-box .comment-hint .hide-btn>a {
    margin-left: 4px;
    transition: 1s;
}

.comment_list {}

.comment_list .comment_item {
    border-bottom: 1px solid #dddddd;
    padding: 14px 0;
}

.comment_list .comment_item:first-child {
    padding-top: 0;
}

.comment_list .comment_item dt {
    float: left;
    position: relative;
}

.comment_list .comment_item dt .forum-userreply-img {
    border-radius: 50%;
}

.comment_list .comment_item dt img.role-icon {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 20px;
    height: 20px;
}

.comment_list .comment_item dd {
    font-size: 14px;
    margin-left: 20px;
    float: left;
    color: #333;
    width: 100%;
}

.comment_list .comment_item .relative > .act {
    position: absolute;
    right: 32px;
    width: 72px;
    height: 26px;
    line-height: 24px;
    border: 1px solid;
    text-align: center;
    border-radius: 2px;
    font-size: 12px;
}
.comment_list .comment_item .relative > .act.reject {
    border-color: #e60012;
    color: #e60012;
}

.comment_list .comment_item .reply_tool {
    margin: 8px 0;
    position: relative;
}

.comment_list .comment_item .reply_time {
    font-size: 12px;
    color: #ccc;
}

.comment_list .comment_item .reply_time .comment-hide {
    height: 12px;
    margin-top: -2px;
}

.reply_tool .reply_action {
    float: right;
    cursor: pointer;
}

.reply_body {
    word-break: break-all;
    margin: 8px 0;
}

.reply_body>img {
    margin-top: 20px;
}

.reply_body img {
    max-width: 350px;
    max-height: 250px;
    object-fit: cover;
    cursor: pointer;

}

.reply_body a {
    color: #5186EB;
}

.reply_body a.mouse {
    display: none;
}

.a_link:hover {
    text-decoration: none;
    color: #fff !important;
}

/*更多操作*/
.options {
    float: right;
    width: 30px;
    cursor: pointer;
    text-align: right;
    margin-left: 30px;
}

.icon-more {
    cursor: pointer;
    color: var(--primary-font-color);
    width: 1.2em;
    height: 1.2em;
}

.options_div {
    position: absolute;
    z-index: 99;
    top: 30px;
    right: -50px;
    display: none;
    width: 125px;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 1px 22px #e2e0e0;
}

.options_div .triangle {
    margin-top: -8px;
    margin-left: 55px;
}

.options_div_u .triangle {
    margin-top: -8px;
    margin-left: 29px !important;
}

.options_div ul {
    padding: 20px 0;
}

.options_div ul li {
    padding-left: 20px;
    margin-bottom: 15px;
}

.options_div ul li:last-child {
    margin-bottom: 0;
}

.options_div ul li a {
    font-size: 14px;
    color: #666;
}

.options_div ul li a:hover {
    color: var(--primary-color);
}

.options_div .icon {
    margin-right: 5px;
    vertical-align: text-top;
    margin-top: -2px;
}

.options_div .act {
    color: #e60012;
}

.triangle {
    margin-top: -8px;
    margin-left: 55px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
}

/*layer样式*/
.confirm_body {
    text-align: center;
    color: #999;
}

.confirm_title {
    font-size: 20px;
    font-weight: 500;
    text-align: center;
}

.confirm_statement_body {
    width: 500px;
}

.confirm_statement_title {
    color: #000000;
    font-size: 20px;
    font-weight: 500;
    text-align: center;
}

.confirm_statement_text {
    font-size: 14px;
    text-indent: 30px;
    text-align: left;
    text-align: justify;
}

.reward_box {
    padding: 0 20px;
}

.confirm_money {
    font-size: 22px;
    color: #F4504D;
    line-height: 30px;
    padding: 20px 0px 10px 0px;
    text-align: center;
}

.confirm_text {
    width: 240px;
    text-align: center;
}

.layui-layer-btn- {
    font-size: 14px;
    padding: 0px 0px 30px 0px !important;
}

.layui-layer-btn- .layui-layer-btn-notice {
    width: 102px;
    height: 38px;
    line-height: 38px;
    background: var(--primary-color);
    border-radius: 20px;
    color: #fff;
}

.muted_noti {
    width: 240px;
    text-align: center;
    color: #000000;
    padding: 20px 0 10px;
}

/*  申请置顶 */
.apply-pinneds .day,
.apply-pinneds .amount {
    padding: 5px 10px;
    border-radius: 2px;
    border: 1px solid #ccc;
    width: 100%;
}

/*消息select*/
.zy_select.message_select {}

.zy_select.message_select>i {
    margin-top: 16px;
}

.zy_select.message_select>ul {
    margin-top: 5px;
}

.zy_select.message_select>ul>li {
    margin: 0;
    white-space: nowrap;
}

/*  列表头像 */
.avatar_box {
    position: relative;
    display: inline-block;
}

.avatar_box .avatar {
    width: 26px;
    height: 26px;
    border-radius: 50%;
}

.avatar_box .role-icon {
    position: absolute;
    right: 0;
    bottom: -5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
}

/*置顶弹窗*/
.pinned_box .pinned_text {
    font-size: 12px;
    margin-bottom: 10px;
    color: #ccc;
}

.pinned_box .pinned_spans {
    margin-bottom: 10px;
}

.pinned_box .pinned_spans span {
    cursor: pointer;
    display: inline-block;
    width: 80px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    color: #333;
    height: 28px;
    line-height: 28px;
    margin-right: 10px;
    text-align: center;
    border-radius: 5px;
}

.pinned_box .pinned_spans span.current {
    color: #59b6d7;
    border: 1px solid #59b6d7;
}

.pinned_box .pinned_input {
    margin-bottom: 20px;
}

.pinned_box .pinned_input input {
    outline: none;
    text-indent: 10px;
    background-color: transparent;
    height: 28px;
    line-height: 28px;
    color: #333;
    border: 1px solid #ccc;
    border-radius: 5px;
    vertical-align: bottom;
    width: 260px;
}

.pinned_box .pinned_total {
    font-size: 20px;
    color: #59b6d7;
}

/*打赏*/
.reward_cont {
    margin-top: 40px;
    text-align: center;
}

.reward_cont .reward_user {
    width: 75%;
    margin: 0 auto;
    overflow: hidden;
}

.reward_cont .user_item {
    position: relative;
    display: inline-block;
    margin-right: 5px;
}

.reward_cont .user_item .verified_icon {
    width: 19px;
    position: absolute;
    bottom: 0px;
    right: -1px;
}

.reward_cont .more_user {
    position: relative;
    display: inline-block;
    cursor: pointer;
    width: 1px;
    height: 12px;
}

.reward_cont .more_user:after,
.reward_cont .more_user:before {
    border: 10px solid transparent;
    border-left: 10px solid #fff;
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    right: -18px;
    content: ' '
}

.reward_cont .more_user:before {
    border-left-color: #777;
    right: -19px;
}

.reward_box .reward_text {
    font-size: 12px;
    margin-bottom: 10px;
    color: #ccc;
}

.reward_box .reward_spans {
    margin-bottom: 16px;
}

.reward_box .reward_spans span {
    cursor: pointer;
    display: inline-block;
    width: 72px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    color: #333;
    height: 38px;
    line-height: 38px;
    margin-right: 10px;
    text-align: center;
    border-radius: 5px;
}

.reward_box .reward_spans span.current {
    color: #D80935;
    border: 1px solid #D80935;
}

.reward_box .reward_input {
    margin-bottom: 20px;
}

.reward_box .reward_input input {
    outline: none;
    text-indent: 10px;
    background-color: transparent;
    height: 38px;
    line-height: 38px;
    color: #333;
    border: 1px solid #ccc;
    border-radius: 5px;
    vertical-align: bottom;
    width: 260px;
}

.reward_box .reward_input .nn-notice {
    font-size: 12px;
    font-weight: 400;
    color: #999999;
}

.reward_box .reward_total {
    font-size: 20px;
    color: #59b6d7;
}

.reward_box .reward_amount {
    color: #59b6d7;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 10px;
    font-size: 16px;
}

.reward_box .reward_input_wrap {
    height: 36px;
}

.reward_box .reward_input_wrap input[type="password"] {
    border: 1px solid #ccc;
    height: 100%;
    border-radius: 4px 0 0 4px;
    padding-left: 6px;
    width: calc(100% - 4em);
}

.reward_box .reward_input_wrap button {
    background-color: #59b6d7;
    color: #fff;
    width: 4em;
    height: 100%;
    border-radius: 0 4px 4px 0;
    border: 1px solid #59b6d7;
}

/* .reward_box .reward_input_wrap input[type="password"]:valid + button {background-color: #59b6d7;} */
.reward_box .reward_forgot {
    color: #59b6d7;
    text-align: right;
    font-size: 12px;
    margin-top: 10px;
}

.reward_popups {
    width: 340px;
    overflow: hidden;
    min-height: 500px;
}

.reward_popups_con {
    width: 360px;
    height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0px 40px;
}

.reward_popups .reward_title {
    font-size: 18px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 20px 40px 0px 40px;
}

.reward_popups .reward_list {
    line-height: 60px;
    font-size: 14px;
}

.reward_popups .reward_list .uname {
    color: #444;
    margin: 0 10px;
}

.reward_list .u-avatar {
    position: relative;
    display: inline-block;
}

.reward_list .role-icon {
    width: 19px;
    position: absolute;
    bottom: 5px;
    right: 0;
}

.reward_popups .reward_sum .opt {
    cursor: pointer;
    display: inline-block;
    padding: 5px 15px;
    margin-right: 20px;
    border: 1px solid #CCC;
    border-radius: 2px;
    background-color: white;
}

.reward_popups .reward_sum .active {
    color: #59b6d7;
    border-color: #59b6d7;
}

.reward_popups .reward_sum .opt:last-child {
    margin-right: 0;
}

.reward_popups .custom_sum {
    padding: 5px 10px;
    border-radius: 2px;
    border: 1px solid #ccc;
    width: 100%;
}

.reward_popups .reward_btn_box {
    margin-top: 40px;
}

/*成功页面*/
.success {
    width: 700px;
    padding: 40px;
    background-color: #fff;
    margin: auto;
    text-align: center;
    height: 520px;
    position: relative;
}

.success>img {
    width: 200px;
    margin-top: 60px;
}

.success .content {
    position: absolute;
    left: 0;
    bottom: 70px;
    width: 100%;
}

.success .success-message {
    width: 100%;
    height: 40px;
    font-size: 20px;
    color: #474747;
}

.success .success-content {
    color: #9F9F9F;
}

.success .success-button {
    width: 70px;
    height: 35px;
    line-height: 35px;
    background-color: #EDEDED;
    display: block;
    margin: 30px auto;
    border-radius: 3px;
    border: 1px solid #d9d9d9;
}

.fuzzy {
    box-shadow: 0 0 10px 4px white;
    text-shadow: 0 0 10px #222;
    opacity: 0.8;
    color: rgba(220, 220, 220, 0.8) !important;
    word-break: break-all;
    cursor: pointer;
}

.ads_item .body {
    width: 85%;
    line-height: 60px;
}

.ads_item .tag {
    color: #777;
    padding: 3px 6px;
    font-size: 12px;
    border-radius: 2px;
    border: 1px solid #ededed;
}

/* 评论置顶标识 */
.green {
    color: #4CB994;
}

.comment-top-span {
    float: right;
    color: #4CB994;
}

.mt-3 {
    margin-top: -3px;
}

.ly-error {
    color: red;
    margin-left: 20px;
    font-size: 12px;
    position: absolute;
    top: 40px;
    right: 30px;
}

.ly-error2 {
    position: absolute;
    left: 40px;
    bottom: 12px;
    display: block;
    width: calc(100% - 80px);
    color: red;
    font-size: 12px;
    text-align: center;
}

/* 右侧消息 */
#ms_fixed_wrap {
    z-index: 3;
    width: 54px;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 10, 0.1);
}

#ms_fixed {
    background-color: #fff;
    width: 74px;
    height: 100%;
    z-index: 99999;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0;
    list-style: none;
}

#ms_fixed dd {
    margin: 0px;
    width: 64px;
    position: relative;
}

#ms_fixed dd.tips_current {
    background-color: #f3f6f7;
}

#ms_fixed dd svg {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin: 9px 9px;
}

#ms_fixed dd img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin: 9px 9px;
}

#ms_fixed .unread_div {
    position: absolute;
    top: 10px;
    right: 10px;
    border: 1px solid #fff;
    border-radius: 50%;
}

#ms_fixed .unread_div span {
    display: block;
    font-size: 12px;
    text-align: center;
    color: #fff;
    border-radius: 50%;
    background: #f24343;
    width: 16px;
    height: 16px;
}

#ms_chat_tips {
    z-index: 3;
    font-size: 14px;
    display: none;
    position: absolute;
    right: 68px;
    top: -1px;
    height: 36px;
    line-height: 36px;
    padding: 0 15px;
    text-align: center;
    background-color: #fff;
    color: #59b6d7;
    box-shadow: 0 1px 22px #e2e0e0;
    border-radius: 4px;
}

#ms_chat_tips .tips_triangle {
    position: absolute;
    top: 13px;
    right: -6px;
    width: 0;
    height: 0;
    border-left: 6px solid #fff;
    border-bottom: 6px solid transparent;
    border-top: 6px solid transparent;
}

/*图片展开显示*/
.PicShow {
    height: auto;
    float: left;
    border: 1px solid #d9d9d9;
    background-color: #f2f2f2;
    border-radius: 3px;
    padding: 10px 20px 10px;
    margin: 5px 0 15px;
    clear: both;
}

.PicShow ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

.PicShow li {
    float: left;
    display: inline;
    width: 80px;
    height: 80px;
    margin: 5px 0 0 5px;
    overflow: hidden;
    position: relative;
    list-style-type: none;
}

.PicShowExpand {
    color: #ccc;
    background-color: #efefef;
    padding: 0px 40px 20px;
    clear: both;
    overflow: hidden;
}

.PicShowExpand #expandCenterImg {
    clear: both;
    text-align: center;
    vertical-align: middle;
    width: 100%;
}

.PicShowExpand #expandCenterImg img {
    vertical-align: middle;
    margin: 0;
}

.PicShowExpand .ico_retract {
    background-position: -175px 0px;
    vertical-align: -2px;
}

.PicShowExpand .expand_top {
    color: #999;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    width: auto;
    margin: 0;
    line-height: 40px;
}

.PicShowExpand .expand_top a {
    text-decoration: none;
}

.PicShowExpand .expand_top a:hover {
    color: #59b6d7;
}

.PicShowExpand .expand_top .W_vline {
    margin: 0 10px;
    color: #ccc;
}

.PicShowExpand .expand_top svg {
    margin-right: 5px;
    margin-top: -2px;
}

.PicShowExpand .ico_retract {
    background-position: -175px 0px;
    vertical-align: -2px;
}

.PicShowExpand .ico_showbig {
    background-position: -175px -24px;
    vertical-align: -2px;
}

.PicShowExpand .ico_turnleft {
    background-position: -175px -50px;
    vertical-align: -2px;
}

.PicShowExpand .ico_turnright {
    background-position: -175px -75px;
    vertical-align: -2px;
}

.PicShowExpand .ico_collect {
    background-position: -200px -500px;
    vertical-align: -2px;
}

.PicShowExpand .pic_choose_box {
    width: 440px;
    height: 56px;
    margin-top: 15px;
}

.PicShowExpand ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    width: 8000px;
}

.PicShowExpand .arrow_left_small {
    float: left;
    display: inline-block;
    cursor: default;
    width: 12px;
    height: 50px;
    text-decoration: none;
    line-height: 50px;
    text-align: center;
    font-weight: 600;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    background-color: #b9dce6;
    padding-top: 2px;
    margin-top: 3px;
}

.PicShowExpand .arrow_left_small .ico_pic_prev {
    color: #333333;
    cursor: default;
    display: inline;
    font-family: SimSun;
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: 600;
    height: auto;
    line-height: 50px;
    margin-top: 20px;
    overflow-x: hidden;
    overflow-y: hidden;
    text-align: center;
    text-decoration: none;
    width: auto;
}

.PicShowExpand ul a {
    display: inline-block;
    opacity: 0.6;
    padding: 2px;
}

.PicShowExpand ul li {
    float: left;
    _display: inline;
    width: 58px;
    height: 58px;
    margin: 0 4px 0 0;
}

.PicShowExpand ul a {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.PicShowExpand ul a.current {
    padding: 0;
    border: 2px solid #f9b50f;
    text-decoration: none;
    opacity: 1.0;
}

.PicShowExpand ul a:hover {
    padding: 0;
    border: 2px solid #ffa306;
    text-decoration: none;
    opacity: 1.0;
}

.PicShowExpand ul img {
    max-width: none;
    border: 0
}

.PicShowExpand .arrow_right_small {
    color: #333333;
    background-color: #14a0cd;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 4px;
    border-top-left-radius: 0px;
    border-top-right-radius: 4px;
    cursor: pointer;
    display: block;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: 600;
    height: 50px;
    line-height: 50px;
    margin-top: 3px;
    text-align: center;
    text-decoration: none;
    width: 12px;
    padding-top: 2px;
}

.PicShowExpand .arrow_right_small .ico_pic_next {
    cursor: default;
    display: inline;
    font-family: SimSun;
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: 600;
    height: auto;
    line-height: 50px;
    margin-top: 20px;
    overflow-x: hidden;
    overflow-y: hidden;
    text-align: center;
    width: auto;
}

.PicShowExpand .stage_box {
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 13px;
    overflow-x: hidden;
    overflow-y: hidden;
}

.PicShowExpand .big1 {
    cursor: pointer;
    background-color: #14a0cd;
}

.PicShowExpand .big2 {
    cursor: default;
    background-color: #b9dce6;
}

.PicShowExpand .text1 {
    cursor: pointer;
}

.PicShowExpand .text2 {
    cursor: default;
}

.PicShow .bigcursor {
    cursor: url("../images/big.cur"), pointer;
}

.PicShowExpand .smallcursor {
    cursor: url("../images/small.cur"), pointer;
}

.PicShowExpand .leftcursor {
    cursor: url("../images/pic_prev.cur"), pointer;
}

.PicShowExpand .rightcursor {
    cursor: url("../images/pic_next.cur"), pointer;
}

/*Markdownli样式*/
.markdown-body ol li {
    list-style: decimal;
}

.markdown-body ul li {
    list-style: disc;
}

/*举报弹窗*/
.report-ct {
    font-size: 14px;
    width: 100%;
    height: 150px;
    padding: 10px;
    resize: none;
    color: #666;
    border: 1px solid #ededed;
    outline: none;
    background: #f3f6f7;
}

/* 转发弹框 */
.repostable-wrap {
    padding: 20px;
}

.repostable-wrap blockquote {
    margin: 0;
    background-color: #f7f7f7;
    padding: 10px;
    font-size: 14px;
    line-height: 24px;
    color: #b3b3b3;
}

.repostable-wrap blockquote h3,
.repostable-wrap blockquote p strong {
    color: #333;
    margin: 0;
    font-weight: normal;
    font-size: 100%;
}

.repostable-wrap blockquote p {
    margin: 0;
}

.repostable-wrap .content {
    margin-top: 20px;
    border: 1px solid #ededed;
    background-color: #f3f6f7;
    padding: 10px;
    font-size: 14px;
    height: 100px;
    overflow: auto;
}

.repostable-wrap .content[contenteditable=true]:empty::before {
    content: attr(placeholder);
    display: block;
    color: #b3b3b3;
}

/* placeholder */
.repostable-wrap .tools {
    color: #666;
    margin-top: 20px;
    overflow: hidden;
}

.repostable-wrap .tools>span {
    margin-right: 20px;
    font-size: 14px;
    float: left;
    display: block;
    height: 36px;
    line-height: 36px;
}

.repostable-wrap .tools>button {
    float: right;
    background-color: #59b6d7;
    color: #fff;
    border: none;
    border-radius: 2px;
    width: 85px;
    height: 36px;
    cursor: pointer;
}

.repostable-wrap .icon {
    fill: #999;
}

.repostable-topic {
    cursor: pointer;
}

.repostable-mention {
    cursor: pointer;
}

.feed_repostable {
    display: block;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #f7f7f7;
    font-size: 14px;
    color: #666;
    letter-spacing: 1px;
    cursor: pointer;
    word-wrap: break-word;
    word-break: break-all;
}

.feed_repostable .post_cover {
    margin-top: 10px;
}

.feed_repostable strong {
    font-weight: bold;
}

.feed_repostable .title {
    font-weight: bold;
    margin: 0;
}

.feed_repostable .description {
    margin: 0;
}

.feed_repostable.news {
    display: flex;
}

.feed_repostable .news-left {
    width: 160px;
    height: 114px;
    flex: none;
    margin-right: 15px;
}

.feed_repostable .news-left .cover {
    width: 100%;
    height: 100%;
    background: no-repeat center / cover;
}

.feed_repostable .news-right {
    flex: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    letter-spacing: 0;
}

.feed_repostable .news-right .title {
    font-size: 16px;
}

.feed_repostable .news-right .category {
    border: 1px solid #59b6d7;
    border-radius: 3px;
    color: #59b6d7;
    font-size: 12px;
    padding: 1px 2px;
    margin-right: 10px;
}

.feed_repostable .news-right .information {
    color: #999;
    font-size: 12px;
}

.feed_repostable.group {
    padding: 10px 20px;
}

.feed_repostable .group-wrap {
    background-color: #fff;
    display: flex;
    width: 100%;
    padding: 10px 20px;
}

.feed_repostable .group-left {
    width: 100px;
    height: 100px;
    flex: none;
    margin-right: 15px;
    position: relative;
}

.feed_repostable .group-left img {
    width: 100%;
    height: 100%;
}

.feed_repostable .group-left .label {
    position: absolute;
    top: 10px;
    left: -10px;
    background-color: #64bad9;
    color: #fff;
    border-radius: 0 100px 100px 0;
    padding: 0 20px 0 15px;
}

.feed_repostable .group-left .label::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 10px solid #4a9cba;
    border-left: 10px solid transparent;
    position: absolute;
    top: 20px;
    left: 0;
}

.feed_repostable .group-right {
    flex: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    letter-spacing: 0;
}

.feed_repostable .group-right .title {
    font-size: 18px;
}

.feed_repostable .group-right .description {
    font-size: 14px;
    color: #999;
}

.feed_repostable .view-more {
    font-size: 12px;
    color: #59b6d7;
    letter-spacing: 0;
    margin-left: 10px;
}

.feed_repostable .view-more svg {
    fill: #59b6d7;
}

.layui-layer-page .layui-layer-content {
    overflow: visible !important;
}

/*转发弹框话题选择溢出部分可见*/
/* 遮罩 */
.overlayer {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
}

.qq_consult {
    position: fixed;
    left: 27px;
    bottom: 30%;
    width: 200px;
    height: 165px;
    background-color: #70c8ec;
    z-index: 2;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.qq_consult::after {
    content: '';
    display: block;
    position: absolute;
    border: 20px solid transparent;
    border-top-color: #70c8ec;
    width: 0;
    height: 0;
    top: 100%;
    left: 40px;
}

.qq_consult::before {
    content: '';
    display: block;
    position: absolute;
    top: -123px;
    left: 50%;
    margin-left: -44px;
    width: 89px;
    height: 123px;
    background: url(../images/pic_service.png) center/contain no-repeat;
}

.qq_consult>a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 146px;
    height: 44px;
    background-color: #fff;
    border-radius: 6px;
    color: #4c7aa8;
}

.qq_consult>a+a {
    margin-top: 20px;
}

.icon-liked {
    background: url('../images/mixue/zan_on.svg');
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    vertical-align: bottom;
}

.icon-like {
    background: url('../images/mixue/zan_off.svg');
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    vertical-align: bottom;
}

.icon-liked24 {
    background: url(./img/zan24_on.svg);
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    vertical-align: bottom;
}

.icon-like24 {
    background: url(./img/zan24_off.svg);
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    vertical-align: bottom;
}

.icon-like-ed {
    background: url('../images/mixue/zan_on.svg');
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    vertical-align: bottom;
}

.detail_like {
    width: 19px;
    height: 19px;
}

.home_like {
    width: 16px;
    height: 16px;
}

.act {
    color: #e60012;
    font-weight: 500;
}

.icon-collected {
    background: url(./img/collect_on.svg) no-repeat;
    background-size: 100%;
    width: 19px;
    height: 19px;
    display: inline-block;
}

.icon-collect {
    background: url(./img/collect_off.svg) no-repeat;
    background-size: 100%;
    width: 19px;
    height: 19px;
    display: inline-block;

}

.icon-comment {
    background: url(./img/comment24.svg) no-repeat;
    width: 16px;
    height: 14px;
    display: inline-block;
    background-size: cover;
    vertical-align: bottom;
    width: 19px;
    height: 17px;
}

.icon-comment-ed {
    background: url(../images/comment_on@2x.png);
    width: 19px;
    height: 17px;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    vertical-align: bottom;
}

.fs12 {
    font-size: 12px;
}

.fs14 {
    font-size: 14px;
}

.fs18 {
    font-size: 18px;
}

.fs20 {
    font-size: 20px;
}

/*用户中心下拉框图标*/
.icon_my_home,
.icon_edit_user,
.icon_edit_org,
.icon_ulock,
.icon_feedback,
.icon_edit_currency,
.icon_edit_qiehuan,
.icon_edit_mall,
.icon_quit_out {
    width: 17px;
    height: 17px;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 5px;
    margin-top: -3px;
}

.icon_my_home {
    background-image: url(./img/homepage_off.svg);
}

.icon_edit_user {
    background-image: url(./img/edit_off.svg);
}

.icon_edit_org {
    background-image: url(./img/renzheng.svg);
}

.icon_edit_currency {
    background-image: url(./img/jifenrw_off.svg);
}

.icon_edit_qiehuan {
    background-image: url(./img/qiehuanzh_off.svg);
}

.icon_edit_mall {
    background-image: url(./img/mall_off.svg);
}

.icon_ulock {
    background-image: url(./img/password_off.svg);
}

.icon_feedback {
    background-image: url(./img/feed_off.svg);
}

.icon_quit_out {
    background-image: url(./img/quit_off.svg);
}

/* .icon_quit_out:hover{background-image: url(./img/quit_on.svg);} */

.nav_menu ul li:hover a {
    color: var(--primary-color) !important;
}

.nav_menu ul li:hover .icon_my_home {
    background-image: url(./img/homepage_on.svg);
}

.nav_menu ul li:hover .icon_edit_user {
    background-image: url(./img/edit_on.svg);
}

.nav_menu ul li:hover .icon_edit_org {
    background-image: url(./img/renzheng_on.svg);
}

.nav_menu ul li:hover .icon_edit_currency {
    background-image: url(./img/jifenrw_on.svg);
}

.nav_menu ul li:hover .icon_edit_qiehuan {
    background-image: url(./img/qiehuanzh_on.svg);
}

.nav_menu ul li:hover .icon_edit_mall {
    background-image: url(./img/mall_on.svg);
}

.nav_menu ul li:hover .icon_ulock {
    background-image: url(./img/password_on.svg);
}

.nav_menu ul li:hover .icon_feedback {
    background-image: url(./img/feed_on.svg);
}

.nav_menu ul li:hover .icon_quit_out {
    background-image: url(./img/quit_on.svg);
}

/* 回复标识 */
.hint-img-box {
    position: absolute;
    right: 0;
    top: -20px;
}

/* 提示框 */
.msg-box {
    margin-top: 15px;
}

.icon-msg-scceed,
.icon-msg-error {
    width: 44px;
    height: 44px;
    display: inline-block;
    background-repeat: no-repeat;
}

.icon-msg-scceed {
    background-image: url("./img/scceed.png");
}

.icon-msg-error {
    background-image: url("./img/failure.png");
}

/* 消息图标 */
.icon_side-comment,
.icon_side-like,
.icon_side-system,
.icon_side-at,
.icon_side-qa,
.icon_side-bless,
.icon_side-join {
    width: 28px;
    height: 28px;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 5px;
    background-size: cover;
}

.icon_side-comment {
    background-image: url(./img/message_comment.svg);
}

.icon_side-like {
    background-image: url(./img/message_praise@2x.png);
}

.icon_side-system {
    background-image: url(./img/message_system.svg);
}

.icon_side-at {
    background-image: url(./img/message_@.svg);
}

.icon_side-qa {
    background-image: url(./img/message_qa.svg);
}

.icon_side-bless {
    background-image: url(./img/message_bless.svg);
}

.icon_side-join {
    background-image: url(./img/message_join.svg);
}

.news_ad {
    position: relative;
}

.ads_hint {
    width: 47px;
    height: 26px;
    background: rgba(0, 0, 0, 1);
    border: 1px solid rgba(255, 255, 255, 1);
    opacity: 0.3;
    border-radius: 3px;
    position: absolute;
    display: inline-block;
    font-size: 14px;
    color: rgba(255, 255, 255, 1);
    line-height: 26px;
    text-align: center;
    bottom: 20px;
    right: 20px;
}

.layui-layer-shade {
    background: #ffffff !important;
    z-index: 3;
}

.layui-layer-hui {
    border-radius: 6px !important;
}

/* 消息关闭按钮 */
.layui-layer-setwin .layui-layer-close2 {
    right: -7px !important;
    top: -4px !important;
    background-image: url("./img/close-m.svg") !important;
    background-position: 0 !important;
}

.icon_comment_box {
    width: 19px;
    height: 18px;
    display: inline-block;
}

.icon_browse_box {
    width: 22px;
    height: 17px;
    display: inline-block;
}

.float-r {
    float: right;
}

.corner {
    width: 0;
    /*  宽高设置为0，很重要，否则达不到效果 */
    height: 0;
    border: 3px solid rgba(153, 153, 153, 1);
    ;
    border-bottom-color: transparent;
    /* 设置透明背景色 */
    border-left-color: transparent;
    border-right-color: transparent;
    display: inline-block;
}

/* 第一次登陆，指引遮罩 */
.guide-hint {
    background: #000000;
    background: rgba(0, 0, 0, .7);
    width: 100%;
    height: 100%;
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    z-index: 999;
    transition: all 0.3s ease 0s;
    animation-duration: 0.3s;
}

.guide-hint .guide-hint-right {
    float: right;
    text-align: center;
    margin-top: 20px;
}

.guide-hint .guide-hint-right .frame {
    width: 52px;
    height: 39px;
    background: rgb(255, 255, 255);
    border-radius: 2px;
    margin-left: 120px;
    margin-top: 5px;
    margin-right: 12px;
    opacity: 0.7;
}

.guide-hint .guide-hint-right .frame>span {
    margin: 0;
    display: inline-block;
}

.guide-hint .guide-hint-right .guide-img {
    display: block;
    width: 104px;
    height: 78px;
    margin-left: 50px;

}

.guide-hint .guide-hint-right .font {
    height: 24px;
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
    display: block;
    margin: 24px 0;
    color: rgb(255, 255, 255);
}

.guide-hint .guide-hint-right .btn-know {
    width: 80px;
    height: 36px;
    background: rgb(255, 255, 255);
    border-radius: 4px;
    line-height: 36px;
    color: var(--primary-color);
    text-align: center;
    cursor: pointer;
    border: none;
    font-size: 14px;
    font-family: MicrosoftYaHei;
}

.guide-hint .guide-top {
    margin: 0 auto;
    min-height: 237px;
}

.role-icon-big {
    width: 24px;
    height: 24px;
}

/*  logo*/
.nav_head_logo {
    width: 1200px;
    height: 86px;
    background: #ffffff;
    opacity: 1;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/*提示修改资料样式*/
.edit-user-info {

    text-align: center;

}

.convention-confirm.disabled {
    background-color: #ccc;
}

.sensitive-confirm {
    width: 87px;
    height: 40px;
    margin: 30px auto 0;
}

.convention-content strong {
    font-weight: bolder;
}

.convention-content p {
    margin-top: 0;
    margin-bottom: 16px;
}

.convention-content ul,
li {
    list-style: unset;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
}

.convention-content h1,
h2 {
    border-bottom: none;
}

.convention-content ol {
    list-style: decimal;
}

.convention-content ul {
    list-style: disc;
    padding-left: 26px;
    box-sizing: border-box;
}

.convention-content .hljs-center {
    text-align: center;
}

.convention-content .hljs-left {
    text-align: left;
}

.convention-content .hljs-right {
    text-align: right;
}

.convention-title {
    text-align: center;
    font-size: 18px;
    color: var(--primary-font-color);
}

.convention-content {
    width: 737px;
    height: 410px;
    line-height: 20px;
    overflow: auto;
    margin-top: 21px;
    font-size: 14px;
    color: #666;
}

.convention-confirm {
    margin: 24px auto 0;
    width: 240px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--primary-color);
    border-radius: 30px;
    font-size: 14px;
    color: #fff;
    cursor: pointer;
    outline: none;
    border: none;
}

.convention-desc {
    background-color: #F4F4F4;
    line-height: 1.5;
    margin-bottom: 10px;
    padding: 1em 1em 1em 1.2em;
    font-size: 15px;
    text-indent: 2em;
    width: 100%;
}

/* 更多 */
.txt-more {
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    line-height: 20px;
    cursor: pointer;
}

.txt-more::after {
    content: "";
    width: 13px;
    height: 12px;
    display: inline-block;
    background: url(../images/mixue/arrow_searchb2.svg) no-repeat 100%;
    margin-left: 4px;
}


.user-item {
    padding: 20px 0;
    border-top: 1px solid #dedede;
    display: flex;
    align-items: center;
}

.user-item img.forum-userreply-img {
    min-width: 54px;
    max-width: 54px;
    height: 54px;
    border-radius: 50%;
    object-fit: cover;
}

.user-item>.item-info {
    margin-left: 24px;
}

.user-item .user-info {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 4px;
}

.user-item .user-info>span {
    font-size: 14px;
    font-weight: 500;
    color: #000000;
    line-height: 14px;
}

.user-item .user-info>img {
    width: 14px;
    height: 14px;
}

.user-item .user-info .card-user-org {
    margin-left: 12px;
    font-size: 12px;
    font-weight: 400;
    color: #999999;
}

.user-item .desc {
    margin-top: 4px;
    font-size: 12px;
    font-weight: 400;
    color: #999999;
    line-height: 12px;
    display: block;
}

/* 圈子 */
.search-circle {
    display: flex;
    flex-wrap: wrap;
}

.search-circle-item {
    width: 389px;
    height: 152px;
    background-color: #ffffff;
    border-radius: 6px;
    margin-bottom: 16px;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}

.search-circle-item:nth-of-type(3n-1) {
    margin: 0 16px 16px 16px
}

.search-circle-item .circle-icon {
    min-width: 112px;
    max-width: 112px;
    height: 112px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

.search-circle-item .circle-icon>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.group-item.aud-bohui::after {
    content: "被驳回";
    color: #fff;
    width: 52px;
    height: 22px;
    background: var(--primary-color);
    border-radius: 12px 0px 6px 0px;
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 12px;
    text-align: center;
    line-height: 22px;
}

.group-item.auditing::after {
    content: "审核中";
    color: #fff;
    width: 52px;
    height: 22px;
    background: #FE9A03;
    border-radius: 12px 0px 6px 0px;
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 12px;
    text-align: center;
    line-height: 22px;
}

.search-circle-item .circle-text {
    width: 100%;
    margin-left: 16px;
}

.search-circle-item .circle-text .circle-title {
    font-size: 16px;
    font-weight: 500;
    color: var(--primary-font-color);
    line-height: 22px;
}

.search-circle-item .circle-text .circle-desc {
    margin-top: 7px;
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    height: 44px;
    line-height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

.search-circle-item .circle-text .circle-botom {
    margin-top: 7px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.search-circle-item .circle-text .circle-num {
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    line-height: 14px;
}

.search-circle-item .circle-text .joinbtn {
    width: 65px;
    height: 28px;
    background: var(--primary-color);
    border-radius: 20px;
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.search-circle-item .circle-text .joined {
    background: rgba(204, 204, 204, 0.93);
}

.search-circle-item-two {
    width: 407px;
}

.search-circle-item-two:nth-of-type(3n-1) {
    margin: unset;
}

.search-circle-item-two:nth-of-type(2n) {
    margin: 0 0 16px 16px;
}

.content_list {
    background-color: #fff;
    padding: 0 20px;
}

.content_list.waterfall-flow-list {
    margin-bottom: 18px;
    background-color: transparent;
    padding: 0;
}

/* 帖子 */
.post-item {
    padding: 16px 0;
    border-top: 1px solid #dedede;
    display: flex;
    align-items: center;
}

.post-item.video-flow-item {
    flex-direction: column;
    background-color: white;
    border-radius: 6px;
    border-top: none;
}

.post-item.video-flow-item .card-icon {
    width: 100%;
    border-radius: 0;
    overflow: hidden;
    aspect-ratio: 16/9;
    margin-right: 0;
}

.post-item.video-flow-item .card-right {
    flex-grow: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.post-item.image-flow-item {
    flex-direction: column;
    background-color: white;
    border-radius: 6px;
    border-top: none;
}

.post-item.image-flow-item .card-icon {
    width: 100%;
    border-radius: 0;
    overflow: hidden;
    height: auto;
    margin-right: 0;
}

.post-item.image-flow-item .card-right {
    flex-grow: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.post-item.image-flow-item .card-icon>img {
    width: 100%;
    height: auto;
    border-radius: 6px 6px 0 0;
    max-height: 405px;
    display: block;
}

/* 宽图片容器样式 */
.post-item.image-flow-item .card-icon.wide {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f5f5f5;
}

.post-item .card-icon {
    min-width: 228px;
    max-width: 228px;
    height: 128px;
    border-radius: 4px;
    overflow: hidden;
    margin-right: 16px;
}

.post-item .card-icon>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-item .card-right {
    flex-grow: 1;
    width: calc(100% - 244px);
    height: 128px;
    display: flex;
    flex-direction: column;
}

.post-item .card-have-icon {
    height: 128px;
}

.post-item .card-right .card-title {
    font-size: 18px;
    font-weight: 400;
    color: var(--primary-font-color);
    line-height: 25px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.post-item .card-right .card-title>img {
    margin-top: -4px;
}

.post-item .card-right .card-user {
    margin-top: 8px;
    display: flex;
    align-items: center;
    position: relative;
}

.post-item .card-right .card-user-avatar {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    object-fit: cover;
}

.post-item .card-right .card-user-name {
    margin-left: 4px;
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    line-height: 14px;
}

.post-item .card-right .card-user-auth {
    /* margin-left: 4px; */
    width: 14px;
    height: 14px;
}

.post-item .card-right .card-user>span.mr12 {
    line-height: 14px;
}

.post-item .card-right .card-user-org {
    margin-right: 12px;
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    line-height: 14px;
}

.post-item .card-right .card-user-time {
    font-size: 14px;
    font-weight: 400;
    color: #b2b2b2;
    line-height: 14px;
}

.post-item .card-right .rtag {
    position: absolute;
    right: 0;
}

.post-item .card-right .rtag>span {
    height: 26px;
    border: 1px solid #e5e5e5;
    display: inline-block;
    line-height: 26px;
    border-radius: 2px;
    padding: 0 14px;
    color: #666666;
    font-weight: 400;
    font-size: 12px;
}

.post-item .card-right .rtag>span.act {
    border-color: #FE9A03;
    color: #FE9A03;
}

.post-item .card-right .card-desc {
    margin-top: 8px;
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    line-height: 22px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.post-item .card-right .card-bottom {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.post-item .card-right .card-bottom-tags {
    display: flex;
}

.post-item .card-right .card-bottom-tag {
    padding: 4px 8px;
    background: #fff9eb;
    border-radius: 20px;
    height: 20px;
    box-sizing: border-box;
    font-size: 12px;
    font-weight: 400;
    color: #fe9a03;
    line-height: 12px;
}

.post-item .card-right .card-bottom-look {
    display: flex;
    align-items: center;
}

.post-item .card-right .card-look-item {
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-left: 1px solid rgba(222, 222, 222, 0.93);
}

.post-item .card-right .card-look-item:first-of-type {
    border: none;
}

.post-item .card-right .card-look-item>img {
    width: 16px;
    height: 16px;
}

.post-item .card-right .card-look-item span {
    margin-left: 4px;
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    line-height: 14px;
}

.icon-more {
    width: 24px;
    height: 24px;
    display: inline-block;
    background: url(./img/more24.svg) no-repeat;
    background-size: 100%;
}


/* 用户悬停卡片样式 */
.user-hover-card {
    position: absolute;
    z-index: 10000;
    width: 280px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    border: 1px solid #e5e5e5;
    overflow: hidden;
}

.user-card-content {
    padding: 16px;
    min-height: 120px;
}

.user-card-loading {
    text-align: center;
    padding: 40px 0;
}

.user-card-header {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.user-card-header>a{
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.user-card-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 12px;
    border: 2px solid #f0f0f0;
}

.user-card-basic {
    flex: 1;
    margin-left: 6px;
}

.user-card-name {
    font-size: 16px;
    font-weight: 600;
    color: #333333;
    margin-bottom: 4px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 190px;
}

.user-card-currency {
    display: flex;
    align-items: center;
    margin-bottom: 2px;
}
.user-card-currency .currency-level-img {
    width: 24px;
    height: 14px;
    object-fit: contain;
    margin-left: 4px;
}
.user-card-currency > span {
    font-size: 12px;
    color: #666666;
    line-height: 1.2;
}

.user-card-job-number {
    font-size: 12px;
    color: #666666;
    line-height: 1.2;
}

.user-card-department {
    font-size: 13px;
    color: #555555;
    margin-bottom: 8px;
    padding: 6px 0;
    border-radius: 4px;
}

.user-card-medals {
    display: flex;
    align-items: center;
    gap: 6px;
}

.user-card-medal {
    width: 18px;
    height: 18px;
    object-fit: cover;
    border-radius: 100%;
}

.user-card-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border: 8px solid transparent;
}

.user-card-arrow.arrow-left {
    left: -15px;
    top: 20px;
    border-right-color: #e5e5e5;
}

.user-card-arrow.arrow-left::after {
    content: '';
    position: absolute;
    left: 1px;
    top: -7px;
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-right-color: #ffffff;
}

.user-card-arrow.arrow-right {
    right: -15px;
    top: 20px;
    border-left-color: #e5e5e5;
}

.user-card-arrow.arrow-right::after {
    content: '';
    position: absolute;
    right: 1px;
    top: -7px;
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-left-color: #ffffff;
}

.user-card-error {
    text-align: center;
    color: #999999;
    padding: 20px 0;
    font-size: 14px;
}

/* 底部 */
.index-footer {
    clear: both;
    width: 100%;
    position: relative;
    background: #fff;
    padding: 2px 0 20px;
}

.index-footer-bottom {
    width: 1px;
    height: 1px;
    background-color: rgb(224, 40, 49);
    margin-top: -201px;
}

.order-footer {
    clear: both;
    /* background-image: url(../images/mixue/bottom_bg2.svg);
  background-size: 100%;
  background-repeat: no-repeat; */
    background: var(--background-color);
    height: 177px;
    padding-top: 8px;
}

.footer-inner {
    width: 1200px;
    margin: 0 auto;
    pointer-events: auto;
}

.footer-inner .footer-logo {
    height: 26px;
    text-align: center;
    margin: 24px auto 0;
}

.footer-inner .footer-logo>img {
    height: 100%;
}

.footer-inner .footer-nav {
    margin-top: 30px;
    display: flex;
    justify-content: center;
}

.footer-inner .footer-nav .footer-item {
    padding: 0 20px;
    border-left: 1.5px solid rgba(255, 255, 255, 0.2);
    font-size: 12px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    line-height: 12px;
}

.footer-inner .footer-nav .footer-item:first-of-type {
    border-left: none;
}

.footer-inner .location {
    margin-top: 23px;
    display: flex;
    justify-content: center;
}

.footer-inner .location,
.footer-inner .filing {
    font-size: 12px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    line-height: 12px;
    font-size: 12px;
    text-align: CENTER;
}

.footer-inner .filing {
    margin-top: 8px;
}

.footer-inner .location .addr,
.footer-inner .location .email {
    margin-left: 12px;
}

.footer-inner .location > div::before {
    content: "";
    width: 14px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 4px;
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: -1px;
}
.footer-inner .location > div.tel::before {
    background-image: url(../images/cmoc/foot_tel.svg);
}
.footer-inner .location > div.addr::before {
    background-image: url(../images/cmoc/foot_addr.svg);
}
.footer-inner .location > div.email::before {
    background-image: url(../images/cmoc/foot_email.svg);
}

.showbg {
    position: relative;
}

.showbg::after {
    z-index: 999999;
}


.hideen-info,
.follow-info {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 30px;
    height: 18px;
    border-radius: 9px;
    background-color: #E5E5E5;
    cursor: pointer;
}

.hideen-info-active,
.follow-info-active {
    background-color: var(--primary-color);
    justify-content: flex-end;
}

.hideen-info>.round,
.follow-info>.round {
    width: 14px;
    height: 14px;
    background-color: #fff;
    margin: 2px 2px;
}

.align-center {
    align-items: center;
}

body.showbg::after {
    top: 220px;
    bottom: 190px;
    height: calc(100% - 430px)
}


.share-qrcode-svg {
    position: relative;
    width: 30px;
}

.share-qrcode-svg>img {
    width: 30px;
    height: 30px;
}

.share-qrcode {
    margin-top: 15%;
    font-size: 14px;
}

.share-qrcode img {
    width: 156px;
    height: 156px;
}

.share-qrcode div {
    display: block;
    text-align: center;
    margin-top: 10px
}

.share-qrcode div a {
    color: #0f8bda;
}

.share-con {
    display: flex;
    margin: 0 auto 20px;
    width: fit-content;
}

.share-con .share-con-left {
    width: 90px;
    height: 90px;
}

.share-con .share-con-right {
    padding: 12px;
    line-height: 32px;
    font-size: 14px;
}

.share-con .share-con-right>div:first-child {
    font-size: 16px;
}

.share-con .share-con-right a {
    color: #0f8bda;
}

.element-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

.element-pagination-total {
    color: #606266;
    font-size: 13px;
}

.element-pagination-size {
    margin-right: 16px;
}

.element-select {
    height: 32px;
    padding: 0 8px;
    border: 1px solid #dcdfe6;
    border-radius: 4px;
    color: #606266;
    font-size: 13px;
    cursor: pointer;
    outline: none;
    background-color: #fff;
}

.element-select:hover {
    border-color: #c0c4cc;
}

.element-pagination-jump {
    color: #606266;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.element-pagination-editor {
    width: 50px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid #dcdfe6;
    border-radius: 4px;
    color: #606266;
    font-size: 13px;
    text-align: center;
    outline: none;
}

.element-pagination-editor:hover {
    border-color: #c0c4cc;
}

.element-pagination-editor:focus {
    border-color: #409eff;
}

.element-pagination {
    display: flex;
    justify-content: center;
}

.element-pager {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 4px;
}

.element-pager-item {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 32px;
    height: 32px;

    border: 1px solid #dcdfe6;
    border-radius: 4px;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    user-select: none;
}

.element-pager-item:hover {
    color: #409eff;
}

.element-pager-item.active {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    cursor: not-allowed;
}

.element-pager-item.active.red {
    background-color: var(--primary-color-btn);
    border-color: var(--primary-color-btn);
}

.element-pager-item.disabled {
    color: #c0c4cc;
    cursor: not-allowed;
}

.element-pager-item.disabled:hover {
    color: #c0c4cc;
}

.element-pager-item a {
    color: inherit;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.element-pager-prev,
.element-pager-next {
    padding: 0 8px;
}

.element-pager-more {
    color: #909399;
}

/* content搜索框 */
.bar-search {
    background: #fff;
    border-radius: 30px;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: 0 18px;
}

.bar-search .icon-search {
    background-image: url(../images/Vector.svg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 14px;
    height: 14px;
    display: inline-block;
}

.bar-search-input {
    border: 0;
    padding: 0 6px;
    font-size: 12px;
}

.bar-search .bar-search-input {
    width: 100%;
    font-size: 14px;
}

/* 组织账号广场 */
.ad-org-img {
    border-radius: 6px;
}

.org_list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    gap: 12px;
}

.org_list .org_item {
    padding: 20px;
    text-align: center;
    background-color: #fff;
    border-radius: 6px;
    width: 100%;
    overflow: hidden;
    position: relative;
}

.org_list .org_item .user_avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    margin: auto;
}

.org_list .org_item .user_avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.org_list .org_item .recommend {
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-left: 40px solid transparent;
    border-top: 40px solid #0176FF;
    color: #fff;
    font-size: 12px;
    line-height: 1;
    text-align: center;
}

.org_list .org_item .recommend::after {
    content: "荐";
    position: absolute;
    top: -32px;
    right: 5px;
    font-weight: bold;
}

.org_list .org_item .user_name {
    font-size: 16px;
    color: rgba(0, 0, 0, 1);
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 12px;
}

.org_list .org_item .user_medals {
    margin-top: 6px;
    margin-bottom: 12px;
    height: 20px;
}

.org_list .org_item .user_medals img {
    display: inline-flex;
    margin: auto;
}

.org_list .org_item .user_info {
    font-size: 12px;
    color: rgba(153, 153, 153, 1);
    line-height: 18px;
    margin: 4px 0;
}

.org_list .org_item .user_bio {
    font-size: 14px;
    color: rgba(153, 153, 153, 1);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 10px 0;
}

.org_list .org_item .user_action {
    margin: 12px auto 0;
}

.org_list .org_item .user_action .btn-msg {
    width: 56px;
    height: 26px;
    display: inline-block;
    margin: auto;
    border-radius: 20px;
    background: rgba(230, 0, 18, 1);
    color: #fff;
    font-size: 14px;
    line-height: 26px;
}

/* 用户卡片中的徽章悬停提示 */
.user-card-medal-tooltip {
    position: fixed;
    z-index: 10000;
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
    transform: translateY(10px);
    min-width: 200px;
}

.user-card-medal-tooltip.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.user-card-medal-tooltip .medal-tooltip-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 12px;
}

.user-card-medal-tooltip .medal-tooltip-image {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 50%;
}

.user-card-medal-tooltip .medal-tooltip-name {
    font-size: 16px;
    font-weight: 500;
    color: var(--primary-font-color);
    margin: 0;
}

/* 用户卡片中的徽章样式 */
.user-card-medal {
    width: 18px;
    height: 18px;
    margin-right: 2px;
    border-radius: 4px;
    cursor: pointer;
    transition: transform 0.2s ease;
}

.user-card-medal:hover {
    transform: scale(1.1);
}

.convention-right {
    margin-top: -40px;
    z-index: -1;
}

.user-medals-container {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 4px;
}

.user-medals-container>div {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.user-medal-currency {
    font-size: 12px;
    color: #999;
}
.user-medal-currency.center {
    text-align: center;
}

.user-medals-container.center {
    justify-content: center;
}
.ddg-tit {
    margin: 10px 0;
    text-align: center;
}




/* 礼物弹窗 */
.gift-modal {
    width: 380px;
    background: #fff;
    border-radius: 12px;
    padding: 32px 36px 28px;
    position: relative;
}

.modal-header {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 16px;
    display: flex;
    height: 28px;
    line-height: 28px;
    justify-content: space-between;
}

.gift-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.gift-item {
    text-align: center;
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
}

.gift-item:hover { background: #f9f9f9; }

/* 数量角标 */
.gift-item-badge {
    position: absolute;
    top: 0;
    right: 5px;
    background: var(--primary-color);
    color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 11px; /* 稍小一点更精致 */
    
    /* 替代 line-height 的方案 */
    display: flex;
    align-items: center;
    justify-content: center;
}

.gift-item .gift-item-icon { 
    width: 64px;
    height: 64px;
    margin-bottom: 8px;
    border-radius: 8px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
 }
.gift-item .gift-item-icon img { width: 36px;display: block;  object-fit: contain;}
.gift-item .gift-item-name { font-size: 14px; }
.gift-item .gift-item-price { font-size: 12px; color: var(--primary-color); }

.modal-footer { text-align: center; }
.balance-info { color: #999; font-size: 12px; margin-bottom: 15px; }
.cost-total { color: var(--primary-color); }
.cost-total>i { font-style: normal; }

.gift-modal .submit-btn {
    width: 100%;
    height: 40px;
    line-height: 40px;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 20px;
    font-size: 14px;
    cursor: pointer;
}

.indcenbox-img {
    width: 40px;
    height: 40px;
    background: #fff;
    border-radius: 50%;
    position: relative;
    overflow: visible;
}
.indcenbox-img .avatar-border {
  position: absolute;
  left: 0;
  top: 0;
  transform: scale(1.2);
  z-index: 2;
}

/* .group-mem .mem-img.indcenbox-img .avatar-border,
.anniversary-detail .indcenbox-img .avatar-border,
.profile_header_container .profile_avatar_box .indcenbox-img .avatar-border,
.user-hover-card .user-card-header .avatar-border,
.post-item .indcenbox-img .avatar-border {
    transform: scale(1.2);
} */

.nav_right .indcenbox-img {
    width: 32px;
    height: 32px;
    display: block;
}

.p-like-users .indcenbox-img {
    width: 32px;
    height: 32px;
    display: inline-block;
}

.search-user .indcenbox-img {
    width: unset;
    height: unset;
}
.search-user .indcenbox-img .avatar-border {
    transform: scale(1.2);
}

.card-user .indcenbox-img {
    width: 20px;
    height: 20px;
}

.nav-group-loader {
    width: 360px;
    gap: 14px;
    overflow-y: auto;
    background: #fff;
}

.nav-loading {
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 12px;
}

.spinner {
    display: block;
    width: 20px;
    height: 20px;
    margin: 0 auto 10px;
    border: 2px solid #eee;
    border-top-color: #007bff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

.nav-group-loader .group-sub-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #333;
    text-decoration: none;
    transition: background 0.2s;
    gap: 12px;
}
.nav-group-loader .group-sub-item .group-sub-name {
    font-weight: 500;
    text-align: left;
}
.nav-group-loader .group-sub-item span{
    height: 24px;
    line-height: 24px;
}
.nav-group-loader .group-sub-item > div {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 400;
}

.nav-group-loader .group-sub-item:hover { background: #f8f9fa; }

.nav-group-loader .group-info {
    flex: 1;
    min-width: 0; 
    display: flex;
    align-items: center;
}

.nav-group-loader .group-sub-name {
    font-weight: 500;
    white-space: nowrap;      /* 强制不换行 */
    overflow: hidden;         /* 超出隐藏 */
    text-overflow: ellipsis;  /* 显示省略号 */
    display: block;
    width: 100%;              /* 占满左侧容器 */
}

/* 右侧操作区：固定宽度，不参与缩放 */
.nav-group-loader .group-actions {
    display: flex;
    align-items: center;
    flex-shrink: 0; 
    gap: 8px;
}

.nav-group-loader .group-sub-count {
    font-size: 12px;
    color: #999;
    white-space: nowrap;
}

.nav-group-loader .follow-badge {
    padding-left: 26px;
    border-radius: 4px;
    font-size: 11px;
    color: var(--primary-font-color);
    border: 1px solid #DEDEDE;
    white-space: nowrap;
    width: 66px;
    height: 24px;
    line-height: 22px;
    position: relative;
    border-radius: 30px;
    text-align: left;
}
.nav-group-loader .follow-badge::before {
    content: '';
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background-repeat: no-repeat;
    background-image: url(img/jiahao.svg);
    background-size: 8px 8px;
}

.nav-group-loader .follow-badge.followed {
    color: rgba(153, 153, 153, 1);
}
.nav-group-loader .follow-badge.followed::before {
    background-image: url(img/dagou.svg);
}
.nav-group-loader .follow-badge.wait-audit {
    color: rgba(153, 153, 153, 1);
}
.nav-group-loader .follow-badge.wait-audit::before {
    background-image: url(img/dagou.svg);
}

.modal-mask {
    display: none; /* 默认隐藏 */
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 999;
}

.modal-content {
    position: relative;
    width: 320px;
    height: 400px;
    margin: auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    border-radius: 15px;
    padding: 100px 20px 30px;
    text-align: center;
    /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); */
    margin-top: 100px;
    overflow: hidden;
}
.modal-content.is-holiday {
    width: 1100px;
    height: 600px;
    margin-top: 70px;
}

.modal-header-img {
    position: absolute;
    top: -80px; /* 关键：让图片飘起来 */
    left: 50%;
    transform: translateX(-50%);
    width: 180px;
}

.modal-header-img img { width: 100%; }

.modal-avatar {
    width: 50px;
    height: 50px;
    margin: auto;
    border-radius: 50%;
    overflow: hidden;
    display: none;
}
.modal-avatar img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.modal-avatar-anniversary {
    margin: -68px auto 6px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    display: none;
}
.modal-avatar-anniversary img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.modal-name-anniversary{
    display: none;
    color: rgba(168, 131, 107, 1);
}

#modalTitle { color: #e74c3c; font-size: 1.2rem; margin: 15px 0; }

#modalBody { color: rgba(168, 131, 107, 1); font-size: 0.9rem; line-height: 1.6; margin-bottom: 25px; max-height: 136px; overflow: auto;}
.is-holiday #modalBody { padding: 0 120px; }

.accept-btn {
    width: 280px;
    display: block;
    height: 42px;
    line-height: 42px;
    text-align: center;
    border: none;
    color: white;
    border-radius: 25px;
    cursor: pointer;
    background-color: var(--primary-color);
    font-size: 14px;
    font-weight: 500;
    position: absolute;
    bottom: 40px;
    left: calc(50% - 140px);
}


.layui-layer-nobgbg {
    background: 0 0 !important;
    box-shadow: none !important;
}
.gift-sended {
    width: 300px;
    overflow: visible;
}
.gift-bounce-wrapper {
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: scale(0);
    animation: gift-pop-better 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.gift-sended .gift-sended-img {
    max-width: 300px;
    max-height: 400px;
    object-fit: contain;
    filter: drop-shadow(0 0 20px rgba(255, 255, 255, 0.2)); /* 黑色背景下加点微光 */
}

.gift-sended .gift-sended-p {
    color: #fff;
    margin-top: 10px;
    text-align: center;
    font-size: 14px;
    opacity: 0;
    animation: fade-in-up 0.5s ease-out forwards;
    animation-delay: 0.4s;
}

.gift-sended .gift-sended-p > span {
    color: var(--primary-color);
}

.gift-sended .sended-off {
    width: 200px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin: auto;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 20px;
    font-size: 14px;
    cursor: pointer;
    opacity: 0;
    animation: fade-in-up 0.5s ease-out forwards;
    animation-delay: 0.6s;
}
@keyframes gift-pop-better {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    70% {
        transform: scale(1.1); /* 弹过头一点点 */
        opacity: 1;
    }
    100% {
        transform: scale(1); /* 回到正常大小 */
        opacity: 1;
    }
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.J-blessing-tip {
    width: 630px;
    height: 60px;
    line-height: 60px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    cursor: pointer;
}

.g-sidec-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.g-sidec-title .readers-more {
    font-size: 14px;
    color: rgba(153, 153, 153, 1);
}
.my-readers {}
.my-readers > li {
    padding: 16px 0 4px !important;
    border-bottom: 0 !important;
}
.my-readers .reader-item {
    display: block;
    height: 384px;
    background: #eee;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
}
.my-readers .reader-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.my-readers .reader-item .reader-name {
    background: rgba(92, 154, 45, 0.8);
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding: 0 16px;
}


.checkin-box {
    background: #fff;
    border-radius: 4px;
    padding: 26px 28px;
}
.checkin-box .check-top {
    display: flex;
    grid-auto-flow: column;
    align-items: center;
    gap: 12px;
}
.checkin-box .check-top .ct-left {}
.checkin-box .check-top .ct-left > img {
    width: 56px;
    height: 56px;
    border-radius: 50%;
}
.checkin-box .check-top .ct-middle {
    width: 138px;
}
.checkin-box .check-top .ct-middle .v-user-name {
    font-size: 16px;
    font-weight: 500;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.checkin-box .check-top .ct-middle .v-user-depart {
    color: #999999;
    font-size: 14px;
}
.checkin-box .check-top .ct-right {
    width: 74px;
    text-align: right;
}
.checkin-box .check-top .ct-right .ct-btn {
    display: inline-block;
    padding: 0 16px;
    height: 32px;
    line-height: 32px;
    background: var(--primary-color-btn);
    text-align: center;
    color: #fff;
    border-radius: 20px;
    font-size: 14px;
}
.checkin-box .check-top .ct-right .ct-btn.checked {
    background-color: rgba(113, 184, 56, 0.3);
}
.checkin-box .check-middle {
    width: calc(100% + 36px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 24px 0 24px -20px;
}
.checkin-box .check-middle .user-count {
    width: 100%;
    border-right: 1px solid rgba(229, 229, 229, 1);
    text-align: center;
}
.checkin-box .check-middle .user-count:last-child {
    border-right: none;
}
.checkin-box .check-middle .user-count .user-count-tit {
    font-size: 16px;
    font-weight: 500;
}
.checkin-box .check-middle .user-count .user-count-txt {
    font-size: 12px;
    color: #999999;
    margin-top: 5px;
}
.checkin-box .check-bottom {
    background: rgba(245, 245, 248, 1);
    height: 62px;
    border-radius: 8px;
    line-height: 62px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    position: relative;
}
.checkin-box .check-bottom::before {
    content: "";
    width: 29px;
    background: url(../images/cmoc/“.svg) no-repeat;
    background-size: 100%;
    height: 24px;
    position: absolute;
    top: 12px;
    left: 12px;
}

.checkin-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: none;
}
.checkin-dialog .checkin-dialog-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 260px;
    background-color: #fff;
    border-radius: 20px;
    padding: 128px 0 38px;
    background: radial-gradient(135.19% 100.5% at 104.53% -7.25%, #FFF691 0%, #FFFFFF 100%),
                radial-gradient(74.26% 69% at 15.78% 8%, rgba(113, 184, 56, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
    text-align: center;
}
.checkin-dialog .checkin-dialog-content::before {
    content: "";
    width: 188px;
    height: 188px;
    background: url(../images/cmoc/checkin.svg) no-repeat;
    background-size: 100%;
    position: absolute;
    top: -70px;
    left: 50%;
    transform: translateX(-50%);
}
.checkin-dialog .checkin-dialog-content .checkin-tit {
    color: var(--primary-color-btn);
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
}
.checkin-dialog .checkin-dialog-content .checkin-txt {
    font-size: 14px;
    color: #999999;
    line-height: 14px;
    margin-top: 12px;
}
.checkin-dialog .checkin-dialog-content .checkin-txt > span {
    color: var(--primary-color-btn);
}

/* 首页热门文章 */
.hhp-ul .hhp-ul-li {
    display: flex;
    gap: 8px;
    padding-top: 16px;
    font-size: 16px;
    line-height: 22px;
}
.hhp-ul .hhp-ul-li .hot-num {
    display: inline-block;
    line-height: 22px;
    color: #999999;
    font-size: 16px;
}
.hhp-ul .hhp-ul-li:first-child .hot-num {
    color: rgba(255, 56, 56, 1);
}
.hhp-ul .hhp-ul-li:nth-child(2) .hot-num {
    color: rgba(255, 108, 64, 1);
}
.hhp-ul .hhp-ul-li:nth-child(3) .hot-num {
    color: rgba(247, 159, 86, 1);
}

/* 首页热门话题 */
.hometopic-ul .hometopic-ul-li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 16px;
    font-size: 16px;
    line-height: 22px;
}
.hometopic-ul .hometopic-ul-li .hot-num {
    display: inline-block;
    font-size: 14px;
    color: #fff;
    background: rgba(204, 204, 204, 1);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
}
.hometopic-ul .hometopic-ul-li:first-child .hot-num {
    background: rgba(255, 56, 56, 1);
}
.hometopic-ul .hometopic-ul-li:nth-child(2) .hot-num {
    background: rgba(255, 108, 64, 1);
}
.hometopic-ul .hometopic-ul-li:nth-child(3) .hot-num {
    background: rgba(247, 159, 86, 1);
}
.hometopic-ul .hometopic-ul-li > a {
    display: flex;
    align-items: center;
    gap: 8px;
}
.hometopic-ul .hometopic-ul-li .hot {
    color: rgba(153, 153, 153, 1);
}
.hometopic-ul .hometopic-ul-li .posts-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 首页匿名贴 */
.anonymous-ul .anonymous-ul-li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 16px;
    font-size: 16px;
    line-height: 22px;
}
.anonymous-ul .anonymous-ul-li .hot-num {
    display: inline-block;
    font-size: 14px;
    color: #fff;
    background: rgba(204, 204, 204, 1);
    width: 20px;
    height: 20px;
    border-radius: 2px;
    text-align: center;
    line-height: 20px;
}
.anonymous-ul .anonymous-ul-li:first-child .hot-num {
    background: rgba(255, 56, 56, 1);
}
.anonymous-ul .anonymous-ul-li:nth-child(2) .hot-num {
    background: rgba(255, 108, 64, 1);
}
.anonymous-ul .anonymous-ul-li:nth-child(3) .hot-num {
    background: rgba(247, 159, 86, 1);
}
/* .anonymous-ul .anonymous-ul-li > a {
    display: flex;
    align-items: center;
    gap: 8px;
}
.hometopic-ul .hometopic-ul-li .hot {
    color: rgba(153, 153, 153, 1);
} */
.anonymous-ul .anonymous-ul-li .posts-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}