@charset "utf-8";

body {
    position: relative;
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 16px;
    line-height: 1.8;
    box-sizing: border-box;
    background-color: #FDC69F
}

body * {
    box-sizing: border-box;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

main {
    position: relative;
    width: 1024px;
    max-width: 100%;
    margin: 0 auto;
    padding: 580px 20px 80px 20px;
    height: 100%;
    z-index: 10;
}



.sign-wrap {
    text-align: right;
    color: #ff2c2c;
}
.sign-wrap a {
    color: inherit;
    text-decoration: underline;
}
.sign-wrap strong {
    margin: 0 5px;
}

.block-wrap {
    background-color: #fff8da;
    background-image: url(../../images/event/7th-anniversary/bg-block.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-clip: padding-box;
    border-radius: 8px;
    border: 6px solid rgba(255, 255, 255, .4);
    min-height: 120px;
    margin-top: 6rem;
}

.block-wrap-title {
    text-align: center;
    margin-top: -34px;
}
.block-wrap-title img {
    width: 600px;
    height: auto;
}

.check-in-wrap {
    padding: 0 1rem 2rem 1rem;
}
.check-in-rules {
    text-align: right;
    margin-top: .5rem;
}
.check-in-rules a {
    color: #ff2755;
    text-decoration: underline;
    font-size: .85rem;
}
.check-in-rules a + a {
    margin-left: 1rem;
}
.check-in-progress-wrap {
    margin-top: 5rem;
    margin-bottom: 5rem;
}
.check-in-progress-part {
    display: flex;align-items: flex-start;
}
.check-in-progress {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border: 1px solid #ffb70a;
    background-color: #f7e9ab;
    height: 22px;
    border-radius: 50px;
    padding: 0 .5rem;
}
.check-in-progress > li {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #8f8f8f;
}
.check-in-progress > li.active {
    color: #ffae01;
}
.check-in-progress > li.award {
    color: #ff4343;
}
.check-in-progress > li::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-top: 7px;
    border-radius: 100%;
    background-color: #ff2755;
}
.check-in-icon-resign {
    position: absolute;
    top: -64px;
    text-decoration: none;
}
.check-in-award {
    position: absolute;
    top: -36px;
    font-size: .8rem;
    letter-spacing: -1px;
    white-space: nowrap;
}
.check-in-icon {
    position: absolute;
    top: -8px;
}
.check-in-day {
    margin-top: 1rem;
}
.check-in-next {
    width: 22px;
    height: 22px;
    background: url(../../images/event/7th-anniversary/icon-arrow-double-right.png) center center no-repeat;
    background-size: 100%;
    flex-shrink: 0;
    margin-left: .5rem;
}

.check-in-previous {
    width: 22px;
    height: 22px;
    background: url(../../images/event/7th-anniversary/icon-arrow-double-left.png) center center no-repeat;
    background-size: 100%;
    flex-shrink: 0;
    margin-right: .5rem;
}

.check-in-action {
    text-align: center;
}

.adi-video {
    padding: 1rem;
}
.adi-video iframe {
    display: block;
    max-width: 100%;
    height: auto;
}

.adi-chocolate-wine {
    padding-top: 2rem;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.adi-chocolate-wine > li {
    width: 90%;
    margin: 1rem;
    display: flex;align-items: center;
}
.chocolate-wine-intro {
    display: inline-block;color:#229c92;line-height: 2rem
}


.sell-service {
    display: flex;
    justify-content: flex-end;
}
.sell-service-qrcode {
    position: relative;
    text-align: center;
    right: 2rem;
}
.sell-service-qrcode div strong {
    color:#ff5e16
}



.adi-benifit-wrap.block-wrap {
    background-position: right 0 bottom 100px;
}
.adi-benifits {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    padding: 2rem 0;
}
.adi-benifits > li {
    width: 40%;
    margin: 1rem;
}
.adi-benifits > li > span {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: url(../../images/event/7th-anniversary/bg-coupon.png) left center no-repeat;
    background-size: cover;
    padding: 1rem;
    height: 92px;
    color: #fff;
    text-align: center;
    text-decoration: none;
}
.adi-benifits > li > span > img {
    position: absolute;
    bottom: 10px;
    right: 10px;
}
.adi-benifits > li > .copy-coupon-code{
    cursor: pointer;
}

.benifit-title {
    font-size: .9rem;
    line-height: 1.35;
}
.wechat-benifit {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 0;
    background-color: #fff8da;
    border-top: 1px dashed #ffb70a;
}
.wechat-benifit-qrcode {
    position: relative;
    background: url(../../images/event/7th-anniversary/bg-wechat-like.png) center center no-repeat;
    background-size: 75%;
    width: 630px;
    height: 165px;
}
.wechat-benifit-qrcode img {
    position: absolute;
    right: 100px;
    top: 42px;
}

.recharge-idol-tips {
    display: flex;
    justify-content: space-around;
    padding: 3rem 3rem 5rem 3rem;
}
.recharge-idol-tips > li {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: url(../../images/event/7th-anniversary/bg-idol.png) center center no-repeat;
    background-size: cover;
    width: 240px;
    height: 228px;
    padding-top: 30px;
    color: #ff2755;
}
.recharge-idol-title {
    font-size: .85rem;
}
.recharge-idol-desc {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
}
.recharge-idol-desc > span:nth-child(1) {
    font-size: 1.1em;
}
.recharge-idol-desc > span:nth-child(2) {
    font-size: 2em;
    font-weight: bold;
    font-style: italic;
    margin: 0 .75rem;
}
.recharge-idol-desc > span:nth-child(3) {
    font-size: .9em;
    font-weight: bold;
    font-style: italic;
}
.recharge-idol-action {
    margin-top: 2.75rem;
    text-align: center;
}
.recharge-idol-action a {
    display: inline-block;
    color: inherit;
    text-decoration: none;
    background: url(../../images/event/7th-anniversary/bg-btn-recharge.png) center center no-repeat;
    background-size: contain;
    width: 144px;
    height: 36px;
    font-size: .9em;
    font-weight: 500;
    line-height: 2.5;
    letter-spacing: -.5px;
}

.idol-redeem-products {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 3rem 3rem 0 3rem;
}
.idol-redeem-products > li {
    width: 30%;
    margin-bottom: 2.5rem;

}
.idol-redeem-products > li > a {
    display: block;
    text-decoration: none;
}
.idol-redeem-products > li > a img {
    display: block;
    max-width: 100%;
    height: auto;
    transition: all .15s;
}
.idol-redeem-products > li > a:hover img {
    transform: scale(1.02);
}
.idol-redeem-products > li > span {
    z-index: 12;
}
.idol-redeem-products > li > .point {
    position: relative;
    top:30px;
    display: inline-block;
    width: 100%;
    text-align: center;
    color:#fff;
}
.idol-redeem-products > li > .name {
    position: relative;bottom:32px;left: 30%;color:#fff;width: 180px;display: inline-block;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;
}
.idol-redeem-action {
    margin-top: 2rem;
    padding-bottom: 4rem;
    text-align: center;
}
.idol-redeem-action > a {
    display: inline-block;
    margin: 0 1rem;
    color: #fff;
    text-decoration: none;
    padding: .4rem 1.5rem;
    background-color: #207a9b;
    border-radius: 60px;
}
.idol-redeem-action > a:hover {
    background-color: #145d77;
}

.seckill-products {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 1.5rem 1.5rem 0 1.5rem;
    font-size: .85rem;
}
.seckill-products > li {
    width: 22.5%;
    margin-bottom: 2.5rem;
}
.seckill-products > li > a {
    display: block;
    border: 2px solid #ffe8b6;
    border-radius: 4px;
    text-decoration: none;
    overflow: hidden;
}
.seckill-products > li > a:hover {
    border-color: #f7da9b;
}
.seckill-product-image-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffe8b6;
    padding: 1rem;
}
.seckill-product-image-wrap img {
    display: block;
    max-width: 100%;
    height: auto;
}
.seckill-body {
    background-color: #fff8da;
    padding: .5rem;
}

.seckill-product-title {
    color: #ffb70a;
    margin: 0;
    font-size: 1em;
    font-weight: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.seckill-footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: .5rem;
}
.seckill-price-wrap {
    color: #ff4343;
    line-height: 1;
}
.seckill-price-wrap del {
    font-size: .75em;
    color: #c3c4c2;
}
.seckill-price-value {
    font-size: 1.4em;
    letter-spacing: -1px;
}

.page-footer {
    font-size: .8rem;
    text-align: center;
    margin-top: 2rem;
    color: #c6c1aa;
}
.page-footer a {
    color: #12335f;
    text-decoration: none;
}

.shake-red-envelope {
    position: fixed;
    top: 1%;
    right: 16px;
    width: 212px;
    height: 187px;
    z-index: 12;
    background: url(../../images/event/7th-anniversary/shake-chocolate-wine.png) center center no-repeat;
    cursor: pointer;
}
/* Sidebar */
.sidebar {
    position: fixed;
    top: 30%;
    right: 66px;
    width: 120px;
    height: 453px;
    background: url(../../images/event/7th-anniversary/bg-sidebar.png?v=1) center center no-repeat;
    background-size: contain;
    z-index: 12;
}
.sidebar-links {
    margin-top: 4.75rem;
}
.sidebar-links > li {
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../../images/event/7th-anniversary/bg-sidebar-item.png) center center no-repeat;
    background-size: 93%;
    height: 45px;
}
.sidebar-links > li:hover {
    background-image: url(../../images/event/7th-anniversary/bg-sidebar-item-hover.png);
}
.sidebar-links > li > a {
    width: 95%;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0,0,0,.5), -1px -1px 1px rgba(0,0,0,.5), 1px -1px 1px rgba(0,0,0,.5), -1px 1px 1px rgba(0,0,0,.5);
    text-decoration: none;
    font-size: .8em;
    transform: rotate(-6deg);
}
.sidebar-footer {
    margin-top: 5px;
    text-align: center;
}
.sidebar-footer .link-to-home {
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0,0,0,.5), -1px -1px 1px rgba(0,0,0,.5), 1px -1px 1px rgba(0,0,0,.5), -1px 1px 1px rgba(0,0,0,.5);
    text-decoration: none;
    font-size: .75em;
}

