@charset "UTF-8";

.h302 {
  margin-top: 90px;
  font-size: 130%;
  text-align: center;
  font-weight: bold;
}

main section .contents {
  width: 920px;
}
@media only screen and (max-width: 782px) {
  .h302 {margin: 30px 4vw 0; font-size: 110%;}
  main section .contents { width: auto;}
}

.thumbs {
  display: flex;
  flex-wrap: wrap;
}
.thumbs li {
  width: 140px;
  margin: 40px 40px 0 0;
}

.thumbs li a { background: #000; display: inline-block; width: 100%;}
.thumbs li a img { width: 100%;}
.thumbs li a:hover img { animation: flash 0.5s ease;}

@media only screen and (max-width: 782px) {
  main section { margin: 0 2vw;}
  .thumbs li {
    width: calc(33.333% - 4vw);
    margin: 4vw 2vw 0;
  }
}