/*body{background: url("../../images/body.png")}*/
/*头部区域*/
html {
    font: 16px / 1.4 Helvetica;
}

.top {
    height: 80px;
    width: 100%;
    background-color: #f9f9f9;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
}
.top .top_in {
    width: 1200px;
    height: 100%;
    margin: 0 auto;
    /*background-color: #2ab8ff;*/
}
.top .top_left {
    width: 520px;
    height: 100%;
    float: left;
    /*background-color: pink;*/
}
.top .top_left>h1 {
    width: 60px;
    height: 60px;
    float: left;
    padding:10px;
}
.top .top_left>h1>a {
    display: inline-block;
    width: 60px;
    height: 60px;
    background: url("../images/logo.png") no-repeat;
    background-position: center center;
    background-size:100%;
}
.top .top_left>p,h6 {
    width: 415px;
    height: 100%;
    float: right;
}
.top .top_left>p {
    width: 415px;
    height: 50px;
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 50px;
    letter-spacing: 0px;
    color:
            #333333;
}
.top .top_left>h6 {
    width: 415px;
    height: 30px;
    font-size: 12.4px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 7px;
    letter-spacing: 0px;
    color:
            #666666;
}
.top .top_right {
    width: 680px;
    height: 100%;
    float: right;
    /*background-color: pink;*/
}
.top .top_nav {
    width: 680px;
    height: 100%;
    /*background: #f9f9f9;*/
}
.top .top_nav>li {
    float: left;
    margin-right: 80px;
    height: 40px;
    margin-top: 18px;
}
.top .top_nav>li>a {
    text-decoration: none;
    width: 627px;
    height: 22px;
    font-size:18px;
    font-weight: 500;
    color: #333333;
}
.top .top_nav>li>a:hover {
    color: #3d9cfe;
}
.top_nav .active{border-bottom: 2px solid #3d9cfe}
/*广告区域*/
.banner-box {
    width: 100%;
    height: 854px;
    position: relative;
    overflow: hidden;
    /*background-color: #f10215;*/
    /*background: no-repeat;*/
    /*background-image: url("../images/banner.png");*/
    /*background-position: center top;*/
}
.banner-box .banner-item{width: 100%;height: 100%;overflow: hidden}
/*内容区域*/


/*底部区域*/
.footer {
    height: 172px;
    width: 100%;
    background: #fff;
}
.footer-content{
    width: 1200px;
    height: 100%;
    margin:  0 auto;
    text-align: center;
    position: relative;
}
.footer-content>p {
    width: 1200px;
    height:24px;
    font-size: 14px;
    color: #333333;
    text-align: center;
    padding-top: 70px;
}
.footer-content>span {
    display: inline-block;
    width: 1200px;
    height: 24px;
    font-size: 14px;
    color: #999999;
}

#oms-box{
    position: relative;
    background: #fff;
}

#oms-box .logo-box{
    width: 100%;
    height: 168px;
    position: absolute;
    left: 0;
    z-index: 12;
}
#oms-box .logo-box a{
    display: inline-block;
    width: 110px;
    height: 68px;
    margin-top: 90px;
    margin-left: 95px;
}
#oms-box .oms-box-text{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 11;
}

.site {
    overflow: hidden;
}



@keyframes icon_a {
    from {
        -webkit-transform: rotateZ(0deg);
        -moz-transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        transform: rotateZ(0deg);
    }
    to {
        -webkit-transform: rotateY(360deg);
        -moz-transform: rotateZ(360deg);
        -ms-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}
#card1 .wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: 390px;
    width: 100%;
    margin-top: 90px;
    /*min-height: 600px;*/
    /*max-height: 800px;*/
}


#card1 .wrapper .container {
    position: relative;
    margin: 0 auto;
    /*min-width: 100%;*/
    /*width: auto;*/
    /*height: 390px;*/
}

#card1 .horizontal .container {
    width: 100%;
    max-width: 1920px;
    height: 390px;
    margin-left: calc(50% - 155px);
}

#card1 .vertical .container {
    width: 37rem;
    height: 14rem;
}

#card1 .container .cards-list {
    width: 310px;
    height: 340px;
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
    transition: 330ms;
    background: #fff;
    border-radius: 5px;

}

