@charset "utf-8";  

/*------------------------------------------------------------ 
    デフォルトスタイル       全ページ共通css
------------------------------------------------------------*/  

/**** フォントサイズ　*************

基本を12pxに、サイズは％指定。

====偶数====　　　====奇数====
■10px = 84%      ■11px = 92%
■12px = 100%     ■13px = 109%
■14px = 117%     ■15px = 125%
■16px = 134%     ■17px = 142%
■18px = 150%     ■19px = 159%
■20px = 167%     ■21px = 175%
■22px = 184%     ■23px = 192%
■24px = 200%     ■25px = 209%
■26px = 217%     ■27px = 226%

**********************************/

html, body{	margin:0; padding:0;}
body{
	font-size:76%;
	-webkit-text-size-adjust: 100%;
	min-width:1008px; 
	background:url(../img/bodyBg.png) repeat;
}

html{ font-size:100%;}

div, span, applet, object, iframe,  
h1, h2, h3, h4, h5, h6, p, blockquote, pre,  
a, abbr, acronym, address, big, cite, code,  
del, dfn, em, font, img, ins, kbd, q, s, samp,  
small, strike, strong, sub, sup, tt, var,  
b, u, i, center,  
dl, dt, dd, ol, ul, li,  
fieldset, form, label, legend,  
table, caption, tbody, tfoot, thead, tr, th, td {  
    margin: 0;  
    padding: 0;  
    border: 0;  
    outline: 0; 
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; 
	color:#000;
	font-size:100%;
	font-weight:normal;
}  

ul { list-style: none;} 
a { text-decoration:none; color:#000; outline:none;}  
a img{ border:none;}

.clear{ clear:both;}
.clearfix{ width:100%;}
.clearfix:after{
    content:"";
    display:block;
    clear:both;
}
.overflow{ overflow:hidden;}

.floatLeft{ float:left;}
.floatRight{ float:right;}
.textLeft{ text-align:left;}
.textCenter{ text-align:center;}
.textRight{ text-align:right;}
.whiteBold{ font-weight:bold; color:#fff;}
.blackBold{ font-weight:bold; color:#000;}
.colorRed{ color:#990000;}
.colorBlack{ color:#333;}
.colorWhite{ color:#fff;}

.ht165{ height:165px;}
.ht100{ height:100px;}

#container{ 
	min-width:988px; 
}

.sp_banner {
    width: 100%;
    height: 153px;
	text-align:center;
	background:#660000;
}

.sp_banner a {
    display: block;
    text-align: center;
}

/*------------------------------------------------------------
    ヘッダー 
------------------------------------------------------------*/  
#header{ 
	width:100%;
 	height:132px;
	background:url(../img/headerBg.png) repeat-x; 
}  

.headerInner{
	width:980px;
	height:132px;
	padding:0 4px;
	margin:0 auto;
	background:url(../img/logoBg.png) no-repeat 24px 0%;
}

.innerTop{ height:92px;}

.innerBottom{
	clear:both;
	height:40px;
}

h1.h1style{
	color:#d4c4aa;
	font-size:11px;
	width:auto;
	height:18px;
	float:none;
	padding:0;
	padding:5px 0;
}

.innerTop .h2style{ 
	width:259px;
	height:56px;
	float:left;
	border:none;
}

.innerTop .top_headnav{ padding-top:18px;}
.innerTop .top_headnav li{ line-height:20px;}

.headerNavi{
	float:right;
}

.headerNavi li{ 
	float:left; 
	margin-left:25px; 
	line-height:92px;
}

.headerNavi a{
	color:#D4C4AA;
	font-weight:bold;
	padding:0 3px;
	line-height:20px;
}

.headerNavi a:hover,
.headerNavi #headerLogin a:hover span,
#headerMypage li a:hover{
	color:#5B5449;
	background-color:#DBCAAF;
}

.headerNavi #headerLogin a{
	display:block;
	padding:0 0 0 25px;
	background-image:url(../img/icon-user.png);
	background-repeat:no-repeat;
	background-position:0 50%;
}

.headerNavi #headerLogin a{ background-color:inherit;}

.headerNavi #headerLogin span{
	color:#D4C4AA;
	font-weight:bold;
	padding:0 3px;
}

#headerMypage{
	padding:6px 0;
	margin-top:-6px;
	background:#2C2823;
	border-radius:5px;
}

#headerMypage p{
	float:left;
	color:#D4C4AA;
	padding:0 10px;
	line-height:20px;
}

#headerMypage div{
	float:left;
	padding:0 10px;
	margin-left:50px;
	position:relative;
	border-left:1px solid #D4C4AA;
}