/* background image */
.backgrounds {
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: auto;
    z-index: -1;
}

.backgrounds > img {
    max-width: 100%;
    height: auto;
    user-select: none;
    -webkit-user-select: none;
}

.backgrounds::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    /*background-color: rgba(12,33,220,.3);*/
}


.red-envelope-pop {
    height: 565px;color:#fff;font-size: 16px;
}
.red-envelope-pop-wrap {
    width: 300px;height:200px;position: relative;left: 441px;top:280px;float: left;text-align: center;
}

.red-envelope-pop-wrap h2 {
    margin: 0px
}

.red-envelope-pop-body {
    display: flex;justify-content: center;flex-wrap: wrap;align-items: center;padding: 6px 30px
}

.red-envelope-pop-item {
    width: 50px;height: 50px;line-height:50px;background-color: rgba(0,0,0, 0.3);
}

.red-envelope-pop-body .time-up-1 {
    margin:0px 5px 5px 0px;
}

.red-envelope-pop-body .time-up-2,.time-up-3 {
    margin:0px 5px 5px 0px;
}

.red-envelope-pop-body .time-up-4 {
    margin:0px 0px 5px 0px;
}

.red-envelope-pop-body .time-down-1 {
    margin:5px 5px 0px 0px;
}

.red-envelope-pop-body .time-down-2,.time-down-3 {
    margin:5px 5px 0px 0px;
}

