@charset "UTF-8";
/* *****************************************************************************************************
*
*  layout.css
* 
* -------------------------------------------------------------------------------------
* 
*   ---- FONT-SIZE -----
*	
*	 9px	69%			|		18px	138.5%
*	10px	77%			|		19px	146.5%
*	11px	85%			|		20px	153.9%
*	12px	93%			|		21px	161.6%
*	13px	100%		|		22px	167%
*	14px	108%		|		23px	174%
*	15px	116%		|		24px	182%
*	16px	123.1%		|		25px	189%
*	17px	131%		|		26px	197%
*
*	---- TABLE OF CONTENTS -----
*	
*	01, body
*	02, #container
*	03, #header
*	04, #globalNavi
*	05, #orderFlow
*	06, #headerTP
*	07, #wrapper
*	08, #sideBar
*	09, #mainContents
*	10, #footerOuter
*	11, #footerTP
*	12, #footer
*	13, #cp
*
******************************************************************************************************/

/* ============================================================
	
	01, body
	
   ============================================================ */

body {
	border-top:5px solid #000;
	min-width:980px;
}

/* ============================================================
	
	 02, #container   

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

#container {
    width:980px;
	margin:0 auto;
    
}

/* ============================================================
	
	03, #header
	
   ============================================================ */
 
#header {
	width:100%;
	margin-bottom:10px;
}

/* --------------------------------------------------------------------
 #headerLogo
----------------------------------------------------------------------- */

#headerLogo {
	/*width:320px;*/
	width:360px;
	overflow:hidden;
	float:left;
	padding-top:31px;
}

.cartLogo { padding-top:75px !important; }

#headerLogo h1 {
	width:100%;
	margin-bottom:10px;
}

#headerLogo h1 a {
	display:block;
	width:100%;
	height:50px;
	background:url(../img/logo.gif) no-repeat;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

#headerLogo h2 {
	display:block;
	width:100%;
}

/* --------------------------------------------------------------------
 #headerInfo .language
----------------------------------------------------------------------- */

#header #headerInfo {
	width:480px;
	float:right;
	padding-top:15px;
}

/* --------------------------------------------------------------------
 #headerInfo .language
----------------------------------------------------------------------- */

#headerInfo .language {
	margin-bottom:15px;
	text-align:right;
}

/* --------------------------------------------------------------------
 #headerInfo .headUserInfo
----------------------------------------------------------------------- */

.userInfo {
	width:100%;
	position:relative;
	z-index:100;
}

.userInfo ol {
	width:100%;
	background:#F7F7F7;
}

.userInfo ol li {
	float:left;
	background:url(../img/bg_userInfo.gif) no-repeat right top;
}

.userInfo li.username {
	width:232px;
	padding:11px 5px 0 10px;
	font-size:93%; /*12px*/
}

.userInfo li.login { width:91px; }

.userInfo li.member { width:156px; }

