﻿@charset "utf-8";

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

joomla 阪通様　Ｅコマースサイト

ナビゲーション関連の要素を記述

※ min-width設定アリ。
　ＩＥでは通常、コレらが効かない為、ライブラリを読み込んでいます。

　[minmax.js] http://www.doxdesk.com/software/js/minmax.html

--------------------
＊ヘッドナビ ul#gloNavi 
　サブカテゴリ ul#subCat

＊ヘッド右　ユーティリティナビ　ul#utilityNavi

＊フットナビ　ul.footNavi

＊コンテンツ内　タブナビ
　（検索トップの「店舗⇔オフィス」ナビ）


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


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

ヘッドナビ ul#gloNavi 

　ul#gloNavi li a 背景画像に左側角丸を、
　ul#gloNavi li a span　背景画像に右側角丸を含む長めのタブ画像（左角丸ナシ）
　・・・を「BG-Position右寄せ」で配置することで、擬似的な可変タブを実現。目からウロコ！
　【参考URL】
　　http://www.dezinerfolio.com/2007/10/17/creating-liquid-css-tabs-for-menus/

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

ul#gloNavi {
	margin:0 auto;
	padding:0;
	text-align:center;
	display:block;
}

/* IE6のみに適用 */
* html body ul#gloNavi {
	width:900px;
	margin-left:20pt;
}

ul#gloNavi li {
	margin:0;
	padding:0;
	display:inline;
	line-height:24px;
	font-size:12px;
	font-weight:bold;
	list-style-type:none;
}

/* li a 設定 */

ul#gloNavi li a{
	margin:0;
	padding:0 0px 0 5px;
	line-height:24px;
	/* BG指定。分離するとナゼだか効きません。ショートハンドで。 */
	background:url(../images/common/tabOFF_L.gif) no-repeat left top;
	text-decoration:none;
	color:#666;
	display:inline;
}

html>/**/body ul#gloNavi li a { /*IE6、7以外のモダンブラウザのみ適用*/
	height:10px;
	padding:10px 0px 6px 5px;
}


/* li a span 設定 */
ul#gloNavi li a span{
	margin:0;
	height:10px;
	padding:10px 20px 6px 15px;
	/* BG指定。分離するとナゼだか効きません。ショートハンドで。 */
	background:url(../images/common/tabOFF_BG_LONG.gif) no-repeat right top;
}

* html body ul#gloNavi li a span { /* IE6のみに適用させる */
	padding-top:2px;
	padding-bottom:0px;	
}

/* オンページ処理 */
ul#gloNavi li.active a {
	background-image:url(../images/common/tabON_L.jpg);
}
ul#gloNavi li.active a span{
	background:url(../images/common/tabON_BG_LONG.jpg) no-repeat right top;
}
ul#gloNavi li.active a{
	color:#FFFFFF;
}

/* ホバー処理 */
/*
ul#gloNavi li a:hover {
  background-image:url(../images/common/tabON_L.jpg);
}
ul#gloNavi li a:hover span{
  background:url(../images/common/tabON_BG_LONG.jpg) no-repeat right top;
}
ul#gloNavi li a:hover{
  color:#FFFFFF;
  cursor: hand;
}
*/

/*---------- 　サブカテゴリ ul#subCat ----------*/

ul#subCat{
	margin:0 auto;
	padding:0;
	text-align:center;
	min-width:950px;
	display:block;
	/* 	height:53px; */
	clear:both;
	overflow:auto;
}

ul#subCat li {
	margin:0 10px 0 0;
	display:inline;
	line-height:30px;
	font-weight:bold;
	background-image:url(../../images/common/gloNaviBG.jpg);
	background-repeat:no-repeat;
	list-style-type:none;
}

ul#subCat li a{
  word-wrap: normal;
		color:#333;
	text-decoration: none;
}


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

ヘッド右　ユーティリティナビ　ul#utilityNavi

li.toCart　カートを見る
li.toHelp　ヘルプ
li.toJoin　会員登録
li. toLogin　ログイン
============================== */

ul#utilityNavi {
	position:absolute;
	right:5px;
	top:0;
}

/* IE6のみに適用 */
* html body ul#utilityNavi{ top:10px; }
/*IE7のみに適用 */
*+html body ul#utilityNavi { top:10px; }


ul#utilityNavi li {
	margin:0 8px 0 0;
	padding:0;
	float:left;
	font-size:13px;
/*	background-image:url(../../images/common/gloNaviBG.jpg);
	background-repeat:no-repeat*/
	display:block;
	list-style-type:none;
	text-align:left;
}

ul#utilityNavi li a{
	color:#003399;
	text-decoration:underline;
}

ul#utilityNavi li a:hover{
	color:#EE2200;
	text-decoration:underline;
}

ul#utilityNavi li.toCart{ /* カートを見る */
	background-image:url(https://www.sakatsu.co.jp/images/common/utlyNavi_Cart.gif);
	background-repeat:no-repeat;
	padding-left:25px;
	background-position:0 2px;
}
ul#utilityNavi li.toHelp{ /* ヘルプを見る */
	background-image:url(../images/common/utlyNavi_Help.gif);
	background-repeat:no-repeat;
	padding-left:15px;
	background-position:0 2px;	
}
ul#utilityNavi li.toJoin{ /* 会員登録を見る */
	background-image:url(../images/common/utlyNavi_Join.gif);
	background-repeat:no-repeat;
	padding-left:15px;
	background-position:0 2px;
}
ul#utilityNavi li.toLogin{ /* ログインを見る */
	background-image:url(../images/common/utlyNavi_Login.gif);
	background-repeat:no-repeat;
	padding-left:13px;
	background-position:0 2px;
}

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

カテゴリナビ　sidebar1(左)

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

div.cateNavi ul {
	margin:0 -5px 0 -5px;
	padding:0;
}

div.cateNavi ul li {
	margin:0;
	padding:0;
	text-indent:20px;
	line-height:18px;
	background-image:url(../images/common/listDot01.gif);
	background-repeat:no-repeat;
	background-position:5px 3px;
	font-size:12px;
}

div.cateNavi ul li a{
	/*display:block;*/
	/*width:236px;*/
  /*width:196px;*/
	line-height:18px;
	color:#0000FF;
}

div.cateNavi ul li a:hover
/*div.cateNavi ul li.active*/ {
/*  display:block; */
	line-height:18px;
/*
	background-image:url(../images/common/listDot02.gif);
	background-repeat:no-repeat;
	background-position:5px 3px;
	background-color:#D7EAF9;
*/
	color:aqua;

}


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

フットナビ　ul.footNavi

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

ul.footNavi{
	margin:0 auto;
	width:60%;
	min-width:800px;
	padding:0;
	color:#666666;
/*
 for debag
	border:1px solid #F00;
*/
}

div#footer li{
	display:inline;
	list-style-type:none;
	padding:0 5px;
	border-left:1px solid #999999;

}

div#footer ul.footNavi li.listFirst {
	border-left:none;
}

ul.footNavi li a{
	color:#0000FF;
}
