.wp{max-width:640px;min-width:320px;margin:0 auto;color:#010101;overflow: hidden;font-family:"Microsoft Yahei";}

.wp_c{background:#171568;}

img{width:100%;height:auto;}

.wp h2{line-height:1.3;text-align:center;font-family:"Microsoft Yahei";padding: 8% 0 6%;color: #000;font-size: 0.35rem;padding-bottom: 0}

.wp h2 span{display: block;font-size: 0.3rem;font-weight: normal}

a.btn{display:block;width: 60%;height: 0.6rem;line-height: 0.6rem;text-align: center;margin: 0.3rem auto 0;background: #FCDD34 ;border-radius: 0.6rem;color: #000;font-size: 0.24rem;border: 1px solid #000;animation: flipInXt 1s .2s ease both infinite;

    -webkit-animation: flipInXt 1s .2s ease both infinite;

    -moz-animation: flipInXt 1s .2s ease both infinite;}

a.btn img{display: inline-block;width: 0.3rem; vertical-align: middle;animation:showh 1s .2s linear both infinite;-webkit-animation:showh 1s .2s linear both infinite;-moz-animation:showh 1s .2s linear both infinite;-o-animation:showh 1s .2s linear both infinite;-ms-animation:showh 1s .2s linear both infinite;}



.fl{float: left}

.fr{float: right}

.pb{padding-bottom: 0.4rem;}

.content{width: 94%;margin: 0 auto}

.bt{display: block}

/*common*/

#banner_slider{position:relative; height: auto;}

#banner_slider .show1{width: 75%; position: absolute; left: 12.5%; top: 5%; z-index: 1;opacity: 0}

#banner_slider .show2{width: 70%; position: absolute; left: 15%; top: 20.5%; z-index: 2;opacity: 0}

#banner_slider .show3{width: 40%; position: absolute; right: 10%; top: 32%; z-index:3;opacity: 0}

#banner_slider .show4{width: 12%; position: absolute; left: 17%; top: 32.8%; z-index:3;opacity: 0}

#banner_slider .show5{width:13.2%; position: absolute; left: 14%; top: 72.1%; z-index:3;opacity: 0}

#banner_slider .btn{width:37.5%; position: absolute; right: 12%; top: 55%; z-index:3; color: #6132a7;border: 0; webkit-animation: ban_btn 2s infinite;  animation: ban_btn 2s infinite;opacity: 0}

#banner_slider.show .show1{opacity:1; transform:translateY(40%);-webkit-transform:translateY(40%);transition:all 0.6s cubic-bezier(0.1,0,0.8,1) 1s;-webkit-transition:all 0.6s cubic-bezier(0.1,0,0.8,1) 1s;}

#banner_slider.show .show2{opacity:1;transition: all 0.6s cubic-bezier(0.2,0,0.8,1); -webkit-transition: all 0.6s cubic-bezier(0.2,0,0.8,1)}

#banner_slider.show .show3{opacity:1;

    -webkit-animation: bounceinR 4s ease-in-out 0s 1 alternate forwards;

    -moz-animation: bounceinR 4s ease-in-out 0s 1 alternate forwards;

    -ms-animation: bounceinR 4s ease-in-out 0s 1 alternate forwards;

    animation: bounceinR 4s ease-in-out 0s 1 alternate forwards;  }

#banner_slider.show .show4{opacity:1; transform:translateY(40%);-webkit-transform:translateY(40%);transition:all 0.6s cubic-bezier(0.6,0,0.8,1) 1.5s;-webkit-transition:all 0.6s cubic-bezier(0.6,0,0.8,1) 1.5s;}

#banner_slider.show .show5{opacity:1; transform:translateX(40%);-webkit-transform:translateX(40%);transition:all 0.6s cubic-bezier(0.6,0,0.8,1) 1.5s;-webkit-transition:all 0.6s cubic-bezier(0.6,0,0.8,1) 1.5s;}

#banner_slider.show .btn{opacity:1; transition:all 1s cubic-bezier(0.1,0,0.8,1) 1s;-webkit-transition:all 1s cubic-bezier(0.1,0,0.8,1) 1s;}



.section1{background: url("../images/bg1.jpg") no-repeat bottom center #BE96EE;background-size: 100%;padding-bottom: 0.7rem}

.section1 .over{width: 85%}

.section1 .over div{width: 48%}

.section1 .over dl{background: #fff;border-radius: 0.15rem;margin-bottom: 0.2rem}

.section1 .over dl dd{width: 90%;height: 0.8rem;margin: 0 auto;font-size: 0.23rem;color: #000;padding-top: 3%}

.section2 dl{overflow: hidden;margin-bottom: 2%}

.section2 dl dt{width: 25%;float: left;margin-right: 3%}

.section2 dl dd{width: 70%;float: left;font-size: 0.22rem;color: #000}

.section2 dl dd h3{font-size: 0.3rem;text-align: left;}

.section2 dl dd h3 span{font-weight: normal;font-size: 0.22rem}

.section2 a.btn,.section3 a.btnbg,.section4 .over a.fl,.section5 .over a.fl{background: #FCDD34;width: 55%}

.section3{background: url("../images/bg2.jpg") no-repeat top center #BE96EE;background-size: 100%;padding-top: 10%}

.section3 dl{position: relative;}

.section3 dl dt{width: 100%;}

.section3 dl dd{width: 90%;position: absolute;left: 6%;top: 9%;z-index: 1;font-size: 0.22rem;color: #000}

.section3 dl img.img{display: block;width: 15%;position: absolute;left: 2%;top: -0.8rem;z-index: 2}

.section3 .text{position: relative}

.section3 .over{width: 82%;position: absolute;left: 7%;bottom: 0.4rem;padding: 2%}

.section3 .over a{width: 48%;font-size: 0.23rem}

.section3 .over a.fr{background: #7745C3;color: #fff;animation: flipInXtbg1 1s .2s ease both infinite;-webkit-animation: flipInXtbg1 1s .2s ease both infinite;-moz-animation: flipInXtbg1 1s .2s ease both infinite}

.section4{background: url("../images/bg3.jpg") no-repeat top center #976DC9;background-size: 100%;}

.section4 ul{display: flex;margin-top: 8%}

.section4 ul li{flex: 1}

.section4 ul li dl{width: 90%;margin: 0 auto;border-radius: 0.1rem;overflow: hidden;border: 2px solid #000;font-size: 0.25rem;color: #000;background: #fff;text-align: center;margin-top: 0.2rem}

.section4 ul li dl dd{padding: 5% 0}

.section4 .over{width: 90%;padding: 0 2% 2%}

.section4 .over a.fl{width: 40%}

.section4 .over a.fr{width: 55%;background: #F05AA5;color: #fff;animation: flipInXtbg2 1s .2s ease both infinite;-webkit-animation: flipInXtbg2 1s .2s ease both infinite;-moz-animation: flipInXtbg2 1s .2s ease both infinite}

.section5{background: url("../images/bg4.jpg") no-repeat top center;background-size: 100%;padding-top: 5%}

.section5 .content{position: relative}

.section5 p{width: 40%;position: absolute;font-size: 0.28rem;color: #1cb9d5;line-height: 1.3}

.section5 p:nth-child(2){right: 3%;top: 2.5%}

.section5 p:nth-child(3){left: 2%;top: 33%;text-align: right}

.section5 p:nth-child(4){right: 3%;top: 58.5%;}

.section5 p:nth-child(5){left: 5%;bottom: 7%;text-align: right}

.section5 img.img{display: block;width: 2.14rem;height: 2.14rem;position: absolute;right: 12.1%;bottom: 1.4%;border-radius: 50%}

.section5 .over{width: 80%;margin: 0 auto;padding: 0 2% 2%}

.section5 .over a.btn{width: 46%}

.section5 .over a.fr{background: #7745C3; color: #fff; animation: flipInXtbg1 1s .2s ease both infinite; -webkit-animation: flipInXtbg1 1s .2s ease both infinite; -moz-animation: flipInXtbg1 1s .2s ease both infinite;}

.section6 {background: #BE96EE;padding: 2.3rem 0 0.8rem;position: relative}

.section6 .bt{position: absolute;left: 0;top: 0.25rem;z-index: 1}

.box5_t{text-align:center; height:2rem; position: relative;}

.box5_t img{width:5.1rem; position:absolute; left: 12%; z-index:1;}

.section6 .btnc{ margin-bottom: 0; margin-top:4%; overflow: hidden; padding:0 4% 2%;}

.section6 .btnc .btn{margin:0; width:47%;font-size: 0.25rem;}

.section6 .btnc .btn.fl{background:#7745c3; color:#fff; animation: flipInXtbg1 1s .2s ease both infinite; -webkit-animation: flipInXtbg1 1s .2s ease both infinite; -moz-animation: flipInXtbg1 1s .2s ease both infinite;}

.section6 .btnc .btn.fr{background:#FFD200; }

.section6 .bor{ width: 100%;height: 10px;}

.rj_c{width: 90%;margin:0 auto 3%;padding: 1% 2%;position: relative;background: #fff;border-radius: 0.15rem}

.rj_c1{padding: 3% 0; border-bottom: 1px dashed #dedede; overflow: hidden;}

.rj_c1 .rj_p1{width: 20%;border-radius: 50%;overflow: hidden; float: left; text-align: center;-moz-box-shadow:2px 2px 5px #838AD8; -webkit-box-shadow:2px 2px 5px #838AD8; box-shadow:2px 2px 5px #838AD8;}

.rj_c1 .text{width: 78%;float: right}

.rj_c1 .text h3{font-size: 0.3rem;color: #3d3d3d;text-align: left}

.rj_c1 .text h3 span{display: inline-block;font-size: 0.22rem;background: #9995E4;color: #fff;font-weight: normal;border-radius: 0.3rem;padding: 0.5% 3%}

.rj_c1 ul{ width: 100%;overflow: hidden}

.rj_c1 ul li{width:62%; float: left;font-size: 0.18rem; line-height: 2.2; color: #666;}

.rj_c1 ul li font,.rj_c1 ul li span{color: #9995E4;}

.rj_c1 ul li:nth-child(2){width: 38%}

.rj_c2{padding: 3% 0 5%;}

.rj_c2 p{font-size: 0.18rem; color: #999; line-height: 1.7; margin-bottom: 3%;}

.rj_c2 p span{color: #ed2b2b;}

.rj_c2 video{vertical-align: top}

.box_cs{width: 93.75%; margin:0 auto; position:relative; height:3rem;}

.box_cs img{position:absolute; top: -0.4rem;}

.bts { width:100%; z-index: 999; position:absolute; bottom: 8%; }

.bts a { height: 50px; line-height: 50px; text-align:center; margin: 0 1%; font-size: 0.23rem; }

.bts .fl { width:48%; background: url(../images/btl.png) no-repeat center bottom; background-size: 100%; color:#fff; }

.bts .fr { width:48%;background: url(../images/btr.png) no-repeat center bottom; background-size: 100%; color:#000; }

.section7 {background: #FEFEFE;padding-top: 3%}

.section7 a{width: 45%;font-size: 0.26rem;margin-top: 0}

.section8 h2 strong{color: #8424b1;font-size: 0.5rem}

.section8 img{display: block;margin-top: 0.3rem}

.section8 .text{overflow: hidden}

.section8 .text div{width: 48%;font-size: 0.22rem;color: #333;text-align: center;padding-top: 0.1rem}

.section8 a.btn{width: 55%;background: #4EC2D7; animation: flipInXtbg3 1s .2s ease both infinite; -webkit-animation: flipInXtbg3 1s .2s ease both infinite; -moz-animation: flipInXtbg3 1s .2s ease both infinite;}

.section8 a.btn img{display: inline-block;margin-top: 0}

.section9 .over{margin-bottom: 0.3rem}

.section9 .over div{width: 48%;}

.section9 .over a{display: block;height: 0.8rem;line-height: 0.8rem;background: url("../images/bg5.jpg") no-repeat bottom center;background-size: 100%;font-size: 0.25rem;color: #fff;text-align: center;margin-top: 0.15rem}

.section9 .over .fr a{background: url("../images/bg6.jpg") no-repeat bottom center;background-size: 100%;}

@-webkit-keyframes flipInXt{

    0%{box-shadow: 0 0 0 0 #FCDD34;}

    100%{box-shadow: 4px 3px 0 0 #FCDD34;}

}

@-webkit-keyframes flipInXtbg1{

    0%{box-shadow: 0 0 0 0 #7745C3;}

    100%{box-shadow: 4px 3px 0 0 #7745C3;}

}

@-webkit-keyframes flipInXtbg2{

    0%{box-shadow: 0 0 0 0 #F05AA5;}

    100%{box-shadow: 4px 3px 0 0 #F05AA5;}

}

@-webkit-keyframes flipInXtbg3{

    0%{box-shadow: 0 0 0 0 #4EC2D7;}

    100%{box-shadow: 4px 3px 0 0 #4EC2D7;}

}

@keyframes ban_btn

{

    0% {right: 5%;}

    50% {right: 8%;}

    100% {right: 5%;}

}

@-webkit-keyframes ban_btn

{

    0% {right: 5%;}

    50% {right: 8%;}

    100% {right: 5%;}

}

@keyframes bounceinR {

    0% {

        opacity:1;

        -webkit-transform:translateX(200px)

    }

    60% {

        -webkit-transform:translateX(-30px)

    }

    80% {

        -webkit-transform:translateX(10px)

    }

    100% {

        opacity:1;

        -webkit-transform:translateX(0)

    }

}

@-webkit-keyframes showh{

    0% {opacity:1;}

    49% {opacity:1;}

    50% {opacity:0;}

    100% {opacity: 0;}

}

@-moz-keyframes showh{

    0% {opacity:1;}

    49% {opacity:1;}

    50% {opacity:0;}

    100% {opacity: 0;}

}

@-ms-keyframes showh{

    0% {opacity:1;}

    49% {opacity:1;}

    50% {opacity:0;}

    100% {opacity: 0;}

}

@-o-keyframes showh{

    0% {opacity:1;}

    49% {opacity:1;}

    50% {opacity:0;}

    100% {opacity: 0;}

}



.section9{padding:1% 0 6% 0;}

.section9 h2{padding-bottom:2%;}

.hd{text-align: center;padding-top: 3%}

.hd li{display: inline-block;width: 8px;height: 8px;border-radius: 50%;background: #BCBCBC}

.hd li.on{background:#504CAF}