@charset "UTF-8";

/*故郷紹介ページの背景画像-----------------------------------------------*/
.bgimg {	
	position: fixed;	/*背景画像の位置を固定*/	
	bottom: -10px;		/*背景画像を下から-10pxの位置へ*/
	right: 0;			/*背景画像を右端へ*/
	z-index: -1;		/*背景画像の重ね順*/
	opacity: 0.7;		/*背景画像を半透明に*/		
}

/*故郷の風景------------------------------------------------------------*/
/*ラジオボタンを非表示に*/
#r11,#r12,#r13,#r14,#r15,#r16,#r17,#r18,#r19 {
	display: none;
}
/*全サムネイルのコンテナー*/
#thumbs1 {
	position: relative;
	width: 900px;
	left: 20px;
	margin:0 auto;
}
/*サムネイルのマウスオーバーでポインターを手のひら*/
#thumbs1 label img {
	cursor: pointer;
	border-radius: 5px;
}
/*表示写真の初期配置（全部透明に）とtransition設定*/
#photo11, #photo12, #photo13, #photo14, #photo15, #photo16, #photo17 {
	position: absolute;
	top:0;
	margin:5px 5px 0 5px;
	opacity: 0;
	-webkit-transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	transition: opacity 1s ease;
}
/* サムネイルがクリックされたら#frame を表示 */
#r11:checked ~ #frame1,#r12:checked ~ #frame1,#r13:checked ~ #frame1,#r14:checked ~ #frame1,#r15:checked ~ #frame1 {
	opacity:1;
	z-index:95;
}
#r16:checked ~ #frame1,#r17:checked ~ #frame1 {
	opacity:1;
	z-index:95;
}
/*チェックされたサムネイルに相当する写真だけを表示*/
#r11:checked ~ #frame1 #photo11, #r12:checked ~ #frame1 #photo12, #r13:checked ~ #frame1 #photo13, #r14:checked ~ #frame1 #photo14 {
	opacity: 1;
	z-index:100;
}
#r15:checked ~ #frame1 #photo15, #r16:checked ~ #frame1 #photo16, #r17:checked ~ #frame1 #photo17 {
	opacity: 1;
	z-index:100;
}
/* サムネイルがクリックされたら#darkscreen を表示 */
#r11:checked ~ label #darkscreen1,#r12:checked ~ label #darkscreen1,#r13:checked ~ label #darkscreen1,#r14:checked ~ label #darkscreen1 {
	opacity:0.8;
	z-index:90;
}
#r15:checked ~ label #darkscreen1,#r16:checked ~ label #darkscreen1,#r17:checked ~ label #darkscreen1 {
	opacity:0.8;
	z-index:90;
}
/* #frameの設定 */
#frame1 {
	position:fixed !important;
	position:absolute;
	background:#fff;
	width:810px;
	height:500px;
	left:50%;
	top:50%;
	margin-left:-405px;
	margin-top:-220px;
	opacity:0;
	z-index:-11;
}
/* 写真の下に表示するタイトル */
.title1 {
	position:absolute;
	left:10px;
	top:460px;
	font-size:16px;
}
/* 右下に表示する閉じるボタン */
#close_btn label {
	position:absolute;
	left:740px;
	top:465px;
	font-size:16px;
	font-weight:bold;
	cursor:pointer;
}
/*写真表示時の画面遮蔽スクリーン*/
#darkscreen1 {
	position:fixed !important;
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:#000;
	opacity:0;
	z-index:-5;
}
#about1 p {
	margin-left: 30px;
}
#about1 td {
	width: 120px;
	text-align: center;
}
#about1 .mouseHvr:hover {
    opacity: 0.5;
}

