body {
    font-size: 0.8333vw; /* 16px / 1920px * 100 */
    width: 100vw; /* 1920px / 1920px * 100 */
    height: 184.0625vw; /* 3534px / 1920px * 100 */
    font-family: 'SourceHanSansCN', 'Microsoft YaHei', 'sans-serif';
    background: url("../../images/summer/bg-1.jpg") no-repeat;
    background-size: cover;
    overflow-x: hidden;
}
@font-face {
    font-family: 'AlimamaShuHeiTi';
    src: url('./fonts/AlimamaShuHeiTi-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.container-main {
    max-width: 62.5vw; /* 1200px / 1920px * 100 */
    margin: 0 auto;
}
/**顶部宣传区域**/
.hero-section {
    position: absolute;
    margin: 38.25vw 0 0 18.75vw; /* 734.4px / 1920px * 100, 360px / 1920px * 100 */
}
.timer-text {
    font-family: 'AlimamaShuHeiTi';
    font-size: 2.2333vw; /* 42.88px / 1920px * 100 */
    color: #FFFFFF;
    font-style: normal;
    text-transform: none;
    display: flex;
}
/**右侧联系客服区域**/
.kefu-section {
    position: fixed;
    z-index: 1000;
    bottom: 5.2083vw; /* 100px / 1920px * 100 */
    right: 5.2083vw; /* 100px / 1920px * 100 */
}
.kefu-section .kefu-container a{
    display: flex;
    width: 4.8958vw; /* 94px / 1920px * 100 */
    height: 4.9479vw; /* 95px / 1920px * 100 */
    background: url("../../images/summer/kefu.png") no-repeat;
}
.kefu-section .kefu-container a:hover{
    background: url("../../images/summer/kefu_hover.png") no-repeat;
}
/**活动奖励区域**/
.active-price-section{
    position: absolute;
    top: 54.2708vw; /* 1042px / 1920px * 100 */
    width: 62.5vw; /* 1200px / 1920px * 100 */
}
.active-price-section .section-title {
    width: 21.875vw; /* 420px / 1920px * 100 */
    height: 2.6563vw; /* 51px / 1920px * 100 */
    line-height: 2.6563vw;
    font-size: 2.8646vw; /* 55px / 1920px * 100 */
    color: #FFFFFF;
    font-style: normal;
    font-weight: bold;
    text-shadow: 0.1563vw 0 0 #06628D; /* 3px / 1920px * 100 */
    text-transform: none;
    margin: 2.3958vw 0 0 20.625vw; /* 46px / 1920px * 100, 396px / 1920px * 100 */
    text-align: center;
}
.active-price-section .row{
    display: flex;
}
.active-price-section .row .col-md-6{
    width: 33.0208vw; /* 634px / 1920px * 100 */
}
.card {
    position: relative;
    top: 3.4375vw; /* 66px / 1920px * 100 */
    padding: 2.6042vw 0 0 0; /* 50px / 1920px * 100 */
    margin-bottom: 1.25vw; /* 24px / 1920px * 100 */
    transform: none !important;
}
.card-header {
    font-family: 'SourceHanSansCN';
    font-weight: 500;
    color: #FE6D15;
    font-size: 1.5625vw; /* 30px / 1920px * 100 */
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.card-header .fas{
    display: inline-block;
}
.card-header .fa-text{
    display: block;
    margin: -2.0833vw 0 0 1.5833vw; /* -40px / 1920px * 100, 30.4px / 1920px * 100 */
}

.card-body {
    padding: 0.9896vw 1.5vw 0 1.5vw; /* 19px / 1920px * 100, 28.8px / 1920px * 100 */
}
.card-right-body{
    padding-top: 1.5625vw; /* 30px / 1920px * 100 */
}
.card-body .card-body-title{
    font-family: 'SourceHanSansCN';
    font-weight: 500;
    font-size: 0.8333vw; /* 16px / 1920px * 100 */
    color: #000000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.coupon-card {
    background: linear-gradient(to right, #2f96fe, #48affe, #64CBFE);
    border-radius: 0.8333vw; /* 16px / 1920px * 100 */
    color: white;
    width: 96%;
    height: 4.6875vw; /* 90px / 1920px * 100 */
    line-height: 4.6875vw;
    display: flex;
    gap: 1.0417vw; /* 20px / 1920px * 100 */
    position: relative;
    font-family: 'Roboto';
    box-shadow: 0 0.2083vw 0.625vw rgba(24, 144, 255, 0.3); /* 4px / 1920px * 100, 12px / 1920px * 100 */
}
.amount {
    margin-left: 1.7188vw; /* 33px / 1920px * 100 */
    font-size: 2.0833vw; /* 40px / 1920px * 100 */
    font-weight: bold;
}
.amount span{
    font-size: 1vw; /* 19.2px / 1920px * 100 */
    font-weight: 400;
}

.condition {
    width: 7.0313vw; /* 135px / 1920px * 100 */
    font-family: 'SourceHanSansCN';
    color: #FFFFFF;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.condition .condition-txt1{
    height: 2.3438vw; /* 45px / 1920px * 100 */
    line-height: 3.3333vw; /* 64px / 1920px * 100 */
    font-weight: 500;
    font-size: 1.0417vw; /* 20px / 1920px * 100 */
}
.condition .condition-txt2{
    height: 2.3438vw; /* 45px / 1920px * 100 */
    line-height: 1.6667vw; /* 32px / 1920px * 100 */
    font-weight: 400;
    font-size: 0.7813vw; /* 15px / 1920px * 100 */
}
.coupon-btn{
    width: 6.3542vw; /* 122px / 1920px * 100 */
    height: 2.1875vw; /* 42px / 1920px * 100 */
    line-height: 2.1875vw;
    border-radius: 1.0417vw; /* 20px / 1920px * 100 */
    margin: 1.4167vw 0 0 4.9479vw; /* 27.2px / 1920px * 100, 95px / 1920px * 100 */
    font-weight: 500;
    font-size: 0.885vw; /* 16.992px / 1920px * 100 */
    border: none;
}
.unlock-button{
    background: #FFFFFF;
    color: #000000;
    cursor: not-allowed;
}
.active-button{
    background: #2e95fe;
    color: #FFFFFF;
}
.completed-button{
    background: #96999F;
    color: #FFFFFF;
    cursor: not-allowed;
}
.give-button:hover {
    transform: translateY(-0.1042vw); /* -2px / 1920px * 100 */
    box-shadow: 0 0.4167vw 1.0417vw rgba(77, 124, 254, 0.5); /* 8px / 1920px * 100, 20px / 1920px * 100 */
}
.card-margin14{
    margin-top: 0.7292vw; /* 14px / 1920px * 100 */
}
.card-body .card-body-foot{
    font-family: 'SourceHanSansCN';
    font-weight: 500;
    font-size: 0.8333vw; /* 16px / 1920px * 100 */
    color: #545454;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-top: 0.5208vw; /* 10px / 1920px * 100 */
}
.card-body .card-button{
    margin-top: 1.875vw; /* 36px / 1920px * 100 */
    text-align: center;
}
.card-body .card-button .invite-button{
    width: 12.1354vw; /* 233px / 1920px * 100 */
    height: 2.9688vw; /* 57px / 1920px * 100 */
    background: #2E95FE;
    border: 0.0521vw solid #2E95FE; /* 1px / 1920px * 100 */
    border-radius: 1.4063vw; /* 27px / 1920px * 100 */
    font-weight: 500;
    font-size: 1.4583vw; /* 28px / 1920px * 100 */
    color: #FFFFFF;
    cursor: pointer;
}
.card-body .card-button .invite-button:hover {
    transform: translateY(-0.1042vw); /* -2px / 1920px * 100 */
    box-shadow: 0 0.4167vw 1.0417vw rgba(77, 124, 254, 0.5); /* 8px / 1920px * 100, 20px / 1920px * 100 */
}
.right-card{
    padding-left: 0.7813vw; /* 15px / 1920px * 100 */
}

.card-body-title {
    color: #333;
    font-size: 0.9375vw; /* 18px / 1920px * 100 */
    font-weight: 600;
    margin-bottom: 1.5625vw; /* 30px / 1920px * 100 */
    text-align: center;
    line-height: 1.5;
}
.time-line-container {
    position: relative;
}
.progress-info {
    text-align: center;
    font-family: 'SourceHanSansCN';
    font-weight: 500;
    font-size: 0.8333vw; /* 16px / 1920px * 100 */
    color: #545454;
    margin-top: 2.9167vw; /* 56px / 1920px * 100 */
}
.progress-bar {
    position: absolute;
    top: 40%;
    left: 0;
    height: 0.2083vw; /* 4px / 1920px * 100 */
    width: 100%;
    background: #D0D0D2;
    border-radius: 0.1042vw; /* 2px / 1920px * 100 */
    z-index: 1;
    transform: translateY(-50%);
}
.progress-fill {
    position: absolute;
    top: 40%;
    height: 0.2083vw; /* 4px / 1920px * 100 */
    background: #2E95FE;
    border-radius: 0.1042vw; /* 2px / 1920px * 100 */
    z-index: 2;
    transition: width 0.8s ease;
    transform: translateY(-50%);
}

.progress-steps {
    width: 93%;
    display: flex;
    justify-content: space-between;
    position: relative;
    top: 1.3021vw; /* 25px / 1920px * 100 */
    left: 0.2604vw; /* 5px / 1920px * 100 */
    z-index: 3;
    height: 1.5625vw; /* 30px / 1920px * 100 */
}
.step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    left: 0.5208vw; /* 10px / 1920px * 100 */
    height: 100%;
}
.step-circle {
    width: 1.5625vw; /* 30px / 1920px * 100 */
    height: 1.5625vw;
    border-radius: 50%;
    background: #D0D0D2;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 4;
    transition: all 0.3s ease;
}
.step-number {
    font-weight: 500;
    font-size: 1.0417vw; /* 20px / 1920px * 100 */
    color: #FFFFFF;
    position: relative;
    z-index: 5;
}
.step-circle.active::after,
.step-circle.completed::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #2E95FE;
    z-index: 3;
}

.step-label {
    position: absolute;
    bottom: -1.6667vw; /* -32px / 1920px * 100 */
    font-weight: 500;
    font-size: 0.7292vw; /* 14px / 1920px * 100 */
    color: #545454;
    white-space: nowrap;
}

.step-buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 3.9063vw; /* 75px / 1920px * 100 */
}

