/* cdn路径 https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/newZq */
/* 本地路径.. */

.topCard {
    height: 3.96rem;
    width: 7.5rem;
    overflow: hidden;
    position: relative;
    /* background: red; */
}

.card-img-box {
    width: 7.5rem;
    height: 3.1rem;
    overflow: hidden;
}


.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card-img-box img {
    width: 100%;
    height: 100%;
}

.card-img-slide {
    position: relative;
}

.card-img-slide-html {
    min-height: 1rem;
    position: absolute;
    top: 1.39rem;
    left: 3.28rem;
}

.card-img-slide-lv8 {
    color: white;
    font-size: 0.22rem;
    text-align: left;
    margin-bottom: 0.06rem;
}

/* 版本未上线暂时先隐藏 */
.card-cj-box {
    /* display: none; */
}

.warp-8 .card-cj-box {
    display: none;
}

.card-img-7-btn {
    position: absolute;
    width: 0.4rem;
    height: 0.4rem;
    right: 1.5rem;
    top: 0.8rem;
}


.card-img-slide-num {
    font-size: 0.22rem;
    display: flex;
    align-items: center;
    margin-top: 0.04rem;
}

.card-img-slide-html-btn {
    /* width: 0.74rem; */
    padding: 0 0.1rem;
    height: 0.28rem;
    color: white;
    font-size: 0.19rem;
    border-radius: 0.14rem !important;
    overflow: hidden;
    line-height: 0.28rem;
    font-weight: 500;
}

.warp-7 .card-img-slide-html-btn {
    display: none;
}

.warp-7 .card-img-slide-html-btn {
    display: none;
}

