@charset "UTF-8";

@import "./base.css";

/* ================================================================================== 
★　CSS インフォーメーション　★
☆　はじめての献血　献血体験者インタビュー関連　☆

■１．base.css追記
■２．タイトル
■３．インタビュー内容
		●３-１　レイアウト
		●３-２　画像
		●３-２　データ
■４．ページトップへ＆ページ分割

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

■１．base.css追記

================================================================================== */
#contentInR-2nd {
	font-size:1.2em;
}

#contentInL ul.left-nav li a{
	background:url(../first/img/icon_arrow01.gif) no-repeat left center;
}

#contentInL ul.left-nav li ul li a{
	background:url(../first/img/icon_arrow04.gif) no-repeat 2px 14px;
}

#contentInL ul.left-nav li a:hover{
	color:#55a91f;
}

#contentInL ul.left-nav li.now a{
	color:#55a91f;
}

#contentInL ul.left-nav li ul li.now a{
	color:#55a91f;
}

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

	■２．タイトル

================================================================================== */
#interview-ttl{
	position:relative;
	margin:10px auto 18px;
	width:660px;
	height:45px;
	background:url(../common_img/line_red_w.jpg) repeat-x bottom;
}

#interview-ttl p{
	position:absolute;
	right:0;
	top:7px;
}

#interview-ttl h2{
	margin:0;
}

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

	■３．インタビュー内容レイアウト
			●３-１　レイアウト
			●３-２　画像
			●３-２　データ
			
===================================================================================== 		

			●３-１　レイアウト

================================================================================== */
.interview-bg{
	width:650px;
	margin:10px auto;
	background:url(../first/img/interview_bg_in.gif) repeat-y;
}

.interview-bg-top{
	background:url(../first/img/interview_bg_top.gif) no-repeat top;
}

.interview-bg-end{
	padding:10px 15px;
	background:url(../first/img/interview_bg_end.gif) no-repeat bottom;
}

.interviewL{
	float:left;
	width:180px;
}

.interviewR{
	float:right;
	width:420px;
}

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

			●３-２　画像

================================================================================== */
/* 女性 画像背景*/
.interviewL p.female{
	text-align:center;
	background:#ffe5e5;
}

/* 男性 画像背景*/
.interviewL p.male{
	text-align:center;
	background:#d9effa;
}

.interviewL p img{
	margin:4px auto;
	border:1px solid #FFF;
}

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

			●３-２　データ

================================================================================== */
.interviewL dl{
	margin:10px auto 0;
	border-top:1px dotted #cecece;
	border-bottom:1px dotted #cecece;
}

.interviewL dt{
	padding:4px;
	background:#fafafa;
	color:#56addf;
	text-align:center;
	border:1px solid #FFF;
}

.interviewL dd{
	padding:4px;
	text-align:center;
	border-top:1px dotted #cecece;
}

.interviewL dl.time{
	margin:0 auto 15px;
	border-top:none;
	border-bottom:1px dotted #cecece;
}

.interviewL dl.time dt{
	display:-moz-inline-box;
	display:inline-block;
	/display:inline;
	/zoom:1;
	width:42%;
}

.interviewL dl.time dd{
	display:-moz-inline-box;
	display:inline-block;
	/display:inline;
	/zoom:1;
	width:44%;
	border-top:none;
}

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

			●３-３　質問と回答

================================================================================== */
.interviewR h3.interviewR-ttl{
	margin:5px 0 12px;
}

.interviewR h3{
	margin:15px 0 12px;
	padding:0 0 0 28px;
	background:url(../common_img/sttl_icon_heart.gif) no-repeat left center;
	color:#68b438;
	font-size:116.6%;
	font-weight:bolder;
}

.interviewR p{
	padding:0 3px 10px;
}

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

	■４．ページトップへ＆ページ分割

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

#contentInR-2nd p.pageTop-btn02{
	margin:10px 0 0;
	text-align:right;
}