@charset "utf-8";
/*62.5%=10px=1.0remを基準として
  (1.0rem=7.5pt)
  (1/4pxはlineheight(chrome default))
  rem    本体px(余白px)     pt換算
  0.4rem    4px(1.00px)       3.0pt
  0.6rem    6px(1.50px)       4.5pt
  0.8rem    8px(2.00px)       6.0pt
  1.0rem  10px(2.50px)       7.5pt  100%
  1.2rem  12px(3.00px)       9.0pt
  1.4rem  14px(3.50px)      10.5pt
  1.6rem  16px(4.00px)      12.0pt
  1.8rem  18px(4.25px)      13.5pt
  1.9rem  19px(4.75px)      14.25pt
  2.0rem  20px(5.00px)      15.0pt  200%
  2.2rem  22px(5.50px)      16.5pt
  2.4rem  24px(6.00px)      18.0pt
  2.6rem  26px(6.50px)      19.5pt
  2.8rem  28px(7.00px)      21.0pt
  3.0rem  30px(7.50px)      22.5pt
  3.2rem  32px(8.00px)      24.0pt
  3.4rem  34px(8.50px)      25.5pt
  3.6rem  36px(9.00px)      27.0pt
  3.8rem  38px(9.50px)      28.5pt
  4.0rem  40px(10.00px)    30.0pt
  4.2rem  42px(10.50px)    31.5pt
  4.4rem  44px(11.00px)    33.0pt
  4.6rem  46px(11.50px)    34.5pt
  4.8rem  48px(12.00px)    36.0pt
  5.0rem  50px(12.50px)    37.5pt
  5.2rem  52px(13.00px)    39.0pt
  5.4rem  54px(13.50px)    40.5pt
  5.6rem  56px(14.00px)    42.0pt
  5.8rem  58px(14.50px)    43.5pt
  6.0rem  60px(15.00px)    45.0pt
  6.2rem  62px(15.50px)    46.5pt
  6.4rem  64px(16.00px)    48.0pt*/

/*--アニメーションに関する記述--*/
@keyframes photo-anime{
from{
	filter:alpha(opacity=0);
	-moz-opacity:0.0; /*Firefox*/
	opacity:0.0;
}
to{
	filter:alpha(opacity=3);
	-moz-opacity:0.3; /*Firefox*/
	opacity:0.3;
}
}


/*html属性に関する記述 60+(0.625×2[左右])=60+1.25=61.25×16pt[基準]=980px*/
html{
font-size:10px;
width:60.0rem; /*60.0rem×16pt=960px*/
height:96.0rem; /*88.0rem×16pt=1408px*/
padding:0.0rem 0.625rem 0.0rem 0.625rem; /*上右下左 ここまで0.625rem=10px*/
border:0.0rem;
outline:0.0rem;
}

/*html>body属性に関する記述 以降1.0rem=10px*/
body{
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "メイリオ","Meiryo","Osaka","ＭＳ Ｐゴシック","MS PGothic","sans-serif";
color:#626262;
width:94.0rem;
margin:0.0rem 0.0rem 0.0rem 1.0rem; /*上右下左*/
padding:0.0rem 2.0rem 0.0rem 2.0rem; /*上右下左*/
background-color:#000;
}

/*ページヘッダー用の枠＠固定*/
.page-head{
width:92.0rem;
height:7.8rem;
margin:0.0rem 1.0rem 0.0rem 0.0rem;
background-color:#000;
position:fixed;
z-index:2;
filter:alpha(opacity=70); /*IE*/
-moz-opacity:0.7; /*Firefox*/
opacity:0.7;
float:left;
transition:all 2.0s ease-in 1.0s;
}

	/*ページタイトル用のボックス(左)*/
	.page-head-title{
	width:36.0rem;
	height:6.0rem;
	padding:1.8rem 1.0rem 0.0rem 1.0rem; /*上右下左*/
	float:left;
	}

		/*ページタイトル文字列1*/
		.page-head-title h1 a{
		font-size:3.2rem;
		line-height:2.2rem;
		color:#36f;
		text-decoration:none;
		transition: all 2.0s ease-out 0.0s;
		}

		.page-head-title h1 a:hover{
		color:#f99;
		transition: all 1.0s ease-in-out 0.0s;
		}

		/*ページタイトル文字列2*/
		.page-head-title h1 a span{
		font-size:2.4rem;
		color:#ccc;
		}

	/*ページタイトル用のボックス(右)*/
	.page-head-navi{
	width:48.0rem;
	height:6.0rem;
	padding:1.8rem 0.0rem 0.0rem 6.0rem;
	float:left;
	}

		/*ページタイトル用ボックス内のボタン*/
		.page-head-navi-col1{
		width:11.8rem;
		height:3.5rem;
		font-size:1.6rem;
		color:#ee0;
		text-align:center;
		text-decoration:none;
		padding:1.4rem 0.0rem 0.0rem 0.0rem;
		float:left;
		transition: all 2.0s ease-out 0.0s;
		}

		/*ページタイトル用ボックス内のボタン*/
		.page-head-navi-col2{
		width:11.8rem;
		height:4.5rem;
		font-size:1.4rem;
		color:#ee0;
		text-align:center;
		text-decoration:none;
		padding:0.4rem 0.0rem 0.0rem 0.0rem;
		float:left;
		transition: all 2.0s ease-out 0.0s;
		}

		/*ボタンマウスオーバー時*/
		.page-head-navi-col1:hover,.page-head-navi-col2:hover{
		color:#fff;
		background-color:#37f;
		transition:all 0.3s ease;
		}

