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

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

.banner-center h1 {
    font-size: 46px;
    color: #24283B;
    text-align: center;
    line-height: 1.5;
}

.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;
    width: 286px;
    height: 72px;
    background: #5155FF;
    background: linear-gradient(135deg, rgba(81, 85, 255, 1), rgba(82, 122, 253, 1));
    box-shadow: 0px 7px 24px 0px rgba(14, 16, 100, 0.3);
    border-radius: 36px;
    font-size: 0;
    text-align: center;
    margin: 45px auto 0;
}

.banner-btn:hover {
    background: #3F36FB;
    background: linear-gradient(135deg, rgba(63, 54, 251, 1), rgba(56, 102, 253, 1));
}

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

.banner-btn span i {
    position: absolute;
    top: 20px;
    left: 0;
    width: 19px;
    height: 20px;
    background: url("../images/index/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%;
    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: -680px;
    padding-bottom: 30px;
    position: relative;
    z-index: 2;
}

.banner-video {
    width: 824px;
    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;
}

.bg-img1 {
    position: absolute;
    top: 1308px;
    left: 0;
    z-index: 1;
}

.bg-img2 {
    position: absolute;
    top: 1384px;
    right: 0;
    z-index: 1;
}

.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::after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 32px;
    height: 4px;
    background: #3F43F7;
}

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

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

.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;
}

.index-text.bg-nub1 {
    background: url("../images/index/pic_shuzi_01.png") no-repeat;
    background-position: 150px -20px;
    padding-top: 50px;
}

.bg-nub2 {
    background: url("../images/index/pic_shuzi_12.png") no-repeat;
    background-position: 150px -20px;
}

.function-list li:nth-child(1) {
    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 {
    background: url("../images/index/bg_tx_01.png") no-repeat center center;
}

@media screen and (max-width: 1400px) {
    .function-list {
        margin: 40px 0 0;
    }
}

.five {
    margin-top: 44px;
}

.five-ul {
    margin-top: 50px;
    overflow: hidden;
}

.five-ul li {
    /* display: inline-block; */
    float: left;
    width: 225px;
    height: 192px;
    background: #FFF;
    box-shadow: 0px 9px 20px 1px rgba(191, 191, 191, 0.42);
    text-align: center;
    margin: 0 6px;
}

.five-ul li>img {
    width: 80px;
    height: 55px;
    margin-top: 21px;
}

.five-ul li>h3 {
    font-size: 20px;
    font-family: PingFang SC;
    font-weight: 400;
    color: #333333;
    margin: 24px auto 15px auto;
}

.five-ul li>p {
    font-size: 13px;
    font-family: PingFang SC;
    font-weight: 300;
    color: #666666;
}