@charset "utf-8";
/* ===================================================================
CSS calendar

 file name  :calendar.css
 author     :Ability Consultant
style calendar  :設定　ハックは最下部に記述
=================================================================== */
#calendar p.caption {
  margin-top: 10px;
}
/* -----------------------------------------------------------

	#calendar_con	カレンダーコンテンツ
	
----------------------------------------------------------- */

#calendar0,
#calendar1,
#calendar2,
#calendar3,
#calendar4,
#calendar5,
#calendar6 {
  padding-top: 10px; /* ヘッダーの高さを入力 */
  margin-top: -10px; /* ヘッダーの高さを入力 */
  display: block;
}
#calendar #calendar_con {}
#calendar #calendar_con #calendar_box {
  display: flex;
  flex-direction: column;
  gap: 50px;
}
/*----------------------------------------------------
	#calendar_month	　xxxx年xx月部分
----------------------------------------------------*/
#calendar #calendar_con #calendar_box #calendar_month {
  overflow: hidden;
  border-top: 2px solid #F2F2F2;
  border-bottom: 2px solid #F2F2F2;
  padding: 15px 0 15px 0;
  margin: 30px 0;
  position: relative;
}
#calendar #calendar_con #calendar_box #calendar_month h2.month {
  text-align: center;
  font-size: 1.6rem;
  font-weight: 700;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_l,
#calendar #calendar_con #calendar_box #calendar_month p.calendar_r {
  background-color: #5F7F9A;
  position: absolute;
  top: 15px;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_l {
  left: 0;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_r {
  right: 0;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_l a,
#calendar #calendar_con #calendar_box #calendar_month p.calendar_r a {
  color: #FFF;
  text-decoration: none;
  display: block;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_l a {
  padding: 5px 10px 5px 20px;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_r a {
  padding: 5px 20px 5px 10px;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_l a:after,
#calendar #calendar_con #calendar_box #calendar_month p.calendar_r a:after {
  position: absolute;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  top: 55%;
  transform: translatey(-50%);
  transition: .3s;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_l a:after {
  content: "\f104";
  left: 8px;
}
#calendar #calendar_con #calendar_box #calendar_month p.calendar_r a:after {
  content: "\f105";
  right: 8px;
}
/*----------------------------------------------------
	ご希望の日付・お部屋タイプ　部分
----------------------------------------------------*/
#calendar #calendar_con #calendar_box .txt {
}
#calendar #calendar_con #calendar_box .mark {
padding: 1em 0 1.5em;
}
#calendar #calendar_con #calendar_box .circle {
  color: #D34600;
}
#calendar #calendar_con #calendar_box .tri {
  color: #5F7F9A;
}
/*----------------------------------------------------
	table	テーブル
----------------------------------------------------*/
#calendar #calendar_con #calendar_box table {}
#calendar #calendar_con #calendar_box table a {
  clear: both;
  overflow: hidden;
  color: #505050;
  margin-top: 15px;
}
#calendar #calendar_con #calendar_box th {
  background: #EFEFEF;
  border: 1px solid #BCBCBC;
  font-weight: normal;
  padding: 5px;
  width: 25%
}
#calendar #calendar_con #calendar_box th.room_type {
  background: #FFFFFF;
  text-align: center;
  font-weight: bold;
}
#calendar #calendar_con #calendar_box td {
  text-align: center;
  border: 1px solid #BCBCBC;
  width: 20px;
}
#calendar #calendar_con #calendar_box td.border_none {
  text-align: center;
  border-top: none;
  border-bottom: none;
  width: 0;
  font-size: 0;
}
#calendar #calendar_con #calendar_box td.num {
  color: #5F7F9A;
}
#calendar #calendar_con #calendar_box td a.circle {
  color: #D34600;
}
#calendar #calendar_con #calendar_box td.tri {
  color: #5F7F9A;
}
#calendar #calendar_con #calendar_box td.sat {
  background-color: #E1E9EF;
}
#calendar #calendar_con #calendar_box td.sun {
  background-color: #EEE2DF;
}
/*======================================

	hack - 各種cssハック - for IE7

=======================================*/
*:first-child + html {}
/*======================================

	hack - 各種cssハック - for IE6

=======================================*/
* html {}
/*======================================

	LC追記

=======================================*/
#calendar td {
  vertical-align: middle;
}
.calendar_l img, .calendar_r img {
  vertical-align: middle;
}
#calendar #header .tel {
  padding-top: 0;
}
#calendar .subTitle {
  padding: 45px 0;
}
@media (max-width: 1000px) {
div.cal-wrap {
	overflow-x: scroll;
}
#calendar #calendar_con #calendar_box table {
	width: 100%;
	min-width: 1000px;
}
#calendar #calendar_con #calendar_box th {
}
#calendar #calendar_con #calendar_box th {
  position: sticky;
  top: 0;
  left: 0;
  background: none;
  border-left: none;
  border-right: none;
}
#calendar #calendar_con #calendar_box th:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background: #EFEFEF;
  border-left: 1px solid #BCBCBC;
  border-right: 1px solid #BCBCBC;
}
#calendar #calendar_con #calendar_box td {
}
}
@media (max-width: 768px) {
#calendar #calendar_con #calendar_box th {
width: 100px;
}
}