.person-container .person-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
@media screen and (max-width: 992px) {
  .person-container .person-list {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 768px) {
  .person-container .person-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 567px) {
  .person-container .person-list {
    grid-template-columns: repeat(1, 1fr);
  }
}
.person-container .person-list .person {
  display: block;
  position: relative;
  width: 100%;
}
.person-container .person-list .person .avatar {
  display: block;
  width: 100%;
  height: 228px;
  -o-object-fit: cover;
     object-fit: cover;
}
.person-container .person-list .person .intro {
  position: absolute;
  left: 0;
  bottom: -40px;
  right: 0;
  color: #fff;
  border-radius: 0px 20px;
  background: rgba(0, 78, 162, 0.83);
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
}
.person-container .person-list .person .intro .name {
  font-size: 20px;
}
.person-container .person-list .person .intro .content {
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/*# sourceMappingURL=person.css.map */