/*潮吹き岩の風景------------------------------------------------------------*/
/*ラジオボタンを非表示に*/
#r11a,#r12a,#r13a,#r14a,#r15a,#r16a,#r17a,#r18a,#r19a {
	display: none;
}
/*全サムネイルのコンテナー*/
#thumbs1a {
	position: relative;
	width: 900px;
	left: 20px;
	margin:0 auto;
}
/*サムネイルのマウスオーバーでポインターを手のひら*/
#thumbs1a label img {
	cursor: pointer;
	border-radius: 5px;
}
/*表示写真の初期配置（全部透明に）とtransition設定*/
#photo11a, #photo12a, #photo13a, #photo14a, #photo15a, #photo16a, #photo17a {
	position: absolute;
	top:0;
	margin:5px 5px 0 5px;
	opacity: 0;
	-webkit-transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	transition: opacity 1s ease;
}
/* サムネイルがクリックされたら#frame を表示 */
#r11a:checked ~ #frame1a,#r12a:checked ~ #frame1a,#r13a:checked ~ #frame1a,#r14a:checked ~ #frame1a,#r15a:checked ~ #frame1a {
	opacity:1;
	z-index:95;
}
#r16a:checked ~ #frame1a,#r17a:checked ~ #frame1a {
	opacity:1;
	z-index:95;
}
/*チェックされたサムネイルに相当する写真だけを表示*/
#r11a:checked ~ #frame1a #photo11a, #r12a:checked ~ #frame1a #photo12a, #r13a:checked ~ #frame1a #photo13a, #r14a:checked ~ #frame1a #photo14a {
	opacity: 1;
	z-index:100;
}
#r15a:checked ~ #frame1a #photo15a, #r16a:checked ~ #frame1a #photo16a, #r17a:checked ~ #frame1a #photo17a {
	opacity: 1;
	z-index:100;
}
/* サムネイルがクリックされたら#darkscreen を表示 */
#r11a:checked ~ label #darkscreen1a,#r12a:checked ~ label #darkscreen1a,#r13a:checked ~ label #darkscreen1a,#r14a:checked ~ label #darkscreen1a {
	opacity:0.8;
	z-index:90;
}
#r15a:checked ~ label #darkscreen1a,#r16a:checked ~ label #darkscreen1a,#r17a:checked ~ label #darkscreen1a {
	opacity:0.8;
	z-index:90;
}
/* #frameの設定 */
#frame1a {
	position:fixed !important;
	position:absolute;
	background:#fff;
	width:810px;
	height:500px;
	left:50%;
	top:50%;
	margin-left:-405px;
	margin-top:-220px;
	opacity:0;
	z-index:-11;
}
/* 写真の下に表示するタイトル */
.title1a {
	position:absolute;
	left:10px;
	top:460px;
	font-size:16px;
}
/* 右下に表示する閉じるボタン */
#close_btna label {
	position:absolute;
	left:740px;
	top:465px;
	font-size:16px;
	font-weight:bold;
	cursor:pointer;
}
/*写真表示時の画面遮蔽スクリーン*/
#darkscreen1a {
	position:fixed !important;
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:#000;
	opacity:0;
	z-index:-5;
}


/*故郷の見所案内------------------------------------------------------------*/
/*全体のコンテナー*/
#about2 {
	position: relative;
	height: 380px;
}
#about2 p {
	margin-left: 30px;
}
/*全サムネイルのコンテナー*/
#thumbs2 {
	position: absolute;	
	top: 140px;
	left: 420px;
}
#thumbs2 img {
	margin-top: 10px;
	border-radius: 5px;
	border: 1px solid #ccc;
	padding: 2px;
}
#about2 td {
	text-align: center;
	vertical-align: top;
	width: 120px;
}
#about2 .mouseHvr:hover {
    opacity: 0.5;
}
/*サムネイルのマウスオーバーでポインターを手のひらに*/
#thumbs2 label img {
	cursor: pointer;
}
/*初期画面*/
#frame2 {
	position: absolute;
	left: 30px;
	top: 150px;
	width: 360px;
	height: 270px;
	background-color: #CCC;
	background: url(../images/img_back2.png);
	opacity: 0.7;
}
/*ラジオボタンを非表示に*/
#r21, #r22, #r23, #r24, #r25, #r26, #r27, #r28, #r29 {
	display: none;
}
/*表示写真の初期配置（全部透明に）とtransition設定*/
#photo21, #photo22, #photo23, #photo24, #photo25, #photo26, #photo27, #photo28 {
	position: absolute;
	left: 30px;
	top: 140px;
	opacity: 0;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
}
/*チェックされたサムネイルに相当する写真だけを表示*/
#r21:checked ~ #photo21, #r22:checked ~ #photo22, #r23:checked ~ #photo23, #r24:checked ~ #photo24 {
	opacity: 1;
}
#r25:checked ~ #photo25, #r26:checked ~ #photo26, #r27:checked ~ #photo27, #r28:checked ~ #photo28 {
	opacity: 1;
}
/*どれかがチェックされたらスクリーン上の文字を非表示に*/
#r21:checked ~ #frame2, #r22:checked ~ #frame2, #r23:checked ~ #frame2, #r24:checked ~ #frame2 {
	opacity: 0;
}
#r25:checked ~ #frame2, #r26:checked ~ #frame2, #r27:checked ~ #frame2, #r28:checked ~ #frame2 {
	opacity: 0;
}

/*故郷の見所------------------------------------------------------------*/
#about3 table {
	padding: 10px;
	margin: 0 auto;
}
#about3 td {
	padding-left: 8px;
	padding-right: 8px;
	text-align: center;
	vertical-align: top;
}
#about3 img {
	border-radius: 5px;
	border: 1px solid #ccc;
	padding: 3px;
}
#about3 .end {
	border-right: none;
}
#about3 p {
	margin-left: 30px;
}
#about3 {
	margin-top: 50px;
}
.shiwagi {
	width: 120px;
	text-align: center;
}

.newicon {
	background-color: #f00;
	color: #fff;
	font-size: フォントサイズ：70％;
	padding: 0px 5px;
	border-radius: 2px;
	margin: 0px 15px;
}