﻿.group {
    background: #f4f4f4;
  }
  .inner:nth-last-of-type(2) {
    padding-bottom: 54px;
  }
  .story-list {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    padding-top: 20px;
    border-bottom: 1px solid #fff;
    background: #fff;
    z-index: 2;
    justify-content: space-between;
  }
  .story-item {
    margin-bottom: 25px;
    width: calc(33% - 27px);
    box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.06);
  }
  .story-item:hover {
    color: #fff;
    background: #00954d;
  }
 .story-item:hover img{
    transform: scale(1.5);
}
 .story-item:hover img{
 transition: all .2s linear;
}
  .story-item .image {
    margin-right: 30px;
    width: 100%;
    height: 160px;
    overflow: hidden;
  }
  .story-item .content {
    padding: 15px 15px 15px 15px;
    width: 100%;
    overflow: hidden;
  }
  .story-item .content p {
    transition: all 0.5s;
  }
  .story-item .content p:nth-of-type(1) {
    margin-bottom: 8px;
    color: #333;
    font-size: 16px;
    font-family: PingFang-SC-Bold, PingFang-SC;
    line-height: 26px;
  }
  .story-item:hover .content p:nth-of-type(1) {
    color: #fff;
  }
  .story-item .content p:nth-of-type(2) {
    margin-bottom: 14px;
    color: #999;
    font-size: 14px;
    line-height: 24px;
  }
  .story-item:hover .content p:nth-of-type(2) {
    color: #fff;
  }
  
  .list-pr-g {
    margin: 0 !important;
    padding: 20px 0 50px;
    background: #fff;
  }
  
  @media (max-width: 1280px) {
  }
  
  @media (max-width: 1000px) {
   
    .story-item {
      width: calc(33.33% - 27px);
    }
  }
  
  @media (max-width: 850px) {
  }
  
  @media (max-width: 650px) {
    .story-item {
      padding: 15px;
      flex-direction: column;
      width: calc(50% - 27px);
    }
  }
  
  @media (max-width: 500px) {
    .story-item {
      padding: 15px;
      flex-direction: column;
      width: calc(100% - 27px);
    }
  }
  