/* html */
html{
	width: 100%;
	height: 100%;
	overflow: hidden;
}

/* ボディ */
body{
	width: 100%;
	height: 100%;
	color: #ffffff;
	background-color: #000000;
	font-family: 'メイリオ', 'Microsoft Sans Serif', 'Tahoma';
	overflow: hidden;
}

/* ヘッダ */
div#head{
	height: 28px;
	overflow: hidden;
	background-color: #0000bb;
	position: relative;
	z-index: 1;
}

	div#head h1{
		padding: 0px 16px 0px 8px;
		line-height: 28px;
		float: left;
	}

		div#head h1 a:link{
			color: #ffffff;
			text-decoration: none;
		}

		div#head h1 a:visited{
			color: #ffffff;
			text-decoration: none;
		}

		div#head h1 a:hover,
		div#head h1 a:active{
			color: #ff0000;
			text-decoration: underline;
		}

	form#search{
		font-size: 80%;
		float: left;		
	}

	/* IE6 のみに適用させる */
	* html form#search{
		width: 276px;		
	}

		input#query{
			font-family: 'メイリオ', 'Microsoft Sans Serif', 'Tahoma';
			height: 18px;
			width: 180px;
			display: block;
			margin: 3px 8px 0px 0px;
			float: left;
		}

		input#submit{
			font-family: 'メイリオ', 'Microsoft Sans Serif', 'Tahoma';
			font-size: 100%;
			line-height: 22px;
			width: 80px;
			height: 22px;
			display: block;
			margin: 4px 8px 0px 0px;
			float: left;
		}

		/* IE6 のみに適用させる */
		* html input#submit{
			margin: 4px 4px 0px 0px;
		}

	div#head ul{
		list-style-type: none;
		font-size: 90%;
		line-height: 28px;
	}

		div#head ul li{
			margin: 0px 0px 0px 8px;
			float: left;
		}

			div#head ul li a:link{
				color: #bbbbff;
			}

			div#head ul li a:visited{
				color: #9999bb;
			}

			div#head ul li a:hover,
			div#head ul li a:active{
				color: #ff0000;
			}