.userInfo li.service { width:116px; }
.userInfo li.service a.active {color:#E6A234;}

.userInfo li.cart { width:116px; background:none; }

.userInfo ol a {
	display:block;
	height:32px;
	line-height:32px;
	text-align:center;
	font-size:93%; /*12px*/
}

.userInfo ol li span {
	padding-right:13px;
	background-repeat:no-repeat;
	background-position:right center;
}

.userInfo ol li.login span { background-image:url(../img/icon_triangle_orange_r.png); }
.userInfo ol li.member span { background-image:url(../img/icon_triangle_black_r.png); }
.userInfo ol li.service span { background-image:url(../img/icon_triangle_orange_b.png); }
.userInfo ol li.cart span { padding:0 0 0 25px; background:url(../img/icon_cart.png) no-repeat left center; }

/* .btnAccount pop up -------  */

.userPopup {
	display:none;
	width:234px;
	padding-top:30px;
	position:absolute;
	left:246px;
	top:32px;
	background:url(../img/bg_popup.png) no-repeat center top;
}

*:first-child+html .userPopup { height:100%; }

.userPopup ul {
	width:202px;
	padding:0 15px 0 15px;
	border:1px solid #DDD;
	border-top:none;
	background:#F0F0F0;
}

.userPopup ul li {
	float:none;
	padding:0 0 0 10px !important;
	background:url(../img/list_triangle.png) no-repeat left 5px;
	border-right:none;
	margin:0 0 15px 0;
}

.userPopup ul li a {
	display: inline;
	height:auto;
	line-height: 1.1;
	text-align:left;
	font-size:93%; /*12px*/
}


/* --------------------------------------------------------------------
 #headerInfo .headContact
----------------------------------------------------------------------- */

#headerInfo .headContact { margin:15px 0; }

.headContact li {
	margin-bottom:5px;
	padding-left:28px;
	font-family:Arial, Helvetica, sans-serif;
}

.headContact li.tel {
	font-size:93%; /*12px*/
	background:url(../img/icon_headcontact_tel.gif) no-repeat left center;
}

.headContact li.tel strong {
	padding-right:10px;
	font-size:125.0%; /*15px*/
	letter-spacing:0.03em;
}

.headContact li.mail {
	background:url(../img/icon_headcontact_mail.gif) no-repeat left center;
	letter-spacing:0.02em;
	font-weight:bold;
}

.headContact li.note { font-size:93%; /*12px*/ padding-left:0; }

.headContact li.note a {
	background:url(../img/icon_triangle_orange_r.png) no-repeat right center;
	padding-right:18px;
}

/* ============================================================
	
	04, #globalNavi

   ============================================================ */
 
#globalNavi {
	width:100%;
	overflow:hidden;
	margin:0 auto 25px;
}

#globalNavi ul {
    width: 100%;
    display: table;
}

#globalNavi li {
	display: table-cell;
	border: 1px solid #CCC;
	border-width: 0 1px 1px 0;
	color:#1F1D19;
	text-align:center;
}

#globalNavi li:first-child {
	border-left-width: 1px;
}


#globalNavi li a {
	display: block;
	line-height: 37px;
	padding:0 10px;
}

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

	05, #orderFlow
	
	============================================================ */
	
#orderFlow {
	width:100%;
	overflow:hidden;
	margin-bottom:25px;
	font-size:93% /*12px*/
}

#orderFlow ul {
	width:717px;
	padding-left:22px;
	float:right;
	overflow:hidden;
	border-right:1px solid #CCC;
	background:url(../img/bg_orderflow.png) no-repeat left;
}

#orderFlow h1,
#orderFlow li {
	width:238px;
	height:37px;
	line-height:37px;
	float:left;
	border:1px solid #CCC;
	border-right:none;
	text-align:center;
}

#orderFlow h1 {
	font-weight:normal;
	border-right:1px solid #CCC;
}

#orderFlow .current { background:#E4E4E4; }

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

	06, #headerTP --- breadcrumb
	
	============================================================ */

#headerTP { margin-bottom:25px; }

/* ============================================================
	
	07, #wrapper   
	
	============================================================ */
   
#wrapper {
	width:100%;
	overflow:hidden;
	padding-bottom:40px;
}

/* ============================================================
	
	08, #sideBar
	
	============================================================ */

#sideBar {
	width:200px;
	float:left;
}

/* --------------------------------------------------------------------
  .sideBnrBox
----------------------------------------------------------------------- */

.sideBnrBox { padding-bottom:30px; }
.sideBnrBox ul { margin-bottom:-20px; }
.sideBnrBox li { margin-bottom:20px; }
.sideBnrBox #sidebnr_fb { min-height:110px; }

/* --------------------------------------------------------------------
  .sideMenuBox
----------------------------------------------------------------------- */

.sideMenuBox {
	border-bottom:1px solid #DDD;
	margin-bottom:30px;
	line-height:1.7;
	background-color:#F7F7F7;
}

