@charset "UTF-8";


/*---------------------------------
メインビジュアル
----------------------------------*/
#main-visual{
	background-image:url(../images/chiryu/mvisual.png);
}


/*----------------------------
マイナーブレイクポイント
----------------------------*/
@media only screen and (min-width: 35em){	/* 560px */



}/* マイナーブレイクポイント end */

/*----------------------------
ミディアムサイズ
----------------------------*/
@media only screen and (min-width: 40em){	/* 640px */

/*---------------------------------
メインビジュアル
----------------------------------*/
#main-visual{
	background-image:url(../images/chiryu/mvisual_tb.png);
}


}/* ミディアムサイズ end */

/*----------------------------
マイナーブレイクポイント
----------------------------*/

 @media only screen and (min-width: 50em) {	/*800px*/


}/* マイナーブレイクポイント end */

/*----------------------------
ラージサイズ
----------------------------*/

 @media only screen and (min-width: 60em) {	/*960px*/

#main-visual{
	background-image:url(../images/chiryu/mvisual.png);
}
	 
}/* ラージサイズ end */

/*ギャラリー全体のコンテナー*/
#stage {
	position: relative;
	max-width: 600px;
	margin: 0 auto;
}
/*全サムネイルのコンテナー*/
#thumbs {
	margin-left:2%;
}
/*サムネイルの幅、ポインターを手のひら*/
#thumbs label img {
	width:18.5%;
	cursor: pointer;
}
/*ラジオボタンを非表示に*/
#r1, #r2, #r3, #r4, #r5, #r6, #r7, #r8, #r9, #r10 {
	display: none;
}
/*表示写真の初期配置（全部透明に）とtransition設定*/
.photo {
	position: absolute;
	left: 0;
	top: 0;

}
.photo img {
	width: 100%;
	opacity: 0;
	-webkit-transition: opacity 1s ease;
	transition: opacity 1s ease;
	margin-bottom: 2px;
}
/*チェックされたサムネイルに相当する写真だけを表示*/
#r1:checked ~ #photo1 img, #r2:checked ~ #photo2 img, #r3:checked ~ #photo3 img, #r4:checked ~ #photo4 img, #r5:checked ~ #photo5 img, #r6:checked ~ #photo6 img, #r7:checked ~ #photo7 img, #r8:checked ~ #photo8 img, #r9:checked ~ #photo9 img, #r10:checked ~ #photo10 img {
	opacity: 1;
}