@charset "utf-8";

.download{position: relative; z-index: 2; background: #fff; min-height: 600px;}


.download .list{display: flex; flex-wrap: wrap; margin-top: 60px;}
.download .list>a{display: flex; flex-direction: column; justify-content: space-between; width: 275px; height: 350px; border: 1px solid #ededed; background: #ededed; transition: all .3s; margin-bottom: 32px; margin-right: 30px;}
.download .list>a:nth-child(4n+0){margin-right: 0;}
.download .list>a::after{display: none;}
.download .list>a:hover{background: #0076ce;}
.download .list>a .img{width: 100%; height: 0; padding-bottom: 91%; background: #fff; overflow: hidden;}
.download .list>a .img>img{width: 100%;}
.download .list>a .con{height: 100px; display: flex; flex-direction: column; justify-content: center; align-items: center;  color: #323232; transition: all .3s;}
.download .list>a:hover .con{color: #fff;}
.download .list>a .con .title{padding: 0 15px; font-size: 2rem; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.download .list>a .con .date{font-size: 1.6rem; margin-top: 16px;}

@media (max-width:1199px){
  .download .list{margin-top: 50px; justify-content: space-between;}
  .download .list::after{display: none;}
  .download .list>a{width: 47.5%; height: auto; margin-bottom: 5%; margin-right: 0;}
  .download .list>a .con .title{padding: 0 10px; font-size: 1.6rem; font-weight: normal;}
  .download .list>a .con{height: 85px;}
  .download .list>a .con .title{padding: 0 10px; font-size: 1.5rem; font-weight: normal;}
  .download .list>a .con .date{font-size: 1.3rem; margin-top: 10px;}
}