/******************************************************************************
 *	ドキュメント構造定義
 ******************************************************************************/
@media screen and (max-width:500px){
	body {
		margin: 0;
	}

	div#PageHeader{
		height:72px;
	}

	div#Banner{
		font-size: 200%;
	}

	div#MainArea{
	}

	div#MenuArea{
	}

	div#MenuTitle{
		display:none;
	}

	ul#MainMenu{
		display:table;
	}

	ul#MainMenu > li{
		display: table-cell;
		text-align: center;
		font-family: sans-serif;
	}

	/* ページ本文 */
	div#PageContents{
	}
}
@media screen and (min-width:501px) and (max-width: 767px){
	body {
		margin: 0;
	}

	div#PageHeader{
		height:120px;
	}

	div#Banner{
		font-size: 300%;
	}

	div#MainArea{
		display: table;
		table-layout: fixed;
	}

	div#MenuArea{
		display:table-cell;
		vertical-align: top;
		width:20%;
	}

	div#MenuTitle{
		display:block;
	}

	ul#MainMenu > li{
	}
	ul#MainMenu > li.Selected:after{
		content: ">";
		position: absolute;
		right: 0.5em;
	}

	/* ページ本文 */
	div#PageContents{
		display: table-cell;
	}
}
@media screen and (min-width: 768px){
	div#PageHeader{
		height:120px;
	}

	div#Banner{
		font-size: 300%;
	}

	div#MainArea{
		display: table;
		table-layout: fixed;
	}

	div#MenuArea{
		display:table-cell;
		vertical-align: top;
		width:20%;
	}

	div#MenuTitle{
		display: block;
		font-size: 1.5em;
	}

	ul#MainMenu > li{
	}
	ul#MainMenu > li.Selected:after{
		content: ">";
		position: absolute;
		right: 0.5em;
	}

	/* ページ本文 */
	div#PageContents{
		display: table-cell;
	}
}

body {
	background-image: url(./Imgs/white0054r.png);
	background-repeat:repeat-y;
	background-attachment: scroll;
	background-size: cover;
}

/* 全体 */
div#PageArea{
	max-width: 800px;
	position:relative;
}

/* ページヘッダ*/
div#PageHeader{
	position: relative;
	border-bottom: solid lightgray 1px;
	margin-bottom: 1em;
	background-image: url("Imgs/BannerButterflyTop.png");
	background-size: 60%;
	background-repeat: no-repeat;
}

div#Banner{
	position: absolute;
	bottom: 0;
	left:40%;
	text-align: center;
	width: auto;
}

/* メインエリア */
div#MainArea{
	position: relative;
	width:100%;
}

/* メニュー */
div#MenuArea{
	position:relative;
	vertical-align: top;
}

div#MenuTitle{
	position: relative;
	vertical-align: top;
}

ul#MainMenu{
	position: relative;
	padding:0;
	margin:0;
	width:100%;
}

ul#MainMenu > li{
	list-style-type: none;
	margin:0;
	padding: 1px 0.5em;
	text-align: left;
	font-family: sans-serif;
}
ul#MainMenu > li.Selected{
	color: gray;
	background-color: rgba(255,255,255,0.25);
}
ul#MainMenu > li.Unselected{
}
ul#MainMenu > li.Unselected:hover{
	color: darkgray;
}
ul#MainMenu > li.Spacer{
	color:black;
}

ul#MainMenu > li > a{
	text-decoration:none;
}
ul#MainMenu > li.Selected > a:visited {
	color: inherit;
}
ul#MainMenu > li.Selected > a:link {
	color: inherit;
}
ul#MainMenu > li.Unselected > a:visited {
	color: inherit;
}
ul#MainMenu > li.Unselected > a:link {
	color: inherit;
}

/* ページ本文 */
div#PageContents{
	position:relative;
}

/* ページフッタ */
div#PageFooter{
	position: relative;
	text-align: right;
	color: black;
	border-top: solid lightgray 1px;
}

div#PageFooter a{
	text-decoration:none;
}
div#PageFooter a:visited {
	color: inherit;
}
div#PageFooter a:link {
	color: inherit;
}

/** ヘッディング */
h1{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 2px;
	border-left: solid black 3px;
	border-bottom: solid black 1px;
	background-color: rgba(255,255,255,0.125);
}

h2{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 2px;
	border-left: solid gray 3px;
	border-bottom: solid gray 1px;
	background-color: rgba(255,255,255,0.125);
}

h3{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 2px;
	border-left: solid darkgray 3px;
	border-bottom: dotted darkgray 1px;
	background-color: rgba(255,255,255,0.125);
}

/** コンテンツ */
.cb {
	position: relative;
	margin: 0 5px 1em 5px;
}