#headerMypage-trigger{
	display:block;
	line-height:20px;
	padding:0 0 0 25px;
	background-image:url(../img/icon-user.png);
	background-repeat:no-repeat;
	background-position:0 50%;
}

#headerMypage-trigger:after{
	display:inline-block;
	vertical-align:middle;
	content:"";
	width:0;
	height:0;
	border:4px solid transparent;
	border-top:6px solid #D4C4AA;
	margin-left:8px;
	margin-top:2px;
}

#headerMypage-trigger:hover,
#headerMypage .logout a:hover{
	background-color:inherit;
	color:#D4C4AA;
}

#headerMypage ul{
	display:none;
	width:150px;
	padding:10px;
	position:absolute;
	right:0;
	top:20px;
	background:#2C2823;
	z-index:10;
}

#headerMypage li{
	float:none;
	line-height:1.2;
	margin-left:0;
	padding:10px 0;
	border-bottom:1px solid #D4C4AA;
}

#headerMypage li a{
	display:block;
	padding-left:15px;
	background:url(../img/icon_cate.png) no-repeat 2px 50%;
}

#headerMypage li a:hover{ background-image:url(../img/icon_cate_on.png);}

#headerMypage .logout{
	text-align:right;
	margin-top:10px;
	padding:0;
	border-bottom:none;
}

#headerMypage .logout a{
	background:none;
	padding-left:0;
}

#headerMypage .logout a:hover{
	text-decoration:underline;
	background:none;
}

.globalNavi{ 
	width:600px; 
	float:right;
}

#news,#belts,#about,#info,#cart{ 
	float:left;
	height:40px;
	line-height:40px;
	text-align:center;
}

#news{ width:135px;}
#belts{ width:85px;}
#about{ width:115px;}
#info{ width:115px;}

#cart{ 
	background:url(../img/icon_cart.png) no-repeat 10px 60%; 
	height:35px;  
	width:150px;
	text-align:left;
	text-indent:35px;
	position:relative;
}

.globalNavi a{ 
	display:block;
	width:100%;
	height:35px;
	color:#D4C4AA;
	font-weight:bold;
	line-height:35px;
	border-top:3px solid #000000;
}

.globalNavi a:hover{ 
	border-color:#CBBBA2;
}

.cartBox{
	display:none;
	width:180px;
	height:100px;
	text-indent:0!important;
	padding:10px;
	background:#2C2823;
	position:absolute;
	z-index:100;
	left:-50px;
	line-height:1.5;
}

.cartBox div{
	overflow:hidden;
	margin-top:5px;
}

.cartLeft{
	display:block;
	float:left;
	color:#fff;
	width:60px;
}

.cartRight{
	display:block;
	float:right;
	color:#fff;
	width:120px;
	text-align:right;
}

.cartBox p{
	margin-top:20px;
	color:#FFCC00;
	font-size:92%;
}

/* login */

.no{ display:none;}

.loginHd{
	width:100%;
	height:40px;
	line-height:40px;
	text-indent:20px;
	background:#000;
	color:#F0E0C4;
	font-size:134%;
}

.loginForm{
	width:282px;
	margin:50px auto 0;
    border-collapse: collapse;
    border-spacing: 0;
}

.loginForm th{
	width:80px;
	text-align:left;
	font-weight:bold;
	padding-bottom:10px;
}

.loginForm td{
	width:202px;
	padding-bottom:10px;
}

.l_input{
	width:200px;
	padding:8px 5px;
	border:1px solid #ccc;
}

#loginArea{
	width:360px;
	height:310px;
	position:absolute;
	margin:auto;
	left:0;
	top:0;
	right:0;
	bottom:0;
	padding:10px 10px 0;
	background:#fff;
	z-index:10100;
}

#passwordArea{
	width:460px;
	height:520px;
	padding:10px;
	position:absolute;
	margin:auto;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:#fff;
	z-index:10100;
}

#password{
	width:600px;
	padding:10px;
	background:#fff;
	display:none;
}

.passwordTtl{
	height:50px;
	line-height:50px;
	text-align:center;
	background:#996699;
	color:#fff;
	font-size:134%;
	font-weight:bold;
	margin-bottom:30px;
}

.passInner{
	width:300px;
	margin:30px auto 10px;
}

.pass-link{
	padding-left: 15px;
	background: url(../img/icon01.png) no-repeat left center;
}

.pass-link a{
	display:inline-block;
	padding:3px;
	color:#000;
}

.pass-link a:hover{
	color:#fff;
	background:#000;
}

.passInput{
	width:288px;
	height:18px;
	padding:5px;
	border:1px solid #ccc;
	background:#EAEAEA;
}

