.image-marquee__container {
  overflow: hidden;
  white-space: nowrap;
  padding: 0px 0;
}

.image-marquee {
  display: flex;
  white-space: nowrap;
}

.image-marquee__item {
  flex-shrink: 0;
}

.image__box {
  height: 75px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.image-area__box {
  width: 100vw;
  white-space: normal;
  padding: 1px;
}

@media screen and (min-width: 48em) {
  .image-area__box {
    width: 33.3vw;
  }
}
@media screen and (min-width: 64em) {
  .image-area__box {
    width: 25vw;
  }
}
@media screen and (min-width: 72em) {
  .image-area__box {
    width: 16.66vw;
  }
}
.image-marquee.is-zoom-animation .image-marquee__item {
  pointer-events: none;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}
.image-marquee.is-zoom-animation .image-marquee__item.is-active {
  pointer-events: auto;
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
.zoom-in {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.zoom-out {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

/*# sourceMappingURL=image-marquee.css.map */