@charset "utf-8";
/* ==========================================================

オンライン仮予約 check CSS

2019/02/06 326_sakaguchi

========================================================== */

#cboxTopCenter,
#cboxMiddleRight,
#cboxBottomRight,
#cboxBottomCenter,
#cboxBottomLeft,
#cboxBottomLeft,
#cboxBottomLeft,
#cboxMiddleLeft,
#cboxTopLeft,
#cboxTopRight {
	background: none;
}

#cboxClose {
  display: none;
}

#mdl_cal h4 {
	border-bottom: 3px solid #d8b633;
	color: #000;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-size: 23px;
	font-weight: normal;
	letter-spacing: 0.1em;
	text-align: center;
	width: 100%;
}

#mdl_cal h4 span {
	/*background-image: linear-gradient(
    -45deg,
    #bd0b0b 25%,
    #c32222 25%, #c32222 50%,
    #bd0b0b 50%, #bd0b0b 75%,
    #c32222 75%, #c32222
  );*/
  background: #f3eac9;
  background-size: 6px 6px;
	display: block;
	line-height: 1.7em;
	margin-bottom: 1px;
}

#mdl_cal .nav_btn {
	margin: 0 auto;
	padding: 0.5em 0;
	overflow: hidden;
	width: 660px;
}

#mdl_cal .nav_btn .btn_golf_switch,
#mdl_cal .nav_btn .btn_hotel_switch {
  background: #128518;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #0F540F;
  border-radius: 3px;
  color: #fff;
  display: block;
  font-size: 14px;
  line-height: 2em;
  padding-left: 1.5em;
  position: relative;
  width: 250px;
	float: right;
}

#mdl_cal .nav_btn .btn_hotel_switch {
  background: #D9457A;
  border-bottom: 2px solid #AD1566;
  width: 210px;
}

#mdl_cal .nav_btn .btn_golf_switch::before,
#mdl_cal .nav_btn .btn_hotel_switch::before {
  background: #ffffff;
  height: 16px;
  left: 0.7em;
  margin-top: -8px;
  top: 50%;
  width: 16px;
  position: absolute;
  content: "";
}

#mdl_cal .nav_btn .btn_golf_switch.btn_checked::after,
#mdl_cal .nav_btn .btn_hotel_switch.btn_checked::after {
  border-left: 3px solid #D9457A;
  border-bottom: 3px solid #D9457A;
  height: 5px;
  left: 0.85em;
  top: 9px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  width: 9px;
  position: absolute;
  content: "";
}

#mdl_cal .nav_btn .btn_hotel_switch.btn_checked::after {
  border-left: 3px solid #128518;
  border-bottom: 3px solid #128518;
}


/*-------------------------------------------
 .prev .next ボタン
 -------------------------------------------*/
#mdl_cal .nav_btn #arrows {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  float: left;
  position: relative;
  width: 300px;
}

.slick_container {
  position:relative;
}

 .slick-prev,
 .slick-next {
  font-size: 16px;
  padding: 0.5em 0;
  position: absolute;
  width: 80px;
}
.slick-prev:before, .slick-next:before {
  content:"";
  display: none;
}

button.slick-prev, button.slick-next {
  z-index:2;
}

.cal_hotel .btn_slide_next,
.cal_hotel .btn_slide_prev {
  background: #D9569C;
  border-bottom: 3px solid #AD1566;
  border-radius: 3px;
  color: #fff;
  font-size: 16px;
  height: auto;
  position: absolute;
  text-align: center;
}

.cal_golf .btn_slide_next,
.cal_golf .btn_slide_prev {
  background: #128518;
  border-bottom: 3px solid #144B17;
  border-radius: 3px;
  color: #fff;
  font-size: 16px;
  height: auto;
  position: absolute;
  text-align: center;
}

.slick-next {
  left: 6em;
  top: 1em;
}

.slick-prev {
  left: 0;
  top: 1em;
}

button.slick-prev:hover ~ .btn_slide_prev,
button.slick-next:hover ~ .btn_slide_next{
  opacity: .8;
}

button.slick-prev:hover ~ .btn_gray_cal,
button.slick-next:hover ~ .btn_gray_cal {
  opacity: 1!important;
}
button.slick-prev:hover ~ .btn_gray,
button.slick-next:hover ~ .btn_gray {
  opacity: 1!important;
}

.btn_slide_next p,
.btn_slide_prev p {
  position: relative;
}

.btn_slide_prev p {
  padding-left: 0.5em;
}

.btn_slide_next p:before,
.btn_slide_prev p:before{
  background: url(/yoyaku/image/cmn/ico-btn-arrow.png) center center no-repeat;
  background-size: 0.4em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  right: 0;
  position: absolute;
  top: 0;
  transform: none;
  width: 1.5em;
}

.btn_slide_prev p:before {
  background: url(/yoyaku/image/cmn/ico-btn-arrow.png) center center no-repeat;
  background-size: 0.4em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(180deg);
  width: 1.5em;
}

.btn_gray_cal {
 display: none;
}