/* メイン */
div#main{
	position: absolute;
	top: 0px;
	right: 280px;
	left: 0px;
	height: 100%;
}

	/* 上部・下部メニュー（タブ） */
	div#menu,
	div#supplements{
		font-size: 80%;
		line-height: 120%;
		float: left;
		width: 100%;
	}

	/* IE6 のみに適用させる */
	* html div#menu,
	* html div#supplements{
		float: none;
		width: auto;
		height: 1%;
	}

	div#menu{
		margin: 28px 0px 0px 0px;
		border-bottom: 2px solid #3377dd;
		padding: 2px 0px 0px 0px;
	}

	div#supplements{
		border-top: 2px solid #3377dd;
		padding: 0px 0px 2px 0px;
	}
		div#menu ul,
		div#supplements ul{
			list-style-type: none;
			padding: 0px;
			float: left;
		}

			div#menu ul li,
			div#supplements ul li{
				float: left;
				white-space: nowrap;
				margin: 0px 2px;
			}

			div#supplements ul li{
				width: 3em;
			}
			div#menu  ul li.open,
			div#supplements  ul li.open{
				background-color: #3377dd;
			}

			div#menu  ul li.still{
				color: #999999;
				padding: 2px;
				border-top: 2px solid #0000bb;
				border-right: 2px solid #0000bb;
				border-left: 2px solid #0000bb;
				text-decoration: line-through;
			}

				div#menu ul li a,
				div#supplements ul li a{
					color: #ffffff;
					text-decoration: none;
					display: block;
					padding: 2px;
				}

				div#supplements ul li a{
					text-align: center;
				}

				div#menu ul li a,
				div#supplements ul li a{
					border-right: 2px solid #0000bb;
					border-left: 2px solid #0000bb;
				}

				div#menu ul li a{
					border-top: 2px solid #0000bb;
				}

				div#supplements ul li a{
					border-bottom: 2px solid #0000bb;
				}

				div#menu ul li.open a,
				div#supplements ul li.open a{
					border-right: 2px solid #3377dd;
					border-left: 2px solid #3377dd;
				}

				div#menu ul li.open a{
					border-top: 2px solid #3377dd;
				}

				div#supplements ul li.open a{
					border-bottom: 2px solid #3377dd;
				}

				div#menu ul li a:hover,
				div#menu ul li a:active,
				div#supplements ul li a:hover,
				div#supplements ul li a:active{
					background-color: #193b6e;
					border-right: 2px solid #3377dd;
					border-left: 2px solid #3377dd;
				}

				div#menu ul li a:hover,
				div#menu ul li a:active{
					border-top: 2px solid #3377dd;
				}

				div#supplements ul li a:hover,
				div#supplements ul li a:active{
					border-bottom: 2px solid #3377dd;
				}

				div#menu ul li.open a:hover,
				div#menu ul li.open a:active,
				div#supplements ul li.open a:hover,
				div#supplements ul li.open a:active{
					background-color: #3377dd;
				}

		div#supplements p{
			float: right;
			white-space: nowrap;
			margin: 2px 4px 0px 4px;
			padding: 2px 4px;
		}

			div#supplements p span{
				font-weight: bold;
			}

	/* javascript で height が指定される */
	ol#results{
		clear: both;
		list-style-type: none;
		padding: 4px 4px 4px 12px;
		overflow: auto;
	}

		ol#results strong{
		}

		ol#results em{
			color: #ffff66;
			font-weight: bold;
			font-style: normal;
		}

		ol#results li{
			height: 105px;
			padding: 4px 0px;
			overflow: hidden;
		}

		/* IE6 のみに適用させる */
		* html ol#results li{
			height: 102px;
		}

		/* IE7 のみに適用させる */
		*:first-child+html ol#results li{
			height: 102px;
		}

		/* これはウィンドウサイズに合わせて javascript から指定される */
		ol#results li.even{
			width: 50%;
			float: left;
		}

		/* IE6 のみに適用させる */
		* html ol#results li#display-width{
			font-size: 0px;
			line-height: 0px;
			height: 0px;
			padding: 0px;
			width: auto;
			float: none;
			margin: -3px 8px 0px 0px;
		}

			ol#results img{
				float: left;
				border: 4px solid #000066;
			}

			ol#results img.reserved{
				border: 4px solid #33aa77;
			}

			/* IE6 のみに適用させる */
			* html ol#results div{
				width: 0px;
				overflow: hidden;
			}

			ol#results p{
				margin: 0px 8px 0px 0px;
				overflow: hidden;
			}

			/* IE6 のみに適用させる */
			* html ol#results p{
				margin: 0px;
			}

			p.title{
				font-size: 90%;
				line-height: 130%;
				white-space: nowrap;
				font-weight: bold;
			}

				p.title a{
					color: #ffffff;
					text-decoration: none;
					display: block;
					padding: 2px 4px;
					background-color: #000066;
				}

				/* IE6 のみに適用させる */
				* html p.title a:link,
				* html p.title a:visited,
				* html p.title a:hover,
				* html p.title a:active{
					color: #ffffff;
				}

				p.title a.reserved{
					background-color: #33aa77;
				}

			p.time{
				font-size: 80%;
				line-height: 120%;
				padding: 2px 4px 2px 8px;
				background-color: #000033;
				white-space: nowrap;
			}

			p.summary{
				font-size: 80%;
				line-height: 120%;
				padding: 2px 4px 2px 8px;
			}

	/* javascript で height が指定される */
	div#introduction{
		clear: both;
		padding: 12px 16px;
		overflow: auto;
	}

		div#introduction h2{
			color: #ffffaa;
		}

		div#introduction ul,
		div#introduction ol{
			margin: 0px 0px 1em 0px;
		}

	/* javascript で height が指定される */
	/* デフォルトの height を指定しないと、画面更新中にヘッダ等の位置がずれるため */
	div#view{
		clear: both;
		height: 50%;
	}

	/* javascript で height が指定される */
	div#status{
		clear: both;
		padding: 12px 16px;
		overflow: auto;
	}

		div#status p{
			font-weight: bold;
			color: #ffffaa;
		}

		div#status ul{
			margin: 0px 0px 1em 0px;
		}

