@charset "utf-8";
/* CSS Document */

html,body,div,ul,ol,li,dl,dt,dd,form,fieldset,input,textarea,h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,th,td { margin:0; padding:0;}
img { border: 0; vertical-align: bottom; border-style: none;}
a img { border-style:none;}
a { outline: none; }
a:link,a:visited,a:active {outline: none;} 

@media screen and (min-width: 664px) {

#navi{ width:996px; height:64px; background-color:#581a11; position:relative;}
#navi ul{ list-style:none;}
#navi li{ float: left;	display: block;	width: 166px;	height: 64px;	background-image: url(../img/nav.png);	text-indent: -9999px;}
#navi li a{ float:left; display:block; width:172px; height:64px; background-image:url(../img/nav.png);}

#navi li.homepage a{background-position:0px -64px; }
#navi ul li.storypage a{background-position:-166px -64px; }
#navi ul li.charapage a{background-position:-332px -64px; }
#navi ul li.systempage a{ background-position:-498px -64px; }
#navi ul li.gallerypage a{ background-position:-664px -64px; }
#navi ul li.productionpage a{ background-position:-830px -64px; }

#navi ul li.homepage a:hover{background-position:0px top; }
#navi ul li.storypage a:hover{background-position:-166px top; }
#navi ul li.charapage a:hover{background-position:-332px top; }
#navi ul li.systempage a:hover{background-position:-498px top; }
#navi ul li.gallerypage a:hover{background-position:-664px top; }
#navi ul li.productionpage a:hover{background-position:-830px top; }

#navi ul li.homepage { background-position:0px bottom; }
#navi ul li.storypage { background-position:-166px bottom; }
#navi ul li.charapage { background-position:-332px bottom; }
#navi ul li.systempage { background-position:-498px bottom; }
#navi ul li.gallerypage { background-position:-664px bottom; }
#navi ul li.productionpage { background-position:-830px bottom; }

body.homepage #navi ul li.homepage>a { background-position:-0px top; }
body.storypage #navi ul li.storypage>a { background-position:-166px top; }
body.charapage #navi ul li.charapage>a { background-position:-332px top; }
body.systempage #navi ul li.systempage>a { background-position:-498px top; }
body.gallerypage #navi ul li.gallerypage>a { background-position:-664px top; }
body.productionpage #navi ul li.productionpage>a { background-position:-830px top; }

.c3{ position: absolute; left: 395px; top: 51px;}
.c4{ position: absolute; left: 563px; top: 51px;}
.c5{ position: absolute; left: 730px; top: 51px;}
.c6{ position: absolute; left: 900px; top: 51px;}
}


@media screen and (max-width: 639px) {
#navi{ display:none;}
}
