@charset "UTF-8";

/** ▼をクリックできるように見せるために */
SELECT{z-index: 2;}

.boxList>li>a:hover,.boxList>li>button:hover{
	-webkit-transform: unset; -moz-transform: unset; -ms-transform: unset; -o-transform: unset;
}

.container{padding-top:10px;margin-top:10px;}

/** 検索ボタン */
.mynewbook_dates_page .btn a{ width: 500px; padding: 20px;}

/** コテージ・キャビン・テントのタブ */
.faciTabs button.active{height:80px;    border-bottom-left-radius: 0;border-bottom-right-radius: 0;}
.faciTabs button.active:after{content: "";display:block;height:16px;}

.faciListHeadColorLine{height:10px;}
/** 施設一覧表示div */
.panels{background-color:white;}
/** 予約可能な施設がない場合に表示するメッセージ */
.boxList li.emptyLine {width: 550px;}

/** 施設詳細のtable */
.popbox table{margin:auto;}

/* 施設一覧無効処理 */
.boxList .disable {opacity: 0.3; filter: grayscale(1); }
.disable img{filter: grayscale(1);}
.boxList>li .disable .txt {opacity: 0.3; filter: grayscale(1); }

/* 施設リストのth（定員・広さ・料金） */
table.txt th{ min-width:60px;}

/* 施設リスト ペットOKアイコン(ドッグランアイコン) */
.dogokIcon { position: absolute; font-size: 300%; right: 0px; top: 0px; margin: 10px; color: #440000; background: #f5deb3; border-radius: 40px; }
.dogokFlg{ position: absolute; top: 60%; font-size: 40%; color: #ea5614; font-weight: bolder; right:0; }

/** 戻るボタン */
.backbtn{ display: inline-block; border-radius: 10px; background: #1793BA; color: #fff; font-size: 100%; padding: 10px 20px; margin: 20px 10px; }


/** --- モーダル ---*/

/** 人数入力モーダル 縦横サイズ */
/* .mypagePseudoPopupBox.InputNum{ height:800px; animation: appear 0.5s ease;  } */
/* .mypagePseudoPopupBox.InputNum .numTable{width:100%;} */
/** モーダルタイトル */
.mdwttl { font-size: 140%; text-align: center; margin: 20px auto 10px auto; }
/** モーダルサブタイトル */
.mdwsubttl { font-size: 140%; margin: 20px auto 10px auto; }
/** モーダルコンテンツ */
.mdwContents{ margin:20px 0px;}
/** モーダル 人数・頭数・台数 入力フォーム */
.numTable td div{ background: #F1F1F1; padding: 5px 5px 5px 20px; }

/** 車両サイズ入力フォームブロック */
.carSizeInputBlock{text-align:center;}
/** 車両サイズ入力モーダル 縦横サイズ */
.mypagePseudoPopupBox.Confirmation{ height:560px; }
/** 車両サイズ入力フィールド */
input[type=number].changeCarsize{ background-color: #fafafa; border-style: solid; border-color: #e1e1e1; border-width: 1px; width:110px; padding:10px;}
.reserved .page .infoPart dl.mypagecarclm dd.carsizebox{ width: 420px; margin-left:64px; border-top: 2px solid #fff; }
/** 車両サイズエラーメッセージ */
#carsizeErr{ display:none; }
.carsizemsg{ margin:20px; }
.carsizeDiv{ display:inline-block; }
.numTable td div.carsizeDivTani{ display:inline-block; margin-right:5px; padding:0px;}
.carSizeInputBlock .carsizeDivTani{ display:inline-block; margin-right:10px;}


/** 既に予約がある表示用 */
#isRsv{ width:600px; background:#FFF; margin:auto; }
.haveRsvMsg{padding:5px; background:#FFC;}
.rsvLine{margin-bottom:10px;}
.rsvTxt{padding:10px 0px;}

/** モーダルにイベントを付ける */
@keyframes appear {
  0%{
    transform: scale(0);
  }
  100%{
    transform: scale(1);
  }
}

/** スマホ用 */
@media(max-width:640px ){
	.container{padding-top:10px;margin-top:10px;}

	/** スマホ 施設リストにpadding追加 */
	.boxList>li { padding: 20px; }

	/* スマホ　ドッグランアイコン */
	.dogokIcon { font-size:500%; }
}