
/*/////////////// CSS変数設定 ///////////////////*/
@import "./root.css";
/*/////////////// CSS変数設定 ///////////////////*/

/************************************************************
 * スケジュール切り替え
************************************************************/
@media screen and (max-width: 1049px) {
	/*タブボックス*/
	#schedule_tab{width:100%;margin:0 auto 10px;;padding:0px;}
	#schedule_tab ul{
		width:98%;
		margin:0px auto;
		padding:0px;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;

		-ms-flex-wrap: wrap;	
		flex-wrap: wrap;
	
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}	
	#schedule_tab li {
		width:calc(100% / 3);
		height:35px;
  		margin:0px;
 		padding: 0px;
		font-size: 12px; 
		font-size: 1.2rem; /* =12px */
		text-align:center;
		line-height:35px;

		text-align:center;
		cursor: pointer;
		border:1px solid #ccc;
		background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		from(#ddd), to(#fff)
		);
		background-image: -moz-linear-gradient(
			center bottom,
			from(#ddd), to(#fff)
		);
	
	}
	#schedule_tab li:first-child {
		width:100%;
	}	
	
	#schedule_tab li.select {
		background: #f3a4c3;
		color:#fff;
		font-weight:bold;
	}	
	
}
@media screen and (min-width: 1050px) {
	/*タブボックス*/
	#schedule_tab{width:100%;height:90px;margin:0 0 0 5px;padding:0px;}
	#schedule_tab ul{
		width:700px;
		margin:0px auto;
		padding:0px;
		
		list-style: none;
	
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;

		-ms-flex-wrap: wrap;	
		flex-wrap: wrap;
	
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
	#schedule_tab li {
		width:90px;
		height:90px;
  		margin:0px 5px;
 		padding:0px;

		font-size: 14px; 
		font-size: 1.4rem; /* =14px */
		text-align:center;
		line-height:90px;
		color:#333;
		
		cursor: pointer;
		border-radius: 50%;
		border:3px solid #cae9e4;
		background:#f3f0f0;
		
		ox-shadow: 0px 0px 5px rgba(000,000,000,0.3);
		-moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.3);
		-webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.3);
		transition: background-color 0.5s ease-in;
		-webkit-transition: background-color 0.5s ease-in;		
	
	}
	#schedule_tab li.select {
		color:#fff;
		font-weight:bold;
		
		border: 1px solid #660033;
		border-radius: 50%; 
		background: #f3a4c3;
		border:2px solid #daa520;
	}
}		
.disnon {
	display: none;
}
.sunday{color:#ff0000;text-shadow:1px 1px 0 #ffffff, -1px -1px 0 #ffffff,-1px 1px 0 #ffffff, 1px -1px 0 #ffffff,0px 1px 0 #ffffff,  0 -1px 0 #ffffff,-1px 0 0 #ffffff, 1px 0 0 #ffffff;}
.saturday{color:#3366ff;text-shadow:1px 1px 0 #ffffff, -1px -1px 0 #ffffff,-1px 1px 0 #ffffff, 1px -1px 0 #ffffff,0px 1px 0 #ffffff,  0 -1px 0 #ffffff,-1px 0 0 #ffffff, 1px 0 0 #ffffff;}

/************************************************************
 * スケジュールパネル
************************************************************/
#st_box_wrap{width: 100%;height:100%;min-height:100%;}
@media screen and (max-width: 1049px) {
	#st_box_wrap .schedule_tab_box{width:100%;}	
}
@media screen and (min-width: 1050px) {
	#st_box_wrap .schedule_tab_box{margin:30px auto 0px;width:1050px;}
}

/***    ulをセンター寄せ    *****/
#st_box_wrap .schedule_tab_box ul{
		list-style-type:none;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;

		-ms-flex-wrap: wrap;	
		flex-wrap: wrap;
	
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
}


/*#st_box_wrap .schedule_tab_box ul li{margin:0px;}*/


@media screen and (max-width: 629px) {
	#st_box_wrap .schedule_tab_box ul li{
		width:calc(96vw / 2);
		margin:5px 0px 10px;
		text-align:center;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;		
	}
}
@media screen and (min-width:630px) and (max-width:839px) {
	#st_box_wrap .schedule_tab_box ul li{
		width:calc(100vw / 3);
		margin:5px 0 10px;
		text-align:center;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;		
	}
}
@media screen and (min-width:840px) and (max-width:1049px) {
	#st_box_wrap .schedule_tab_box ul li{
		width:calc(100vw / 4);
		margin:5px 0 10px;
		text-align:center;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;		
	}
}
@media screen and (min-width: 1050px) {
	#st_box_wrap .schedule_tab_box ul li{
		width:210px;
		margin:5px 0 10px;
		text-align:center;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;		
	}
}

