.wp{max-width: 640px;min-width: 320px;margin: 0 auto;font-size: 12px;color: #000;line-height: 1.5;overflow: hidden}
.over{overflow: hidden;}
.fl{float: left}
.fr{float: right}
.pb{padding-bottom: 0.6rem}
.wp h2{width: 100%;font-size: 0.4rem;color: #000;text-align: center;padding: 0.6rem 0 5% ;line-height: 1.3;}
.wp h2 span{display: block;font-weight: normal;font-size: 0.3rem}
.btn{display: block;width: 60%;height: 0.7rem;line-height: 0.7rem;margin:0.4rem auto 0;text-align: center;color: #000;font-size: 0.27rem;border-radius: 0.5rem;background: #F7CB44}
.btn img{display: inline-block;width: 0.35rem;vertical-align: middle;}
.w20{width: 94%;margin: 0 auto}
#banner_slider li{position: relative}
#banner_slider .ban4{width: 20%;position:absolute; left: 27%; bottom: 15%;}
#banner_slider .ban4 a{display: block; position:relative; z-index: 5; width: 100%; transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
#banner_slider .ban4 span{display:block; width: 1.28rem; height: 1.28rem; background: rgba(255,255,255,0.3); border-radius: 50%; position:absolute; left: 0; top:0; }
.b1{
    -webkit-animation:kuosan 2s linear infinite;
    -moz-animation:kuosan 2s linear infinite;
    animation:kuosan 2s linear infinite;
}
.b2{
    -webkit-animation:kuosan 2s linear 0.5s infinite;
    -moz-animation:kuosan 2s linear 0.5s infinite;
    animation:kuosan 2s linear 0.5s infinite;
}
.b3{
    -webkit-animation:kuosan 2s linear 1s infinite;
    -moz-animation:kuosan 2s linear 1s infinite;
    animation:kuosan 2s linear 1s infinite;
}
@-webkit-keyframes kuosan {
    from {
        opacity:1;
        -webkit-transform:scale(0) translate3d(0,0,0)
    }
    to {
        opacity:0;
        -webkit-transform:scale(2) translate3d(0,0,0)
    }
}
@-moz-keyframes kuosan {
    from {
        opacity:1;
        -moz-transform:scale(0) translate3d(0,0,0)
    }
    to {
        opacity:0;
        -moz-transform:scale(2) translate3d(0,0,0)
    }
}
@-o-keyframes kuosan {
    from {
        opacity:1;
        -o-transform:scale(0) translate3d(0,0,0)
    }
    to {
        opacity:0;
        -o-transform:scale(2) translate3d(0,0,0)
    }
}
@keyframes kuosan {
    from {
        opacity:1;
        transform:scale(0) translate3d(0,0,0)
    }
    to {
        opacity:0;
        transform:scale(2) translate3d(0,0,0)
    }
}
.section1{background: #E3EBFC}
.section1 dl{width: 48%;background: #fff;font-size: 0.22rem;color: #787878;border-radius: 0.1rem}
.section1 dd{width: 88%;height: 1.1rem;margin: 0 auto;padding-top: 5%}
.section1 .hd{text-align: center}
.section1 .hd li{display: inline-block;width: 8px;height: 8px;border-radius: 50%;border: 1px solid #757288;}
.section1 .hd li.on{background: #757288}
.section1 a.btn,.section4 a.btn,.section5 a.btn,.section7 a.btn{width: 48%;}
.section1 a.fr,.section4 a.fr,.section5 a.fr,.section7 a.fr{background: #6855FE;color: #fff}
.section2{background: #77ABF2;}
.section2 h2{color: #fff}
.section2 .over div{width: 48%;}
.section2 .over dl{width: 91%;border: 1px dashed #fff;border-radius: 0.2rem;margin-bottom: 0.3rem;padding: 4%}
.section2 .over dl dd{width: 90%;margin: 0 auto;background: #5977E6;font-size: 0.23rem;color: #fff;padding: 5%;border-bottom-right-radius: 0.2rem;border-bottom-left-radius: 0.2rem}
.section2 .over dl dd h3{font-size: 0.3rem;font-weight: normal}
.section2 a{display: block;margin-top: 4%}
.section3 h2{padding-top: 0.4rem}
.section4{background: url("../images/bg1.jpg") no-repeat top center;background-size: 100%}
.section4 h2{color: #fff}
.section4 h2 i{display: block;width: 0.5rem;height: 0.1rem;background: #fff;margin: 3% auto}
.section4 h2 p{font-size: 0.25rem;font-weight: normal}
.section4 h2 p b{color: #f7cb44;font-size: 0.23rem}
.section4 #scroll2,.section7 #scroll4{position: relative}
.section4 .bd li {overflow: hidden}
.section4 .bd li img{display: block;width: 50%;float: left}
.section4 .qh,.section7 .qh{display: block;width: 6%;position: absolute;top: 41%;z-index: 1}
.section4 .prev,.section7 .prev{left: 3%}
.section4 .next,.section7 .next{right: 3%}
.section5 ul{width: 90%;margin: 0 auto;display: flex}
.section5 ul li{flex: 1;margin-right: 2%;height: 0.5rem;line-height: 0.5rem;color: #fff;text-align: center;font-size: 0.26rem;background: #B0B0B0}
.section5 ul li:last-child{margin-right: 0}
.section5 .video {z-index: 0;background: url(/video/ipad.png) no-repeat center;-webkit-background-size: 96%;background-size: 96%;overflow: hidden;}
.v_main{width:320px; height:240px; margin:15px auto 22px;}
video::-internal-media-controls-download-button {display:none;}
video::-webkit-media-controls-enclosure {overflow:hidden; }
video::-webkit-media-controls-panel {width: calc(100% + 30px);}
@media only screen and (min-width:320px) and (max-width:330px){
    .video {-webkit-background-size:100%;background-size:100%;}
}
@media only screen and (min-width:400px) and (max-width:420px){
    .video {-webkit-background-size: 95%;background-size: 95%;}
}
@media only screen and (min-width:370px) and (max-width:375px){
    .video {-webkit-background-size: 95%;background-size: 95%;}
}
@media only screen and (min-width:340px) and (max-width:365px){
    .video {-webkit-background-size: 94%;background-size: 94%;}
}

.section5 .btn{margin-top: 5%}
.section6 dl{position: relative}
.section6 dl dd{width: 94%;position: absolute;left: 3%;bottom: 6%;z-index: 1;font-size: 0.22rem;color: #383838;line-height: 1.3}
.section6 dl dd h3{font-size: 0.35rem;font-weight: normal;margin-bottom: 1%}
.section6 .bd dl.dl1 dd{width: 60%;left: 39%;}
.section6 .bd dl.dl1 dd h3{font-size: 0.26rem}
.section6 .bd dl.dl2 dd {bottom: 10%}
.section6 .bd dl.dl2 dd h3{margin-bottom: 2%}
.section6 .bd dl.dl2 dt{position: relative}
.section6 .bd dl.dl3 dt p{width: 48%;position: absolute;right: 2%;top: 4.2%;z-index: 1;overflow: hidden}
.section6 .bd dl.dl3 dt p img{display: block;width: 120%;margin: 0 auto}
.section6 .hd{display: flex;margin-bottom: 2%}
.section6 .hd li{flex: 1;margin-right: 2%;height: 0.6rem;line-height: 0.6rem;font-size: 0.28rem;text-align: center;color: #fff;background: #B0B0B0}
.section6 .hd li.on{background: #77ABF2}
.section6 .hd li.on{background: #77ABF2}
.section6 a{width: 70%;}
.section7{background: #77ABF2}
.section7 h2{color: #fff}
.section7 .bd li{position: relative}
.section7 .bd li img:nth-child(2){display: block;width: 48.5%;position: absolute;right: 1%;top: 1.5%;z-index: 1}
.section8 {background: #E3EBFC}
.section8 #scroll5{width: 73%;position: relative;margin-left: 28%}
.section8 .hd{width: 36%;position: absolute;left: -40%;top: 0;z-index: 1;}
.section8 .hd li{height: 0.65rem;line-height: 0.65rem;font-size: 0.26rem;text-align: center;color: #fff;background: #ACACAC;margin-bottom: 0.2rem}
.section8 .hd li.on{background: #77ABF2}
.section8 .bd dl{background: #fff}
.section8 .bd dl dd{width: 94%;margin: 0 auto;font-size: 0.21rem;color: #2b2b2b;padding: 2% 0 3%}
.section8 a{margin-top: 2%}
.section9 .over div{width: 48.5%}
.section9 .over a{display: block;height: 0.7rem;line-height: 0.7rem;font-size: 0.24rem;color: #314d73;text-align: center;border-radius: 0.1rem;margin-bottom: 5%;background: #C4D9F6}
.section9 .over .fl a{background: #CCC5ED;color: #41396a}
@keyframes movement {
    0% {  -webkit-transform: translate(0px,-3px);  transform: translate(0px,-3px);  }
    25% {  -webkit-transform: translate(3px,6px);  transform: translate(3px,6px);  }
    50% {  -webkit-transform: translate(6px,10px);  transform: translate(6px,10px);  }
    75% { -webkit-transform: translate(8px,0px);  transform: translate(8px,0px);  }
    100% {  -webkit-transform: translate(0px,-3px);  transform: translate(0px,-3px);  }
}
@-webkit-keyframes showb{
    0%,100%,20%,50%,80% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    40% {
        -webkit-transform: translateX(6px);
        transform: translateX(6px)
    }
    60% {
        -webkit-transform: translateX(3px);
        transform: translateX(3px)
    }
}