.jh-main {
  width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}

.mt50{
  margin-top: 50px !important;
}

.mb80{
  margin-bottom: 80px;
}

.jh-list {
  width: 1200px;
}

.jh-title-box{
  width: 1200px;
  margin: auto;
  height: 35px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
.border-btm{
  border-bottom: 1px solid #ddd;
}

.jh-title-box a{
  font-size: 14px;
  color: #808080;
}
.jh-title-box a:hover{
  font-size: 14px;
  color: #e01b2e;
}

.jh-list-title {
  color: #666;
  font-size: 22px;
  line-height: 23px;
  padding-left: 15px;
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  border-left: 4px solid #e01b2e;
}
.pro-col-txt{
  width: 840px !important;
}
.jh-list-cont{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  overflow: hidden;
}
.jh-list-col {
  float: left;
  width: 282px;
  border-radius: 5px;
  margin-right: 18px;
  margin-bottom: 27px;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.13);
  transition: all .3s ease;
}
.jh-list-col * {
  transition: all .3s ease;
}
.jh-list-col:hover .jh-index-hover {
  opacity: 1;
}
.jh-col-img {
  width: 100%;
  height: 180px;
  border-radius: 5px 5px 0 0;
  position: relative;
  background: url(https://image.bao315.com/Public/Home/images/zxgl/gl-04.jpg) no-repeat;
  background-position: center;
}
.jh-col-title-box{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 14px 14px 30px;
  font-size: 14px;
  color: #fff;
}
.jh-col-title-box span{
  height: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.jh-col-title-box :nth-child(1){
  width: 75%;
}
.jh-index-hover {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 5px;
  background: rgba(173, 61, 61, 0.9);
  color: #fff;
  text-align: left;
  padding-left: 45px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  opacity: 0;
}
.jh-index-hover div {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.jh-index-hover p {
  color: #fff;
  font-size: 18px;
  line-height: 30px;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.jh-index-hover-title {
  white-space: normal !important;
  width: 200px !important;
}
.jh-index-btn {
    color: #fff;
    border-radius: 10px;
    width: 110px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    font-size: 14px;
    border: 1px solid #fff;
    display: inline-block;
    margin-top: 10px;
}

.jh-index-btn {
    margin-top: 20px;
}

.jh-index-btn img {
    width: 6px;
    margin-left: 4px;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    vertical-align: top;
}

.pro-col-img{
  background: url('https://image.bao315.com/Public/Home/images/zxgl/pro.jpg') no-repeat;
  background-position: center;
  background-size: cover;
}