.passBtn{
	width:140px;
	height:45px;
}

.passBtn a{
	display:block;
	width:100%;
	height:100%;
	line-height:45px;
	text-align:center;
	color:#fff;
	font-size:117%;
}

.passBtn.style1{ float:left;}
.passBtn.style2{ float:right;}

.passBtn.style1 a{ background:#660000;}
.passBtn.style2 a{ background:#000;}

.loginTxt{
	text-align:center;
	padding-top:30px;
}

.mT10{ margin-top:10px;}
.mB15{ margin-bottom:15px;}
.mB20{ margin-bottom:20px;}

#loginOverlay{
    position: fixed;
    z-index: 10010;
    top: -5000px;
    right: -5000px;
    bottom: -5000px;
    left: -5000px;
    background: rgba(51, 51, 51, 0.7);
}

.opacity:hover {
	opacity: .7;
	filter: alpha(opacity=70);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=70)";  /* ie 8 */
	-moz-opacity: .7;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: .7;
}

/*------------------------------------------------------------
    コンテンツ 
------------------------------------------------------------*/

#content{  
  width:988px;
  margin:0px auto;
	overflow:hidden;
}  

.leftCont{
	width:738px;
	float:left;
}

.rightCont{
	width:238px;
	float:right;
}

.pankuzu{
	width:980px;
	height:30px;
	line-height:30px;
	background:#A99C87;
	margin:15px 0 0 4px;
	text-indent:1em;
}

.pankuzu a{ padding:0 3px;}
.pankuzu a:hover{
	color:#D3C4AA;
	background:#000;
}

.inner{
	margin-top:10px;
	overflow:hidden;
}

.contBgTop{
	background:url(../img/contBgTop.png) no-repeat;
	width:988px;
	height:4px;
}

.contBgBottom{
	background:url(../img/contBgBottom.png) no-repeat;
	width:988px;
	height:4px;
}

.contBgMiddle{
	width:980px;
	padding:0 4px;
	background:url(../img/contBgMiddle.png) repeat-y;
}

.mainBgTop{
	background:url(../img/mainBgTop.png) no-repeat;
	width:738px;
	height:4px;
}

.mainBgBottom{
	background:url(../img/mainBgBottom.png) no-repeat;
	width:738px;
	height:4px;
}

.mainBgMiddle{
	width:730px;
	padding:0 4px;
	background:url(../img/mainBgMiddle.png) repeat-y;
}

.sideBgTop{
	background:url(../img/sideBgTop.png) no-repeat;
	width:238px;
	height:4px;
}

.sideBgBottom{
	background:url(../img/sideBgBottom.png) no-repeat;
	width:238px;
	height:4px;
}

.sideBgMiddle{
	width:230px;
	padding:0 4px;
	background:url(../img/sideBgMiddle.png) repeat-y;
}


/*------------------------------ 
	商品一覧
------------------------------*/

#itemList{
	width:738px;
	overflow:hidden;
}

#itemList ul{ width:750px;}

.items{
	width:200px;
	height:325px;
	padding:19px 19px;
	background:url(../img/itemListBg.png) no-repeat;
	background-position:0 0;
	float:left;
	margin:0 12px 12px 0;
}

.items:hover{ 
	background:url(../img/itemListBg.png) no-repeat;
	background-position: -238px 0;
}

.itemImg{
	width:200px;
	height:200px;
	background:#fff;
	position:relative;
}

.itemImg span{
	width:68px;
	height:20px;
	line-height:20px;
	text-align:center;
	color:#fff;
	font-size:92%;
	font-family:Arial, Helvetica, sans-serif;
	position:absolute;
	top:0;
	left:0;
}

