@charset "utf-8";

.photo-show {
    height: 612px; /*表示したい大きさ*/
    margin: 0 auto; /*縦余白30pxは任意*/
    position: relative;
    width: 1920px; /*表示したい大きさ、height と合わせる*/
}

.photo-show img {
    animation: show 20s infinite;
    height: auto;
    max-width: 100%;
    opacity: 0;
    position: absolute; /*画像を全て重ねる*/
}

/*アニメーション*/

@keyframes show {
    0% {opacity : 0}
		50% {opacity : 1}
		100% {opacity: 0}
 }

/*各画像のアニメーションの開始時間をずらす*/

.photo-show img:nth-of-type(1) {
    animation-delay: 0s;
}

.photo-show img:nth-of-type(2) {
    animation-delay: 10s;
}

/*画面幅480px以下の設定
---------------------------------------------------------------------------*/

@media screen and (max-width: 480px) {

  .photo-show{
  }

  .photo-show img{
    height: 480px;
  }


}