@charset "utf-8";

/*===============================================
●共通
===============================================*/
/* calendar
---------------------------------------- */
#calendar {border-bottom: #17234D 1.5em solid;}
#calendar #resevationBox {overflow: hidden;}
#calendar table th,
#calendar table td {
	height: 40px;
	text-align: center;
	font-size: 12px;
	vertical-align: middle;
}
#calendar table tr:nth-child(odd) th,
#calendar #innerTable tr:nth-child(odd) td {background-color: #DADBDB;}
#calendar .tableTitle {
	height: 40px;
	background-color: #17234D!important;
}
#calendar table .daysWrapper {vertical-align: top;}
#calendar #flowBox {overflow-x: scroll;}
#calendar #innerTable {
	margin-top: 0!important;
	table-layout: fixed;
}
#calendar #innerTable th,
#calendar #innerTable td {width: 40px;}
#calendar #innerTable th {
	color: #fff;
	line-height: 13px;
	height: 40px;
	overflow: hidden;
	background-color: #17234D;
}
#calendar table .th th {
	white-space: nowrap;
	padding: 0 0.5em;
	text-align: left;
}
#calendar table .noborder th {
	background-color: #fff!important;
}
#calendar p {text-align: center;}
#calendar .indent,#infoBox .indent {
	text-indent: -1em;
	padding-left: 1em;
	display: block;
}

/* 宿泊のカレンダー(英語版)
---------------------------------------- */
.stay #calendar.calendarEn .tableTitle,
.index #calendar.calendarEn .tableTitle {
	width: 19em;
}

/* いちご狩りフォームのカレンダー(英語版)
---------------------------------------- */
#calendar.calendarEn .tableTitle {
	width: 10em;
}

/* 素粋宿泊居カレンダー
---------------------------------------- */
#resevationBox .calendarCaption {padding-top: 2em;}
.calendarCaption {
	font-weight: bold;
	line-height: 2em;
	text-align: left!important;
}
#so_calendar .calendarCaption {
	line-height: 1.7;
}
#calendar table {table-layout: fixed;}
#so_calendar #so_Wrap {
	display: flex;
}
#so_calendar #so_calendarCaption {
	line-height: 40px;
	white-space: nowrap;
	font-size: 12px;
}
#so_calendar #so_calendarCaption li {
	font-size: 12px;
	padding: 0 0.5em;
}
#so_calendar #so_calendarCaption li.dummy {
	height: 40px;
	background-color: #17234D!important;
}
#so_calendar #so_calendarCaption li:nth-child(odd) {background-color: #DADBDB;}
#so_calendar #so_flowBox {
	overflow-x: scroll;
	font-size: 12px;
}

/*オンライン予約 各期間表示*/
.dates {
	text-align: center;
	margin-bottom: 1.5em;
	font-size: 1.15em;
}
.dates li span {
	width: 4.5em;
	display: inline-block;
	text-align: right;
	padding-right: 0.25em;
	font-weight: bold;
	line-height: 1.5;
}


/*===============================================
●画面の横幅が729px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 729px){

	/* calendar
	---------------------------------------- */
	#calendar {padding: 3em 0;}
	#calendar table {
		width: 100%;
		position: relative;
		margin-top: 1.5em;
		background-color: #fff;
	}
	#calendar .tableTitle {width: 8em;}
	#calendar #infoText {
		text-align: right;
		padding-top: 2em;
	}
	#calendar table .noborder th {
		height: 10px;
		line-height: 0;
	}

}



/*===============================================
●画面の横幅が730px以上(PCのみ)
===============================================*/
@media screen and (min-width: 730px){

	/* calendar
	---------------------------------------- */
	#calendar {padding: 6em 0;}
	#calendar p {line-height: 2em;}
	#calendar table {
		width: 100%;
		margin-top: 2.5em;
	}
	#onlineReservBox #calendar table {
		margin-top: 0;
	}
	#calendar table .th th {min-width: 8em;}
	#calendar .tableTitle {
		width: 8em;
	}
	#calendar table .noborder th {
		height: 30px;
	}
}

/*===============================================
●画面の横幅が860px以上(PCのみ)
===============================================*/
@media screen and (min-width: 900px){

	/* 全般
	---------------------------------------- */
}