﻿/* 分类Tab页面：行业排行、品牌榜单、知名品牌、品牌招商、行业资讯 */
.classify-tab-page .main {
    padding-top: 3rem;
    /* padding-bottom: 7.625rem;  */
    padding-bottom: 4.0625rem;
    position: relative;
}

/* tab-header */
.classify-tab-header-vis {
    height: 2.875rem;
}

.classify-tab-header {
    height: 2.875rem;
    background-color: #fff;
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    position: fixed;
    top: 3rem;
    left: 0;
    z-index: 999;
}

.classify-tab-header a,
.classify-tab-header > span {
    display: block;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: relative;
    font-size: 0.875rem;
    color: #666666;
}

.classify-tab-header .active {
    font-weight: 600;
    color: #101010;
}

.classify-tab-header .active::after {
    display: block;
    content: "";
    width: 1.125rem;
    height: 0.375rem;
    position: absolute;
    bottom: 0.375rem;
    left: 50%;
    margin-left: -0.5625rem;
    background: url(../images/tab_bg.png) no-repeat left top;
    background-size: 100%;
}

/* ------ 行业排行 ------ */
.industry-ranking-page .main {
    padding-top: 3rem;
    padding-bottom: 7.625rem;
    /* padding-bottom: 4.0625rem;  */
    position: relative;
}

.industry-ranking-page .main {
    background: url(../images/bg_hyph.png) no-repeat left 5.875rem;
    background-size: 100%;
    background-color: #f2f3f7;
}

.industry-ranking-page .public-search-select {
    position: fixed;
    top: 5.875rem;
    width: 100%;
    z-index: 999;
}

.industry-ranking-page .public-search-select li {
    background: #ffffff3d;
    flex: 1;
    margin-right: 1.5625rem;
}

.industry-ranking-page .public-search-select li:last-child {
    margin-right: 0;
}

.industry-ranking-scroll .public-search-select {
    background-color: #fff;
    box-shadow: 0 2px 4px 0 rgba(223, 223, 223, 0.50);
}

.industry-ranking-page .ranking-header {
    /* height: 15.125rem;  */
    padding: 4.25rem 0.75rem 0;
    position: relative;
    overflow: hidden;
    margin-bottom: 0.9375rem;
}

