@charset "shift_jis";
/* **************************************

	MARUI WEB SITE
	index.css
	2009/12/4
	
	** base
	** ID top-left
		* caption
		* list
	** ID top-main
		* caption
		* news topics
		* online ranking
		* ID webch-search
		* webch-park
	** ID top-right
		* caption
		* shop-list
		* ID ban-area
	
*************************************** */

/* base
---------------------------------------------------------- */

body{
	color: #333;
	font-size: 75%;
	}

#top-left,#top-left_gr,#top-left_p,#top-left_bl{
	width: 157px;
	float: left;
	margin-right: 14px;
	text-align: left;
	/*background: url(/img/top_new/bg-topleft.gif) left top repeat-y;*/
	}
#top-main{
	width: 548px;
	float: left;
	}
#top-right{
	width: 186px;
	float: right;
	text-align: left;
	}
	

/* ID top-left
---------------------------------------------------------- */

/* caption */

#top-left h3,#top-left_gr h3,#top-left_p h3,#top-left_bl h3 {
	width: 157px; height: 40px;
	background-position: left top;
	background-repeat: no-repeat;
	text-indent: -9999px;
	}
	/* gray */
	#top-left h3.cap-shopinfo{ background-image: url(/img/top_new/cap-shopinfo.gif); }
	#top-left h3.cap-online{ background-image: url(/img/top_new/cap-onlineshop.gif); }
	#top-left h3.cap-epos{ background-image: url(/img/top_new/cap-epos.gif); }
	#top-left h3.cap-life{ background-image: url(/img/top_new/cap-life.gif); }
	#top-left h3.cap-ir{ background-image: url(/img/top_new/cap-ir.gif); }
	
	/* green */
	#top-left_gr h3.cap-shopinfo{ background-image: url(/img/top_new/cap-shopinfo_gr.gif); }
	#top-left_gr h3.cap-online{ background-image: url(/img/top_new/cap-onlineshop_gr.gif); }
	#top-left_gr h3.cap-epos{ background-image: url(/img/top_new/cap-epos_gr.gif); }
	#top-left_gr h3.cap-life{ background-image: url(/img/top_new/cap-life_gr.gif); }
	#top-left_gr h3.cap-ir{ background-image: url(/img/top_new/cap-ir_gr.gif); }
	
	/* pink */
	#top-left_p h3.cap-shopinfo{ background-image: url(/img/top_new/cap-shopinfo_p.gif); }
	#top-left_p h3.cap-online{ background-image: url(/img/top_new/cap-onlineshop_p.gif); }
	#top-left_p h3.cap-epos{ background-image: url(/img/top_new/cap-epos_p.gif); }
	#top-left_p h3.cap-life{ background-image: url(/img/top_new/cap-life_p.gif); }
	#top-left_p h3.cap-ir{ background-image: url(/img/top_new/cap-ir_p.gif); }

	/* blue */
	#top-left_bl h3.cap-shopinfo{ background-image: url(/img/top_new/cap-shopinfo_bl.gif); }
	#top-left_bl h3.cap-online{ background-image: url(/img/top_new/cap-onlineshop_bl.gif); }
	#top-left_bl h3.cap-epos{ background-image: url(/img/top_new/cap-epos_bl.gif); }
	#top-left_bl h3.cap-life{ background-image: url(/img/top_new/cap-life_bl.gif); }
	#top-left_bl h3.cap-ir{ background-image: url(/img/top_new/cap-ir_bl.gif); }
	
/* list */


#top-left div.left-in,#top-left_gr div.left-in,#top-left_p div.left-in,#top-left_bl div.left-in{ /* 縦長 */
	width: 157px;
	background-position: left bottom;
	background-repeat: no-repeat;
	padding-top: 5px;
	}
