@CHARSET "UTF-8";
#maincontents > h2{
	display:none;
}
/* 入力グループ
-------------------------------- */
#inputArea{
	width:100%;
	box-sizing:border-box;
	padding-top:0;
}
.inputGroup{
	width:100%;
}
.inputRightGroup,
.inputLeftGroup{
	width:50%;
}
/* 支社・エリア名、最終更新日時 */
.branchNameItemWrap{
	color:#333;
	font-size:220.0%;
	font-family:'Noto Sans Japanese','Hiragino Kaku Gothic ProN',Meiryo,'Arial',sans-serif;
}
.branchNameItemWrap,
.lastUpdateDateItemWrap{
	width:100%;
}
.branchNameItemWrap label,
.branchNameItemWrap .items{
	line-height:33.6px;
}
.branchNameItemWrap label,
.lastUpdateDateItemWrap label{
	display:inline-block;
	float:left;
	width:auto;
	height:auto;
	background:#fff;
}
.branchNameItemWrap .items,
.lastUpdateDateItemWrap .items{
	display:inline-block;
	float:left;
	padding:6px 0;
}
/* お知らせ */
.noticeMessageItemWrap{
	position:relative;
	margin-top:30px;
	margin-bottom:0;
	margin-right:0;
	padding:15px 10px;
	border:1px solid #555;
	border-radius:3px;
	width:100%;
	min-height:159px;
	box-sizing:border-box;
}
.noticeMessageItemWrap .noticeMessage_itemLabel{
	background:#fff;
	text-align:center;
	border:1px solid #555;
	border-radius:8px;
	box-sizing:border-box;
	position:absolute;
	top:-23px;
	left:15px;
	width:123px;
	height:33px;
	padding:4px 10px 5px;
	font-size:17px;
}
/* カレンダー切替ボタン
-------------------------------- */
.resultsButtonGroup{
	position:relative;
	width:100%;
	height:35px;
	padding:30px 0 10px;
}
.resultsButtonGroup input[type="button"]{
	margin:0 !important;
	width:125px;
}
.resultsButtonGroup input[disabled]{
	border:0;
	background:0;
}
.thisMonthButtonItemWrap,
.nextMonthButtonItemWrap{
	margin:0;
}
.thisMonthButtonItemWrap .items,
.nextMonthButtonItemWrap .items{
	padding:0;
}
/* 位置：今月 */
.thisMonthPosition{
	position:absolute;
	left:43%;
	background:0;
	font-size:150%;
	font-weight:bold;
}
/* 位置：来月 */
.nextMonthPosition{
	position:absolute;
	right:8%;
}
/* 位置：先月 */
.lastMonthPosition{
	position:absolute;
	left:8%;
}
/* 最終更新日時
-------------------------------- */
.lastUpdateDateGroup{
	float:right;
	margin-top:10px;
}
.lastUpdateDate{
	white-space:nowrap;
}
/* カレンダー
-------------------------------- */
.results{
	width:80% !important;
}
.detailsTitle{
	background-color:white !important;
}
/* 予約不可 */
.cantReserve{
	background-color:lightgray !important;
}
.cantReserve .calStatus{
	/*color:lightgray !important;*/
}
.cantReserve .satStatus_itemLabel{
	/*color:skyblue !important;*/
}
.cantReserve .sunStatus_itemLabel{
	/*color:pink !important;*/
}
.specialHoliday{
	background-color:red !important;
}
/* 土曜日列 */
.resultsSatTitleCol{
	background-color:skyblue !important;
}
/* 日曜日列 */
.resultsSunTitleCol{
	background-color:pink !important;
}
.shortestReserveDay{
	background-color:orange !important;
}
.data-table label{
	font-weight:normal;
	line-height:1.0;
}
.data-table thead tr th{
	padding-bottom:3px;
	padding-top:3px;
	border-width:2px;
}
.data-table tbody tr td{
	padding:0;
	border-width:2px;
}
.data-table tbody tr td label,
.data-table thead tr th label{
	font-size:18px;
	font-weight:bold;
}
.data-table tbody tr:hover td,
.data-table tbody tr:hover td label{
	cursor:default;
}
.data-table tbody tr:nth-child(2n):hover td{
	background-color:white;
}
.data-table tbody tr:nth-child(2n+1):hover td{
	background-color:white;
}
.data-table tbody tr:nth-child(odd) td
,.data-table tbody tr:nth-child(odd) th{
	background-color:white;
}
.data-table tbody tr:nth-child(even) td
,.data-table tbody tr:nth-child(even) th{
	background-color:white;
}
/* タイトルは非表示 */
.calTitle{
	display:none;
}
/* 日付 */
.calDay{
	display:block;
	text-align:center;
	vertical-align:top;
	border-bottom:1px solid #999;
}
/* ステータス */
.calStatus{
	display:block;
	text-align:center;
	vertical-align:bottom;
}
/* カレンダーヘルプ
-------------------------------- */
.calendarHelpArea{
	width:20%;
	padding:0 10px;
	box-sizing:border-box;
}
.calendarHelpArea > div{
	width:100%;
}
.calendarHelpArea > div.labelWrap{
	border:1px solid #ccc;
}
.calendarHelpArea > div .th{
	width:35%;
	border-right:1px solid #ccc;
}
.calendarHelpArea > div .td{
}
.calendarRedTh_itemLabel{color:#fff;background-color:red;}
.calendarBlueTh_itemLabel{color:#fff;background-color:skyblue;}
.calendarPinkTh_itemLabel{color:#fff;background-color:pink;}
.calendarOrangeTh_itemLabel{color:#fff;background-color:orange;}
.calendarGrayTh_itemLabel{background-color:lightgray;}

/* インクルードエリア
-------------------------------- */
/* お知らせ横インクルードエリア */
.inputRightGroup .items{
	padding:0;
}
.inputRightGroup .itemWrap{
	margin:0;
}
.inputRightGroup .htmlText{
	width:auto !important;
	padding:0 10px;
}
/* 幅 */
.includeArea,
.includeWrap,
.includeWrap .items,
.includeWrap .items .processFlow,
.includeWrap .items .processFlow .divWrap,
.includeWrap .items .processFlow .divWrap .htmlText{
	width:100%;
	display:block;
}
.includeArea .includeWrap .items{
	display:inline-block;
}
@media screen and (min-width:769px) and (max-width:900px){
	.calendarHelpArea > div label{
		padding-top:3px;
		padding-bottom:3px;
	}
	.calendarHelpArea > div label.th{
		width:100%;
		border-bottom:1px solid #ccc;
	}
	.calendarHelpArea > div label.td{
		padding-left:13%;
		padding-right:13%;
	}
}
@media screen and (max-width:769px){
	#inputArea{
		padding-left:5px;
		padding-right:5px;
	}
	.inputRightGroup,
	.inputLeftGroup{
		width:100%;
	}
	.noticeMessageItemWrap{
		min-height:auto;
	}
	.inputRightGroup .htmlText{
		padding-bottom:0;
		padding-left:0;
		padding-right:0;
	}
	.resultsButtonGroup input[type="button"]{
		width:100px;
		padding-left:0;
		padding-right:0;
	}
	.thisMonthPosition{
		left:38%;
	}
	.nextMonthPosition,
	.lastMonthPosition{
		width:40% !important;
	}
	.results{
		width:100% !important;
	}
	.calendarHelpArea{
		width:100%;
	}
}
@media screen and (max-width:414px){
	.thisMonthPosition{
		left:32%;
	}
}
@media screen and (max-width:320px){
	.resultsButtonGroup input[type="button"]{
		width:70px;
	}
}