.industry-ranking-page .ranking-header h1 {
    font-size: 1.375rem;
    color: #FFF5D4;
    font-weight: 600;
    height: 1.625rem;
    line-height: 1.625rem;
    margin-bottom: 0.625rem;
    background: linear-gradient(to right, #FFF7DE, #FFE48C); /* 从左到右的红色到蓝色的渐变 */
    -webkit-background-clip: text; /* 兼容旧版Safari浏览器 */
    background-clip: text; /* 背景裁剪为文字 */
    color: transparent; /* 文字颜色设为透明 */
}

.industry-ranking-page .ranking-header .desc {
    width: 16rem;
    margin-top: 0.5rem;
    font-size: 0.5rem;
    color: #FFB5B5;
    line-height: 1.9;
    height: 2.8125rem;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch; /* 兼容iOS设备的滚动效果 */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
}

.industry-ranking-page .ranking-header .btn-box button {
    border: 0;
    width: 4.625rem;
    height: 1.625rem;
    line-height: 1.6rem;
    overflow: hidden;
    display: flex;
    justify-content: center;
    /* align-items: center; */
    font-size: 0.75rem;
    color: #8C0912;
    font-weight: 600;
    background: #D8D8D8;
    background-image: linear-gradient(91deg, #FFF7DE 0%, #FFE48C 100%);
    border-radius: 1rem;
}

.classify-tab-page .tab-header {
    height: 1.875rem;
    background: rgba(145,20,20,0.15);
    border: 0.5px solid rgba(255,246,237,0.50);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: 1rem;
    margin-top: 0.75rem;
    font-size: 0.875rem;
    color: #FFFFFF;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.classify-tab-page .tab-header span {
    flex: 1;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 1rem;
}

.classify-tab-page .tab-header .active {
    background-color: #fff;
    color: #BA121D;
    margin-top: -0.0625rem;
    height: 1.875rem;
    font-weight: 600;
}

/* 行业排行列表 */
.industry-ranking-list {
    padding: 0 0.75rem;
}

.industry-ranking-list li {
    background: #FFFFFF;
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
    overflow: hidden;
}

.industry-ranking-list .brand-desc {
    margin-top: 0.625rem;
    height: 1.125rem;
    line-height: 1.125rem;
    font-size: 0.75rem;
    color: #666666;
    line-height: 1.25rem;
}

.industry-ranking-list .base-info {
    height: 4.125rem;
    display: flex;
}

.industry-ranking-list .base-info .m-img {
    margin-left: 0.75rem;
    width: 6.625rem;
    height: 4.125rem;
    background-color: #fff;
    border-radius: 0.3rem;
    border: 1px solid #e6e6e6;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.industry-ranking-list .base-info .m-img img {
    width: 100%;
}

.industry-ranking-list .base-info .cont {
    flex: 1;
    padding-left: 0.75rem;
    overflow: hidden;
}

.industry-ranking-list .base-info > span.icon {
    display: block;
    width: 1.625rem;
    height: 1.75rem;
    background-size: 100% !important;
    margin-top: 1.1875rem;
}

.industry-ranking-list .base-info > span.icon img {
    width: 100%;
}

.industry-ranking-list .base-info .cont .title {
    font-size: 1rem;
    color: #101010;
    font-weight: 600;
    height: 1.5rem;
    line-height: 1.5rem;
}

.industry-ranking-list .base-info .cont .sub-tit {
    height: 1rem;
    line-height: 1rem;
    font-size: 0.625rem;
    color: #666666;
    width: 100%;
    margin-bottom: 0.4375rem;
    margin-top: 0.125rem;
}

.industry-ranking-list .base-info .tag-box {
    height: 1.25rem;
    display: flex;
    justify-content: space-between;
    margin-top: -0.2rem;
}

.industry-ranking-list .base-info .tag-box .items {
    background-color: #ccc;
    padding: 0.125rem;
    display: flex;
    align-items: center;
    font-size: 0.625rem;
    color: #605349;
    border-radius: 0.625rem;
}

.industry-ranking-list .base-info .tag-box .items img {
    width: 1rem;
    margin-right: 0.25rem;
}

.industry-ranking-list .base-info .tag-box .tag-zs {
    background-image: linear-gradient(270deg, #FFFFF9 0%, #FFE0E2 100%);
}

.industry-ranking-list .base-info .tag-box .tag-pp {
    width: 4.25rem;
    height: 1.25rem;
    background-image: linear-gradient(270deg, #FFF9F9 0%, #FFDAAE 100%);
}

.industry-ranking-list .base-info .tag-box .number {
    color: #E81B29;
    line-height: 0.875rem;
    font-weight: 600;
    margin-left: 0.2rem;
}

.industry-ranking-list .base-info .tag-box span {
    /* position: relative;
  top: 0.0625rem; */
    display: inline-flex;
    height: 100%;
    align-items: center;
}

.industry-ranking-list .shop-btns {
    display: flex;
    margin-top: 0.625rem;
    /* justify-content: space-between; */
}

.industry-ranking-list .shop-btns span {
    flex: 1;
    display: inline-flex;
    height: 100%;
    align-items: center;
}

.industry-ranking-list .shop-btns a {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #F3F3F3;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    color: #333333;
    height: 1.875rem;
    padding: 0 0.375rem;
    margin-right: 0.25rem;
}

.industry-ranking-list .shop-btns a::after {
    display: inline-block;
    content: "";
    height: 0.375rem;
    width: 0.5rem;
    margin-left: 0.25rem;
    background-color: #f00;
    background: url(../images/icon-sjbottom.png) no-repeat left center;
    background-size: 100%;
    transform: rotate(-90deg);
}

.industry-ranking-list .shop-btns a::before {
    display: inline-block;
    content: "";
    width: 1.125rem;
    height: 1.125rem;
    margin-right: 0.375rem;
    background-size: 100% !important;
}

.industry-ranking-list .shop-btns a:last-child {
    margin-right: 0;
}

.industry-ranking-list .shop-btns a.icon-guan::before {
    background: url(../images/icon-guan.png) no-repeat left center;
}

.industry-ranking-list .shop-btns a.icon-jd::before {
    background: url(../images/icon-stop-jd.png) no-repeat left center;
}

.industry-ranking-list .shop-btns a.icon-tm::before {
    background: url(../images/icon-stop-tm.png) no-repeat left center;
}

/* 相关行业推荐: public */
.public-xg-rec .list {
    margin-top: 0.25rem;
    display: flex;
    flex-wrap: wrap;
}

.public-xg-rec .list .items {
    margin-top: 0.75rem;
    width: 3.625rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-right: 1.875rem;
}

.public-xg-rec .list .items:nth-child(4n) {
    margin-right: 0;
}

.public-xg-rec .list .items .m-img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3.625rem;
    height: 3.625rem;
    background: #FFFFFF;
    border: 0.5px solid #DEDEDE;
    overflow: hidden;
    border-radius: 50%;
}

.public-xg-rec .list .items .m-img img {
    width: 100%;
}

.public-xg-rec .list .items .text {
    height: 1.125rem;
    line-height: 1.125rem;
    width: 3.5rem;
    font-size: 0.75rem;
    color: #333333;
    margin-top: 0.5rem;
    text-align: center;
    margin-bottom: 0.1875rem;
}

/* 行业精选品牌: public */
.public-jx-brand .list {
    display: flex;
    flex-wrap: wrap;
}

.public-jx-brand .list .items {
    width: 6.25rem;
    height: 4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px solid #eeeeee;
    margin-top: 0.75rem;
    margin-right: 0.75rem;
    overflow: hidden;
}

.public-jx-brand .list .items:nth-child(3n) {
    margin-right: 0;
}

.public-jx-brand .list .items img {
    width: 100%;
}

/* 行业资讯: public */
.mb-12 {
    margin-bottom: 0.75rem;
}

.public-hy-news .list {
    overflow: hidden;
}

.public-hy-news .list .items {
    height: 4.25rem;
    overflow: hidden;
    margin-top: 1rem;
    display: flex;
    justify-content: space-between;
}

.public-hy-news .list .items .m-img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 6.25rem;
    height: 4.25rem;
    background: #f5f5f5;
    border-radius: 0.5rem;
    overflow: hidden;
}

.public-hy-news .list .items .m-img img {
    width: 100%;
}

.public-hy-news .list .items .cont-wrap {
    flex: 1;
    overflow: hidden;
    padding-left: 0.625rem;
}

.public-hy-news .list .items .cont {
    height: 2.75rem;
    overflow: hidden;
}

.public-hy-news .list .items h4 {
    font-size: 0.875rem;
    color: #101010;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 0.25rem;
}

.public-hy-news .list .items h5 {
    font-size: 0.75rem;
    color: #999999;
    height: 1.125rem;
    line-height: 1.125rem;
}

.public-hy-news .list .items .time {
    margin-top: 0.25rem;
    height: 1rem;
    line-height: 1rem;
    font-size: 0.625rem;
    color: #999999;
}

/* 品牌榜单 */
.brand-ranking-page .main {
    padding-top: 3rem;
    padding-bottom: 1.625rem;
    /* padding-bottom: 4.0625rem;  */
    position: relative;
    background-color: #f2f3f7;
}

.brand-ranking-page .main::before {
    display: block;
    content: "";
    background-image: linear-gradient(180deg, #D81B16 36%, #F2F3F7 100%);
    height: 38.3125rem;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
    border: 0;
    border-color: transparent;
}

.brand-ranking-page .bg-linear-gradient {
    height: 7.9375rem;
    background-image: linear-gradient(180deg, #CE0100 0%, rgba(206,0,0,0.00) 100%);
    position: absolute;
    top: 5.875rem;
    width: 100%;
    z-index: 2;
}

.brand-ranking-page .public-search-select {
    position: fixed;
    top: 5.875rem;
    width: 100%;
    z-index: 999;
}

.brand-ranking-page .public-search-select li {
    background: #ffffff3d;
    flex: 1;
    margin-right: 1.5625rem;
}

.brand-ranking-page .public-search-select li:last-child {
    margin-right: 0;
}

.brand-ranking-scroll .public-search-select {
    background-color: #fff;
    box-shadow: 0 2px 4px 0 rgba(223, 223, 223, 0.50);
}

.brand-ranking-page .ranking-header {
    padding: 2rem 0.875rem 0;
    position: relative;
    overflow: hidden;
    z-index: 2;
}

.brand-ranking-page .ranking-header .desc {
    margin-top: 0.5rem;
    font-size: 0.5rem;
    color: #FFB5B5;
    line-height: 1.95;
    /*height: 3rem;*/
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.brand-ranking-page .ranking-header .ph-title {
    height: 3.125rem;
    margin-bottom: 1rem;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.brand-ranking-page .ranking-header .ph-title .c {
    text-align: center;
}

.brand-ranking-page .ranking-header .ph-title h1 {
    font-size: 1.5rem;
    background: linear-gradient(to right,#FFF7DE, #FFE48C); /* 从左到右的红色到蓝色的渐变 */
    -webkit-background-clip: text; /* 兼容旧版Safari浏览器 */
    background-clip: text; /* 背景裁剪为文字 */
    color: transparent; /* 文字颜色设为透明 */
}

.brand-ranking-page .ranking-header .ph-title h2 {
    font-size: 1rem;
    font-weight: 600;
    background: linear-gradient(to right,#FFF7DE, #FFE48C); /* 从左到右的红色到蓝色的渐变 */
    -webkit-background-clip: text; /* 兼容旧版Safari浏览器 */
    background-clip: text; /* 背景裁剪为文字 */
    color: transparent; /* 文字颜色设为透明 */
    padding-top: 0.2rem;
}

.brand-ranking-list {
    position: relative;
    z-index: 2;
    margin-top: -0.625rem;
}

.brand-ranking-page .public-plate,
.public-ad {
    position: relative;
    z-index: 2;
}

.brand-ranking-page .ranking-tj {
    z-index: 2;
    margin-left: 0.75rem;
    margin-right: 0.75rem;
}

.public-ad {
    margin: 0.625rem 0.75rem;
    overflow: hidden;
}

.public-ad img {
    width: 100%;
}

.brand-ranking-list .base-info .cont .title a {
    color: #101010;
}

.brand-ranking-list .base-info .cont .sub-tit a {
    color: #666;
}

.brand-ranking-list .vote-box,
.brand-ranking-list .stop-box {
    display: flex;
    justify-content: space-between;
}

.brand-ranking-list .vote-box .vote-btn a {
    color: #E81B29;
}

.brand-ranking-list .stop-box .items {
    display: flex;
    align-items: center;
}

.brand-ranking-list .stop-box .items span {
    padding-left: 0.3rem;
    font-size: 0.75rem;
    color: #333333;
    display: inline-flex;
    align-items: center;
    height: 1.125rem;
    padding-top: 0.1rem;
}

.brand-ranking-list .stop-box .items::before {
    display: block;
    content: "";
    width: 0.9375rem;
    height: 0.9375rem;
    background-size: 100% !important;
}
 

/* 颁奖台 */
.podium-plate {
    height: 17.375rem;
    margin: 0 0.75rem;
    background: url(../images/bg-bjt.png) no-repeat center 9.1rem;
    position: relative;
    z-index: 2;
    background-size: contain;
}

.podium-plate ul {
    display: flex;
    overflow: hidden;
    justify-content: space-between;
    height: 100%;
}

.podium-plate li {
    height: 100%;
    position: relative;
    width: 7.125rem;
}

.podium-plate li .m-img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 6.625rem;
    height: 4.125rem;
    background-color: #fff;
    margin-top: 6.25rem;
    overflow: hidden;
    border: 1px solid #f5ad7b;
    border-radius: 0.5rem;
    margin-left: 0.3125rem;
}

.podium-plate li .m-img img {
    width: 100%;
    height: 100%;
}

.podium-plate li:nth-child(2) {
    margin-top: -1.125rem;
}

.podium-plate li .cont {
    margin: 1.5rem 0.25rem;
    height: 4.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

.podium-plate.podium-rqb li:nth-child(2) .cont {
    margin-top: 2.1875rem;
}

.podium-plate li::before {
    content: "";
    display: block;
    width: 4.375rem;
    height: 4rem;
    position: absolute;
    top: 2.22rem;
    left: 50%;
    margin-left: -2.1875rem;
    background-size: 100% !important;
}

.podium-plate li:nth-child(1)::before {
    background: url(../images/icon-top02.png) no-repeat left center;
}

.podium-plate li:nth-child(2)::before {
    background: url(../images/icon-top01.png) no-repeat left center;
}

.podium-plate li:nth-child(3)::before {
    background: url(../images/icon-top03.png) no-repeat left center;
}

.podium-plate li .cont .poll-number {
    font-size: 0.625rem;
    color: #fff;
    text-align: center;
}

.podium-plate li .cont .m-name {
    display: block;
    text-align: center;
    height: 1.25rem;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    color: #FFFFFF;
    font-weight: 600;
}

.podium-plate li .cont .btn-style {
    height: 1.5rem;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.podium-plate li .cont .btn-style a {
    background: #E81B29;
    border-radius: 0.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3.25rem;
    height: 1.5rem;
    font-size: 0.75rem;
    color: #FFFFFF;
}
.subtitle {
    font-size: 0.75rem;
    color: #fff5d3;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-bottom: 0.6rem;
    margin-top: -0.3rem;
    text-align: center;
}