@charset "UTF-8";
a:hover {
	color: unset;
}
html, body {
	background: #000000;
}
small, .small {
    font-size: 80%;
}
/*body.salvatore article.item-page, body.place article.item-page{overflow: visible}*/
.entry-header {
	margin-bottom: 0px;
}
.button.special {background:#4A7394;-webkit-transition: color 400ms, background-color 400ms, border-color 400ms;
-o-transition: color 400ms, background-color 400ms, border-color 400ms;
transition: color 400ms, background-color 400ms, border-color 400ms;}
.button.special:hover {background:#3A5F7D;-webkit-transition: color 400ms, background-color 400ms, border-color 400ms;
-o-transition: color 400ms, background-color 400ms, border-color 400ms;
transition: color 400ms, background-color 400ms, border-color 400ms;}
.picker__list-item--highlighted:hover, .picker--focused .picker__list-item--highlighted {background: #3A5F7D;border-color: #3A5F7D;}
.picker__list-item:hover {background: #8AAFCD;
border-color: #8AAFCD;}
.notice {
	background: #fff;
	color: #3A5F7D;
	z-index: 20;
	text-align: center;
	padding: 0.5em 0.25em;
	border-radius: 5px !important;
	margin-top: 5px;
	border:1px solid #3A5F7D
}
.notice:hover {color: #3A5F7D;}
.btn-notice{
	background: #3A5F7D;
	color: #fff;
	z-index: 20;
	text-align: center;
	padding: 0.5em 0.25em;
	border-radius: 5px !important;
	margin-top: 5px;
	border:1px solid #3A5F7D
}
.btn-notice:hover {color: #fff;}
.specslider:after {
	content: "";
	background: linear-gradient(165deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 100%);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}
.logomark {
  position: absolute;
  top: 0;
  left: 50%;
  width: 85px;
  background: rgba(255, 255, 255, 0.75);
  z-index: 200;
  padding: 10px;
  border-radius: 0px 0px 10px 10px !important;
  transform: translateX(-50%);
}
.logomark.horizontal {
  position: absolute;
  top: 0;
  left: 50%;
  width: 150px;
  background: rgba(255, 255, 255, 0.75);
  z-index: 200;
  padding: 10px;
  border-radius: 0px 0px 10px 10px !important;
  transform: translateX(-50%);
}
#noResultsMessage {
	background: rgba(74, 115, 148, 0.2);
	text-align: center;
	width: 100%;
	padding: 20px;
	display: none;
}
#noResultsMessage h2 {
	font-size: 22px;
}
#sp-main-body .sp-column {
	background: #ffffff;
	display: grid;
}
body.place small {
	line-height: normal;
}
small.minguarantee{margin-top:10px;}
h3, .h3 {
	font-size: 2.5rem;
	line-height: 1.15em;
}
h4, .h4 {
	font-size: 2rem;
	margin-bottom: 5px;
}
body.place .bordered {}
.facilities table th {
	border-top: none;
	background: transparent;
	font-weight: normal;
}
.facilities table td {
	vertical-align: middle;
	transition: all 0.15s ease;
	border-top: 1px solid rgba(0, 0, 0, 0.8);
}
.facilities table tr:hover td {
	background: #eef2f5;
	transition: all 0.15s ease;
}
.custom-modal .facilities .title-back {
	margin-top: 1em;
}
body.place .bluebordered {
	border: 2px solid #4A7394 !important;
	background: rgba(74, 115, 148, 0.2) !important;
	color: #4A7394;
	margin: 3em 0 4em 0;
	padding: 2em 4em;
}
body.place .bluebordered:hover {
	background: rgba(74, 115, 148, 0.2) !important;
}
body.place #sp-place-infos .container .sp-column, body #sp-main-body .container .sp-column {
	padding: 0 !important
}
.sp-column div.framed {
	padding: 5em 6em 5em 6em;
}
.sp-column div.framed1 {
	padding: 5em 6em 0em 6em;
}
.sp-column div.framed2 {
	padding: 0em 6em 5em 6em;
}
.sp-column div.smallframed {
	padding: 30px 15px 15px 15px;
}
body.place .entry-image.full-image {
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	transform: translate(-50%, -50%);
}
body.place .entry-image.full-image img {
	height: auto;
	width: 200px;
}
body.place #sp-title {
	margin-top: 0px;
}
#sp-page-title{overflow:hidden;}
#sp-menu .partymenu .sp-dropdown {
	width: intrinsic !important;
	width: -moz-max-content !important;
	width: -webkit-max-content !important;
}
#results {
	background: rgba(74, 115, 148, 0.2);
	padding: 3rem;
	margin: 5em 0 0 0;
}
#results h2 {
	margin-top: 2em;
	margin-bottom: 2em;
}
#options .row > div {
	margin-bottom: 1em;
}
.rl_tabs > ul.nav-tabs > li.active {
	background: tranparent;
}
.rl_tabs > ul.nav-tabs {
	background: transparent
}
.rl_tabs > ul.nav-tabs > li.active:after, .rl_tabs > ul.nav-tabs > li.active:before {
	display: none;
}
.rl_tabs > ul.nav-tabs > li {
	opacity: 1 !important
}
#gallery .row {
	margin-left: 0px;
	margin-right: 0px;
	border-radius: 20px !important;
	overflow: hidden;
}
#gallery .row > div {
	padding-left: 0px;
	padding-right: 0px;
	overflow: hidden;
}
#brands .rl_tabs > ul.nav-tabs > li {
	background: #B5B5B5;
	flex: 1;
	min-width: 0;
	display: flex;
}
#brands .rl_tabs > ul.nav-tabs > li.active {
	background: #000000;
}
#brands .rl_tabs > ul.nav-tabs > li img {
	width: auto;
	height: 25px;
	display: table;
	margin: 0 auto;
}
#brands .rl_tabs > ul.nav-tabs > li a {
	padding: 20px 10px;
	min-width: unset;
	width: 100%;
}
#brands .rl_tabs > ul.nav-tabs:after {
	display: none;
}
.title-back {
	position: relative;
	font-size: 3.25em;
	font-weight: 500;
	text-align: center;
	z-index: 1;
	line-height: 150px;
	letter-spacing: 0.2em;
	font-family: 'Noto Sans JP', sans-serif;
	margin: 1em 0;
}
.title-back:before {
	content: attr(data-back);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: rgba(0, 0, 0, 0.05);
	white-space: nowrap;
	pointer-events: none;
	z-index: -1;
	font-family: "Cinzel", serif;  
	font-weight: 600;
	font-size: clamp(60px, 10vw, 105px);
	letter-spacing: 0.05em;
}
#venue .title-back:before {
	letter-spacing: 0em
}
body #sp-page-title .sp-page-title h1 {
	texat-align: center;
}
#brands .tab-content {
	margin-top: -1px;
	background: #000;
	color: #fff;
	padding: 5em;
}
#brands .tab-content #xex .xex-list {
	display: flex;
}
#brands .tab-content #xex .xex-list > div {
	flex: 1;
}
#brands .tab-content #xex .button {
	color: #fff;
	background: #000;
	border: 1px solid #fff;
	padding: 0.5em;
	width: 100%;
	display: block;
	text-align: center;
	transition: all 0.15s ease;
}
#brands .tab-content #xex .button:hover {
	color: #000;
	background: #fff;
	border: 1px solid #fff;
	transition: all 0.15s ease;
}
#brands .tab-content h2 {
	margin-top: 2em;
	text-align: center;
	letter-spacing: 3px;
}
.rl_tabs-toggle.nn_tabs-toggle {
	display: grid !important;
}
.nav-tabs#set-rl_tabs-1 {
	display: flex !important;
	align-items: center;
	gap: 2em;
}
.nav-tabs:before, .nav-tab s:after {
	content: none !important;
}
.bx-pager {
	text-align: center;
}
.slider-brand + .bx-controls .bx-pager-item, .owl-theme .owl-dots .owl-dot span {
	border-radius: 50% !important;
	background: #ffffff !important;
	opacity: 0.5;
}
.slider-floor.owl-theme .owl-dots .owl-dot span {
	border-radius: 50% !important;
	background: #000000 !important;
	opacity: 0.25;
}
#venue .owl-theme .owl-dots .owl-dot span {
	background: #000000 !important;
}
#venue .owl-theme .owl-nav {
	display: none;
}
.owl-theme .owl-dots .owl-dot.active span {
	opacity: 1
}
.owl-dots {
	margin-top: 15px;
}
.slider-brand .owl-nav {
	position: absolute !important;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	pointer-events: none;
}
.slider-brand .owl-nav button.owl-prev, .slider-brand .owl-nav button.owl-next {
	position: absolute !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	background: rgba(0, 0, 0, 0.4) !important;
	color: white !important;
	font-size: 40px !important;
	width: 50px !important;
	height: 50px !important;
	line-height: 50px !important;
	border-radius: 50% !important;
	text-align: center !important;
	pointer-events: auto;
	transition: all 0.3s ease;
}
.slider-brand .owl-nav button.owl-prev {
	left: -60px !important;
}
.slider-brand .owl-nav button.owl-next {
	right: -60px !important;
}
.slider-wrapper {
	position: relative;
	width: 100%;
	padding-top: 61.111%;
	overflow: visible !important;
	background: #000;
	margin-bottom: 30px;
}
.slider-brand {
	position: absolute !important;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
.slider-brand .owl-stage-outer, .slider-brand .owl-stage, .slider-brand .owl-item, .slider-brand .owl-item img {
	height: 100% !important;
}
.slider-brand img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.slider-brand.owl-height {
	transition: height 0.4s ease;
}
.slider-brand .owl-nav button span {
	display: none !important;
}
.tab-content .rl_tabs-pane, .tab-content .nn_tabs-pane {
	transition: opacity 0.4s ease-in-out;
	opacity: 0;
	animation: tagIn 0.25s ease;
}
.tab-content .rl_tabs-pane.active, .tab-content .nn_tabs-pane.active {
	opacity: 1;
}
.tab-content .rl_tabs-pane[hidden], .tab-content .nn_tabs-pane[hidden] {
	opacity: 0;
}
#access .address tr td {
	border-bottom: 1px solid #B5B5B5;
	padding: 23px 5px
}
.background-blue {
	background: #4A7394;
	color: #fff;
	padding: 1em 6em 5em 6em;
}
.background-blue .title-back:before {
	color: rgba(255, 255, 255, 0.1);
}

.background-blue .btn {
	padding: 15px;
	color: #4A7394;
	margin-top: 10px;
	width: 100%;
	font-size: 15px;
	background: #fff;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.25);
	transition: all 0.25s ease;
}
.background-blue .btn:hover {
	box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.75);
	transform: translateY(-2px);
}
.form-container {
	border: 2px solid #4A7394;
	padding: 5rem;
	background-color: #ffffff;
	margin: 2rem auto;
}
.form-container .title {
	font-size: 2rem;
	margin-bottom: 2.5rem;
	text-align: center;
	margin-top: 0
}
.setsume {
	font-size: 2rem;
	line-height: 3rem;
}
.description {font-size: 1.5rem;}
.description strong {font-size: 2rem; font-weight: normal;	line-height: 3rem;}
#search .rl_tabs > ul.nav-tabs:after {
	display: none;
}
#search .rl_tabs > ul.nav-tabs > li {
	flex: 1;
}
#search .rl_tabs > ul.nav-tabs > li a {
	min-width: 100% !important;
}
#search .rl_tabs > ul.nav-tabs > li a {
	background-color: #ededed;
	color: #383838;
	border: 2px solid #ededed;
	padding: 2rem 1.5rem;
	transition: all 0.25s ease;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	font-weight: normal;
}
.form-container .option-btn {
	background-color: #ededed;
	color: #383838;
	border: 2px solid #ededed;
	padding: 1rem 1rem;
	transition: all 0.25s ease;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
}
#search .rl_tabs > ul.nav-tabs {
	display: flex;
	gap: 30px;
}
#search .rl_tabs > ul.nav-tabs > li.active {
	background: transparent !important
}
#search .rl_tabs > ul.nav-tabs > li.default a {
	background: rgba(74, 115, 148, 0.2);
	border: 2px solid rgba(74, 115, 148, 0);
}
#results_container li {
	opacity: 0;
	transform: translateY(1em);
	transition: opacity 0.4s ease, transform 0.4s ease;
	padding-left: 10px;
	padding-right: 10px
}
#results_container.show li {
	opacity: 1;
	transform: translateY(0);
	transition-delay: calc(var(--i) * 0.08s);
}
#results_container ul.row > li {
	padding: 1em;
}
#results_container ul.row > li > * {
	width: 100%;
}
#results_container ul.row > li .logos {
	height: 50px;
	width: auto;
	display: table;
	margin: 1em auto;
}
#results_container ul.row > li .details {
	font-size: 11px;
	line-height: 1.25em;
	min-height: 3.75em;
	align-items: center;
	display: flex;
}
#results_container ul.row > li .infos {
	background: #fff;
	padding: 5px;
	border-radius: 8px !important;
	text-align: center;
}
#results_container ul.row {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	justify-content: center;
}
#results_container ul.row > li:hover {
	background: #ffffff;
	transition: all 0.3s ease;
	border-radius: 8px !important
}
#results_container ul.row > li:hover a {
	color: #000000
}
#results_container ul.row > li:hover a .infos {
	background: #4A7394;
	color: #ffffff;
}
a.planbutton {
	background: #4A7394;
	color: #ffffff;
	padding: 0.75em 3em;
	border-radius: 5px !important;
	text-align: center;
	transition: all 0.25s ease;
	border: 2px solid #4A7394;
	margin-top: 1em;
	margin-left: auto;
	margin-right: auto;
	display: table;
}
a.planbutton2 {
	margin-top: 10px;
	background: #4A7394;
	color: #ffffff;
	padding: 0.75em 3em;
	border-radius: 5px !important;
	text-align: center;
	transition: all 0.25s ease;
	border: 2px solid #4A7394;
	margin-left: auto;
	margin-right: auto;
	display: table;
}
.shop-card button, #plan button {
	background: #4A7394;
	color: #ffffff;
	padding: 0.75em 4em;
	border-radius: 5px !important;
	text-align: center;
	transition: all 0.25s ease;
	border: 2px solid #4A7394;
	margin-top: 2em;
	margin-bottom: 2em;
}
#plan button {width:100%;margin-bottom: 0em;}
.shop-card button {
	display: inline;
	opacity: 0;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
a.active .shop-card button {
	opacity: 1;
	transition: all 0.25s ease;
}
a.planbutton:hover, a.planbutton2:hover, #plan button:hover {
	transition: all 0.25s ease;
	background-color: #3A5F7D;
}
.plan-row {
		display: flex;
		flex-wrap: wrap;
}