.red-envelope-pop-body .time-down-4 {
    margin:5px 0px 0px 0px;
}

.login-template {
    margin:20px 0;padding:0 60px;
}



/* 清楚a标签样式 */
.page-header a, a:visited { text-decoration:none;}
.page-body a, a:visited { text-decoration:none;}
.login-template a, a:visited { text-decoration:none;}
.page-body .hidden { display: none !important;}
.page-body .show { display: block !important;}


.win_red {
    color: #ff0000;
}

.win_orange {
    color: #ff8400;
}

.win_gray {
    color: #808080;
}

.required {
    color: #C00;
}

.green {
    color: #2ecc71
}

.blue {
    color: #3498db;
}

.orange {
    color: #f1c40f;
}

.purple {
    color: #9b59b6;
}

.input_box {
    height: 22px;
    width: 180px;
    line-height: 22px;
}

.btn_danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
}

.btn_blue {
    color: #fff;
    background-color: #3498db;
    border-color: #3498db;
}

.fs-20 {
    font-size: 20px
}

.fs-16 {
    font-size: 16px
}

.fs-14 {
    font-size: 14px
}

.p-20 {
    padding: 20px
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.pointer { cursor: pointer;}

/****************红包雨 start*******************/
.nov-float {
    position: fixed;
    top: 180px;
    left: calc(50% - 740px);
    z-index: 88
}

/*.hob-inlet {
    position: relative;
    width: 110px;
    height: 113px;
    top: 0;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
    background-image: url(../../images/event/7th-anniversary/red-rain/hob-inlet-1.png);
    z-index: 1;
    cursor: pointer
}*/

/*.hob-inlet-03 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
    background-image: url(../../images/event/7th-anniversary/red-rain/hob-inlet-03-v2.png);
    z-index: 1
}

.hob-inlet-02 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
    background-image: url(../../images/event/7th-anniversary/red-rain/hob-inlet-02-v2.png);
    z-index: 2
}

.hob-inlet-01 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
    background-image: url(../../images/event/7th-anniversary/red-rain/hob-inlet-01-v2.png);
    z-index: 3
}*/

/*.hob-inlet:not(.disable) .hob-inlet-02 {
    animation: hob_shake 1s infinite
}

.hob-inlet:not(.disable):hover .hob-inlet-02 {
    animation: hob 1s 1
}

.for-get-now {
    z-index: 33;
    animation: hob_btn 2.5s infinite
}*/

@keyframes hob_shake {
    15%,45% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg);
        transform-origin: 50% 100%
    }

    30% {
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg);
        transform-origin: 50% 100%
    }

    60%,100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        transform-origin: 50% 100%
    }
}

