/* ========================================= << スライドショー用 >> ==== */

#auto-slider-fade02 {
	position: relative;
	left: 0%;
	width: 98%;
	max-width: 1000px;
	margin: 0 auto;
	padding-bottom: 5%;
	overflow: hidden;
}

@media screen and (min-width: 641px) {
	#auto-slider-fade02 {
		padding-bottom: 20px;
	}
}

#auto-slider-fade02 input {
	display: none;
}

.btn1 {
	position: absolute;
	bottom: 0;
	width: 14px;
	height: 14px;
	border-radius: 7px;
	background-color: #ccc;
	cursor: pointer;
}

@media screen and (min-width: 641px) {
	.btn1 {
		width: 10px;
		height: 10px;
		border-radius: 5px;
	}
}

#navi1,
#navi1b {
	left: 27%;
}

@media screen and (min-width: 641px) {
	#navi1,
	#navi1b {
		left: 43.5%;
	}
}

#navi2,
#navi2b {
	left: 37%;
}

@media screen and (min-width: 641px) {
	#navi2,
	#navi2b {
		left: 46.5%;
	}
}

#navi3,
#navi3b {
	left: 47%;
}

@media screen and (min-width: 641px) {
	#navi3,
	#navi3b {
		left: 49.5%;
	}
}

#navi4,
#navi4b {
	left: 57%;
}

@media screen and (min-width: 641px) {
	#navi4,
	#navi4b {
		left: 52.5%;
	}
}

#navi5,
#navi5b {
	left: 67%;
}

@media screen and (min-width: 641px) {
	#navi5,
	#navi5b {
		left: 55.5%;
	}
}

#slide {
	position: absolute;
	width: 100%;
	height: 100%;
	opacity:0;
	animation: auto-slider-fade02 30s infinite;
	-moz-animation: auto-slider-fade02 30s infinite;
	-webkit-animation: auto-slider-fade02 30s infinite;
	pointer-events: none;
}

.slide-img {
	position: absolute;
	width: 100%;
	height: 100%;
}
.slide-img img {
	width: 100%;
}

#slide1 { left: 0; }
#slide2 { left: 100%; }
#slide3 { left: 200%; }
#slide4 { left: 300%; }
#slide5 { left: 400%; }

.btn2 {
	position: absolute;
	bottom: 0;
	width: 14px;
	height: 14px;
	border-radius: 7px;
	background-color: #56b329;
}

@media screen and (min-width: 641px) {
	.btn2 {
		width: 10px;
		height: 10px;
		border-radius: 5px;
	}
}

#auto-slider-fade02-1:checked ~ #slide {
	animation: auto-slider-fade02-a 30s infinite;
	animation-delay: 0s;
	-moz-animation: auto-slider-fade02-a 30s infinite;
	-moz-animation-delay: 0s;
	-webkit-animation: auto-slider-fade02-a 30s infinite;
	-webkit-animation-delay: 0s;
}

#auto-slider-fade02-2:checked ~ #slide {
	animation: auto-slider-fade02-b 30s infinite;
	animation-delay: -6s;
	-moz-animation: auto-slider-fade02-b 30s infinite;
	-moz-animation-delay: -6s;
	-webkit-animation: auto-slider-fade02-b 30s infinite;
	-webkit-animation-delay: -6s;
}

#auto-slider-fade02-3:checked ~ #slide {
	animation: auto-slider-fade02-c 30s infinite;
	animation-delay: -12s;
	-moz-animation: auto-slider-fade02-c 30s infinite;
	-moz-animation-delay: -12s;
	-webkit-animation: auto-slider-fade02-c 30s infinite;
	-webkit-animation-delay: -12s;
}

#auto-slider-fade02-4:checked ~ #slide {
	animation: auto-slider-fade02-d 30s infinite;
	animation-delay: -18s;
	-moz-animation: auto-slider-fade02-d 30s infinite;
	-moz-animation-delay: -18s;
	-webkit-animation: auto-slider-fade02-d 30s infinite;
	-webkit-animation-delay: -18s;
}

#auto-slider-fade02-5:checked ~ #slide {
	animation: auto-slider-fade02-e 30s infinite;
	animation-delay: -24s;
	-moz-animation: auto-slider-fade02-e 30s infinite;
	-moz-animation-delay: -24s;
	-webkit-animation: auto-slider-fade02-e 30s infinite;
	-webkit-animation-delay: -24s;
}

@keyframes auto-slider-fade02 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-webkit-keyframes auto-slider-fade02 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-moz-keyframes auto-slider-fade02 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}