.plan-row > [class*="col-"] {
		display: flex;
}

.plan-row > [class*="col-"] > a {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 20px;
		background: #fff;
}
.plan-row > [class*="col-"]:hover > a {
  background: #eef2f5;
}
.plan-row img {
		width: 100%;
		height: auto;
}

.plan-row h4 {
		margin-top: 20px;
}

.plan-row h2 {
		margin-bottom: 20px;
}

/* Push the button to the bottom */
.plan-row button {
		margin-top: auto;
}
#plan .col-md-4 {
	padding: 1em;
	border-radius: 8px !important;
	transition: all 0.25s ease;
}
#plan .col-md-4:hover {
	background: #A9C2D6;
	transition: all 0.25s ease;
}
.row.cards {
	display: flex;
	flex-wrap: wrap;
	margin-left: -10px;
	margin-right: -10px;
}
.row.cards:before, .row.cards:after {
	display: none;
}
.row.cards > [class*="col-"] {
	display: flex;
	margin-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
}
.row.cards .card {
	width: 100%;
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
}
.card {
	background: #eef2f5;
	border: 2px solid #5c7d99;
	padding: 1em;
	height: 100%;
	transition: all 0.25s ease;
}
.card:hover {
	background: #ffffff;
	transition: all 0.25s ease;
}
.card-row {
	display: table;
	width: 100%;
	margin-bottom: 10px;
}
.card-row .label {
	height: 44px;
	display: table-cell;
	background: #5c7d99;
	color: #fff;
	padding: 8px 12px;
	width: 100px;
	font-size: 13px;
	vertical-align: middle;
}
.card-row .value {
	height: 44px;
	display: table-cell;
	padding-left: 15px;
	vertical-align: middle;
	font-size: 14px;
	color: #333;
}
.time-box {
	background: #fff;
	margin-top: 1em;
	padding: 1em;
	transition: all 0.25s ease;
}
.card:hover .time-box {
	background: #eef2f5;
	transition: all 0.25s ease;
}
.time-title {
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	margin-bottom: 15px;
	position: relative;
}
.time-title span {
	display: inline-block;
	width: 40px;
	height: 1px;
	background: #999;
	vertical-align: middle;
	margin: 0 10px;
}
.time-list {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	display: table;
}
.time-list li span {
	display: inline-block;
	width: 60px;
	color: #333;
}
body #sp-main-body {
	margin-top: 0 !important
}
body.party .page-header {
	opcity: 0;
	visibility: hidden;
}
#sp-title {
	border-bottom: 5px solid transparent !important;
}
/* Lock vertical page scrolling during horizontal swipes on both carousels */
.slider-floor,
.floor-gallery,
.owl-carousel,
.owl-carousel .owl-stage-outer,
.owl-carousel .owl-stage {
    touch-action: pan-y;
    -webkit-user-select: none;
    user-select: none;
}
@media (max-width: 991px) {
	.plan-row > [class*="col-"] > a {padding:0; overflow: hidden;}
}
@media (min-width: 577px) and (max-width: 991px) {

	.card-row .label, .card-row .value {display:block; width:100%;height:auto;}
	.sp-column div.framed {
		padding: 3em 2em 3em 2em;
	}
	.sp-column div.framed1 {
		padding: 3em 2em 0em 2em;
	}
	.sp-column div.framed2 {
		padding: 0em 2em 3em 2em;
	}
	#sp-component {padding-left: 30px; padding-right: 30px;}
}
#gototop {
transform: translate(-50px, 0px);
}
.reasons-section h4 {padding: 5px 0; line-height: 3rem;}

@media (max-width: 576px) {
	.description {font-size:13px;}
	.description strong  {font-size:1.25em;}
	.time-title {font-size: 13px;}
	#results_container ul.row > li > * {line-height: normal}
	#results_container li p.text-center strong {min-height:30px;display: block;}
	.setsume {font-size: 1.5rem;line-height: normal;}
	#plan .col-md-4 {padding: 10px;}
	#access .address tr td {display:block;}
	#access .address tr td:first-child {background: #4A7394; color: #fff; font-weight: bold; padding: 10px;}
	#access .address tr td:last-child {padding: 10px;}
	#venue .title-back {margin: 50px 0 25px 0!important;}
	body.place .entry-image.full-image img {
		height: auto !important;
		width: 180px !important;
	}
	body.place .entry-image.full-image {
		bottom: auto !important;
		padding-bottom: 0 !important;
	}
	#gototop {

		transform: translate(10px, -40px);
	}
	.purpose-section > div, .reasons-section > div {
		margin-bottom: 2em;
	}

	#facilities table tr:hover td {
		background: none;
	}
	body.party #sp-title, body.place #sp-title {
		margin-top: 40px;
	}
	#brands .tab-content h2 {
		font-size: 25px;
	}
	#plan .col-md-4:nth-child(even) {
		background: #ededed;
		border-radius: 0!important;
	}
	.card {
		padding: 15px;
		margin-bottom: 2em;
	}
	.row.cards > div:last-child .card {
		margin-bottom: 0;
	}
	.card-row {
		display: block;
	}
	.card-row .label, .card-row .value {
		display: block;
		width: 100%;
		text-align: center
	}
	.card-row .label {
		margin-bottom: 5px;
	}
}
.shop-card {
	text-align: center;
	padding: 10px 20px;
}
.shop-card h3 {
	margin-bottom: 15px;
	font-weight: 600;
}
.shop-card img {
	margin-bottom: 10px;
}
.shop-card p {
	font-size: 13px;
	line-height: 1.6;
	text-align: left;
	margin-bottom: 1em;
	padding-top: 1em;
}
#faq {
	max-width: 1000px;
	margin: 40px auto;
	font-family: sans-serif;
}
.faq-title {
	border: 1px solid #999;
	padding: 20px;
	font-size: 18px;
	cursor: pointer;
	position: relative;
	margin: 1em 0 0em 0;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25);
	font-weight: bold;
}
.faq-title .icon {
	position: absolute;
	right: 20px;
	font-size: 24px;
}
.faq-content {
	display: none;
	padding: 20px 10px 20px 30px;
}
.faq-title .icon {
	position: absolute;
	right: 20px;
	top: 50%;
	width: 16px;
	height: 16px;
	transform: translateY(-50%);
}
.faq-title .icon::before, .faq-title .icon::after {
	content: "";
	position: absolute;
	background: #333;
	transition: transform 0.3s ease, opacity 0.3s ease;
}
.faq-title .icon::before {
	width: 100%;
	height: 2px;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.faq-title .icon::after {
	width: 2px;
	height: 100%;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
}
.faq-section.active .icon::after {
	transform: translateX(-50%) scaleY(0);
	opacity: 0;
}
/* QUESTIONS */
.faq-question {
	font-weight: bold;
	margin: 20px 0 5px;
	font-size: 16px;
}
.faq-answer {
	color: #555;
	margin: 15px 0px 15px 40px;
	display: table;
}
.faq-answer legend {
	display: table;
	padding: 0;
	margin-bottom: 0;
	font-size: inherit;
	line-height: inherit;
	color: #333;
	border: 0;
	border-bottom: none;
}
.faq-answer span {
	display: table-cell;
	padding-left: 5px;
}
#search .tab-content button.active, #search .rl_tabs > ul.nav-tabs > li.active a, #search .rl_tabs > ul.nav-tabs > li a:hover {
	color: #4A7394;
	border: 2px solid rgba(74, 115, 148, 1);
	background: rgba(74, 115, 148, 0.2);
}
#search .rl_tabs > ul.nav-tabs > li a:hover, .form-container .option-btn:hover {
	border: 2px solid rgba(74, 115, 148, 1);
	color: #4A7394;
	transition: all 0.25s ease;
}
.form-container .btn-search {
	background-color: #4A7394;
	border: none;
	padding: 2rem 1.5rem;
	font-size: 1em;
	font-weight: 600;
	transition: all 0.25s ease;
	color: #fff;
	width: 100%;
}
.form-container .btn-search:hover {
	background-color: #3A5F7D;
	transition: all 0.25s ease;
}
.form-container .btn-reset {
	background-color: #EDEDED;
	border: none;
	padding: 2rem 1.5rem;
	font-size: 1em;
	font-weight: 500;
	transition: all 0.25s ease;
	width: 100%;
}
.form-container .btn-reset:hover {
	background-color: #c9c9c9;
	transition: all 0.25s ease;
}
.form-container .action-row {
	margin-top: 1em;
}
#contact p {
	margin-bottom: 2em;
}
.bordered-white {
	border: 2px solid #fff;
	padding: 1.5em;
	margin-top: 10px;
	width: 100%;
}
.bordered-black {
	border: 1px solid #000;
	padding: 1em;
	width: 100%;
}

:root {
	--accent-color: #000000; 
	--text-muted: #666666;
	--bg-color: #ffffff;
	--border-color: #eaeaea;
}
.anchors-wrapper {
	position: relative;
	background: var(--bg-color);
	z-index: 90;
	box-sizing: border-box; 
}
.anchors-wrapper.is-sticky {
	position: fixed;
	top: 60px;
	left: 0;
	right: 0;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
	border-radius: 0px 0px 10px 10px !important;
}
#scroll-progress {
	top: 0;
	left: 0;
	height: 6px;
	background: #4A7394;
	width: 0%;
	z-index: 901;
	transition: width .08s linear;
}

