/* CSS Document */
.loop_css {
    position: relative;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
	width:width:100vw;
    /*width: 100vw;*/
	/*min-width:800px;*/
	/*width:100%;*/
    overflow: hidden;
	margin:0;
	margin-top: 80px;
	padding: 0;
  }

  .loop_css ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;

    margin: 0;
    padding: 0;
  }

  .loop_css li {
    display: inline-block;
    margin: 0;
	padding:0;
    list-style: none;
    text-align: center;
	margin:0;
  }

  .loop_css li {
    width: calc(100vw / 4);
	/*width:50%;*/
  }

@media (min-width: 426.1px) and (max-width: 769px) {
.loop_css {
	width:100vw;
}
  .loop_css li {
    width: calc(100vw / 2);
  }
}

@media (max-width: 426px) {
	.loop_css {
	width:100vw;
}
  .loop_css li {
    width: calc(100vw / 1.5);
  }
}

  .loop_css li img {
    display: block;
    width:100%;
    height: auto;
  }

  .loop_css ul:first-child {
    -webkit-animation: loop 100s -50s linear infinite;
    animation: loop 100s -50s linear infinite;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
  }

  .loop_css ul + ul {
    -webkit-animation: loop2 100s  linear infinite;
    animation: loop2 100s linear infinite;
  }

  /*.loop_css:hover ul {
    animation-play-state: paused;
  }*/

/*
@media (min-width: 576px) {
	.loop_css {
		min-width:1600px;
	  }
  .loop_css li {
    min-width: 320px;
  }
}
*/


  @-webkit-keyframes loop {
    0% {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      transform: translateX(-100%);
    }
  }

  @keyframes loop {
    0% {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      transform: translateX(-100%);
    }
  }

  @-webkit-keyframes loop2 {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }
    to {
      -webkit-transform: translateX(-200%);
      -ms-transform: translateX(-200%);
      transform: translateX(-200%);
    }
  }

  @keyframes loop2 {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }
    to {
      -webkit-transform: translateX(-200%);
      -ms-transform: translateX(-200%);
      transform: translateX(-200%);
    }
  }