html {
	background-color:#cccccc;
}
body {
	position:relative;
	width:920px;
	margin:auto;
	padding-top:160px;
	text-align: center;
	border:double 6px #aaaaaa;
	background-color:#ffffff;
}
/*
body>div:not(#*){
	margin:auto;
	width:480px;
	text-align:left;
	border:2px inset #ddddff;
	background-color:#ddddff;
}
*/

#recent{
	width: 320px;
	height: 160px;
	margin: auto;
	padding: 0 10px;
	border: solid 3px #aaaaaa;
	text-align:left;
}

ul{
	width: 320px;
	margin:  20px auto;
	padding: auto;
	border: solid 3px #aaaaaa;
	text-align:left;
}
li{
	margin:5px 0;
}
.text{
	line-height: 25px;
	text-align: left;
	width:680px;
	margin:auto;
}

ruby {
    display: inline-table;
    margin: 0;
    padding: 0;
    border: none;
    white-space: nowrap;
    text-indent: 0;
    vertical-align: text-bottom;
}

rb {
    display: table-row;
    margin: 0;
    padding: 0;
    border: none;
    line-height: 100%;
    text-align: center;
}

rt {
    display: table-header-group;
    margin: 0;
    padding: 0;
    border: none;
    font: inherit;
    font-size: 50%;
    line-height: 100%;
    text-decoration: none;
    text-align: center;
}
/***********************************************

	メニュー基礎部 

***********************************************/
#menu{
	position:absolute;
	top:-6px;
	left: -20px;
	margin:auto;
	width:960px;
	height:159px;
	text-align:left;
	border:none;
	background:url("img/_menu.png") no-repeat transparent;
}
#menu img{
	position:absolute;
	top:0;
	left:0;
	border:none;
	z-index:2;
}

#menu h1{
	position:absolute;
	top:0;
	left:0;
	margin:0;
	height:128px;
	width:479px;
	display:block;
	text-indent:-9999px;
	background:url("img/logo.png") no-repeat;
	z-index:3;
}



/***********************************************

	メニューマウスオーバー関連
	IE(～8)だとareaのhover判定がひどいので諦める。なくても見れるし。
	故にCSS3のセレクタ使用も辞さない。

***********************************************/
area{
	display:block;
}
#menu area+p{
	display:none;
	position:absolute;
	top:0;
	left:450px;
	margin:0;
	padding:128px 92px;
	width:302px;
	z-index:1;
}
#menu area:hover+p{
	display:block;

}
#menu area:nth-of-type(1):hover+p{
	background:url("img/square1.png") no-repeat 9px 9px;
}
#menu area:nth-of-type(2):hover+p{
	background:url("img/square2.png") no-repeat 72px 9px;
}
/*
#menu area:nth-of-type(3):hover+p{
	background:url("img/square3.png") no-repeat 136px 9px;
}
#menu area:nth-of-type(4):hover+p{
	background:url("img/square3.png") no-repeat 200px 9px;
}
#menu area:nth-of-type(5):hover+p{
	background:url("img/square3.png") no-repeat 263px 9px;
}
#menu area:nth-of-type(6):hover+p{
	background:url("img/square3.png") no-repeat 326px 9px;
}
*/
#menu area:nth-of-type(7):hover+p{
	background:url("img/square7.png") no-repeat 406px 9px;
}

/***********************************************

	フッタ

***********************************************/

#footer ul{
	width:800px;
	margin:auto;
	list-style-type:none;
}
#footer li{
	float:left;
}
#footer ul+*{
	clear:both;
}