#anchors {
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 1140px;
	margin: 0 auto;
	padding: 5px;
	gap: 8px;
}
#anchors a {
	text-decoration: none;
	color: var(--text-muted);
	font-size: 13px;
	font-weight: 500;
	padding: 8px 14px; 
	white-space: nowrap;
	flex: 1;
	text-align: center;
	background: #ffffff;
	border: 1px solid var(--border-color);
	border-radius: 5px !important;
	box-shadow: 0 1px 3px rgba(0,0,0,0.02);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
	transform-style: preserve-3d;
}
#anchors a:hover {
	color: #4A7394;
	border-color: #4A7394;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(74, 115, 148, 0.12);
	transform-style: preserve-3d;
}
#anchors a.active {
	color: #ffffff !important;
	background-color: #4A7394;
	border-color: #4A7394;
	font-weight: 600;
	transform: translateY(0);
	box-shadow: 0 2px 6px rgba(74, 115, 148, 0.2);
}
#anchors a::after {
	display: none !important;
}
@media (max-width: 991px) {
	#scroll-progress {display:none;}
	.anchors-wrapper {overflow: hidden;}
	#anchors{justify-content: left; overflow: scroll;}
}
@media (max-width: 576px) {
	#resetBtn {
		width: 100%;
	}
	.row-top {
		display: flex;
		flex-direction: column-reverse;
	}
	.form-container {
		padding: 1em;
	}
	#sp-footer {
		padding-bottom: 70px;
	}
	#xex .row {
		display: flex;
	}
	#xex .row > div {
		margin: 5px;
		flex: 1;
		width: 100%;
		padding: 0;
	}
	#brands .tab-content {
		padding: 1em
	}
	.faq-content {
		padding: 20px 10px;
	}
	body.members #sp-component, body.party #sp-component {
		padding: 0;
	}
	.contact > div {
		margin-bottom: 1.5em;
	}
	.background-blue {
		padding: 1.5em;
	}
	body.place .bluebordered {
		padding: 1.5em 1em;
	}
	.purpose-section {
		margin-bottom: 2em
	}
	.title-back {
	font-size: 2em;
	margin: 50px 0 25px 0;
	line-height: normal;
	}
	.title-back:before {
		transform: translate(-50%, -70%);
		font-size: clamp(50px, 10vw, 125px);
	}
	.sp-column div.framed {
		padding: 35px 15px 30px 15px;
	}
	.sp-column div.framed1 {
		padding: 35px 15px 0px 15px;
	}
	.sp-column div.framed2 {
		padding: 0px 15px 35px 15px;
	}
	.slider-brand .owl-nav button.owl-prev {
		left: 5px !important;
	}
	.slider-brand .owl-nav button.owl-next {
		right: 5px !important;
	}
	.slider-brand .owl-nav button {
		font-size: 30px !important;
		width: 40px !important;
		height: 40px !important;
		line-height: 40px !important;
	}
}
/* ===== Container ===== */
.floating-contact {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 999;
}
/* ===== Items ===== */
.fc-item {
	right: 0px;
	width: 50px;
	height: 140px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-decoration: none;
	overflow: hidden;
	opacity: 0;
}
/* Base inner */
.fc-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}
/* Colors */
.fc-search {
	background: #1C1C1E;
	z-index: 4;
}
.fc-contact {
	background: #4A7394;
	z-index: 3;
}
.fc-contact:hover {background: #3A5F7D;}
.fc-quote {
	background: #8C6A3D;
	z-index: 2;
}
.fc-quote:hover {background: #A57C47;}
.fc-phone {
	background: #FFFFFF;
	z-index: 1;
	color: #4A7394;
	border: 3px solid #4A7394;
}
/* Hover effect (smooth, no conflict) */
.fc-item:hover .fc-inner {
	transform: translateX(-3px);
	color: #FFFFFF;
}
.fc-item:nth-child(3):hover .fc-inner {
	transform: translateX(-3px);
	color: #4A7394;
}
/* ===== Vertical text ===== */
.fc-text {
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-size: 12px;
	letter-spacing: 2px;
}
/* Icon */
.fc-item i {
	font-size: 18px;
	margin-bottom: 6px;
}
/* ===== FINAL POSITIONS (set FIRST to avoid diagonal issues) ===== */
.fc-item:nth-child(1) {
	top: -245px;
}
.fc-item:nth-child(2) {
	top: -105px;
}
.fc-item:nth-child(3) {
	top: -55px;
}
.fc-item:nth-child(4) {
	top: 15px;
}
/* ===== INITIAL STATES ===== */
/* Top: only X moves (horizontal reveal) */
.fc-item:nth-child(1) {
	transform: translateX(80px); /* same Y → no diagonal */
}
/* Others: stacked behind top */
.fc-item:nth-child(2), .fc-item:nth-child(3), .fc-item:nth-child(4) {
	top: -245px; /* start behind top */
	transform: translateX(0);
}
/* ===== ANIMATION ===== */
/* 1️⃣ Top slides in horizontally */
.floating-contact.loaded .fc-item:nth-child(1) {
	transform: translateX(0);
	opacity: 1;
	transition: transform 0.25s ease-in-out 0.25s, opacity 0.25s;
}
/* 2️⃣ Second drops smoothly */
.floating-contact.loaded .fc-item:nth-child(2) {
	top: -105px;
	opacity: 1;
	transition: top 0.45s ease-in-out 0.45s, opacity 0.25s 0.45s;
}
/* 3️⃣ Third drops smoothly */
.floating-contact.loaded .fc-item:nth-child(3) {
	top: 35px;
	opacity: 1;
	transition: top 0.55s ease-in-out 0.55s, opacity 0.25s 0.55s;
}
.floating-contact.loaded .fc-item:nth-child(4) {
	top: 175px;
	opacity: 1;
	transition: top 0.55s ease-in-out 0.55s, opacity 0.25s 0.55s;
}
/* ===== Mobile ===== */
@media (max-width: 767px) {
	.owl-theme .owl-nav {
		display: none;
	}
	/* ===== Container ===== */
	.floating-contact {
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		transform: translateY(100%); /* hidden initially */
	}
	.floating-contact.loaded {
		transform: translateY(0);
		transition: transform 0.4s ease-in-out;
		display: flex;
	}
	/* ===== Items ===== */
	.fc-item {
		position: relative; /* reset absolute */
		top: auto;
		right: auto;
		flex: 1;
		height: 50px;
		opacity: 1;
		transform: none !important; /* kill desktop animations */
	}
	/* ===== Inner ===== */
	.fc-inner {
		transform: none !important; /* remove hover offset */
		flex-direction: column;		
	}
	/* ===== Icons ===== */
	.fc-item i {
		font-size: 20px;
		margin: 0 !important;
	}
	/* ===== Hide text ===== */
	.fc-text {
		writing-mode: initial;
		font-size: 10px;
		line-height:normal;
	}
	/* ===== Remove all hover effects ===== */
	.fc-item:hover, .fc-item:hover .fc-inner, .fc-item:hover i, .fc-item:hover .fc-text {
		transform: none;
	}
	/* ===== Optional: tap feedback ===== */
	.fc-item:active {
		opacity: 0.7;
	}
	/* ===== INITIAL STATES ===== */
	/* Top: only X moves (horizontal reveal) */
	.fc-item:nth-child(1), .fc-item:nth-child(2), .fc-item:nth-child(3), .fc-item:nth-child(4), .floating-contact.loaded .fc-item:nth-child(1), .floating-contact.loaded .fc-item:nth-child(2), .floating-contact.loaded .fc-item:nth-child(3), .floating-contact.loaded .fc-item:nth-child(4) {
		top: auto !important; /* start behind top */
		transform: translateX(0px) translateY(-100%); /* same Y → no diagonal */
		border-radius: 0 !important;
		transition: transform 0.45s ease-in-out, opacity 0.25s;
	}
}

/* ==========================================================================
	 MODAL CORE REDESIGN ENGINE (RESPONSIVE VIEWPORT BOUNDS REWRITE)
	 ========================================================================== */

/* Overlay Dimming Logic */
.custom-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.45);
	z-index: 9998;
	display: none;
}

/* Flexbox Elastic Centering Context Wrapper */
.custom-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	box-sizing: border-box;
	z-index: -1;
	opacity: 0;
	pointer-events: none;
	transition:all 0.25s ease-in-out 0s;
		transform-style: preserve-3d;
}
.custom-modal.dark {
	 transition:all 0.25s ease-in-out 0s;
		transform-style: preserve-3d;
}
.custom-modal.active {
	opacity: 1;
	z-index: 9999;
	pointer-events: auto;
	transition:all 0.25s ease-in-out 0s;
	transform-style: preserve-3d;
}

/* Fluid Horizontal Elastic Container */
.modal-container {
	background: #ffffff;
	width: 100%;
	max-width: 1140px;
	max-height: calc(100vh - 40px);
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.25);
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	animation: modalSlideUp 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.custom-modal.dark .modal-container {
	background: #000000;
}

@keyframes modalSlideUp {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}

/* Scroll Isolation Inner Window */
.modal-inner {
	padding: 40px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	flex: 1;
	position: relative;
}
.modal-inner small {
	display: block;
}

/* Fixed Relative Floating Corner Trigger Close Button */
.modal-close {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 36px;
	height: 36px;
	background: #ffffff;
	color: #4A7394;
	border: 3px solid #4A7394;
	text-align: center;
	line-height: 32px;
	font-size: 22px;
	font-weight: 300;
	cursor: pointer;
	z-index: 100;
	transition: all 0.2s ease;
	transform-style: preserve-3d;
}
.modal-close:hover {
	background: #4A7394;
	color: #ffffff;
	transform: rotate(90deg);
	transform-style: preserve-3d;
}
.custom-modal.dark .modal-close {
	background: #000000;
	color: #ffffff;
	border-color: #ffffff;
	transform-style: preserve-3d;
}
.custom-modal.dark .modal-close:hover {
	background: #ffffff;
	color: #000000;
	transform-style: preserve-3d;
}

#imageModal .modal-close {
	right: 20px;
	top: 20px;
}
#imageModal .modal-inner {
	padding: 2em;
}

/* Gallery Viewport Metric Handlers */
.image-viewer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	gap: 15px;
}
.image-modal-inner {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.image-modal-inner img {
	max-width: 100%;
	max-height: 75vh;
	object-fit: contain;
	display: block;
	border-radius: 4px;
	transition: opacity .2s ease, transform .2s ease;
}
.image-modal-inner img.changing {
	opacity: .3;
	transform: scale(.98);
}
.gallery-arrow {
	font-size: 42px;
	cursor: pointer;
	color: #fff;
	user-select: none;
	padding: 20px;
}

/* Dedicated Flex Isolation Layers for Gallery Navigation Trackers */
.gallery-thumbs-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 20px;
	width: 100%;
	max-width: 460px;
	margin-left: auto;
	margin-right: auto;
}
.gallery-thumbnails {
	width: 460px;
	overflow: hidden;
	position: relative;
}
.gallery-thumbnails-track {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	will-change: transform;
	transition: transform .35s ease;
}
.thumb {
	width: 80px;
	height: 60px;
	flex: 0 0 90px;
	cursor: pointer;
	opacity: .5;
	border: 2px solid transparent;
	transition: .2s;
	box-sizing: border-box;
}
.thumb:hover, .thumb.active {
	opacity: 1;
	border-color: #fff;
}
.thumb img {
	width: 100%;
	height: auto !important;
	object-fit: cover;
	display: block;
}
.thumbs-arrow {
	color: #fff;
	cursor: pointer;
	font-size: 26px;
	user-select: none;
}

/* Core Column Splitters & Typography Alignment inside Redesigned Modal */
.custom-modal .title {
	margin-bottom: 10px;
	text-align: center;
	margin-top: 0px;
	font-size: 20px;
	font-weight: 600;
}
.custom-modal .section {
	margin-bottom: 15px;
}
.custom-modal .section:last-child {
	margin-bottom: 0px;
}
.custom-modal .section-title {
	position: relative;
	margin-top: 10px;
	margin-bottom: 15px;
	display: flex;
	align-items: center;
	font-size: 16px;
}
.custom-modal .section-title:after {
	content: "";
	flex: 1;
	height: 2px;
	background: #bcbcbc;
	margin-left: 30px;
}

body.modal-open-custom {
	overflow: hidden;
	position: fixed;
	width: 100%;
	top: 0;
}

.capacity {
	display: table;
	margin: 0 auto;
	font-size: 15px;
}
.capacity p {
	margin: 0px 10px;
	background: #EDEDED;
	padding: 10px;
	border-radius: 10px !important;
	display: inline-block;
}

.layout-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
}
.grid-item {
	padding: 7px;
	border: 1px solid #FFFFFF;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s ease;
	background: #EDEDED;
}
.grid-item.last {
	grid-column: 1 / -1;
}
.grid-item:hover, .grid-item.active {
	background: #4A7394;
	color: #fff;
}

.modal-inner .row {
	display: flex;
	flex-wrap: wrap;
	margin-left: -15px;
	margin-right: -15px;
}
.custom-modal .left-content, 
.custom-modal .right-content {
	width: 50%;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

.carousel-nav {
	text-align: center;
	margin-top: 15px;
}
.custom-modal .carousel-nav {
	text-align: center;
	margin-top: 10px;
}
.carousel-nav span {
	display: inline-block;
	margin: 0 10px;
	cursor: pointer;
	border: 2px solid #4A7394;
	padding: 8px 12px;
	color: #4A7394;
	transition: all 0.25s ease;
	border-radius: 50% !important;
	width: 45px;
	height: 45px;
}
.carousel-nav span:hover {
	background: #4A7394;
	color: #fff;
}
.no-margin {
	margin: 0;
}

/* Modal Adaptive Media Query Breakpoints */
@media (max-width: 991px) {
	.modal-inner {
		padding: 30px;
	}
	#imageModal .modal-inner {
	flex: none;
}
	.custom-modal .left-content, 
	.custom-modal .right-content {
		width: 100%; margin-top: 2em;
	}
	.custom-modal .right-content {
		margin-top: 30px;
		order: -1;
	}
	.modal-close {
		top: 15px;
		right: 15px;
		background: rgba(255, 255, 255, 1);
	}
		.modal-container {
		max-height: 100vh;
	}
		.custom-modal {
		padding: 0px;
	}
	.modal-close {
		position: fixed;
		top: 25px;
		right: 25px;
	}
}

