.cases {background-color:#f9f9f9; }
.cases .tabbox {background-color:#fff; }
.case{width:1200px;margin:80px auto;}
.case .mktitle {text-align:center}
.case .items{overflow:hidden; background-color:#fff;  margin-top: 50px;  padding: 40px 50px;}
.case .item{ margin-bottom: 50px; margin-bottom: 50px;  position: relative;}
.case .item .tit{line-height: 50px;text-align:left; text-indent:10px; color: #333;font-size: 18px;font-weight: bold;margin-bottom: 10px;  border-bottom: 1px solid #ececec; cursor:pointer;}
.case .item .tit span{float:right; line-height:50px; color:#666; font-weight:normal; }
.case .item.on .tit{color:#ec6c00; border-bottom-color:#ec6c00}
.case .item.on .tit span{font-weight:bold; color:#ec6c00}
.case .item.on .imgbox {display:block}
.case .item .imgbox{ display:none; overflow:hidden;}
.case .item .imgbox .imgs{ position: relative; width: 23%;margin: 0 1% 2%; display: block;} 
.case .item .imgbox .tab_nav{overflow:hidden; margin-bottom:10px; }
.case .item .imgbox .tab_nav a{padding:2px 10px; display:block; margin-right:20px;float: left; line-height: 30px; font-size:15px; color:#333; }
.case .item .imgbox .tab_nav a.on{color:#ec6c00; font-weight:bold}
.case .item .imgbox .tab_con{overflow: hidden;border: 1px solid #eee;padding-top: 1%;display: flex; flex-wrap: wrap; }
/*.case .item .imgbox .imgs:hover p{    background-color:rgba(236, 108, 0, 0.6); top: 0; font-size: 24px; text-align: center;   padding-top: 20%;}*/
.case .item .imgbox .imgs:hover img {  -webkit-transition: all linear 0.5s; transition: all linear 0.5s; z-index: 10;-webkit-transform: scale(1.05);-moz-transform: scale(1.05); transform: scale(1.05);}
.case .item .imgbox p{position: absolute;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,0.5);line-height: 40px;color: #fff;padding: 5px 20px;}
.case .items .swiper-button-prev{opacity:0.6; background:url(/images/swiper_right.png) no-repeat center center; left: -30px;  width: 25px; height: 40px; background-size: cover; display:none}
.case .items .swiper-button-next{opacity:0.6; background:url(/images/swiper_left.png) no-repeat center center;right:-30px; width: 25px; height: 40px; background-size: cover;display:none}
.case .item.on .swiper-button-prev ,.case .item.on .swiper-button-next {display:block; margin-top:0;}
.case .item.on .swiper-button-prev:hover ,.case .item.on .swiper-button-next:hover {opacity:1;}


@media (max-width: 1200px){
    .case{width:100%;margin:auto;}
    .case .mktitle {text-align:center; margin-top:6%;}
    .case .items{ margin-top: 5%;  padding: 5% 4%;}
    .case .item{ margin-bottom: 5%;}
    .case .item .tit{font-size:16px;}
    .case .item .imgbox p{line-height:30px; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:1px 10px;}
    .case .item .imgbox .imgs{ width:49%;margin: 0.5%;} 
    .case .item .imgbox .tab_nav{overflow:hidden; margin-bottom:10px; }
    .case .item .imgbox .tab_nav a{padding:2px 10px; display:block; margin-right:10px;line-height: 30px; font-size:15px; color:#333; }
    .case .item .imgbox .tab_nav a.on{color:#ec6c00; font-weight:bold}
    .case .item .imgbox .tab_con{overflow: hidden;border: 1px solid #eee;padding-top: 1%; }
}