@charset "utf-8";
@import "style.css";

/*========================================================================================================================


  ◇◆◇ 施設空き状況 ◇◆◇
  
  
========================================================================================================================*/

/*-----------------------------------------------------------------------------------
  お問い合わせ先
-----------------------------------------------------------------------------------*/

.toiawase dt,
.toiawase dd {
  box-sizing:border-box;
}

.toiawase dd {
  border-left:1px solid #94bcde;
  border-right:1px solid #94bcde;
  border-bottom:1px solid #94bcde;
  padding:1em;
  padding:1rem;
}

.toiawase dd p.ad { line-height:1.5; }
.toiawase dd .pc-none { display:none; }

@media screen and (max-width:640px) {
  .toiawase dd p { padding-top:0.5rem; }
  .toiawase dd .pc-none { display:inherit; }
}


/*--------------------------------------------------------------------------------------------------*/

.cal {
  width:100%;
  box-sizing:border-box;
}

.cal table {
  width:100%;
  border-collapse:collapse;
}

.cal table thead th {
  text-align:center;
  padding:0.5em 0.75em;
  padding:0.5rem 0.75rem;
  border:1px solid #51565c;
  background-color:#51565c;
  color:#fff;
  line-height:1.4;
  font-size:125%;
}

.cal table thead td {
  text-align:center;
  border-left:1px solid #aaa;
  border-right:1px solid #aaa;
  background-color:#e4e4e4;
  font-weight:bold;
  padding:0.25em;
  padding:0.25rem;
}

.cal table td.cal-cell-gray { background-color:#f8f8f8; }
.cal table td.cal-cell-gray .date { color:#999; }
.cal table td.cal-cell-yellow { background-color:#fffcde; }
.cal table td.cal-cell-red { background-color:#ffeaea; }

.cal table tbody td {
  text-align:center;
  border:1px solid #aaa;
  vertical-align:top;
  height:75px;
}

.cal table tbody td .date {
  padding:0.25em 0.5em 0 0.5em;
  padding:0.25rem 0.5rem 0 0.5rem;
  text-align:left;
}

.cal-icon {
  width:26px;
  height:26px;
  display:inline-block;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:contain;
}

.cal-icon.ic00 { background-image:url(../../calendar/image/ic00.png); }
.cal-icon.ic01 { background-image:url(../../calendar/image/ic01.png); }
.cal-icon.ic02 { background-image:url(../../calendar/image/ic02.png); }
.cal-icon.ic03 { background-image:url(../../calendar/image/ic03.png); }

.no-backgroundsize .cal-icon.ic00 { background-image:url(../../calendar/image/ic00s.png); }
.no-backgroundsize .cal-icon.ic01 { background-image:url(../../calendar/image/ic01s.png); }
.no-backgroundsize .cal-icon.ic02 { background-image:url(../../calendar/image/ic02s.png); }
.no-backgroundsize .cal-icon.ic03 { background-image:url(../../calendar/image/ic03s.png); }

@media screen and (max-width:640px) {
  .cal table tbody td .date { font-size:90%; }
  
  .cal-icon {
    width:32px;
    height:32px;
  }
  
  .back-btn {
    text-align:center;
    padding-top:0.5rem;
    line-height:0;
  }
}


/*----------------------------------------------------------------------------------------------------

  部屋一覧
  
----------------------------------------------------------------------------------------------------*/

.roomList {
  width:100%;
  background-color:#eff5fa;
  padding:1.25em 1.5em 1.5em 1.5em;
  padding:1.25rem 1.5rem 1.5rem 1.5rem;
  box-sizing:border-box;
}

.roomList dt {
  font-weight:bold;
  padding-bottom:0.25em;
  padding-bottom:0.25rem;
}

.roomList dd {
  padding-top:0.25em;
  padding-top:0.25rem;
  padding-left:0.5em;
  padding-left:0.5rem;
}

.roomList dd ul {
  list-style:none;
}

.roomList dd ul li {
  width:33%;
  float:left;
}

.roomList dd li a {
  display:inline-block;
  position:relative;
  padding-left:0.75em;
}

.roomList dd li a:before {
  content:"";
  width:0;
  height:0;
  position:absolute;
  left:0;
  left:0;
  top:0.65em;
  border-left:5px solid #0d579a;
  border-top:4px solid transparent;
  border-bottom:4px solid transparent;
}

@media screen and (max-width:640px) {
  .roomList {
    width:100%;
    float:none !important;
  }
  
  .roomList dd ul li {
    width:100%;
    float:none;
  }
}