@media (max-width: 768px) {
	.modal-inner {
		padding: 30px 30px 60px 30px;
	}
	.gallery-arrow {
		padding: 0;
	}
	.gallery-thumbnails {
		width: 280px;
	}
	.thumbs-arrow {
		display: none;
	}
	.gallery-arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 10;
		background: rgba(0, 0, 0, 0.5);
		padding: 10px 15px;
		border-radius: 4px;
	}
	.gallery-arrow.prev { left: 5px; }
	.gallery-arrow.next { right: 5px; }
}

@media (max-width: 576px) {
	.custom-modal.active {padding:0}


	.layout-grid {
		grid-template-columns: 1fr;
	}
	.capacity {display:flex; gap:10px; flex-direction: row;}
	.capacity p {
		margin: 4px 0;
		box-sizing: border-box;
		text-align: center;
		flex:1;
	}
	.custom-overlay {
		background: rgba(0, 0, 0, 1);
	}

}

@media (max-height: 600px) {
	.modal-container {
		max-height: calc(100vh - 10px);
	}
	.modal-inner {
		padding: 16px;
	}
}

/* ==========================================================================
	 10. RESTORING ALL DOWNSTREAM ORIGINAL MAP, TABLES, SLIDERS & HELPERS
	 ========================================================================== */

#imageModal {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0px;
	box-sizing: border-box;
}
/* PREVENT CONTENT FROM STICKING TO TOP */
#imageModal .modal-container {
	width: 100%;
	max-width: 100vw;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#imageModal .modal-container {
	max-height: 100vh;
	height:100%;
	justify-content: center;
}
/* =========================================
	 MAP CONTAINER
========================================= */
.floor-map {
	width: 100%;
	height: auto;
	display: block;
}
.venue-map .floor-map {
	width: 250px;
	padding: 10px;
}
/* =========================================
	 ZONES (SVG AREAS)
========================================= */
.zone {
	fill: transparent;
	cursor: pointer;
	pointer-events: all;
	transition: all 0.25s ease;
}
/* =========================================
	 DIMMED MODE (optional global effect)
========================================= */
.floor-map.dimmed .zone {
	opacity: 0.3;
}
.floor-map.dimmed .zone.active {
	opacity: 1;
}
.venue-card .zone.active {
  fill-opacity: 1;
  transition: fill-opacity 0.4s ease, fill 0.4s ease;
  pointer-events: none;
}
.venue-card:hover .zone.active {
  animation: ambientPulse 2s infinite ease-in-out;
}
@keyframes ambientPulse {
  0% {
    fill-opacity: 1;
    filter: drop-shadow(0 0 0px rgba(255, 71, 87, 0));
  }
  50% {
    fill-opacity: 0.3;
  }
  100% {
    fill-opacity: 1;
  }
}
/* =========================================
	 TOOLTIP (MAP ONLY)
========================================= */
#map-tooltip {
	position: fixed;
	pointer-events: none;
	background: rgba(0, 0, 0, 0.85);
	color: #fff;
	padding: 6px 10px;
	font-size: 12px;
	border-radius: 4px;
	opacity: 0;
	transform: translate(-50%, -120%);
	transition: opacity 0.15s ease;
	z-index: 9999;
	white-space: nowrap;
}
/* =========================================
	 CARDS (LINKED TO ZONES)
========================================= */
/* Smooth transition */
[data-zone] .shop-card {
	transition: all 0.25s ease;
}
/* Active (clicked / locked) */
[data-zone].active .shop-card {
	transform: translateY(-4px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
/* =========================================
	 OPTIONAL: VISUAL CONSISTENCY
========================================= */
/* Prevent weird stacking when multiple active */
.zone, .shop-card {
	will-change: transform, box-shadow, filter;
}
/* ===============================
	 MOBILE TRANSFORMATION
=============================== */
.venue-table th, .venue-table td {
	border-top: none!important;
	padding:0!important;
}
@media (max-width: 576px) {
	.venue-map .floor-map {width: 100%;}
	.venue-table td {display:block}
#imageModal{

		min-height:100vh;

	}

	#imageModal .modal-container{

		display:flex;

		flex-direction:column;

		justify-content:center;

		min-height:100vh;

	}
	#imageModal .modal-close {
		position: fixed;
		top: 20px;
		right: 20px;
		margin-left: auto;
		z-index: 9000;
	}
	#gallery img {
		margin-bottom: 0px
	}

}
/* ===============================
	 PREMIUM MOBILE CARD DESIGN
=============================== */
@media (max-width: 576px) {
.venue-card .zone.active {
  animation: ambientPulse 2s infinite ease-in-out;
}
	#brands .rl_tabs > ul.nav-tabs > li img {
		width: auto;
		height: 20px;
	}
	

	.select-wrapper {
		position: relative;
	}
	.select-wrapper select {
		width: 100%;
		padding: 10px 44px 10px 16px;
		font-size: 14px;
		box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25);
		background: #4A7394;
		border: 1px solid #4A7394;
		color: #fff;
		appearance: none;
		-webkit-appearance: none;
		cursor: pointer;
		transition: all 0.25s ease;
		height: 3em;
	}
	/* Hover / focus */
	.select-wrapper select:focus {
		outline: none;
		box-shadow: 0 0 0 2px rgba(0, 0, 0, 0);
	}
	/* Custom arrow */
	.select-wrapper::after {
		content: "";
		position: absolute;
		right: 16px;
		top: 50%;
		width: 8px;
		height: 8px;
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		transform: translateY(-50%) rotate(45deg);
		pointer-events: none;
		transform-style: preserve-3d;
	}
	#search .rl_tabs > ul.nav-tabs {
		display: block;
	}
	#brands .nav-tabs#set-rl_tabs-1 {
		gap: 0.5em;
		justify-content: left;
		overflow-x: scroll;
	}
}
/* FLOOR 1 */
.floor1 {
	fill: rgba(255, 0, 0, 0.5);
}
/* FLOOR 2 */
.floor2 {
	fill: rgba(49, 0, 255, 0.5);
}
/* FLOOR 3 */
.floor3 {
	fill: rgba(255, 255, 0, 0.5);
}
/* FLOOR 4 (1 + 2) */
.zone.combo-floor4 {
	fill: rgba(255, 165, 0, 0.5); /* orange */
}
/* FLOOR 5 (1 + 2 + 3) */
.zone.combo-floor5 {
	fill: rgba(0, 200, 0, 0.5); /* green */
}
#selected-tags {
	transition: all 0.2s ease;
}
.tags-container {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 15px;
}
.tag {
	display: inline-flex;
	align-items: center;
	background: #f5f5f7;
	border-radius: 16px;
	padding: 6px 10px;
	font-size: 13px;
	cursor: pointer;
	/* appear animation */
	animation: tagIn 0.25s ease;
	transition: transform 0.2s ease, opacity 0.2s ease;
}
tag:hover {
	background: rgba(74, 115, 148, 0.2) !important
}
.venue-tags .tag {
	color: #fff;
	background: #A9C2D6;
	padding: 2px 10px;
}
.tag .remove {
	margin-left: 6px;
	opacity: 0.6;
}
.tag.removing {
	opacity: 0;
	transform: scale(0.9);
	transition: all 0.2s ease;
	pointer-events: none;
}
/* appear animation */
@keyframes tagIn {
	from {
		opacity: 0;
		transform: translateY(6px) scale(0.95);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}
.mt-0 {
	margin-top: 0 !important;
}
.mt-1 {
	margin-top: 1em !important;
}
.mt-2 {
	margin-top: 2em !important;
}
.mt-3 {
	margin-top: 3em !important;
}
.mt-4 {
	margin-top: 4em !important;
}
.mt-5 {
	margin-top: 5em !important;
}
.mt-6 {
	margin-top: 6em !important;
}
.mt-7 {
	margin-top: 7em !important;
}
.mt-8 {
	margin-top: 8em !important;
}
.mt-9 {
	margin-top: 9em !important;
}
.mt-10 {
	margin-top: 10em !important;
}
.mb-0 {
	margin-bottom: 0 !important;
}
.mb-1 {
	margin-bottom: 1em !important;
}
.mb-2 {
	margin-bottom: 2em !important;
}
.mb-3 {
	margin-bottom: 3em !important;
}
.mb-4 {
	margin-bottom: 4em !important;
}
.mb-5 {
	margin-bottom: 5em !important;
}
.mb-6 {
	margin-bottom: 6em !important;
}
.mb-7 {
	margin-bottom: 7em !important;
}
.mb-8 {
	margin-bottom: 8em !important;
}
.mb-9 {
	margin-bottom: 9em !important;
}
.mb-10 {
	margin-bottom: 10em !important;
}
:root {
	--bg: #f3f4f6;
	--card: #ffffff;
	--border: #e5e7eb;
	--text: #1a1d23;
	--muted: #6b7280;
	--accent: #5c7d99;
	--radius: 15px;
}
a.open-modal {
	text-decoration: none;
	display: block;
	color: #000;
}
a.open-modal:hover {
	color: #5c7d99;
}
#plan a img,
a.open-modal img{
transition: transform 0.15s linear;transform-style: preserve-3d;}
#plan a:hover img,
a.open-modal:hover img {  -webkit-transform: scale(1.06);
  transform: scale(1.06);
transition: transform 0.15s linear;transform-style: preserve-3d;}
#gallery a.open-modal {overflow: hidden;}
#gallery a.open-modal div {position: absolute;
bottom: 0;
left: 0;
width: 100%;
opacity:1;
color: #fff;
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgb(0, 0, 0) 50%);
height: 40px;
line-height: 50px;
transition: all 0.15s ease;
}
#gallery a.open-modal:hover div {bottom:-100%;transition: all 0.15s ease;}
/* ── Layout ── */
.main-layout {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 24px; /* 1.5rem */
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	position: relative;
}
.content-col {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	min-width: 0;
	-webkit-transition: all 0.3s ease, opacity 0.3s ease;
	transition: all 0.3s ease, opacity 0.3s ease;
}
.sidebar-col {
	width: 100%;
	flex-shrink: 0;
	position: -webkit-sticky;
	position: sticky;
	top: 75px;
	transform: translateX(0px);
	transition: all 0.3s ease;
}
/* Lock the inner content width so it doesn't wrap/squish while shrinking */
/* Renamed from .hidden to avoid Bootstrap conflicts */
.sidebar-col.sidebar-collapsed {
	width: 0 !important;
	opacity: 1;
	transform: translateX(100px);
	pointer-events: none;
	transition: all 0.3s linear 0
}
/* ── Toolbar ── */
.toolbar {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: flex-start;
	-ms-flex-align: flex-start;
	align-items: flex-start;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-bottom: 24px; /* 1.5rem */
	position: relative;
}
/* Grid/List toggle */
.view-toggle-container {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 2em 0;
}
/* MODE INDICATOR */
/* MODE INDICATOR (PILL) */
.mode-indicator {
	display: inline-flex;
	align-items: center;
	padding: 10px 15px;
	border-radius: 10px !important;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
	transition: all 0.25s ease;
	background: var(--accent);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}
