@charset "utf-8";

.top-banner{position:relative;width:100%;background:#282923;z-index:1}
.top-banner img{width:100%;}
.main-content{position:relative;}

.case-tab{text-align: center;padding:30px 0;text-align:center;}
.case-tab li{display:inline-block;width:120px;cursor:pointer;margin-bottom:10px;}
.case-tab li span{display:inline-block;border-bottom:3px solid #BB2A34;height:30px;line-height:30px;font-size:16px;color:#333;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-ms-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s;}
.case-tab li.current span,.case-tab li:hover span{display:block;text-align:center;background:#333;color:#FFF;}
.case-section{background:#424242;}
.case-con ul{margin-right:-16px;margin-bottom:-16px;}
.case-con li{float:left;width:416px;height:320px;margin-right:16px;margin-bottom:16px;position: relative;overflow: hidden;}
.case-con li img{position:relative;width:100%;height:100%;overflow: hidden;}
.case-con li .title{position:absolute;bottom:-65px;left:0;width:100%;height:60px;border-top:3px solid #DD3641;background: rgba(0,0,0,.7);-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-ms-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s;}
.case-con li a:hover .title{bottom:0;}
.case-con li .title h3{line-height:60px;font-size:20px;color:#FFF;padding:0 20px;background: url(../images/arrow_right.png) 95% center no-repeat;}

.slide-wrap{background:#3A3A3A;height:700px;position:relative;margin-bottom:120px;text-align:center;}
.slide-wrap .case-slide{position:absolute;width:1245px;height:700px;background:#EEE;box-shadow:0 0 20px #424242;top:60px;left:50%;margin-left:-640px;}
.flexslider{border:0;margin-bottom:0;height:100%;width:100%;}
.flex-viewport,.flexslider .slides,.flexslider .slides > li,.flexslider .slides img{height:100%;}
.flex-direction-nav .flex-prev{height:50px;width:50px;left:20px;line-height:1000px;background:#666666 url(../images/arrow_prev.png) center center no-repeat;background-size:20px 30px;opacity:1}
.flex-direction-nav .flex-next{height:50px;width:50px;right:20px;line-height:1000px;background:#666666 url(../images/arrow_next.png) center center no-repeat;background-size:20px 30px;opacity:1}
.flex-direction-nav a:before{display:none;}
.flex-direction-nav .flex-prev:hover,.flex-direction-nav .flex-next:hover{background-color:#BB2A34}

.case-title{font-size:22px;font-weight:bold;line-height:50px;}
.case-detail{padding:30px 0;border:3px solid #999;border-width:3px 0}
.case-detail p{font-size:16px;line-height:28px;color:#666;padding:10px 0;text-indent: 32px;}
.case-bottom{padding:20px 0;margin-bottom:50px;}
.case-bottom a{display:inline-block;height:35px;line-height:35px;font-size:16px;padding:0 15px;background:#555;color:#FFF;-webkit-transition:all .2s ease-in-out;;-moz-transition:all .2s ease-in-out;;-o-transition:all .2s ease-in-out;;transition:all .2s ease-in-out;}
.case-bottom a:hover{background:#BB2934;color:#FFF;}

.related-case{margin-bottom:50px;position:relative;}
.related-con{position:relative;width:100%;overflow:hidden;z-index: 10;}
.related-con .related-list{width:10000px;}
.related-con .related-item{float:left;width:305px;padding-right:20px;}
.related-con .related-item .related-img{width:100%;height:230px;overflow:hidden;}
.related-con .related-item .related-img img{width:100%;height:100%;}
.related-con .related-item .related-text{height:50px;line-height:50px;font-size:18px;color:#999;border-bottom:3px solid #999;}
.related-case .trigger-prev,.related-case .trigger-next{position:absolute;height:40px;width:30px;top:100px;z-index:11;-webkit-transition:all .2s ease-in-out;;-moz-transition:all .2s ease-in-out;;-o-transition:all .2s ease-in-out;;transition:all .2s ease-in-out;}
.related-case .trigger-prev{background:#666666 url(../images/arrow_prev.png) center center no-repeat;background-size:20px 35px;left:20px;}
.related-case .trigger-next{background:#666666 url(../images/arrow_next.png) center center no-repeat;background-size:20px 35px;right:20px;}
.related-case .trigger-prev:hover,.related-case .trigger-next:hover{background-color: #BB2A34}

@media screen and (max-width:1280px){
    .case-con li{width:320px;height:auto;margin-right:15px;}
    .slide-wrap .case-slide{width:990px;margin-left:-495px;}
    .related-con .related-item{width:320px;}
    .top-banner {
        margin-top: 50px;
    }
}
@media screen and (max-width:990px){
    .case-con{margin:0 20px;width:auto;}
    .case-con ul{margin:0 -10px -16px;}
    .case-con li{width:48%;margin-right:1%;margin-left:1%;}
    .slide-wrap{padding:0 20px;height:500px;}
    .slide-wrap .case-slide{width:100%;position: relative;margin:0;left:0;height:100%;}
    .detail-layout{width:auto;margin:0 20px;}
    .related-con{width:655px;margin:0 auto;}
}
@media screen and (max-width:780px){
    .case-con li .title{height:50px;bottom:-55px}
    .case-con li .title h3{line-height: 50px;}
    .slide-wrap{height:400px;}
    .flex-control-nav{display:none;}
}
@media screen and (max-width:660px){
    .flex-direction-nav .flex-prev{height:40px;width:40px;left:-5px;}
    .flex-direction-nav .flex-next{height:40px;width:40px;right:-5px;}
    .case-tab{position: relative;padding:20px 0;}
    .case-tab::before{content:"";position: absolute;height:1px;overflow:hidden;width:100%;background:#DDD;left:0;top:50%;}
    .case-tab li{position: relative;width:25%;float:left;margin:10px 0;}
    .case-tab li:after{content:"";width:1px;height:80%;position:absolute;top:10%;right:0;background:#DDD;}
    .case-tab li:nth-child(4n):after{background:none;}
    .case-tab li span{border-bottom:none;}
    .case-tab li.current span,.case-tab li:hover span{background:none;color:#FA0A17;}
    .case-con{margin:0 15px;}
    .case-bottom{margin-bottom:30px;}
    .slide-wrap{margin-bottom:100px;}
    .related-con{width:500px;}
    .related-con .related-item{box-sizing: border-box;padding:0 10px;}
}
@media screen and (max-width:560px){
    .case-con li .title{position:relative;bottom:0;}
    .case-con li .title h3{font-size:16px;}
    .slide-wrap{height:300px;}
    .related-con{width:440px;}
    .related-con .related-item{box-sizing: border-box;padding:0 10px;width: 230px;}
    .related-con .related-item .related-img{height:180px;}
    .related-case .trigger-prev,.related-case .trigger-next{top:90px;}
    .fd-clr .img{
        height: 142px;
    }
}
@media screen and (max-width:470px){
    .slide-wrap{height:260px;}
    .related-con{width:360px;}
    .related-con .related-item .related-img{height:150px;}
    .related-con .related-item .related-text{height:40px;line-height:40px;font-size:14px;}
    .related-case .trigger-prev,.related-case .trigger-next{top:60px;}
    #quanbu{  display: none;}

}
@media screen and (max-width:380px){
    .fd-clr .img{
        height: 131px;
    }
}
@media screen and (max-width:340px){
    .fd-clr .img{
        height: 112px;
    }
}