#card1 .cards-list .cards-img{
    width: 110px;
    height: 110px;
    margin: 30px auto;
    position: relative;
}
#card1 .cards-list .item-a{;width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: 300;display: none}
#card1 .cards-list .cards-img .cards-bg{display: none;width: 100%;height: 100%;position: absolute;left: 0;top:0;z-index: 200;background: url("../images/icon-bg2.png") no-repeat center}
#card1 .cards-list .cards-img .cards-icon{width: 100%;height: 100%;position: absolute;left: 0;top:0;z-index: 201;}
#card1 .cards-list .cards-img .cards-icon-1{background: url("../images/oms.png") no-repeat center center;}
#card1 .cards-list .cards-img .cards-icon-2{background: url("../images/is.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-3{background: url("../images/oa.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-4{background: url("../images/集团邮箱.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-5{background: url("../images/大昌出行logo.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-6{background: url("../images/保险.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-7{background: url("../images/大数据.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-8{background: url("../images/元动.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-9{background: url("../images/金蝶.png") no-repeat center center}
#card1 .cards-list .cards-img .cards-icon-10{background: url("../images/云之家.png") no-repeat center center}
#card1 .cards-list .cards-title{text-align: center;font-size: 24px;color: #666;margin-bottom:18px }
#card1 .cards-list .cards-text{font-size: 16px;color: #999;text-align: center;width: calc(100% - 32px);}
#card1 .cards-list .cards-text span{padding-left:16px;padding-right: 16px ;display: inline-block;width: 100%}
#card1 .cards-list .cards-text .cards-text-warp{display: none}
#card1 .cards-list .cards-num-icon{width: 46px;height:40px;background: url("../images/num-bg.png") no-repeat center center;font-size: 15px;color: #999;text-align: center;background-size: 46px 40px;position: absolute;bottom: 14px;left:0;right: 0;margin: auto;}
#card1 .cards-list .cards-num-icon span{line-height: 34px}
#card1 .cards-list .cards-btn{display: none;width: 100%;height: 40px;font-size: 15px;line-height: 40px;background: #4592ff url("../images/进入.png") no-repeat 94% center;position: absolute;bottom: 0;left:0}
#card1 .cards-list .cards-btn span{padding-left: 20px;color: #fff;display: inline-block;width: 100%;height: 100%}
#card1 .active{height: 400px!important;top: -30px!important;}
#card1 .cards-list.active{box-shadow: 0 0px 10px #4592ff;background: #4592ff;color: #fff!important;}
#card1 .active .cards-text{color: #fff!important;}
#card1 .active .cards-title{color: #fff!important;}
#card1 .active .cards-num-icon{color: #fff!important;}
#card1 .card000s-list.active .cards-bg{display: block}
#card1 .cards-list.active .cards-btn{display: block}
#card1 .cards-list.active .cards-text-title{display: none}
#card1 .cards-list.active .cards-text-warp{display: block}
#card1 .cards-list.active .cards-num-icon{bottom:26px}
#card1 .cards-list.active .item-a{display: block}
#card1 .cards-list.active .cards-img .cards-icon-1{background: url("../images/oms白.png") no-repeat center center;}
#card1 .cards-list.active .cards-img .cards-icon-2{background: url("../images/is白.png") no-repeat center center}
#card1 .cards-list.active .cards-img .cards-icon-3{background: url("../images/oa白.png") no-repeat center center}
#card1 .cards-list.active .cards-img .cards-icon-4{background: url("../images/集团邮箱白.png") no-repeat center center}
/*#card1 .cards-list.active .cards-img .cards-icon-5{background: url("../images/大昌出行logo.png") no-repeat center center}*/
#card1 .cards-list.active .cards-img .cards-icon-6{background: url("../images/保险白.png") no-repeat center center}
#card1 .cards-list.active .cards-img .cards-icon-7{background: url("../images/大数据白.png") no-repeat center center}
/*#card1 .cards-list.active .cards-img .cards-icon-8{background: url("../images/元动白.png") no-repeat center center}*/
#card1 .cards-list.active .cards-img .cards-icon-9{background: url("../images/金蝶白.png") no-repeat center center}
#card1 .cards-list.active .cards-img .cards-icon-10{background: url("../images/云之家白.png") no-repeat center center}


#card1 .cards-list.active .cards-num-icon{background: url("../images/白角标.png") no-repeat center center;background-size: 46px 40px}
#card1 .cards-list.active .cards-num-icon span{line-height: 34px}
#card1 .cards-list.active .cards-bg{display: block;animation: icon_a 5s linear 0s infinite}
#card1 .warpbtn{width: 200px;height: 40px;display: flex;justify-content: space-between;align-items: center;font-size: 14px;color: #999;position: absolute;left:50%;transform: translateX(-50%);bottom: -40px;z-index: 8888888}
#card1 .warpbtn .warpbtn-left{width: 30px;height: 24px;background: url("../images/left-btn-act.png") no-repeat center;cursor: pointer}
#card1 .warpbtn-right{width: 30px;height: 24px;background: url("../images/right-btn-act.png") no-repeat center;cursor: pointer}
#card1 .warpbtn .warpbtn-left:hover{background: url("../images/left-btn.png") no-repeat center;}
#card1 .warpbtn-right:hover{background: url("../images/right-btn.png") no-repeat center;}