.mode-indicator .label {
	font-size: 1em;
	text-align: left;
}
.mode-indicator i {
	color: #fff;
}
/* =========================
	 FILTERING MODE
========================= */
.mode-indicator.filtering {
	color: #374151; /* darker gray */
}
/* =========================
	 FLOORMAP MODE (ACTIVE)
========================= */
.mode-indicator.floormap {
	background: #000000;
}
/* =========================
	 SLIDE ANIMATION
========================= */
.mode-indicator {
	transform: translateY(0);
	opacity: 1;
}
.mode-indicator.slide-out {
	opacity: 0;
	transform: translateY(-6px);
}
.mode-indicator.slide-in {
	opacity: 1;
	transform: translateY(0);
}
.view-toggle {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	border: 1px solid var(--border);
	border-radius: 9px !important;
	overflow: hidden;
	background: var(--card);
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}
.view-toggle-btn {
	width: 35.5px;
	height: 35.5px;
	border: none;
	background: transparent;
	cursor: pointer;
	color: var(--muted);
	font-size: 14.4px; /* 0.9rem */
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-transition: background 0.15s, color 0.15s;
	transition: background 0.15s, color 0.15s;
	outline: none;
}
.view-toggle-btn.active {
	background: var(--accent);
	color: white;
}
.view-toggle-btn:not(.active):hover {
	background: var(--bg);
}
.row.filter {
	display: flex;
}
.row.filter > div {
	margin-top: auto;
}
.filter-toggle-btn {
	position: absolute;
	right: 0;
	bottom: 0;
	gap: 8px; /* 0.5rem */
	padding: 8.8px 16px; /* 0.55rem 1rem */
	border-radius: 999px !important;
	border: 1px solid var(--border);
	background: var(--card);
	font-size: 13.6px; /* 0.85rem */
	font-weight: 500;
	color: var(--text);
	cursor: pointer;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
	outline: none;
}
.filter-toggle-btn:hover {
	-webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
	box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
	background: #f9fafb;
}
.filter-toggle-btn.active {
	background: var(--accent);
	color: white;
	border-color: var(--accent);
}
.toggle-arrow {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-transition: -webkit-transform 0.3s ease;
	transition: transform 0.3s ease;
}
.filter-toggle-btn.active .toggle-arrow {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}
/* ── Map ── */
.map-area {
	position: relative;
}
.map-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: none;
}
.venue-pin {
	position: absolute;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	pointer-events: all;
	cursor: pointer;
	-webkit-transition: -webkit-transform 0.2s;
	transition: transform 0.2s;
}
.venue-pin:hover, .venue-pin.highlighted {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.pin-label {
	padding: 10px 15px;
	border-radius: 6px !important;
	color: white;
	white-space: nowrap;
	-webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
.pin-dot {
	width: 20px;
	height: 20px;
	border-radius: 50% !important;
	margin-top: 5px;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}
.map-legend {
	position: absolute;
	top: 5px;
	left: 0px;
	background: rgba(255, 255, 255, .95);
	border-radius: 10px !important;
	padding: 10px 14px;
	font-size: 12px; /* 0.75rem */
	border: 1px solid var(--border);
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
}
.legend-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 7px;
	padding: 2px 0;
}
.legend-dot {
	width: 14px;
	height: 14px;
	border-radius: 3px !important;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	border: 1px solid #666;
}
/* ── Venue Grid ── */
.space-badge-v1, .space-badge-v3, .space-badge-v3, .space-badge-v4 {position:absolute;}



.space-badge-v1{
		top: -10px;
		left: -30px;
    display:flex;
    align-items:center;
    gap:5px;
    padding:10px 16px;
    border:
    1px solid #4f6f8e;
    background:white;
}

.space-badge-v1 .space-label{
    color:#4f6f8e;
    font-size:10px;
    letter-spacing:.35em;
}

.space-badge-v1 .space-number{
    color:#4f6f8e;
    font-size:28px;
    font-weight:300;
}

.venue-card > a .space-badge-v2 {
    position: absolute;
    top: 0;
    left: -55px; 
    width: 50px;
    padding: 15px 0;
    background: #000000; 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    text-align: center;
    z-index: 2;
		height:100%;
		transition: all 0.3s ease;}

.venue-card > a:hover .space-badge-v2 {
    background: #4f6f8e;
		 transition: all 0.3s ease;
}

.space-badge-v2 .space-label {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.15em;
    margin-bottom: 2px;
    color: #ffffff;
}

.space-badge-v2 .space-number {
    font-size: 24px;
    font-weight: 300; 
    line-height: 1;
    font-family: 'Montserrat Alternates', sans-serif; 
}


.venue-card > a .space-badge-v3 {
		position: absolute;
		top: -10px;
		left: -20px;
		display: flex;
		align-items: stretch;
		z-index: 2;
		box-shadow: 2px 2px 0px rgba(0, 0, 0, 0.35);
		transition: transform 0.3s ease, box-shadow 0.3s ease;
		flex-direction: column;
}

.venue-card > a:hover .space-badge-v3 {
    transform: translate(-4px, -4px);
    box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.35); /* Accent color hard shadow */
}

.space-badge-v3 .space-label {
		background: #111111;
		color: #ffffff;
		padding: 2px 8px;
		text-orientation: mixed;
		font-size: 9px;
		font-weight: 600;
		letter-spacing: 0.3em;
}

.space-badge-v3 .space-number {
		background: #ffffff;
		width: 100%;
		color: #111111;
		padding: 12px 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32px;
		font-weight: 400;
    border: 1px solid #111111;
    border-left: none;
    font-family: 'Montserrat Alternates', sans-serif;
}

.venue-card > a .space-badge-v4 {
  position: absolute;
  top: 0;
  left: -60px;
  bottom: 0;
  width: 54px;
  background: white;
  border: 1px solid rgba(0,0,0,.08);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: all 0.15s ease-in-out 0s;
  border-radius: var(--radius) 0 0 var(--radius) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
}

.venue-card > a:hover .space-badge-v4 {transition: all 0.15s ease-in-out 0s;}
.venue-card > a:hover .space-badge-v4 {background: var(--accent)}
.venue-card > a:hover .space-badge-v4 .space-label,
.venue-card > a:hover .space-badge-v4 .space-number {color:#fff;}
.space-badge-v4 .space-label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  letter-spacing: .4em;
  font-size: 10px;
  color: #999;
  margin-top: 10px;
}

.space-badge-v4 .space-number {
  font-size: 36px;
  font-weight: 200;
  color: #4f6f8e;
  transform: rotate(-90deg);
}





.venue-card:hover, .venue-card.highlighted {
	-webkit-box-shadow: 0 8px 28px rgba(0, 0, 0, .12);
	box-shadow: 0 8px 28px rgba(0, 0, 0, .12);
	-webkit-transform: translateY(-2px);
	transform: translateY(-2px);
	transition: all 0.15s ease-in-out 0s;
}
.venue-card.dimmed {
	opacity: 0.35;
}
/* Hidden state */
.venue-card.is-hidden, .venue-pin.is-hidden {
	display: none !important;
	opacity: 0;
}
.venue-grid {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	gap: 17.6px;
}


.venue-card {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 33%;
	flex: 1 1 33%;
	max-width: calc(33.333% - 11.75px);
	background: var(--card);
	border-radius: var(--radius) !important;
	border: 1px solid var(--border);
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
	cursor: pointer;
	display: flex;
	flex-direction: column;
}

.venue-card > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
	position: relative;
}
.venue-card-img {
	height: 250px;
	overflow: hidden;
	flex-shrink: 0;
	border-radius: 0 var(--radius) var(--radius) 0!important
}
.venue-card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-transition: -webkit-transform 0.15s linear;
	transition: transform 0.15s linear;
}
.venue-card:hover .venue-card-img img {
	-webkit-transform: scale(1.06);
	transform: scale(1.06);
}
/* ✅ THIS IS THE KEY BLOCK */
.venue-card-body {
	padding: 16px;
	display: flex;
	flex-direction: column;
	flex: 1; /* take all remaining height */
}
/* Title */
.venue-card-title {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 6.4px;
	color: var(--text);
}
@media (max-width: 991px) {
.venue-card {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 50%;
	flex: 1 1 50%;
	max-width: calc(50% - 11.75px);
	background: var(--card);
	border-radius: var(--radius) !important;
	border: 1px solid var(--border);
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
	cursor: pointer;
	display: flex;
	flex-direction: column;
	overflow: hidden
}
	.venue-card-img {border-radius: 0 0 var(--radius) var(--radius) !important}
	.venue-card > a .space-badge-v2 {position:relative; left:0; top:0; width:100%; flex-direction:row; height:auto;}
	.space-badge-v2 .space-number {margin-left: 5px;}
	.space-badge-v2 .space-label {margin-botton:0;}
	.venue-map .floor-map {width:auto;}
	.venue-tags {margin-bottom: 15px;}
}
@media (max-width: 576px) {

	.venue-card-title {font-size: 14px; line-height: normal;text-align: center}
	.faq-title {font-size: 16px;}
	#gallery a.open-modal div {font-size: 10px;}
	#gallery a.open-modal div {line-height: 55px;}
	#plan .row h4 {font-size: 11px}
	#plan .row h2 {font-size: 17px}
	.shop-card button, #plan button {padding: 0.75em;
		margin-top: 0.5em; 
		margin-bottom: 0em;
	width: 100%}
	.venue-card-img {display:none;}

	.row.filter {
	display: block;
}
	a.open-modal
	.row.filter {
		display: block;
	}
	.row.filter > div:first-child {
		margin-top: 20px;
	}
	.row.filter label {
		text-align: center;
		margin-bottom: 0px;
		margin-top: 10px;
	}
	.map-area svg image {
		width: 100%;
	}
	.venue-card {
		max-width: 100%;
	}
}
/* Optional: make content breathe better */
.slider-floor .floor-card {
	width: 100%;
	background: var(--card);
	border-radius: var(--radius) !important;
	overflow: hidden;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
	display: flex;
	flex-direction: column;
}
/* ✅ Make anchor behave like full-height wrapper */
.slider-floor .floor-card > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}
.slider-floor .floor-card.dimmed {
	opacity: 0.35;
}
/* Hidden state */
.slider-floor .floor-card.is-hidden, .slider-floor .floor-pin.is-hidden {
	display: none !important;
	opacity: 0;
}
.slider-floor .floor-card-img {
	overflow: hidden;
	flex-shrink: 0; /* ✅ prevents shrinking */
}
.slider-floor .floor-gallery.floor-card-img {
	overflow: visible;
}
.floor-gallery + .floor-card-body {
	margin-top: 15px;
}
.slider-floor .floor-card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-transition: -webkit-transform 0.15s linear;
	transition: transform 0.15s linear;
}
.slider-floor .floor-gallery .owl-nav.disabled + .owl-dots {
	margin-top: 0;
}
.slider-floor .floor-card:hover .floor-card-img .owl-item.active img {
	-webkit-transform: scale(1.06);
	transform: scale(1.06);
	transform-style: preserve-3d;
}
/* ✅ THIS IS THE KEY BLOCK */
.slider-floor .floor-card-body {
	padding: 16px;
	display: flex;
	flex-direction: column;
	flex: 1; /* take all remaining height */
}
/* Title */
.slider-floor .floor-card-title {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 6.4px;
	color: var(--text);
	text-align: center;
}
@media (max-width: 576px) {

	.map-area svg image {
		width: 100%;
	}
	.slider-floor .floor-card {
		min-width: 100%;
		max-width: 100%
	}
}
.floor-description, .floor-capacity, .floor-tags {
	margin-bottom: 10px;
	font-size: 1em;
}
/* ✅ PUSH BUTTON TO BOTTOM */
.view-details-btn {
	margin-top: auto;
}
.venue-capacity {
	color: var(--muted);
	margin-bottom: 10px;
}
.venue-description {
	color: var(--muted);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 5px;
	margin-bottom: 15px; /* 0.65rem */
}
.venue-tags {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 5px; /* 0.5rem */
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.tag {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 4px;
	color: var(--muted);
}
.tag .fa {
	color: var(--accent);
	font-size: 12px; /* 0.75rem */
}
.slide-item .view-details-btn, .view-details-btn {
	width: 100%;
	padding: 8.8px; /* 0.55rem */
	border: 1px solid var(--accent);
	background: transparent;
	border-radius: 10px !important;
	font-weight: 500;
	color: var(--text);
	cursor: pointer;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 5px;
	-webkit-transition: background 0.15s;
	transition: background 0.15s;
	outline: none;
}

.slide-item:hover .view-details-btn, .venue-card:hover .view-details-btn {
	background: #4f6f8e!important;
	color: white;
}
/* ── List mode overrides ── */
.venue-grid.list-mode {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	gap: 20px; 
}
.venue-grid.list-mode .venue-card {
	-webkit-box-flex: 0;
	-ms-flex: none;
	flex: none;
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	transition: all 0.15s ease-in-out 0s;
}
.venue-grid.list-mode .venue-card > a {
	flex-direction: row;
	display: flex;
	width: 100%
}
.venue-grid.list-mode .venue-card-img {
	width: 300px;
	min-height: 130px;
	height: auto;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}
.venue-grid.list-mode .venue-card-body {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	position: relative;
}
.venue-grid.list-mode .view-details-btn {
	background: var(--accent);
	color: #fff;
	width: auto;
	padding: 7.2px 17.6px;
}
/* ── Sidebar ── */
.sidebar-header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-bottom: 22.4px; /* 1.4rem */
}
.sidebar-title {
	font-weight: 700;
	font-size: 16.8px; /* 1.05rem */
}
.close-btn {
	width: 30px;
	height: 30px;
	border-radius: 50% !important;
	border: none;
	background: transparent;
	cursor: pointer;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: var(--muted);
	font-size: 17.6px; /* 1.1rem */
	-webkit-transition: background 0.15s;
	transition: background 0.15s;
	padding: 0;
	outline: none;
}
.close-btn:hover {
	background: var(--bg);
}
.section-label {
	font-size: 13.6px; /* 0.85rem */
	font-weight: 600;
	color: var(--text);
	margin-bottom: 12px; /* 0.75rem */
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.section-label span.val {
	font-weight: 400;
	color: var(--muted);
}
.sidebar-divider {
	border: none;
	border-top: 1px solid var(--border);
	margin: 17.6px 0; /* 1.1rem 0 */
}
/* ── Single Slider ── */
#budgetRange {
	width: 100%;
	height: 5px;
	-webkit-appearance: none;
	appearance: none;
	background: #e5e7eb;
	border-radius: 99px;
	outline: none;
	margin: 18px 0 10px;
}
#budgetRange {
	background: linear-gradient(to right, var(--accent) 0%, var(--accent) var(--progress, 0%), #e5e7eb var(--progress, 0%), #e5e7eb 100%);
}
/* WebKit */
#budgetRange::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: white;
	border: 2px solid var(--accent);
	box-shadow: 0 1px 6px rgba(59, 130, 246, .3);
	cursor: pointer;
	transition: box-shadow 0.2s, transform 0.1s;
}
#budgetRange::-webkit-slider-thumb:hover {
	box-shadow: 0 2px 10px rgba(59, 130, 246, .45);
	transform: scale(1.15);
}
/* Firefox */
#budgetRange::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: white;
	border: 2px solid var(--accent);
	box-shadow: 0 1px 6px rgba(59, 130, 246, .3);
	cursor: pointer;
}
/* IE / old Edge */
#budgetRange::-ms-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: white;
	border: 2px solid var(--accent);
	cursor: pointer;
}
/* ── Dual Range Slider ── */
.range-wrap {
	padding: 4px 0 0; /* 0.25rem 0 0 */
}
.range-slider-track {
	position: relative;
	height: 5px;
	background: #e5e7eb;
	border-radius: 99px !important;
	margin: 18px 0 10px;
}
.range-fill {
	position: absolute;
	height: 100%;
	background: var(--accent);
	border-radius: 99px !important;
	pointer-events: none;
}
.range-input {
	position: absolute;
	width: 100%;
	height: 5px;
	top: 0;
	left: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: transparent;
	pointer-events: none;
	margin: 0;
	padding: 0;
	outline: none;
}
/* Webkit thumb */
.range-input::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	border-radius: 50% !important;
	background: white;
	border: 2px solid var(--accent);
	-webkit-box-shadow: 0 1px 6px rgba(59, 130, 246, .3);
	box-shadow: 0 1px 6px rgba(59, 130, 246, .3);
	pointer-events: all;
	cursor: pointer;
	-webkit-transition: -webkit-box-shadow 0.2s, -webkit-transform 0.1s;
	transition: box-shadow 0.2s, transform 0.1s;
}
.range-input::-webkit-slider-thumb:hover {
	-webkit-box-shadow: 0 2px 10px rgba(59, 130, 246, .45);
	box-shadow: 0 2px 10px rgba(59, 130, 246, .45);
	-webkit-transform: scale(1.15);
	transform: scale(1.15);
}
/* Mozilla thumb */
.range-input::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50% !important;
	background: white;
	border: 2px solid var(--accent);
	box-shadow: 0 1px 6px rgba(59, 130, 246, .3);
	pointer-events: all;
	cursor: pointer;
}
/* IE / Edge thumb */
.range-input::-ms-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50% !important;
	background: white;
	border: 2px solid var(--accent);
	pointer-events: all;
	cursor: pointer;
}
.range-input::-ms-track {
	background: transparent;
	border-color: transparent;
	color: transparent;
}
.range-input::-ms-fill-lower {
	background: transparent;
}
.range-input::-ms-fill-upper {
	background: transparent;
}
.range-labels {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	font-size: 11.52px; /* 0.72rem */
	color: var(--muted);
}
.range-labels .mid-label {
	font-weight: 600;
	color: var(--accent);
}
/* ── Budget ── */
.budget-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 4px 0; /* 0.25rem 0 */
	cursor: pointer;
}
.budget-value {
	font-size: 12.8px; /* 0.8rem */
	color: var(--muted);
}
.budget-arrow {
	color: var(--muted);
	-webkit-transition: color 0.15s;
	transition: color 0.15s;
}
.budget-row:hover .budget-arrow {
	color: var(--accent);
}
/* ── Chips ── */
.chip-group {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 6.4px; /* 0.4rem */
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.chip {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 5px;
	padding: 6.4px 12px; /* 0.4rem 0.75rem */
	border-radius: 999px !important;
	border: 1px solid var(--border);
	background: transparent;
	font-size: 12.48px; /* 0.78rem */
	color: var(--text);
	cursor: pointer;
	-webkit-transition: all 0.15s;
	transition: all 0.15s;
	outline: none;
}
.chip:hover {
	background: var(--bg);
}
.chip.selected {
	background: var(--accent);
	color: white;
	border-color: var(--accent);
}
/* ── View checkbox ── */
.view-check {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	font-size: 13.6px; /* 0.85rem */
	cursor: pointer;
	font-weight: normal;
	margin: 0;
}
.custom-check {
	width: 18px;
	height: 18px;
	border-radius: 4px !important;
	background: var(--accent);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	-webkit-transition: background 0.15s;
	transition: background 0.15s;
}
.custom-check .fa {
	color: white;
	font-size: 10.4px; /* 0.65rem */
}
/* ── Best layoutes ── */
.layout-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 10px;
	padding: 9.6px 8px; /* 0.6rem 0.5rem */
	border-radius: 9px !important;
	cursor: pointer;
	-webkit-transition: background 0.15s;
	transition: background 0.15s;
}
.layout-row:hover {
	background: var(--bg);
}
.layout-thumb {
	width: 52px;
	height: 52px;
	border-radius: 8px !important;
	object-fit: cover;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}