.warp-0 .card-img-slide-html-btn {
    background: linear-gradient(315deg, #DE5825 0%, #FA9511 100%);
}

.warp-1 .card-img-slide-html-btn {
    background: linear-gradient(315deg, #3374CE 0%, #89ACEB 100%)
}

.warp-2 .card-img-slide-html-btn {
    background: linear-gradient(315deg, #DC7803 0%, #FA9511 100%)
}

.warp-3 .card-img-slide-html-btn {
    background: linear-gradient(315deg, #8050B2 0%, #9D61B1 100%);
}

.warp-4 .card-img-slide-html-btn {
    /* background: url('https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/newZq/img/zuanka-sj.png') !important; */
    background: linear-gradient( 0, #3C6BE8 0%, #97B6FF 100%);
}

.warp-8 .card-img-slide-html-btn {
    display: none;
}

.warp-4 .card-img-slide-html-btn,
.warp-8 .card-img-slide-html-btn {
    background-size: 100% !important;
    border-radius: 0.14rem !important;
}

.other-text-right-icon {
    width: 0.2rem !important;
    height: 0.2rem !important;
    margin: 0;
}

/* 弧度条样式 */
.carousel-container-box {
    background: url('https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/newZq/img/topCard/7_b.png') no-repeat;
    background-size: 6.98rem 1.05rem;
    background-position-x: 0.26rem;
    background-position-y: -0.2rem;
    width: 7.50rem;
    height: 1.6rem;
    /* 增加高度以容纳按钮 */
    position: absolute;
    overflow: hidden;
    top: 2.5rem;
}

.carousel-container {
    width: 7.50rem;
    height: 2.5rem;
    /* 增加高度以容纳按钮 */
    position: relative;
    overflow: hidden;
}

.carousel-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    margin-top: 0.6rem;
    /* background: red; */
}

.carousel-item {
    position: absolute;
    left: 50%;
    /* bottom: 130px; */
    /* 向上移动以匹配弧线 */
    color: #8B541E;
    /* background: white; */
    font-size: 0.2rem;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    /* transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.3s ease; */
    /* transition: transform 0.3s ease-out, opacity 0.3s ease; */
    transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.3s ease;
    transform: translateX(-50%);
    font-family: DingTalk_JinBuTi;
    /* 基础居中 */
}

.carousel-item::before {
    content: '';
    display: block;
    width: 0.1rem;
    height: 0.1rem;
    border: 0.05rem solid rgba(201, 119, 76, 0.5);
    background: radial-gradient(115% 115% at 23% 0%, #FFFFFF 0%, #FFF9EB 43%, #FFA96C 100%), linear-gradient(150deg, rgba(255, 255, 255, 0) 0%, rgba(238, 188, 70, 0.5) 100%), #FFFFFF;
    background-clip: content-box;
    /* 只在内容区显示背景 */
    border-radius: 50%;
    margin-bottom: 0.15rem;
    transition: transform 0.6s ease, background-color 0.6s ease;
}

/* -- 位置和状态定义 -- */
.pos-center {
    transform: translateX(-50%) translateY(10px) scale(1.2);
    opacity: 1;
    z-index: 10;
}

.pos-center::before {
    transform: scale(1.5);
}

.pos-left {
    transform: translateX(calc(-50% - 1.875rem)) translateY(-0.02rem) scale(1);
    opacity: 0.8;
    z-index: 8;
}

.pos-left span {
    opacity: 0.7;
}

.pos-right {
    transform: translateX(calc(-50% + 1.875rem)) translateY(-0.02rem) scale(1);
    opacity: 0.8;
    z-index: 8;
}

.pos-right span {
    opacity: 0.2;
}

.pos-far-left {
    transform: translateX(calc(-50% - 360px)) translateY(-50px) scale(0.7);
    opacity: 0;
    z-index: 5;
}

.pos-far-right {
    transform: translateX(calc(-50% + 360px)) translateY(-50px) scale(0.7);
    opacity: 0;
    z-index: 5;
}

.pos-hidden-left,
.pos-hidden-right {
    opacity: 0;
    z-index: 1;
    pointer-events: none;
}

.pos-hidden-left {
    transform: translateX(calc(-50% - 540px)) translateY(-75px) scale(0.5);
}

.pos-hidden-right {
    transform: translateX(calc(-50% + 540px)) translateY(-75px) scale(0.5);
}

.nav-btn {
    background-color: #e8c9b4;
    color: #fff;
    border: none;
    padding: 10px 25px;
    cursor: pointer;
    z-index: 20;
    border-radius: 20px;
    font-size: 16px;
    transition: background-color 0.3s ease;
}

.nav-btn:hover:not(:disabled) {
    background-color: #f29c6b;
}

.nav-btn:disabled {
    background-color: #d8d8d8;
    cursor: not-allowed;
    opacity: 0.7;
}

.warp-1 .carousel-item::before {
    background: radial-gradient(115% 115% at 23% 0%, #FFFFFF 0%, #EBFDFF 43%, #6CADFF 100%), linear-gradient(150deg, rgba(255, 255, 255, 0) 0%, rgba(70, 238, 206, 0.5) 100%), #FFFFFF;
    border: 0.05rem solid rgba(111, 140, 163, 0.57);
    background-clip: content-box;
}

.warp-1 .carousel-item {
    color: #1C2126;
}

.warp-2 .carousel-item::before {
    background: radial-gradient(106% 106% at 23% 0%, #FFFFFF 0%, #FFFAEB 43%, #FFC76C 100%), linear-gradient(150deg, rgba(255, 255, 255, 0) 0%, rgba(238, 149, 70, 0.5) 100%), #FFFFFF;
    border: 0.05rem solid rgba(218, 160, 69, 0.77);
    background-clip: content-box;
}

.warp-2 .carousel-item {
    color: #8B541E;
}


.warp-3 .carousel-item::before {
    background: radial-gradient(106% 106% at 24% 0%, #FFFFFF 0%, #FFFAEB 43%, #C6AAFC 100%), linear-gradient(150deg, rgba(255, 255, 255, 0) 0%, rgba(239, 133, 232, 0.5) 100%), #FFFFFF;
    box-shadow: 0px 0px 0.09rem 0px rgba(255, 255, 255, 0.36);
    border: 0.05rem solid rgba(149, 57, 195, 0.34);
    background-clip: content-box;
}

.warp-3 .carousel-item {
    color: #563282;
}

.warp-4 .carousel-item::before {
    background: radial-gradient(106% 106% at 24% 0%, #FFFFFF 0%, #FFFAEB 43%, #AAD0FC 100%), linear-gradient(150deg, rgba(255, 255, 255, 0) 0%, rgba(133, 138, 239, 0.5) 100%), #FFFFFF;
    border: 0.05rem solid rgba(255, 255, 255, 0.2);
    box-shadow: 0px 0px 0.09rem 0px rgba(255, 255, 255, 0.36);
    background-clip: content-box;
    /* backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px); */
}

.warp-4 .carousel-item {
    color: #FFFFFF;
}

.warp-8 .carousel-item::before {
    background: radial-gradient(106% 106% at 24% 0%, #FFFFFF 0%, #FFFAEB 43%, #C6AAFC 100%), linear-gradient(150deg, rgba(255, 255, 255, 0) 0%, rgba(239, 133, 232, 0.5) 100%), #FFFFFF;
    box-shadow: 0px 0px 0.09rem 0px rgba(255, 255, 255, 0.36);
    border: 0.05rem solid rgba(255, 255, 255, 0.09);
    background-clip: content-box;
}

.warp-8 .carousel-item {
    color: #FFFFFF;
}

/* 弧度条样式 */


.now-user-lv-tip-text {
    font-size: 0.22rem;
    display: flex;
    align-items: center;
}