@charset "utf-8";

/*
	サプリメントインデックス用スタイル
	
	このCSSファイルは以下のセクションに分類されています。
	
	・clearFix、画像置換、画像置換部分パス
	・個別スタイル
		
*/

/*
	フォントサイズ対応表（デフォルトでsmall（13px相当）に指定）
	
	80% = 10px
	90% = 12px
	100% = 13px
	110% = 14px
	120% = 16px
	140% = 18px
	
*/


/* *********************************************************************************************************/
/* clearFix、画像置換、画像置換部分パス ********************************************************************/
/* *********************************************************************************************************/

/* clearfix */
.blockGroup { position:relative;/* for DW */ }
.blockGroup:after { clear:both; height:0; visibility:hidden; display:block; content:"."; }

/* 画像置換 */
#main h2 { text-indent:-9999px; outline:none; background-position:left top; background-repeat:no-repeat; }

/* 画像置換部分パス */
#main h2 { background-image:url(/supply_index/img/txt_h2_index.gif); }






/* *********************************************************************************************************/
/* 個別スタイル ********************************************************************************************/
/* *********************************************************************************************************/

/* コンテンツ全体 */
#main { width:636px; float:left; }
#main h2 { width:636px; height:35px; margin-bottom:10px; }

	/* ピックアップコンテンツ */
	#pickup { margin:16px 0 22px; }
	#pickup .item01,
	#pickup .item02 { margin-right:9px; }
	
	/* 各セクション共通スタイル */
	.section { margin-bottom:20px; }
	.section h3 { position:relative; background-position:left top; background-repeat:no-repeat; height:34px; min-height:34px; padding:6px 30px 0; font-size:100%; }
	.section h3 .title { font-size:120%; }
	.section h3 .qAndA { margin:0; position:absolute; top:7px; right:25px; font-size:110%; }
	.blockGroup { width:636px; margin-bottom:9px; }
	.blockGroup .block { width:204px; border:1px solid #CCCCCC; float:left; margin-right:9px; }
	.blockGroup .last { margin-right:0; }
	.blockGroup h4 { padding:3px 10px; font-size:110%; background-position:left top; background-repeat:repeat-x; }
	.blockGroup p { margin:6px 10px; padding-bottom:10px; font-size:90%; border-bottom:1px solid #CCCCCC; min-height:50px; }
	.blockGroup ul { margin:8px 10px; font-size:90%; }
	.blockGroup ul li { margin-bottom:3px; }
	
	/* 目的別インデックス 体調編 */
	#purposeIndexHealth h3 { background-image:url(/supply_index/img/bg_h3_01.gif); }
	#purposeIndexHealth h4 { background-image:url(/supply_index/img/bg_h4_01.gif); }
	
	/* 目的別インデックス 美容・生活習慣編 */
	#purposeIndexBeauty h3 { background-image:url(/supply_index/img/bg_h3_02.gif); }
	#purposeIndexBeauty h4 { background-image:url(/supply_index/img/bg_h4_02.gif); }
	
	/* 目的別インデックス 病気編 */
	#purposeIndexSick h3 { background-image:url(/supply_index/img/bg_h3_03.gif); }
	#purposeIndexSick h4 { background-image:url(/supply_index/img/bg_h4_03.gif); }
	
	/* 成分別インデックス */
	#elementIndex h3 { background-image:url(/supply_index/img/bg_h3_04.gif); }
	#elementIndex h4.vitamin { background-image:url(/supply_index/img/bg_h4_04.gif); }
	#elementIndex h4.mineral { background-image:url(/supply_index/img/bg_h4_05.gif); }
	#elementIndex h4.other { background-image:url(/supply_index/img/bg_h4_06.gif); }