@charset "UTF-8";

/* ---------------------------------------------------------------------

TITLE   : nikkansports.com CSS
DATE    : 2008/08/22
URL     : http://www.nikkansports.com/race/kka/furusato/fukui/css/miniRouteNavi-style.css
AUTHOR  : nikkansports.com

--------------------------------------------------------------------- */


/* HTML Sample Code -----------------------------------------

<!-- +++++ パンくずナビ +++++ -->
<div id="routeNavi">
<ol>
<li><a href="http://www.nikkansports.com/" title="ニッカンスポーツ・コムホーム"><img src="/img/mini-root-navi_home2_off.gif" alt="ニッカンスポーツ・コムホーム" width="52" height="23" /></a></li>
<li><span class="next2"><a href="/race/top-race.html">競馬</a></span></li>
<li><span><a href="/race/kka/top-kka.html">競輪・競艇・オート</a></span></li>
<li id="mainCut"><h1><span><a href="/race/kka/furusato/fukui/top-fukui.html" title="ふるさとダービー福井">ふるさとダービー福井</a></span></h1></li>
</ol>
</div>
<!-- /+++++ パンくずナビ +++++ -->

最後の li の構造だけ注意してください。li に id、h1 span a など構造が普段と違います。
最初の【HOME】画像はhtmlにimgタグで書き込んでいるので、そこの変更は忘れずに。（ピクセルサイズが違います）
mainCut の a には title 属性をつけるのを推奨しまふ。

--------------------------------------------------------------------- */



/* Mini Route Navigation
------------------------------------------------------- */
#routeNavi {
	color: #003e73;
	background: url(/img/mini-root-nav_bg.gif) repeat-x top left;
	height: 82px; /* miniRouteNaviの高さ＋mainCutの高さ */
}

#routeNavi a {
	color: #000000;
	font-weight: normal;
}

#routeNavi ol {
	padding: 0;
	background: none;
	height: 23px;
}

#routeNavi li {
	font-size: 80%;
	font-weight: bold;
	background: url(/img/mini-root-navi_next_bg.gif) repeat-x top;
	height: 23px;
	float: left;
}

#routeNavi li span {
/*	padding-left: 4px;
	padding-right: 25px;*/
	background: url(/img/mini-root-navi_next.gif) no-repeat right top;
	display: block;
	height: 23px;
	line-height: 1.8; /* 元のrouteNaviの指定を上書き */
	float: left;
}

/* for Safari */
html* #routeNavi li span { line-height: 1.9; }

/* for WinIE7 */
*+html #routeNavi li span { line-height: 1.85; }

/* for Win & Mac IE */
*html #routeNavi li span { line-height: 1.8; }

#routeNavi li span.next2 { background: url(/img/mini-root-navi_next2.gif) no-repeat right top; }




/* Main Cut Style
------------------------------------------------------- */
#routeNavi li#mainCut { /* 通常のパンくずでは li の直接の子要素にセレクタをつけるが、miniでは li につける */
	clear: both;
	float: left;
	padding: 0;
	width: 100%;
	height: 59px; /* 高さを明示しないとSafariで表示が狂う */
	background: url(/baseball/kiyohara/img/kiyohara-title_bg.jpg) repeat-x left top #020502;
}

#routeNavi li#mainCut h1,
#routeNavi li#mainCut strong { /* トップページはh1、それ以外のページはstrongタグを使う */
	display: block;
	padding: 0;
	border-left: 1px solid #e5e5e5;
	width: 100%;
	height: 59px; /* display:block; した場合は高さを明示しないと背景画像が出てこない */
	background: url(/baseball/kiyohara/img/kiyohara-title_rt.jpg) no-repeat right top;
}

#routeNavi li#mainCut span { /* 背景画像を重ねたい場合は li>h1>span>a とコーディングする */
	display: block;
	margin-top: 13px;
	padding: 0;
	width: 100%;
	height: 59px; /* display:block; した場合は高さを明示しないと背景画像が出てこない */
	background: url(/baseball/kiyohara/img/kiyohara-title_lt.png) no-repeat 4% 0%;
	text-indent: -9999px;
	overflow: hidden;
}

/* for WinIE */
*html #routeNavi li#mainCut span { margin-left: 10px; }

/* Hides from IE5-mac  \*/
	*html #routeNavi li#mainCut span { background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/baseball/kiyohara/img/kiyohara-title_lt.png',sizingMethod='crop'); }
/* End hide from IE5-mac */

#routeNavi li#mainCut a {
	display: block;
	padding: 0;
	width: 100%;
	height: 59px; /* 一応明示しておく */
	color: #ffffff;
	font-weight: bold;
	text-indent: -9999px;
	overflow: hidden;
}


body.furusatoDerby #themeNavi { clear: both; }




