@charset "utf-8";

/* Note
==============================*/
.note{
}
.note dt{
	color: #000000;
}
.note ul{
	margin: 0;
	list-style: none;
}
.note .marker{
	display: block;
	float: left;
	width: 1.5em;
	_display: inline;
	_float: none;
}
.note li{
	text-indent: -1.5em;
	padding-left: 1.5em;
}

.note .noNum .marker{
	display: block;
	float: left;
	width: 0.5em;
	_display: inline;
	_float: none;
}
.note li.noNum{
	text-indent: -0.5em;
	padding-left: 0.5em;
}

.note dl dt{
	color: #444444;
	font-weight: normal;
}
.note dl dd{
	margin-left: 3.5em;
}
.note.material_int{
	margin:0 0 0 22px;
}
.borderedNote{
	padding: 5px 10px;
	background-color: #f5f5f5;
	border: 1px solid #cccccc;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

}

.strongNote{
	padding: 5px 10px;
	background-color: #ffe9e9;
	border: 1px solid #e6cfcf;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

}
.strongNote dt{
	color: #9a1100;
}

.note_indent dd{
	margin:0 0 10px 27px ;
}


/* Columns
==============================*/

.noteColumnA{
	margin-top: 20px;
	padding: 9px;
	background-color: #f5f5f5;
	border: 1px solid #cccccc;
}

.noteColumnA .columnHeading{
	font-weight: bold;
}

.noteColumnA.pointColumn{
	background-color: #fff4e5;
	border: 1px solid #ffca7f;
}

.noteColumnA.monitorColumn{
	background-color: #f7feed;
	border: 1px solid #c1d2a7;
}

.noteColumnA ul{
	margin-bottom: 0;
}

.recipeList .noteColumnA{
	margin-top: 9px;
}
.recipeList .noteColumnA ul {
	list-style-type: disc;
}

.noteColumnB{
	margin-top: 20px;
	border: 1px solid #cccccc;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
.noteColumnB .columnHeading{
	padding: 5px 10px;
	background-color: #f5f5f5;
	-webkit-top-border-left-radius: 4px;
	-webkit-top-border-right-radius: 4px;
	-moz-border-radius: 4px 4px 0 0;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-bottom: 1px solid #cccccc;
}

.noteColumnB .columnContent {
	margin: 8px 14px;
}

/* alertColumn
==============================*/
.alertColumn {
	padding-top: 8px;
	background-color: #ffe9e9;
}
.alertHeading {
	margin-bottom: 6px;
	color: #993333;
	text-align: center;
}
.span_30 .alertColumn .section {
	padding: 0 12px 8px;
}

.span_30 .alertColumn {
	background: url(../img/components/alertColumn_bg_01.gif) left top no-repeat;
}
.span_30 .alertColumn .section {
	background: url(../img/components/alertColumn_bg_02.gif) left bottom no-repeat;
}



/* List
==============================*/
.normalList{
	margin: 8px 0 0;
	padding: 0 0 8px;
}
.normalList dt{
	float: left;
	clear: left;
	width: 8em;
	margin: 0;
	padding: 0;
	font-weight: normal;
	+zoom: 1;
}
.normalList dd{
	display: block;
	margin: 0 0 0 8em;
	padding: 0;
	+zoom: 1;
	+padding-bottom: 7px;
	_height: 1.2em;
}

/* Sphone notice
==============================*/
.sp_note a,.sp_note a:visited,.sp_note a:active{
	color:#fff;
	width:960px;
	border-color:#ccc;
	border-style:solid;
	border-width:1px;
	background-color:#fea220;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fea220), to(#e08302)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #fea220, #e08302); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(top, #fea220, #e08302); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #fea220, #e08302); /* IE10 */
	background-image:      -o-linear-gradient(top, #fea220, #e08302); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #fea220, #e08302);
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	-webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset, 0 5px 3px #666666; /* Safari, Chrome用 */
	-moz-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset, 0 5px 3px #666666; /* Firefox用 */
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset, 0 5px 3px #666666;
	font-size: 320%;
	font-weight: bold;
	margin: 20px auto 30px;
	padding: 45px 0;
	text-align:center;
	display:block;
	outline:0;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.sp_note a:hover{
	text-decoration:none;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#e08302), to(#fea220)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #e08302, #fea220); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(top, #e08302, #fea220); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #e08302, #fea220); /* IE10 */
	background-image:      -o-linear-gradient(top, #e08302, #fea220); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #e08302, #fea220);
	outline:0;
}

/* clearfix
==============================*/
.note ul{
	+zoom: 1;
}
.note ul:after{
	content : '';
	display : block;
	clear : both;
}