.btn_gray_cal p:before {
 display: none;
}

/*当月より前の月の場合ボタンをグレーにする .btn_slide_prevへ下記クラスを付与*/
.btn_gray {
  background: #969696!important;
  border-bottom: 3px solid #6f6f6f!important;
  color: #fff!important;
  cursor: default;
  pointer-events: none;
  user-select: none;
}

.btn_gray p:before {
  opacity: .5;
}

/*当月より前の月へスライドできないようbutton.slick_prev(../js/slick/slick.js)に下記クラスを付与*/
.invalid_slide {
  cursor: default;
  pointer-events: none;
}

/*前の月へスライドできない場合次の月へのボタンを左に寄せるクラス*/
.btn_fst {
  left: 0em;
  top: 1em;
}

/*-------------------------------------------
 閉じる ボタン
 -------------------------------------------*/
 #btn_close{
  background: url(/yoyaku/image/login/btn_login_close.gif) no-repeat right center;
  color: #000;
  display: block;
  margin: 0 auto;
  padding: 10px 0;
  width: 5em;
}

/*-------------------------------------------
 カレンダー（デフォルト）
 -------------------------------------------*/
.calendar {
  border: 2px solid #5D4037;
  margin: 0 auto;
  width: 660px;
}

.cal_title_block {
  padding: 0.3em 1em;
  position:relative;
}

.mouth_block {
  align-items: baseline;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  float: left;
  width: 240px;
}

.mouth_block h5 {
  color: #964B5F;
  font-size: 30px;
  font-weight: normal;
  margin-right: 0.3em;
}

.mouth_block h5 span {
  font-size: 50px;
}
.flex{
	display: flex;
}
.dates_block {
  position:absolute;
  top:0;
  right:0px;
  border-radius: 5px;
  margin-top: 0.5em;
  padding: 0.5em 1em;
  width: 210px;
}
.marutoku_block{
  position:absolute;
  top:0;
  right:250px;
  border-radius: 5px;
  margin-top: 0.5em;
  padding: 0.5em 1em 0.5em 0;
  width: 130px;
  color:#fff;
 text-align:center;
}

.marutoku_block p:before{
  background: url(/yoyaku/image/cmn/ico-btn-arrow.png) center center no-repeat;
  background-size: 0.4em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  left: 123px;
  position: absolute;
  top: 0;
  transform: none;
  width: 1.5em;
}
.marutoku_block a{
 color:#fff;
}
.marutoku_block a:hover{
 opacity:0.75;
}
.cal_hotel .dates_block {
  background: #D9569C;
}

.cal_golf .dates_block {
  background: #317521;
}
.cal_golf .marutoku_block {
  background: #c21352;

}
.dates_block dl {
  color: #fff;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
}

.dates_block dl dt {
  margin: 0 0.5em;
}

.dates_block dl dd:not(:last-of-type) {
  margin-right: 1em;
}

.calendar table {
  border-top: 1px solid #A1887F;
  width: 100%;
}

.calendar table th {
  border-right: 1px solid #A1887F;
  font-size: 14px;
  font-weight: normal;
  padding: 0.3em 0;
  text-align: center;
}

.calendar table tr:not(:last-of-type) {
  border-bottom: 1px solid #A1887F
  ;
}

.calendar table th:last-of-type {
  border: none;
}

.calendar table th span {
  font-size: 90%;
}

.calendar table th.sunday {
  color: #d03a3b;
}

.calendar table th.satday {
  color: #5f95ad;
}

.calendar table td {
  border-right: 1px solid #A1887F;
  height: 75px;
  text-align: center;
  vertical-align: top;
  width: 90px;
}

.calendar table td:last-of-type {
  border: none;
}
.calendar table td a {
  display: block;
  background: #f8f4d1;
 background-size: cover;
  color: #000;
  height: 100%;
}

.calendar table td a.btn_holiday {
  background: #fbe4ea;
 height:100%;
}

.calendar table td a.btn_satday {
  background: #e2f5fb;
 height:100%;
}

/*.calendar table td a {
  display: block;
  background: url(/yoyaku/image/calendar/img_parts_s.png) #f8f4d1 no-repeat 4px 1px;
  background-size: cover;
  color: #000;
  height: 75px;
}

.calendar table td a.btn_holiday {
  background: url(/yoyaku/image/calendar/img_parts_s.png) #fbe4ea no-repeat 4px 1px;
}

.calendar table td a.btn_satday {
  background: url(/yoyaku/image/calendar/img_parts_s.png) #e2f5fb no-repeat 4px 1px;
}
*/

.calendar table td a:hover {
  opacity: .6;
}

.calendar table td div {
  padding: 0.5em 0.3em;
 height:85px;
 position:relative;
}
.calendar table td div p.icon{
 position:absolute;
 top: 29px;
 left:2px;
 width:95%;
 padding:5px 0;
 background:#c21352;
 color:#fff;
}

.calendar table td div .date {
  border-bottom: 1px solid #A1887F;
  font-size: 14px;
  font-weight: bold;
  padding-bottom: 3px;
}