.layout-info {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	min-width: 0;
}
.layout-name {
	font-weight: 600;
	font-size: 13.6px; /* 0.85rem */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.layout-cap {
	font-size: 12px; /* 0.75rem */
	color: var(--muted);
	margin-top: 2px;
}
.layout-arrow {
	color: var(--muted);
	font-size: 14.4px; /* 0.9rem */
}
/* ── Reset ── */
.reset-btn {
	border: 1px solid var(--border);
	border-radius: 10px !important;
	background: transparent;
	font-size: 13.6px;
	font-weight: 500;
	color: var(--text);
	cursor: pointer;
	-webkit-transition: background 0.15s;
	transition: background 0.15s;
	outline: none;
	width: auto;
	display: table;
	margin: 16px auto 0 auto;
	padding: 10px 4em;
}
.reset-btn {
	margin-top: 25px;
}
.reset-btn:hover {
	background: var(--bg);
}
/* ── Hint ── */
.hint-bar {
	margin-bottom: 5px;
	font-size: 12px; /* 0.75rem */
	text-align: center;
}
.zone {
	fill: transparent;
	cursor: pointer;
	pointer-events: all;
	transition: all 0.25s ease;
}
.zone.no-hover {
	pointer-events: none;
}
/* =========================================
	 ACTIVE STATE (CLICK / JS CONTROLLED)
	 -> MUST mirror hover
========================================= */
/* ACTIVE = applied directly on SVG zones */
.zone.active[data-zone="floor1"] {
	fill: rgba(255, 0, 0, 0.5);
}
.zone.active[data-zone="floor2"] {
	fill: rgba(255, 255, 0, 0.5);
}
.zone.active[data-zone="floor3"] {
	fill: rgba(0, 60, 255, 0.5)
}
.zone.active[data-zone="floor4"] {
	fill: rgba(255, 165, 0, 0.5);
}
.zone.active[data-zone="floor5"] {
	fill: rgba(0, 200, 0, 0.5);
}
.zone.stroked[data-zone="floor1"] {
	stroke: rgba(255, 0, 0, 1);
	stroke-width: 5px;
}
.zone.stroked[data-zone="floor2"] {
	stroke: rgba(255, 255, 0, 1);
	stroke-width: 5px;
}
.zone.stroked[data-zone="floor3"] {
	stroke: rgba(49, 0, 255, 1);
	stroke-width: 5px;
}
.zone.stroked[data-zone="floor4"] {
	stroke: rgba(255, 165, 0, 1);
	stroke-width: 10px;
}
.zone.stroked[data-zone="floor5"] {
	stroke: rgba(0, 200, 0, 1);
	stroke-width: 10px;
}
/* =========================================
	 GLOW EFFECT
========================================= */
.zone.no-hover {
	pointer-events: none;
}
.floor1 {
	fill: rgba(255, 0, 0, 0.5);
}
/* FLOOR 2 */
.floor3 {
	fill: rgba(49, 0, 255, 0.5);
}
/* FLOOR 3 */
.floor2 {
	fill: rgba(255, 255, 0, 0.5);
}
/* FLOOR 4 (1 + 2) */
.floor4 {
	fill: rgba(255, 165, 0, 0.5);
}
/* FLOOR 5 (1 + 2 + 3) */
.floor5 {
	fill: rgba(0, 200, 0, 0.5);
}
.toggle-group {
	display: flex;
	gap: 10px;
}
.range-label {
	margin-top: 20px;
}
.toggle-button {
	font-weight: bold;
	flex: 1;
	padding: 8px 13px;
	border-radius: 999px !important;
	border: 1px solid #ccc;
	background: #fff;
	cursor: pointer;
}
	.toggle-button.active {
	background:#5f7f9f;
	color: white;
	border-color: #5f7f9f;
}
.toggle-button:hover {
	background-color: #4f6f8e;
	color: #fff;
	box-shadow: 0 0 0 4px rgba(95, 127, 159, 0.22), 0 6px 18px rgba(0, 0, 0, 0.12);
}
.capacity-selects {
	display: flex;
	gap: 10px;
}
.select-wrap {
	flex: 1;
}
.select-wrap label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--accent);
}
/* PREMIUM SELECT */
.select-wrap select {
	text-align: center;
	width: 100%;
	height: 40px;
	padding: 0 22px;
	border: none;
	border-radius: 999px !important;
	background-color: #5f7f9f;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	transition: background 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.08);
	/* WHITE ARROW */
	background-image:
		linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%);
	background-position:
		calc(100% - 24px) calc(50% - 2px), calc(100% - 18px) calc(50% - 2px);
	background-size: 6px 6px;
	background-repeat: no-repeat;
}
.select-wrap select:hover {
	background-color: #4f6f8e;
	box-shadow: 0 0 0 4px rgba(95, 127, 159, 0.22), 0 6px 18px rgba(0, 0, 0, 0.12);
}
.select-wrap select:focus {
	box-shadow:
		0 0 0 4px rgba(95, 127, 159, 0.22), 0 6px 18px rgba(0, 0, 0, 0.12);
}
.section-padding {
	width: 1170px;
	margin: 0 auto;
	padding: 80px 0;
}
/* ====================== 3D VENUE SLIDER ====================== */
/* =================================================
	 MAIN WRAPPER
================================================= */
.slider-wrapper {
	position: relative;
	max-width: 100%;
	margin: 0 auto;
	perspective: 1200px;
}
/* =================================================
	 MAIN FLOOR SLIDER ONLY
================================================= */
/* Hide until initialized */
.floor-slider {
		position: relative;
}

