@charset "UTF-8";


/*  ######基本の色の設定######  */
/*	
	color: #5773b7; メニューの文字の色　青
	color: #5780ec; ちょっと明るい青
	color: #999; マウスをのせたときの色　灰色
	color: #2db772; コンテンツのみどり色 少し濃い
	       #58bca3;コンテンツのみどり色　明るい
	color: #ffcc00;  見出しの黄色
	color: #ddd; アンダーライン　薄い灰色
	color: #ff99cc; ピンク
*/

/*  ######　MSV　ページ送りの設定　######  */

/*全体のコンテナー*/
#stage {
	position: relative;
	width: 600px;
	height: 800px;
	margin: 0 auto;
	overflow:hidden;
}

/*全てのラジオボタンを非表示に*/
#back1,#back2,#back3,#back4,#back5,#back6,#back7,#back8,#back9,#back10,#back11,#back12,#next1,#next2,#next3,#next4,#next5,#next6,#next7,#next8,#next9,#next10,#next11,#next12 {
	display: none;
}

/*全ての写真を水平一列に格納したdiv、#imgにtransitionを設定*/
#img {
	position:absolute;
	top:0;
    width: 7200px;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
}
/*各写真の並び位置を設定*/
#img01, #img02, #img03, #img04, #img05, #img06, #img07, #img08, #img09, #img10, #img11, #img12 {
	position:relative;
	float:left;
}

/*ボタン領域の設定*/
.cover_left, .cover_right {
	position:absolute;
	top: 40px;
	width:200px;
	height:730px;
	display:none;
	cursor:pointer;
	z-index:101;
}
.cover_left {
	left:0;
}
.cover_right {
	left:400px;
}
/*ボタン領域内のボタン文字（＜、＞）の設定*/
.cover_left span, .cover_right span {
	position: absolute;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 40px;
	font-weight: bold;
	opacity:0;
	top: 350px;
}
.cover_left span {
	left: 10px;	
}
.cover_right span {
	left: 160px
}
/*ボタン領域hover時文字の設定*/
.cover_right:hover > span,.cover_left:hover > span {
	opacity:1;
	color:#555;
}

#right1,#right2,#right3,#right4,#right5,#right6,#right7,#right8,#right9,#right10,#right11,#left2,#left3,#left4,#left5,#left6,#left7,#left8,#left9,#left10,#left11,#left12 {
	display:none;
}


/*各ボタン領域がクリックされた時の#imgの行き先位置の設定*/
#back2:checked ~ #img { left:0; }
#back3:checked ~ #img,#next1:checked ~ #img { left:-600px; }
#back4:checked ~ #img,#next2:checked ~ #img { left:-1200px; }
#back5:checked ~ #img,#next3:checked ~ #img { left:-1800px; }
#back6:checked ~ #img,#next4:checked ~ #img { left:-2400px; }
#back7:checked ~ #img,#next5:checked ~ #img { left:-3000px; }
#back8:checked ~ #img,#next6:checked ~ #img { left:-3600px; }
#back9:checked ~ #img,#next7:checked ~ #img { left:-4200px; }
#back10:checked ~ #img,#next8:checked ~ #img { left:-4800px; }
#back11:checked ~ #img,#next9:checked ~ #img { left:-5400px; }
#back12:checked ~ #img,#next10:checked ~ #img { left:-6000px; }
#next11:checked ~ #img { left:-6600px; }



/*ボタン領域クリック時に前表示域を消し切り替え後の表示域を表示*/
#back2:checked ~ #n_btn label #right1 { display:block; }
#back3:checked ~ #b_btn label #left2,#back3:checked ~ #n_btn label #right2 { display:block; }
#back4:checked ~ #b_btn label #left3,#back4:checked ~ #n_btn label #right3 { display:block; }
#back5:checked ~ #b_btn label #left4,#back5:checked ~ #n_btn label #right4 { display:block; }
#back6:checked ~ #b_btn label #left5,#back6:checked ~ #n_btn label #right5 { display:block; }
#back7:checked ~ #b_btn label #left6,#back7:checked ~ #n_btn label #right6 { display:block; }
#back8:checked ~ #b_btn label #left7,#back8:checked ~ #n_btn label #right7 { display:block; }
#back9:checked ~ #b_btn label #left8,#back9:checked ~ #n_btn label #right8 { display:block; }
#back10:checked ~ #b_btn label #left9,#back10:checked ~ #n_btn label #right9 { display:block; }
#back11:checked ~ #b_btn label #left10,#back11:checked ~ #n_btn label #right10 { display:block; }
#back12:checked ~ #b_btn label #left11,#back12:checked ~ #n_btn label #right11 { display:block; }
#next1:checked ~ #b_btn label #left2,#next1:checked ~ #n_btn label #right2 { display:block; }
#next2:checked ~ #b_btn label #left3,#next2:checked ~ #n_btn label #right3 { display:block; }
#next3:checked ~ #b_btn label #left4,#next3:checked ~ #n_btn label #right4 { display:block; }
#next4:checked ~ #b_btn label #left5,#next4:checked ~ #n_btn label #right5 { display:block; }
#next5:checked ~ #b_btn label #left6,#next5:checked ~ #n_btn label #right6 { display:block; }
#next6:checked ~ #b_btn label #left7,#next6:checked ~ #n_btn label #right7 { display:block; }
#next7:checked ~ #b_btn label #left8,#next7:checked ~ #n_btn label #right8 { display:block; }
#next8:checked ~ #b_btn label #left9,#next8:checked ~ #n_btn label #right9 { display:block; }
#next9:checked ~ #b_btn label #left10,#next9:checked ~ #n_btn label #right10 { display:block; }
#next10:checked ~ #b_btn label #left11,#next10:checked ~ #n_btn label #right11 { display:block; }
#next11:checked ~ #b_btn label #left12 { display:block; }