/* サブ */
div#sub{
	position: absolute;
	top: 0px;
	right: 0px;
	width: 280px;
	height: 100%;
	background-color: #000066;
}

	/* javascript で height が指定される */
	div#information{
		margin: 28px 0px 4px 0px;
		padding: 0px 4px;
		visibility: hidden;
	}

		div#information h2{
			padding: 4px 8px;
		}

		div#info_body{
			color: #000000;
			overflow: auto;
		}

		/* IE6 のみに適用させる */
		* html div#info_body{
			width: 272px;
		}

		div.info_body_true{
			background-color: #ffffff;
		}

		div.info_body_false{
			background-color: #999999;
		}

			p#info_exp,
			p#info_title{
				font-size: 90%;
				line-height: 130%;
				padding: 2px 4px;
				margin: 2px 4px;
			}

			div#info_image{
				white-space: nowrap;
				overflow: hidden;
				margin: 0px 0px 4px 0px;
			}

				img#info_image1{
					margin: 0px 4px;
				}

			p#info_ktime,
			p#info_kviewcount,
			p#info_ksummary,
			p#info_vtime,
			p#info_vviewcount,
			p#info_vsummary{
				border-top: 2px solid #dddddd;
				font-size: 80%;
				line-height: 120%;
				padding: 2px 4px;
			}

			p#info_ktime,
			p#info_kviewcount,
			p#info_ksummary{
				margin: 0px 0px 4px 4px;
				text-align: center;
				overflow: hidden;
				width: 6em;
				background-color: #dddddd;
				float: left;
			}

			/* IE6 のみに適用させる */
			/* float をした方向の margin が 2 倍になるため、半分のマージンを取らせる */
			* html p#info_ktime,
			* html p#info_kviewcount,
			* html p#info_ksummary{
				margin: 0px 0px 4px 2px;
			}

			p#info_ksummary{
				line-height: 2em;
				padding: 0px 4px;
				height: 2em;
				margin: 0px 8px 2px 4px;
			}

			/* IE6 のみに適用させる */
			/* float をした方向の margin が 2 倍になるため、半分のマージンを取らせる */
			* html p#info_ksummary{
				margin: 0px 8px 2px 2px;
			}

			p#info_vtime,
			p#info_vviewcount{
				margin: 0px 4px 4px 4px;
				text-align: right;
			}

			p#info_vsummary{
				margin: 0px 4px 2px 4px;
			}

	/* javascript で height が指定される */
	div#playlist{
		padding: 0px 4px;
		visibility: hidden;
	}

		div#playlist h2{
			padding: 4px 8px;
		}

		iframe#list_body{
			width: 100%;
		}

		p#list_alldel{
			font-size: 80%;
			line-height: 120%;
			text-align: center;
			margin: 2px 0px 2px 0px;
		}

		p.list_alldel_true{
			background-color: #ffffff;
		}

		p.list_alldel_false{
			background-color: #999999;
			text-decoration: line-through;
			padding: 4px;
			color: #000000;
		}

			p#list_alldel a{
				display: block;
				padding: 4px;
			}

			p#list_alldel a:hover,
			p#list_alldel a:active{
				background-color: #ddbbbb;
				color: #ff0000;
			}

/* フッタ */
div#foot{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 28px;
	overflow: hidden;
	background-color: #0000bb;
}

	div#foot p{
		padding: 0px 8px;
		font-size: 80%;
		line-height: 28px;
		float: left;
	}

	div#foot a:link{
		color: #bbbbff;
	}

	div#foot a:visited{
		color: #9999bb;
	}

	div#foot a:hover,
	div#foot a:active{
		color: #ff0000;
	}