.bg {
  background-image: url("../asset/foreword/bg.jpg");
  background-size: cover;
}

.wrapper .gallery {
  margin: auto;
  display: flex;
  /* padding: 4% 2%; */
  box-sizing: border-box;
}

.wrapper .gallery .item {
  flex: 1;
  transition: all 0.5s ease;
  margin: 0 1%;
  line-height: 0;
}

.wrapper .gallery .item:hover {
  flex: 1 1 20%;
}

.wrapper .gallery .item img {
  width: 100%;
  height: calc(100% - 0.5vw);
  object-fit: cover;
  transition: all 0.5s ease;
  filter: grayscale(1);
}

.wrapper .gallery .item span {
  font-size: 0.75vw;
  display: block;
  text-align: center;
  height: 5vw;
  line-height: 1.5vw;
  opacity: 0;
  transition: all 0.5s ease;
}

.wrapper .gallery .item:hover span {
  opacity: 1;
  color: white;
}