.case-tab {
  padding: 30px 0;
  border-bottom: 1px solid #eee;
  overflow: hidden;
}
.case-tab ul {
  float: left;
}
.case-tab ul li {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border: 1px solid #1196DB;
  color: #1196DB;
  display: inline-block;
  border-radius: 30px;
  width: 120px;
  text-align: center;
  height: 32px;
  line-height: 32px;
  margin: 0 5px;
}
.case-tab ul li a {
  color: #1196DB;
display:block
}
.case-tab ul  .curr  {
background: #1196DB;
}
.case-tab ul .curr  a {
color:#fff
}
.case-tab .case-right {
  padding-top: 10px;
}
.case-tab .case-right a {
  color: #1196DB;
  padding-left: 15px;
cursor: pointer;
}
.case-box {
  margin-top:50px;
}
.case-box .row {
  margin-left: -30px;
  margin-right: -30px;
}
.case-box .row li {
  padding: 0 30px;
  -webkit-box-sizing: border-box;
box-sizing: border-box;
  text-align: center;
}
.case-box .row li .case-img {
    position: relative;
    overflow: hidden;
    height: 344px;
    box-sizing: border-box;
    border:1px solid #eee;
    -moz-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	-webkit-transition: all, 0.5s;
    transition: all, 0.5s;
}

.case-box .row li .case-img .zoom-img {
  width:100%;
  height: 100%;
  object-fit: cover;
  display: block;
  margin: 0 auto;
-moz-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	-webkit-transition: all, 0.5s;
	transition: all, 0.5s;
}
.case-box .row li .case-img:hover .zoom-img{
-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.case-box .row li .case-img .case-welcome {
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  -webkit-transition: .5s all;
  transition: .5s all;
  -moz-transition: .5s all;
  -moz-opacity: 0;
  opacity: 0;
}

.case-box .row li .case-img .case-welcome img {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -34px;
-moz-transform: translated(0, 200%, 0);
	-ms-transform: translate3d(0, -200%, 0);
	-webkit-transform: translate3d(0, 200%, 0);
	transform: translate3d(0, 200%, 0);
  -webkit-transition: .5s all;
  transition: .5s all;
  -moz-transition: .5s all;
  -moz-opacity: 0;
}
.case-box .row li .case-txt {
  margin-top: 25px;
  margin-bottom: 20px;
    cursor: pointer;
}
.case-box .row li .case-txt h3 {
  color: #333;
  font-size: 18px;
  font-weight: normal;
  margin-bottom: 5px;
}
.case-box .row li .case-txt p {
  color: #b8b8b8;
}
.case-box .row li .case-txt p span {
  padding: 0 10px;
}
.case-box li:hover .case-img .case-welcome {
  opacity: 1;
  -moz-opacity: 1;
}
.case-box li:hover .case-img .case-welcome img {
    opacity: 1;
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
   margin-top:-34px
}
.case-s-box {
 margin-bottom:50px;
  background: url("/Template/skin1/static2020/case/case/images/bg.png") no-repeat;
}
.case-banner {
  background: url("/Template/skin1/static2020/case/images/banner.jpg") no-repeat 50% 50%;
  height:274px;
  margin-top: 0 !important;
}

@media screen and (max-width:1024px) {
    .case-banner {
        background: url(/Template/skin1/static2020/case/images/ipad-banner.jpg) no-repeat 50% 50%;
        background-size:cover;
        height:210px;
    }
    .case-box .row li .case-img{
        height: 240px;
    }
    .case-tab{
        padding: 30px;
    }
    .case-box{
        padding: 0 40px;
    }

    .case-tab ul li {
        margin-bottom:10px
    }
    .case-img-box{
    width:520px
    }

}
@media screen and (max-width:768px) {
    .case-box .row li .case-img{
        height: 220px;
    }
    .case-box .row li{
        padding: 0 15px;
    }
}
@media screen and (max-width:480px) {
    .case-img-box, .case-box .row li .case-img{
    width:100%
    }
    .case-tab ul li {
    width:30%;
    margin:0 1% 2%;
    }
    .case-box {
    margin:25px 0
    }
    .case-banner {
        background: url(/Template/skin1/static2020/case/images/moblie-banner.jpg) no-repeat 50% 50%;
        background-size:cover;
        height:250px
    }

}<!--ºÄʱ1763787183.2408Ãë-->