@charset "utf-8";
.banner {
    height: 700px;
    background: url("../images/banner-bg.png") no-repeat bottom center;
    background-size: cover;
    overflow: hidden;
}

.banner-center {
    padding-top: 145px;
}

.banner-center h1 {position:relative;
    font-size: 60px;
    color: #24283B;text-indent:-73px;
    text-align: center;
    line-height: 1.5;
}
.banner-center h1 span{
    position:absolute;right:320px;width:82px;text-indent:0px;top:10px;
}
.banner-center h1 span i{
    background:url(../images/bblx.png);width:82px;height:35px;color:#ffffff;font-size:12px;float:left;line-height:26px;font-weight:bold;
}
.banner-center h1 span em{float:left;font-size:16px;}
.banner-center h2 {
    font-size: 24px;
    color: #2C344A;
    text-align: center;
    line-height: 1.5;
    margin-top: 18px;
}

.banner-p {
    font-size: 16px;
    color: #565F78;
    text-align: center;
    line-height: 1.5;
    margin-top: 10px;
}

.banner-btn {
    display: block;overflow:hidden;
    width: 300px;
    height: 100px;
    background: #288afd;
    /*background: linear-gradient(135deg, rgba(87, 216, 254, 1), rgba(87, 216, 254, 1));*/
    box-shadow: 0px 7px 24px 0px rgba(87, 216, 254, 0.3);
    /*border-radius: 10px;*/
    font-size: 0;
    text-align: center;
    margin: 45px auto 0;
}

.banner-btn:hover {
    background: #288afd;
    /*background: linear-gradient(135deg, rgba(87, 216, 254, 1), rgba(87, 216, 254, 1));*/
}

/*.banner-btn:after{position:absolute;display:block;content:'';top:50%;left:50%;background:rgba(255,255,255,0.3);width:680px;height:680px;border-radius:50%;margin-left:-340px;margin-top:-340px;animation:spread 1.5s infinite both;-webkit-animation:spread 1.5s infinite both;-moz-animation:spread 1.5s infinite both;-o-animation:spread 1.5s infinite both;z-index:1;}
@keyframes spread{0%{transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0);} 100%{transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}}
@-webkit-keyframes spread{0%{transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0);} 100%{transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}}
@-moz-keyframes spread{0%{transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0);} 100%{transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}}
@-o-keyframes spread{0%{transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0);} 100%{transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}}

*/

.banner-btn span {
    display: inline-block;
    font-size: 28px;
    color: #fff;
    padding-left: 51px;
    line-height: 100px;
    /*background: url("../images/icon_xz_xia.png") no-repeat;*/
    background-position-x: 3px;
    background-position-y: 50px;
    position: relative;text-indent:30px;
}

.banner-btn span i {
    position: absolute;
    top: 30px;
    left: 15px;
    width: 56px;
    height: 56px;
    background: url("../images/icon_xz_shang.png") no-repeat;
/*    animation: dwon 1s infinite;
    -webkit-animation: dwon 1s infinite;
    -moz-animation: dwon 1s infinite;*/
}

@keyframes dwon {
    0%,
    100% {
        top: 16px;
    }
    50% {
        top: 24px;
    }
}

@-webkit-keyframes dwon {
    0%,
    100% {
        top: 16px;
    }
    50% {
        top: 24px;
    }
}

@-moz-keyframes dwon {
    0%,
    100% {
        top: 16px;
    }
    50% {
        top: 24px;
    }
}

.Edition-list {
    text-align: center;
    margin-top: 15px;
}

.Edition-list li {
    display: inline-block;
    font-size: 12px;
    color: #3F4965;
    line-height: 1.5;
    padding: 0 8px;
}

.banner-nub {
    color: #4A5164;
    font-size: 24px;
    line-height: 1.5;
    text-align: center;
    margin-top: 22px;
}

.function-list {
    margin: 40px -40px 0;
}

.function-list li {
    width: 12.5%;*width:20%;
    float: left;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    position: relative;
    top: 0;
}

.function-list li:hover {
    top: -10px;
}

.function-list li img {
    display: block;
    margin: 0 auto;
}

.function-list li p {
    margin-top: 14px;
    line-height: 1;
    text-align: center;
    color: #333333;
    font-size: 16px;
}

.banner-img {
    margin-top: -320px;
    padding-bottom: 30px;
    position: relative;
    z-index: 2;
}

.banner-video {
    width: 1024px;
    margin: 0 auto;
    display: block;
    animation: videotop .4s 1s both;
    -webkit-animation: videotop .4s 1s both;
}

.banner-nub-list {
    margin-top: 30px;
    text-align: center;
}

.banner-nub-list li {
    color: #6C6C6C;
    line-height: 1.5;
    font-size: 18px;
    display: inline-block;
    padding: 0 15px;
}

.banner-nub-list li span {
    color: #5265FE;
}

.banner-img .tips {
    color: #999999;
    font-size: 14px;
    line-height: 1.5;
    margin-top: 6px;
    text-align: center;
}

.core-list {
    margin-top: 50px;
}

