@charset "UTF-8";
/**
 * @Description: 解决方案与产品样式表
 * @Author: LiuXiao
 * @Date: 2018/1/16.
 */
body{background: #fff}
.wrapper{width:1200px;margin:0 auto;text-align: left;min-width: 1200px}/*宽度根据设计图定*/
.jxdnavbar .navbox ul li {
    float: left;
    padding: 0 38px;
    text-align: center;
    overflow: hidden;
    height: 53px;
    line-height: 53px;
}
.navsolution{display: none!important;}
.link{margin-top: 50px ;}
.link img{margin-right: 50px ;    margin-left: -8px;}
.link span{color:#87959d;line-height:67px;font-size:14px}
/*banner区域样式*/
#solutionBanner1{height: 745px;background: url(../../img/solution/banner.png) no-repeat;background-size: 100%;min-width: 1200px;}
.banner{position: relative;height: 520px;overflow: hidden;}
.banner-txt{margin-top: 140px;margin-left: 50px}
.banner-box{position:absolute;width: 682px;height: 480px;top: 20px;right: 0;background: url(../../img/solution/banner-box.png) no-repeat bottom center;  }
.logo-box{position: absolute;animation: float 3s linear infinite alternate -.5s }
.center-logo{position: absolute;top: 190px; left: 280px;}
.center-logo-out{ position: absolute;top: 191px; left: 281px;animation: rotate 10s linear infinite;}
.banner-light{ position: absolute; top: 140px; left: 178px;animation: twinkle 3s linear infinite alternate -.5s;opacity: 0.1}
.banner-list li{position: absolute;width: 74px;height: 85px;background: url(../../img/solution/banner-one.png) left}
.banner-dianli{top: 147px;left: 50px;}
.banner-shihua{top: 74px;left: 176px;}
.banner-tielu{ left: 303px;top: 3px;}
.banner-hangtian{top: 75px;right: 175px;}
.banner-gongan{right: 51px;  top: 148px;}
.banner-list li img{position: absolute; }
.banner-item{top: 18px;left: 16px;animation: twinkle-1 2s linear infinite alternate;opacity: .6}
.banner-shihua .banner-item{ top: 15px;left: 12px;}
.banner-hangtian .banner-item{ left: 11px; top: 16px;}
.banner-tielu .banner-item{ top: 24px; left: 10px;}
.elc-1{left: 36px;bottom: 0; opacity: 1;animation: elc-1 4s linear infinite ;}
.elc-2{top: 21px;right: -1px;opacity: 1;animation: elc-2 4s linear infinite  ;}
.elc-3{top: 20px;left: 0;opacity: 1;animation: elc-3 4s linear infinite ;}
.elc-11{left: 36px;bottom: 0; opacity: 1;animation: elc-1 4s linear infinite -2s;}
.elc-22{top: 21px;right: -1px;opacity: 1;animation: elc-2 4s linear infinite  -2s;}
.elc-33{top: 20px;left: 0;opacity: 1;animation: elc-3 4s linear infinite -2s;}

/*3d*/
.logo-big-box img{position: absolute}
.logo-big-box .circle-img{}
.rotate-img{position:absolute;transform: rotateX(57deg)}
.rotate-img-1{z-index: 2;}
.rotate-img-2{z-index: 4;}
.rotate-img-3{z-index: 3;/* transform: rotateX(59deg); */}
.rotate-img-4{z-index:4 }
.circle-img-logo{left: 275px;top: 175px;z-index: 3}
.circle-img-1{top: 418px;left: 213px;z-index: 2;animation: rotate-1 10s linear infinite;}
.circle-img-2{left: 286px;top: 386px;z-index: 4; animation: rotate-2 6s linear infinite;}
.circle-img-3{left: 262px;top: 368px;z-index: 4; animation: rotate-1 6s linear infinite;}
.circle-img-4{left: 294px;top: 320px;animation: rotate-1 4s linear infinite;}

/*行业区域样式*/
.industry-box{padding: 40px 30px;margin-bottom: 116px;margin-top: -130px;background: #fff;box-shadow: 0 0 20px 0 rgba(200,200,200,.4);border-radius: 3px}
.module-title{margin-bottom: 40px;text-align: center}
.module-title h1{ font-size: 26px;line-height: 50px;letter-spacing: 1px;color: #4b565c;}
.module-title p{ font-size: 16px;line-height: 30px;color: #87959d;}
.industry-list li{float: left;margin-right: 14px;}
.industry-list li:last-child,.industry-list li.last-child{margin-right: 0}
.industry-item {width: 274px;height: 345px;background: #e7f1f9;background-image:-webkit-linear-gradient(0deg, #e7f1f9, #e7f1f9);background-image:linear-gradient(0deg,#e7f1f9,#e7f1f9);border-radius: 2px;text-align: center;transition: all .3s linear;}
.industry-list li:hover .industry-item,.industry-list li.active .industry-item{
    background-image:-webkit-linear-gradient(0deg, #0babfe, #41bbfb); background-image:linear-gradient(0deg,#0babfe,#41bbfb);
    transform: translateY(-10px);
}
.industry-item img{height: 208px;}
.industry-name{font-size: 18px;  line-height: 28px; letter-spacing: 1px;color: #444;margin-top: 30px}
.industry-line{width: 30px;height: 2px; background-color: #8b9dab;margin: 10px auto 0}
.industry-name-en{font-size: 12px; line-height: 28px;letter-spacing: 1px;color: #8b9dab;}
.industry-list li:hover .industry-name{color: #fff}
.industry-list li:hover .industry-line{background: #fff}
.industry-list li:hover .industry-name-en{color: #fff}
.industry-list li:hover .industry-item-1{background:#e7f1f9;opacity: .8 }
.industry-list li:hover .industry-item-1 .industry-name{color: #8b9dab}
.industry-list li:hover .industry-item-1 .industry-line{background: #8b9dab}
.industry-list li:hover .industry-item-1 .industry-name-en{color: #8b9dab}

/*技术区域样式*/
.technology-top{width: 100%;height: 430px;min-width: 1200px;background: url(../../img/solution/tec-bg.png) no-repeat top;background-size: 100% auto }
.tec-wrapper{width: 1200px;min-width: 1200px;margin: auto}
.technology-box{height: 430px;background: url(../../img/solution/tec-bg1.png) no-repeat right -20px top}
.technology-info{width: 440px;padding-top: 75px;color: #fff;margin-left: 100px}
.technology-info h1{ font-size: 29px;line-height: 30px;letter-spacing: 1px;}
.sub-title{line-height: 30px;font-size: 18px;margin: 25px 0 50px}
.technology-info .more{display: block;color: #fff;border: 1px solid #fff;font-size: 14px;width: 210px;height: 58px;transition: all .3s;line-height:58px;border-radius: 30px;text-align: center}
.technology-info .more span{display: none}
.technology-info .more:hover{color: #0198ff;background: #fff}
.technology-info .more:hover span{display: inline-block}
.technology-list{margin-bottom: 116px;margin-top: -85px;}
.technology-list li{float: left;width: 166px;text-align: center;    margin-right: 92px;}
.technology-list li:last-child,.technology-list li.last-child{margin: 0}
.tec-logo{width: 166px;height: 166px;background-position: center;background-repeat: no-repeat;transition: all .3s linear}
.tec-name{color: #4b565c;font-size: 16px;line-height: 30px;margin-top: 20px}
.tec-dv{background:url(../../img/solution/tec-dv.png) }
.tec-app{background:url(../../img/solution/tec-app.png) }
.tec-test{background:url(../../img/solution/tec-test.png) }
.tec-ued{background:url(../../img/solution/tec-ued.png) }
.tec-ai{background:url(../../img/solution/tec-ai.png) }
.technology-list li:hover .tec-dv{background:url(../../img/solution/dv-hover.png);transform: translateY(-10px) }
.technology-list li:hover .tec-app{background:url(../../img/solution/app-hover.png) ;transform: translateY(-10px)}
.technology-list li:hover .tec-test{background:url(../../img/solution/test-hover.png);transform: translateY(-10px) }
.technology-list li:hover .tec-ued{background:url(../../img/solution/ued-hover.png) ;transform: translateY(-10px)}
.technology-list li:hover .tec-ai{background:url(../../img/solution/ai-hover.png) ;transform: translateY(-10px)}

/*产品区域样式*/
.product-info,.product-img{float: left}
.product-info{width: 425px;text-align:justify;}
.info-con-text{font-size: 13px; line-height: 30px;color: #87959d;margin-bottom: 30px; text-align: justify;}
.product-qqb{position:relative;height: 655px}
.product-qqb .product-info{padding-top: 105px;}
.info-line{padding: 20px 0 ;}
.info-title{text-align: left;font-size: 32px;color: #4B565C}
.info-title img{margin-right: 10px}
.activity-info{width: 345px;text-align:justify;min-height: 96px}
.activity-info-title{letter-spacing: 1px;color: #4b565c;font-size: 16px;line-height: 30px}
.activity-info-con{letter-spacing: 1px;color:  #87959d;font-size: 14px;line-height: 24px}
.product{overflow-x: hidden;min-width: 1200px;}
.product-img{width: 760px;position: relative;}
.product-qqb .product-img{margin-top:80px;text-align: right;}

.product-jqx .product-info{padding-top: 5px}
.product-jqx .product-img{height: 620px}
.product-jqx .product-img img{position: absolute}
.jqx-img1{top: 90px;left:-50px}
.jqx-img2{top: 160px;left:350px}

.product-yx{height: 640px}
.product-yx .product-info{text-align: right;padding-top: 150px}
.product-yx .product-img{text-align: right;margin-top: 140px}

.activity li img{width: 59px;height: auto}
.product-jqx .activity li img{width: 59px;height: auto;margin-top: 10px}

.product-qqb .activity li{float: left;width: 84px;text-align: center;margin-right: 38px}
.product-qqb .activity li.first-child{width: 59px;}
.product-qqb .activity li.last-child{margin: 0}
.product-qqb .activity li p{font-size: 14px;color: #87959d;text-align: center;margin-top: 15px}

.product-yx .activity li{float: left;width: 84px;text-align: center;margin-right: 38px}
.product-yx .activity li.first-child{width: 59px;}
.product-yx .activity li.last-child{margin: 0}
.product-yx .activity li p{font-size: 14px;color: #87959d;text-align: center;margin-top: 15px}

.more-product{text-align: center; margin:50px 0 100px}
a.more-pdc{position:relative;display: block;width: 360px;height: 58px;margin: auto;border: 1px solid #0198ff;color: #0198ff;line-height: 58px;z-index: 1;border-radius: 30px;font-size: 16px;transition: all .3s linear;}
a.more-pdc span{position:relative;display:none;transition: all .3s linear;z-index: 1}
a.more-pdc label{position: relative;z-index: 1}
a.more-pdc:hover{color: #fff; }
a.more-pdc:hover span{display:inline-block}
a.more-pdc:after{content: '';position:absolute;top:0;left:0;width: 360px;height: 58px;border-radius: 30px; transition: all .5s linear;opacity:0 ;background-image:-webkit-linear-gradient(0deg, #0babfe, #41bbfb); background-image:linear-gradient(0deg,#0babfe,#41bbfb)}
a.more-pdc:hover:after {opacity: 1}

/*动画定义区域*/
@keyframes rotate{
    from{transform:none}
    to{transform:rotateZ(360deg) }
}
@keyframes rotate-1{
    from{transform:rotateZ(0deg) }
    to{transform:rotateZ(360deg)}
}
@keyframes rotate-2{
    from{transform:rotateZ(0deg)}
    to{transform:rotateZ(-360deg)}
}
@keyframes twinkle{
    from{opacity: .1}
    to{opacity: 1}
}
@keyframes twinkle-1{
    from{opacity: .6}
    to{opacity:1 }
}
@keyframes float{
    from{transform:translateY(0)}
    to{transform:translateY(-30px)}
}

@keyframes elc-1 {
    0%{
        opacity: 1;
        transform: translate3d(0,0,0);
    }
    50%{
        opacity: 1;
        transform: translate3d(0,-42px,0);
    }
    50%{
        opacity:0;
        transform: translate3d(0,-42px,0);
    }
    100%{
        opacity: 0;
        transform: translate3d(0,0,0);
    }
}
@keyframes elc-2 {
    0%{
        opacity: 1;
        transform: translate3d(0,0,0);
    }
    45%{
        opacity: 1;
        transform: translate3d(-29px,14px,0);
    }
    50%{
        opacity: 0;
        transform: translate3d(-29px,14px,0);
    }
    100%{
        opacity: 0;
        transform: translate3d(0,0,0);
    }
}
@keyframes elc-3 {

    0%{
        opacity: 1;
        transform: translate3d(0,0,0);
    }
    45%{
        opacity: 1;
        transform: translate3d(29px,14px,0);
    }
    50%{
        opacity: 0;
        transform: translate3d(29px,14px,0);
    }
    100%{
        opacity: 0;
        transform: translate3d(0,0,0);
    }
}

/*媒体查询
*/
@media screen and (min-width: 1600px){
    .product-qqb,.product-jqx,.product-yx{height: 640px}

}
@media screen and (max-width: 1200px){
    .tec-wrapper{width: 1200px; }
    .product-img{width: 730px;margin-left: 15px}
    .product-info{margin-left: 15px}
}