﻿* {
    margin: 0px;
    padding: 0px;
}

body {
    margin: 0px;
    padding: 0px;
}

p {
    margin: 0px;
    padding: 0px;
}




/*修改导航条的背景颜色*/
/*.section-nav.active {
    background-color: #4E7EF5;
}
*/
.section-nav .nav-bar .nav-link .text {
    color: #ffffff;
}

/*.section-nav .nav-bar .nav-link:hover .text {
    color: #fff;
}

.section-nav:hover .nav-bar .nav-link .text::after {
    background: none !important;
}
*/
/*banner*/

.section-header {
    position: relative;
    background-image: url(/lib/JdContent/images/index/banner-bg.jpg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 100%;
    height: 640px;
    margin-top: 72px;
}
.container-index {
    position: relative;
    max-width: 1440px !important;
    min-width: 1440px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 auto;
}
.section-banner-banner {
    width: 1280px;
/*    height: 572px;*/
    margin: 0 auto;
    position: relative;
    top: 0;
}
.bannertext1 {
    font-size: 72px;
    color: #2347FC;
    letter-spacing: 0;
    line-height: 64px;
    font-weight: 700;
    padding-top: 160px;
}
.bannertext2 {
    font-size: 36px;
    color: #696969;
    letter-spacing: 0;
    line-height: 32px;
    font-weight: 500;
    margin-top: 32px;
}
.banner-btn {
    background-image: linear-gradient(270deg, #776EE3 0%, #2D4FF2 100%);
    border-radius: 32px;
    margin-top: 64px;
    width: 200px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 24px;
    color: #FFFFFF;
    text-align: center;
    line-height: 24px;
    font-weight: 400;
}
.banner-btn-arrow {
    width: 32px;
    height: 32px;
    margin-left: 8.5px;
}

.banner-img {
    position: absolute;
    right: -80px;
    top: 0;

}
/*优势*/
.section-advantage {
    background: #F5F9FF;
    width: 100%;
    height: 632px;
    position: relative;
    padding: 80px 0;
}
.advantage-text {
/*    width: 426px;*/
    height: 48px;
    margin: 0 auto;
    font-size: 36px;
    color: #262626;
    line-height: 48px;
    text-align: center;
    margin-bottom: 64px;
/*    font-weight: 500;*/
}
.advantage-text1 {
    color: #2347FC;
}

.advantage-wrapper {
    width: 1440px;
    height: 360px;
    display: flex;
    justify-content: space-between;
}
.advantage-inner {
    width: 330px;
    height: 360px;
    background-image: linear-gradient(270deg, #89A3F0 0%, #417CF1 100%);
    border-radius: 16px;
    position: relative;
}
.advantage-inner-text {
    margin-top: 36px;
    margin-left: 36px;
}
.advantage-inner-text1 {
    font-size: 24px;
    color: #FFFFFF;
    line-height: 22px;
    font-weight: 700;
    margin-bottom: 16px;
}
.advantage-inner-text2 {
    font-size: 18px;
    color: #FFFFFF;
    line-height: 24px;
    font-weight: 500;
}
.advantage-inner-img {
    width: 150px;
    height: 150px;
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 2;
}
.advantage-inner-bottom {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 240px;
    background-image: linear-gradient(179deg, #D6E2FF 0%, #FFFFFF 100%);
    border-radius: 16px;
    padding: 80px 36px 72px 36px;
    font-size: 16px;
    color: #454545;
    line-height: 22px;
    font-weight: 400;
}

/*搭建*/
.section-build {
    background: #FFFFFF;
    width: 100%;
    height: 1110px;
    position: relative;
    padding-top: 80px;
}
.build-text {
    margin-bottom: 0px;
}
.build-wrapper1 {
    width: 100%;
    display: flex;
    justify-content: center;
}
.build-inner {
    width: 100px;
    margin-top: 64px;
    margin-bottom: 64px;
    text-align: center;
    font-size: 18px;
    color: #262626;
    line-height: 26px;
    font-weight: 400;
}
.build-inner:not(:last-child){
    margin-right: 40px;
}
.build-inner-img {
    width: 100px;
    height: 100px;
    margin-bottom: 24px;
}
.build-inner:hover > p {
    color: #0057FE;
}
.build-inner:hover > .build-inner-img {
    border: 1px solid #0057FE;
    border-radius: 20px;
}
.build-wrapper2 {
    width: 100%;
    height: 695px;
    background-image: linear-gradient(0deg, rgba(234,241,254,0.00) 0%, #D1DFFC 100%);
    border-radius: 36px 36px 0px 0px;
    position: relative;
}
.build-wrapper2-img {
    width: 1312px;
    height: 640px;
    position: absolute;
    top: 64px;
    left: 64px;
}

/*问题*/
.section-problem {
    background: #F5F9FF;
    width: 100%;
    height: 1108px;
    position: relative;
    padding: 80px 0;
}
.problem-wrapper {
    background-image: linear-gradient(269deg, rgba(234,241,254,0.00) 0%, #D1DFFC 100%);
    border-radius: 36px 0px 0px 36px;
    width: 100%;
    height: 836px;
    padding: 64px 64px 64px 160px;
    display: flex;
    justify-content: space-between;
}
.problem-title {
    width: 64px;
    height: 644px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    font-size: 18px;
    color: #262626;
    font-weight: 400;
}
.problem-title-inner {
    width: 64px;
    height: 64px;
    background: #FFFFFF;
    padding: 8px;
    border-radius: 50%;
    margin-bottom: 24px;
}
.problem-title-img {
    width: 100%;
    height: 100%;
}
/*.problem-title > div:hover > .problem-title-inner {
    background: #0057FE;
}
.problem-title > div:hover {
    color: #0057FE;
}*/
.problem-title-active > .problem-title-inner {
    background: #0057FE;
}

.problem-title-active {
    color: #0057FE;
}
.problem-inner {
    padding: 64px;
    width: 978px;
    height: 708px;
    background: #FFFFFF;
    font-size: 24px;
    color: #292929;
    line-height: 32px;
    font-weight: 700;
    display: none;
}
.problem-inner-active {
    display: block;
}
.problem-inner-img {
    margin-top: 32px;
    width: 850px;
    height: 484px;
}
.section-function {
    background: #FFFFFF;
    width: 100%;
    height: 872px;
    position: relative;
    padding: 80px 0;
}
.function-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.function-inner1 {
    width: 880px;
    height: 586px;
    background: url(/lib/JdContent/images/index/4-1.png) 100% 100%;
    padding: 64px;
}
.function-inner2 {
    width: 520px;
    height: 586px;
    background: url(/lib/JdContent/images/index/4-2.png) 100% 100%;
    padding: 64px;
    position: relative;
}
.function-inner1-d1 {
    border: 1px solid rgba(255,255,255,1);
    border-radius: 16px;
    width: 120px;
    height: 36px;
    font-size: 18px;
    color: #FFFFFF;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 64px;
}
.function-inner1-d2 {
    font-size: 24px;
    color: #FFFFFF;
    font-weight: 400;
    margin-bottom: 64px;
}
.function-inner1-d3 {
    font-size: 18px;
    color: #FFFFFF;
    font-weight: 400;
    margin-bottom: 64px;
}
.function-inner1-d4 {
    background: #FFFFFF;
    border-radius: 32px;
    width: 200px;
    height: 64px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    color: #000000;
    text-align: center;
    line-height: 24px;
    font-weight: 400;
}
.function-inner2-d2 {
    font-size: 36px;
    color: #FFFFFF;
    font-weight: 400;
    width: 335px;
    height: 150px;
    position: absolute;
    bottom: 64px;
    left: 64px;
}

/*丰富套件*/
.section-system {
    width: 100%;
    height: 712px;
    padding: 80px 0 95px;
}
.system-text {
    margin-bottom: 59px !important;
}
.swiper {
    height: 430px;
}
.system-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.system-inner {
    width: 330px !important;
    height: 430px;
    padding: 32px;
    user-select: none; /* 标准语法 */
    -webkit-user-select: none; /* Chrome/Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
}
.system-inner-text1 {
    font-size: 24px;
    color: #292929;
    font-weight: 500;
}
.system-inner-text2 {
    font-size: 16px;
    color: #454545;
    font-weight: 400;
}
.system-inner1 {
    background: url(/lib/JdContent/images/index/5-1.png) 100% 100% no-repeat;
}
.system-inner2 {
    background: url(/lib/JdContent/images/index/5-2.png) 100% 100% no-repeat;
}
.system-inner3 {
    background: url(/lib/JdContent/images/index/5-3.png) 100% 100% no-repeat;
}
.system-inner4 {
    background: url(/lib/JdContent/images/index/5-4.png) 100% 100% no-repeat;
}

/*海量模板*/
.section-template {
    width: 100%;
    height: 712px;
    padding: 80px 0 85px;
    background-image: linear-gradient(179deg, rgba(234,241,254,0.00) 0%, #D1DFFC 100%);
}
.template-wrapper {
    width: 100%;
    height: 440px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.template-inner {
    margin-bottom: 40px;
    width: 330px;
    height: 120px;
    padding: 20px 0px 20px 54px;
    display: flex;
    align-items: center;
    background: #FFFFFF;
    border-radius: 16px;
}
.template-inner > img {
    width: 80px;
    height: 80px;
    margin-right: 30px;
}
.template-p1 {
    font-size: 24px;
    color: #292929;
    font-weight: 500;
    margin-bottom: 12px;
}
.template-p2 {
    font-size: 16px;
    color: #454545;
    font-weight: 400;
}

/* 完美适配 各行各业*/
.section-universal {
    width: 100%;
    height: 692px;
    padding: 80px 0;
}
.universal-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.universal-inner1, .universal-inner2 {
    position: relative;
    width: 330px;
    height: 420px;
    margin-right: 40px;
}
.universal-inner1 > img {
    width: 100%;
    height: 100%;
    position: relative;
}
.universal-inner-tip {
    position: absolute;
    width: 100%;
    height: 64px;
    left: 0;
    bottom: 0;
    background-image: linear-gradient(270deg, #776EE3 0%, #2D4FF2 100%);
    border-radius: 0px 0px 10px 10px;
    font-size: 20px;
    color: #FFFFFF;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
}
.universal-inner3 {
    width: 700px;
    height: 420px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
}
.universal-inner3-inner {
    width: 330px;
    height: 190px;
    position: relative;
}
.universal-inner3-inner> img {
    width: 100%;
    height: 100%;
    position: relative;
}

/*服务支持*/
.section-support {
    width: 100%;
    height: 740px;
    padding: 80px 0;
    background: #F9FBFF;
}
.support-wrapper {
    background: #F3F7FF;
    border: 1px solid rgba(228,236,255,1);
    border-radius: 36px;
    width: 100%;
    height: 468px;
    display: flex;
/*    align-items: center;*/
    justify-content: space-between;
    padding-top: 61px;
    padding-left: 100px;
}
.support-inner1 {
    padding-top: 19px;
}
.support-inner2 {
    width: 588px;
    height: 385px;
}
.support-inner1-p1 {
    font-size: 36px;
    color: #292929;
    line-height: 48px;
    font-weight: 500;
    margin-bottom: 16px;
}
.support-inner1-p2 {
    font-size: 14px;
    color: #454545;
    line-height: 22px;
    font-weight: 400;
    margin-bottom: 45px;
}
.support-inner1-wrapper {
    width: 580px;
    height: 160px;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
}

.support-inner1-wrapper-inner {
    width: 290px;
    height: 60px;
/*    padding: 20px 0px 20px 54px;*/
    display: flex;
    align-items: center;
/*    background: #FFFFFF;*/
/*    border-radius: 16px;*/
}
.support-inner1-wrapper-inner > img {
    width: 64px;
    height: 64px;
    margin-right: 16px;
}
.support-inner1-wrapper-inner-p1 {
    font-size: 16px;
    color: #454545;
    line-height: 24px;
    font-weight: 500;
    margin-bottom: 8px;
}
.support-inner1-wrapper-inner-p2 {
    font-size: 14px;
    color: #999999;
    line-height: 22px;
    font-weight: 400;
}

/*版本*/

.section-version {
    width: 100%;
    height: 832px;
    background-image: linear-gradient(176deg, #F1F0FF 3%, #D7E1FF 97%);
    padding: 80px 0;
}
.version-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.version-inner {
    width: 450px;
    height: 560px;
    padding: 64px 40px;
    position: relative;
}
.version-inner1 {
    background: url(/lib/JdContent/images/index/9-1.png) 100% 100%;
}
.version-inner2 {
    background: url(/lib/JdContent/images/index/9-2.png) 100% 100%;
}
.version-inner3 {
    background: url(/lib/JdContent/images/index/9-1.png) 100% 100%;
}
.version-p1 {
    font-size: 24px;
    color: #000000;
    font-weight: 400;
    margin-bottom: 12px;
}
.version-p2 {
    font-size: 16px;
    color: #000000;
    font-weight: 400;
    margin-bottom: 64px;
}
.version-buy {
    width: 200px;
    height: 64px;
    background: #FFFFFF;
    border-radius: 32px;
    position: absolute;
    left: 40px;
    bottom: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #000000;
    text-align: center;
    line-height: 24px;
    font-weight: 400;
}

.section-try {
    padding: 80px 0;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
}
.section-try .experience_btn {
    background-image: linear-gradient(270deg, #776EE3 0%, #2D4FF2 100%);
    border-radius: 32px;
    margin-left: 50px;
    width: 200px;
    height: 64px;
    font-size: 24px;
    color: #FFFFFF;
    text-align: center;
    line-height: 24px;
    font-weight: 400;
}

.section-try .experience_title {
    font-size: 48px;
    color: #FFFFFF;
    letter-spacing: 0;
    line-height: 64px;
    font-weight: 500;
}

@media (min-width: 1500px) {
    .banner-img {
        right: -100px;
    }
}