@keyframes hob {
    10%,30%,50% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px)
    }

    20%,40% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px)
    }

    60%,100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes hob_btn {
    10%,30%,50%,70%,90% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    20%,40%,60%,80% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

/*.hob-mb {
    display: none
}*/

@media(max-width: 1400px) {
    .nov-float {
        left:0;
        transform: scale(.7)
    }
}

@media(max-width: 1199px) {
    .nov-float {
        display:none
    }
}

/*@media(max-width: 768px) {
    .mb-nav {
        position:fixed;
        top: 60px;
        left: 0;
        width: 100%;
        font-size: 0;
        text-align: center;
        z-index: 66;
        background-image: linear-gradient(0deg,#FFE6C8 0%,#FEFCF9 100%);
        box-shadow: 6px 2px 9px 0 rgba(110,33,12,.34)
    }

    .mb-nav a {
        display: inline-block;
        width: 33.333333%;
        padding: 5px 0;
        color: #f66f6a;
        font-size: 14px;
        font-weight: 700;
        line-height: 20px
    }

    .mb-nav a.active {
        color: #fff;
        background-image: linear-gradient(-13deg,#6A00FF 0%,#ED0F55 100%)
    }

    .hob-mb {
        display: block;
        position: fixed;
        width: 58px;
        height: 67px;
        right: 0;
        top: 30%;
        z-index: 8
    }

    .hob-mb .hob-inlet {
        display: block;
        width: 58px;
        height: 67px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url(../../images/event/7th-anniversary/red-rain/hob-inlet-02-v2.png)
    }

    .hob-mb.disable {
        display: none
    }
}*/

.hongbao-wrapper {
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.8);
    z-index: 200
}

