﻿.loop_wrap {
    display: flex;
    width: 700px;
    
    overflow: hidden;
  }
  
  .loop_wrap img {
    width: auto;
    height: 100%;
  }
  .loop_wraplr {
    display: flex;
    width: 700px;
  
    overflow: hidden;
  }
  
  .loop_wraplr img {
    width: auto;
    height: 100%;
  }
  @keyframes loop {
    0% {
      transform: translateX(100%);
    }
    to {
      transform: translateX(-100%);
    }
  }
  
  @keyframes loop2 {
    0% {
      transform: translateX(0);
    }
    to {
      transform: translateX(-200%);
    }
  }
  @keyframes loop3 {
    0% {
      transform: translateX(-100%);
    }
    to {
      transform: translateX(100%);
    }
  }
  
  @keyframes loop4 {
    0% {
      transform: translateX(-200%);
    }
    to {
      transform: translateX(0%);
    }
  }
  .loop_wrap img:first-child {
    animation: loop 50s -25s linear infinite;
  }
  
  .loop_wrap img:last-child {
    animation: loop2 50s linear infinite;
  }
  .loop_wraplr img:first-child {
    animation: loop3 50s -25s linear infinite;
  }
  
  .loop_wraplr img:last-child {
    animation: loop4 50s linear infinite;
  }