@charset "UTF-8";
/* ----------------------------------------------------------------
共通部分
---------------------------------------------------------------- */
body {
 margin: 0;
 width: 100%;
}
#contents {
 text-align: center;
 width: 100%;
 max-width: 750px;
 margin: 0 auto;
 overflow: hidden;
}
#contents .img img {
 width: 100%;
 vertical-align: top;
}
#contents .img.note {
 margin: 5px auto;
}
#contents .img .loopSlide{
 display: flex;
    width: 100vw;
    overflow: hidden;
}
#contents .img.slide01 img {
 width: auto;
 &:first-child {
  animation: slide1 60s -30s linear infinite;
 }
 &:last-child {
  animation: slide2 60s linear infinite;
 }
}
#contents .img.slide02 img {
 width: auto;
 &:first-child {
  animation: slide1 120s -60s linear infinite;
 }
 &:last-child {
  animation: slide2 120s linear infinite;
 }
}
#contents .img.cta, #contents .img.point02 {
 position: relative;
}
#contents .img.cta .btn {
 position: absolute;
 margin: auto;
 left: 0;
 right: 0;
 width: 83%;
 bottom: 4.5%;
}
#contents .img.point02 .slide02 {
 position: absolute;
 top: 7%;
 width: 100vw;
}
@keyframes slide1 {
 0% {
  transform: translateX(100%);
 }
 to {
  transform: translateX(-100%);
 }
}
@keyframes slide2 {
 0% {
  transform: translateX(0);
 }
 to {
  transform: translateX(-200%);
 }
}