#reform section.list a {
  width: 15%;
  display: block;
  height: auto;
  overflow: hidden;
}
#reform section.list a:nth-of-type(4), #reform section.list a:nth-of-type(8) {
  width: 40%;
}
#reform section.list a:nth-of-type(4) img, #reform section.list a:nth-of-type(8) img {
  height: auto;
  width: 100%;
}
#reform section.list a img {
  height: 100%;
}
#reform section.list_ {
  display: grid;
  grid-template-columns: 27.5% 27.5% 10% 10% 10% 10%;
  grid-template-rows: 45% 30% 15%;
  grid-template-areas: "a b e f g h" "c d e f g h" "c d . . . .";
  gap: 1%;
}
#reform section.list_ figure {
  display: none;
}
#reform section.list_ a {
  display: block;
  overflow: hidden;
  box-shadow: 0.5px 0.5px 2px #999999;
}
#reform section.list_ a:nth-of-type(1) {
  grid-area: a;
}
#reform section.list_ a:nth-of-type(2) {
  grid-area: b;
}
#reform section.list_ a:nth-of-type(3) {
  grid-area: c;
}
#reform section.list_ a:nth-of-type(4) {
  grid-area: d;
}
#reform section.list_ a:nth-of-type(5) {
  grid-area: e;
}
#reform section.list_ a:nth-of-type(6) {
  grid-area: f;
}
#reform section.list_ a:nth-of-type(7) {
  grid-area: g;
}
#reform section.list_ a:nth-of-type(8) {
  grid-area: h;
}
#reform section.list_ a:nth-of-type(n+5) img {
  width: auto;
  height: 100%;
}
#reform section.list_ a img {
  width: 100%;
}

@media only screen and (max-width: 768px) {
  #reform {
    padding: 5% 3%;
  }
  #reform section {
    width: 100%;
  }
  #reform section.reform_top {
    width: 100%;
  }
  #reform section.reform_top figure {
    flex-wrap: wrap;
  }
  #reform section.reform_top figure figcaption {
    width: 100%;
  }
  #reform section.reform_top figure div {
    width: 100%;
    max-width: 280px;
  }
  #reform section.list {
    flex-wrap: wrap;
  }
  #reform section.list a {
    width: 45vw;
    height: auto;
  }
  #reform section.list a img {
    position: static;
    transform: translate(0);
  }
  #reform section.list a:nth-of-type(4), #reform section.list a:nth-of-type(8) {
    width: 45vw;
  }
  #reform section.list a:nth-of-type(4) {
    order: 7;
  }
  #reform section.list a:nth-of-type(8) {
    order: 8;
  }
  #reform section.list_ {
    display: flex;
    flex-wrap: wrap;
    gap: 4vw;
  }
  #reform section.list_ figure {
    display: none;
  }
  #reform section.list_ a {
    width: 45vw;
    height: 45vw;
  }
  #reform section.list_ a:nth-of-type(n+5) {
    width: 20.5vw;
  }
  #reform section.list_ a:nth-of-type(n+5) img {
    width: 100%;
    height: auto;
  }
  #reform section.list_ a img {
    width: 100%;
  }
}
