.banner-box{
    /*height: 720px;*/
    /*background: url("../images/index/index-banner.png");*/
    /*background-size: 100% 100%;*/
    /*background-position: center center;*/
    overflow: auto;
}
.banner-content{
    height: 626px;
}

.swiper-pagination{
    bottom:100px !important;
}

.swiper-pagination-bulletbanner{
    width: 24px;
    height: 8px;
    opacity: 0.5;
    background: rgba(12,22,38,0.3);
    border-radius: 4px;
    /*float: left;*/
    display:inline-block;
    margin-right: 12px;
}
.pagination-bulletbanner-active{
    width: 40px;
    height: 8px;
    background: #ffffff;
    border-radius: 4px;
}
.swiper-content{
    width: 100%;
    /*height: 100%;*/
    height: 720px;
    /*position: absolute;*/
    /*top: 193px;*/
}
.blue-hint{
    width: 54px;
    height: 5px;
    background: #288dff;
}
.banner-title{
    font-size: 36px;
    font-weight: 600;
    margin-top: 23px;
}
.banner-text{
    font-size: 20px;
    font-weight: 400;
    margin-top: 30px;
}
.experience{
    width: 150px;
    height: 48px;
    box-shadow: 0px 4px 16px 0px rgba(0,127,255,0.4);
    text-align: center;
    line-height: 48px;
    font-size: 16px;
    color:#ffffff;
    font-weight: 500;
    margin-top: 44px;
}
.product-box-index{
    height: 800px;
    background: #ffffff;
    overflow: visible;
}
.value-box{
    height: 154px;
    background: #ffffff;

    padding:0 65px;
    box-sizing: border-box;
}
.value-item{
    width: 302px;
    height: 100%;
    padding-top:36px;
    box-sizing: border-box;
}
.value-img{
    height: 82px;
    width: 82px;
}
.value-dec-box{
    height: 100%;
    margin-left: 20px;
}
.value-title{
    font-size: 18px;
    font-weight: 500;
    color: #191919;
}
.value-dec{
    width: 200px;
    font-size: 14px;
    font-weight: 400;
    color: #5c636d;
    margin-top: 12px;
}
.ml-80{
    margin-left: 80px;
}
.value-box-container{
    height: 154px;
    top:-77px;
    z-index: 2;
    border-radius: 8px;
    box-shadow: 0px 4px 12px 0px rgba(12,53,94,0.11);
}

.product-dec-title{
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    color: #202328;
}
.product-dec-text{
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    color: #5c636d;
    margin-top: 32px;
}
.product-dec-nav-box{
    margin-top: 38px;
    height: 97px;
    display: flex;
    justify-content: center;
}
.product-dec-nav-box .dec-nav-item:not(:first-child){
    margin-left: 100px;
}
.dec-nav-item{
    /*width: 64px;*/
    display: flex;
    flex-direction: column;
    align-items: center;
}
.dec-nav-item-img{
    width: 44px;
    height: 44px;
    /*background: url('../images/logo.png');*/
    /*background-size: cover;*/
}
.bus{
    background: url("../images/index/cxgl-icon.png");
    background-size: cover;
}
.active>.bus{
    background: url("../images/index/cxgl-icon-active.png");
    background-size: cover;
}
.device{
    background: url("../images/index/device.png");
    background-size: cover;
}
.active>.device{
    background: url("../images/index/sbgl-icon-active.png");
    background-size: cover;
}

.catering{
    background: url("../images/index/catering.png");
    background-size: cover;
}

.active>.catering{
    background: url("../images/index/cygl-icon-active.png");
    background-size: cover;
}

.safely{
    background: url("../images/index/safely.png");
    background-size: cover;
}
.active>.safely{
    background: url("../images/index/qyaf-icon-active.png");
    background-size: cover;
}

.synergy{
    background: url("../images/index/cloud.png");
    background-size: cover;
}
.active>.synergy{
    background: url("../images/index/xtbg-icon-active.png");
    background-size: cover;
}

.welfare{
    background: url("../images/index/welfare.png");
    background-size: cover;
}
.active>.welfare{
    background: url("../images/index/ygfl-icon-active.png");
    background-size: cover;
}


.index-board{
    background: url("../images/index/xzzskb-icon.png");
    background-size: cover;
}
.active>.index-board{
    background: url("../images/index/xzzskb-icon-active.png");
    background-size: cover;
}


.report-form{
    background: url("../images/index/user-statement-icon.png");
    background-size: cover;
}
.active>.report-form{
    background: url("../images/index/zdybb-icon-active.png");
    background-size: cover;
}


