img{border:0;max-width: 100%}

.wrapper{width: 1000px;}
.golden{color:#f5d475 !important;}
.vertical{ writing-mode: vertical-rl;-webkit-writing-mode: vertical-rl;-ms-writing-mode: vertical-rl;}
.vertical1{display: block;width: 20px}

.container-activity{background-image: url(../images/bg.jpg);background-position: top center;background-repeat: no-repeat;background-color: #5a65f1}

.banner-activity{text-align: center;padding-top: 230px}
.price p:before{content:'¥';position: relative;font-weight: normal}

.linear{background: #000000;
    background: -moz-linear-gradient(top,  #7943fb 0%, #5917a7 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7943fb), color-stop(100%,#5917a7));
    background: -webkit-linear-gradient(top,  #7943fb 0%,#5917a7 100%);
    background: -o-linear-gradient(top,  #7943fb 0%,#5917a7 100%);
    background: -ms-linear-gradient(top,  #7943fb 0%,#5917a7 100%);
    background: linear-gradient(to bottom,  #7943fb 0%,#5917a7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7943fb', endColorstr='#5917a7',GradientType=0 );
    border:1px solid #a671ed;
    box-shadow: 0 3px 5px rgba(0,0,0,.2)}

.sec-title{width: 730px;margin:0 auto}
.sec-title>*{color:#fff;text-align: justify}
.sec-title h2{font-size: 35px;line-height: 75px;text-align: center;}
.sec-title h2:before,.sec-title h2:after{content:'';display:inline-block;width: 86px;height: 26px;background-size: 100% 100%}
.sec-title h2:before{background-image: url(../images/title-l.png);margin-right: 35px;}
.sec-title h2:after{background-image: url(../images/title-r.png);margin-left: 35px}
.sec-title p{font-size: 18px;margin-bottom: 20px;line-height: 1.5em}
.sec-title a{display:block;border:1px solid #fff;font-size: 16px;color:#fff;padding:0 10px}

.btn{display:block;margin:0 auto;text-align:center;color:#fff;background-size: 100% 100%;background: -moz-linear-gradient(top,  #d95ee4 0%, #7b43fb 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d95ee4), color-stop(100%,#7b43fb));
    background: -webkit-linear-gradient(top,  #d95ee4 0%,#7b43fb 100%);
    background: -o-linear-gradient(top,  #d95ee4 0%,#7b43fb 100%);
    background: -ms-linear-gradient(top,  #d95ee4 0%,#7b43fb 100%);
    background: linear-gradient(to bottom,  #d95ee4 0%,#7b43fb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d95ee4', endColorstr='#7b43fb',GradientType=0 );border-radius: 50px;box-shadow: 0 3px 5px rgba(0,0,0,.2)}

.sec{margin-top: 35px;}
.sec-body{background-image: url(../images/block-bg.png);width: 817px;margin:0 auto;background-size: 100% 100%;padding:20px 60px;box-sizing: border-box}

.coupon-list li{float:left;width: 50%;text-align: center;margin-top: 35px;}
.coupon-list + .btn{;width: 208px;line-height: 55px;margin-top: 40px;margin-bottom:20px;font-size: 24px}


.block *{color:#fff}
.block{margin:40px 10px;padding: 25px 40px;border-radius: 5px;}
.block-info-l{text-align: left}
.block-info-l h3{font-size: 26px;}
.block-info-l p{font-size: 18px;margin-bottom: 20px;line-height: 1.8em;}
.block-info-l ul{margin-left: -25px;}
.block-info-l li{float:left;width: 110px;font-size: 25px;padding: 5px 0;text-align: center;background-image: url(../images/dotted.png);background-position: right center;background-repeat: no-repeat;box-sizing: border-box;}
.block-info-l li:first-child{padding-left: 0}
.block-info-l li:last-child{background-image: none}
.block-info-l li span{display: block;font-size: 34px;margin-bottom: 5px}

.block-info-r{width: 175px;border-left: 1px solid #fff;padding:10px 0 10px 25px;height: 180px;text-align: center;position: relative;box-sizing: border-box;}
.block-info-r .price{font-size: 16px;}
.block-info-r .price p{vertical-align: top;font-size: 35px;font-weight: bold}
.block-info-r .price p:before{position: relative;top:-9px;font-size: 22px}
.block-info-r .price del{color:#c8c8c8;line-height: 30px;}
.block-info-r .buy{width: 160px;font-size: 12px;position: absolute;bottom: 0;}
.block-info-r .btn{width: 150px;line-height: 35px;;background-size: 100% 100%;margin-top: 10px;font-size: 18px}

.col-space-30{margin:-15px}
.col-space-30>*{padding:15px;}
.col-lg-3{width: 33.3333333%;float: left;box-sizing: border-box}
.col-lg-6{width: 50%;float: left;box-sizing: border-box}
.block-03,.block-04{box-sizing: border-box;text-align: center;padding:0 10%;border-radius: 5px;min-height: 235px;position: relative}
.block-03 *{color:#fff}
.block-03>span{display: block;line-height: 55px;border-bottom: 1px solid #fff;font-size: 32px;font-weight: bold}
.block-03 .price p{font-size: 48px;font-weight: bold;margin-top: 5px}
.block-03 .price p:before{font-size: 22px;position: relative;top:-18px;font-weight: normal}
.block-03 .price del{color: #c8c8c8;font-size: 16px}
.block-03 .price span{display:block;font-size: 20px;line-height: 1.8em}
.block-03 .buy{position: absolute;bottom: 5px;width: 80%}
.block-03 .buy .btn{display: block;width: 125px;line-height: 30px;font-size: 15px;margin:10px auto}

.sec02 .sec-body{padding-top:50px;padding-bottom: 50px}
.tips1{color:#ded3f9;font-size: 16px;margin-top: 10px}
.tips1 *{color:#ded3f9;}


.block-04 *{color:#fff}
.block-top{padding:25px 0;}
.block-top h3{font-size: 24px}
.block-top p{font-size: 18px}
.block-mid{padding:25px 0;border-top: 1px solid #fff;border-bottom: 1px solid #fff}
.block-mid .vertical{display: inline-block;font-size: 19px;width: 19px;position: relative;line-height: 19px;}
.block-mid .vertical:before{content:'[';-ms-transform: rotate(90deg);display: inline-block;width: 19px;text-align: center}
.block-mid .vertical:after{content:']';-ms-transform: rotate(90deg);display: inline-block;width: 19px;text-align: center}

.block-mid ul{width: calc(100% - 25px);float: right}
.block-mid li{float: left;width: 33.33333333%;font-size: 24px}
.block-mid li span{display: block;font-size: 34px;;margin-bottom: 10px}

.block-bottom{padding:30px 0;line-height: 30px}
.block-bottom .price{font-size: 32px;font-weight: bold}
.block-bottom .price p:before{font-size: 19px;top:-8px}
.block-bottom .btn{width: 135px;line-height: 35px;}

.sec04 .sec-body{padding-top:50px;padding-bottom: 50px}

.rule{text-align: center;padding-top: 50px;padding-bottom: 55px;color:#fff;}
.rule-title{background-image: url(../images/rule-title-bg.png);background-position: center center;background-repeat: no-repeat;font-size: 30px;text-align: center;color:#fff}
.rule-content{display: inline-block;text-align: left;margin: 30px 0;width: 817px;background-color: rgba(256,256,256,0.1);border-radius: 10px;padding: 45px 65px;box-sizing: border-box;}
.rule-content p{line-height: 30px;position: relative;padding-left: 35px;font-size: 18px;color:#fff;margin-bottom: 10px;}
.rule-content p span{position: absolute;left: 0;top:0;line-height: 24px;color:#fff;}


@media screen and (max-width: 1024px) {
    .wrapper,.sec-body,.rule-content{width: 96%;margin-left: 2%;margin-right: 2%}
    .block-info-l{width: 100%}
    .block-info-l li{width: 25%}
    .block-info-l ul{margin-left: 0}
    .block-info-r{border-left: 0;width: 100%;height: auto;padding:20px 0 0}
    .block-info-r .price{float: left}
    .block-info-r .buy{float: right;position: static}
    .block-info-r .buy span{margin-top: 10px;display: block}

    .sec04 .col-lg-6{width: 100%}
}

@media screen and (max-width: 768px) {
    .banner-activity{padding-top: 108px}
    .banner-title{width: 78%;margin:0 auto}
    .container-activity{background-image: url(../images/bg-mobile.jpg);background-size:100% auto;}
    .sec{margin-top: 10px}
    .sec-title{width: 96%;margin:0 2%}
    .sec-title h2{font-size: 16px;line-height: 40px}
    .sec-title h2:before, .sec-title h2:after{width: 46px;height: 12px}
    .sec-title h2:before{margin-right: 15px;}
    .sec-title h2:after{margin-left: 15px;}
    .sec-title p{font-size: 12px;margin-bottom: 5px}
    .sec-body{padding:20px}
    .coupon-list li{margin-top: 10px;width: 48%;margin-right: 4%}
    .coupon-list li:nth-child(2n){margin-right: 0}
    .coupon-list + .btn{margin-top: 15px;margin-bottom: 10px;line-height: 35px;font-size: 18px;}
    .tips{font-size: 12px}
    .col-lg-3,.col-lg-6{width: 50%}
    .block-03>span{font-size: 24px}
    .block-03 .price p{font-size: 26px}
    .block-03 .price del{font-size: 12px}
    .block-03 .price span{font-size: 16px}
    .col-space-30{margin:-5px}
    .col-space-30>*{padding:5px}
    .price p:before{top:0 !important;}
    .block-03 .buy .btn{width: 100%}
    .block-03, .block-04{min-height: 195px}
    .sec02 .sec-body{padding-top: 35px;padding-bottom: 35px}

    .block-info-l h3{font-size: 16px}
    .block-info-l p{font-size: 14px;margin-bottom: 0}
    .block{margin:10px 0;padding:20px 15px}
    .block-info-l li,.block-mid li{font-size: 14px}
    .block-info-l li span,.block-mid li span{font-size: 16px}
    .block-info-r{padding-top: 0}
    .block-info-r .price{text-align: left;font-size: 14px;padding:10px 0 0}
    .block-info-r .price p{font-size: 20px}

    .sec04 .sec-title p{text-align: center}
    .sec-title a{float: none;display: block;margin:5px auto;width: 110px;text-align: center;font-size: 12px;text-decoration: underline}

    .block-top{padding:10px 0}
    .block-top h3{font-size: 16px}
    .block-top p{font-size: 14px}
    .block-mid,.block-bottom{padding:10px 0}
    .block-mid .vertical{font-size: 12px}
    .block-bottom .price{font-size: 18px}
    .block-bottom .btn{width: 110px}
    .sec04 .sec-body{padding-top: 20px;padding-bottom: 20px}

    .rule{padding-top: 30px}
    .rule-title{font-size: 16px}
    .rule-content{padding:20px 10px;margin-top: 15px}
    .rule-content p{font-size: 12px;line-height: 1.5em;padding-left: 25px;margin-bottom: 5px}
    .rule-content p span{top:-4px}

}

@media screen and (max-width: 375px) {
    .block{padding-left: 10px;padding-right: 10px}
    .block-info-r .price{font-size: 12px}
    .block-info-r .price p{font-size: 16px;}
    .block-info-r .price p:before{font-size: 12px}
}