@charset "utf-8";

/* 基本スタイル
---------------------------------------------*/

body {
	font-size: 75%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
	line-height: 1.6;
	color: #333333;
	background-image: url("../images/background.gif");
	background-repeat: repeat-y;
	background-position: center; 
	background-color: #FFFFFF;
	margin: 0px 0 30px 0;
}

small {
	font-size: 90%;
	line-height: 1;
	color: #909090;
}




#wrapper {
	width: 800px;
	margin: 0 auto;
	text-align: left;
	background-color: #FFFFFF;
}
/*（↑）上２つの text-align については『上級レイアウト』p.36参照 */



#header {
	background-color: #FFFFFF;
	height: 145px;
	margin: 0;
}
/*（↑）通常、widthプロパティを指定しなければ、ボックスは幅いっぱいに広がろうとする */


#header img{
	vertical-align: bottom;
}
/*（↑）これがないとMac/Safari表示のとき画像の下に隙間が空いてしまう */




#sub_menu {
	position: relative;
	top: 0px;
	left: 0px;
	width: 766px;
	background-color: #e4e18d;
	padding: 1px 20px 0px 14px;
	border-bottom: 1px solid #D3D3D3;
}
#sub_menu a{
	text-decoration: none;
	color: #5E68BF;
}





#main {
	width: 800px;
	margin: 2px auto;
	background-color: #FFFFFF;
}
#main img{
	vertical-align: top;
}
/*（↑）これがないとMac/Safari表示のとき画像の上に隙間が空いてしまう */









.colmn {
	clear: both; /* 寄せを解除 */
	width: 750px;
	margin: 0;
	padding: 0px 25px 0px 25px;
	background-image: url("../images/clm_back.gif");
	background-repeat: repeat-y;
	background-color: #FFFFFF;
}

.colmn_top {
	clear: both; /* 寄せを解除 */
	text-align: right;
	width: 750px;
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
}

.colmn_bottom {
	clear: both; /* 寄せを解除 */
	text-align: right;
	width: 750px;
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
}


hr {
	clear: both; /* 寄せを解除 */
	height: 1px;
	border: none;
	border-top: 1px #AAAAAA dotted;
}






table, td, th {
	border-collapse: collapse; /* ← TABLEの境界線を重ねて表示。離す場合は separate（これが初期値） */
	border: 0px #BBBBBB solid;
}

/*（↑）HTMLのTABLEタグ内に CELLPADDING=0 の指示も入れておくこと。
　　　　じゃないとテーブルが数ピクセル広がってしまう。 */






#footer {
	clear: both; /* 寄せを解除 */
	background-color: #6597b8;
	padding: 4px 15px 4px 0px;
	text-align: right;
	color: #FFFFFF;
}






/* ヘッダー・ナビゲーション
---------------------------------------------*/


#navigation {
	width: 800px;
	margin: 0;
}
#navigation ul {
	list-style: none; /* ← リストのマーカー（黒丸）を表示させないように指定 */
	margin: 0;
	padding: 0px;
	height: 33px;
	overflow: hidden; /* ← はみ出した内容を隠すように指定 */
	border-top: 1px solid #FFFFFF;
	border-bottom: 0px solid #2E3662;
}
#navigation li {
	float: left;
	width: 159px;
	margin: 0;
	padding: 0;
	border-right: 1px solid #384190;
}
#navigation a {
	display: block; /* ← 本来インライン要素であるa要素には、ボックス幅を指定することはできませんが、こうしてブロックレベル要素として表示させることで……『上級レイアウト』p.85参照。*/
	width: 100%; /* ← Windows Internet Explorer対策のため、ボックスの幅を指定。*/
	padding: 8px 0 7px 0;
	color: #FFFFFF;
	background-color: #6597b8;
	text-decoration: none; /* ← リンクの下線を表示させないように指定。*/
	text-align: center;
}
#navigation a:hover {
	background-color: #FF7DBD; /* オンマウス時の背景色を指定 */
}