.floor-slider:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 15px;
		height: 100%;
		z-index: 2;
		pointer-events: none;
		background: linear-gradient(to right,#fff 0%,rgba(255,255,255,0) 100%);
}
.floor-slider:after {
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		width: 15px;
		height: 100%;
		z-index: 2;
		pointer-events: none;
		background: linear-gradient(to left,#fff 0%,rgba(255,255,255,0) 100%);
}
.slider-floor {
	opacity: 0;
	visibility: hidden;
	min-height: 540px;
	transition: opacity 0.4s ease;
}
.slider-floor.owl-loaded {
	opacity: 1;
	visibility: visible;
}
/* Prevent flash before init */
.slider-floor:not(.owl-loaded) > * {
	opacity: 0;
}
/* =================================================
	 MAIN SLIDE ITEM
================================================= */
.slider-floor .slide-item {
	position: relative;
	border-radius: 10px !important;
	overflow: hidden;
	transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}
/* ONLY images inside main slide cards */
.slider-floor .slide-item > .floor-card img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
	border-radius: 10px 10px 0 0 !important;
}
/* =================================================
	 MAIN CAROUSEL STAGE
================================================= */
.slider-floor.owl-carousel > .owl-stage-outer {
	padding: 20px 0 70px 0;
}
/* =================================================
	 MAIN OWL ITEMS ONLY
================================================= */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item {
	opacity: 1;
	transform: scale(0.85) rotateY(8deg);
	transition: all 0.5s ease;
}
/* Active item */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active {
	opacity: 1;
	transform: scale(1) rotateY(0deg);
}
/* Center item */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active.center .slide-item {
	transform: scale(1.08) rotateY(0deg) !important;
	z-index: 10;
}
/* =================================================
	 MAIN CARD SHADOWS ONLY
================================================= */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item .slide-item {
	box-shadow: 0 20px 20px rgba(0, 0, 0, 0.3);
}
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active .slide-item {
	box-shadow: 0 20px 20px rgba(0, 0, 0, 0.45);
}
/* =================================================
	 MAIN DOTS ONLY
================================================= */
.slider-floor > .owl-dots {
	margin-top: -70px;
}
.slider-floor.owl-theme .owl-dots .owl-dot span, .slider-floor.owl-theme .owl-dots .owl-dot.active span, .slider-floor.owl-theme .owl-dots .owl-dot:hover span {
	background: #000 !important;
}
/* =================================================
	 CUSTOM NAVIGATION
================================================= */
.custom-nav {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
	z-index: 20;
	padding: 0 20px;
	transform: translateY(-50%);
}
.custom-nav button {
	pointer-events: all;
	width: 50px;
	height: 50px;
	background: rgba(255, 255, 255, 1);
	border: none;
	border-radius: 50% !important;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	color: #222;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
	transition: all 0.3s;
	margin-right: -10px;
	margin-left: -10px;
}
.custom-nav button:hover {
	background: #3A5F7D;
	color: #ffffff;
	transform: scale(1.1);
}
/* =================================================
	 INNER GALLERY ONLY
================================================= */
.floor-gallery {
	width: 100%;
	height: 250px;
}
.floor-gallery .owl-stage-outer, .floor-gallery .owl-stage, .floor-gallery .owl-item, .floor-gallery .gallery-item {
	height: 100%;
}
.floor-gallery img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
/* Prevent inherited transforms from parent Owl */
.floor-gallery .owl-item, .floor-gallery .owl-item.active, .floor-gallery .owl-item.center {
	transform: none !important;
	opacity: 1 !important;
	box-shadow: none !important;
}
/* =================================================
	 STAGE
================================================= */
.slider-floor > .owl-stage-outer > .owl-stage {
	position: relative;
	transition: margin 0.4s ease;
}
/* Compact mode during swipe */
.slider-floor > .owl-stage-outer > .owl-stage.compact {
	margin-left: 0 !important;
	margin-right: -200px !important;
}
/* =================================================
	 MAIN ITEMS ONLY
================================================= */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item {
	position: relative;
	z-index: 1;
	transition: transform 0.15s linear, opacity 0.5s ease, filter 0.5s ease, z-index 0.3s ease, box-shadow 0.5s ease;
}
/* ACTIVE */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active {
	z-index: 20;
}
/* CENTER / ACTIVE CARD */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active.center .slide-item {
	transform: scale(1.08);
}
/* NON ACTIVE */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item:not(.active) {
	transform: scale(0.88) translateY(15px);
	opacity: 0.85;
	filter: brightness(0.85) saturate(0.9);
}
/* SIDE CARD */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active:not(.center) {
	transform: scale(0.92) translateY(8px);
	opacity: 0.92;
	filter: brightness(0.92);
}
/* DURING DRAG */
.slider-floor > .owl-stage-outer > .owl-stage.compact > .owl-item:not(.active) {
	transform: scale(0.85) translateY(20px);
}
/* DURING DRAG ACTIVE */
.slider-floor > .owl-stage-outer > .owl-stage > .owl-item.active.center {
	z-index: 15;
}
#sp-title:hover .bx-controls .bx-prev, #sp-slide:hover .bx-controls .bx-prev {
	left: 50px;
	transition: all 0.3s ease-in-out;
}
#sp-title:hover .bx-controls .bx-next, #sp-slide:hover .bx-controls .bx-next {
	right: 50px;
	transition: all 0.3s ease-in-out;
}
@media (max-width: 576px) {

	.floor-slider:before {
		content: none;
}
.floor-slider:after {
			content: none;
}
	.venue-tags {margin-bottom: 20px; display:none;}
	.slide-item .view-details-btn, .view-details-btn {background: var(--accent); color: white;}
	.custom-nav {
		position: absolute;
		top: 40%;
		left: 0;
	}
	.faq-answer {
		margin: 15px 0px 15px 10px;
	}
	.row.cards > [class*="col-"] {
		margin-bottom: 2em;
		display: block;
	}
	.slider-floor .floor-card-img {
		height: auto;
	}
	.slider-floor .floor-card-body {
		margin-top: 0px;
	}
}
#reasons .reason-row:first-child {
	margin-bottom: 65px;
}
#reasons .reason-item {
	display: table;
	width: 100%;
	table-layout: fixed;
}
#reasons .reason-image, #reasons .reason-content {
	display: table-cell;
	vertical-align: top;
}
#reasons .reason-image {
	width: 200px;
	padding-right: 20px;
}
#reasons .reason-image img {
	display: block;
	width: 200px;
	height: 260px;
}
#reasons .reason-content h3 {
	margin: 10px 0 15px;
	font-size: 20px;
	line-height: 1.45;
}
#reasons .reason-content p {
	margin-bottom: 0;
}

/* Tablet */
@media (max-width: 991px) {

	.google_map {
		margin-bottom: 2em;
		display: flex;
	}
	#reasons .reason-row {
		margin-bottom: 0;
	}
	#reasons .col-md-6 {
		margin-bottom: 50px;
	}
		#reasons .reason-item, #reasons .reason-image, #reasons .reason-content {
		display: block;
		width: 100%;
	}
	#reasons .reason-image {
		padding-right: 0;
		margin-bottom: 25px;
		text-align: center;
	}
	#reasons .reason-image img {
		width: 100%;
		height: auto;
		margin: 0 auto;
	}
	#reasons .reason-content h3 {
		margin-top: 0;
		font-size: 18px;
		text-align: center;
	}
}
/* Mobile */
@media (max-width: 767px) {
		.slider-floor .floor-card-title{font-size:16px;;}
	.notice, .floor-description, .floor-capacity, .floor-tags {font-size:12px;}
	#venue_intro .row > .col-md-6.col-sm-12.col-xs-12:first-child{padding-left: 0; padding-right: 0;}


}
.venue-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 10px;
	color: var(--muted);
}
.meta-item {
	display: inline-flex;
	gap: 6px;
	line-height: 1;
}
.icon-surface {
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 1.5px solid currentColor;
	position: relative;
	vertical-align: middle;
}
.icon-surface:before {
	content: '';
	position: absolute;
	width: 3px;
	height: 3px;
	border-radius: 50% !important;
	background: currentColor;
	top: -2px;
	left: -2px;
	box-shadow: 13px 0 currentColor, 0 13px currentColor, 13px 13px currentColor;
}
.icon-price {
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 1.5px solid currentColor;
	border-radius: 50% !important;
	position: relative;
	vertical-align: middle;
}
.icon-price:before {
	content: '¥';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -52%);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
}
body #sp-header{transform: translateY(0%); transition:all 0.25s ease-in-out 0s;}
body.modal-open-custom #sp-header {transform: translateY(-100%); transition:all 0.25s ease-in-out 0s;}
#sp-top-bar{ background-color:#f5f5f5;color:#999999; }
#gototop{font-size:20px; height:36px; text-align: center; width:36px;background-color:#000000;color:#fff; border-radius:10px; right:20px!important; bottom:20px!important; } #gototop:hover{background-color:#000000;color:#fff;opacity:1!important}
/* ==========================================================================
	 TABLET & SMARTPHONE RESPONSIVE PATCH (added — desktop/large screens
	 above 991px are untouched by everything below this line)
	 ========================================================================== */

/* -------------------------------------------------------------
	 1) ANCHOR NAV (#anchors) — on tablet/mobile this is meant to be
	 a horizontally-scrollable pill bar (overflow:scroll is already
	 set for ≤991px), but the desktop rule "flex:1" forces every
	 link to shrink to fit the viewport instead of scrolling, so the
	 links become unreadably squeezed. Letting them keep their
	 natural width restores real horizontal scrolling.
------------------------------------------------------------- */
@media (max-width: 991px) {
	#anchors {
		justify-content: flex-start;
	}
	#anchors a {
		flex: 0 0 auto;
		padding: 8px 12px;
	}
}

/* -------------------------------------------------------------
	 2) SEARCH FILTER ROW (.row.filter) — the two columns (course/
	 buffet toggle + capacity selects) only get an explicit width
	 from Bootstrap at >=768px (col-sm-6). Between 576px (existing
	 fix) and 767px there was a gap where the columns had no width
	 and got squeezed side by side inside display:flex. This closes
	 that gap so it always stacks cleanly on phones and small/medium
	 tablets.
------------------------------------------------------------- */
@media (max-width: 767px) {
	.row.filter {
		display: block;
	}
	.row.filter > div {
		margin-top: 15px;
	}
	.row.filter > div:first-child {
		margin-top: 0;
	}
	.row.filter label {
		text-align: center;
		margin-bottom: 0;
		margin-top: 10px;
	}
}

/* -------------------------------------------------------------
	 3) SECTION TITLES (.title-back) — the fixed line-height (150px)
	 leaves a lot of dead vertical space above/below each section
	 title on tablets. The ghost background word already scales via
	 clamp(); this brings the real heading in line with it for
	 tablet widths (mobile already has its own rule at <=576px and
	 is untouched).
------------------------------------------------------------- */
@media (max-width: 991px) and (min-width: 577px) {
	.title-back {
		font-size: 2.4em;
		line-height: 100px;
		margin: 0.8em 0;
	}
}

/* -------------------------------------------------------------
	 4) FLOOR SLIDER / GALLERY (#venue_intro) — the fixed
	 min-height:540px and 250px image gallery were sized for large
	 screens and create excessive empty/scroll space on tablets and
	 phones. Scaling these down keeps the carousel proportionate and
	 more compact.
------------------------------------------------------------- */
@media (max-width: 991px) {
	.slider-floor {
		min-height: 460px;
	}
	.floor-gallery {
		height: 220px;
	}
}
@media (max-width: 576px) {
	.slider-floor {
		min-height: 400px;
	}
	.floor-gallery {
		height: 180px;
	}
	.slider-floor .floor-card-title {
		font-size: 17px;
	}
}

/* -------------------------------------------------------------
	 5) FLOOR MAP PINS (.venue-pin / .pin-label) — on a full-width
	 mobile map, long venue-name labels are large relative to the map
	 and can overlap or run past the edge. Shrinking the label/dot
	 keeps them legible without covering the floor plan.
------------------------------------------------------------- */
@media (max-width: 767px) {
	.pin-label {
		padding: 5px 9px;
		font-size: 11px;
		box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
	}
	.pin-dot {
		width: 14px;
		height: 14px;
		margin-top: 3px;
	}
}

/* -------------------------------------------------------------
	 6) VENUE SEARCH RESULTS (.venue-grid.list-mode) — the list-row
	 image is a fixed 300px, fine on tablets but crowds the card body
	 between 577-767px (large phones / small tablets). Below 576px the
	 image is already hidden entirely by the existing mobile rule.
	 This narrows the image for the in-between range so title/
	 capacity/tags keep enough room.
------------------------------------------------------------- */
@media (max-width: 767px) and (min-width: 577px) {
	.venue-grid.list-mode .venue-card-img {
		width: 150px;
		min-height: 100px;
	}
	.venue-card-title {
		font-size: 15px;
	}
}

/* ==========================================================================
	 ROUND 2 — SMARTPHONE ONLY UPDATES
	 (everything below is scoped to <=576px unless noted, tablet/desktop
	 untouched)
	 ========================================================================== */

