﻿.bnbg{background: url("/Public/Home/images/case_top01.jpg") no-repeat center center;width:100%;height:599px;}
/*客户案例*/
.case{ margin-top:60px;}
.case_tit{ width:1000px; margin:0px auto 30px auto;}
.case ul li{ float:left; width:455px; height:283px; margin:0px 27px 27px 0px;}

.pic_01{ width:1274px;  margin:20px auto 0px auto;overflow:hidden; }
.box{float:left; width:313px; height:220px; margin:0px 10px 20px;}
.he_border2{background:#000;width:313px;height:220px;padding:0;margin:0;/*border:1px solid #000;*/position:relative;box-sizing:border-box;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;overflow:hidden}
.he_border2 .he_border2_img{display:block;width:100%;padding:0;margin:0;position:relative;opacity:1;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;overflow:hidden}
.he_border2:hover .he_border2_img{position:absolute;-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);opacity:.6}
.he_border2 .he_border2_caption{color:#fff;padding:0;margin:0;-moz-backface-visibility:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;overflow:hidden}
.he_border2 .he_border2_caption::before,.he_border2 .he_border2_caption::after{position:absolute;content:'';opacity:0;-webkit-transition:opacity 0.4s,-webkit-transform .4s;-moz-transition:opacity 0.4s,-moz-transform .4s;-o-transition:opacity 0.4s,-o-transform .4s;transition:opacity 0.4s,transform .4s}
.he_border2 .he_border2_caption::before{top:14%;right:5%;bottom:14%;left:5%;border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);-moz-transform:scale(0,1);-o-transform:scale(0,1);transform:scale(0,1);-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-o-transform-origin:0 0;transform-origin:0 0}
.he_border2 .he_border2_caption::after{top:8%;right:10%;bottom:8%;left:10%;border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);-moz-transform:scale(1,0);-o-transform:scale(1,0);transform:scale(1,0);-webkit-transform-origin:100% 0;-moz-transform-origin:100% 0;-o-transform-origin:100% 0;transform-origin:100% 0}
.he_border2:hover .he_border2_caption::before,.he_border2:hover .he_border2_caption::after{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
.he_border2 .he_border2_caption,.he_border2 .he_border2_caption > a{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;overflow:hidden; z-index:1000}
/*.he_border2 .he_border2_caption_h{font-size:1.3em;font-weight:700;text-align:center;width:80%;position:absolute;top:20%;left:10%;-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;transition:all .5s ease-in-out;overflow:hidden;opacity:1}*/
.he_border2 .he_border2_caption_p{font-size:1.8em;text-align:center;width:80%;position:absolute;top:60%;left:10%; text-overflow: ellipsis; overflow:hidden; white-space:nowrap;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;overflow:hidden;opacity:0}
.he_border2:hover .he_border2_caption_p{top:45%;opacity:1}
/*case*/
#case{}
#case_top{ width:100%; height:210px; padding-top:134px;}
/*.case_top{ width:1000px; margin:0px auto;}*/
.tit_01{ width:756px; margin:0 auto; text-align:center;padding-right:420px;padding-top: 100px;}
.tit_01 h3{ font-size: 34px;font-family: Microsoft YaHei;font-weight: bold;color: #FFFFFF;line-height: 32px;margin: 40px;}
.tit_01 p{ color:#ffffff;font-size:18px;line-height:38px;text-align: left;}

.num{text-align:center; margin:0px auto 20px;}
ul.pagination { display: inline-block;padding: 0; margin: 0;}
ul.pagination li {display: inline;}
ul.pagination li span.current{background:#0060b8;color:white;}
ul.pagination li a,ul.pagination li span {width:10px; border-radius:3px; color:#0060b8;float: left; color:#0060b8; padding: 8px 16px; text-decoration: none; transition: background-color .3s; border: 1px solid #0060b8; margin: 0 4px;}
ul.pagination li a.active { background-color: #fa890f;color: white; border: 1px solid #fa890f;}
ul.pagination li a:hover:not(.active) {background-color:#1da6ef; color:#fff;}

.case_nr{ width:1200px; margin:0px auto; padding-top:20px;}
.case_left{ float:left; width:880px;padding-top:80px; color:#999; font-size:14px;}
.case_left_nr p a{ display:inline-block; text-decoration:none;}
.case_left img{ max-width:100% !important; overflow:hidden; margin:10px auto;}
.case_num{ margin:20px 0px;}
.case_num a{ margin:0px 20px; color:#aaa; display:inline;}
.case_num a:hover{ color:#888;}

.case_right{/* position:fixed; top:20%; right:20%;*/ width:300px; background:#fff; box-shadow:2px 2px 2px #eee; border-top:5px solid #ff8400; border-left:1px solid #eee; margin-top:80px; float:right; margin-bottom:50px;}
.case_about{ padding:20px 20px 0px; color:#999; font-size:12px; margin-bottom:20px;}
.case_about h3{ font-size:24px; line-height:40px; font-weight:normal; color:#555; margin-bottom:15px;}
.case_about span{ font-weight:bold; color:#888; font-size:14px;}
.case_but{ width:150px; height:35px; line-height:35px; margin:20px 0px;}	
.case_but a{ border:2px solid #ff8400; color:#ff8400; border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; transition:0.5s; font-size:16px; text-align:center;}
.case_but a:hover{ background:#ff8400; color:#fff; padding-right:10px;}