.sideMenuBox a {
	display:block;
	padding:10px 0 10px 10px;
}
.sideMenuBox a:hover { background-color: #FFF9F0; }

.sideMenuBox ul span {
	display:block;
	border-top:1px solid #DDD;
	font-size:108%; /*14px*/
}

.sideMenuBox ul.menuChild {
	overflow:hidden;
	border-top:1px dotted #C5C5C5;
}

.sideMenuBox ul.menuChild li {
	border-top:1px dotted #C5C5C5;
	margin-top:-1px;
	font-size:93%; /*12px*/
}

.sideMenuBox ul.menuChild li a {
	padding:10px 10px 10px 20px;
	background:url(../img/list_triangle.png) no-repeat 10px 17px;
}

/* .pattern01 -------  */

.pattern01 { background:#F7F7F7 }

.pattern01 h1 {
	display:block;
	border-top:1px solid #DDD;
	background:#F7F7F7;
	font-size:108%; /*14px*/
	font-weight:normal;
}

.pattern01 ul span {
	padding:15px 0 0 10px !important;
	border-top:1px dotted #C5C5C5 !important;
	font-size:93% !important; /*12px*/
	color:#3F2C13 !important;
	font-weight:bold;
}

.pattern01 span a {
	padding:0 !important;
	background:none !important;
	color:#3F2C13;
}

.pattern01 span a:hover { color:#E6A234; }

.pattern01 h1 a { padding:15px 0 15px 10px !important; }

.pattern01 ul.menuChild {
	border-top:none !important;
	padding:8px 10px 10px 10px !important;
}

.pattern01 ul.menuChild li {
	border-top:none !important;
	margin-top:0 !important;
	font-size:85% !important; /*11px*/
}

.pattern01 ul.menuChild li a {
	padding:5px 0 3px 10px !important;
	background-color: transparent !important;
	background-position:0 12px !important;
}

/* --------------------------------------------------------------------
  .sideCategoryBox
----------------------------------------------------------------------- */

.sideCategoryBox {
	padding-bottom:30px;
	line-height:1.5;
	font-size:90%;
}

.sideCategoryBox ul { border:1px solid #E0E0E0;}
.sideCategoryBox ul.CategoryList { border:none;}

.sideCategoryBox .CategoryList li {
	border-top: 1px dotted #C5C5C5;
	margin-top: -1px;
}

.sideCategoryBox li a {
	display:block;
	padding:10px 8px 10px 10px;
	text-decoration:underline;
}

.CategoryList li a {
	padding:10px 10px 10px 20px !important;
    background: url(../img/list_triangle.png) no-repeat scroll 10px 17px transparent;
}

.sideCategoryBox li a:hover {text-decoration:none;}

/* --------------------------------------------------------------------
  .sideLinkBox
----------------------------------------------------------------------- */

.sideLinkBox { padding-bottom:30px; }
.sideLinkBox ul { margin-bottom:-10px; }
.sideLinkBox li { margin-bottom:10px; }

/* --------------------------------------------------------------------
  .sideContactBox
----------------------------------------------------------------------- */

.sideContactBox {
	border:1px solid #E0E0E0;
	padding:2px 2px 10px 2px;
	margin-bottom:20px;
}

.sideContactBox h1 {
	padding:10px;
	margin-bottom:10px;
	font-size:93%; /*12px*/
	line-height:1.6;
	font-weight:normal;
	text-align:center;
	background:url(../img/bg_contact_ti.gif) repeat;
}

.sideContactBox h2 {
	width:161px;
	margin:0 auto 10px;
}

.sideContactBox h2 a {
	display:block;
	width:100%;
	height:26px;
	background:url(../img/logo_sidecontact.gif) no-repeat;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

.sideContactBox h3 {
	margin-bottom:5px;
	color:#EAA51F;
	font-size:161.6%; /*21px*/
	font-family:Arial, Helvetica, sans-serif;
	letter-spacing:0.02em;
	text-align:center;
}

.sideContactBox h3 span {
	background:url(../img/icon_sidecontact_tel.gif) no-repeat left center;
	padding-left:35px;
}

.sideContactBox p {
	margin-bottom:5px;
	text-align:center;
	line-height:1.6;
	font-size:93%; /*12px*/
	color:#666;
}

.sideContactBox .btnContact {
	width:180px;
	margin:0 auto;
}

.sideContactBox .btnContact a {
	display:block;
	height:40px;
	line-height:40px;
	background:#EAA51F;
	text-align:center;
	color:#FFF;
	font-size:93%; /*12px*/
}
.sideContactBox .btnContact a:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
}
.sideContactBox .btnContact span {
	background:url(../img/list_triangle_wh.png) no-repeat left center;
	padding-left:10px;
}

/* --------------------------------------------------------------------
  .sideOtherBox
----------------------------------------------------------------------- */

.sideOtherBox p {
	margin-bottom:20px;
	font-size:77%; /*10px*/
	line-height:1.6;
}

.sideOtherBox #verisignBtn {
	text-align:center;
	margin-bottom:10px;
}

.sideOtherBox #verisignBtn a {outline:none;}

.sideOtherBox p.privacy {
    border: solid 1px #E0E0E0;
    font-size: 12px;
	padding: 10px;
}
/* ============================================================
	
	09, #mainContents 
	
	============================================================ */
 
#mainContents {
	width:750px;
	float:right;
}

#mainContents .fontMing {
	font-family:'ヒラギノ明朝 ProN W3','HiraMinProN-W3','HG明朝E','ＭＳ Ｐ明朝','MS PMincho','MS 明朝',serif;
	font-size:175%;
	font-weight:normal;
	line-height:1.5;
}

#mainContents .fontMingFree {
	font-family:'ヒラギノ明朝 ProN W3','HiraMinProN-W3','HG明朝E','ＭＳ Ｐ明朝','MS PMincho','MS 明朝',serif;
	font-weight:normal;
}

