


/*页面广告*/
.section1List{text-align: center;min-height: 25rem;}
.section1List:hover img{
    -webkit-transform: scale(1.3) rotate(360deg);
    -moz-transform: scale(1.3) rotate(360deg);
    transform: scale(1.3) rotate(360deg);
    opacity: 1;
}
#home-sm-box{padding:35px;}
.section1List>:first-child{margin-bottom:1rem;}
.section1List>p{font-size:1.8rem;color:#444;font-weight: bold;border-bottom:1px solid #e0e0e0;    width: 70%; margin-left: 15%;padding-bottom:6px;}
.section1List div{font-size:1.4rem;color:#9b9b9b;text-align: left;margin-top:9px;}
.home-sm img{margin:0 auto;}


/*解决方案*/
#section2{background: #f5f5f5;padding:60px 40px 110px;}
.section2-title{text-align: center}
.section2-title>:first-child{font-size:3rem;color:#444;text-align: center;margin-bottom:.3rem;}
.section2-title>:nth-child(2){font-size:1.8rem;color:#9b9b9b;text-align: center;margin-bottom:5rem;}
#section2 ul :nth-child(4){margin-right:0;}
.section2List{height:340px;border:1px solid #ddd;margin-bottom:1rem;border-top:2px solid #4a90e2;width:23%;margin-right:1rem;}
.section2List:hover{ box-shadow: 5px 5px 10px #ddd; border-width: 3px; }
.section2List h4{color:#4a90e2;margin-top:25px;margin-bottom:13px;font-weight: bold;text-align: center;}
.section2List ul{margin-left:25%;text-align: left;color:#9b9b9b;height:130px;}
.section2List ul>li{list-style: initial;}
.section2List>div{display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;}


/*精选案例*/
#section3{background: #5b9bfe;padding:35px;}
.section3-title>:first-child{font-size:3rem;color:#fff;text-align: center;margin-bottom:.3rem;;}
.section3-title>:nth-child(2){font-size:1.8rem;color:#ddd;text-align: center;margin-bottom:5rem;}
#section3 ul :nth-child(3){margin-right:0px;}
#section3 ul :nth-child(6){margin-right:0px;}
.section3List{height:350px;width:320px;margin-bottom:1rem;background: #fff;padding:0;overflow: hidden;margin-right:1rem;}
.section3List>div{display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;}
.section3List:hover{box-shadow: 5px 5px 20px #333;cursor: pointer}
.section3List:hover img{
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.1);
}
.section3List h4{margin:17px 17px 10px;font-weight: bold}
.section3List p{padding:0px 17px 25px;color:#9b9b9b;font-size:1.4rem;}

/*合作伙伴*/
.section4Box{background: url('../../images/home/background.jpg')no-repeat;padding-bottom:10rem;}
#section4>.section4Box ul{display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;    -webkit-flex-wrap: wrap-reverse;flex-wrap: wrap-reverse;}
#section4>.section4Box ul>li{margin-left:1%;position: relative}
#section4>.section4Box ul>li:hover{cursor: pointer}
#section4>.section4Box ul>li .active{background: url('../../images/home/home-last-icon.png') no-repeat;width:167px;height:176px;text-align: center;line-height:176px;color: #fff;font-size:16px;
    position: absolute;top:0;left:0;z-index: 1000;display:none;
}


/*===================客户案例=====================*/
.design-ad{position: relative}
.design-ad-img{position:absolute;bottom:-65px;width:100%;padding:0 8rem;}
.design-ad-img img{margin:0 auto;}

.design-quality>:first-child{width:100%;padding:0 8rem;}
.design-quality>:first-child>img{margin:0 auto;}

.design-haoya{width:100%;background:#43a7dd;padding:5rem 8rem 8rem ;}

.section-mayi{padding:5rem;}
.section-mayi>:first-child{width:100%;}

.design-pig li {margin-top:10rem;}
.design-pig2{margin-top:10rem;}

.ce{position: fixed;left:20%;top:15%;z-index: 9999}
.ce li{width:80px;height:80px;color:#000;border-radius: 50%;display:-webkit-flex;display:flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;margin-bottom:1.5rem;}
.ce a{display: inline-block;}


.case-sm-text{padding:5rem;}


/*关于我们*/
.zhaoxianBox{margin:3rem auto;}
.zhaoxianBox li{border-bottom:5px solid #45a1ff;text-align: center;font-weight: bold;color: #9b9b9b;position: relative}
.zhiyuanBox li{border-bottom:5px solid #e7e6e6;text-align: center;font-weight: bold;color: #9b9b9b;position: relative}
.zhaoxianBox li:hover{cursor: pointer}
.zhaoxianBox li:hover img{
    -webkit-transform: scale(1.2) rotate(-30deg);
    -moz-transform: scale(1.2) rotate(-30deg);
    transform: scale(1.2) rotate(-30deg);
    opacity: .2;
}

.zhaoxianBox li b{width:25%;border-bottom:5px solid #45a1ff;margin-top:2rem; display:inline-block;position: absolute;bottom:-5px;}
.zhiyuanBox li b{border-bottom:5px solid #e7e6e6;margin-top:2rem; display:inline-block;position: absolute;bottom:-5px;}
.zhiyuanBox li b{border-bottom:5px solid #e7e6e6;margin-top:2rem; display:inline-block;position: absolute;bottom:-5px;}

.zhaoxianBox li b.blueLine{width:25%;border-bottom:5px solid #e7e6e6;margin-top:2rem; display:inline-block;left:25%;}
.zhaoxianBox li span{display: block;margin-bottom:1.5rem;}

.zhaoxianBox li.active b{border-color:#f9bc71}
.zhiyuanBox li.active b{border-color:#1e2674}

.zhiyuanBox li.active b.blueLine{border-color:#8fbd21;}
.zhaoxianBox li.active{color:#222}

.zhaoxianBox img{margin:0 auto 2rem;}

.tab-box div{margin:0 auto;display: none;}
.tab-box div img{margin:0 auto;}
.us-tab div{max-width:40rem;min-height:50rem;}
.tab-box div.active{display: block;}


/*致远协同*/
.zhiyuan-title{display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center}
.zhiyuan-title h2{text-align: center; display: inline-block;padding-bottom: 0.8rem; border-bottom: 3px solid #ddd;}

.xilieBox li:hover{cursor: pointer}
.xilie-tab>li{display:none}
.xilie-tab>li.active{display:block}

.zhiyuanCase{margin:50px 0 100px 0;}
.zhiyuanCase li {overflow: hidden;position:relative;}
.zhiyuanCase li .ImgMask{position:absolute;top:0;left:0;width:100%;height:0;background: rgba(51,51,51,.8);padding-left:15px;display:-webkit-flex;display:flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;}
.zhiyuanCase li .ImgMask>img{height:0;}
.zhiyuanCase li:hover{cursor:pointer}
.zhiyuanCase li:hover .ImgBg {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    transform: scale(1.2);
    opacity: .5;
}
.zhiyuanCase li:hover .ImgMask{height:100%;}
.zhiyuanCase li:hover .ImgMask>img {
    height:auto;
    -webkit-transform: scale(1.2) rotate(360deg);
    -moz-transform: scale(1.2) rotate(360deg);
    transform: scale(1.2) rotate(360deg);
    transition-delay:0.3s;
    opacity: .5;
}






/*页面加载loading*/
#loading {
    display:block;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    color:white;
    background:#dff0d85e;
    font-size:1em;
    text-align:center;
    overflow:hidden;
    z-index:9999;
}
.spinner {
    margin:0 auto;
    width:60px;
    height:60px;
    position:relative;
    top:40%;
}
.container1 > div,.container2 > div,.container3 > div {
    width:15px;
    height:15px;
    background-color:#5fc4d6;
    border-radius:100%;
    position:absolute;
    -webkit-animation:bouncedelay 1.2s infinite ease-in-out;
    animation:bouncedelay 1.2s infinite ease-in-out;
    -webkit-animation-fill-mode:both;
    animation-fill-mode:both;
}
.spinner .spinner-container {
    position:absolute;
    width:100%;
    height:100%;
}
.container2 {
    -webkit-transform:rotateZ(45deg);
    transform:rotateZ(45deg);
}
.container3 {
    -webkit-transform:rotateZ(90deg);
    transform:rotateZ(90deg);
}
.circle1 {
    top:0;
    left:0;
}
.circle2 {
    top:0;
    right:0;
}
.circle3 {
    right:0;
    bottom:0;
}
.circle4 {
    left:0;
    bottom:0;
}
.container2 .circle1 {
    -webkit-animation-delay:-1.1s;
    animation-delay:-1.1s;
}
.container3 .circle1 {
    -webkit-animation-delay:-1.0s;
    animation-delay:-1.0s;
}
.container1 .circle2 {
    -webkit-animation-delay:-0.9s;
    animation-delay:-0.9s;
}
.container2 .circle2 {
    -webkit-animation-delay:-0.8s;
    animation-delay:-0.8s;
}
.container3 .circle2 {
    -webkit-animation-delay:-0.7s;
    animation-delay:-0.7s;
}
.container1 .circle3 {
    -webkit-animation-delay:-0.6s;
    animation-delay:-0.6s;
}
.container2 .circle3 {
    -webkit-animation-delay:-0.5s;
    animation-delay:-0.5s;
}
.container3 .circle3 {
    -webkit-animation-delay:-0.4s;
    animation-delay:-0.4s;
}
.container1 .circle4 {
    -webkit-animation-delay:-0.3s;
    animation-delay:-0.3s;
}
.container2 .circle4 {
    -webkit-animation-delay:-0.2s;
    animation-delay:-0.2s;
}
.container3 .circle4 {
    -webkit-animation-delay:-0.1s;
    animation-delay:-0.1s;
}
@-webkit-keyframes bouncedelay {
    0%,80%,100% {
        -webkit-transform:scale(0.0)
    }
    40% {
        -webkit-transform:scale(1.0)
    }
}@keyframes bouncedelay {
     0%,80%,100% {
         transform:scale(0.0);
         -webkit-transform:scale(0.0);
     }
     40% {
         transform:scale(1.0);
         -webkit-transform:scale(1.0);
     }
 }