.step-button-wrapper {
    display: flex;
    justify-content: center;
}

.step-button {
    width: 3.6458vw; /* 70px / 1920px * 100 */
    height: 1.7188vw; /* 33px / 1920px * 100 */
    line-height: 1.7188vw;
    border-radius: 0.2604vw; /* 5px / 1920px * 100 */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8333vw; /* 16px / 1920px * 100 */
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    white-space: nowrap;
}
.step-button.available {
    background: linear-gradient(to right, #2f96fd, #4cb3fe, #62c9fe);
    color: white;
    box-shadow: 0 0.2083vw 0.5208vw rgba(77, 124, 254, 0.3); /* 4px / 1920px * 100, 10px / 1920px * 100 */
}
.step-gift{
    display: none;
    width: 0.7292vw; /* 14px / 1920px * 100 */
    height: 0.8333vw; /* 16px / 1920px * 100 */
    margin: 0px 0.2604vw 0px 0; /* 5px / 1920px * 100 */
    background: url("../../images/summer/gift2.png") no-repeat;
    background-size: cover;
}
.available .step-gift{
    display: inline-block;
}

.step-button.completed {
    background: #D0D0D2;
    color: #545454;
    cursor: not-allowed;
}

.step-button.unavailable {
    background: #96999F;
    color: white;
    cursor: not-allowed;
}
.right-card-button {
    margin-top: 8.4896vw !important; /* 163px / 1920px * 100 */
}
/**超值套餐区域**/
.product-section{
    position: absolute;
    top: 100.8333vw; /* 1936px / 1920px * 100 */
    width: 62%;
}
.product-section .section-title {
    width: 21.875vw; /* 420px / 1920px * 100 */
    height: 2.6563vw; /* 51px / 1920px * 100 */
    line-height: 2.6563vw;
    font-size: 2.8646vw; /* 55px / 1920px * 100 */
    color: #FFFFFF;
    font-style: normal;
    font-weight: bold;
    text-shadow: 0.1563vw 0 0 #06628D; /* 3px / 1920px * 100 */
    text-transform: none;
    margin: 2.6042vw 0 0 20.625vw; /* 50px / 1920px * 100, 396px / 1920px * 100 */
    text-align: center;
}
.product-section .section-content{
    display: flex;
    gap: 2.0833vw; /* 40px / 1920px * 100 */
    text-align: center;
}
.card-product{
    top: 1.7188vw; /* 33px / 1920px * 100 */
}
.package-name {
    font-weight: 500;
    font-size: 1.0417vw; /* 20px / 1920px * 100 */
    color: #FFFFFF;
    text-align: left;
    height: 2.1875vw; /* 42px / 1920px * 100 */
    line-height: 1.8229vw; /* 35px / 1920px * 100 */
    margin-left: -0.9896vw; /* -19px / 1920px * 100 */
}
.activity-marker{
    width: 4.8958vw; /* 94px / 1920px * 100 */
    height: 2.1354vw; /* 41px / 1920px * 100 */
    line-height: 1.7188vw; /* 33px / 1920px * 100 */
    margin: 0.8854vw 0px 0px 6.25vw; /* 17px / 1920px * 100, 120px / 1920px * 100 */
    font-weight: 500;
    font-size: 0.9375vw; /* 18px / 1920px * 100 */
    text-align: center;
}
.activity-marker1 {
    background: url("../../images/summer/taocan_1.png") no-repeat;
    background-size: cover;
    color: #2E95FE;
}
.activity-marker2 {
    background: url("../../images/summer/taocan_2.png") no-repeat;
    background-size: cover;
    color: #FF851D;
}
.activity-marker3 {
    background: url("../../images/summer/taocan_3.png") no-repeat;
    background-size: cover;
    color: #12D429;
}
.activity-marker4 {
    background: url("../../images/summer/taocan_4.png") no-repeat;
    background-size: cover;
    color: #D363FC;
}
.package-price {
    height: 1.9792vw; /* 38px / 1920px * 100 */
    line-height: 1.9792vw;
    font-weight: 500;
    font-size: 2.5521vw; /* 49px / 1920px * 100 */
    color: #2E95FE;
    margin: 0.5208vw 0; /* 10px / 1920px * 100 */
}
.package-price2{
    color: #FF851D;
}
.package-price3{
    color: #12D429;
}
.package-price4{
    color: #D363FC;
}

.package-price .yuan{
    font-size: 1.6146vw; /* 31px / 1920px * 100 */
}
.coupon-badge {
    font-weight: 400;
    font-size: 1.0417vw; /* 20px / 1920px * 100 */
    color: #6D6D6D;
    text-align: center;
    margin-top: 0.7813vw; /* 15px / 1920px * 100 */
}
.btn-purchase {
    background: #2e95fe;
    font-weight: 400;
    height: 2.3438vw; /* 45px / 1920px * 100 */
    line-height: 1.7708vw; /* 34px / 1920px * 100 */
    font-size: 1.0417vw; /* 20px / 1920px * 100 */
    color: #FFFFFF;
    text-align: center;
    border: none;
    border-radius: 1.1458vw; /* 22px / 1920px * 100 */
    width: 100%;
    box-shadow: 0 0.2083vw 0.7813vw rgba(46, 149, 254, 0.4); /* 4px / 1920px * 100, 15px / 1920px * 100 */
    margin-top: 1.6667vw; /* 32px / 1920px * 100 */
    outline: none;
    cursor: pointer;
}
.btn-purchase:active,
.btn-purchase:focus,
.btn-purchase:visited,
.btn-purchase:hover{
    color: #FFFFFF;
    border: none;
    outline: none;
}
.btn-purchase:hover{
    transform: translateY(-0.1042vw); /* -2px / 1920px * 100 */
    box-shadow: 0 0.3646vw 1.0417vw rgba(46, 149, 254, 0.6); /* 7px / 1920px * 100, 20px / 1920px * 100 */
}
.btn-purchase2{
    background: #fea32e;
}
.btn-purchase2:hover{
    box-shadow: 0 0.3646vw 1.0417vw rgba(254, 163, 46, 0.6);
}
.btn-purchase3{
    background: #12D429;
}
.btn-purchase3:hover{
    box-shadow: 0 0.3646vw 1.0417vw rgba(18, 212, 41, 0.6);
}
.btn-purchase4{
    background: #D363FC;
}
.btn-purchase4:hover{
    box-shadow: 0 0.3646vw 1.0417vw rgba(211, 99, 252, 0.6);
}
/**常见问题区域**/
.question-section{
    position: absolute;
    top: 132.0833vw; /* 2536px / 1920px * 100 */
    width: 63.5%;
}
.question-section .section-title {
    width: 21.875vw; /* 420px / 1920px * 100 */
    height: 2.6563vw; /* 51px / 1920px * 100 */
    line-height: 2.6563vw;
    font-size: 2.8646vw; /* 55px / 1920px * 100 */
    color: #FFFFFF;
    font-style: normal;
    font-weight: bold;
    text-shadow: 0.1563vw 0 0 #06628D; /* 3px / 1920px * 100 */
    text-transform: none;
    margin: 2.6042vw 0 0 20.625vw; /* 50px / 1920px * 100, 396px / 1920px * 100 */
    text-align: center;
}
.question-section .accordion{
    padding: 3.9063vw 1.5625vw 6.0938vw 3.3854vw /* 75px / 1920px * 100, 30px / 1920px * 100, 117px / 1920px * 100, 65px / 1920px * 100 */
}
.accordion-header{
    height: 1.5104vw; /* 29px / 1920px * 100 */
    line-height: 1.5104vw;
    font-weight: bold;
    font-size: 1.5625vw; /* 30px / 1920px * 100 */
    color: #000000;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.headingOne{
    margin-top: 4.1667vw; /* 80px / 1920px * 100 */
}
.accordion-body{
    margin: 1.0417vw 0 1.0417vw 0; /* 20px / 1920px * 100 */
    font-weight: 400;
    font-size: 1.3625vw; /* 26.16px / 1920px * 100 */
    color: #6D6D6D;
    text-align: left;
    font-style: normal;
    text-transform: none;
}