@charset "utf-8";
/* CSS Document */


/*スライドショー*/

 /*　表示エリア　*/
.slideshow001 {
  position   : relative;
  overflow   : hidden;
  width      : 400px;
  height     : 270px;
}
 
 /*　画像の設定　*/
.slideshow001 img {
  display    : block;
  position   : absolute;
  width      : inherit;/*画像の大きさをエリアにあわせる*/
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 12s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slideshow001 img:nth-of-type(1) { animation-delay: 0s }
.slideshow001 img:nth-of-type(2) { animation-delay: 4s }
.slideshow001 img:nth-of-type(3) { animation-delay: 8s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   8% { opacity: 1 }
  25% { opacity: 1 }
  33% { opacity: 0 }
 100% { opacity: 0 }
}





@media screen and (max-width: 410px) {
.slideshow001 {
  width      : auto;
}

.slideshow001 img {
    display: block;
    position: absolute;
    width: 92%;
    height: auto;
    opacity: 0;
    animation: slideAnime 12s ease infinite;
        animation-delay: 0s;
    border-radius: 6px;
    border: 10px solid #BAB8DB;
    box-shadow: -2px 4px 1px #999;
}


}