/* ============================================================
	
	10, #footerOuter  
	
	============================================================ */

#footerOuter {
	width:100%;
	border-top:1px solid #D7D7D7;
}

/* ============================================================
	
	11, #footerTP --- breadcrumb
	
	============================================================ */

#footerTP {
	width:100%;
	padding:20px 0;
	
	border-bottom:1px solid #D7D7D7;
}

/* ============================================================
	
	12, #footer
	
	============================================================ */

#footer {
	width:980px;
	margin:40px auto 0;
	overflow:hidden;
}

/* --------------------------------------------------------------------
  #footerShopList
----------------------------------------------------------------------- */

#footerShopList > ul {
	width:650px;
	overflow:hidden;
	margin:0 auto 30px;
}

/* #footerShopList .fsl -------  */

#footerShopList .fsl {
	width:290px;
	float:left;
	padding-right:27px;
	margin-right:27px;
	border-right:1px dotted #DCDCDC;
}

#footerShopList .fsl:nth-child(even) {
	padding-right:0;
	margin-right:0;
	border-right:none;
}

.fsl p.fslImg { margin-bottom:20px; }

.fsl h1 {
	font-size:116%; /*15px*/
	margin-bottom:15px;
}

.fsl p.fslAddress {
	margin-bottom:20px;
	font-size:85%; /*11px*/
	line-height:1.8;
}

/* .fsl .shopCal .calMonth -------  */

.fsl .shopCal .calMonth {
	height:30px;
	line-height:30px;
	margin-bottom:10px;
	background:#E9E9E9;
}

.fsl .shopCal .calMonth div {
	font-weight:bold;
	text-align:center;
}

.fsl .shopCal .calMonth ul { position:relative; }

