@charset "UTF-8";

@import "./base.css";

/* ================================================================================== 
★　CSS インフォーメーション　★
☆　血液事業を知ろう　トップページ関連　☆

■１．説明文
■２．上部メニューエリア
　●２-１　レイアウト
　●２-２　血液・輸血について知りたい
		●２-３　献血をしたい
		●２-４　献血を体験した方の声
		●２-５　イベント情報
		●２-６　献血にご協力いただいた後は・・・
		●２-７　モバイルサイトのご案内

===================================================================================== 

■１．説明文

================================================================================== */
#blood-index-txt{
	margin:15px auto 0;
	width:855px;
	font-size:1.2em;
}

#blood-index-care{
	margin:10px auto;
	width:854px;
	text-align:right;
}

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

■２．上部メニューエリア
　●２-１　レイアウト
　●２-２　安全対策のご紹介
		●２-３　メニューリスト

===================================================================================== 

　●２-１　上部タイトル

================================================================================== */
#blood-index-sttl{
	margin:0 auto;
	width: 854px;
	overflow: hidden;
	_zoom: 1; 
}

#blood-index-sttl h2{
	float:left;
	width:288px;
}

#blood-index-sttl h2.blood-index-sttEnd{
	width:278px;
}

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

　●２-２　上部メニューレイアウト

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

#blood-index-menu{
	width:844px;
	margin:10px auto;
	font-size:1.2em;
	line-height:1.6em;
	background:url(../blood/img/blood_index_ctg_bg01.gif) repeat-y left;
}

#blood-index-menuEnd{
	background:url(../blood/img/blood_index_ctg_bg01_end.gif) no-repeat left bottom;
}

#blood-index-menuR{
	float:right;
	width:556px;
	background:url(../blood/img/blood_index_ctg_bg02.gif) repeat-y;
}

#blood-index-menuR-end{
	padding:0 0 5px;
	background:url(../blood/img/blood_index_ctg_bg02_end.gif) no-repeat bottom;
}

#blood-index-menuRR{
	float:right;
	margin:10px 0 0;
	width:556px;
	background:url(../blood/img/blood_index_ctg_bg01.gif) repeat-y left;
}

#blood-index-menuRR-end{
	padding:0 0 5px;
	background:url(../blood/img/blood_index_ctg_bg01_end.gif) no-repeat left bottom;
}

#blood-index-menuRRR{
	float:right;
	margin:10px 0 0;
	width:556px;
}


.blood-index-menuL{
	float:left;
	width:268px;
}

.blood-index-menuR{
	float:right;
	width:268px;
}



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

　●２-３　メニューリスト

================================================================================== */
#blood-index-menu dl{
	padding:0 0 3px;
}

#blood-index-menu dd{
	padding:6px 8px 0 12px;
}

#blood-index-menu dd a{
	display:-moz-inline-box;
	display:inline-block;
	/display:inline;
	/zoom:1;
	padding:0 0 0 15px;
	background:url(../blood/img/icon_arrow01.gif) no-repeat 0 3px;
	color:#555;
	text-decoration:none;
}

.ff2 #blood-index-menu dd a{
	background:url(../blood/img/icon_arrow01.gif) no-repeat 0 0;
}

#blood-index-menu dd.blood-index-cross{
	padding:6px 8px 6px 12px;
	border-bottom:1px dotted #c9c9c9;
}

#blood-index-menu dd a:hover{
	color:#ffad52;
}

#blood-index-menu dd img{
	margin-left:5px;
	vertical-align:middle;
}

#blood-index-menu dd ul{
	padding:0 8px 0 16px;
}

#blood-index-menu dd ul li a{
	padding:0 0 0 12px;
	background:url(../blood/img/icon_arrow04.gif) no-repeat 0 3px;
}

.ff2 #blood-index-menu dd ul li a{
	background:url(../blood/img/icon_arrow04.gif) no-repeat 0 3px;
}



#blood-index-menu dl.blood-index-nolist{
	margin:8px auto 10px;
	width:268px;
	padding:0;
	background:none;
}



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

■３．下部メニューエリア
　●３-１　タイトル
		●３-２　メニューレイアウト
		●３-３　メニューリスト
		●３-４　献血にご協力いただいた後は・・・
		●３-５　モバイルサイトのご案内

===================================================================================== 

　●３-１　タイトル

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

h2#blood-index-sttl02{
	width:854px;
	margin:10px auto;
}

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

　●３-２　メニューレイアウト

================================================================================== */
#blood-index-menu02{
	width:844px;
	margin:10px auto;
	font-size:1.2em;
	line-height:1.6em;
	background:url(../blood/img/blood_index_ctg_bg03.gif) repeat-y left;
}

#blood-index-menu02-end{
	background:url(../blood/img/blood_index_ctg_bg03_end.gif) no-repeat left bottom;
}

#blood-index-menu02-end div{
	float:left;
	width:288px;
	text-align:left;
}

#blood-index-menu02-end div.blood-index-listEnd{
	width:268px;
}

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

　●３-３　メニューリスト

================================================================================== */
#blood-index-menu02 dl{
	margin:0;
	padding:0 0 5px;
	width:268px;
}

#blood-index-menu02 dd{
	padding:6px 8px 0 12px;
}

#blood-index-menu02 dd a{
	padding:0 0 0 15px;
	background:url(../blood/img/icon_arrow01.gif) no-repeat 0 0;
	color:#555;
	text-decoration:none;
}

#blood-index-menu02 dd.blood-index-cross{
	padding:6px 8px 6px 12px;
	border-bottom:1px dotted #c9c9c9;
}

#blood-index-menu02 dd a:hover{
	color:#ffad52;
}

#blood-index-menu02 dd img{
	margin-left:5px;
	vertical-align:middle;
}

#blood-index-menu02 dd ul{
	padding:0 8px 0 16px;
}

#blood-index-menu02 dd ul li a{
	padding:0 0 0 12px;
	background:url(../blood/img/icon_arrow04.gif) no-repeat 0 3px;
}


#blood-index-menu02 dl.blood-index-nolist{
	margin:8px auto 10px;
	width:268px;
	padding:0;
	background:none;
}


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

　●３-４　献血にご協力いただいた後は・・・

================================================================================== */
#blood-indexEnd.blood-index-other{
	width:854px;
	margin:10px auto 30px;
	font-size:1.2em;
}

.blood-index-otherL{
	float:left;
	width:562px;
}

.blood-index-otherR{
	float:right;
	width:278px;
}

#blood-index-after{
	margin:10px auto;
	width:556px;
}

#blood-index-after p{
	float:left;
}

#blood-index-after dl{
	float:right;
	width:420px;
}

#blood-index-after dt img{
	margin:0 0 6px;
}

#blood-index-after dd.blood-index-afterBtn{
	text-align:right;
	padding:8px 0 0;
}

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

　●３-５　モバイルサイトのご案内

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

.blood-index-mobile{
	padding:8px;
	border:1px solid #dcdcdc;
	border-top:none;
}

.blood-index-mobile dt{
	float:right;
}

.blood-index-mobile dt img{
	margin:10px 0;
}

.blood-index-mobile dd{
	float:left;
	width:190px;
	line-height:1.7em;
}

.blood-index-mobile dd a{
	display:-moz-inline-box;
	display:inline-block;
	/display:inline;
	/zoom:1;
	padding:10px 0 0;
	color:#f71113;
}

.blood-index-mobile dd a:hover{
	color:#0099ff;
}