@charset "utf-8";


/*CSSスライドショー設定
---------------------------------------------------------------------------*/

/*5枚スライド
---------------------------------------------------------------------------*/
#stage {
	   clear: left;
	   width: 100%;
	   height: auto;
	   background: #a5afd3;	/*背景色（古いブラウザだとここの色のみが出ます）*/
	   background: -webkit-linear-gradient(#4ec6ed, #94dff8);	/*グラデーション*/
	   background: linear-gradient(#4ec6ed, #94dff8);			/*同上*/
}

#frame {
	max-width: 1200px;
	height: 100vh;
	margin: 0 auto;
	margin-top: -28px;
	position: relative;
}
#photo1,#photo2,#photo3,#photo4,#photo5 {
	position: absolute;
	width: 100%;
	height: auto;
}
#photo1 img,#photo2 img,#photo3 img,#photo4 img,#photo5 img {
	opacity:0;
	-moz-animation: imgTrans 30s infinite;
	-webkit-animation: imgTrans 30s infinite;
	animation: imgTrans 30s infinite;
}
#photo1 img {
	-moz-animation-delay: 0s;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
#photo2 img {
	-moz-animation-delay: 6s;
	-webkit-animation-delay: 6s;
	animation-delay: 6s;
}
#photo3 img {
	-moz-animation-delay: 12s;
	-webkit-animation-delay: 12s;
	animation-delay: 12s;
}
#photo4 img{
	-moz-animation-delay: 18s;
	-webkit-animation-delay: 18s;
	animation-delay: 18s;
}
#photo5 img {
	-moz-animation-delay: 24s;
	-webkit-animation-delay: 24s;
	animation-delay: 24s;
}

@-webkit-keyframes imgTrans {
 0% { opacity:0; }
 5% { opacity:1; }
 20% { opacity:1; }
 25% { opacity:0; } 
 100% { opacity:0; }
}
@-moz-keyframes imgTrans {
 0% { opacity:0; }
 5% { opacity:1; }
 20% { opacity:1; }
 25% { opacity:0; } 
 100% { opacity:0; }
}
@keyframes imgTrans {
 0% { opacity:0; }
 5% { opacity:1; }
 20% { opacity:1; }
 25% { opacity:0; } 
 100% { opacity:0; }
}