@charset "utf-8";
/* ===================================================================
 File Name  : calendar.css
 Style Info : 客室ページの予約カレンダーに関するスタイル指定
=================================================================== */

/* ---------------------------------------------------
  reset
------------------------------------------------------ */
table, tbody, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

/* ---------------------------------------------------
#calendar_col
------------------------------------------------------ */
#calendar_col h1 {
  text-align: center;
  font-size: 2.4rem;
  margin-bottom: 40px;
}
#calendar_col .calendar_489ban { display: flex; justify-content: center; }
#calendar_col .calendar { width: 340px; }
#calendar_col .calendar + .calendar { margin-left: 30px; }
#calendar_col .calendar th,
#calendar_col .calendar td { padding: 5px 0; border-collapse: collapse; border: 1px solid #cfcfcf; text-align: center; line-height: 1.5em; }
#calendar_col .calendar th:first-child,
#calendar_col .calendar td:first-child,
#calendar_col .calendar th:first-child a,
#calendar_col .calendar td:first-child a { color: #c64844; } /*日曜日*/
#calendar_col .calendar th:last-child,
#calendar_col .calendar td:last-child,
#calendar_col .calendar th:last-child a,
#calendar_col .calendar td:last-child a { color: #7a7eb4; } /*土曜日*/
#calendar_col .calendar th { background: #f1f1f1; }
#calendar_col .calendar td a { color: #74a6c2; }
#calendar_col .calendar_489ban + p { max-width: 1080px; margin: 15px auto 0; text-align: right; }
#calendar_col .calendar_489ban + p a { position: relative; box-sizing: border-box; text-decoration: underline; }
#calendar_col .calendar_489ban + p a:hover { text-decoration: none; }

@media screen and (max-width:767px) {
  #calendar_col h1 {
    font-size: 5.33vw;
    margin-bottom: 5.33vw;
  }
  #calendar_col .calendar_489ban { display: block; }
  #calendar_col .calendar { width: 100%; }
  #calendar_col .calendar + .calendar { margin: 30px 0 0; }
  #calendar_col .calendar_489ban + p { text-align: left; }
  #calendar_col .calendar_489ban + p,
  #calendar_col p:last-child { font-size: 14px; text-align: center; }
}