footer:before{background-color:#f7f7f7}
.list-container{background-color:#f7f7f7;position:relative;padding-bottom:100px;overflow:hidden}
.list-container:before{content:'';width:100%;height:6.04vw;position:absolute;top:0;left:0;background-color:#fff}
.list-container .news-list{display:flex;flex-wrap:wrap;justify-content:flex-start;padding-left:5%}
.list-container .item{width:calc(1 / 3 * 100%);margin-bottom:106px;position:relative}
.list-container .item span,.list-container .item a{display:block}
.list-container .item:hover .img span{transform:scale(1.1);-webkit-transform:scale(1.1)}
.list-container .item:hover .icon:after{background-position-x:right;width:100%;right:auto;left:0}
.list-container .item.init .img{opacity:0;transform:scale(1.2);-webkit-transform:scale(1.2)}
.list-container .item.init .img-wrap i{height:0%}
.list-container .item:nth-child(3n-1) .img{transition-delay:0.9s;-webkit-transition-delay:0.9s}
.list-container .item:nth-child(3n-1) .img-wrap i{transition-delay:0.2s;-webkit-transition-delay:0.2s}
.list-container .item:nth-child(3n) .img{transition-delay:1.1s;-webkit-transition-delay:1.1s}
.list-container .item:nth-child(3n) .img-wrap i{transition-delay:0.4s;-webkit-transition-delay:0.4s}
.list-container .img{position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;overflow:hidden;transition:0.8s 0.7s;-webkit-transition:0.8s 0.7s}
.list-container .img span{position:absolute;top:0;left:0;width:100%;height:100%;background:no-repeat center;background-size:cover;transition:0.3s;-webkit-transition:0.3s}
.list-container .img-wrap{padding-top:57.5%;position:relative;overflow:hidden}
.list-container .img-wrap i{display:block;position:absolute;top:0;left:0;width:100%;height:100%;transition:1s;-webkit-transition:1s}
.list-container .title{line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:18px;padding-right:30%;margin:52px 0 18px}
.list-container .text{padding-right:30%;line-height:1.85;text-align:justify;font-style:normal;height:calc(1em * 1.85 * 2);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis;color:#999}
.list-container .time{margin-top:40px;line-height:1}
.list-container .time span{display:inline-block;color:#999;vertical-align:middle}
.list-container .time span:before{content:'';display:inline-block;vertical-align:middle;height:1px;width:12px;background-color:#ccc;margin:0 30px}
.list-container .icon{position:absolute;bottom:1px;left:220px;width:28px;height:12px}
.list-container .icon:after{content:'';width:0%;height:100%;display:block;position:absolute;top:0;background:url('../images/icon03.png') no-repeat left top;background-size:auto 100%;right:0;transition:0.3s;-webkit-transition:0.3s}
.list-container .pagination{display:flex;justify-content:space-between;align-items:center;padding:0 calc(5% - 64px);transition:1.2s;-webkit-transition:1.2s;height:90px}
.list-container .pagination.init{opacity:0}
.list-container .site{line-height:1}
.list-container .site p{color:#999;margin:18px 0}
.list-container .site:after{content:'';width:12px;height:1px;background-color:#ccc;display:block}
@media screen and (max-width:1480px){.list-container .pagination{height:74px;padding:0 calc(5% - 50px)}
  .list-container .title{font-size:16px;margin:34px 0 12px}
  .list-container .time{margin-top:24px}
  .list-container .time span:before{width:10px;margin:0 18px}
  .list-container .icon{height:10px;width:24px;bottom:2px;left:180px}
  .list-container .item{margin-bottom:76px}
  .list-container .site p{margin:12px 0}
  .list-container .site p:after{width:10px}
}
@media screen and (min-width:320px) and (max-width:768px){.list-container{padding-bottom:2.4rem;font-size:0.7rem}
  .list-container:before{height:3rem}
  .list-container .news-list{padding:0}
  .list-container .title{font-size:0.8rem;margin:1.4rem 0 0.6rem;padding-right:0}
  .list-container .title,.list-container .text,.list-container .time{padding:0 5%}
  .list-container .text{line-height:1.5;height:calc(1em * 3)}
  .list-container .icon{display:none !important}
  .list-container .time{margin-top:1rem}
  .list-container .time span:before{width:0.6rem;margin:0 0.8rem}
  .list-container .item{width:100%;margin-bottom:2.4rem}
  .list-container .item:nth-child(3n-1) .img,.list-container .item:nth-child(3n) .img{transition-delay:0.7s;-webkit-transition-delay:0.7s}
  .list-container .item:nth-child(3n-1) .img-wrap i,.list-container .item:nth-child(3n) .img-wrap i{transition-delay:0;-webkit-transition-delay:0}
  .list-container .pagination{height:4rem;padding:0 5%}
  .list-container .site{font-size:0.6rem}
  .list-container .site p{margin:0.6rem 0}
  .list-container .site:after{width:0.6rem}
  .list-container .more-wrap:first-child{margin-left:-2.4rem}
  .list-container .more-wrap:last-child{margin-right:-2.4rem}
}