.data-board{
    background: url("../images/index/data-brand-icon.png");
    background-size: cover;
}
.active>.data-board{
    background: url("../images/index/sjkb-icon-active.png");
    background-size: cover;
}


.path{
    background: url("../images/index/path-icon.png");
    background-size: cover;
}
.active>.path{
    background: url("../images/index/znghxl-icon-active.png");
    background-size: cover;
}


.dormitory{
    background: url("../images/index/dormitory-icon.png");
    background-size: cover;
}
.active>.dormitory{
    background: url("../images/index/zhss-icon-active.png");
    background-size: cover;
}

.wechat{
    background: url("../images/index/company-wechat-icon.png");
    background-size: cover;
}
.active>.wechat{
    background: url("../images/index/qywx-icon-active.png");
    background-size: cover;
}


.dingding{
    background: url("../images/index/dd-icon.png");
    background-size: cover;
}
.active>.dingding{
    background: url("../images/index/dd-icon-active.png");
    background-size: cover;
}



.wechat-public{
    background: url("../images/index/wechat-public-icon.png");
    background-size: cover;
}
.active>.wechat-public{
    background: url("../images/index/wxgzh-icon-active.png");
    background-size: cover;
}


.app{
    background: url("../images/index/app-icon.png");
    background-size: cover;
}
.active>.app{
    background: url("../images/index/app-icon-active.png");
    background-size: cover;
}


.company-bus{
    background: url("../images/index/cxgl-icon.png");
    background-size: cover;
}
.active>.company-bus{
    background: url("../images/index/cxgl-icon-active.png");
    background-size: cover;
}


.company-dormitory{
    background: url("../images/index/index-dormitory-icon.png");
    background-size: cover;
}
.active>.company-dormitory{
    background: url("../images/index/zhss-icon-active.png");
    background-size: cover;
}

.company-private{
    background: url("../images/index/index-private-icon.png");
    background-size: cover;
}
.active>.company-private{
    background: url("../images/index/gcsy-icon-active.png");
    background-size: cover;
}
.company-public{
    background: url("../images/index/index-public-icon.png");
    background-size: cover;
}
.active>.company-public{
    background: url("../images/index/qygwyc-icon-active.png");
    background-size: cover;
}
.company-polling{
    background: url("../images/index/index-polling.png");
    background-size: cover;
}
.active>.company-polling{
    background: url("../images/index/qyxj-icon-active.png");
    background-size: cover;
}
.company-repair{
    background: url("../images/index/index-repairs-icon.png");
    background-size: cover;
}
.active>.company-repair{
    background: url("../images/index/bxgl-icon-active.png");
    background-size: cover;
}
.company-good{
    background: url("../images/index/index-goods-icon.png");
    background-size: cover;
}
.active>.company-good{
    background: url("../images/index/wzgl-icon-active.png");
    background-size: cover;
}

.dec-nav-item-text{
    min-width: 64px;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    color: #5e6b7a;
    margin-top: 16px;
}
.dec-nav-item-indicator{
    width: 64px;
    height: 3px;
    background: #288dff;
    margin-top: 8px;
    display: none;
    animation: headShake 1s linear;
}
.active>.dec-nav-item-indicator{
    display: block;
}



.product-dec-content-box-index{
    margin-top: 50px;
    /*display: none;*/
}
.product-dec-content-title-index{
    font-size: 24px;
    font-weight: 500;
    color: #2f353d;
}
.product-dec-content-dec-index{
    font-size: 16px;
    font-weight: 400;
    color: #5c636d;
    margin-top: 15px;
}
.product-try-btn-index{
    width: 150px;
    height: 48px;
    text-align: center;
    line-height: 48px;
    box-shadow: 0px 2px 10px 0px rgba(0,127,255,0.4);
    font-size: 16px;
    font-weight: 500;
    color: #ffffff;
    margin-top: 45px;
}
.product-dec-content-left-index{
    margin: 69px 0 0 102px;
    display: none;
    /*animation: fadeInLeft 0.6s linear;*/
}
.product-dec-content-dec-index{
    width: 432px;
    letter-spacing: 1px;
}
.product-dec-content-img-index{
    width: 444px;
    /*height: 322px;*/
    display: none;
    margin-right: 123px;
    /*animation: fadeInRight 0.6s linear;*/
}

.data-product-box{
    height: 800px;
    background:  #f5faff;
    overflow: hidden;
}
.data-product-box .product-dec-title{
    margin-top: 80px;
}

