@charset "UTF-8";

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

 使い方ミニ講座用

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

/* //////////////////////////////////////////////////////////////// common */



/* //////////////////////////////////////////////////////////////// index */

#course ul#courseList{
	margin-top:15px;
	margin-left:20px;
}

		#course ul#courseList li{
			background:url(img/line_style01.gif) repeat-x -5px bottom;
			padding-bottom:25px;
			margin-bottom:15px;
			padding-left:32px;
			width:293px;
			float:left;
		}
		
				#course ul#courseList li p.txt{
					font-size:100%;
					padding:8px;
					line-height:1.4;
				}



/* //////////////////////////////////////////////////////////////// course */

#course div#pageTitle{
	background:url(img/line_style01.gif) repeat-x -2px 51px;
}

		#course div#pageTitle p{
			margin-top:32px;
		}

#course div#copyArea{
	margin: 20px 20px 40px;
}

		#course div#copyArea #copy{
			margin-bottom:25px;
		}

		#course div#copyArea .fl,
		#course div#copyArea .fr{
			width:273px;
		}

		#course div#copyArea p{
			margin-bottom:10px;
		}
		
		#course div#copyArea p.txtStrong{
			font-weight:bold;
			color:#ff9800;
		}


#course div.stepBox{
	position:relative;
	border:2px solid #e4e4e4;
	padding:30px 30px 40px;
	width:554px;
	margin:35px auto 0;
	/* Do rounding (native in Firefox and Safari) */
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}

		#course div.stepBox h5{
			position:absolute;
			top:-15px;
			left:10px;
		}
		
		#course div.stepBox h6{
			margin-top:20px;
			 margin-bottom:15px;
		}
		
		body#home div.stepBox .line01{
			background:url(../../../common/css/img/bg_dotted01.gif) repeat-x top left;
			padding-top:20px;
			margin-top:20px;
		}

/*ステップ*/
#course div.stepCap{
	margin:5px 0 0 0;
}

	#course div.stepCap .fl{
		width:265px;
	}

	#course div.stepCap .fl p{
		margin-bottom:7px;
	}

	#course div.stepCap .fr{
		width:265px;
	}
	#course div.stepCap .fr p{
		margin-bottom:7px;
	}


/*おすすめ用紙*/
#course div.pickupBox{
	position:relative;
	background:#f5f5f5;
	margin-top:40px;
	padding:30px 0 0 20px;
}
	#course div.pickupBox h6{
		position:absolute;
		top:-35px;
		left:0;
	}
	
	/*1カラム*/
	#course div.pickupBox .column-1{ padding-bottom:20px; margin-right:20px;}
	#course div.pickupBox .column-1 .fl{ width:90px;}
	#course div.pickupBox .column-1 .fr{ width:420px; }
	
	/*2カラム*/
	#course div.pickupBox .column-2 .column-1{ width:240px; float:left; margin-right:20px;}
	#course div.pickupBox .column-2 .column-1 .fr{ width:150px; }


/*ラインナップ*/
.line02{
	background:url(img/line_style01.gif) repeat-x left top;
	margin-top:35px;
	margin-bottom:10px;
	padding-top:35px;
}

#course table.style02 th{
	padding:5px 10px;
	text-align:center;
	font-weight:bold;
	width:200px;
}
#course table.style02 td{
	padding:5px 0;
	text-align:center;
}


/*次へ／前へ*/
div#btnArea{
	background-color:#f1f1f1;
	margin-top:30px;
	padding:10px 20px;
}


/*バックナンバー*/
div#naviArea{
	margin-top:20px;
	padding:24px 0 19px;
	border:1px solid #e3ddcf;
	/* Do rounding (native in Firefox and Safari) */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}

		#course div#naviArea p#naviTitle{
			background:url(../../support/css/img/line_style02.gif) repeat-x left bottom;
			width:613px;
			margin:auto;
			padding-bottom:5px;
			padding-left:5px;
		}

		#course div#naviArea ul{
			width:650px;
			margin:auto;
			margin-top:15px;
		}

				#course div#naviArea ul li{
					width:278px;
					margin-left:16px;
					margin-right:16px;
					margin-bottom:5px;
					padding-left:10px;
					float:left;
				}
				
				
/*リストスタイル*/
#course ul.dotlist {}
#course ul.dotlist li {
	background:url(img/list_dot.gif) no-repeat;
	padding-left:15px;
	margin:0px 0px 10px 10px;
	line-height:1.5;
	}
	
#course .stepBox ul#templete_list {}	
#course .stepBox ul#templete_list li {
	margin-left:12px;
	float:left;
}	
	
#course .stepBox ul#templete_list li.ml0 {
	margin-left:0px !important;
	}
	
#course .txtgreen{
	color:#1ca600;
}

#course .txtred{
	color:#ff0000;
}
	
	
/*フォントのダウンロード*/
#course .fontdl {
	background-color:#e3f7fc;
	}

.p25 { padding:25px; }
.p20 { padding:20px; }
.w243 { width:243px; }

	#course div.stepCap .font_fl{
		width:238px;
		float:left;
	}

	#course div.stepCap .font_fl p{
		margin-bottom:7px;
	}

	#course div.stepCap .font_fr{
		width:238px;
		float:right;
	}
	#course div.stepCap .font_fr p{
		margin-bottom:7px;
	}

/*テーブル、右商品写真*/

#course .fl_table {
	width:497px;
	float:left;
	}

#course .fl_table table {
	width:497px;
}	
	
#course .fr_products {
	width:101px;
	float:right;
	}