.fsl .shopCal .calMonth li {
	position: absolute;
	width:20px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

.fsl .shopCal .calMonth li.calPrev {
	top:-25px;
	left:5px;
	background:url(../img/bg_calmonth.gif) no-repeat 0 -20px;
}

.fsl .shopCal .calMonth li.calNext {
	top:-25px;
	right:5px;
	background:url(../img/bg_calmonth.gif) no-repeat -20px -20px;
}

.fsl .shopCal .calMonth a {
	display:block;
	width:100%;
	height:20px;
}

.fsl .shopCal .calMonth li.calPrev a { background:url(../img/bg_calmonth.gif) no-repeat 0 0; }
.fsl .shopCal .calMonth li.calNext a { background:url(../img/bg_calmonth.gif) no-repeat -20px 0; }

/* .fsl .shopCal .table -------  */

.fsl .shopCal table {
	width:252px;
	margin:0 auto 10px;
}

.fsl .shopCal th, .fsl .shopCal td {
	width:34px;
	height:33px;
	border-bottom:2px solid #fff;
	border-right:2px solid #fff;
	text-align:center;
	vertical-align:middle;
}

.fsl .shopCal td { background:#F6F6F6; }

.fsl .shopCal td.calHoliday {
	background:#E6A234;
	color:#FFF;
}

/* .fsl .shopCal p -------  */

.fsl .shopCal p {
	font-size:85%; /*11px*/
	text-align:right;
}

.fsl .shopCal span {
	background:url(../img/icon_holiday.gif) no-repeat left center;
	padding-left:15px;
}

/* 心斎橋閉店案内  */

.info_shopshin_close { width:650px; margin:0 auto 50px; }
.info_shopshin_close p { font-size:93%; /* 12px */ color:#e6a234; }


/* --------------------------------------------------------------------
  .btnShop
----------------------------------------------------------------------- */

.btnShop {
	width:650px;
	margin:0 auto 40px;
}

.btnShop a {
	display:block;
	width:100%;
	height:44px;
	line-height:44px;
	background:#412C14;
	font-size:93%; /*12px*/
	text-align:center;
	color:#fff;
}

.btnShop a:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
}

.btnShop span {
	padding-left:13px;
	background:url(../img/list_btnfsl.png) no-repeat left center;
}


/* --------------------------------------------------------------------
  #footerLogo
----------------------------------------------------------------------- */

#footerLogo {
	padding-top:40px;
	margin:40px 0 25px;
	border-top:1px solid #E6E6E6;
}

#footerLogo h1 {
	width:320px;
	margin:0 auto 40px;
}

#footerLogo h1 a {
	display:block;
	width:100%;
	height:50px;
	background:url(../img/logo.gif) no-repeat;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

#footerLogo h1 a {
	display:block;
	width:100%;
	height:50px;
	background:url(../img/logo.gif) no-repeat;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

#footerLogo h2 {
	text-align:center;
	line-height:1.8;
	font-size:77%; /*10px*/
	font-weight:normal;
}

/* --------------------------------------------------------------------
  #footerNavi
----------------------------------------------------------------------- */

#footerNavi {
	margin-bottom:20px;
	padding:20px;
	overflow:hidden;
	background:#F7F7F7;
}

#footerNavi .FnaviCommon {
	float:left;
	padding-right:19px;
	border-right:1px dotted #DCDCDC;
	margin-right:20px;
}

#footerNavi .FnaviCommon li {
	float:left;
	font-size:93%; /*12px*/
	line-height:1.5;
}

/* .Fnavi01 -------  */

#footerNavi .Fnavi01 p { margin-bottom:20px; }

#footerNavi .Fnavi01 p a {
	display:block;
	height:38px;
	line-height:40px;
	background:#FFF;
	border:1px solid #CCC;
	text-align:center;
	font-size:93%; /*12px*/
}

#footerNavi .Fnavi01 p a:hover {
	border:1px solid #E6A234;
	background-color:#FFF9F0;
}

#footerNavi .Fnavi01 p a span {
	padding-left:20px;
	background:url(../img/icon_circlearrow.gif) no-repeat left center;
}