/*--------------------------------------------------------------------------------------------*/

	/*上中段画像用のボックス(左)*/
	.page-mid{
	width:62.0rem;
	height:28.0rem;
	background-attachment:scroll;
	margin:7.8rem 0.0rem 2.0rem 0.0rem;
	float:left;
	}

		/*ボックス内上部のボックス*/
		.page-mid-top{
		width:60.0rem;
		height:16.0rem;
		padding:1.0rem 1.0rem 1.0rem 1.0rem;
		}

			.page-mid-top span{
			font-size:1.6rem;
			color:#96f;
			}

			/*ボックス内の文字列1*/
			.page-mid-top p{
			font-size:1.2rem;
			color:#96f;
			}

			/*ボックス内の文字列1*/
			.page-mid-top rt{
			font-size:0.6rem;
			color:#66f;
			}
		
		/*ボックス内下部のボックス*/
		.page-mid-bottom{
		width:60.0rem;
		height:6.0rem; 
		padding:1.0rem 1.0rem 1.0rem 1.0rem;
		}

			/*ボックス内の文字列*/
			.page-mid-bottom p{
			font-size:1.2rem;
			color:#f0c;
			}

			/*ボックス内の文字列1*/
			.page-mid-bottom rt{
			font-size:0.6rem;
			color:#f0c;
			}

	/*上中段画像用のボックス(右)*/
	.add-01-box{
	width:30.0rem;
	height:27.0rem;
	padding:1.0rem 0.0rem 0.0rem 0.0rem;
	margin:7.8rem 1.0rem 2.0rem 0.0rem; /*上右下左*/
	float:left;
	}

/*---------------------------------------------------------------------*/

	/*本体レフトナビ*/
	.left-navi{
	width:30.0rem;
	height:150.0rem;
	margin:0.0rem 1.0rem 2.0rem 0.0rem;
	background-color:#000;
	float:left;
	}

		.left-navi-top{
		width:30.0rem;
		height:90.0rem;
		background-color:#000;
		float:left;
		}


			.left-navi-top p{
			font-size:1.4rem;
			color:#0ff;
			margin-left:2.0rem;
			margin-right:0.0rem;
			margin-bottom:0.0rem;
			}

			.left-navi-top ul{
			font-size:1.2rem;
			color:#96f;
			list-style-type:none;
			margin-left:2.0rem;
			margin-right:0.0rem;
			margin-bottom:1.0rem;
			}

			.left-navi-top ul li a{
			font-size:1.4rem;
			color:#66f;
			text-decoration:none;
			}

			.left-navi-top a:visited{
			color:#0ff;
			}

			.left-navi-top a:hover{
			color:#f66;
			}

		.left-navi-bottom{
		width:30.0rem;
		height:60.0rem;
		background-color:#000;
		float:left;
		}





/*----------photo領域----------*/

	/*ページ本体*/
	/*html>body>div*/
	.photo{
	width:30.0rem;
	height:28.0rem;
	margin-right:1.0rem;
	margin-bottom:2.0rem;
	background-color:#000;
	filter:alpha(opacity=30);
	-moz-opacity:0.3; /*Firefox*/
	opacity:0.3;
	z-index:1;
	float:left;
	transition: all  5.0s ease-in-out 2.0s;
	animation:photo-anime 0.5s ease-in 0.0s 1 alternate backwards; /*test*/
	}

	.photo-title{
	font-size:1.4rem;
	color:#fff;
	}

	/*html>body>div[マウスオーバー時]*/
	.photo:hover{
	filter:alpha(opacity=100);
	-moz-opacity:1.0; /*Firefox*/
	opacity:1.0;
	transform:rotateZ(1060deg );
	-webkit-transform:rotateZ(1060deg ); /*Chrome,Safari*/
	transition: all  1.0s ease-in-out 0.0s;
	}


/*----------footer領域----------*/

	/*html>body>div*/
	.foot-navi{
	width:94.0rem;
	height:12.0rem;
	border:#000 solid 0.0rem;
	background-color:#000;
	float:left;
	}

	/*html>body>div*/
	.add-03{
	width:46.8rem;
	height:6.0rem;
	float:left;
	margin:0.0rem 0.2rem 0.2rem 0.0rem;
	background-color:#000;

	}

	.clear{
	width:94.0rem;
	height:12.0rem;
	clear:both;
	}


