/******************************************************************************
 *	ドキュメント構造定義
 ******************************************************************************/
@media screen and (max-width:500px){
	/* バナー */
	div#BannerArea{
		font-size: 300%;
	}

	div#CompanyName {
		position: relative;
		text-align: right;
		padding: 0.125em 0.5em 0 0.5em;
	}

	ul#MainMenu{
		display: none;
		border-top: solid gray 1px;
		border-bottom: solid gray 1px;
	}

	ul#MainMenu > li{
		text-align: right;
		padding: 8px 0.5em;
		font-size: 24px;
	}

	ul#MainMenu > li > a{

	}

	ul#MainMenu > li:after{
		color: lightgray;
		content: " >> ";
	}

	ul#MainMenu > li.Selected{
		display: none;
	}

	div#MenuToggleBar {
		position: relative;
		background-color: black;
		color: white;
		text-align: right;
		padding: 0.125em 0.5em;
	}

	h1{
		font-size: 1.5em;
	}

	h2{
		font-size: 1.25em;
	}

	h3 {
		font-size: 1em;
	}
}
@media screen and (min-width:501px) and (max-width: 767px){
	/* バナー */
	div#BannerArea{
		font-size: 300%;
	}

	div#CompanyName {
		position: relative;
		text-align: right;
		padding: 0.125em 0.5em 0 0.5em;
	}

	ul#MainMenu{
		display: none;
		border-top: solid gray 1px;
		border-bottom: solid gray 1px;
	}

	ul#MainMenu > li{
		text-align: right;
		padding: 8px 0.5em;
		font-size: 24px;
	}

	ul#MainMenu > li:after{
		color: lightgray;
		content: " >> ";
	}

	ul#MainMenu > li{
		text-align: right;
		padding: 0.25em 0.5em;
	}

	ul#MainMenu > li.Selected{
		display: none;
	}

	div#MenuToggleBar {
		position: relative;
		background-color: black;
		color: white;
		text-align: right;
		padding: 0.125em 0.5em;
	}
}
@media screen and (min-width: 768px){
	body{
		background-color: darkgray;
		background-image: repeating-linear-gradient(-45deg, darkgray, gray 2px, gray 2px, darkgray 4px);
	}

	/* バナー */
	div#BannerArea{
		font-size: 500%;
	}

	div#CompanyName {
		position: absolute;
		top: 0;
		right: 0;
		padding: 0.25em 0.5em;
	}

	div#MenuToggleBar {
		display: none;
	}

	ul#MainMenu{
		display: table;
		table-layout: fixed;
		width:100%;
	}

	ul#MainMenu > li{
		font-size:1.25em;
		display:table-cell;
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
		text-align: center;
		padding:2px;
	}

	div#PageFooter{
		margin-bottom: 1em;
	}
}

body{
	margin: 0;
}

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

/* ページヘッダ*/
div#PageHeader{
	position: relative;
	background-color: black;
	border: solid black 1px;
}

/* バナー */
div#BannerArea{
	position: relative;
	text-align: center;
	vertical-align: middle;
	color: white;
}

/* 会社名 */
div#CompanyName {
	color: lightgray;
}

/* メニュー */
div#MenuArea{
	position:relative;
	border-left: solid black 1px;
	border-right: solid black 1px;
}

ul#MainMenu{
	position: relative;
	padding:0;
	background-color: black;
	margin:0;
}

ul#MainMenu > li{
	position: relative;
	list-style-type: none;
	background-color: black;
	color: lightgray;
	margin:0;
	font-family: sans-serif;
	border-bottom:solid black 1px;
}
ul#MainMenu > li.Selected{
	background-color: white;
	border-bottom: white;
}
ul#MainMenu > li.Unselected:hover{
	background-color: darkgray;
	border-bottom:solid darkgray 1px;
}
ul#MainMenu > li.MenuArrow{
	width: 2em;
	text-align: center;
	cursor: pointer;
}

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

