@charset "shift_jis";

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

	Menu Wrap CSS

 -----------------------------------------
	INDEX
 -----------------------------------------
 	1.Category Menu
		1-1.Title
		1-2.ul
		1-3.Listup
	
	2.Recommend Menu
		2-1.Title
		2-2.ul
		2-1.ul

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

.menuWrap {

}

.menuWrap .section {
	margin: 0 auto;
	width: 1000px;
}


/* 1.Category Menu
========================================== */
#categoryMenu {
	height: auto; /* for Modern Browser */
	min-height: 58px; /* for Modern Browser */
	padding-top:15px;
}
/* IE6 Only */
* html #categoryMenu {height: 58px;}

#categoryMenu .section {
	position: relative;
}

	/* 1-1.Title
	---------------------------------------- */
	#categoryMenu .section h2 {
		position: absolute;
		top: 4px;
		left: 15px;
		width: 125px;
		height: 28px;
		background: url(../../i/base/catemenu_tit_blue.gif) no-repeat;
		text-indent: -9999px;
		overflow: hidden;
	}
	
	body.blue #categoryMenu .section h2 {background-image: url(../../i/base/catemenu_tit_blue.gif);}
	body.pink #categoryMenu .section h2 {background-image: url(../../i/base/catemenu_tit_pink.gif);}
	
	/* 1-2.ul
	---------------------------------------- */
	#categoryMenu .section ul {
		position: absolute;
		top: 8px;
		left: 247px;
		width: 621px;
	}
	
	#categoryMenu .section ul li {
		position: absolute;
		top: 0;
	}
	
	#categoryMenu .section ul li.dvd     {left:   0;  }
	#categoryMenu .section ul li.cd      {left:  75px;}
	#categoryMenu .section ul li.book    {left: 150px;}
	#categoryMenu .section ul li.game    {left: 225px;}
	#categoryMenu .section ul li.figure  {left: 300px;}
	#categoryMenu .section ul li.apparel {left: 375px;}
	#categoryMenu .section ul li.card    {left: 450px;}
	#categoryMenu .section ul li.goods   {left: 525px;}
	
	#categoryMenu .section ul li a {
		display: block;
		width: 58px;
		height: 58px;
		background: no-repeat;
		text-indent: -9999px;
		overflow: hidden;
	}
	
	/* Default */
	#categoryMenu .section ul li.dvd     a {background-image: url(../../i/base/dvd_btn_blue.gif);}
	#categoryMenu .section ul li.cd      a {background-image: url(../../i/base/cd_btn_blue.gif);}
	#categoryMenu .section ul li.book    a {background-image: url(../../i/base/book_btn_blue.gif);}
	#categoryMenu .section ul li.game    a {background-image: url(../../i/base/game_btn_blue.gif);}
	#categoryMenu .section ul li.figure  a {background-image: url(../../i/base/figure_btn_blue.gif);}
	#categoryMenu .section ul li.apparel a {background-image: url(../../i/base/apparel_btn_blue.gif);}
	#categoryMenu .section ul li.card    a {background-image: url(../../i/base/card_btn_blue.gif);}
	#categoryMenu .section ul li.goods   a {background-image: url(../../i/base/goods_btn_blue.gif);}
	
	/* Blue */
	body.blue #categoryMenu .section ul li.dvd     a {background-image: url(../../i/base/dvd_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.cd      a {background-image: url(../../i/base/cd_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.book    a {background-image: url(../../i/base/book_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.game    a {background-image: url(../../i/base/game_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.figure  a {background-image: url(../../i/base/figure_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.apparel a {background-image: url(../../i/base/apparel_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.card    a {background-image: url(../../i/base/card_btn_blue.gif);}
	body.blue #categoryMenu .section ul li.goods   a {background-image: url(../../i/base/goods_btn_blue.gif);}
	
	/* Pink */
	body.pink #categoryMenu .section ul li.dvd     a {background-image: url(../../i/base/dvd_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.cd      a {background-image: url(../../i/base/cd_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.book    a {background-image: url(../../i/base/book_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.game    a {background-image: url(../../i/base/game_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.figure  a {background-image: url(../../i/base/figure_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.apparel a {background-image: url(../../i/base/apparel_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.card    a {background-image: url(../../i/base/card_btn_pink.gif);}
	body.pink #categoryMenu .section ul li.goods   a {background-image: url(../../i/base/goods_btn_pink.gif);}
	
	#categoryMenu .section ul li        a:hover {background-position: 0 -58px;}
	
	/* 1-3.Listup
	---------------------------------------- */
	#categoryMenu .section p.listup {
		margin: 0 785px 0 15px;
		padding: 56px 0 0;
		font-size: 77%;
		line-height: 1.6;
		text-align: right;
	}
	
	#categoryMenu .section p.listup a {
		padding: 0 0 0 16px;
		background: url(../../i/common/ico_arrow01.gif) no-repeat 0 0.1em;
		color: #FFF;
		text-decoration: none;
	}
	
	#categoryMenu .section p.listup a:hover {
		color: #FFCC00;
	}


