/* 年度排行 */
.ranking-page .main {
    padding-top: 3rem;
    padding-bottom: 2rem;
    position: relative;
}

/* 内容区域 */
.ranking-page .main {
    background: url(../images/bg_base.jpg) no-repeat left 3rem;
    background-size: 100%;
}

.ranking-page .best-header {
    height: 24rem;
    position: relative;
    padding: 0 0.75rem;
}

.ranking-page .best-header .title-img {
    position: absolute;
    top: 4.625rem;
    left: 1.25rem;
    width: 12.0625rem;
    height: 4.125rem;
    overflow: hidden;
    font-size: 1.6rem;
    font-weight: bold;
    color: #fff6d8;
}

.best-header .desc-box {
    height: 9.25rem;
    position: absolute;
    bottom: 0.65rem;
    left: 0.75rem;
    right: 0.75rem;
    background-image: linear-gradient(0deg, #FFDC9F 0%, #FEF9EF 100%);
    border-radius: 0.5rem;
    padding: 0.9375rem 0.75rem 0.625rem;
}

.best-header .sub-desc {
    background: rgba(255, 255, 255, 0.70);
    border-radius: 0.25rem;
    height: 3.75rem;
    padding: 0.5rem 0.375rem;
    font-size: 0.5rem;
    color: #999999;
    margin-top: -0.5rem;
    line-height: 1rem;
    display: flex;
    align-items: center;
}

.best-header .sub-desc .desc {
    height: 100%;
    overflow: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch; /* 兼容iOS设备的滚动效果 */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
}

.best-header .min-desc {
    height: 4.375rem;
    overflow: hidden;
}

.best-header .min-desc .cp-img {
    float: left;
    height: 4.375rem;
    width: 4.375rem;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.best-header .min-desc .cp-img img {
    width: 100%;
}

.best-header .min-desc h1 {
    height: 1.6875rem;
    line-height: 1.6875rem;
    font-size: 1.125rem;
    color: #4A200C;
    font-weight: 600;
    margin-bottom: 0.3125rem;
    text-align:center;
}

.best-header .min-desc h2 {
    /* height: 2.375rem; */
    font-size: 0.75rem;
    color: #724029;
    line-height: 1.2rem;
    font-weight: 400;
    padding-left: 0.6rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* 列表内容 */
.best-content-wrap {
    background-image: linear-gradient(180deg, #ffffff 0%, #FFFFFF 100%);
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
    padding: 0.0625rem;
}

.best-content {
    padding: 0.875rem 0.75rem 0.75rem;
    background-image: linear-gradient(180deg, #fcded2 0%, #f2f3f7 10%);
    border-radius: 0.5rem;
    position: relative;
}

.best-content .more-info {
    font-size: 1rem;
    color: #470E0E;
    font-weight: 400;
    height: 2.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.5rem;
    background: #EBEBEB;
    border: 0.03125rem solid #FFFFFF;
    border-radius: 0.5rem;
}

.best-content .more-info span {
    display: flex;
    justify-content: center;
    align-items: center;
}

.best-content .more-info span::after {
    display: inline-block;
    content: "";
    height: 0.4375rem;
    width: 0.75rem;
    background-color: #f00;
    margin-left: 0.3125rem;
    background: url(../images/icon-sjbottom.png) no-repeat left top;
    background-size: 100%;
    transform: rotate(-90deg);
}

.ranking-cp-list {
    overflow: hidden;
}

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

.ranking-cp-list li .base-tag {
    display: flex;
    flex-wrap: wrap;
    /* justify-content: space-between; */
}

.ranking-cp-list li .base-tag .tag {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 6.5625rem;
    height: 1.75rem;
    background: #FFF2F2;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    color: #E81B29;
    margin-top: 0.5rem;
    padding: 0 0.3rem;
    margin-right: 0.3rem;
}

.ranking-cp-list li .base-tag .tag:nth-child(3n) {
    margin-right: 0;
}

.ranking-cp-list li .base-desc {
    height: 1.5rem;
    font-size: 0.75rem;
    color: #666666;
    margin-top: 0.4375rem;
}

.ranking-cp-list li .base {
    height: 3.375rem;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
}

.ranking-cp-list li .base .icon {
    display: block;
    width: 1.5rem;
    height: 1.75rem;
    background-size: 100% !important;
    margin-top: 0.875rem;
    margin-left: 0.125rem;
}

.ranking-cp-list li:nth-child(1) .base .icon {
    background: url(../images/icon-ph01.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(2) .base .icon {
    background: url(../images/icon-ph02.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(3) .base .icon {
    background: url(../images/icon-ph03.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(4) .base .icon {
    background: url(../images/icon-ph04.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(5) .base .icon {
    background: url(../images/icon-ph05.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(6) .base .icon {
    background: url(../images/icon-ph06.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(7) .base .icon {
    background: url(../images/icon-ph07.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(8) .base .icon {
    background: url(../images/icon-ph08.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(9) .base .icon {
    background: url(../images/icon-ph09.png) no-repeat left top;
}

.ranking-cp-list li:nth-child(10) .base .icon {
    background: url(../images/icon-ph010.png) no-repeat left top;
}

.ranking-cp-list li .product-img {
    width: 5.5rem;
    height: 100%;
    display: block;
    border: 0.0625rem solid #e6e6e6;
    border-radius: 0.3125rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0.75rem;
    overflow: hidden;
}

.ranking-cp-list li .product-img img {
    width: 100%;
}

.ranking-cp-list li .product-cont {
    flex: 1;
    padding-left: 0.75rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.ranking-cp-list li .product-cont h3 {
    font-size: 1rem;
    color: #101010;
    font-weight: 600;
}

.ranking-cp-list li .product-cont h4 {
    font-size: 0.625rem;
    color: #666666;
    margin-top: 0.65rem;
}
.intro {
    overflow-wrap: break-word;
    word-break: break-word;
    line-height: 1.6;
    color: #a5a5a5;
    padding-bottom: 0.5rem;
}
.footer_bf p {
    font-size: 0.75rem;
}
.headMenuBox {
    width: 100%;
    padding: 0 0.2rem 0.4rem;
    background-color: rgba(236, 58, 62, .95);
    overflow: hidden;
    z-index: 100;
    margin: 0 auto;
    display:none;
}
.hbm_bf {
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.hbm_bf li {
    text-align: center;
    font-size: .85rem;
    min-width: 33%;
    line-height:2rem;
}
.hbm_bf li a {
    color: #ffffff;
}
.hbm_cf {
    width: 100%;
    margin-top: 3%;
    overflow: hidden;
}
.hbm_cf li {
    width: 20%;
    float: left;
    text-align: center;
    font-size: 0.85rem;
    line-height: 200%;
}
.hbm_cf li a {
    color: #ffffff;
}
.hbm_cf li i {
    width: 3rem;
    height: 3rem;
    display: block;
    margin: 0 auto;
    border-radius: 0.1rem;
}
.hbm_cf li:nth-child(1) i {
    background: no-repeat url(/images/bt_3.png) center;
    background-color: #6ce0bb;
    background-size: 70%;
}
.hbm_cf li:nth-child(2) i {
    background: no-repeat url(/images/bt_2.png) center;
    background-color: #96f;
    background-size: 70%;
}
.hbm_cf li:nth-child(3) i {
    background: no-repeat url(/images/bt_1.png) center;
    background-color: #fc0;
    background-size: 70%;
}
.hbm_cf li:nth-child(4) i {
    background: no-repeat url(/images/bt_4.png) center;
    background-color: #6cf;
    background-size: 70%;
}
.hbm_cf li:nth-child(5) i {
    background: no-repeat url(/images/bt_5.png) center;
    background-color: #f66;
    background-size: 70%;
}