@charset"shift_JIS";
a,.info,strong{font-weight:bold}
div div li,p,span{line-height:1.8em}
.cl,div div ul,h1{margin:0}
.bu,.cl,div div ul,div div li,h1,h2,.left,p,.setsu{padding:0}
.col,.col2,.col3,.col4{margin:10px 0 0 0; padding:10px 0 0}
body,.cen,div div,h2,.soubi p{text-align:center}
div div ul,.left,.soubi{text-align:left}

body{background:#FFF; margin-top:10px; color:#006;}
br.cl{clear:left}
/*料理道具以下のカテゴリーボックスをフロートさせないために、間に
かますclear:leftのためだけのbr。カテゴリーボックスのdiv自体に
clear:leftをきかせるとブラウザごとに解釈が違い、特にMacIEでレイアウトが
崩れてしまう*/
div{margin:0 auto; padding:30px 0 0; background:#fff; width:90%;}
/*  \*/*html div{padding:20px 0 0}/* */
/*「歩行時に役立つ道具」カテゴリー。なぜかheightに実数値を入れないと
div divがボックスからはみだすかたちになってしまう。このため
背景統一不可。またWinIEが他とpadding解釈が異なるためハック*/
	div div{width:210px; background:#FC9; float:left; 
		padding:15px 0 0; margin:10px 10px 0 0; height:240px}
		/*アイテムボックス。行数が合わないのでheightも固定*/
		div.col{height:155px; width:430px}/*「歩行時に役立つ道具」コラム*/
		div div a{letter-spacing:0.1em}
		/*なぜか半角文字が詰まるので文字間を開ける*/
		div div img{display:block; height:150px; width:150px; 
			border:1px solid #000; margin:0 auto}
		img.slim{width:120px}/*幅が広がりすぎる画像を補正*/
		img.wide{width:180px}/*幅がせますぎる画像を補正*/
		img.air{height:70px; width:180px; margin:40px auto 50px}
		/*  \*/*html img.air{margin:55px auto 50px}/* */
		/*エアマット画像用特別設定。WinIEが他とmargin解釈が
		異なるためハック*/
		div div p{line-height:1.3em; font-size:16px; margin:10px 0 0 0}
		/*改行してはいけないのでfont-sizeを固定*/
		div div ul{}/*初期化*/
		div div li{list-style:square; margin:10px 0 10px 40px; 
			font-size:16px}
		h2{font-size:20px; margin:0 auto 10px; width:225px;
			border-left:20px solid #fc6; border-right:20px solid #fc6;}
		/*小見出し「歩行時に役立つ道具」。なぜかwidthを入れないと
		中央寄せにならない。また、左右マージンをautoにしないとWinIE以外で
		中央寄せにならない。改行してはいけないのでfont-sizeを固定。
		またm,p初期化*/
div.cook{}
/*「料理道具」カテゴリー。divをひとつなぎにするとフロートがうまく
いかない＆クラス作成が面倒なため、カテゴリーごとに分割。*/
	.cook div{background:#FCC;}
	.cook h2{width:350px; border-left:20px solid #F6C; 
		border-right:20px solid  #F6C;}
	div.col2{height:80px; width:210px}/*「料理道具」コラム*/
div.emerge{}/*「非常時に役立つ道具」カテゴリー*/
	.emerge div{background:#ff8}
	.emerge h2{border-left:20px solid #FF0; border-right:20px solid #FF0}
	div.col3{height:135px; width:430px}/*「非常時に役立つ道具」コラム*/
div.gara{}/*「がらくた箱」カテゴリー*/
	.gara div{background:#CCC; height:220px}
	.gara h2{border-left:20px solid #999; border-right:20px solid #999;
		width:140px}
div.jun{padding:30px 0 0}/*「登山準備で使う道具」カテゴリー*/
	.jun div{background: #6F6}
	.jun h2{border-left:20px solid #390; border-right:20px solid #390;}
	div.col4{height:90px; width:360px}/*「登山準備で使う道具」コラム*/
div.left{margin:0 2.5% 20px; width:95%;}
/*最初の説明を左寄せにするためだけのdiv。なおリキッドデザインでは
margin+padding+width=100%にしなければならない。また、padding初期化*/
div.log{}/*「登山後の記録に使う道具」カテゴリー*/
	.log div{background: #6F9}
	.log h2{border-left:20px solid #6CF; border-right:20px solid #6CF;
		width:270px}
div.soubi{width:90%;}
/*「個人装備」カテゴリー。divでくくって上paddingを設定しないと、
上のカテゴリーとの間隔があかない*/
	.soubi p{float:left; padding:10px; border:2px ridge #FFF; 
		width:370px; font-size:18px; margin:0 10px 10px 0}
	/*装備リスト。MacIEでtext-align:centerがきかないため、あえて
	左右paddingを設定*/
	p.setsu{float:none; font-size:16px; border:none; margin:0 0 10px;}
	/*装備リストの説明。.soubi p打ち消し。width:autoにすると中央寄せ
	になるが、幅が縮んだ時にレイアウトが崩れるのであえてしない*/
h1{font-size:30px;}/*大見出し。padding初期化*/
hr{width:100%; height: 2px; background:#CCC; width:95%;}
img{vertical-align:middle;}
img.m-r{margin-right:1em;}/*大見出し・パンくずリストの行頭画像*/
p{margin:1em 0 0 0;}/*初期化*/
p.info{clear:left; padding:40px 0 0 0; color:#930;}
/*情報提供呼びかけ文*/
span{font-size:medium}
ul{line-height:2em; margin-right: 35px;}
ul.bu{margin:30px 0 0;}/*ナビゲーションメニューボタン*/
	.bu li{list-style:none; display:inline;}
	.bu a,.bu a:link,.bu a:visited{text-decoration:none; color:#FFF; 
	background:#F93; padding:5px 10px; position:relative;
	border:1px outset #fff}
	/*:linkと:visitedを書かないとcolorが通常設定になる*/
	.bu a:hover{background:#FC0; top:2px; left:2px}

.mini{font-size:smaller}

a:link {color: #00C;}
a:visited {color: #800080;}