html, body {
  height: 100vh;
  overflow-x: hidden;
}

.topmenu {
  position: relative;
  display: inline-block;
  top: 1.3rem;
  left: 1.5rem;
  z-index: 20;
}
.topmenu-icon {
  font-size: 1.8rem; 
  color: white; 
  cursor: pointer;
  text-shadow: 0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25);
}
.topmenu-content {
  display: none;
  position: absolute;
  background-color: rgba(29, 29, 29, 0.85);
  min-width: 160px;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  border-radius: 6px;
  z-index: 21;
}
.topmenu-content a, .footmenu-content a {
  font-size: 1.1rem;
  color: rgb(255, 255, 255);
  padding: 16px 16px;
  text-decoration: none;
  display: block;
}
.topmenu-content a:hover, .footmenu-content a:hover {background-color: rgba(255, 255, 255, 0.15);}
.topmenu:hover .topmenu-content, .footmenu:hover .footmenu-content, .footmenu_room:hover .footmenu-content, .footmenu_map:hover .footmenu-content {
  display: block;
}

#top-contact-icon {
  /*position: fixed;*/
  position: absolute;
  color: #ffffff; z-index: 20;
  right: 1.3rem; top: 1.1rem;
}
.top-icon-line {
  float: right; border: 0;
  width: 32px; cursor: pointer;
}
.footmenu-content {
  display: none;
  position: absolute;
  background-color: rgba(29, 29, 29, 0.85);
  min-width: 150px;
  width: 20%;
  border-radius: 6px;
  bottom: 60px;
  font-size: 1rem;
  /*z-index: 11;*/
}

.bg-light {
  background-color: rgba(255,255,255,0.8) !important;
}

#headbox {
  position: relative; /* Make it stick/fixed */
  top: 0; /* Hide the navbar 50 px outside of the top view */
  width: 100%; /* Full width */
  height: 68px;
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
  z-index: 10;
}

#headbox h1 {
	color: #ffffff;
  text-shadow: 0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25);
/*
  font-weight: 300;
  font-size: 2.8rem;
	margin-left: 1.5rem;
	margin-top: 1.5rem;
*/
	font-size: 1.8rem;
	font-weight: 400;
	margin-left: 3.9rem !important;
	margin-top: -0.8rem !important;
}

.footer {
  width: 100%; position: fixed; bottom: 0; z-index: 20;
  padding-top: 0rem; padding-bottom: 0rem;
  background-color: rgba(22, 22, 22, 0.75);
  /* backdrop-filter: blur(500px); */
  transition: top 1s;
}
.footer ul {
  width: 100%;
  max-width: 800px;
  margin: 0 auto; padding: 0;
	display: flex;
  flex-wrap: wrap;
}
.footer ul > li {
  list-style: none; /*border: 1px solid rgba(255, 255, 255, 0.353);*/
  text-align: center; padding-top: 0.4rem; padding-bottom: 0.4rem;
  color: #ffffff;
  flex: 20%;
  max-width: 20%;
	flex-wrap: wrap;
}
.footer ul > li:last-child {border-right: 0;}
.footer i.foot-icon {
  font-size: 1.2rem;
}
.footer .foot-icon-line {
width: 44px;
}
.footer ul > li a {
  cursor: pointer;
  color: rgba(255, 255, 255, 0.45);
  text-decoration: none;
}
.footer ul > li a:hover {
  cursor: pointer;
  color: #ffffff;
}
.footer ul > li a.actived {
  cursor: pointer;
  color: #ffffff;
}

.ModalCloseXMark {
  font-size: 1.6rem;
  font-weight: 200;
  color: #fff;
  cursor: pointer;
  vertical-align: middle;
  text-align: right;
  justify-content: flex-end;
}

.border1 {
	border: 1px solid silver;
}
.bordertop {
	border-top: 1px solid silver;
  padding-top: 8px;
}
.borderbottom {
	border-bottom: 1px solid silver;
  padding-bottom: 8px;
}

.hide {display: none;}

