@charset "gb2312";
/* CSS Document */
*{ margin:0; padding:0;}
em { font-style:normal; }
li { list-style:none; }
a { text-decoration:none; color: #000;}
img {border:none; vertical-align:middle;width: 100%;display:block;}
table { border-collapse:collapse; }
input,textarea { outline:none; }
textarea { resize:none; overflow:auto; }
body {min-width: 320px;max-width: 750px ;margin: 0 auto !important;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;background:#fff;}
body,h1,h2,h3,h4,h5,p,dl,dd,ul,li,ol,form,input,textarea,th,td,select,div{ margin:0; padding:0;font-family:'Microsoft Yahei';box-sizing:border-box;}
.fl{ float: left;}
.fr{ float: right;}
.row{overflow:hidden;}
.col-xs-12 {width: 100%;padding: 0 15px;}
.col-xs-4 {width: 33.33333333%;float: left;}
.col-xs-6 {width: 50%;float: left;}
.col-xs-8 {width: 66.66666667%;float: left;}
.text-center {text-align: center;}
.clearfix{clear:both;}
.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

h2.tit{font-size: .4rem;padding-top:.2rem;text-align: center;font-weight: bold;background-image: linear-gradient(
90deg,#b40ac1,#f0607c);-webkit-background-clip: text;color: transparent;}
h2.tit em{display: block;margin: auto;width: 1rem;height: 3px;margin-top: 2%;margin-bottom: 5%;}
.main1{width: 100%;margin-top: 5%;padding-bottom: 8%;background: url(main1.jpg) no-repeat center bottom;background-size: 100% 100%;}
.main1 h2.tit em, .main3 h2.tit em, .main4 h2.tit em, .main5 h2.tit em, .main6 h2.tit em{background: linear-gradient(
90deg,#b40ac1,#f0607c);}
.main1 .swiper-slide .col-xs-12{padding: 0;}
.main1 .swiper-slide .col-xs-12 .col-xs-6{padding: 0 10px;}
.main1 .swiper-slide .col-xs-12 .col-xs-6 div{width: 100%;background: linear-gradient(to bottom left, #ff9f7a, #b209c3);}
.main1 .swiper-slide .col-xs-12 .col-xs-6 div span{display: block;padding: 15px 8px 5px 8px;color: #fff;font-weight: bold;font-size: .26rem;text-align: center;line-height: 1.5;}
.main1 .swiper-slide .col-xs-12 .col-xs-6 div p{padding: 8px;text-align: justify;color: #fff;font-size: .26rem;line-height: 1.5;}
.main1 .swiper1 .swiper-button-prev{width: 17px;height: 31px;background: #bc91ff;outline: none;left: 10px;}
.main1 .swiper1 .swiper-button-prev img{width: 7px;height: 13px;margin: 5px 5px 0 0;}
.main1 .swiper1 .swiper-button-next{width: 17px;height: 31px;background: #bc91ff;outline: none;right: 10px;}
.main1 .swiper1 .swiper-button-next img{width: 7px;height: 13px;margin: 5px 0 0 5px;}
.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after{display: none;}
.btn{display: block;width: 50%; margin: 5% auto 0;font-size: .3rem;line-height: 2;border-radius: 25px;background: linear-gradient(to right, #3a5cfb, #a01fff);color: #fff;}
.btn i{margin-left: 5px;vertical-align: initial;}

.main2{width: 100%;background: linear-gradient(to bottom left, #822dd8, #a53fe0);overflow: hidden;}
.main2 h2.tit{color: #fff;}
.main2 h2.tit em{background: #fff;}
.main2 .col-xs-12{padding: 10px 0;}
.main2 .col-xs-12 .col-xs-4{padding: 0 5px;margin-bottom: 3%;color: #fff;}
.main2 .col-xs-12 .col-xs-4:nth-child(3n+1) div{background-color: #c334f5;}
.main2 .col-xs-12 .col-xs-4:nth-child(3n+2) div{background-color: #af32ee;}
.main2 .col-xs-12 .col-xs-4:nth-child(3n+3) div{background-color: #ba30f5;}
.main2 .col-xs-12 .col-xs-4 i{display: table; margin: auto;font-size: .2rem;font-weight: bold;padding: 5% 0;}
.main2 .col-xs-12 .col-xs-4 span{display: block;text-align: center;font-size: .3rem;line-height: 1.5;padding-bottom: 10%;}
.main2 .col-xs-12 a.btn{margin-top: 0;margin-bottom: 5%;background: #fff;color: #9133d6;}

.main3 .col-xs-12{padding: 0;margin: 3% 0;}
.main3 .col-xs-12 .col-xs-6{padding: 0 8px;margin-bottom: 3%;}
.main3 .col-xs-12 .col-xs-6 div{width: 100%;}
.main3 .col-xs-12 .col-xs-6:nth-child(1) div{background: linear-gradient(to bottom right, #6847fa, #407af8);}
.main3 .col-xs-12 .col-xs-6:nth-child(2) div{background: linear-gradient(to bottom right, #387ee0, #2faad3);}
.main3 .col-xs-12 .col-xs-6:nth-child(3) div{background: linear-gradient(to bottom right, #d655f0, #2f57f4);}
.main3 .col-xs-12 .col-xs-6:nth-child(4) div{background: linear-gradient(to bottom right, #fb6b22, #fca232);}
.main3 .col-xs-12 .col-xs-6 div span{display: block;text-align: center;font-size: .36rem;font-weight: bold;padding: 5% 0;color: #FFFFFF;}
.main3 .col-xs-12 .col-xs-6 div p{padding: 0 3% 3% 3%;font-size: .28rem;line-height: 1.5;color: #fff;text-align: justify;}

.main4{width: 100%;}
.main4 .content{position: relative;width: 100%;padding: 7% 2% 10% 2%;border: 1px solid #333;margin-top: 1rem;}
.main4 .content .fr{width: 30%;}
.main4 .content .c_zi{font-size: .3rem;line-height: 1.5;color: #333;}
.main4 .content .class{position: absolute;left: 1rem;top: -.5rem;font-size: .4rem;color: #333;width: 25%;text-align: center;line-height: 2.5;background-color: #fff;}
.main4 .content .task{position: absolute;right: .1rem;bottom: -.4rem;width: 45%;text-align: center;line-height: 2;border-radius: 10px;font-size: .3rem;background-color: #f04d73;color: #fff;}
.main4 .content .task span{font-size: .4rem;font-weight: 700;}
.main4 .btn{margin-top: 12%;}

.main5 .swiper-slide div{background: url(p7_bg.png) no-repeat center top;background-size: 100% 100%;margin: 0 5px;}
.main5 .swiper-slide div span{display: block;font-size: .3rem;padding: 4% 0 4% 6%;color: #fff;font-weight: bold;}
.main5 .swiper-slide div p{padding: 15px 8px;font-size: .24rem;line-height: 1.5;text-align: justify;}

.main6{padding: 3% 0;}
.main6 .col-xs-12{padding: 0;margin-bottom: 5%;}
.main6 .col-xs-12 div{width: 30%;float: left;margin-left:2%;border: 1px solid #ff596f;font-size: .3rem;text-align: center;background-color: #fff;color: #ff596f;border-radius: 25px;line-height: 2;}
.main6 .col-xs-12 div.on{color: #fff;background-color: #ff596f;}