.data-product-box .product-dec-content-img{
    margin:0 0 0 100px;
}
.data-product-box .product-try-btn{
    margin-top: 24px;
}

.platform-box{
    height: 800px;
    background: #ffffff;

}
.platform-box .product-dec-title{
    margin-top: 80px;
}
.index-box{
    height: 300px;
    /*background: #f5faff;*/
    overflow: hidden;
}
.mt-80{
    margin-top: 80px;
}
.mb-80{
    margin-bottom: 80px;
}
.index-box .product-dec-text{
    margin-top: 16px;
}
.index-box .product-dec-nav-box{
    margin-top: 30px;
}
.index-content-box{
    height: 720px;
    background: #ffffff;
}
.index-number-box{
    margin-top: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.index-number-title{
    font-size: 24px;
    font-weight: 500;
    line-height: 56px;
    height: 56px;
    color: #202328;
    margin: 0 32px 0 28px;
}

.index-number-box .index-number-item:not(:last-child){
    margin-right: 8px;
}
.index-number-item{
    width: 36px;
    height: 56px;
    background: #288dff;
    line-height: 56px;
    text-align: center;
    font-size: 42px;
    font-weight: 700;
    color: #ffffff;
}
.line-img{
    height: 4px;
    width: 265px;
}
.ml-28{
    margin-left: 28px;
}
.index-content-img{
    /*width: 300px;*/
    width: 900px;
    height: 494px;
}
.index-swiper-container{
    width: 950px;
    margin: 30px 0 81px 150px;
    /*overflow: hidden;*/
}

.blue-data-box{
    height: 280px;
    background: #2383fa;
    overflow: hidden;
}
.blue-item-value{
    font-size: 60px;
    font-weight: 700;
    text-align: center;
    color: #ffffff;
}
.blue-item-dec{
    font-size: 20px;
    font-weight: 500;
    color: #ffffff;
}
.blue-item-box{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.client-title{
    font-size: 32px;
    font-weight: 500;
    text-align: center;
    color: #282828;
    margin-top: 98px;
}
.client-dec-box{
    width: 1200px;
    height: 458px;
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 48px;
}
.client-img-index{
    width: 458px;
    height: 100%;
}
.client-detail-box{
    width: 742px;
    height: 100%;
    background: #ffffff;
    padding:60px 0 0 51px;
    box-sizing: border-box;
}
.client-logo{
    width: 195px;
    height: 76px;
}
.client-text-dec{
    width: 600px;
    height: 120px;
    font-size: 20px;
    font-weight: 500;
    color: #202328;
    margin-top: 20px;
}
.client-name-index{
    font-size: 20px;
    font-weight: 500;
    color: #202328;
    margin-top: 32px;
}
.show-detail-btn{
    color: #3770fa;
    margin-top: 36px;
}
.client-item-box{
    margin: 32px 0 72px 0 ;
    display: flex;
    justify-content: space-between;
    /*align-items: center;*/
}
.client-item-index{
    width: 180px;
    height: 83px;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 2px 10px 0px rgba(19,45,68,0.1);
    text-align: center;
    /*display: flex;*/
    /*justify-content: center;*/
    /*align-items: center;*/
    box-sizing: border-box;
}

.client-item-index:hover{
    border-bottom: 4px solid #156cfd;
}

.client-item-img{
    /*height: 52px;*/
    width: 180px;
    height: 78px;
    /*margin-top: 21px;*/
    /*width: 72px;*/
}

.all-client-box{
    height: 800px;
    background: #F5FAFF;
}
.all-logo-box{
    margin-top: 50px;
    width: 1250px;
    height: 539px;
}
.logo-box-item{
    height: 90px;

}
.logo-box-title{

}
.foot-try-box{
    height: 176px;
    background: url("../images/foot-blue.png");
    background-size: 100% 110%;
}
.foot-try-title{
    font-size: 28px;
    font-weight: 500;
    text-align: center;
    color: #ffffff;
    letter-spacing: 4px;
    margin-top: 36px;
}
.foot-try-btn{
    display: block;
    width: 132px;
    height: 40px;
    background: #ffffff;
    border-radius: 20px;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #288dff;
    margin: 24px auto;
    transition: all linear 0.2s;
}
.foot-try-btn:hover{
    box-shadow: 0px 3px 12px 0 #ffffff;
}
.foot-box{
    background: #212636;
}
.foot-content-box{
    height: 320px;
    margin-top: 80px;
    border-bottom: 1px solid rgba(209,220,255,0.1);
}
.company-dec{
    width: 280px;
}
.foot-logo-img{
    width: 120px;
    height: 40px
}
.foot-item-text{
    font-size: 14px;
    font-weight: 400;
    color: #a7b3d2;
    display: block;
}
.ca7b{
    color: #a7b3d2;
}
.mt-12{
    margin-top: 12px;
}
.mt-19{
    margin-top: 19px;
}
.other-logo{
    height: 24px;
    width: 24px;
    margin-right: 12px;
}
.foot-item-title{
    font-size: 18px;
    font-weight: 500;
    color: #f3f7ff;
}
.mt-21{
    margin-top: 21px;
}
.product-center{
    margin-left: 120px;
}
.client-example,.administration,.about{
    margin-left: 72px;
}
.code-img{
    width: 80px;
    height: 80px;
}
.code-box{
    margin-left: 84px;
}
.ml-16{
    margin-left: 16px;
}
.foot-hint{
}
.banner-img{
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height:100%;
    z-index: -1;
}
.banner-value-box{
    padding-top: 190px;
    box-sizing: border-box;
}

.client-logo-img{
    width: 160px;
    height: 72px;
    margin: 0 13px 24px 0;
}

.triangle{
    width: 140px;
    height: 144px;
    position: absolute;
    z-index: 2;
}

.square{
    position: absolute;
    z-index: 2;
    width: 158px;
    height: 163px;
}

.all-client-box .triangle{
    left: 2%;
    top: -60px;
}

.product-box-square{
    right:2%;
    bottom:-80px;
}

.scan-code-box{
    width:150px;
    height:150px;
    border:2px solid #FFFFff;
    position: absolute;
    left:-62px;
    top:-165px;
    background-color:#FFF;
    cursor: pointer;

}
.scan-code-box:before,.scan-code-box:after{
    content:"";display:block;
    border-width:8px;
    position:absolute;
    bottom:-18px;
    left:65px;
    border-style:solid dashed dashed;
    border-color:#FFFFff transparent transparent;
    font-size:0;
    line-height:0;
}
/*.scan-code-box:after{*/
    /*bottom:-18px;*/
    /*border-color:#FFF transparent transparent;*/
/*}*/
.scan-code-img{
    width: 100%;
    height: 100%;
}
.other-logo-box:hover .scan-code-box{
    display: block;
}
.right-side-box{
    position: fixed;
    right:16px;
    top:50%;
    transform: translateY(-50%);
    width: 80px;
    height: 356px;
    background: #FFFFFF;
    box-shadow: 0px 2px 10px 0px #CDD9EE;
    border-radius: 8px;
    box-sizing: border-box;
    padding:4px;
    z-index: 999999999;
}


.side-item{
    width: 100%;
    height: 87px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    cursor: pointer;
}
.side-item-text{
    font-size: 12px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #808FA9;
    line-height: 17px;
    text-shadow: 0px 2px 10px #CDD9EE;

}
.side-item:hover .side-item-text{
    color: #FFFFFF;
}
.active .side-item-text{
    color: #FFFFFF;
}
.side-item:hover{
    background:#1F70F0;
}

.side-item-icon{
    width: 44px;
    height: 44px;
}

.phone-icon{
    background: url("../images/index/side-right-phone.png");
    background-size: 100% 100%;
}
.side-item:hover .phone-icon{
    background: url("../images/index/side-right-phone-active.png");
    background-size: 100% 100%;
}
.active .phone-icon{
    background: url("../images/index/side-right-phone-active.png");
    background-size: 100% 100%;
}

.wx-icon{
    background: url("../images/index/side-right-wx.png");
    background-size: 100% 100%;
}

.side-item:hover .wx-icon{
    background: url("../images/index/side-right-wx-active.png");
    background-size: 100% 100%;
}

.gift-icon{
    background: url("../images/index/side-right-gift.png");
    background-size: 100% 100%;
}

.side-item:hover .gift-icon{
    background: url("../images/index/side-right-gift-active.png");
    background-size: 100% 100%;
}

.calc-icon{
    background: url("../images/index/side-right-calc.png");
    background-size: 100% 100%;
}

.side-item:hover .calc-icon{
    background: url("../images/index/side-right-calc-active.png");
    background-size: 100% 100%;
}

.contact-phone{
    position: absolute;
    left:-220px;
    width: 200px;
    height: 87px;
    line-height: 87px;
    text-align: center;
    background: #FFFFff;
    border-radius: 4px;
    font-size: 22px;
    font-weight: 600;
    box-shadow: 0px 2px 10px 0px #CDD9EE;
    display: none;
}
.side-item:hover .contact-phone{
    display: block;
}

/*#bannerCanvas{*/
    /*position: absolute;*/
    /*top: 0;*/
    /*left: 0;*/
    /*width: 100%;*/
    /*height: 100%;*/
/*}*/

/*canvas{*/
    /*width: 100%;*/
    /*height: 100%;*/
/*}*/


.closed-loop-box{
    width: 370px;
    height: 230px;
    box-sizing: border-box;
    padding:26px 30px 24px ;
    background: #FFFFFF;
    border-radius: 6px;
    box-shadow: 0px 4px 20px 0px #D0E2F4;
    line-height: 1.2;
    /*cursor: pointer;*/
}
.closed-content{
    width: 192px;
    margin-top:10px;

}
.detail-btn{
    width: 80px;
    height: 24px;
    font-size: 14px;
    color: #ffffff;
    line-height: 24px;
    text-align: center;
    background-image: linear-gradient(90deg, #298DFF 0%, #2AAFFF 100%);
    border-radius: 12px;
    margin-top: 7px;
    opacity: 0;
}
.closed-img{
    width: 70px;
    height: 83px;
    object-fit: contain;
}

.closed-icon{
    width: 14px;
    height: 14px;
    position: absolute;
    left:20px;
    top:20px;
    background: url('../images/index/closed-icon.png') no-repeat;
    background-size: 100% 100%;
}
.closed-icon.active{
    background: url('../images/index/closed-icon-active.png') no-repeat;
    background-size: 100% 100%;
}

.closed-loop-box:hover .closed-icon{
    background: url('../images/index/closed-icon-active.png') no-repeat;
    background-size: 100% 100%;
}

.closed-loop-box:hover .detail-btn{
    opacity: 1;
}

.why-select-box{
    height: 450px;
    background: url("../images/index/why-select-bg.png") no-repeat;
    background-size: 100% 100%;
}
.why-select-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.why-item-box{
    /*margin-top: 25px;*/
    width: 530px;
    height: 55px;
    border-bottom: 1px solid #E6E6E6;
}
.why-item-text{
    font-size: 22px;
    width: 100px;
    color: #585A5E;
    height: 55px;
    line-height: 55px;
    cursor: default;
}

.why-item-text+.why-item-text{
    margin-left: 40px;
}
.why-item-text.active{
    color: #2195F2;
    border-bottom: 2px solid  #2195F2;
}

.why-dec-box{
    width: 730px;
    margin-top: 10px;
    font-size: 18px;
    color: #585A5E;
}
.mb-5{
    margin-bottom: 5px;
}
.lh1-2{
    line-height: 1.2;
}

.agl-hover {
    outline: 2px solid rgba(244,67,54,0.99) !important;
    background-color: rgba(244,67,54,0.2) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.8) !important;
}

.agl-highlight-current {
    outline: 2px solid rgba(255,87,34,0.99) !important;
    background-color: rgba(255,87,34,0.4) !important;
}

.agl-highlight-similar {
    outline: 2px dashed rgba(255,87,34,0.99) !important;
    background-color: rgba(255,87,34,0.4) !important;
}

.agl-highlight-group {
    outline: 4px double rgba(255,87,34,0.99) !important;
    background-color: rgba(255,87,34,0.4) !important;
}

.agl-cover-current {
    position: absolute !important;
    top: 0;
    left: 0;
    z-index: 9 !important;
    outline: 2px solid rgba(33,33,33,0.99) !important;
    background-color: rgba(33,33,33,0.6) !important;
}

.agl-cover-similar {
    position: absolute !important;
    top: 0;
    left: 0;
    z-index: 9 !important;
    outline: 2px dashed rgba(33,33,33,0.99) !important;
    background-color: rgba(33,33,33,0.6) !important;
}

.agl-cover-group {
    position: absolute !important;
    top: 0;
    left: 0;
    z-index: 9 !important;
    outline: 4px double rgba(33,33,33,0.99) !important;
    background-color: rgba(33,33,33,0.6) !important;
}

.agl-cover-focus {
    outline: 3px solid rgba(255,165,0,0.99) !important;
    background-color: rgba(255,165,0,0.4) !important;
}
.foot-hint {
    color: #fff;
    padding: 20px 0;
}
.foot-hint a{color:#fff;}