.icon-sale{ background:#FE0000;}
.icon-pickup{ background:#0099FF;}
.icon-new{ background:#FE9900;}


.itemTitle1{ 
	margin:5px 0; 
	font-size:92%; 
}

.itemTitle2{ 
	height:35px;
	font-size:92%; 
	line-height:1.4;
	
}

/*------------------------------ 
	入力フォーム 
------------------------------*/

input,textarea{	padding:2px 5px;}

/*------------------------------ 
	ページナビ 
------------------------------*/


.pageNavi ul{ overflow:hidden;}

.pageNavi li{
	width:24px;
	height:24px;
	text-align:center;
	line-height:24px;
	background:#000;
	color:#fff;
	float:left;
	margin-right:5px;
}

.pageNavi a{
	display:block;
	width:100%;
	height:100%;
	color:#000;
	background:#ccc;
}

.pageNavi a:hover{
	color:#fff;
	background:#000;
}

/*------------------------------ 
	sideMenu 
------------------------------*/

.sideMenuTitle{
	color:#F0E0C4;
	background:#000;
	height:40px;
	line-height:40px;
	text-indent:10px;
	font-size:150%;
}

.sideMenu{
	width:230px;
	padding:15px 0;
}

.sideMenu li{
	height:36px;
	line-height:36px;
}

.sideMenu .menu1{
	height:36px;
	line-height:1.2;
}

.sideHeadline{ 
	text-indent:15px;
	font-weight:bold;
	font-size:117%;	
}

.sideMenu a{
	display:block;
	width:215px;
	height:36px;
	padding-left:15px;
}

.sideMenu a:hover{
	color:#fff;
	background:#000;
}

.menu1 a{
	padding-top:3px;
	height:33px;
}

.menuBorder{ 
	border-top:2px solid #ccc;
	width:200px;
	margin-left:15px;
	height:2px;
}

/*------------------------------ 
	chat 
------------------------------*/

#chat{
	position:fixed;
	bottom:0;
	right:0;
	z-index:500;
	width:300px;
	background:#fff;
}

#chat_btn{
	width:300px;
	height:35px;
	cursor:pointer;
	background:#660000 url(../img/chat_header.png) no-repeat right;
	text-indent:10px;
	line-height:35px;
	color:#fff;
	font-weight:bold;
}

.chatInner{
	width:298px;
	border:1px solid #ccc;
	border-bottom:none;
	padding-bottom:10px;
	display:none;
}

.state{
	width:298px;
	height:30px;
	line-height:30px;
	color:#333;
	text-indent:10px;
	font-weight:bold;
}

.offline{ background:#EDEDED url(../img/offline.png) center right no-repeat;}
.online{ background:#EDEDED url(../img/online.png) center right no-repeat;}


.bdrB{ border-bottom:1px solid #ccc;}

.chatBoxInner{
	max-height:300px;
	overflow-y:auto;
	overflow-x:hidden;
}

.chatBox{
	width:280px;
	padding:14px 9px;
	overflow:hidden;
}

.user{
	width:210px;
	float:left;
	margin-left:10px;
}

.user span{
	display:block;
	color:#666;
	font-size:84%;
	margin-bottom:5px;
}

.chatArea{
	width:268px;
	height:55px;
	border:1px solid #ccc;
	overflow:auto;
	resize:none;
	padding:5px;
}

.chat_submit{
	width:60px;
	height:30px;
	line-height:30px;
	text-align:center;
	float:right;
	margin-top:5px;
}

.chat_submit a{
	display:block;
	width:100%;
	height:100%;
	background:#660000;
	color:#fff;
}

/*------------------------------------------------------------
    フッター 
------------------------------------------------------------*/

#footer{  
	width:100%;
	background:url(../img/footerBg.png) repeat;
	margin-top:30px;
	padding-bottom:10px;
}

.ftName{
	color:#d4c4aa;
	font-size:11px;
	padding:0 0 5px 5px;
}

.footerInner{
	width:988px;
	margin:0 auto;
	padding-top:20px;
}

.footerNavi{
	width:100%;
	text-align:center;
	background:url(../img/footerBorder.png) repeat-x center;
	height:26px;
	padding-top:10px;
}

.footerNavi li{ 
	display:inline-block;
	border-left:1px solid #D2C2A8;
	padding:0 6px;
	font-size:92%;
}

.footerNavi li:first-child{ border:none;}

.footerNavi a{
	display:inline-block;
	color:#D2C2A8;
}
.footerNavi a:hover,
#ftBrand a:hover{
	color:#464139;
	background:#D2C1A7;
}

#ftBrand{
	width:100%;
	display:table;
	margin-top:8px;
	padding-bottom:8px;
	background:url(../img/footerBorder2.png) repeat-x center bottom;
}

#ftBrand dt{
	width:150px;
	display:table-cell;
	vertical-align:top;
	color:#D2C2A8;
}

#ftBrand dd{
	display:table-cell;
	vertical-align:top;
}

#ftBrand li{
	display:inline-block;
	color:#D2C2A8;
}

#ftBrand li:not(:first-child):before{
	display:inline;
	content:"・";
}

#ftBrand a{ color:#D2C2A8;}

.innerBottom2{
	overflow:hidden;
	padding-top:15px;
}

.logoFt{  
	width:199px; 
	height:44px; 
	float:left;
	margin:0 20px 0 4px;
}

.footerImg{ float:left;}

.address{ 
	float:left; 
	margin-left:15px; 
	color:#D8C7AC; 
	font-size:92%; 
	border-left:1px solid #D2C1A7;
	padding-left:15px;
	margin-top:5px;
}

.grecaptcha-badge{ bottom: 40px !important;}