/* 图册列表 */

.album {
}

.album ul {
  display: flex;
  flex-flow: wrap;
}

.album li {
  width: 100%;
  padding: 4px;
}

.album li a {
  display: block;
  color: #000;
  text-align: center;
  
}

.album li i {
  display: block;
}

.album li a img {
  width: 100%;
}

.album li p {
  position: relative;
  font: 400 14px/36px "微软雅黑";
  text-align: center;
  color: #000;
  background: #fff;
}

@media (min-width: 1200px) {

  .album-main {
    width: 62.4vw;
    margin: 0 auto;
  }
  .album ul {
    margin: 0 -0.6vw;
    padding: 1vw 0 0;
  }

  .album ul li {
    width: 33.3%;
    padding: 0.6vw
  }

.album li a {
  perspective: 1000px;
  position: relative;
  height: 15.4vw;
}

  .album li p {
    position: relative;
    font: 400 16px/36px "微软雅黑";
    border: 0;
    background: #eee;
  }


.album a .card {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transition: all 0.2s ease;
  border-radius: 10px;
  overflow: hidden;
}
.album a .card:first-of-type {
  z-index: 100;
  opacity: 1;
}

.album a .card:nth-last-of-type(2) {
  z-index: 90;
  opacity: 0.8;
}

.album a .card:last-of-type {
  z-index: 80;
  opacity: 0.6;
}

.album a:hover .card:first-of-type {
  transform: rotateX(-20deg) translateZ(0px);
}
.album a:hover .card:nth-last-of-type(2) {
  transform: rotateX(-20deg) translateZ(-50px);
}
.album a:hover .card:last-of-type {
  transform: rotateX(-20deg) translateZ(-100px);
}
}