.paint-wrap{
    padding: 0 10% 2rem 10%;
}
.banner-list {
    justify-content: space-around;
}
.active-time {
    margin-top: calc(120rem / 40);
}
.active-time-title {
    font-weight: 500;
    font-size: calc(50rem / 40);
    color: #313131;
    text-align: center;
    margin-bottom: calc(60rem / 40);
}
.active-time-content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
}
.time-line {
    position: absolute;
    left: calc(77rem / 40);
    top: calc(77rem / 40);
    width: calc(100% - calc(77rem / 40));
    z-index: 1;
}
.active-time-item {
    margin-right: 28%;
    flex-shrink: 0;
}
.active-time-item:last-child {
    margin-right: 0;
}

.active-time-item-image {
    width: calc(154rem / 40);
    height: calc(154rem / 40);
    position: relative;
    z-index: 2;
}
.active-time-item-desc {
    font-weight: 500;
    font-size: calc(26rem / 40);
    color: #C11920;
    text-align: center;
    margin-top: calc(54rem / 40);
    margin-bottom: calc(30em / 40);
}
.active-time-item-day {
    font-weight: 400;
    font-size: calc(18rem / 40);
    color: #343434;
    text-align: center;
}

/*活动规则*/
.rule-list {
    background-image: url("../img/paint/rulebg.png");
    background-size: 100% 100%;
    width: 100%;
    height: calc(529rem / 40);
    padding: 6%;
    position: relative;
}

.rule-item {
    margin-bottom: 5%;
    display: flex;
    align-items: baseline;
}

