@charset "utf-8";
/* CSS Document */

/*汎用*/
.font_bold{font-weight:bold;}
.font_small{font-size:small;}
.color_red{color:#CC0000;}
.indent_1em{margin-left:1em;}

.alert{color:#CC0000; font-size:80%; margin:0.5em 0 0.5em 0;}


#view {
	max-width:35em;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
#view h1 {
	font-size:200%;
	margin-bottom:0.5em;
	line-height:1em;
}
#view h1 span {
	display:inline-block;
	font-size:medium;
	font-weight:normal;
	margin-left:0.5em;
}
#view #caution, #wrap #caution {
	clear:both;
	margin-left:auto;
	margin-right:auto;
	padding:1em;
	text-align:left;
	background-color:#FFFF99;
	font-size:80%;
}
#wrap #caution{width:40em;}
#view #information{
	clear:both;
	text-align:left;
	background-color:#FFFFFF;
	font-size:80%;
	border: 3px double #000000;
	margin-left:auto;
	margin-right:auto;
	padding:1em;
	font-weight:bold;
}

#view #caution span, #wrap #caution span, #view #information span {
	color:red;
	font-size:medium;
}


/*****閲覧トップ画面（施設選択）********************************************************************/
#view #select_place {
	padding:1em 1em 0.5em 1em;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:2em;
	background-color:#E3E3E3;
}
#view #select_place a {
	display:block;
	margin-bottom:1em;
	padding:1em;
	background-color:#6699FF;
	color:#003300;
	text-decoration:none;
	font-weight:bold;

}
#view #select_place a:hover {
	background-color:#FFFFCC;
}
#view #select_place a span {
	display:block;
	padding-top:0.5em;
	font-size:0.8em;
	font-weight:normal;
}

/*****閲覧月選択画面********************************************************************/
#view .select_month {
	width:10em;
	padding:1em 1em 0.5em 4.5em;
	margin-left:1em;
/*	margin-left:auto;
	margin-right:auto;*/
	margin-bottom:1em;
	background-color:#E3E3E3;
	position:relative;
	float:left;
}
#view .select_month .label {
	position:absolute;
	left:0.3em;
	background-color:#F6F6F6;
	padding:2px;
	font-size:220%;
	font-weight:bold;
	color:#999999;
}
#view .select_month a {
	display:block;
	margin-bottom:0.5em;
	padding:1em;
	background-color:#6699FF;
	color:#003300;
	text-decoration:none;
	font-weight:bold;

}
#view .select_month a:hover {
	background-color:#FFFFCC;
}



/*****予約照会画面********************************************************************/
#wrap {
/*	width:90%;
	max-width:950px;
	min-width:800px;*/
	width:950px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
}
#wrap #scriptdata {/*jQuery用データ欄*/
	/*普通に隠すとjQueryがデータを拾えないので以下のように人間だけに不可視にする*/
	height:0;
	overflow:hidden;
	color:#FFFFFF;
}
#wrap h1 {
	font-size:large;
}
#wrap h2 {
	padding:0.5em;
	border:1px solid #336699;
	background-color:#6699FF;
	font-size:medium;
	margin-bottom:0;
	margin-top:1em;
}
#wrap h2 span {
	font-size:80%;
	font-weight:normal;
}


/*****カレンダーの基本デザイン（変更可）*****/
#wrap #month {
	font-size:200%;
	padding-top:0.5em;
	margin-bottom:1em;
}
#wrap #month span#uname {
	display:inline-block;
	font-weight:normal;
	margin-left:0.5em;
}
#wrap #month span#info {
	display:inline-block;
	font-size:medium;
	font-weight:normal;
	margin-left:0.5em;
}
#wrap #kokuti {
	font-size:90%;
	margin:0.5em 0 1em 0;
	padding:10px;
	background-color:#FFFF99;
	line-height:1.3em;
}