#top-left div.left-in2,#top-left_gr div.left-in2,#top-left_p div.left-in2,#top-left_bl div.left-in2{ /* 縦短 */
	width: 157px;
	background: url(/img/top_new/bg-topleft_g02.gif) left bottom no-repeat;
	padding-top: 5px;
	}
	
	/* gray */
	#top-left div.left-in{ background-image: url(/img/top_new/bg-topleft_g01.gif);}
	#top-left div.left-in2{ background-image: url(/img/top_new/bg-topleft_g02.gif);}
	/* green */
	#top-left_gr div.left-in{ background-image: url(/img/top_new/bg-topleft_gr01.gif);}
	#top-left_gr div.left-in2{ background-image: url(/img/top_new/bg-topleft_gr02.gif);}
	/* pink */
	#top-left_p div.left-in{ background-image: url(/img/top_new/bg-topleft_p01.gif);}
	#top-left_p div.left-in2{ background-image: url(/img/top_new/bg-topleft_p02.gif);}
	/* blue */
	#top-left_bl div.left-in{ background-image: url(/img/top_new/bg-topleft_bl01.gif);}
	#top-left_bl div.left-in2{ background-image: url(/img/top_new/bg-topleft_bl02.gif);}
	

#top-left dl,#top-left_gr dl,#top-left_p dl,#top-left_bl dl{
	width: 137px;
	margin: 0 10px;
	padding-bottom: 10px;
	line-height:1.6;
	}
	#top-left dt,#top-left_gr dt,#top-left_p dt,#top-left_bl dt{
		font-weight: bold;
		font-size: 85%;
		margin-bottom: 2px;
		}
	#top-left dt a,#top-left_gr dt a,#top-left_p dt a,#top-left_bl dt a{
		display: block;
		color: #333;
		text-decoration: none;
		width: 137px;
		padding: 1px 0;
		}
		#top-left dt a:hover,#top-left_gr dt a:hover,#top-left_p dt a:hover,#top-left_bl dt a:hover{background-color:#fff1e8; color:#d20000; }
	
	#top-left dd,#top-left_gr dd,#top-left_p dd,#top-left_bl dd{
		font-size: 85%;
		}
	#top-left dd a,#top-left_gr dd a,#top-left_p dd a,#top-left_bl dd a{
		display: block;
		color: #333;
		text-decoration: none;
		background: url(/img/top_new/icon-listtree.gif) left 0.5em no-repeat;
		padding: 2px 0 2px 11px;
		width: 126px;
		}
		#top-left dd.end a,#top-left_gr dd.end a,#top-left_p dd.end a,#top-left_bl dd.end a{ background-image: url(/img/top_new/icon-listtree-end.gif); }
		#top-left dd a:hover,#top-left_gr dd a:hover,#top-left_p dd a:hover,#top-left_bl dd a:hover{ background-color:#fff1e8; color:#d20000; }
		

#top-left div.left-in2 dt,#top-left_gr div.left-in2 dt,#top-left_p div.left-in2 dt,#top-left_bl div.left-in2 dt{ /* ライフサポート／IR・企業情報 */
	font-weight: normal;}
		
		
/* ID top-main
---------------------------------------------------------- */

#top-main #main-v{
	width: 548px;
	}
	#top-main #main-v a:hover img{
	opacity: 0.8;
	filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=80);
	}


#top-main #lsfMenu,#top-main #lsfMenu2{
	width: 548px;
	}
#top-main #lsfMenu2{
	margin-top:10px;
	}
	#top-main #lsfMenu a:hover img,#top-main #lsfMenu2 a:hover img{
	opacity: 0.8;
	filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=80);
	}
#top-main #lsfMenu,#top-main #lsfMenu4{
	width: 548px;
	}
#top-main #lsfMenu4 {
	margin-top: 5px;
	}
*:first-child+html #top-main #lsfMenu4 {
	margin-top:3px;
}
* html #top-main #lsfMenu4 {
	margin-top:3px;
}

	
	#top-main #lsfMenu a:hover img,#top-main #lsfMenu4 a:hover img{
	opacity: 0.8;
	filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=80);
	}
