.services{padding:30px 0 0 0;}
.xcx_case{width:100%; margin-top:30px;}
.xcx_case ul{width:104%;}
.xcx_case li{width:21%; float:left; margin:40px 4% 0 0; display:inline-block; position:relative; text-align:center;}
.xcx_case li h2{font-size:18px; color:#555; line-height:30px; height:30px; margin-top:20px; width:100%; overflow:hidden;}
.xcx_case li p{color:#999; font-size:14px; margin-top:5px; height:20px; overflow:hidden;}
.xcx_case li .xcx_case_info{position:relative; border:10px #f0f0f0 solid; border-radius:15px; background:#f0f0f0;}
.xcx_case li .xcx_case_info:before {content: "";height: 100px;position: absolute;bottom: 0;left: 0;right: 0;margin: 0 auto;box-shadow: 0 6px 50px rgba(156, 156, 156, 0.6);z-index: -1;width: 80%;}
.xcx_case li .xcx_case_info img{border-radius:10px; width:100%;}
.xcx_case li .xcx_case_info .xcx_case_ewmico{position:absolute; top:0; right:0; z-index:2; width:33%; cursor:pointer;}
.xcx_case li .xcx_case_info .xcx_case_ewmico img{border-radius:0;}
.xcx_case li .xcx_case_info .xcx_case_ewm{position:absolute; top:0; left:0; background:rgba(255,255,255,.95); width:100%; height:100%; border-radius:10px; text-align:center; z-index:1; opacity:0;}
.xcx_case li:hover .xcx_case_info .xcx_case_ewm{ opacity:1; display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-pack: center;
  -moz-box-align: center;
  
  display: -o-box;
  -o-box-orient: horizontal;
  -o-box-pack: center;
  -o-box-align: center;
  
  display: -ms-box;
  -ms-box-orient: horizontal;
  -ms-box-pack: center;
  -ms-box-align: center;
  
  display: box;
  box-orient: horizontal;
  box-pack: center;
  box-align: center;}
.xcx_case li .xcx_case_info .xcx_case_ewm span, .xcx_case li .xcx_case_info .xcx_case_ewm em{width:70%; margin:0 auto; overflow:hidden; display:inline-block;}
.xcx_case li .xcx_case_info .xcx_case_ewm span img{ width:100%; border-radius:0; -webkit-transition:all .3s ease-out 0s ; -moz-transition:all .3s ease-out 0s ; -ms-transition:all .3s ease-out 0s; -o-transition:all .3s ease-out 0s; transition:all .3s ease-out 0s;-webkit-transform: translateY(20px); -moz-transform:translateY(20px); -ms-transform: translateY(20px); -o-transform:translateY(20px); transform:translateY(20px); }
.xcx_case li:hover .xcx_case_info .xcx_case_ewm span img{-webkit-transform: translateY(0px); -moz-transform:translateY(0px); -ms-transform: translateY(0px); -o-transform:translateY(0px); transform:translateY(0px); }