/* 2.Recommend Menu
========================================== */
#recommendMenu {
	height: auto; /* for Modern Browser */
	min-height: 42px; /* for Modern Browser */
	background: url(../../i/common/line_dotted01_orange.gif) no-repeat 0 -100px; /* preload */
}
/* IE6 Only */
* html #recommendMenu {height: 42px;}

#recommendMenu .section {
	position: relative;
}

	/* 2-1.Title
	---------------------------------------- */
	#recommendMenu .section h2 {
		position: absolute;
		top: 4px;
		left: 15px;
		width: 171px;
		height: 28px;
		background: url(../../i/base/recommenu_tit_blue.gif) no-repeat;
		text-indent: -9999px;
		overflow: hidden;
	}
	
	body.blue #recommendMenu .section h2 {background-image: url(../../i/base/recommenu_tit_blue.gif);}
	body.pink #recommendMenu .section h2 {background-image: url(../../i/base/recommenu_tit_pink.gif);}
	
	/* 2-2.ul
	---------------------------------------- */
	#recommendMenu .section ul {
		margin: 0 0 0 243px;
		padding: 3px 0 0;
		width: 600px;
		zoom: 1;
	}
	
	#recommendMenu .section ul:after { /* for Modern Browser */
		content: "."; display: block; clear: both; height: 0px; visibility: hidden;
	}
	
	#recommendMenu .section ul li {
		float: left;
		margin: 0 12px 1px 0;
		padding: 0 0 0 12px;
		width: 120px;
		background: url(../../i/common/ico_arrow02_blue.gif) no-repeat 0 0.273em;
		font-size: 84.7%;
		line-height: 1.637;
		position:relative;
	}
	
	body.blue #recommendMenu .section ul li {background-image: url(../../i/common/ico_arrow02_blue.gif);}
	body.pink #recommendMenu .section ul li {background-image: url(../../i/common/ico_arrow02_pink.gif);}
	
	body.blue #recommendMenu .section ul li.active {background-image: url(../../i/common/ico_arrow02_blue_active.gif);}
	body.pink #recommendMenu .section ul li.active {background-image: url(../../i/common/ico_arrow02_pink_active.gif);}
	
	body #recommendMenu .section ul li.active span.active-recomend {
		position:absolute;
		top:-6px;
		left:-12px;
		color:#FFF;
		display:block;
		background: url(../../i/common/ico-recommend.png);
		width:30px;
		height:9px;
		overflow:hidden;
		text-indent:-9999px;
	}
	
	#recommendMenu .section ul li a {
		padding-bottom: 1px; /* for Underline */
		background: url(../../i/common/line_dotted01_blue.gif) repeat-x 0 100%;
		color: #fff;
		text-decoration: none;
		font-weight:bold;
	}
	/* Safari2 Only \*/
	html:\66irst-child #recommendMenu .section ul li a {padding-bottom: 2px;}/**/
	
	body.blue #recommendMenu .section ul li a {color: #fff;}
	body.pink #recommendMenu .section ul li a {color: #fff;}
	
	#recommendMenu .section ul li a:hover {
		background-image: url(../../i/common/line_dotted01_orange.gif);
		color: #FFCC00 !important;
	}