/* パス表示 */
div#Path {
	position: relative;
	border-bottom: solid black 1px;
	margin: 0 0 0.5em 0;
}
div#Path ul{
	padding: 0 1em;
	margin: 0.25em 0;
}
div#Path ul li {
	display: inline;
	list-style-type: none;
}
div#Path ul li:before {
	content: " > ";
}
div#Path ul li:first-child:before {
	content: none;
}

/* パス表示の代わりのスペーサー */
div#Spacer {
	position: relative;
	padding-bottom: 1em;
}

/* ページ本文 */
div#PageContents{
	position:relative;
	background-color: white;
	border-left: solid black 1px;
	border-right: solid black 1px;
	border-bottom: solid black 1px;
	padding: 0.5em 0;
}

/* ページフッタ */
div#PageFooter{
	position: relative;
	background-color: black;
	color: white;
	border: solid black 1px;
}

ul#FooterMenu {
	position: relative;
	display: table;
	table-layout: fixed;
	margin: 0;
	padding: 0;
	width: 100%;
}

ul#FooterMenu > li {
	position: relative;
	display: table-cell;
	list-style-type: none;
	padding: 0.125em 0.5em;
}

li#FLeft {
	text-align:left;
}

li#FMiddle {
	text-align:center;
}

li#FRight {
	text-align:right;
}

div#PageFooter span.spacer{
	color: transparent;
}

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

/******************************************************************************
 *	ヘッディングとコンテンツレベル
 ******************************************************************************/
/*	ヘッディング */
h1 {
	background: -moz-linear-gradient(left, gray, rgba(204,204,204,0.5));
	background: -webkit-gradient(linear, left top, right top, from(gray), to(rgba(204,204,204,0.5)));
	border-left: solid black 5px;
	border-bottom: solid black 1px;
	padding: 2px 5px;
	margin: 0 0 0.25em 0;
	font-family: sans-serif;
	font-weight: normal;
}

h2 {
	background: -moz-linear-gradient(left, lightgray, rgba(220,220,220,0.25));
	background: -webkit-gradient(linear, left top, right top, from(lightgray), to(rgba(220,220,220,0.25)));
	border-left: solid gray 5px;
	border-bottom: solid black 1px;
	padding: 2px 5px;
	margin: 0.5em 0;
	font-family: sans-serif;
	font-weight: normal;
}

h3 {
	background: -moz-linear-gradient(left, whitesmoke, rgba(245,245,245,0.5));
	background: -webkit-gradient(linear, left top, right top, from(whitesmoke), to(rgba(245,245,245,0.5)));
	border-left: solid lightgray 5px;
	border-bottom: dotted black 1px;
	padding: 2px 5px;
	margin: 0.5em 0;
	font-family: sans-serif;
	font-weight: normal;
}

/* パラグラフ */
.cb{
	position: relative;;
	padding: 0 0.5em;
}

.FloatRight{
	float: right;
	margin-left: 1em;
	margin-bottom: 1em;
}

.FloatLeft{
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
}

.ClearFix:after{
	content:"";
	clear:both;
	display:block;
}

.ShadowedBorder{
	box-shadow: 0px 0px 10px;
	border: solid black 1px;
}

.RBox{
	position: relative;
	text-align: right;
}

.LBox{
	position: relative;
	text-align: left;
}

.CBox{
	position: relative;
	text-align: center;
}

/* テーブル */
table.DefaultTable{
	border-collapse: collapse;
	margin-left: 5px;
}
table.DefaultTable th {
	border: solid black 1px;
	background-color: lightgray;
	padding: 2px 5px;
}
table.DefaultTable td {
	border: solid black 1px;
	padding: 2px 5px;
}

/* ボタン風リンク */
a.LinkButton {
	border-radius: 4px;
	background: linear-gradient(to bottom, whitesmoke 0%, gainsboro 50%, lightgrey 50%, lightgrey 100%);
	background-color: lightgray;
	padding: 0.25em 0.5em;
	text-decoration: none;
	font-family: sans-serif;
	font-weight: bold;
}
a.LinkButton:after{
	content: " >>"
}