@charset "utf-8";
/* CSS Document */

*{margin:0;
	padding:0;
}

body{background:url(img/bg01.gif);
}

#wrap{width:800px;
	height:558px;
	margin:0 auto;
}

.menu2{width:800px;
	height:39px;
	background:url(img/menu_2.jpg) no-repeat;
}

#menu{width: 800px;
    margin:0 auto;
	height: 39px;
}

li{width:160px;
	display:inline; 
	background: url(img/menu.jpg);
	list-style-type:none;
	float:left;
}

li a{display:block;  
	height: 39px;
	text-indent:-9999px;  
	list-style-type:none;
}
/*------off*/  

#menu li .top a{width:160px;
	background:url(img/menu.jpg) no-repeat;
	background-position: 0px 0px;
}

#menu li .story a{width:160px;
	background:url(img/menu.jpg) no-repeat;
	background-position: -160px 0px;
}
#menu li .chara a{width:160px;
	background:url(img/menu.jpg) no-repeat;
	background-position: -320px 0px;
}
#menu li .system a{ width:160px;
	background:url(img/menu.jpg) no-repeat;
	background-position:-480px 0px;
}

#menu li .song a{ width:160px;
	background:url(img/menu.jpg) no-repeat;
	background-position:-640px 0px;
}


#menu li .top a:hover{background:url(img/menu.jpg) no-repeat;
					background-position: 0px -39px;  
} 

#menu li .story a:hover{background:url(img/menu.jpg) no-repeat;
					background-position: -160px -39px;  
} 

#menu li .chara a:hover{background:url(img/menu.jpg) no-repeat;
					background-position: -320px -39px;  
}

#menu li .system a:hover{background:url(img/menu.jpg) no-repeat;
					background-position: -480px -39px;  
}

#menu li .song a:hover{background:url(img/menu.jpg) no-repeat;
					background-position: -640px -39px;  
}





.main{height:558px;
	background:url(img/top.jpg) no-repeat;
	display:block;
}

.box{width:140px;
	height:560px;
}

#left{
	width:140px;
	height:558px;
	background:url(img/charaback_left.jpg) no-repeat;
	float:left;
}


#left .li01 li{width:105px;
	margin:5px 8px;
	list-style-type:none;
	float:left;
	}

.li01 li a{background:url(img/chara_name01.jpg);
	display:block;  
	height: 23px;
	text-indent:-9999px;  
	list-style-type:none;
}
/*------off*/  

.li01 .menu01 a{background-position:0px 0px;}
.li01 .menu02 a{background-position:0px -46px;}
.li01 .menu03 a{background-position:0px -23px;}
.li01 .menu04 a{background-position:0px -69px;}
.li01 .menu05 a{background-position:0px -92px;}
.li01 .menu06 a{background-position:0px -115px;}
.li01 .menu07 a{background-position:0px -138px;}
.li01 .menu08 a{background-position:0px -160px;}

.li01 .menu01 a:hover{background-position:-105px 0px;} 
.li01 .menu02 a:hover{background-position:-105px -46px;} 
.li01 .menu03 a:hover{background-position:-105px -23px;}
.li01 .menu04 a:hover{background-position:-105px -69px;}
.li01 .menu05 a:hover{background-position:-105px -92px;}
.li01 .menu06 a:hover{background-position:-105px -115px;} 
.li01 .menu07 a:hover{background-position:-105px -138px;}
.li01 .menu08 a:hover{background-position:-105px -160px;}

#left .li02 {width:105px;
	margin:5px 8px;
	list-style-type:none;
	float:left;
}

.li02 a{background: url(img/chara_name02.jpg);
	display:block; 
	height: 23px;
	text-indent:-9999px;  
	list-style-type:none;
}
/*------off*/  

.li02 .menu10 a{background-position: 0px 0px;}
.li02 .menu11 a{background-position: 0px -23px;}
.li02 .menu12 a{background-position: 0px -46px;}

.li02 .menu10 a:hover{background-position:-105px 0px;} 
.li02 .menu11 a:hover{background-position:-105px -23px;} 
.li02 .menu12 a:hover{background-position:-105px -46px;}

#right{width:660px;
		height:558px;
		float:left;
}

.chara-box{
	margin:0;
	padding:300px 0 0 0;
	line-height:16px;
	font-size:small;
	color:#dcdcdc;
}

.img_01{background:url(img/chara_01.jpg) no-repeat;}
.img_02{background:url(img/chara_02.jpg) no-repeat;}
.img_03{background:url(img/chara_03.jpg) no-repeat;}
.img_04{background:url(img/chara_04.jpg) no-repeat;}
.img_07{background:url(img/chara_07.jpg) no-repeat;}
.img_08{background:url(img/chara_08.jpg) no-repeat;}
.img_09{background:url(img/chara_09.jpg) no-repeat;}
.img_10{background:url(img/chara_10.jpg) no-repeat;}
.img_11{background:url(img/chara_11.jpg) no-repeat;}
.img_12{background:url(img/chara_12.jpg) no-repeat;}
.img_13{background:url(img/chara_13.jpg) no-repeat;}


.foot{height:16px;
	background:url(img/foot.jpg) no-repeat;
	display:block;
	clear:both;
}

.copy{text-align:center;
	font-size:smaller;
	color:#dcdcdc;
	}
