.main-kv {
    width: 100vw;
    height: auto;
    position: relative;
}
.main-kv img {
    width: 100vw;
}
.rule-btn {
    position: absolute;
    top: 21.33vw; /* 80px / 3.75px */
    right: 0px;
    width: 5.33vw; /* 20px / 3.75px */
    height: 14.67vw; /* 55px / 3.75px */
    padding: 1.33vw 0; /* 5px / 3.75px */
    font-size: 3.2vw; /* 12px / 3.75px */
    font-weight: 400;
    border-radius: 2.67vw 0px 0px 2.67vw; /* 10px / 3.75px */
    background: #FAC612;
    color: #00030C;
    line-height: 4vw; /* 15px / 3.75px */
    text-align: center;
    border: none;
    word-break: break-word;
    /* 文本竖行显示 */
    writing-mode: vertical-rl;
    text-orientation: mixed;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.box-wrapper {
    width: 93.33vw; /* 350px / 3.75px */
    margin: 5.33vw auto 0 auto; /* 20px / 3.75px */
    background-image: linear-gradient(180deg, #00030C 0%, #2A3045 100%);
    /* 正确实现渐变边框的方法 - 使用背景裁剪技术，支持圆角 */
    border-radius: 2.67vw; /* 10px / 3.75px */
    border: 0.27vw solid transparent; /* 1px / 3.75px */
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: 
        linear-gradient(180deg, #00030C 0%, #2A3045 100%),
        linear-gradient(180deg, #FFFFFF 0%, #828282 35%, #FFFFFF 65%, #828282 100%);
}
.box-wrapper .btn-group {
    display: flex;
    justify-content: space-between;
    width: 58.67vw; /* 220px / 3.75px */
    height: 6.67vw; /* 25px / 3.75px */
    margin: 2.67vw auto; /* 10px / 3.75px */
    text-align: center;
}
/* 使用:only-child伪类来控制单个按钮的居中显示 */
.box-wrapper .btn-group .btn:only-child {
    margin: 0 auto;
}
.box-wrapper .btn-group .btn, .btn-buy {
    height: 6.67vw; /* 25px / 3.75px */
    font-size: 3.2vw; /* 12px / 3.75px */
    font-weight: bold;
    color: #00030C;
    line-height: 6.67vw; /* 25px / 3.75px */
    border: none;
    border-radius: 1.33vw; /* 5px / 3.75px */
    cursor: pointer;
    background: #FAC612;
}
/* 恢复原有的大小类 */
.box-wrapper .btn-group .btn.size-1 {
    width: 24vw; /* 90px / 3.75px */
}
.box-wrapper .btn-group .btn.size-2 {
    width: 40vw; /* 150px / 3.75px */
}
.box-wrapper .btn-group .btn.size-3 {
    width: 32vw; /* 120px / 3.75px */
}

/**
    * 参与答题模块
    */
.activity-answer {
    height: 53.33vw; /* 200px / 3.75px */
    display: none;
}
.activity-answer .answer-content {
    width: 58.67vw; /* 220px / 3.75px */
    height: 32vw; /* 120px / 3.75px */
    margin: 5.33vw 5.33vw 2.67vw 5.33vw; /* 20px 10px / 3.75px */
    text-align: left;
}
.activity-answer.type-2 .answer-title {
    width: 40vw; /* 150px / 3.75px */
}
.answer-title {
    font-size: 4.8vw; /* 18px / 3.75px */
    font-weight: bold;
    margin-bottom: 2.67vw; /* 10px / 3.75px */
    color: #fff;
}
.answer-desc {
    font-size: 2.4vw; /* 9px / 3.75px */
    color: #AAAAAA;
}

.activity-answer.type-1 {
    height: 70.67vw; /* 260px / 3.75px */
    background-image: url('../images/bg_home_answer_bg.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.activity-answer.type-1 .answer-title {
    color: #293044;
    line-height: 5.87vw; /* 22px / 3.75px */
    margin-bottom: 1.33vw; /* 5px / 3.75px */
}
.activity-answer.type-1 .answer-content {
    height: 48vw; /* 180px / 3.75px */
}



.activity-prizeResult {
    height: 37.33vw; /* 140px / 3.75px */
}

.activity-prizeDraw {
    height: 61.33vw; /* 230px / 3.75px */
}
.activity-prizeResult .name-list {
    text-align: center;
    font-size: 2.67vw; /* 12px / 3.75px */
    font-weight: 400;
    color: #FAC612;
    line-height: 3.8vw;
    margin: 2.67vw 0; /* 10px / 3.75px */
}
.activity-prizeResult .reminder-desc {
    text-align: center;
    font-size: 3.2vw; /* 12px / 3.75px */
    font-weight: 400;
    color: #fff;
    line-height: 3.2vw;
}

.activity-prizeDraw .title, .activity-prizeResult .title {
    width: 58.67vw; /* 220px / 3.75px */
    height: 5.33vw; /* 20px / 3.75px */
    margin: 5.33vw auto; /* 20px / 3.75px */
    text-align: center;
    font-size: 4.8vw; /* 18px / 3.75px */
    font-weight: bold;
    color: #fff;
}
.activity-prizeDraw .prizeDraw-content {
    width: 85.33vw; /* 320px / 3.75px */
    height: 32vw; /* 120px / 3.75px */
    margin: 0 auto 2.67vw auto; /* 10px / 3.75px */
    overflow-x: auto;
    overflow-y: hidden;
    clear: both;
    /* 隐藏滚动条但保持滚动功能 */
    /* WebKit浏览器 (Chrome, Safari, Edge) */
    -ms-overflow-style: none;
    scrollbar-width: none;
}
/* 隐藏WebKit浏览器的滚动条 */
.activity-prizeDraw .prizeDraw-content::-webkit-scrollbar {
    display: none;
}
.activity-prizeDraw .prizeDraw-content > ul {
    white-space: nowrap;
    display: inline-block;
}
.activity-prizeDraw .prizeDraw-content > ul > li {
    display: inline-block;
    width: 27.2vw; /* 102px / 3.75px */
    height: 32vw; /* 120px / 3.75px */
    margin-right: 0.8vw; /* 3px / 3.75px */
    text-align: center;
    line-height: 21.33vw; /* 80px / 3.75px */
    border-radius: 2.13vw; /* 8px / 3.75px */
    background-color: #fff;
    color: #000;
    font-size: 3.2vw; /* 12px / 3.75px */
    font-weight: bold;
    vertical-align: top;
}
.activity-prizeDraw .prizeDraw-content > ul > li:last-child {
    margin-right: 0;
}



/* 推荐产品模块 */
.recommended-products, .daily-missions {
    color: #fff;
    padding: 5.33vw; /* 20px / 3.75px */
    margin-top: 0 5.33vw; /* 20px / 3.75px */
}
.recommended-products > h2, .daily-missions > h2 {
    font-size: 6.4vw; /* 24px / 3.75px */
    font-weight: bold;
    margin-bottom: 4vw; /* 15px / 3.75px */
    text-align: center;
}
.products-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4vw; /* 15px / 3.75px */
}
.product-card {
    background-color: #fff;
    border-radius: 2.67vw; /* 10px / 3.75px */
    overflow: hidden;
    height: 61.33vw; /* 230px / 3.75px */
}
.product-image {
    width: 32vw; /* 120px / 3.75px */
    height: 32vw; /* 120px / 3.75px */
    margin: 2.67vw auto; /* 10px / 3.75px */
    border-radius: 1.33vw; /* 5px / 3.75px */
    background-color: #333;
}
.product-image img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 1.33vw; /* 5px / 3.75px */
}
.product-info {
    padding: 2.67vw; /* 10px / 3.75px */
    text-align: center;
}
.product-name {
    color: #000;
    font-size: 3.2vw; /* 12px / 3.75px */
    margin-bottom: 1.33vw; /* 5px / 3.75px */
    width: 34.67vw; /* 130px / 3.75px */
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
}
.product-desc {
    color: #999;
    font-size: 2.4vw; /* 9px / 3.75px */
    margin-bottom: 1.33vw; /* 5px / 3.75px */
    width: 34.67vw; /* 130px / 3.75px */
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
.btn-buy {
    width: 24vw; /* 90px / 3.75px */
    color: #00030C;
}

/* 互动赚取热力值模块 */
ul.missions-list {
    overflow: hidden;
    clear: both;
    margin: 0 auto;
}
ul.missions-list > li {
    height: 13.33vw; /* 50px / 3.75px */
    margin-bottom: 2.67vw; /* 10px / 3.75px */
    background-color: #fff;
    border-radius: 2.67vw; /* 10px / 3.75px */
    display: flex;
    align-items: center;
    justify-content: center;
}
ul.missions-list > li > .icon {
    width: 8.53vw; /* 32px / 3.75px */
    height: 8.53vw; /* 32px / 3.75px */
    margin-right: 1.33vw; /* 5px / 3.75px */
    background: linear-gradient(to bottom, #03060F, #293044);
    border-radius: 2.13vw; /* 8px / 3.75px */
}
ul.missions-list > li > .icon > img {
    width: 8.53vw; /* 32px / 3.75px */
    height: 8.53vw; /* 32px / 3.75px */
    margin: 0 auto;
}
ul.missions-list > li > .info {
    width: 50.67vw; /* 190px / 3.75px */
    height: 8.53vw; /* 32px / 3.75px */
}
ul.missions-list > li > .info > .title {
    font-size: 3.2vw; /* 12px / 3.75px */
    font-weight: bold;
    color: #00030C;
}
ul.missions-list > li > .info > .desc {
    font-size: 2.4vw; /* 9px / 3.75px */
    color: #AAAAAA;
}
ul.missions-list > li > .btns {
    width: 24vw; /* 90px / 3.75px */
}
ul.missions-list > li > .btns > .btn {
    width: 24vw; /* 90px / 3.75px */
    height: 6.67vw; /* 25px / 3.75px */
    line-height: 6.67vw; /* 25px / 3.75px */
    text-align: center;
    font-size: 3.2vw; /* 12px / 3.75px */
    font-weight: bold;
    color: #00030C;
    border: none;
    border-radius: 1.33vw; /* 5px / 3.75px */
    cursor: pointer;
    background: #FAC612;
}
ul.missions-list > li > .btns > .btn.disabled {
    background: #828282;
    color: #fff;
    cursor: not-allowed;
}
ul.missions-list > li:last-child {
    margin-bottom: 0;
}


/* 活动介绍模块 */
.activity-intro {
    background-color: #222736;
    width: 93.33vw; /* 350px / 3.75px */
    height: 21.33vw; /* 80px / 3.75px */
    margin: 0 auto;
    border-radius: 2.67vw; /* 10px / 3.75px */
    color: #fff;
    position: relative;
    overflow: hidden;
}
.activity-intro .process {
    background: url('../images/bg_home_process.png') no-repeat;
    background-position: center center;
    background-size: 100% 0.27vw; /* 1px / 3.75px */
    width: 100%;
    height: 0.27vw; /* 1px / 3.75px */
    position: absolute;
    top: 8vw; /* 30px / 3.75px */
}
.activity-intro .process .point {
    width: 1.6vw; /* 6px / 3.75px */
    height: 1.6vw; /* 6px / 3.75px */
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.activity-intro .process .point .top-con {
    width: 21.33vw; /* 80px / 3.75px */
    height: 5.33vw; /* 20px / 3.75px */
    line-height: 5.33vw; /* 20px / 3.75px */
    text-align: center;
    font-size: 2.67vw; /* 10px / 3.75px */
    position: absolute;
    top: -5.33vw; /* -20px / 3.75px */
    left: 50%;
    transform: translateX(-50%);
    font-size: 2.67vw; /* 10px / 3.75px */
    font-weight: 300;
}
.activity-intro .process .point .bottom-con {
    width: 21.33vw; /* 80px / 3.75px */
    height: 10.67vw; /* 40px / 3.75px */
    line-height: 3.73vw; /* 14px / 3.75px */
    text-align: center;
    font-size: 2.67vw; /* 10px / 3.75px */
    position: absolute;
    bottom: -12vw; /* -45px / 3.75px */
    left: 50%;
    transform: translateX(-50%);
    word-break: break-all;
    font-size: 3.2vw; /* 12px / 3.75px */
}
.activity-intro .process .p1 {
    left: 20%;
}
.activity-intro .process .p2 {
    left: 50%;
}
.activity-intro .process .p3 {
    left: 80%;
}

/**
 * 问题容器
 */
 .question-remainTime {
    position: absolute;
    top: 2.67vw; /* 10px / 3.75px */
    right: 2.67vw; /* 10px / 3.75px */
    width: 8vw; /* 30px / 3.75px */
    height: 8vw; /* 30px / 3.75px */
    line-height: 8vw; /* 30px / 3.75px */
    text-align: center;
    font-size: 2.67vw; /* 10px / 3.75px */
    font-weight: 400;
    color: #fff;
    background-color: #FAC612;
    border-radius: 50%;
 }
.question-container {
    width: 58.67vw; /* 220px / 3.75px */
    margin: 0 auto;
}
.question-container h3 {
    font-size: 4.27vw; /* 16px / 3.75px */
    font-weight: bold;
}
.question-container ul.question-options {
    margin-top: 5.33vw; /* 20px / 3.75px */
}
.question-container ul.question-options li {
    height: 9.33vw; /* 35px / 3.75px */
    width: 58.67vw; /* 220px / 3.75px */
    margin: 0 auto 2.67vw auto; /* 10px / 3.75px */
    text-align: left;
    padding: 0 2.67vw; /* 10px / 3.75px */
    font-size: 3.2vw; /* 12px / 3.75px */
    color: #333;
    line-height: 9.33vw; /* 35px / 3.75px */
    margin-bottom: 1.33vw; /* 5px / 3.75px */
    border: 0.27vw solid #e9e9e9; /* 1px / 3.75px */
    border-radius: 4.67vw; /* 17.5px / 3.75px */
    position: relative;
}
.question-container ul.question-options li:last-child {
    margin-bottom: 0;
}
.question-container ul.question-options li.wrong {
    background-color: #AAAAAA;
}
.question-container ul.question-options li.wrong::after {
    content: 'x';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 2.67vw; /* 10px / 3.75px */
    width: 5.33vw; /* 20px / 3.75px */
    height: 5.33vw; /* 20px / 3.75px */
    border-radius: 50%;
    background-color: #fff;
    color: #AAAAAA;
    font-size: 2.4vw; /* 9px / 3.75px */
    line-height: 5.33vw; /* 20px / 3.75px */
    text-align: center;
}
.question-container ul.question-options li.right {
    background-color: #FAC612;
}
.question-container ul.question-options li.right::after {
    content: '√';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 2.67vw; /* 10px / 3.75px */
    width: 5.33vw; /* 20px / 3.75px */
    height: 5.33vw; /* 20px / 3.75px */
    border-radius: 50%;
    background-color: #fff;
    color: #FAC612;
    font-size: 2.4vw; /* 9px / 3.75px */
    line-height: 5.33vw; /* 20px / 3.75px */
    text-align: center;
}

.answer-result {
    width: 53.33vw; /* 200px / 3.75px */
    margin: 0 auto;
    text-align: center;
}
.answer-result-icon {
    width: 21.33vw; /* 80px / 3.75px */
    height: 21.33vw; /* 80px / 3.75px */
    margin: 0 auto;
}
.answer-result-icon.success {
    background: url('../images/bg_home_answer_success.png') no-repeat;
    background-position: center center;
    background-size: 17.87vw 18.67vw; /* 67px 70px / 3.75px */
}
.answer-result-icon.goon {
    background: url('../images/bg_home_answer_goon.png') no-repeat;
    background-position: center center;
    background-size: 17.87vw 17.33vw; /* 67px 65px / 3.75px */
}
.answer-result-icon.fail {
    background: url('../images/bg_home_answer_fail.png') no-repeat;
    background-position: center center;
    background-size: 20.53vw 17.33vw; /* 77px 65px / 3.75px */
}
.answer-result-icon.win {
    background: url('../images/bg_home_answer_win.png') no-repeat;
    background-position: center center;
    background-size: 18.13vw 17.33vw; /* 68px 65px / 3.75px */
}
.answer-result-content {
    margin: 4vw auto; /* 15px / 3.75px */
    text-align: center;
    font-size: 4.27vw; /* 16px / 3.75px */
    font-weight: 700;
    color: #00030C;
}
.answer-result-btn {
    margin-top: 2.67vw; /* 10px / 3.75px */
}
.answer-result-btn .btn{
    width: 48vw; /* 180px / 3.75px */
    height: 10.67vw; /* 40px / 3.75px */
    line-height: 10.67vw; /* 40px / 3.75px */
    text-align: center;
    font-size: 3.73vw; /* 14px / 3.75px */
    font-weight: 700;
    color: #333;
    border: none;
    border-radius: 5.33vw; /* 20px / 3.75px */
    cursor: pointer;
    background: #FAC612; 
}
.answer-result .input-phone {
    width: 48vw; /* 180px / 3.75px */
    height: 8vw; /* 30px / 3.75px */
    line-height: 8vw; /* 40px / 3.75px */
    text-align: center;
    font-size: 3.73vw; /* 14px / 3.75px */
    font-weight: 700;
    color: #333;
    border: 1px solid #e9e9e9; /* 1px / 3.75px */
    border-radius: 1.33vw; /* 5px / 3.75px */
}

.rule-container {
    max-height: 106.67vw; /* 400px / 3.75px */
    overflow: auto; 
    word-break: break-word; 
    font-size: 3.2vw; /* 12px / 3.75px */ 
    line-height: 1.6; 
    white-space: pre-line;
    /* 隐藏滚动条但保留滚动功能 */
    -ms-overflow-style: none; /* IE 和 Edge */
    scrollbar-width: none; /* Firefox */
}

/* 隐藏 WebKit 浏览器的滚动条 */
.rule-container::-webkit-scrollbar {
    display: none;
}
.rule-container h3 {
    font-size: 4.27vw; /* 16px / 3.75px */
    font-weight: bold;
    text-align: center;
}
