@keyframes slide-to-left {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-50%);
  }
}

@keyframes slide-to-right {
  from {
    transform: translateX(-50%);
  }
  to {
    transform: translateX(0);
  }
}

.overview-client-list__wrapper {
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  list-style: none;
  gap: 20px;
}

.overview-client-list__logos1 {
  background-image: url('/publish/pages/product/recruit-overview/images/client-logos1.png');
  background-repeat: repeat-x;
  background-size: 2992px 80px;
  background-position: 0 0;
  animation-duration: 110s;
  animation-iteration-count: infinite;
  animation-name: slide-to-right;
  animation-timing-function: linear;
  width: 5984px;
  height: 80px;
}

.overview-client-list__logos2 {
  background-image: url('/publish/pages/product/recruit-overview/images/client-logos2.png');
  background-repeat: repeat-x;
  background-size: 3072px 80px;
  background-position: 0 0;
  animation-duration: 110s;
  animation-iteration-count: infinite;
  animation-name: slide-to-left;
  animation-timing-function: linear;
  width: 6144px;
  height: 80px;
}

.overview-client-list__logos3 {
  background-image: url('/publish/pages/product/recruit-overview/images/client-logos3.png');
  background-repeat: repeat-x;
  background-size: 2992px 80px;
  background-position: 0 0;
  animation-duration: 110s;
  animation-iteration-count: infinite;
  animation-name: slide-to-right;
  animation-timing-function: linear;
  width: 5984px;
  height: 80px;
}

@media (max-width: 1919px) {
  .overview-client-list__wrapper {
    gap: 16.71px;
  }

  .overview-client-list__logos1 {
    background-size: 2347.34px 66.69px;
    width: 4694.68px;
    height: 66.69px;
  }

  .overview-client-list__logos2 {
    background-size: 2550.73px 66.69px;
    width: 5101.46px;
    height: 66.69px;
  }

  .overview-client-list__logos3 {
    background-size: 2494.05px 66.69px;
    width: 4988.1px;
    height: 66.69px;
  }
}

@media (max-width: 1599px) {
  .overview-client-list__wrapper {
    gap: 16.71px;
  }

  .overview-client-list__logos1 {
    background-size: 2494.05px 66.69px;
    width: 4988.1px;
  }

  .overview-client-list__logos2 {
    background-size: 2550.73px 66.69px;
    width: 5101.46px;
  }

  .overview-client-list__logos3 {
    background-size: 2494.05px 66.69px;
    width: 4988.1px;
  }
}

@media (max-width: 768px) {
  .overview-client-list__wrapper {
    gap: 12px;
  }

  .overview-client-list__logos1 {
    background-size: auto 42px;
    width: 3142px;
    height: 42px;
  }

  .overview-client-list__logos2 {
    background-size: auto 42px;
    width: 3280px;
    height: 42px;
  }

  .overview-client-list__logos3 {
    background-size: auto 42px;
    width: 3142px;
    height: 42px;
  }
}