@keyframes auto-slider-fade02-a {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-webkit-keyframes auto-slider-fade02-a {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-moz-keyframes auto-slider-fade02-a {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@keyframes auto-slider-fade02-b {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-webkit-keyframes auto-slider-fade02-b {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-moz-keyframes auto-slider-fade02-b {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@keyframes auto-slider-fade02-c {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-webkit-keyframes auto-slider-fade02-c {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-moz-keyframes auto-slider-fade02-c {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@keyframes auto-slider-fade02-d {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-webkit-keyframes auto-slider-fade02-d {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-moz-keyframes auto-slider-fade02-d {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@keyframes auto-slider-fade02-e {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-webkit-keyframes auto-slider-fade02-e {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}
@-moz-keyframes auto-slider-fade02-e {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.005% { left:-100%; opacity:0; }
	25% { left:-100%; opacity:1; }
	38% { left:-100%; opacity:1; }
	40% { left:-100%; opacity:0; }
	40.005% { left:-200%; opacity:0; }
	45% { left:-200%; opacity:1; }
	58% { left:-200%; opacity:1; }
	60% { left:-200%; opacity:0; }
	60.005% { left:-300%; opacity:0; }
	65% { left:-300%; opacity:1; }
	78% { left:-300%; opacity:1; }
	80% { left:-300%; opacity:0; }
	80.005% { left:-400%; opacity:0; }
	85% { left:-400%; opacity:1; }
	98% { left:-400%; opacity:1; }
	100% { left:-400%; opacity:0; }
}

/* ============================================= << スライダー用 >> ==== */
/* 表示画面 */
#stage {
  position: relative;
  left: 5px;
  width: calc( 100% - 10px);
  overflow: hidden;
}
/*全ての写真を水平一列に格納したdiv、#photosに,
スライドショーの animation を設定*/
#photos {
  position:absolute;
  top:0;
  width:100%;
  animation: imgPassToLeft0 30s infinite;
 -webkit-animation: imgPassToLeft0 30s infinite;
}
/*各写真の並び位置を設定
#photo1, #photo2, #photo3, #photo4, #photo5 */
#photo0 { left:  0%; }
#photo1 { left:100%; } 
#photo2 { left:200%; }
#photo3 { left:300%; }
#photo4 { left:400%; }
#photo5 { left:500%; }
#photo6 { left:600%; }
.pic { position:absolute;top:0;width:100%; }
/*写真サイズを可変に*/
.pic img { width:100%; }

/* 全てのラジオボタンを非表示に */
#back1,#back2,#back3,#back4,#back5,#next1,#next2,#next3,#next4,#next5{
	display: none;
}
/*送りボタン文字（＜、＞）の設定*/
.b_left span, .b_right span {
  position: absolute;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 24px;
  font-weight: bold;
  opacity:0;
  top: 40%;
  color:#EEE;
}
.b_left span {
  left: 5%;;	
}
.b_right span {
  left: 85%;
}
/*ボタン文字hover時の設定*/
.pic:hover > label div span {
  opacity:1;
  color:#EEE;
}
.pic label div span:hover {
  color:#f00;
  cursor:pointer;
}
/* 各送りボタンクリック時のanimation設定 */
#next1:checked ~ #photos {
  animation: imgPassToLeft1 30s infinite;	
  animation-delay: -4.8s;
 -webkit-animation: imgPassToLeft1 30s infinite;	
 -webkit-animation-delay: -4.8s;
}
#next2:checked ~ #photos {
  animation: imgPassToLeft2 30s infinite;
  animation-delay: -10.8s;
 -webkit-animation: imgPassToLeft2 30s infinite;
 -webkit-animation-delay: -10.8s;
}
#next3:checked ~ #photos {
  animation: imgPassToLeft3 30s infinite;
  animation-delay: -16.8s;
 -webkit-animation: imgPassToLeft3 30s infinite;
 webkit-animation-delay: -16.8s;
}
#next4:checked ~ #photos {
  animation: imgPassToLeft4 30s infinite;
  animation-delay: -22.8s;
 -webkit-animation: imgPassToLeft4 30s infinite;
 -webkit-animation-delay: -22.8s;
}
#next5:checked ~ #photos {
  animation: imgPassToLeft5 30s infinite;
  animation-delay: -28.8s;
 -webkit-animation: imgPassToLeft5 30s infinite;
 -webkit-animation-delay: -28.8s;
}
#back1:checked ~ #photos {
  animation: imgPassToRight1 30s infinite;
  animation-delay: -28.8s;
 -webkit-animation: imgPassToRight1 30s infinite;
 -webkit-animation-delay: -28.8s;
}
#back2:checked ~ #photos {
  animation: imgPassToRight2 30s infinite;
  animation-delay: -22.8s;
 -webkit-animation: imgPassToRight2 30s infinite;
 -webkit-animation-delay: -22.8s;
}
#back3:checked ~ #photos {
  animation: imgPassToRight3 30s infinite;
  animation-delay: -16.8s;
 -webkit-animation: imgPassToRight3 30s infinite;
 -webkit-animation-delay: -16.8s;
}
#back4:checked ~ #photos {
  animation: imgPassToRight4 30s infinite;
  animation-delay: -10.8s;
 -webkit-animation: imgPassToRight4 30s infinite;
 -webkit-animation-delay: -10.8s;
}
#back5:checked ~ #photos {
  animation: imgPassToRight5 30s infinite;
  animation-delay: -4.8s;
 -webkit-animation: imgPassToRight5 30s infinite;
 -webkit-animation-delay: -4.8s;
}
/* animation設定 */
@keyframes imgPassToLeft0 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@keyframes imgPassToLeft1 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@keyframes imgPassToLeft2 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@keyframes imgPassToLeft3 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@keyframes imgPassToLeft4 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@keyframes imgPassToLeft5 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@keyframes imgPassToRight1 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@keyframes imgPassToRight2 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@keyframes imgPassToRight3 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@keyframes imgPassToRight4 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@keyframes imgPassToRight5 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@-webkit-keyframes imgPassToLeft0 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft1 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft2 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft3 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft4 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft5 {
   0% { left:-100%; }
  16% { left:-100%; }
  20% { left:-200%; }
  36% { left:-200%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-400%; }
  76% { left:-400%; }
  80% { left:-500%; }
  96% { left:-500%; }
 100% { left:-600%; }
}
@-webkit-keyframes imgPassToRight1 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@-webkit-keyframes imgPassToRight2 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@-webkit-keyframes imgPassToRight3 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@-webkit-keyframes imgPassToRight4 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}
@-webkit-keyframes imgPassToRight5 {
   0% { left:-500%; }
  16% { left:-500%; }
  20% { left:-400%; }
  36% { left:-400%; }
  40% { left:-300%; }
  56% { left:-300%; }
  60% { left:-200%; }
  76% { left:-200%; }
  80% { left:-100%; }
  96% { left:-100%; }
 100% { left:0%; }
}