/*　←【/（スラッシュ）】+【*（アスタリスク）】から【*（アスタリスク）】+【/（スラッシュ）】までは、
スタイルシート中で隠したいところにつかえ、メモなど書きたいときに使います。→　*/

body {
	margin: 0;	/*　ブラウザごとに、画面の4角に勝手にできる空白をなしに　*/

	padding: 0;	/*　ブラウザごとに、画面の4角に勝手にできる空白をなしに　*/
	}

h1, h2, h3, h4, h5, h6, p, address, ul, ol, li, dl, dt, dd, table, caption, th, td, img, form {
	border: none;	/*　画像【img】に勝手に枠が付くのをなしに　*/

	font-style: normal;	/*　【address】など、斜体で表示されるものを普通に　*/

	font-weight: normal;	/*　見出し【h1,h2,h3...】とか、勝手に太字になるのを普通の太さに　*/

	font-size: 100%;	/*　ブラウザごとに、見出し【h1,h2,h3...】を文章【p】よりも大きく表示するので、全て同じ大きさに　*/

	line-height: 1.4;	/*　行間の調節　*/

	list-style-type: none;	/*　リスト【ul,li】要素を使ったときの【・hoge〜】とか【●hoge〜】みたいに勝手に付く行頭のマークをなしに　*/

	margin: 0;	/*　ブラウザごとに各要素間の空白の大きさが違うので、いったんなしに　*/

	padding: 0;	/*　ブラウザごとに各要素間の空白の大きさが違うので、いったんなしに　*/

	text-align: left;	/*　ブラウザごとに、画面の4角に勝手にできる空白をなしに　*/
	}

img { vertical-align: bottom; }	/*　Internet Explorer 6 だけ？画像の下に勝手に余白ができるので、それをなしに　*/

/*↑↑============================================================================================

ここまでは、ブラウザ間の表示誤差をなくすために、ブラウザが持つ各要素をいったんリセットしてます。

絶対必要とか、上記の書き方でないとダメとかはないけど、

思い通りの表示にするには、先にやっておいた方があとあとラク。

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

h1, h2, h3, h4, h5, h6, p, address, li, dt, dd, caption, th, td {
	color: #472A2F;
	}

a {
	color: #472a2f;
	}

a:hover {
	color: #987046;
	text-decoration: none;
	}


/*============================================================
	↓↓ここから、【.clear】と【.clearfix】用設定=============*/

.clear {
	clear: both;
	}

.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
	}

.clearfix {
	display: inline-table;
	}

/* Hides from ie-mac \*/
* html .clearfix {
	height: 1%;
	}

.clearfix {
	display: block;
	}
/* End hide from ie-mac */

/*	↑↑ここまで、【.clear】と【.clearfix】用設定

	ここでの指定は、htmlの中で、【float】っていうので
	使って画像やら文章やらを左右に配置
	【float: left;】【float: right;】ってしたら、
	その次のブロックで【clear: both;】っていうのを指定して、
	【float】を解除せなあかんくて、
	わりとよく使うんで、クラスを作ってます。

	で、【float】をつかったあと、特に次に文章とか画像とかがないときに、
	【<div style="clear: both;"></div>】とかってすると、
	【<div></div>】ってボックス自体には何も入ってない、空の要素ができてまう。
	空の要素は、あっても表示に差し支えないねんけど、htmlが汚くなるし、無駄。
	なので、この【clearfix】ってクラスを作っておいて、
	【float】を含むボックスに【class="clearfix"】ってしていすると、
	その後に【clear】を入れずに済むから便利。
	
	例えば、
	
	○○○○と△△△△を並べて表示させたい場合、
	
	htmlに普通に

	<div>○○○○</div>
	<div>△△△△</div>
	
	ってすると、
	
	○○○○
	△△△△
	
	ってなるから、
	
	<div style="float: left;>○○○○</div>
	<div style="float: left;>△△△△</div>

	とかって指定して、続けて
	
	<div style="clear: both;"></div>
	
	ってしてもイイねんけど、

	<div class="clearfix">
		<div style="float: left;>○○○○</div>
		<div style="float: left;>△△△△</div>
	</div>

	↑こうすれば、無駄な要素がいらんてこと。
============================================================*/