/*
	#top-main #lsfMenu ul li {
	  float: left;
	}
	#top-main #lsfMenu ul li a {
	  display: block;
	  width: 182px;
	  height: 75px;
	  background-position: left top;
	  background-repeat: no-repeat;
	  text-indent: -9999px;
	}
	#top-main #lsfMenu ul li#lsfMenu01 a { background-image: url(../img/top_new/main-v/lsf01.jpg);}
	#top-main #lsfMenu ul li#lsfMenu02 a { background-image: url(../img/top_new/main-v/lsf02.jpg);}
	#top-main #lsfMenu ul li#lsfMenu03 a { background-image: url(../img/top_new/main-v/lsf03.jpg); width: 184px;}

	#top-main #lsfMenu ul li a:hover { background-position: left bottom;}



	#top-main #lsfMenu2 ul li {
	  float: left;
	}
	#top-main #lsfMenu2 ul li a {
	  display: block;
	  width: 274px;
	  height: 80px;
	  background-position: left top;
	  background-repeat: no-repeat;
	  text-indent: -9999px;
	}
	#top-main #lsfMenu2 ul li#lsfMenu04 a { background-image: url(../img/top_new/main-v/lsf04.jpg);}
	#top-main #lsfMenu2 ul li#lsfMenu05 a { background-image: url(../img/top_new/main-v/lsf05.jpg);}

	#top-main #lsfMenu2 ul li a:hover { background-position: left bottom;}
*/


#top-main #lsfMenu3{
	position:relative;
	margin-top:5px;
	width:548px;
	z-index: 0;
}
	#top-main #lsfMenu3 a.btn-ov{
		position:absolute;
		display:block;
	}
		#top-main #lsfMenu3 a:hover.btn-ov img{
			opacity: 0.8;
			filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=80);
		}
	#top-main #lsfMenu3 a.lsf-main{
		top:1px;
		left:1px;
		line-height: normal;
	}
	#top-main #lsfMenu3 a.btn{
		position:absolute;
		background-position:left top;
		background-repeat:no-repeat;
		display:block;
		height:19px;
		width:80px;
		text-indent:-99999px;
	}
		#top-main #lsfMenu3 a:hover.btn{
			background-position:left bottom;
		}
	#top-main #lsfMenu3 a.photo{
		top:61px;
	}
	#top-main #lsfMenu3 a.detail{
		background-image:url(/img/top_new/main-v/lf-fashion-half_btn-d.gif);
		top:154px;
	}
	#top-main #lsfMenu3 a.custom{
		background-image:url(/img/top_new/main-v/lf-fashion-half_btn-c.gif);
		top:178px;
	}
	#top-main #lsfMenu3 a.staff{
		background-image:url(/img/top_new/main-v/lf-fashion-half_btn-s.gif);
		top:178px;
	}
	#top-main #lsfMenu3 a.l-shoes{left:6px;}
	#top-main #lsfMenu3 a.l-suit{left:97px;}
	#top-main #lsfMenu3 a.l-dress{left:188px;}
	#top-main #lsfMenu3 a.m-shoes{left:279px;}
	#top-main #lsfMenu3 a.m-suit{left:370px;}
	#top-main #lsfMenu3 a.eyewear{left:461px;}



/* caption */
#top-main h2.title-news,#top-main h2.title-ranking,#top-main h2.title-online{
	width: 548px; height: 20px;
	background-position: left top;
	background-repeat: no-repeat;
	text-indent: -9999px;
	margin-top: 11px!important;
	margin-top: 9px;
	}
	#top-main h2.title-news{ background-image: url(/img/top_new/title-newstopics.gif); }
	#top-main h2.title-ranking{ background-image: url(/img/top_new/title-onlinerank.gif); }	
	#top-main h2.title-online{ background-image: url(/img/top_new/title-online.gif); }	
	
/* news topics */
#top-main ul.tab-news{
	width: 548px; height: 23px;
	background: url(/img/top_new/bg-tab.gif) left bottom repeat-x;
	margin-top: 11px;
	/*display: none;*/
	}
	#top-main ul.tab-news li{
		width: 140px;
		float: left;
		margin-right: 10px;
		}
	#top-main ul.tab-news li a{
		display: block;
		width: 140px; height: 23px;
		background-image: url(/img/top_new/tab-newstopics.gif);
		background-repeat: no-repeat;
		text-indent:-9999px;
		}
		#top-main ul.tab-news li.marui a{ background-position: 0 -46px; }
		#top-main ul.tab-news li.online a{ background-position: -140px -46px; }
		#top-main ul.tab-news li.epos a{ background-position: -280px -46px; }
		
		#top-main ul.tab-news li.marui a:hover{ background-position: 0 -23px; }
		#top-main ul.tab-news li.online a:hover{ background-position: -140px -23px; }
		#top-main ul.tab-news li.epos a:hover{ background-position: -280px -23px; }
		
		#top-main ul.tab-news li.marui a.tab-on{ background-position: 0 0; }
		#top-main ul.tab-news li.online a.tab-on{ background-position: -140px 0; }
		#top-main ul.tab-news li.epos a.tab-on{ background-position: -280px 0; }
		
