@charset "UTF-8";

/* ------------------------------------------------------------
  CONTENTS CSS
  最終更新日 : 2011-02-10
------------------------------------------------------------ */


/* Index Style
------------------------------------------------------------ */

.useClearBoth {
	clear: both;
	margin:0px;
	padding:0px;
}

.useIndex{
	width:620px;
}
.useIndexLeft{
	float:left;
	text-align:left;
	width:300px;
}
.useIndexRight{
	float:right;
	text-align:left;
	width:300px;
}
.useIndex p{
	margin:15px 0 10px 0;
}
.useIndex a{
	background: url(/j/syokuiku/zissen_navi/use/img/h4_index_arrow.gif) no-repeat Left 2px;
	padding:0 0 0 20px;
	zoom: 1;
}


/* Training Style
------------------------------------------------------------ */

h3.useTrainingH3 {
	padding:3px 3px 3px 10px;
	border-left:5px solid #cccccc;
	color:#000000;
	margin-bottom:20px;
}

.useTrainingTable {
	width:620px;
	background:#333333;
	margin:0px;
	padding:0px;
}
.useTrainingTable td {
	background:#ffffff;
	padding:5px;
}
.useTrainingTable th {
	text-align:center;
	padding:5px;
	font-weight:bold;
	color:#ffffff;
	background:#666666;
}
.useTrainingTable .orange {
	text-align:center;
	padding:5px;
	background:#F6DCAB;
}
.useTrainingTable .whitec {
	text-align:center;
	padding:5px;
	background:#ffffff;
}

.useTrainingTable .orangeAdd {
	text-align:center;
	font-weight:bold;
	padding:5px;
	background:#F6DCAB;
}
.useTrainingTable .whitecAdd {
	text-align:center;
	font-weight:bold;
	padding:5px;
	background:#ffffff;
}


/* Balance Style
------------------------------------------------------------ */

h4.useBalanceH4 {
	padding:3px 3px 3px 10px;
	border-left:5px solid #cccccc;
	color:#000000;
	margin-top:20px;
	margin-bottom:20px;
}

.useBalanceTable {
	width:620px;
	background:#333333;
	margin:0px;
	padding:0px;
}
.useBalanceTable td{
	text-align:center;
	background:#ffffff;
	padding:5px;
}
.useBalanceTable th{
	text-align:center;
	padding:5px;
	font-weight:bold;
	color:#ffffff;
	background:#666666;
}
.useBalanceTable .orange{
	text-align:left;
	padding:5px;
	background:#F6DCAB;
}

.useBalanceFrame {
	background: url(/j/syokuiku/zissen_navi/use/img/balance_frame_bg.gif) repeat-y;
	padding:0 20px 0 20px;
	zoom: 1;
}
.useBalanceFrame p{
	width:550px;
	padding:0 0 0 30px;
}


/* Rule Style
------------------------------------------------------------ */

.useRuleStep1 {
	padding-left:25px;
}

.useRuleFrame02 {
	width:620px;
	background: url(/j/syokuiku/zissen_navi/use/img/rule_frame02_bg.gif) repeat-y;
	padding:0 20px 0 20px;
}
.useRuleTable01 {
	width:620px;
	background:#333333;
	margin:0px;
	padding:0px;
}
.useRuleTable01 td{
	text-align:center;
	background:#ffffff;
	padding:5px;
}
.useRuleTable01 th{
	text-align:center;
	padding:5px;
	font-weight:bold;
	color:#ffffff;
	background:#666666;
}
.useRuleTable01 .orange{
	text-align:left;
	padding:5px;
	background:#F6DCAB;
}

.useRuleTable02 {
	width: 620px;
	background-color: #333333;
	table-layout: fixed;
}
.useRuleTable02 th {
	text-align: center;
	font-weight: normal;
	background: #ffffff;
	padding: 5px;
}
.useRuleTable02 td {
	text-align: center;
	background: #ffffff;
	padding: 5px;
}
.useRuleTable02 .td00 {
	text-alig :center;
	background: #ffffff;
	vertical-align: top;
}
.useRuleTable02 .td01 {
	background: #f6dcab;
}
.useRuleTable02 .td02 {
	background: #f9d0cb;
}
.useRuleTable02 .td03 {
	background: #d0e1c8;
}
.useRuleTable02 .td04 {
	border-top : solid 1px #666666;
}

.usePoint {
	border: solid 10px #eeeeee;
	background-color: #ffffff;
	padding: 19px 10px 10px 10px;
	margin-bottom: 30px;
}

.usePoint .title {
	background: url(/j/syokuiku/zissen_navi/use/img/point_line.gif) no-repeat left bottom;
	padding-bottom: 19px;
}

