@charset "utf-8";

/*用户实操案例展示样式*/
a {cursor: pointer;}
.example_wrap{width: 1200px;margin:30px auto 40px;padding: 20px 0;background-color: #fff;overflow:hidden;}
.example_title{text-align:center;font-size:36px;color:#999;margin-bottom:30px;}
.example_container {float: left;width: 46%;height:210px;margin: 0 2% 20px;padding: 20px 20px 0;line-height: 25px;border-radius: 3px;border:1px solid #ddd;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  -moz-transition: all .5s ease;
  transition: all .5s ease;
}
.example_container .img_cover {float: left;width: 262px;height: 167px;overflow: hidden;}
.example_container .img_cover img {width: 100%;height: 100%;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  -moz-transition: all .5s ease;
  transition: all .5s ease;
}
.example_container:hover {box-shadow: 0 0 8px rgba(0, 0, 0, 0.4);}
.example_container:hover .img_cover img {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}
.example_container .txt{width:230px;float:right;}
.example_container .txt .e_title {display: block;height: 25px;line-height: 25px;margin-bottom: 5px;vertical-align: middle;text-overflow: ellipsis;font-size: 18px;font-weight: bold;white-space: nowrap;overflow: hidden;}
.example_container .txt .e_title  a{color:#000;}
.example_container .txt p  {display: -webkit-box;height: 50px;margin:15px 0px;color: #95a5a6;overflow: hidden;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.example_container .txt .example_btn {display: inline-block;width: 120px;height: 38px;line-height: 38px;text-align: center;color: #fff;border-radius: 5px;background-color: #f75c2f;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  -moz-transition: all .5s ease;
  transition: all .5s ease;
}
.example_container .txt .example_btn:hover {box-shadow: 0 3px 12px rgba(247, 92, 47, 0.8);text-decoration: none;}


/****************展示详情页样式*******************/
.clear_both::after {clear: both;content: ".";display: block;visibility: hidden;height: 0;}
.info_wrap {width:100%;min-width:1300px;background: #eff3f5;overflow:hidden}
.info_container {width:1150px;margin: 50px auto;padding: 20px 50px;background-color: #fff;border: 3px dashed #eff3f5;overflow:hidden;}
.info_container h3 {line-height:30px;margin-bottom: 20px;color: #2c3e50;font-size: 24px;}
.info_container p {margin-bottom: 10px;line-height: 30px;font-size: 16px;text-indent: 2em;text-align:justify;}
.info_container .img_box p,.info_container .big_img_box p {height: 30px;line-height: 30px;margin-top: 10px;text-align: center;text-indent:0;}
.info_container .img_box {float: left;width: 46%;margin: 0 2% 20px;padding: 20px;padding-bottom: 10px;background-color: rgba(168, 216, 185, 0.3);}
.info_container .img_box div {width: 100%;height: 274px;overflow: hidden;cursor: pointer;}
.info_container .big_img_box {float: left;width: 90%;margin: 0 5% 20px;padding: 20px;padding-bottom: 10px;background-color: rgba(168, 216, 185, 0.3);}
.info_container .big_img_box div {width: 100%;overflow: hidden;cursor: pointer;}
.info_container .img_box img ,.info_container .big_img_box img{
  width:100%;  
  height:100%;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  -moz-transition: all .5s ease;
  transition: all .5s ease;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.info_container .img_box div:hover img, .info_container .big_img_box div:hover img{
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}


.info_footer {text-align: center;padding: 20px 0;line-height: 24px;color: #7f8c8d;}
/*弹窗样式*/
.popup_box {display: none;position: fixed;top: 0;right: 0;bottom: 0;left: 0;background-color: rgba(0, 0, 0, 0.8);z-index: 10000;}
.popup_box .img_box {position: absolute;top: 50px;bottom: 50px;left: 50px;right: 50px;text-align: center;}
.popup_box .img_box .case_img {max-width: 99%;max-height: 100%;vertical-align: middle;}