#top-main .news-box{
	width: 528px;
	border: solid 1px #cecece;
	border-width: 0 1px 1px 1px;
	padding: 11px 7px 8px 11px;
	/*display: none;*/
	margin-bottom: 11px;
	}
	#top-main #newsMARUI{display: block;}
	#top-main #newsONLINE,
	#top-main #newsEPOS{display: none;}
	#top-main .news-box ul{
		width: 528px; height: 281px;
		overflow-x: hidden;
		overflow-y: auto;
		}
	#top-main .news-box ul li{
		width: 250px;
		float: left;
		margin-right: 5px;
		margin-bottom: 5px;
		line-height: 0;
		font-size: 0;
		}
		#top-main .news-box ul li a:hover img{
			opacity: 0.8;
			filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=80);
			}

		#top-main .news-box ul li.news-bnr1 ul {
			background-image: url(/img/top_new/topics-ban/23.gif);
			background-position: left top;
			background-repeat: no-repeat;
			width: 250px;
			height: 53px;
			padding-top: 12px;
			text-align: left;
		}

		#top-main .news-box ul li.news-bnr1 ul li {
			width: 127px;
			height: 13px;
			float: none;
			margin-left: 14px;
			margin-right: 0px;
			margin-bottom: 2px;
		}

			
/* online ranking */ 
#top-main ul.tab-ranking{
	width: 548px; height: 23px;
	background: url(/img/top_new/bg-tab.gif) left bottom repeat-x;
	margin-top: 11px;
	}
	#top-main ul.tab-ranking li{
		width: 140px;
		float: left;
		margin-right: 10px;
		}
		#top-main ul.tab-ranking li a{
			display: block;
			width: 140px; height: 23px;
			background-image: url(/img/top_new/tab-ranking.gif);
			background-repeat: no-repeat;
			text-indent:-9999px;
			}
			#top-main ul.tab-ranking li.seller a{ background-position: 0 -46px; }
			#top-main ul.tab-ranking li.access a{ background-position: -140px -46px; }
			
			#top-main ul.tab-ranking li.seller a:hover{ background-position: 0 -23px; }
			#top-main ul.tab-ranking li.access a:hover{ background-position: -140px -23px; }
			
			#top-main ul.tab-ranking li.seller a.tab-on{ background-position: 0 0; }
			#top-main ul.tab-ranking li.access a.tab-on{ background-position: -140px 0; }
			
		#top-main ul.tab-ranking li.webch{
			width: 177px;
			float: right;
			margin-right: 0;
			}
			#top-main ul.tab-ranking li.webch a{
				width: 177px;
				background: url(/img/top_new/logo-webch.gif) left top no-repeat;
				}
			#top-main ul.tab-ranking li.webch a:hover{
				opacity: 0.7;
				filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=70);
				}
				
#top-main #ranking{
		width: 532px;
		background: url(/img/top_new/bg-ranking.gif) left bottom no-repeat;
		padding: 0 9px 15px 7px;
		}
	#top-main #ranking #rank-sell{
		width: 532px;
		background: url(/img/top_new/bg-rank-seller.gif) center top no-repeat;
		padding-top: 16px;
		}
	#top-main #rank-access{
		width: 532px;
		background: url(/img/top_new/bg-rank-access.gif) center top no-repeat;
		padding-top: 16px;
		}
	#top-main #ranking h3{ margin-top: 10px; margin-bottom:5px;}
		
		

#top-main #ranking table{ width: 532px; }
#top-main #ranking table td{ padding: 2px; vertical-align:top; }
#top-main #ranking table td div{ text-align: center; position:relative;}
#top-main #ranking table td div span{ display: block; text-align: left; font-size: 80%; padding: 2px;}
#top-main #ranking table td div span span{ display: inline; font-size: 100%; padding: 0; }
#top-main #ranking table img.rank-num{ position:absolute; left: 10px; top: 2px; }
#top-main #ranking table td div a{ color: #000; text-decoration: none; }
#top-main #ranking table td div a span{ color: #000; text-decoration: none; }
#top-main #ranking table td div a:hover{ color: #000; text-decoration: underline; }
#top-main #ranking table td div a:hover span{ color: #000; text-decoration: underline; }