.core-list li {
    width: 23.75%;
    float: left;
}

.core-list li+li {
    margin-left: 1.33%;
}

.core-list li div {
    padding: 25px 22px;
    background: #FDFEFF;
    box-shadow: 0px 0px 27px 1px rgba(17, 25, 46, 0.12);
    /* transition: all .3s; */
    position: relative;
    top: 0;
}

.core-list li div:hover {
    /* top: -10px; */
    box-shadow: 0px 0px 27px 1px rgba(17, 25, 46, 0.2);
}

.core-list li div img {
    display: block;
    margin: 0 auto;
}

.core-list li div h3 {
    color: #333333;
    line-height: 1.5;
    margin-top: 35px;
    text-align: center;
    font-size: 18px;
}

.core-list li div p {
    font-size: 14px;
    color: #666666;
    text-align: center;
    line-height: 1.6;
    margin-top: 10px;
}


.index-line {
    position: relative;
    z-index: 2;
}

.index-img {
    float: left;
    width: 62.5%;
}

.index-img img {}

.index-img img.gif {
    width: 640px;
    box-shadow: 0px 3px 24px 0px rgba(7, 17, 43, 0.37);
}

.index-text {
    width: 37.5%;
    float: left;
    padding-top: 70px;
}

.index-text h3 {
    font-size: 32px;
    color: #333333;
    line-height: 1.5;
    position: relative;
}



.index-text h3 span {
    color: #3F43F7;
}

.index-text p {
    font-size: 14px;
    color: #697187;
    line-height: 1.6;
    margin-top: 20px;font-size:22px;
}

.index-text .down-btn {
    margin-top: 65px;
}

.index-line-center>p {
    font-size: 16px;
    color: #999EAA;
    text-align: center;
    margin-top: 20px;
    line-height: 1.5;
}





.function-list li:nth-child(1) {margin-left:18.55%;
    animation: typetop .6s both;
    -webkit-animation: typetop .6s both;
}

.function-list li:nth-child(2) {
    animation: typetop .6s .1s both;
    -webkit-animation: typetop .6s .1s both;
}

.function-list li:nth-child(3) {
    animation: typetop .6s .2s both;
    -webkit-animation: typetop .6s .2s both;
}

.function-list li:nth-child(4) {
    animation: typetop .6s .3s both;
    -webkit-animation: typetop .6s .3s both;
}

.function-list li:nth-child(5) {
    animation: typetop .6s .4s both;
    -webkit-animation: typetop .6s .4s both;
}

.function-list li:nth-child(6) {
    animation: typetop .6s .5s both;
    -webkit-animation: typetop .6s .5s both;
}

.function-list li:nth-child(7) {
    animation: typetop .6s .6s both;
    -webkit-animation: typetop .6s .6s both;
}

.function-list li:nth-child(8) {
    animation: typetop .6s .7s both;
    -webkit-animation: typetop .6s .7s both;
}

@keyframes typetop {
    0% {
        transform: translateY(120px);
        -webkit-transform: translateY(120px);
    }
    100% {
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@-webkit-keyframes typetop {
    0% {
        transform: translateY(120px);
        -webkit-transform: translateY(120px);
    }
    100% {
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@keyframes videotop {
    0% {
        opacity: 0;
        transform: translateY(70px);
        -webkit-transform: translateY(70px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@-webkit-keyframes videotop {
    0% {
        opacity: 0;
        transform: translateY(70px);
        -webkit-transform: translateY(70px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

.bg-img4 {
    
}




.new_question {
  width: 1200px;
  margin: 100px auto 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.new_question h3 {
  font-size: 28px;
  color: #000;
  margin-bottom: 49px;
}

.new_question_list {
  width: 1000px;
  margin: 0 auto;
  position: relative;
  border: 3px solid rgba(0, 156, 246, 0.17);
  padding: 44px 64px 22px;
  box-sizing: border-box;
  border-radius: 6px;
  position: relative;
}

.new_question_list ul li {
  color: #666666;
  font-size: 18px;text-align:center;
  margin-bottom: 28px;
  display: flex;
  align-items: center;
}

.new_question_list ul li i {
  width: 30px;
  height: 25px;
  display: inline-block;
  font-style: normal;
  background: url("../images/home_def_question@2x.png") left center no-repeat;
  background-size: 30px 25px;
  padding-left: 7px;
  line-height: 25px;
  color: #fff;
  font-size: 16px;
  margin-right: 20px;
}

.new_question_list img {
  width: 439px;
    height: 304px;
    position: absolute;
    bottom: -171px;
    right: -307px;
}

.new_question_bottom {
  display: flex;
  align-items: center;
  margin-top: 28px;
  width: 1024px;
}

.new_question_bottom img {
  width: 173px;
}

.new_question_bottom .font_24 {
  width: 586px;
  height: 100px;
  background: url("../images/home_def_circle@2x.png") center no-repeat;
  background-size: 586px 100px;
  line-height: 100px;
  padding-left: 56px;
  box-sizing: border-box;
  color: #fff;
  font-size: 24px;
}