.hongbao-wrapper i {
    display: block;
    position: absolute;

    /*width: 96px;
    height: 131px;
    background-image: url(../../images/event/7th-anniversary/red-rain/hb0.png);*/

    width: 75px;
    height: 101px;
    background-image: url(../../images/event/7th-anniversary/red-rain/hb1.png);

    /*width: 57px;
    height: 77px;
    background-image: url(../../images/event/7th-anniversary/red-rain/hb2.png);*/


    top: -200px;
    background-repeat: no-repeat;
    background-size: 100%;
    /*-webkit-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -o-transform: rotate(-15deg);
    transform: rotate(-15deg);*/
    -webkit-transition: 1s transform;
    -moz-transition: 1s transform;
    -ms-transition: 1s transform;
    -o-transition: 1s transform;
    transition: 1s transform
}

.hongbao-wrapper i.rotate {
    -webkit-transform: rotate(7200deg);
    -ms-transform: rotate(7200deg);
    -o-transform: rotate(7200deg);
    transform: rotate(7200deg)
}

.hob-cd {
    position: absolute;
    color: #fff;
    font-size: 30px;
    top: 100px;
    left: 200px
}

.hob-close {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 100px;
    right: 200px;
    cursor: pointer
}

.hob-close::before,.hob-close::after {
    content: '';
    display: block;
    position: absolute;
    width: 30px;
    height: 2px;
    top: 19px;
    left: 5px;
    background-color: #eee;
    border-radius: 2px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.hob-close::after {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg)
}

.red-rain-result {
    font-size: 18px;
    color: #ffe5a3
}

/*[mod-relation=hobCoupon] {
    text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../../images/event/7th-anniversary/red-rain/modal-bg.jpg)
}

[mod-relation=hobCoupon] h5 {
    color: #f66f6a;
    font-size: 30px;
    font-weight: 700;
    line-height: 46px;
    background-repeat: no-repeat;
    background-position: center top;
    background-image: url(../../images/event/7th-anniversary/red-rain/modal-title.png.html);
    background-size: contain
}*/

[mod-relation=hobCoupon] p {
    margin-bottom: 20px
}

/*.mod-footer {
    background: #feefd7
}*/

.hobCoupon-img {
    width: 712px;
    margin: 0 auto
}

@media(max-width: 1199px) {
}

@media(max-width: 768px) {
    [mod-relation=hobCoupon] h5 {
        font-size:20px
    }

    .hobCoupon-img {
        max-width: 100%
    }

    .hob-cd {
        top: 20px;
        left: 30px
    }

    .hob-close {
        top: 20px;
        right: 20px
    }
}

@media(max-width: 720px) {
}

@media(max-width: 480px) {
}

@media(max-width: 414px) {
}

@media(max-width: 375px) {
}

@media(max-width: 360px) {
    [mod-relation=hobCoupon] h5 {
        font-size:18px
    }
}

@media(max-width: 320px) {
    [mod-relation=hobCoupon] h5 {
        font-size:16px
    }
}

.loading {
    display: inline-block;animation: rotate 1s linear infinite;
}



@keyframes rotate{
  from{transform: rotate(0deg)}
  to{transform: rotate(360deg)}
}

/****************红包雨 end*******************/

.jconfirm.jconfirm-modern .jconfirm-box {
    background: url(../../images/event/7th-anniversary/pop.jpg) center center no-repeat;

}

.jconfirm.jconfirm-red-envelope .jconfirm-box {
    background: url(../../images/event/7th-anniversary/red-envelope.jpg) center center no-repeat;
}