/* ID webch-search */
#top-main #webch-search{
	width: 270px; height: 78px;
	background: url(/img/top_new/bg-brandsearch.gif) left bottom no-repeat;
	text-align: left;
	float: left;
/*	margin-top: 5px; */
	margin-top: 11px; 
	}
	#top-main #webch-search p{
		width: 270px; height: 25px;
		background: url(/img/top_new/cap-brandsearch.gif) left top no-repeat;
		text-indent: -9999px;
		}
	#top-main #webch-search select{
		margin-left: 11px;
		width: 110px;
		}
	#top-main #webch-search input.wc_ranking_search_input{
		margin-left: 11px;
		width:170px;
		margin-top: 3px;
		} 
/* webch-park */
#top-main .webch-park{
	width: 271px;
	float:right;
/*	margin-top: 5px; */
	margin-top: 11px; 
	}



/* ID top-right
---------------------------------------------------------- */
#top-right ul{
	list-style:none;
	margin:0;
	padding:0 0 10px;
}
#top-right li{
	width:186px;
	overflow:hidden;
	display:block;
	margin:0;
	padding:0;
	line-height:0;
	vertical-align: bottom;
	font-size:0;
}

#top-right li{	/* 通常はドットライン3px */
	background:url(/img/top_new/sideban/line_dot.gif) left bottom repeat-x;
}
#top-right li img{
	padding-bottom:3px;
}

#top-right li.bottom{	/* 一番下の場合、アールつきの下枠線4px */
	background:url(/img/top_new/sideban/line_bottom.gif) left bottom repeat-x;
}
#top-right li.bottom img{
	padding-bottom:4px;
}

#top-right li.none{	/* 何もつけたくない場合 */
	background:none;
}
#top-right li.none img{
	padding-bottom:0;
}


#top-right li a{	/* 通常は左基準で右はみ出し */
	margin-left:0;

}
#top-right li a:hover{ /* オーバーで画像の表示部分を変える */
	margin-left:-186px;
}

#top-right ul li.school{ /* カルチャースクール */
	background:url(/img/top_new/sideban/btn_bg_school.gif) left;
}
#top-right ul ul{
	list-style:none;
	margin:0 0 3px 114px;
	padding:0;
	width:72px;
}

#top-right li.school li{
	width:72px;
	overflow:hidden;
	display:block;
	margin:0;
	padding:0;
	line-height:0;
	vertical-align: bottom;
	font-size:0;
}
#top-right li.school li a:hover{ /* オーバーで画像の表示部分を変える */
	margin-left:-72px;
}


#top-right ul ul li img{
	padding-bottom:0;
}


/* 要素の後で回り込み解除（6/16未使用） */
.clr_after {
	zoom: 100%;
}
.clr_after:after {
	content: "";
	clear: both;
	height: 0px;
	display: block;
	visibility: hidden;
}


/* ---------------------------------
	メインイメージ下バナー設定
--------------------------------- */
#top-main #main-v-btm{ margin-top:4px;}
#top-main #main-v-btm a:hover img{
	opacity: 0.7;
	filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=70);
}
/*#top-main #main-v-btm p.banner_l,#top-main #main-v-btm p.banner_r{
	margin:0px;
	padding:0px;
	width:273px;
	height:50px;
}
#top-main #main-v-btm p.banner_l{float:left;}
#top-main #main-v-btm p.banner_r{float:right;}
#top-main #main-v-btm p.banner_l a:hover img,#top-main #main-v-btm p.banner_r a:hover img{
	opacity: 0.7;
	filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=70);
}*/
/* ---------------------------------
	news＆topics分割対応
#top-main h3{
	width: 548px; height: 22px;
	background-position: left top;
	background-repeat: no-repeat;
	text-indent: -9999px;
	margin-top: 11px;
	}
	#top-main h3.title-newsMARUI{ background-image: url(/img/top_new/tit-marui.gif); }
	#top-main h3.title-newsONLINE{ background-image: url(/img/top_new/tit-online.gif); }
	#top-main h3.title-newsEPOS{ background-image: url(/img/top_new/tit-epos.gif); }
--------------------------------- */
