﻿

/*** for PC Browser ***/
@media (min-width:401px)
{
.slide_1 {
  position: relative;
  overflow: hidden;
  width: 500px;
  height: 282px;
  padding: 0.5rem 1.0rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
  border: 1px solid #AAA;
}

.slide_1 img {
  display: block;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  width: inherit;
  height: inherit;
  left: 100%;
  animation: slide-anime 25s linear infinite;
}

.slide_1 img:nth-of-type(1) {animation-delay: 0s;}
.slide_1 img:nth-of-type(2) {animation-delay: 5s;}
.slide_1 img:nth-of-type(3) {animation-delay: 10s;}
.slide_1 img:nth-of-type(4) {animation-delay: 15s;}
.slide_1 img:nth-of-type(5) {animation-delay: 20s;}



@keyframes slide-anime {
  0% {left: 100%;}
  4% {left: 3%;}
  46% {left: 3%;}
  50% {left: -100%;}
  100% {left: -100%;}
}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
.slide_1 {
  position: relative;
  overflow: hidden;
  width: 400px;
  height: 226px;
  padding: 0.5rem 1.0rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
  border: 1px solid #AAA;
}

.slide_1 img {
  display: block;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  width: inherit;
  height: inherit;
  left: 100%;
  animation: slide-anime 25s linear infinite;
}

.slide_1 img:nth-of-type(1) {animation-delay: 0s;}
.slide_1 img:nth-of-type(2) {animation-delay: 5s;}
.slide_1 img:nth-of-type(3) {animation-delay: 10s;}
.slide_1 img:nth-of-type(4) {animation-delay: 15s;}
.slide_1 img:nth-of-type(5) {animation-delay: 20s;}

.slide_1 {
    width: 300px !important;
    height: 152px !important;
    padding: 0.5rem 1px !important;
    box-sizing: border-box !important;
}

.slide_1 img {
    max-width: 94% !important;
}

@keyframes slide-anime {
  0% {left: 100%;}
  4% {left: 3%;}
  46% {left: 3%;}
  50% {left: -100%;}
  100% {left: -100%;}
}
}