/* 3.headerFreeLink Menu
========================================== */
#headerFreeLink {
	height: auto; /* for Modern Browser */
	background: #A3BCDB url(../../i/base/headerfreemenu_bg_blue.gif) repeat-x;
}
	body.pink #headerFreeLink {
	height: auto; /* for Modern Browser */
	background: #A3BCDB url(../../i/base/headerfreemenu_bg_pink.gif) repeat-x;
}
	
/* IE6 Only */
* html #headerFreeLink {height: 42px;}

#headerFreeLink .section {
	position: relative;
}

	/* 2-1.Title
	---------------------------------------- */
	#headerFreeLink .section h2 {
		position: absolute;
		top: 4px;
		left: 15px;
		width: 171px;
		height: 28px;
		background: url(../../i/base/recommenu_tit_blue.gif) no-repeat;
		text-indent: -9999px;
		overflow: hidden;
	}

	body.blue #headerFreeLink .section h2 {background-image: url(../../i/base/recommenu_tit_blue.gif);}
	body.pink #headerFreeLink .section h2 {background-image: url(../../i/base/recommenu_tit_pink.gif);}

	/* 3-1.ul
	---------------------------------------- */
	#headerFreeLink .section ul {
		margin: 0 0 0 243px;
		padding: 3px 0 0;
		width: 600px;
		zoom: 1;
	}
	
	#headerFreeLink .section ul:after { /* for Modern Browser */
		content: "."; display: block; clear: both; height: 0px; visibility: hidden;
	}
	
	#headerFreeLink .section ul li {
		float: left;
		margin: 0 12px 1px 0;
		padding: 0 0 0 12px;
		width: 120px;
		background: url(../../i/common/ico_arrow02_blue.gif) no-repeat 0 0.273em;
		font-size: 84.7%;
		line-height: 1.637;
		position:relative;
	}
	
	body.blue #headerFreeLink .section ul li {background-image: url(../../i/common/ico_arrow02_blue.gif);}
	body.pink #headerFreeLink .section ul li {background-image: url(../../i/common/ico_arrow02_pink.gif);}
	
	body.blue #headerFreeLink .section ul li.active {background-image: url(../../i/common/ico_arrow02_blue_active.gif);}
	body.pink #headerFreeLink .section ul li.active {background-image: url(../../i/common/ico_arrow02_pink_active.gif);}
	
	body #headerFreeLink .section ul li.active span.active-recomend {
		position:absolute;
		top:-6px;
		left:-12px;
		color:#FFF;
		display:block;
		background: url(../../i/common/ico-recommend.png);
		width:30px;
		height:9px;
		overflow:hidden;
		text-indent:-9999px;
	}
	
	#headerFreeLink .section ul li a {
		padding-bottom: 1px; /* for Underline */
		background: url(../../i/common/line_dotted01_blue.gif) repeat-x 0 100%;
		color: #fff;
		text-decoration: none;
		font-weight:bold;
	}
	/* Safari2 Only \*/
	html:\66irst-child #headerFreeLink .section ul li a {padding-bottom: 2px;}/**/
	
	body.blue #headerFreeLink .section ul li a {color: #fff;}
	body.pink #headerFreeLink .section ul li a {color: #fff;}
	
	#headerFreeLink .section ul li a:hover {
		background-image: url(../../i/common/line_dotted01_orange.gif);
		color: #FFCC00 !important;
	}