.rule-item-title {
    font-weight: 600;
    font-size: calc(20rem / 40);
    color: #BFBFBF;
    line-height: calc(39rem / 40);
}
.rule-image {
    width: calc(24rem / 40);
    height: calc(24rem / 40);
    margin-left: 1%;
    margin-right: 1%;
}
.rule-right {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.rule-item-desc {
    font-weight: 500;
    font-size: calc(20rem / 40);
    color: #C11920;
    line-height: calc(39rem / 40);
    margin-right: 2%;
}
.rule-item-text {
    font-size: calc(20rem / 40);
    color: #343434;
    line-height: calc(39rem / 40);
    flex: 1;
}
.rule-ican {
    width: calc(40rem / 40);
    height: auto;
    display: inline;
}
/*奖项设置*/
.set-wrapper {
    padding: calc(120rem / 40) 0;
    background: #F7F8F9;
}
.set-title {
    font-weight: 400;
    font-size: calc(26rem / 40);
    color: #343434;
    text-align: center;
    margin-bottom: calc(42rem / 40);
}
.set-red {
    color: #C11920;
}
.set-content {
    background-image: url("../img/paint/setbg.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    height: calc(478rem / 40);
    position: relative;
    margin: 0 10%;
}
.set-content-t {
    display: flex;
    justify-content: space-between;
    /*padding: 3% 6%;*/
    padding: calc(105rem / 40) calc(210rem / 40);
}
.set-image {
    width: calc(376rem / 40);
    height: auto;
    margin-left: 5%;
}
.two-content .set-image {
    /*margin: 1rem calc(23rem / 26) 0.5rem calc(23rem / 26);*/
    width: calc(298rem / 40);
    height: auto;
}
.set-content-left {
    width: 40%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.set-content-title {
    font-weight: 500;
    font-size: 1rem;
    color: #C11920;
    line-height: calc(40rem / 40);
    text-align: center;
    position: relative;
    display: flex;
    justify-content: center;
    padding-left: calc(49rem / 40);
}
.one-image {
    width: calc(49rem / 40);
    height: calc(49rem / 40);
    margin-top: calc(-49rem / 40);
}
.set-content-text {
    margin-top: 0.5rem;
    font-weight: 400;
    font-size: calc(22rem / 40);
    color: #343434;
    text-align: center;
}
.set-text {
    position: absolute;
    bottom: calc(14rem / 40);
    font-size: calc(18rem / 40);
    color: #343434;
    text-align: center;
    width: 100%;
}

.set-two {
    display: flex;
    justify-content: space-between;
    margin: calc(66rem / 40) 10%;
}
.two-content-t {
    display: flex;
    padding: calc(98rem / 40) 0;
    flex-direction: column;
    align-items: center;
}
.two-content {
    background-image: url("../img/paint/setbg2.png");
    background-size: 100% 100%;
    height: calc(679rem / 40);
    width: 49%;
    position: relative;
}
.two-content-left {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 2rem;
}
.two-img {
    right: calc(-24rem / 40);
}
.last-content {
    background-image: url("../img/paint/setbg3.png");
}
.last-text {
    padding: 0 calc(72rem / 40);
    line-height: calc(33rem / 40);
    text-align: left;
}
.ican {
    width: calc(106rem / 40);
    height: calc(48rem / 40);
}
.ask-text {
    font-weight: normal;
    font-size: calc(20rem / 40);
    color: #4C4C4C;
}
.ask .rule-item{
    margin-bottom: 2%;
}
.ask .rule-item-desc {
    margin-left: 2%;
}

.sannuo {
    font-size: calc(20rem / 40);
    color: #4C4C4C;
    margin-top: calc(66rem / 40);
}
.footer {
    box-sizing: border-box;
    padding: 1.4rem 20%;
    background: #C0191F;
}
.footer-content {
    display: flex;
    justify-content: center;
}
.logo-t {
    font-size: calc(20rem / 40);
    color: #ffffff;
    text-align: center;
}
.footer-img {
    position: relative;
    top: -1rem;
}
.banner-nav {
    position: sticky;
    top: 2rem;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.4);
    padding: 0 10%;
    box-sizing: border-box;
    backdrop-filter: blur(3px);
    margin-top: calc(-60rem / 40);
}
@media screen and (max-width: 500px) {
    .banner-nav {
        display: block;
    }
    .paint-wrap{
        padding: 0 1rem 5%;
    }
    .active-time-item-image {
        width: calc(95rem / 26);
        height: calc(95rem / 26);
    }
    .active-time {
        margin-top: calc(51rem / 26);
    }
    .active-time-title {
        margin-bottom: 0;
        font-size: calc(29rem / 26);
    }
    .rule-item-desc {
        font-size: calc(17rem / 26);
    }
    .active-time-content {
        flex-direction: column;
        margin: 0 1rem;
    }
    .rule-item-text {
        font-size: calc(12rem / 26);
    }
    .active-time-item{
        margin-right: 0;
        display: flex;
        justify-content: space-between;
        margin-top: 1rem;
    }

    .active-time-right {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
        width: calc(191rem / 40);
        margin-left: 15%;
    }
    .active-time-item-desc {
        margin-top: 0;
    }
    .time-line {
        position: absolute;
        left: calc(48rem / 26);
        top: calc(95rem / 40);
        height: calc(100% - calc(95rem / 40));
        /*transform: rotate(90deg);*/
        width: calc(5rem / 40);
        z-index: 1;
    }

    .rule-right {
        flex-direction: column;
        width: 85%;
    }

    .rule-list {
        background: #f6f6f6;
        border-radius: 0.5rem;
        height: calc(460rem / 28);
    }

    .set-wrapper {
        padding: calc(44rem / 26) 0;
    }

    .set-title {
        font-size: calc(12rem / 26);
        margin-bottom: calc(15rem / 26);
    }
    .set-image {
        width: calc(127rem / 26);
        height: calc(83rem / 26);
        margin-left: 0;
    }
    .set-content-left {
        width: 45%;
    }
    .two-content .set-image {
        margin: 0 calc(23rem / 26) 0.5rem calc(23rem / 26);
        width: calc(124rem / 26);
        height: calc(78rem / 26);
    }
    .set-content {
        margin: 0 5%;
        height: calc(172rem / 26);
    }
    .set-content-t {
        /*padding-top: calc(29rem / 26);*/
        padding: calc(30rem / 26) calc(32rem / 26);
    }
    .set-content-title {
        font-size: calc(15rem / 26);
        position: relative;
        padding-left: calc(24rem / 26);
    }
    .set-content-text {
        margin-top: 0;
        font-size: calc(10rem / 26);
    }
    .one-image {
        width: calc(24rem / 26);
        height: calc(24rem / 26);
        margin-top: calc(-12rem / 26);
    }
    .two-content-left .one-image {
        right: -6%;
    }
    .last-content .set-content-t {
        padding: calc(30rem / 26) calc(21rem / 26);
    }
    .two-content-t {
        padding: calc(30rem / 40) 0;
    }
    .set-text {
        font-size: calc(9rem / 26);
    }
    .one-text {
        bottom: calc(5rem / 40);
    }

    .set-two {
        margin: calc(15rem / 26) 5%;
    }

    .two-content {
        background-image: url("../img/paint/setbg2-h5.png");
        height: calc(242rem / 26);
    }
    .two-content-left {
        margin-top: 0;
    }
    .two-content-left .set-text {
        padding: calc(10rem / 26) calc(20rem / 26) 0;
    }
    .last-content {
        background-image: url("../img/paint/setbg3-h5.png");
        height: calc(226rem / 26);
    }
    .last-text {
        padding: 0 calc(19rem / 26);
        line-height: calc(13rem / 26);
        font-size: calc(9rem / 26);
    }
    .ican {
        width: calc(38rem / 26);
        height: calc(18rem / 26);
        margin-top: calc(9rem / 26);
    }
    .last-content .set-content-left {
        width: 47%;
    }


    .ask-text {
        font-size: calc(12rem / 26);
        margin-left: -0.5rem;
    }
    .ask .rule-right {
        width: 100%;
    }

    .ask .rule-item-title, .ask .rule-item-desc {
        font-size: calc(12rem / 26);
        line-height: calc(18rem / 26);
    }

    .footer-img {
        top: 0;
    }

}
@media screen and (min-width: 501px) and (max-width: 1100px) {
    .active-time-item {
        margin-right: 15%;
    }
    .two-content .set-text {
        bottom: 0;
        height: calc(85rem / 40);
        padding-top: 0.5rem;
        text-align: center;
    }

    .two-content .set-text {
        bottom: calc(1rem / 40);
    }
    .last-text {
        padding: 0 calc(42rem / 40);
        font-size: 0.3rem;
    }
    .set-content-title {
        font-size: calc(35rem / 40);
    }
    .set-content-t {
        padding: 10% 3% 6%;
    }
    .banner-nav {
        display: block;
    }
    .footer-img {
        top: 0;
    }
}

