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

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

#tab #navs li.select { 
	background: #3d1375;
	color:#FFFFFF;
	font-weight:bold;
	font-size:124%;
}

#tab div {
	clear:both; }




/* カレンダー用テーブル */
.cal_tbl {
	width: 100%;
	border:1px #eee solid;
	border-collapse:collapse;
	margin-bottom:8px;
}
.cal_tbl span {
	display:inline-block;
}

/* 項目行 */
.cal_tbl .th_l {
	background-color:#eee;
	font-weight: normal;
	color:#000;
}

/* 日付行　土　の設定 */
.youbi_st_l {
	background-color: #caeefe;
	color:#000;
}

/* 日付行　日・祝　の設定 */
.youbi_hd_l {
	background-color:#ffd1d6;
	color:#000;
}

/* 日付行　平日　の設定 */
.youbi_nr_l {
	background-color:#fff;
	color:#000;
}

/* 日付行　休場日・貸切　の設定 */
.kyuu_l {
	background-color:#ddd;
	color:#000;
}

/* 日付行 '特1' 設定時の設定 */
.sp_l_01 {
	background-color:transparent;
	color:#f00;
}

/* 日付行 '特2' 設定時の設定 */
.sp_l_02 {
	background-color:#FFFFDC;
	color:#f00;
	font-weight: bold;
}

/* 日付行 '特3' 設定時の設定 */
.sp_l_03 {
	background-color:#FFFFDC;
	color:#0a0;
	font-weight: bold;
}

/* 日付行 '特4' 設定時の設定 */
.sp_l_04 {
	background-color:#FFFFDC;
	color:#06f;
	font-weight: bold;
}

.sp_l_01 .date_td, .sp_1_02 .date_td, .sp_1_03 .date_td, .sp_1_04 .date_td, .sp_l_01 .day_td, .sp_1_02 .day_td, .sp_1_03 .day_td, .sp_1_04 .day_td { color:#000; }

/* th・td　共通 */
.cal_tbl th, .cal_tbl td {
	padding:0.8em 0.3em 0.5em;
	border:1px #eee solid;
	border-collapse:collapse;
}

/* th */
.cal_tbl th {
	text-align:center;
	border:1px #ccc solid;
}

/* td */
.cal_tbl td {
	vertical-align: middle;
}

/* 日付 セルの設定 */
.date_td {
	width:10%;
	text-align:center;
}

/* 曜日 セルの設定 */
.day_td {
	width:5%;
	text-align:center;
}

/* 料金 セルの設定 */
.fee_td {
	width:25%;
	text-align:center;
}

/* アイコン セルの設定 */
.icon_td {
	text-align:center;
}

* .icon_td img {
	width:auto;
	margin-right:2px;
}

/* 備考 セルの設定 */
.ev_td {
	width:30%;
	text-align:center;
	text-indent:0.5em;
}

.ev_td img { vertical-align:middle; }

/* 料金テキスト 1つ目の設定 */
.fee_01 {
	font-weight:normal;
}

/* 料金テキスト 2つ目の設定 */
.fee_02 {
	font-weight:normal;
}

/* 休場日・貸切　セルの設定 */
.kyuu_td {
	text-align:center;
}


/* ● ページ幅いっぱい使う場合のCSS ●●●●●●●●●●●●●●●●●●●●● */

/* ===========================
PCサイズ
=============================*/
@media screen and (min-width: 920px){
	.cal_tbl * { font-size:100%; }
	.fee_01 { font-size:100%; }
	.fee_02 { font-size:90%; }
}

/* ===========================
タブレットサイズ
=============================*/
@media screen and (min-width:771px) and (max-width:919px){
	.cal_tbl * { font-size:100%; }
	.fee_01 { font-size:100%; }
	.fee_02 { font-size:90%; }
}

/* ===========================
スマホサイズ 1
=============================*/
@media screen and (min-width:500px) and  (max-width:770px){
	.cal_tbl * { font-size:100%; }
	.fee_01 { font-size:100%; }
	.fee_02 { font-size:85%; }
	
	#tab #navs li { width:11%; font-size:80%; }

	.icon_td img  {
		width:16px;
		margin-right:2px;
	}

}

/* ===========================
スマホサイズ 2
=============================*/
@media screen and (max-width:499px){
	.cal_tbl * { font-size:75%; }
	.fee_01 { font-size:100%; }
	.fee_02 { font-size:80%; display: inline-block;}
	.fee_01 .sh, .fee_02 .sh { display:none; }
	
	#tab #navs li { width:11%; font-size:80%; }

	.icon_td img  {
		width:14px;
		margin-right:2px;
	}

	
}