.bgcolor-line {background-color: #06C755; border: 1px solid #06C755;}
.color-line {color: #06C755;}
.fa-line {color: #06C755;}
.fa-facebook-square {color: rgb(2, 119, 240);}

.form-control::-ms-input-placeholder {
  font-size: 0.9rem;
  color: #bebebe;
  opacity:1;
}

.datepicker {
  /*
	border-radius: 10px;
	border: 1px solid #9f9f9f;
	box-shadow: 0 0 0 0 !important;
	-webkit-box-shadow: 0 0 0 0 !important;
  */
}
.datepicker__month {
	font-size: 0.9rem;
}
.datepicker__month-day {
	/*font-size: 0.9rem;*/
	/*border-radius: 8px;*/
}
.datepicker__month-day--today {
	background-color: #d3d3d3;
}
.datepicker__month-day--valid {
	color: #535353;
}
.datepicker__month-day--first-day-selected, .datepicker__month-day--last-day-selected, .datepicker__month-day--selected {
	color: #ffffff;
}

.price-checker {
 float: inline-start;
 left: 0;
 margin-top: 0;
}
.price-checker:after {
  display: block; clear: both;
}
.box-guest-pad {
  border-bottom: 1px solid rgb(220, 220, 220);
  width: 15rem;
  padding: 10px;
  /*border-radius: 12px;*/
	/*align-items: center;
	justify-content: flex-start;*/
	/*display: flex;*/
	margin: 0.5rem auto 0 auto;
}
.box-guest-pad label.GuestNumberLabel {
	text-align: start;
  font-size: 1.2rem;
	margin-right: 0.7rem; margin-bottom: 0;
	line-height: 110%;
}
.box-guest-pad label span, .form-check label span {
	display: block;
	font-size: 0.7rem; color: rgb(160, 160, 160);
}
.GuestNumber {
  justify-content: flex-end;
	border: 0px solid silver;
}
.minus, .plus {
	cursor: pointer;
	width: 32px;
	height: 32px;
  color: #888;
	background: #ffffff;
	border-radius:16px;
	padding: 1px 4px 4px 4px;
	border: 2px solid rgba(230,230,230,1);
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  margin-left: 0 !important; margin-right: 0 !important;
}
.GuestNumberShow {
	height: 36px;
  width: 2.8rem;
  text-align: center;
  font-size: 1.18rem;
	border: 0; padding: 0 !important;
  margin-left: -6px !important; margin-right: -6px !important;
	/*border-radius: 4px;*/
  display: inline-block;
  vertical-align: middle;
  background-color: transparent;
}
.for_wholehouse_option {
  
}
.box_plusitems {
  width: auto;
}
.wholehouse_switch {
  padding: 0.5rem 0.5rem 0 0.5rem;
  margin-left: 2.5rem;
  align-items: center;
}
.empty_say_icon {
  font-size: 5rem; color: #888;
  text-align: center;
  margin: 1rem auto 1rem auto;
}

.status_off {opacity: 40%; cursor: default;}

#lightbox_complete, #showup_messagebox {
  display: none;
  border-radius: 20px;
  padding: 1.6rem 2rem 1rem 2rem;
  z-index: 1111;
  position: fixed;
  top: 50%;
  left: 20%;
  transform: translateX(-20%) translateY(-50%);
  background-color: rgb(0, 0, 0, 0.65);
  color: white;
  text-align: center;
  font-weight: 500;
}
#lightbox_complete i, #showup_messagebox i {
  font-size: 6rem;
}
#lightbox_complete h5, #showup_messagebox h5 {
  color: #fff;
  margin-top: 0.8rem;
  font-size: 1.2rem;
  font-weight: 400;
}

.right {text-align: right;}
.center {text-align: center;}
.prices {color: rgba(4, 161, 97, 1);}
.bold {font-weight: bold;}

/*
.contents {
  position: absolute;
  top: 0;
  width: 100%;
  padding: 0 0 90px 0;
}
*/

/* for desktops */
@media (min-width: 1280px){
}

/* for phone */
@media (max-width: 574.98px){
  #headbox h1 {
  	/* font-size: 1.7rem; */
    /* font-size: 2.38rem; */
  }
}

