@charset "utf-8";

/* --------------------------------

	グローバルナビゲーション

-----------------------------------

	1. 基本スタイル
	2. コンテンツ別スタイル

--------------------------------- */



/* ========================================================================



	1. 基本スタイル


 
======================================================================== */

dl#vol2navi {
	height: 30px;
	background-repeat: repeat-x;
}
dl#vol2navi dt#homeBtn,
dl#vol2navi dt#homeBtn a {
	height: 30px;
	width: 95px;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	text-decoration: none;
}
dl#vol2navi dt#homeBtn a {
	background-repeat: no-repeat;
	overflow: hidden;
	text-indent: -9999px;
}
dl#vol2navi dt#homeBtn a:hover {
	background-position: 0 -30px;
}


dl#vol2navi dd {
	height: 30px;
	width: 306px;
	position: absolute;
	left: 95px;
	top: 0px;
	background-repeat: no-repeat;
	background-position: -95px 0px;
}
dl#vol2navi dd ul {
	width: 306px;
	height: 30px;
	overflow: hidden;
}
dl#vol2navi dd li,
dl#vol2navi dd li a {
	height: 30px;
	display: block;
	float: left;
	text-indent: -9999px;
	text-decoration: none;
}
dl#vol2navi dd li#coverBtn,
dl#vol2navi dd li#coverBtn a {
	width: 60px;
}
dl#vol2navi dd li#coverBtn a:hover {
	background-position: -95px -30px;
}
dl#vol2navi dd li#blogBtn,
dl#vol2navi dd li#blogBtn a {
	width: 55px;
}
dl#vol2navi dd li#blogBtn a:hover {
	background-position: -155px -30px;
}
dl#vol2navi dd li#graphicBtn,
dl#vol2navi dd li#graphicBtn a {
	width: 70px;
}
dl#vol2navi dd li#graphicBtn a:hover {
	background-position: -210px -30px;
}
dl#vol2navi dd li#photoBtn,
dl#vol2navi dd li#photoBtn a {
	width: 60px;
}
dl#vol2navi dd li#photoBtn a:hover {
	background-position: -280px -30px;
}
dl#vol2navi dd li#aboutBtn,
dl#vol2navi dd li#aboutBtn a {
	width: 61px;
}
dl#vol2navi dd li#aboutBtn a:hover {
	background-position: -340px -30px;
}




/* ========================================================================



	2. コンテンツ別スタイル


 
======================================================================== */

/* ----------------------------------------------------
	■ホーム
---------------------------------------------------- */
body#home dl#vol2navi {
	background-color: #121212;
	background-image: url(../img/navi_blog_bg.gif);
}
body#home dl#vol2navi dt#homeBtn,
body#home dl#vol2navi dt#homeBtn a:hover,
body#home dl#vol2navi dd,
body#home dl#vol2navi dd li a:hover {
	background-image: url(../img/navi_cover.gif);
}


/* ----------------------------------------------------
	■ブログ
---------------------------------------------------- */
body#blog dl#vol2navi {
	background-color: #121212;
	background-image: url(../img/navi_blog_bg.gif);
}
body#blog dl#vol2navi dt#homeBtn,
body#blog dl#vol2navi dt#homeBtn a:hover,
body#blog dl#vol2navi dd,
body#blog dl#vol2navi dd li a:hover {
	background-image: url(../img/navi_blog.gif);
}


/* ----------------------------------------------------
	■グラフィック
---------------------------------------------------- */
body#graphic dl#vol2navi {
	background-color: #1b1b1b;
}
body#graphic dl#vol2navi dt#homeBtn,
body#graphic dl#vol2navi dt#homeBtn a:hover,
body#graphic dl#vol2navi dd,
body#graphic dl#vol2navi dd li a:hover {
	background-image: url(../img/navi_graphic.gif);
}


/* ----------------------------------------------------
	■フォト
---------------------------------------------------- */
body#photo dl#vol2navi {
	background-color: #121212;
	background-image: url(../img/navi_blog_bg.gif);
}
body#photo dl#vol2navi dt#homeBtn,
body#photo dl#vol2navi dt#homeBtn a:hover,
body#photo dl#vol2navi dd,
body#photo dl#vol2navi dd li a:hover {
	background-image: url(../img/navi_photo.gif);
}


/* ----------------------------------------------------
	■アバウト
---------------------------------------------------- */
body#about dl#vol2navi {
	background-color: #00cae2;
	background-image: url(../about/img/navi_bg.gif);
	background-repeat: no-repeat;
	background-position: 570px 0;
	height:30px;
}
body#about dl#vol2navi dt#homeBtn,
body#about dl#vol2navi dt#homeBtn a:hover,
body#about dl#vol2navi dd,
body#about dl#vol2navi dd li a:hover {
	background-image: url(../img/navi_about.gif);
}