#wrap table#reserv_table {
	font-size:90%;
	border-top:solid 1px #666666;
	border-left:solid 1px #666666;
	>border-bottom:solid 1px #666666;/*IE用*/
	border-collapse:collapse;
	border-spacing:0px;
	empty-cells:show;
	margin-bottom:1em;
	width:100%;
}
#wrap table#reserv_table td , #wrap table#reserv_table th {
	border-right:solid 1px #666666;
	border-bottom:solid 1px #666666;
}
#wrap table#reserv_table th {
	background-color:#CCCCCC;
	padding:3px;
}
#wrap table#reserv_table th:hover {background-color:#99CCFF;}
#wrap table#reserv_table tr {
	background-color:#FFFFFF;
}
/*各日先頭行のスタイル*/
#wrap table#reserv_table tr.trtop td {
	border-top:solid 3px #666666;
}
/*奇数行のスタイル*/
#wrap table#reserv_table tr.odd {
	background-color:#FFFFFF;
}
/*偶数行のスタイル*/
#wrap table#reserv_table tr.even {
	background-color:#E3E3E3;
}
/*日セル*/
#wrap table#reserv_table td.td_day {
	font-weight:bold;
	text-align:center;
	padding:3px;
	background-color:#FFFFFF;
	max-width:5em;
}
#wrap table#reserv_table td.td_day span {font-weight:normal;}
#wrap table#reserv_table td.td_day:hover {background-color:#99CCFF;}
/*土日祝日のスタイル*/
#wrap table#reserv_table td.holiday { /*祝日*/
	background-color:#FFCCCC !important;
	color:red;
}
#wrap table#reserv_table td.holiday:hover {background-color:#99CCFF !important;}
#wrap table#reserv_table td.sunday { /*日曜日*/
	background-color:#FFCCCC !important;
	color:red;
}
#wrap table#reserv_table td.sunday:hover {background-color:#99CCFF !important;}
#wrap table#reserv_table td.saturday { /*土曜日*/
	background-color:#CCCCFF !important;
	color:blue;
}
#wrap table#reserv_table td.saturday:hover {background-color:#99CCFF !important;}

/*曜日セル*/
#wrap table#reserv_table td.td_week {
	text-align:center;
	padding:3px;
}
#wrap table#reserv_table td.td_week:hover {background-color:#99CCFF;}

/*施設セル*/
#wrap table#reserv_table td.td_room {
/*	width:8em;*/
	padding:3px;
}
#wrap table#reserv_table td.td_room:hover {background-color:#99CCFF;}


/*****予約テーブルの基本デザインここまで*****/



/******CSSとjsによるチェックボックスの制御******/
/*概要：*/
/*予約済みセルは、view.jsの働きでtdにcss="checked"が追加される*/
/*休館日の行は、view.jsの働きでtrにcss="disabled"が追加される*/


#wrap #sample {/*凡例欄*/
/*	font-size:80%;*/
	margin-left:1em;
}
#wrap #sample span#norsv {/*凡例未予約*/
	display:inline-block;
	padding:1px;
	border:1px solid #999999;
	color:#333333;
}
#wrap #sample span#rsvmark {/*凡例予約済み*/
	display:inline-block;
	padding:1px;
	background-color:#006699;
	color:#FFFFFF;
	width:3em;
	text-align:center;
}
#wrap #sample span#cdmark {/*凡例休館日*/
	display:inline-block;
	padding:1px;
	background-color:#999999;
	color:#FFFFFF;
	width:3em;
	text-align:center;
}

#wrap table#reserv_table td.td_reserv {/*予約セル*/
	height:2.5em;
	width:4em;
	padding:0px;
	overflow:hidden;
	text-align:center;
	font-size:95%;
	color:#333333;
}
#wrap table#reserv_table td.td_reserv:hover {background-color:#99CCFF;}


/*チェックされたチェックボックスのスタイル*/
#wrap table#reserv_table td.td_reserv.checked {
	background-color:#006699;
	color:#FFFFFF;
}
/*ただし奇数行は背景色少し薄め*/
#wrap table#reserv_table tr.odd td.td_reserv.checked {
	background-color:#2288aa;
}
#wrap table#reserv_table td.td_reserv.checked:hover {background-color:#99CCFF;}
#wrap table#reserv_table tr.odd td.td_reserv.checked:hover {background-color:#99CCFF;}

/*無効化されたチェックボックスのスタイル*/
#wrap table#reserv_table td.td_reserv.disabled {
	background-color:#999999;
	color:#CCCCCC;
}

/*2016リニューアル用*/
.clear{
	clear:both;
	margin:0;
	padding:0;
}