/*一行两个*/

.cube-type2 {
  height: 200px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  & .outer-shadow {
    box-shadow: 4px 4px 4px #969292;
  }
}
/* 大图 */
.outer-shadow {
  box-shadow: 4px 4px 4px #969292;
}
/*一行三个*/

.cube-type10 {
  height: 200px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  & .outer-shadow {
    box-shadow: 4px 4px 4px #969292;
  }
}
/*一上二下*/

.cube-type3 {
  height: 400px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 10px;
  & .outer-shadow {
    box-shadow: 4px 4px 4px #969292;
  }

  & .block:nth-child(1) {
    grid-area: 1 / 1 / 2 / 3;
  }

  & .block:nth-child(2) {
    grid-area: 2 / 1 / 3 / 2;
  }

  & .block:nth-child(3) {
    grid-area: 2 / 2 / 3 / 3;
  }
}

/*一左二右*/

.cube-type4 {
  height: 400px;
  display: grid;
  gap: 10px;
  grid-template-rows: repeat(2, 1fr);
  grid-template-columns: repeat(2, 1fr);
  & .outer-shadow {
    box-shadow: 4px 4px 4px #969292;
  }

  & .block:nth-child(1) {
    grid-row: 1 / 3;
  }
}

/*田字形*/

.cube-type5 {
  height: 400px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 10px;
  & .outer-shadow {
    box-shadow: 4px 4px 4px #969292;
  }
  & .block:nth-child(1) {
    grid-area: 1 / 1 / 2 / 2;
  }

  & .block:nth-child(2) {
    grid-area: 1 / 2 / 2 / 3;
  }

  & .block:nth-child(3) {
    grid-area: 2 / 1 / 3 / 2;
  }

  & .block:nth-child(4) {
    grid-area: 2 / 2 / 3 / 3;
  }
}

/*一左三右*/

.cube-type6 {
  height: 400px;
  display: grid;
  gap: 10px;
  grid-template: repeat(2, 1fr) / repeat(3, 1fr);
  & .outer-shadow {
    box-shadow: 4px 4px 4px #969292;
  }

  & .block:nth-child(1) {
    grid-row: 1 / 3;
  }

  & .block:nth-child(2) {
    grid-row: 1 / 2;
    grid-column: 2/4;
  }
  & .block:nth-child(3) {
    grid-row: 2 / 3;
    grid-column: 2/3;
  }
  & .block:nth-child(4) {
    grid-row: 2 / 3;
    grid-column: 3/4;
  }
}

.block {
  height: 100%;
  width: 100%;
  overflow: hidden;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
