/* ここからmenu部分id取っているだけで直接レイアウトには関係なさそうです？あれ違うかな？
-------------------------------- */
# menu
{
margin-bottom: 1em;
}

/* 背景にmenu_bg.gifを横繰り返し、高さは画像と同じサイズ
-------------------------------- */
#menu ul 
{
background-repeat: repeat-x;
background-position: 0 0;
position:relative;
height:19px;
}

/* listタグをfloatで左に回り込ませていますサイズも指定
-------------------------------- */
#menu li 
{ width: 103px; height: 19px; list-style-type:none; }

/* aタグをblock要素にしてIE以外への対策、インデントで本来のテキストを左画面外の左999pxに飛ばしています
一桁すくなく間違えたので-9999emに変更すますた */
#menu li a 
{
display: block;
width: 103px;
height: 19px;
background-position: 0 0;
background-repeat: no-repeat;
text-decoration: none;
text-indent: -9999em;
}    
	
/* 各listタグにidをつけ個々に背景画像を指定、画像はマウスオフ、マウスオンを
上下につないだものを使いましたですから高さは38pxです
-------------------------------- */
#menu #top a 
{
background-image: url(img/b_top.gif);
}
#menu li#profile a 
{
background-image: url(img/b_pro.gif);
}
#menu #golf a 
{
background-image: url(img/b_golf.gif);
}

#menu #squash a 
{
background-image: url(img/b_sq.gif);
}

#menu #stretching a 
{
background-image: url(img/b_st.gif);
}
#menu #books a { background-image: url(img/b_book.gif); }
#menu #media a { background-image: url(img/b_media.gif); }
#menu #blog a { background-image: url(img/b_blog.gif); }
/* マウスオンすると重なった27px下の画像が出てきます
-------------------------------- */
#menu li a:hover 
{
background-position: 0 -19px;
}
/* ここまでmenu部分
-------------------------------- */
/* ここから下はmenu部分には無関係な部分です
-------------------------------- */
ul,li
{
margin: 0;
padding: 0;
}