/* -------------------------------------------------------------
	 A) VENUE SEARCH CARDS — 2x2 GRID ON SMARTPHONES
	 NOTE: the grid + a.o.venue-card-body/img rules are written
	 against "#venueGrid" (the id already on the results container
	 in the HTML) instead of ".venue-grid.list-mode". Both selectors
	 have the exact same specificity as the *pre-existing, always-on*
	 ".venue-grid.list-mode .venue-card / -img / -body / .view-details-btn"
	 rules that force the list row layout (flex:none; width:100%;
	 flex-direction:row; ...), so whichever one happens to sit later
	 wins the tie — which is fragile if this stylesheet ever gets
	 reordered/merged. Using the id makes the override unconditional
	 and safe regardless of source order.
	 - the two .venue-meta items (面積 / 最低保証金額) stack instead
	 of sitting side-by-side with a 20px gap, which was the main
	 cause of the squashed/broken text.
	 - title, capacity and meta get mobile-appropriate font sizes
	 and line-heights instead of inheriting the desktop sizes.
------------------------------------------------------------- */
@media (max-width: 576px) {
	#gallery .row {border-radius: 0!important;}

	.anchors-wrapper.is-sticky {border-radius: 0!important}
	#venueGrid {
		flex-wrap: wrap;
		gap: 16px;
	}
	#venueGrid .venue-card {
		flex: 0 0 calc(50% - 8px) !important;
		width: calc(50% - 8px) !important;
		max-width: calc(50% - 8px) !important;
		min-width: 0 !important;
	}
	#venueGrid .venue-card > a {
		flex-direction: column !important;
	}
	#venueGrid .venue-card-img {
		display: block !important;
		width: 100% !important;
		height: 100px !important;
		min-height: 0 !important;
		border-radius: 0 !important;
		order: 2;
	}
	#venueGrid .venue-card > a .space-badge-v2 {
		order: 1;
	}
	#venueGrid .venue-card-body {
		order: 4;
		padding: 5px !important;
		text-align: center;
		justify-content: flex-start !important;
	}
	#venueGrid .venue-map {
		order: 3;
	}
	#venueGrid .venue-card-title {
		font-size: 13px;
		line-height: 1.4;
		min-height:36.5px;
		margin-bottom: 8px;
	}
	#venueGrid .venue-capacity {
		font-size: 11px;
		line-height: 1.7;
		margin-bottom: 8px;
	}
	#venueGrid .venue-meta {
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 8px;
		margin-bottom: 10px;
	}
	#venueGrid .meta-item {
		font-size: 11px;
		line-height: 1.5;
		align-items: flex-start;
	}
	#venueGrid .view-details-btn {
		font-size: 12px;
		padding: 8px !important;
		width: 100% !important;
	}
}

/* -------------------------------------------------------------
	 B) ANCHOR NAV — SLIDE ARROWS (v2: solid full-height panel,
	 no gradient fade, per feedback)
	 Pure styling for the two arrow buttons (markup + JS live in
	 index.html, since knowing whether you can still scroll left /
	 right requires a tiny bit of script — CSS alone can't read
	 scroll position). Only ever shown on tablet/mobile (<=991px)
	 since the desktop nav does not scroll.
------------------------------------------------------------- */
.anchor-arrow {
	display: none;
	position: absolute;
	top: 0;
	height: 100%;
	width: 32px;
	align-items: center;
	justify-content: center;
	border: none;
	cursor: pointer;
	z-index: 95;
	padding: 0;
	background: #ffffff;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
}
.anchor-arrow i {
	color: #4A7394;
	font-size: 16px;
}
.anchor-arrow.is-visible {
	opacity: 1;
	pointer-events: auto;
}
.anchor-arrow-left {
	left: 0;
	box-shadow: 3px 0 6px -3px rgba(0, 0, 0, 0.18);
}
.anchor-arrow-right {
	right: 0;
	box-shadow: -3px 0 6px -3px rgba(0, 0, 0, 0.18);
}
@media (min-width: 992px) {
.background-blue .title-back {
	margin-bottom: 0
}
}
@media (max-width: 991px) {
	.anchor-arrow {
		display: flex;
	}
	.anchors-wrapper {
		position: relative;
	}
}

/* ==========================================================================
   USE CASE SECTION (#case) — MOBILE & TABLET SWIPE CAROUSEL (OPTION 1)
   ========================================================================== */

@media (max-width: 991px) {
  /* 1. Turn container into a horizontal scroll track */
  #case .row.cards {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 15px; /* Room for shadow and smooth scrolling */
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 2. Configure card columns for smooth snapping */
  #case .row.cards > [class*="col-"] {
    scroll-snap-align: center;
    flex-shrink: 0 !important;
    margin-bottom: 0 !important;
  }

  /* 3. Card internal spacing & structure */
  #case .card {
    height: 100%;
    margin-bottom: 0 !important;
  }

  /* Custom subtle scrollbar styling */
  #case .row.cards::-webkit-scrollbar {
    height: 4px;
  }
  #case .row.cards::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
  }
  #case .row.cards::-webkit-scrollbar-thumb {
    background: #5c7d99;
    border-radius: 4px;
  }
}

/* --- TABLET SPECIFIC (577px to 991px) --- */
@media (min-width: 577px) and (max-width: 991px) {
  #case .row.cards > [class*="col-"] {
    width: 60% !important; /* Shows ~1.5 cards for intuitive swiping */
    padding-left: 10px;
    padding-right: 10px;
  }
  #case .row.cards > [class*="col-"]:first-child {
    padding-left: 0;
  }
	#brands .tab-content #xex .xex-list > div {
  flex: fit-content;
}
}

/* --- SMARTPHONE SPECIFIC (<= 576px) --- */
@media (max-width: 576px) {
	#venueGrid .meta-item{display:block;}
	#venueGrid .meta-item span {display:block;}
	#venueGrid .meta-item .icon-surface + span, #venueGrid .meta-item .icon-surface, #venueGrid .meta-item .icon-price {display:inline-block!important;}

  #case .row.cards > [class*="col-"] {
    width: 90% !important; /* 85% card width + 15% peek view */
    padding-left: 8px;
    padding-right: 8px;
  }
  #case .row.cards > [class*="col-"]:first-child {
    padding-left: 0;
  }
  #case .row.cards > [class*="col-"]:last-child {
    padding-right: 15px; /* Padding offset for last card */
  }

  /* Keep card content dense & legible on narrow screens */
  #case .card-row .label, 
  #case .card-row .value {
    text-align: left !important;
  }
  
  #case .card-row .label {
    width: 90px !important;
    display: table-cell !important;
  }
  
  #case .card-row .value {
    display: table-cell !important;
    padding-left: 10px !important;
  }
}

/* ==========================================================================
   2x2 GRID EQUAL HEIGHT FIX FOR TABLETS & SMARTPHONES (purpose & reasons)
   ========================================================================== */

@media (max-width: 991px) {
  /* 1. Turn Bootstrap rows into Flexbox containers */
  .purpose-section,
  .reasons-section {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  /* Prevent pseudo-elements from acting as flex children */
  .purpose-section::before, .purpose-section::after,
  .reasons-section::before, .reasons-section::after {
    display: none !important;
  }

  /* 2. Make grid items equal height and stretch properly */
  .purpose-section > [class*="col-"],
  .reasons-section > [class*="col-"] {
    display: flex !important;
    flex-direction: column !important;
    float: none !important; /* Clear floats so flexbox handles alignment */
    margin-bottom: 25px; /* Clean spacing between rows */
  }

  /* 3. Ensure reason items stretch to full container height */
  #reasons .reason-item {
    height: 100%;
  }

  /* 4. Fix typography and alignment for reason descriptions on small screens */
  .reasons-section h4 {
    font-size: 16px;
    line-height: 1.35;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .reasons-section p {
    font-size: 13px;
    line-height: 1.6;
  }
}

/* ==========================================================================
   SMARTPHONE SEARCH FORM - TRUE ACCORDION STYLE (#search)
   ========================================================================== */
@media (max-width: 576px) {
  /* 1. Form Container Setup */
  #search .form-container {
    padding: 1rem !important;
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  #search .form-container .title {
    font-size: 1.25em !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-align: center;
    margin-bottom: 1.25rem !important;
  }

  /* 2. Convert Tab Structure into an Interleaved Vertical Accordion */
  #search .rl_tabs {
    display: flex !important;
    flex-direction: column !important;
  }

  /* Expose direct children to parent flexbox */
  #search .rl_tabs > ul.nav-tabs,
  #search .rl_tabs > .tab-content {
    display: contents !important;
  }

  /* Interleave Headers (Odd numbers) and Content Panes (Even numbers) */
  /* Accordion 1: Brand */
  #search .rl_tabs > ul.nav-tabs > li:nth-child(1) { order: 1 !important; }
  #search .tab-content > #brand                     { order: 2 !important; }

  /* Accordion 2: Area */
  #search .rl_tabs > ul.nav-tabs > li:nth-child(2) { order: 3 !important; }
  #search .tab-content > #area                      { order: 4 !important; }

  /* Accordion 3: People */
  #search .rl_tabs > ul.nav-tabs > li:nth-child(3) { order: 5 !important; }
  #search .tab-content > #people                    { order: 6 !important; }

  /* 3. Accordion Header Bar Base Styles */
  #search .rl_tabs > ul.nav-tabs > li {
    width: 100% !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
  }

  /* Closed Header Bar (Light Gray/Blue, Right Arrow) */
  #search .rl_tabs > ul.nav-tabs > li a {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    width: 100% !important;
    background-color: #ebf1f7 !important;
    color: #1f2937 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    text-align: left !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease;
  }

  #search .rl_tabs > ul.nav-tabs > li a::after {
    content: "\f105"; /* FontAwesome Chevron Right '>' */
    font-family: "FontAwesome";
    font-size: 16px;
    color: #4A7394;
		
  }
	
  #search .rl_tabs > ul.nav-tabs > li.active a::after {
    content: "\f107" !important; /* FontAwesome Chevron Down '∨' */
    font-family: "FontAwesome" !important;
    font-size: 16px;
    color: #ffffff;
  }
  /* Active / Expanded Accordion Header Bar (Navy Blue, Left Down Arrow) */
  #search .rl_tabs > ul.nav-tabs > li.active {
    margin-bottom: 0 !important;
  }

  #search .rl_tabs > ul.nav-tabs > li.active a {
    background-color: #4A7394 !important;
    color: #ffffff !important;
    border: 1px solid #4A7394 !important;
    border-radius: 10px 10px 0 0 !important;
  }



  /* 4. Active Panel Content Box (Appears Directly Beneath Header) */
  #search .tab-content .tab-pane {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #search .tab-content .tab-pane.active {
    display: block !important;
    background: #ffffff !important;
    border: 1px solid #4A7394 !important;
    border-top: none !important;
    border-radius: 0 0 10px 10px !important;
    padding: 1rem !important;
    margin-bottom: 8px !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03) !important;
  }

  #search .tab-content .rl_tabs-title {
    display: none !important;
  }

  #search .tab-content .row {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  #search .tab-content .row > div {
    width: 100% !important;
    padding: 0 !important;
  }

  /* Option Item Buttons inside Active Accordion */
  #search .form-container .option-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 0.85rem 1rem !important;
    background-color: #f2f4f7 !important;
    color: #1a1a1a !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    margin-bottom: 0 !important;
    position: relative;
    box-sizing: border-box !important;
  }

  /* Active Option Badge (e.g. Selected item with Checkmark) */
  #search .form-container .option-btn.active,
  #search .form-container .option-btn[data-selected="true"] {
    background-color: #e6f0fa !important;
    color: #111827 !important;
    border-color: #bcd7f0 !important;
  }

  #search .form-container .option-btn.active::after,
  #search .form-container .option-btn[data-selected="true"]::after {
    content: "\f058"; /* FontAwesome Check Circle */
    font-family: "FontAwesome";
    position: absolute;
    right: 14px;
    color: #4A7394;
    font-size: 18px;
  }

  /* Selected Tag Pills ("選択中の条件") */
  #selected-tags {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important;
  }

  .tags-container .tag {
    background-color: #e6f0fa !important;
    color: #4A7394 !important;
    border: 1px solid #c8deea !important;
    border-radius: 8px !important;
		gap:0;
  }

  .tags-container .tag .remove {
    color: #4A7394 !important;
    margin-left: 8px !important;
  }

  /* 5. Search & Reset Buttons (Strictly Constrained to Form Width) */


  #search .form-container .btn-search {
    width: 100% !important;
    background-color: #4A7394 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    letter-spacing: 2px;
    box-sizing: border-box !important;
    display: block !important;
  }

  #search .form-container .btn-reset {
    width: 100% !important;
    background-color: #f2f4f7 !important;
    color: #333333 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    display: block !important;
  }
	#results {margin: 1em 0 0 0;}
	#results_container ul.row > li .details {display:none;}
	#results_container ul.row > li {width: 50%; padding: 5px;}
	#results h2 {margin-top: 1em;margin-bottom: 1em;}
}
@media (max-width: 991px) {
    #anchors {
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }
}