.banner-bottom{width: 100%;height: 150px;margin-top: -150px;background:rgba(15,15,15,0.4);position: relative;z-index: 999;color: #fff}
.banner-bottom .text-list{width: 1200px;height: 100%;margin: auto;display: flex;justify-content: space-between}
.banner-bottom .text-list .text-item{padding-top:30px;text-align: center }
.banner-bottom .text-list .text-item b{font-size: 40px;font-weight: normal}
.banner-bottom .text-list .text-item span{font-size: 20px}
.banner-bottom .text-list .text-item p{font-size: 18px}
.banner-item{position: relative}
@media screen and (max-width: 1366px) {
    .banner-box {
        height: 640px;
    }
}
/*#banner-video{position: absolute;left: 0;top: 0}*/
.layui-carousel-arrow{z-index: 100 !important;}
.banner-img{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.banner-img img{position: absolute;left: 50%;margin-left: -960px}
.banner-text{width: 700px;height:200px;position: absolute;left: 0;right: 0;top:240px;margin: auto;z-index: 99 }
.banner-text h2{font-size: 50px;text-align:center;color: #fff;line-height: 1.2em;font-weight: normal}
.banner-text p{font-size: 24px;text-align:center;margin-top: 40px;color: #fff}
.banner-icon-warp{width: 925px;height: 440px;position: absolute;left: 0;right: 0;top: 100px;margin: auto;z-index: 98}
.banner-icon-warp .banner-icon-list{width: 100%;height: 100%;position: relative;}
.banner-icon-warp .banner-icon-list .banner-icon{width: 95px;height: 95px;border-radius:50% }
.banner-icon.oms{background: url("../images/oms-icon.png") no-repeat center;position: absolute;left:47px;top:0px;transition:top  linear; animation: oms_a 8s linear infinite }
.banner-icon.erp{background: url("../images/erp.png") no-repeat center;position: absolute;left:437px;top:47px;transition:top linear; animation: erp_a 8s linear infinite }
.banner-icon.chart{background: url("../images/chart.png") no-repeat center;position: absolute;right:47px;top:10px;transition:top  linear; animation: chart_a 5s linear infinite }
.banner-icon.IS{background: url("../images/dashuju.png") no-repeat center;position: absolute;left:0px;top:324px;transition:top linear;animation: IS_a 4s linear infinite  }
.banner-icon.OA{background: url("../images/oa-icon.png") no-repeat center;position: absolute;right:0px;top:270px;transition:top  linear; animation: OA_a 3s linear infinite }
/*.banner-icon.oms{background: url("../images/oms.png") no-repeat center}*/
#banner-item-3 .banner-text{width: 100%;height:200px;position: absolute;left: 0;right: 0;top:240px;margin: auto;;transition:all 1s ease;animation: text_a 1s}
@keyframes text_a {
    0%{
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        /*display: none;*/
    }
    100%{
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transform: translateX(0px);
        /*display: block;*/
    }
}
@keyframes oms_a {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        transform: translateY(30px);
    }
    100%{
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
@keyframes erp_a {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(10px);
        -moz-transform: translateY(10px);
        -ms-transform: translateY(10px);
        transform: translateY(10px);
    }
    100%{
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
@keyframes chart_a {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(10px);
        -moz-transform: translateY(10px);
        -ms-transform: translateY(10px);
        transform: translateY(10px);
    }
    100%{
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
@keyframes IS_a {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(10px);
        -moz-transform: translateY(10px);
        -ms-transform: translateY(10px);
        transform: translateY(10px);
    }
    100%{
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
@keyframes OA_a {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(8px);
        -moz-transform: translateY(8px);
        -ms-transform: translateY(8px);
        transform: translateY(8px);
    }
    100%{
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
.footer{width: 100%;height: 344px}
.footer-warp-top{width: 100%;height: 220px;background: #111111;}
.footer-warp-top .footer-content{display: flex;flex-wrap: nowrap;padding-top: 60px;}
.footer-warp-top .footer-left{width: 370px;height: 100px;color: #fff;font-size: 18px;line-height: 1.8em;text-align: left}
.footer-warp-top .footer-right{width: auto;height: 100px;font-size: 18px;margin-left:40px;line-height: 100px ;color: #fff}
.footer-warp-top .footer-right a{color: #fff}
.footer-warp-bottom{width: 100%;height: 48px;padding: 38px 0;background: #000;text-align: center;font-size: 14px;color: #fff}

.color-white{color: #fff}
.color-666{color: #666}
.content-item{width: 100%;padding-top: 90px}
.content-item-header{width: 100%;height: 90px;text-align: center}
.content-item-header h3{font-size: 34px;font-weight: normal}
.content-item-header p{font-size: 20px;margin-top:34px }
#card-warp-2 .content-item-card-warp{width: 1200px;height:476px;margin:100px auto 0 auto;display:
        flex;flex-wrap: nowrap;justify-content: space-between}
#card-warp-2 .content-item-card-warp .card-item{width: 237px;height: 100%;overflow: hidden}
#card-warp-2 .content-item-card-warp .card-item .card-img{width: 100%;height: 256px;margin-bottom: 25px;overflow: hidden}
#card-warp-2 .content-item-card-warp .card-item .card-img img{margin: 0 9px}
#card-warp-2 .content-item-card-warp .card-item .card-title{font-size: 22px;margin-bottom: 30px;text-align: center}
#card-warp-2 .content-item-card-warp .card-item .card-text{font-size: 16px}
#card3{height: 666px;background: url("../images/footer-bg.png") no-repeat center}

#card-warp-2 {width: 1200px;height: 380px;margin: 86px auto 0 auto;position: relative}
#card-warp-2 .content-item-list{width: 1200px;height: 380px;margin: 0 auto;overflow: hidden;position: relative}
#card-warp-2 .content-item-list .list-box{width: 1800px;height:380px;float: left;}
#card-warp-2 .content-item-list .list-box .list-item{width: 300px;height: 380px;position: relative;flex-shrink: 0;overflow: hidden;float: left}
#card-warp-2 .content-item-list .list-box .list-item .list-item-text{display: flex;flex-direction: column;justify-content: center}
#card-warp-2 .content-item-list .list-box .list-item .list-item-text p{font-size: 28px}
#card-warp-2 .content-item-list .list-box .list-item .list-item-text span{font-size: 20px;margin-top: 40px}
#card-warp-2 .content-item-list .list-box .list-item .list-item-text{width: 100%;height: 100%;text-align:
        center;transition: all .8s ease;position: absolute;left: 0;top:0;z-index: 8;}
/*.content-item-list .list-box .list-item .list-item-text{z-index: 8;}*/
#card-warp-2 .content-item-list .list-box .list-item .list-item-shadow{width: 100%;height: 100%;background:rgba(69,146,255,0.94);text-align: center;transition: all .8s ease;position: absolute;left: 0;z-index: 9;top:380px}
#card-warp-2 .content-item-list .list-box .item-bg-1{background: url("../images/大昌出行.png") no-repeat center}
#card-warp-2 .content-item-list .list-box .item-bg-2{background: url("../images/大昌优驾.png") no-repeat center}
#card-warp-2 .content-item-list .list-box .item-bg-3{background: url("../images/车管家.png") no-repeat center}
#card-warp-2 .content-item-list .list-box .item-bg-4{background: url("../images/掌上神器.png") no-repeat center}
#card-warp-2 .content-item-list .list-box .item-bg-5{background: url("../images/畅通保bg.png") no-repeat center}
#card-warp-2 .content-item-list .list-box .item-bg-6{background: url("../images/掌上神器.png") no-repeat center}
#card-warp-2 .content-item-list .list-box .list-item:hover .list-item-text{display: none}
#card-warp-2 .content-item-list .list-box .list-item:hover .list-item-shadow{top:0}

#card-warp-2 .list-item-shadow .app-icon{width: 82px;height: 82px;margin: 50px auto 25px auto}
#card-warp-2 .list-item-shadow .app-icon img{width: 100%;height: 100%}
#card-warp-2 .list-item-shadow .app-code{width: 128px;height: 128px;margin: 0 auto 34px auto}
#card-warp-2 .list-item-shadow .app-code img{width: 100%;height: 100%}
#card-warp-2 .list-item-shadow .app-msg{text-align: center;font-size: 20px}
#card1{height: 720px;background:#F6FAFD;overflow: hidden}
#card2{height: 720px;background:#fff}

#card3 .content-item-card-warp{display: flex;justify-content: space-between;flex-wrap: nowrap;width: 1200px;height: 400px;margin:100px auto 0 auto;}
#card3 .content-item-card-warp .card-item{width:250px;height: 400px;text-align: center }
#card3 .content-item-card-warp .card-item .card-img{width: 100%;height: 256px;overflow: hidden;margin-bottom: 25px}
#card3 .content-item-card-warp .card-item .card-img img{margin:3px auto }
#card3 .content-item-card-warp .card-item .card-title{font-size: 22px;margin-bottom: 30px}
#card3 .content-item-card-warp .card-item .card-text{font-size: 16px}
#card3{position: relative}
.topBtn{width: 50px;height: 50px;background: rgba(255,255,255,0.3);position: absolute;right: 50px;bottom:70px;border-radius: 5px}
.topBtn a{display: inline-block;width: 50px;height:50px;background: url('../images/top.png') center;background-size: 36px 36px}