.usePoint .point li {
	background: url(/j/syokuiku/zissen_navi/use/img/point_line.gif) no-repeat left bottom;
	padding: 10px 0 11px 0;
}

.usePoint .point li img { vertical-align: bottom; }


/* Serving Style
------------------------------------------------------------ */

.useServingTable {
	background-color: #333333;
}

.useServingTable td { background-color: #ffffff; padding: 6px 5px 4px 5px; }
.useServingTable td.item0 { font-weight: bold; color: #ffffff; background-color: #666666; vertical-align: middle; }
.useServingTable td.item1 { font-weight: bold; color: #ffffff; background-color: #dea62b; vertical-align: middle; }
.useServingTable td.item2 { font-weight: bold; color: #ffffff; background-color: #7fa778; vertical-align: middle; }
.useServingTable td.item3 { font-weight: bold; color: #ffffff; background-color: #e9827f; vertical-align: middle; }
.useServingTable td.item4 { font-weight: bold; color: #ffffff; background-color: #a17e9f; vertical-align: middle; }
.useServingTable td.item5 { font-weight: bold; color: #ffffff; background-color: #529db8; vertical-align: middle; }
.useServingTable td.item6 { font-weight: bold; color: #ffffff; background-color: #0072bc; vertical-align: middle; }
.useServingTable td.item7 { font-weight: bold; color: #333333; background-color: #f6f6f6; vertical-align: middle; }
.useServingTable td.item8 { font-weight: bold; color: #ffffff; background-color: #444444; vertical-align: middle; }

.useServingTable td.bg1 { background-color: #f6dcab; }
.useServingTable td.bg2 { background-color: #d0e1c8; }
.useServingTable td.bg3 { background-color: #f9d0cb; }
.useServingTable td.bg4 { background-color: #decbdc; }
.useServingTable td.bg5 { background-color: #cde6f5; }
.useServingTable td.bg6 { background-color: #e0e9f6; }


/* Concept Style
------------------------------------------------------------ */

.useConceptImg {
	float:right;
	text-align:right;
	padding-left:20px;
}

.conceptFrame01 {
	width:620px;
	height:320px;
	background: url(/j/syokuiku/zissen_navi/use/img/concept_frame01bg.gif) no-repeat;
	padding:0 20px 0 20px;
	margin-bottom: 30px;
}
.conceptFrame02 {
	width:620px;
	height:180px;
	background: url(/j/syokuiku/zissen_navi/use/img/concept_frame02bg.gif) no-repeat;
	padding:0 20px 0 20px;
	margin-bottom: 30px;
}


/* SV Style
------------------------------------------------------------ */

}
.useSvText {
	float:left;
	text-align:left;
	padding-right:2px;
}

h4.useSvH4{
	padding:3px 3px 3px 10px;
	border-left:5px solid #cccccc;
	color:#000000;
	margin-bottom:10px;
}

.useSvTable01 {
	width:400px;
	background:#CCCCCC;
	margin:0px;
	padding:0px;
}
.useSvTable01 th {
	width:90px;
	background:#ECECEC;
	text-align:center;
	padding:5px;
	font-size:110%;
	font-weight:bold;
	border:1px solid #ffffff;
}
.useSvTable01 .th01 {
	width:90px;
	background:#DA9E29;
	text-align:center;
	padding:5px;
	color:#ffffff;
	font-size:110%;
	font-weight:bold;
	border:1px solid #ffffff;
}
.useSvTable01 .th02 {
	width:90px;
	background:#00B26B;
	text-align:center;
	padding:5px;
	color:#ffffff;
	font-size:110%;
	font-weight:bold;
	border:1px solid #ffffff;
}
.useSvTable01 .th03 {
	width:90px;
	background:#CA4D50;
	text-align:center;
	padding:5px;
	color:#ffffff;
	font-size:110%;
	font-weight:bold;
	border:1px solid #ffffff;
}
.useSvTable01 td {
	background:#ffffff;
	text-align:center;
	padding:5px;
}

.useSvNote { width: 600px; }
.useSvNote .deco { clear: both;  float: left; width:15px; }
.useSvNote .text { float: left; width:585px; }

.useSvFrame {
	width:580px;
	background:#EFEFEF;
	padding:20px;
}
.useSvFrame h4{
	color:#000000;
	font-size:110%;
	font-weight:bold;
	margin-bottom:10px;
}
.useSvFrame .graybox{
	float:left;
	text-align:center;
	background:#9A9A9A;
	width:100px;
	color:#ffffff;
	font-weight:bold;
	padding:2px 5px;
}
.useSvFrame .readbox{
	float:right;
	width:450px;
	padding:2px 0 2px 0;
}