#footerNavi .Fnavi01 { width:240px; }

#footerNavi .Fnavi01 ul {
	margin:0 -5px -10px 0;
	overflow:hidden;
}

#footerNavi .Fnavi01 li {
	width:100px;
	padding-left:15px;
	margin:0 5px 10px 0;
	background:url(../img/list_circle.png) no-repeat left 4px;
}

/* .Fnavi02 -------  */

#footerNavi .Fnavi02 {width:425px;}
#footerNavi .Fnavi02 ul {
	margin:0 -5px -20px 0;
	overflow:hidden;
}

#footerNavi .Fnavi02 li {
	width:200px;
	margin:0 5px 20px 0;
	padding-left:10px;
	background:url(../img/list_triangle.png) no-repeat left 6px;
}

/* .Fnavi03 -------  */

#footerNavi .Fnavi03 {
	width:195px;
	position:relative;
	padding-right:0;
	border-right:none;
	margin-right:0;
}

#footerNavi .language {
	position:absolute;
	top:5px;
	right:0;
}

#footerNavi .Fnavi03 .sns {
	width:100%;
	overflow:hidden;
	padding-bottom:20px;
}

#footerNavi .Fnavi03 .sns a {
	float:left;
	display:block;
	width:22px;
	height:22px;
	margin-right:10px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

#footerNavi .Fnavi03 .sns a.iconFacebook { background:url(../img/icon_facebook.png) no-repeat; }
#footerNavi .Fnavi03 .sns a.iconTwitter { background:url(../img/icon_twitter.png) no-repeat; }

#footerNavi .Fnavi03 ul {
	margin:0 -5px -10px 0;
	overflow:hidden;
	padding-bottom:20px;
}

#footerNavi .Fnavi03 li {
	width:85px;
	padding-left:10px;
	margin:0 5px 10px 0;
	background:url(../img/list_triangle.png) no-repeat left 6px;
}

#footerNavi .Fnavi03 p {
	padding:10px 0 0 10px;
	border-top:1px dotted #DCDCDC;
	background:url(../img/list_triangle.png) no-repeat left 15px;
	font-size:93%; /*12px*/
}

/* --------------------------------------------------------------------
  #relevanceSites
----------------------------------------------------------------------- */

#relevanceSites {
	width:650px;
	overflow:hidden;
	margin:0 auto 40px;
}

#relevanceSites h1 {
	font-size:77%; /*11px*/
	margin-bottom:30px;
	text-align:center;
	font-weight:normal;
}

#relevanceSites ul {
	width:660px;
	margin-right:-10px;
}

#relevanceSites li {
	width:320px;
	float:left;
	margin-right:10px;
}

#relevanceSites li a {
	display:block;
	height:43px;
	line-height:45px;
	text-align:center;
	border:1px solid #F0F0F0;
}

#relevanceSites li a:hover {
	border:1px solid #E6A234;
	background-color:#FFF9F0;
}

#relevanceSites li a span {
	padding-right:15px;
	background:url(../img/icon_brank.png) no-repeat right center;
}

/* ========================================================================
	
	13, #cp --- copyright
	
	============================================================ */
   
#cpOuter {
	width:100%;
	min-width:980px;
	height:60px;
	background:#231815;
}

#cp {
	width:980px;
	overflow:hidden;
	margin:0 auto;
}

#cpLeft {
	width:300px;
	float:left;
	color:#FFF;
	font-size:77%; /*10px*/
	line-height:60px;
}
#cpLeft2 {
	width:300px;
	float:left;
	color:#FFF;
	height: 0px;
    margin-top: 15px;
}
#pageTop {
	width:120px;
	float:right;
}

#pageTop a {
	display:block;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	width:120px;
	height:60px;
	background:url(../img/btn_pagetop.gif) no-repeat 0 0;
	position: relative;
}

#pageTop a:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
}
