/* body 要素全体に掛かる。
背景色 #fef4f4
背景は繰り返さない（1つだけ表示させる = no-repeat）
背景の表示位置は右下で、かつ固定（ = fixed ）
背景画像は back.png

色（何もない場合は既定色 = 黒）は、原色でない日本の黒色。
*/

body {
	background-color:#000000;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: right bottom;
	background-image : url(back.jpg);
	color : e0ffff;
}

/* ------------- HEADER ------------- */

/* <div id="title"> で括った場所に適用される。
   margin : 要素の周りをどれぐらい開けるか。 */
div#header {
	margin : 40px 40px 0px;
}

/* <div id="header"> で括られた場所の中の、<h1> 要素に対して適用される。
文字色 #ff69b4
あと、下線(border-bottom)を引く。 */

div#header h1 {	
	color :#e6e6fa ;
	border-bottom: 3px solid #0000ff ;
}

div#header p {
	color : #007b43;
	padding: 0px 40px;
	font-size : 80%;
	margin-top : -10px;
}

/* ------------- MENU ------------- */

/* z-index : 重なりの順序。
メニューとコンテンツのように、同じ行にコンテンツを並べる場合、
float と合わせて使う。 */

div#menu {
	z-index: 2;
	float: left;
	margin : 20px 40px;
	border-color: #00ff00;
	border-style: solid;
	border-width: 1px 2px;
	width: 160px;
}

/* list-style : リスト(ul,li or dd etc..) において、
どのようなスタイルを設定するか。
none に設定することで、箇条書きの先頭の黒丸を取り除く。 */

div#menu ul {
	list-style: none;
	margin : 0;
	padding:0;
}

/* padding : その要素の中に、どれぐらいの空きを作るか。 */
/*
margin : 外側にどれぐらい空きを作るか。
padding : 内側にどれぐらい空きを作るか。
*/

div#menu ul li {
	padding : 0px;
	border-top : 1px solid #add8e6;
	border-bottom : 1px solid #add8e6;
}

/* display で 要素をブロック要素にする。
それの説明は面倒くさいので、どこかのサンプルみてね！

text-decoration :none とすることにより、単なる普通の文字にする。
リンクの下線をとっぱらう。 */

div#menu ul li a {
	padding : 10px 10px;
	text-decoration: none;
	display:block;
	text-decoration: none;
	color :#b4866b ;
	font-weight:bold;
}

div#menu ul li a:hover {
	background-color :#eebbcb;
	color : #ED3B73;
}

/* ------------- CONTENT ------------- */

div#content {
	z-index: 1;
	margin : 00px 250px 0px 220px;
	padding : 20px;
	border : solid 2px #f6bfbc;
}

/* <div id="content"> 内の、<div class="section"> に対応。
一つしかないもの、代表的な物に id を使い、
汎用的な物に class を使う。 */

div#content div.section {
	margin: 4px;
	padding: 0 5px 5px 5px;
	border-left: 3px solid #eebbcb ;
	font-size : 14 px;
	line-height: 1.5em;
}
div#content div.section h2 {
	margin-left: -8px;
	padding: 0.5em 10px;
	background-color: #fef4f4;
	font-size:120%;
	color :#316745 ;
	list-style: none;
}
div#content div.section a {
	color : #19448e;
}

/* ------------- FOOTER ------------- */
div#footer {
	clear: left;
	margin-top: 20px;
	border-top: 2px solid #eebbcb;
	font-size : 14 px;
}
div#footer p {
	text-align: center;
}