
#tab {
	width: 100%;
}
#tab #navs {
	float: left;
	width: 100%;
	border-bottom: 1px #00521c solid;
	margin-bottom: 5px;
}

#tab #navs li {
	text-align: center;
	display: inline-block;
	margin-right: 3px;
	background: #ffffff;
	border: 1px solid #424242;
	border-bottom: 0px solid #FFF;
	padding: 0.4em 1.5em;
	color:#424242;
	border-radius:0.4em 0.4em 0 0;
	font-size:110%;
}

#tab #navs li.select { 
	background: #424242;
	color:#FFFFFF;
	font-weight:bold;
	font-size:130%;
}

#tab div { clear: both; }
#tab table { width:100%;}




/* カレンダー用テーブル */
.cal_tbl {
	width: 100%;
	border-collapse:separate;
	margin-bottom:8px;
	border-spacing:3px;
}

/* カレンダー用テーブル　th */
.cal_tbl th {
	font-weight: normal;
}

/* カレンダー用テーブル　th・td　共通 */
.cal_tbl th, .cal_tbl td {
	text-align: center;
	padding:5px 0px 3px;
	font-size:120%;
}

/* カレンダー用テーブル　td */
.cal_tbl td {
	vertical-align: top;
}

/* 項目行「日曜」セルの設定 */
.youbi_hd {
	background-color: #ed9797;
	color:#fff;
}

/* 項目行「月」～「金」セルの設定 */
.youbi_nr {
	background-color: #dadada;
	color:#000;
}

/* 項目行「土」のセルの設定 */
.youbi_st {
	background-color: #7091D4;
	color:#fff;
}

/*  */
.gai_td {
	background-color:#f0f0f0;
}

.kyuu_td {
	background-color:#e7e7e7;
}

/* 日付部 日曜 or 祝日 の背景色 */
.hd_td {
	background-color:#fcc;
}

/* 日付部 平日 の背景色 */
.nr_td {
	background-color:#e9e9e9;
}

/* 日付部 土曜 の背景色 */
.st_td {
	background-color:#def;
}

/* 日付部 '特' 設定時の背景色 */
.sp_td {
	background-color:#ffc;
}

/* 料金部 日曜 or 祝日 の文字色 */
.hdf_td {
	color:#000;
	background-color: #fffafa;
	border-color: #ffeeee;
}

/* 料金部 平日 の文字色 */
.nrf_td {
	color:#000;
	background-color: #fefefe;
	border-color:#f0f0f0;
}

/* 料金部 土曜 の文字色 */
.stf_td {
	color:#000;
	background-color: #f6faff;
	border-color: #eef5ff;
}

/* 料金部 '特' 設定時の文字色 */
.spf_td {
	color:#000;
	background-color: #fff9f4;
	border-color: #fff6ee;
}

/* 料金部 td 共通 */
.cal_tbl .hdf_td, .cal_tbl .nrf_td, .cal_tbl .stf_td, .cal_tbl .spf_td {
	vertical-align:middle;
	height:4em;
	padding-bottom:0.7em;
	border-style:solid;
	border-width:thin;
	width:14%;
}

/* 料金が複数段になるときの区切り線 */
.cal_tbl td hr { margin:0 auto; width:70%; border-style:none; border-top: 1px #ccc dotted; }


.cal_tbl * .hosoku { font-size:90%; color:#f00; margin-top:0.3em; }

/* ===========================
PCサイズ
=============================*/
@media screen and (min-width: 920px){
	.cal_tbl td img { max-width:20px; margin-right:2px; }
}

/* ===========================
タブレットサイズ
=============================*/
@media screen and (min-width:771px) and (max-width:919px){
	.cal_tbl * { font-size:95%; }
	.cal_tbl td img { max-width:18px; margin-right:1px; }
}

/* ===========================
スマホサイズ 1
=============================*/
@media screen and (min-width:500px) and  (max-width:770px){
	.cal_tbl * { font-size:90%; }
	#tab #navs  li.select { font-size:95%; }
	.cal_tbl, .cal_tbl th, .cal_tbl td { border-collapse:collapse; border:1px #ccc solid; margin:0; }
	.cal_tbl * .sh { display:none; }
	.cal_tbl td img { max-width:14px; margin:0px; }
	
	#tab #navs li { width:12%; font-size:80%; }
	
}

/* ===========================
スマホサイズ 2
=============================*/
@media screen and (max-width:499px){
	.cal_tbl * { font-size:90%; }
	#tab #navs  li.select { font-size:90%; }
	.cal_tbl, .cal_tbl th, .cal_tbl td { border-collapse:collapse; border:1px #ccc solid; margin:0; }
	.cal_tbl * .sh { display:none; }
	.cal_tbl td img { max-width:10px; margin:0px; }
	
	#tab #navs li { width:12%; font-size:80%; }
	
}