.calendar table td a.btn_holiday div .date {
  color: #ff3366;
}

.calendar table td a.btn_satday div .date {
  color: #6699CC;
}

/*.calendar table td div .status {
  border-top: 1px solid #fff;
  color: #1717FB;
  font-family: 'MS PGothic', arial, helvetica, sans-serif;
  font-size: 25px;
  padding: 0.5em 0 0;
}*/
.calendar table td div .status {
  /*border-top: 1px solid #fff;*/
  color: #1717FB;
  font-family: 'MS PGothic', arial, helvetica, sans-serif;
  font-size: 25px;
  padding: 0.5em 0 0;
 position:absolute;
 top:40%;
 left:35%;
}
.calendar table td div .status.fri,
.calendar table td div .status.mon{
 position:absolute;
 top:54px;
 left:35%;
}

.calendar table td div .status.unavailable {
  color: #000;
}

@media screen and (max-width: 1024px) {
  .calendar table td {
    height: 66px;
  }
  .calendar table td a {
    height: 66px;
  }
  .calendar table td div .status {
    padding: 0.15em 0 0;
  }
}



/*-------------------------------------------
 カレンダー（宿泊／ゴルフの空枠も一緒に見る）
 -------------------------------------------*/
 .calendar table td div dl {
  align-items: center;
  border-top: 1px solid #fff;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 0.5em 0 0;
  overflow: hidden;
  width: 5em;
 }

.calendar table td div dl dt {
  font-size: 14px;
  margin-bottom: 0.4em;
  padding-left: 1em;
  position: relative;
  width: 3.5em;
}
.calendar table td div dl dt.status_hotel:before {
  background: url(../image/ico-status-hotel.png) center center no-repeat;
  background-size: 1em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  left: -10px;
  position: absolute;
  top: 0;
  transform: none;
  width: 1em;
}

.calendar table td div dl dt.status_golf:before {
  background: url(../image/ico-status-golf.png) center center no-repeat;
  background-size: 1em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  left: -10px;
  position: absolute;
  top: 0;
  transform: none;
  width: 1em;
}
.calendar table td div dl dd.status {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  width: 1em;
}
.calendar table td div dl dt.status_golf {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  /* width: 1em; */
  position:
  absolute;
  top:45px;
  left: 20px;
}
.calendar table td div dl dt.status_hotel {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  position:absolute;
  top:65px;
  left:20px;
}
.calendar table td div dl dt.status_golf_toku {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  /* width: 1em; */
  position:
  absolute;
  top:60px;
  left: 20px;
}
.calendar table td div dl dt.status_hotel_toku {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  position:absolute;
  top:80px;
  left:20px;
}
.calendar table td div dl dt.status_hotel_toku:before {
  background: url(../image/ico-status-hotel.png) center center no-repeat;
  background-size: 1em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  left: -10px;
  position: absolute;
  top: 0;
  transform: none;
  width: 1em;
}

.calendar table td div dl dt.status_golf_toku:before {
  background: url(../image/ico-status-golf.png) center center no-repeat;
  background-size: 1em;
  border: none;
  bottom: 0;
  content: "";
  display: block;
  left: -10px;
  position: absolute;
  top: 0;
  transform: none;
  width: 1em;
}
.calendar table td div dl dd.status02 {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  width: 1em;
  position:absolute;
  top:46px;
  right:5px;
}
.calendar table td div dl dd.status03 {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  width: 1em;
  position:absolute;
  top:67px;
  right:5px;
}
.calendar table td div dl dd.status04 {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  width: 1em;
  position:absolute;
  top:60px;
  right:5px;
}
.calendar table td div dl dd.status05 {
  border-top: none;
  font-size: 14px;
  margin-bottom: 0.4em;
  padding: 0;
  text-align: center;
  width: 1em;
  position:absolute;
  top:80px;
  right:5px;
}
@media screen and (max-width: 1024px) {
  .calendar table td div {
    padding: 0.4em 0.3em 0;
  }

  .calendar table td div dl {
    padding: 0.15em 0 0;
  }

  .calendar table td div dl dt {
    margin-bottom: 0.2em;
  }
}



/*-------------------------------------------
  本日及び明日のご予約について　モーダル
 -------------------------------------------*/
#dialog_tel {
  padding: 1em;
}

#dialog_tel .txt_ttl {
  font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 23px;
  line-height: 1.3em;
  margin-bottom: 1.5em;
  text-align: center;
 }

#dialog_tel ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin: 0 auto;
  width: 500px;
}

#dialog_tel ul li {
  width: 230px;
}

#dialog_tel ul li span {
  background: #C04C4D;
  border-radius: 20px;
  color: #fff;
  display: block;
  font-size: 14px;
  line-height: 1.5em;
  margin-bottom: 1em;
  padding: 0 0.5em;
  text-align: center;
}

#dialog_tel ul li:last-child span {
  background: #4261A4;
}

#dialog_tel ul li .txt_tel {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}