@import url(../css/style_nav/style_latest_news/style_latest_news_list.css);

@import url(../css/style_nav/style_dining/style_dining_swiper_card.css);

@import url(../css/style_nav/style_facilities/style_facilities.css);

@import url(../css/style_nav/style_rooms/style_rooms_swiper.css);


/*全站共用樣式*/
:root {
	--index_facilities_slide:clamp(16.13rem, 26.04vw, 31.25rem);          /* 設施小圖片寬度 */
	--index_facilities_slide_act:clamp(25.485rem, 41.15vw, 49.375rem);    /* 設施大圖片寬度 */
	--index_facilities_multiplier:1.58;                                   /* 設施小圖片寬度 * 1.58 = 設施大圖片寬度 */
	--index_facilities_gap:0.9375rem;                                     /* 設施左右間距15 */

	--index_facilities_Offset: calc(var(--index_facilities_slide) / 1.58 - var(--index_facilities_slide) + clamp(1.175rem, 2.45vw, 2.938rem));  /* 設施小圖片偏移位置 */


	/* 設施大圖片內部所有元素高度+上下間距 */
	--index_facilities_slide_act_img_h:calc( var(--index_facilities_slide) * var(--index_facilities_multiplier) / 1.49);
	--index_facilities_slide_act_img_gap:calc(clamp(1.29rem, 2.08vw, 2.5rem) / var(--index_facilities_multiplier) * 2);
	--index_facilities_slide_act_top_h:calc(clamp(2rem, 1.2rem + 1.29vw, 2.75rem) / var(--index_facilities_multiplier));
	--index_facilities_slide_act_bot_h:calc( clamp(2rem, 1.2rem + 1.29vw, 2.75rem) + clamp(0.938rem, 0.871rem + 0.11vw, 1rem) + (clamp(0.875rem, 1.25vw, 1.5rem) * 0.6) / var(--index_facilities_multiplier) );


	/* 設施大圖片最小高度 */
	--index_facilities_slide_act_min_h: calc(  var(--index_facilities_slide_act_img_h) + var(--index_facilities_slide_act_img_gap) + var(--index_facilities_slide_act_top_h) + var(--index_facilities_slide_act_bot_h)  );

}

@media screen and (min-width: 990.1px) {

}

@media screen and (min-width: 768.1px) and (max-width: 990px) {

}



/*========================================================*/
/*-------首頁內容--------*/
/*========================================================*/









/*/////////////////////////////////////////////////////////*/
/*-------共用區塊--------*/
/*/////////////////////////////////////////////////////////*/


/*首頁內容區塊*/	
.mainContent{
	padding: 0;
	/* padding:  0 0 clamp(1.6130rem, 2.6042vw, 3.1250rem); */ /* 25.81px , 2.6042vw , 50.00px */
}



.index_itemBg {
	box-sizing: border-box;
	padding: clamp(2.097rem, 3.39vw, 4.063rem) 0;
}



/* ====================================================================
   首頁標題1
   ==================================================================== */
	/*----- 首頁標題1 -----*/

	.index_title_area {
		
	}

	.index_title {
		font-size: clamp(1.5rem, 1.5625vw, 1.875rem);
		font-weight: 700;
		color: var(--dark_color_sec);
		line-height: 1;
		margin-bottom: clamp(1.313rem, 0.046rem + 2.05vw, 2.5rem);
		display: flex;
		justify-content: center;
		text-align: center;
		align-items: center;
		gap: 0.625rem;
	}

	.index_title img {
		width: 100%;
		height: auto;
		max-width: clamp(1.5rem, 0.033rem + 2.37vw, 2.875rem);
	}

	.index_title .index_title_text {
		font-size: inherit;
		font-weight: inherit;
		color: inherit;
		display: inline-block;
	}








/* ====================================================================
   首頁標題2          共用：Section 3 / 4 / 5 標題列 
   ==================================================================== */

.index_title_area2 {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: clamp(1.25rem, 2.083vw, 2.5rem);
}

.index_title_text2 {
	display: flex;
	align-items: flex-end;
	gap: clamp(0.484rem, 0.78vw, 0.938rem);
}

.index_title_main2 {
	font-size: clamp(2.272rem, 1.363rem + 1.47vw, 3.125rem);
	font-weight: 700;
	color: var(--primary_color);
	line-height: 1;
	font-family: var(--mandarin_font2);
	letter-spacing: clamp(0.546rem, 0.328rem + 0.35vw, 0.75rem);
}

.index_title_sub2 {
	font-size: clamp(1.364rem, 0.818rem + 0.88vw, 1.875rem);
	color: var(--primary_color);
	font-weight: 600;
}

.index_title_sub2::before {
	/* content: '';
	display: inline-block;
	margin: 0 0.5rem;
	background-color: var(--primary_color);
	height: .0625rem;
	width: 50%; */
	/* font-size: 0.85em; */
	/* letter-spacing: -0.05em; */
}
.index_title_area2 .line {
	display: inline-block;
	/* background-color: var(--primary_color); */
	background-color: var(--fifth_color);
	height: .0625rem;
	width: clamp(3.549rem, 5.73vw, 6.875rem);
	/* transform: rotate(17deg) translateX((clamp(0.226rem, 0.36vw, 0.438rem)) * -1) translateY(calc(clamp(0.484rem, 0.78vw, 0.938rem) * -1)); */
	transform: rotate(17deg) translateX(calc( clamp(0.226rem, 0.36vw, 0.438rem) * -1 ) ) translateY(calc( clamp(0.484rem, 0.78vw, 0.938rem) * -1 ) );
	transform-origin: center top;
	/* height: .0625rem; */
	/* width: clamp(3.549rem, 5.73vw, 6.875rem); */
	/* transform: rotate(-65deg) translateX(calc( clamp(0.226rem, 0.36vw, 0.438rem) * -1 ) ) translateY(calc( clamp(0.484rem, 0.78vw, 0.938rem) * -1 ) ); */
	overflow: hidden;
}


	.index_tit_line{
		width: calc(clamp(3.549rem, 5.73vw, 6.875rem) * 10);
		height: calc(0.0625rem * 10);
		margin: 0 auto;
		position:relative;
		/* overflow:hidden; */
		transform: rotate(271deg);
		transform-origin: -9px calc(100% + 20px);
	}
	.index_tit_line:before{
		position:absolute;
		content:'';
		background-color: var(--primary_color);
		width: 500px;
		height: 155px;
		top: 0;
		left: 0%;

		/*效果命名*/
		transform: translateX(0%);
		animation: sdl 2s 1s infinite cubic-bezier(0.645, 0.045, 0.355, 1);
	}
	
	@keyframes sdl {
	  0% {
		transform: scale(1, 1);
		transform-origin: 100% 100%;
	  }
	  15% {
		transform: scale(1, 1);
		transform-origin: 100% 100%;
	  }
	  30% {
		transform: scale(1, 0);
		transform-origin: 100% 100%;
	  }
	  45% {
		transform: scale(1, 0);
		transform-origin: 0 0;
	  }
	  100% {
		transform: scale(1, 1);
		transform-origin: 0 0;
	  }
	}




















	/* 查看更多案紐 樣式1 */
	.index_more_link_btn{
		font-size: clamp(1.046rem, 0.628rem + 0.67vw, 1.438rem);
	}

		.index_more_link_btn a{
			display: flex;
			font-size: inherit;
			text-decoration: none !important;

			flex-shrink: 0;
			display: inline-flex;
			align-items: center;
			gap: 0.375rem;
			font-size: inherit;
			/* font-size: clamp(0.875rem, 0.917vw, 1rem); */
			color: var(--primary_color);
			font-weight: 600;
			text-decoration: none;
			white-space: nowrap;
			transition: var(--transition-data);
		}
		.index_more_link_btn a:hover {
			color: var(--third_color);
			text-decoration: none;
		}

			.index_more_link_btn .btn_text{
				margin: 0;
				padding: 0;
				font-size: inherit;
				font-weight: inherit;
				line-height: inherit;
				color      : inherit;
			}
			.index_more_link_btn .btn_text::after{
				content: '\F285';
				font-family: 'bootstrap-icons';
				font-weight: 900;
				font-size: calc(clamp(0.938rem, 0.871rem + 0.11vw, 1rem) * 0.7);
			}
			.index_more_link_btn a i {
				font-size: 1.125rem;
				transition: var(--transition-data);
			}

			.index_more_link_btn a:hover i {
				transform: translateX(0.25rem);
			}







	/* 首頁查看更多案紐 樣式2		 */
	.index_more_link_btn2{
		display: flex;
		align-items: baseline;
		justify-content: center;
		gap: 0.25rem;
		font-weight: 600;
		color: var(--dark_color_sec);
		border: var(--dark_color_sec) 1px solid;
		transition:all .45s ease;
		text-decoration: none;
		/* padding: clamp(0.71rem, 0.001rem + 1.15vw, 1.375rem) clamp(1.032rem, 1.67vw, 2rem); */
		border-radius: 5px;
		font-size: clamp(0.909rem, 0.546rem + 0.59vw, 1.25rem);
		width: max-content;
	}

		.index_more_link_btn2 a , .btn_animate .more_btn{
			margin: 0;
			padding: 0;
			font-size: inherit;
			font-weight: inherit;
			line-height: inherit;
			color      : inherit;
			gap: inherit;
			display: flex;
			text-decoration: none !important;
			padding: clamp(0.71rem, 0.001rem + 1.15vw, 1.375rem) clamp(1.032rem, 1.67vw, 2rem);
			transition:all .45s ease;
		}
			.index_more_link_btn2 .btn_text{
				margin: 0;
				padding: 0;
				font-size: inherit;
				font-weight: inherit;
				line-height: inherit;
				color      : inherit;
				display: flex;
				align-items: center;
				gap: inherit;
			}
			.index_more_link_btn2 .btn_text::after{
				content: '\F138';
				font-family: 'bootstrap-icons';
				font-weight: 900;
				font-size: calc(clamp(0.938rem, 0.871rem + 0.11vw, 1rem) * 1.25);
			}



		.index_more_link_btn2:hover{
			/* background: var(--primary_color);
			border-color: var(--primary_color);;
			color: #fff; */
		}



	/* 首頁查看更多案紐 動畫 */
		.btn_animate a , 
		.btn_animate .more_btn{
			--x:50%;
			--y:50%;

			position:relative;
			overflow:hidden;

			display:inline-flex;
			justify-content:center;
			align-items:center;

			border:none;
			background:transparent;
			cursor:pointer;
			text-decoration:none;
		}		

		.btn_animate .more_btn::before{
			content:"";
			position:absolute;

			left:var(--x);
			top:var(--y);

			width:0;
			aspect-ratio:1;

			border-radius:50%;
			background:var(--primary_color);

			transform:translate(-50%,-50%);
			transition:width .45s ease;

			z-index:0;
		}

		.btn_animate .more_btn:hover::before{
			width:250%;
		}
		.btn_animate .more_btn:hover{
			color: #fff;
			transition:all .45s ease;
		}
		.btn_animate .btn_text{
			position:relative;
			z-index:1;
		}

























	
@media (max-width: 990px){
	
	.mainContent{	
	}	
		/*----- 首頁標題1 -----*/
		.index_title{
			
		}
		/*----- 首頁標題2 -----*/
		.index_title2{
			
		}		

}
@media (max-width: 768px){

	.index_title_main2 {
		/* font-size: clamp(2.272rem, 1.363rem + 1.47vw, 3.125rem); */
		letter-spacing: 0;
	}

}






/* ========================================================= */
/* --- 首頁 main 內容樣式                                   --- */
/* ========================================================= */


	.index_itemBg .split {
		opacity: 0;
		will-change: transform;
	}

	.index_itemBg .split * {
		will-change: transform;
	}









/* ========================================================= */
/* Section 1：banner                                     */
/* ========================================================= */



.banner_link{
	position: relative;
    display: block;
    overflow: hidden;
}

/* 文字 + 按鈕疊加層（對齊設計稿左側） */
.index_banner_box {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 85%;
	/*max-width: 105rem;*//* 1680px：對齊內容寬度 */
	max-width: 93.75rem;
	padding: 0 clamp(1.25rem, 2vw, 2.5rem);
	box-sizing: border-box;
	pointer-events: none; /* 讓圖片可點擊，內部互動元素再開啟 */
}

	.index_banner_info {
		max-width: clamp(20rem, 42%, 39rem);
		display: flex;
		flex-direction: column;
		row-gap: clamp(0.875rem, 1.4vw, 1.625rem);
	}

		.index_banner_box .title {
			display: block;
			font-weight: 700;
			line-height: 1.3;
			letter-spacing: 0.04em;
			color: var(--fifth_color); /* 第一行：深綠 */
			font-size: clamp(1.875rem, 3vw, 3.25rem); /* 30 → 52px */
			text-shadow: 0 1px 2px rgba(255, 255, 255, 0.55);
		}
			.index_banner_box .title .accent {
				color: var(--sixth_color); /* 第二行：粉紅 */
			}

		.index_banner_box .description {
			/* margin-top: clamp(0.875rem, 1.4vw, 1.625rem); */
			color: var(--dark_color);
			line-height: 1.5;
			letter-spacing: 0.02em;
			font-size: clamp(0.9375rem, 1.04vw, 1.25rem); /* 15 → 20px */
			text-shadow: 0 1px 2px rgba(255, 255, 255, 0.45);
		}

	.index_banner_btn {
		display: flex;
		flex-wrap: wrap;
		gap: clamp(0.75rem, 1.2vw, 1.25rem);
		margin-top: clamp(1.375rem, 2.2vw, 2.5rem);
		pointer-events: auto;
		justify-content: unset;
	}
		.index_banner_btn button {
			display: inline-flex;
			align-items: center;
			gap: 0.5rem;
			border: 2px solid transparent;
			border-radius: 3rem;
			cursor: pointer;
			font-family: inherit;
			font-weight: 600;
			letter-spacing: 0.06em;
			line-height: 1.0;
			font-size: clamp(0.9375rem, 1vw, 1.1875rem); /* 15 → 19px */
			padding: calc(clamp(0.7rem, 0.9vw, 0.95rem)  * 0.6)  clamp(1.5rem, 2.2vw, 2.5rem);
			transition: var(--transition-data);
		}
			.index_banner_btn .txt{
				font-size: inherit;
				color: inherit;
			}


		/* 主要：認識我們（深綠實心 + 箭頭） */
		.index_banner_btn button:first-child {
			background-color: var(--fifth_color);
			color: #fff;
			box-shadow: 0 0.5rem 1.125rem -0.375rem rgba(79, 111, 93, 0.6);
		}
			.index_banner_btn button:first-child::after {
				/* content: "\2192"; */ /* → */
				/* font-weight: 400; */
				/* transition: var(--transition-data); */
			}
			.index_banner_btn button:first-child:hover {
				background-color: #3f5b4c;
				transform: translateY(-2px);
				box-shadow: 0 0.7rem 1.3rem -0.375rem rgba(79, 111, 93, 0.7);
			}
				.index_banner_btn button:first-child:hover::after {
					transform: translateX(0.25rem);
				}

		/* 次要：支持孩子（白底粉框 + 愛心） */
		.index_banner_btn button:last-child {
			background-color: #fff;
			color: var(--sixth_color);
			border-color: var(--sixth_color);
		}
			.index_banner_btn button:last-child::after {
				/*content: "\2665"; *//* ♥ */
			}
			.index_banner_btn button:last-child:hover {
				/* background-color: var(--sixth_color);
				color: #fff; */
			}
			.index_banner_btn button:last-child i{
				font-size: calc(clamp(1.25rem, 0.583rem + 1.08vw, 1.875rem) * 0.7);
			}

.banner_item picture {
    aspect-ratio: 1917 / 818;
	object-fit: cover;
}
	.banner_item picture img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		float: none;
		width: 100% !important;
		height: 100% !important;
		object-fit: cover;
		transition: 0.3s ease all;
	}






/* --- 平板 --- */
/* @media (max-width: 990px) {
	.index_banner_info {
		max-width: 60%;
	}
} */

/* --- 手機（切換 banner_mobile，文字改置於圖片下方） --- */
@media (max-width: 990px) {
	.index_banner_box {
		position: static;
		transform: none;
		max-width: 100%;
		width: 100%;
		padding: clamp(1.5rem, 6vw, 2rem) clamp(1.25rem, 6vw, 1.75rem) clamp(2rem, 8vw, 2.5rem);
		text-align: center;
	}
		.index_banner_info {
			max-width: 100%;
		}
		.index_banner_box .title,
		.index_banner_box .description {
			text-shadow: none;
		}
		.index_banner_btn {
			justify-content: center;
		}
			.index_banner_btn button {
				padding: clamp(0.7rem, 0.9vw, 0.95rem)  clamp(1.5rem, 2.2vw, 2.5rem);
			}


	.banner_item picture {
		aspect-ratio: 1/1;
		object-fit: cover;
	}
}


@media (max-width: 640px) {

	.index_banner_box {
		padding: clamp(1.5rem, 6vw, 2rem) 0.3125rem clamp(2rem, 8vw, 2.5rem);
	}
		.index_banner_btn button i{
			display: none;
		}
}























/* ========================================================= */
/* Section 2：精選優惠 .index_hotel_dealsBg                 */
/* ========================================================= */

.index_hotel_dealsBg {
	padding: clamp(2.5rem, 4.167vw, 5rem) 0;
	background-color: #ffffff;
}


/* ---- 標題列：標題 + 頁籤 + 查看更多 ---- */

.index_hotel_deals_header {
	display: flex;
	align-items: center;
	gap: clamp(1rem, 2.083vw, 2.5rem);
	flex-wrap: wrap;
	margin-bottom: clamp(1.25rem, 2.083vw, 2.5rem);
}

.index_hotel_dealsBg .index_title {
	flex-shrink: 0;
	margin-bottom: 0;
	justify-content: flex-start;
	text-align: left;
}

.index_hotel_deals_header .index_news_area {
	/* flex: 1;
	min-width: 0; */
}

.index_hotel_deals_header .text_bottom .tab_area {
	border-bottom: none;
}

.index_hotel_deals_header .text_bottom .img-scroll {
	height: auto;
}

.index_hotel_deals_header .text_bottom .img-list {
	position: static;
}

.index_hotel_deals_header .text_bottom ul.tabs {
	display: flex;
	flex-wrap: wrap;
}

.index_hotel_deals_header .text_bottom .tabs li {
	float: none;
}



	
.index_hotel_deals_header .text_bottom .tabs a, 
.index_hotel_deals_header .text_bottom .tabs span,
.index_hotel_deals_header .text_bottom .tab_button  {
	background: transparent;
}
.index_hotel_deals_header .text_bottom .tabs li.active span ,
.index_hotel_deals_header .text_bottom .tabs li.active .tab_button {
	/* position: relative;
	box-shadow:none;
	color: #fff;
	background-color: var(--second_color); */
	background-color: transparent;
	color: var(--third_color);
}

.index_hotel_deals_header .text_bottom .tabs li .tab_button:focus {
	/* outline-width:var(--focus_outline-width);
	outline-style: var(--focus_outline-style);
	outline-color: var(--focus_outline-color); */
}

.index_hotel_deals_header .text_bottom .tabs li a:hover, 
.index_hotel_deals_header .text_bottom .tabs li span:hover ,
.index_hotel_deals_header .text_bottom .tabs li .tab_button:hover {
    background-color: transparent;
    color: var(--third_color);
}





.index_hotel_deals_header .index_more_link_btn{
	margin-left: auto;
	line-height: 2.4375rem;
}


	.index_hotel_deals_more_link {
		/* flex-shrink: 0;
		display: inline-flex;
		align-items: center;
		gap: 0.375rem;
		font-size: clamp(0.875rem, 0.917vw, 1rem);
		color: var(--primary_color);
		font-weight: 600;
		text-decoration: none;
		white-space: nowrap;
		transition: var(--transition-data); */
	}

	.index_hotel_deals_more_link:hover {
		/* color: var(--third_color); */
		/* text-decoration: none; */
	}

	.index_hotel_deals_more_link i {
		/* font-size: 1.125rem;
		transition: var(--transition-data); */
	}

	.index_hotel_deals_more_link:hover i {
		/* transform: translateX(0.25rem); */
	}


/* ---- 頁籤內容面板 ---- */

.index_hotel_deals_panels {
	background: transparent;
	padding: 0;
}


/* ---- Responsive ---- */




@media screen and (max-width: 1100px) and (min-width: 760.1px)  {

	.index_hotel_deals_header .index_more_link_btn{
		margin-left: auto;
	}

}



@media (max-width: 990px) {

	.index_hotel_deals_header {
		gap: 0.75rem;
	}

		/* .hotel_deals_area {
			row-gap: clamp(0.75rem, 1.25vw, 1.5rem);
		}	
		.hotel_deals_top {
			grid-template-columns: repeat(1 , 1fr);
		}

		.hotel_deals_bot {
			grid-template-columns: repeat(2, 1fr);
		}

			.hotel_deals_right_col {
			} */


}




@media screen and (min-width: 760.1px){
	
	.index_hotel_deals_header .text_bottom .tabs li span::before ,
	.index_hotel_deals_header .text_bottom .tabs li .tab_button::before   {
		font-family: unset;
		content: "";
		background-color: var(--third_color);
		width: 100%;
		max-width: calc(100% - (clamp(0.581rem, 0.94vw, 1.125rem) * 2));
		height: 3px;
		bottom: 0;
		opacity: 0;
	}
	.index_hotel_deals_header .text_bottom .tabs li.active span::before ,
	.index_hotel_deals_header .text_bottom .tabs li.active span:hover::before,
	.index_hotel_deals_header .text_bottom .tabs li.active .tab_button::before {
		/* font-family: unset;
		content: "";
		background-color: var(--third_color);
		width: 100%;
		max-width: calc(100% - (clamp(0.581rem, 0.94vw, 1.125rem) * 2));
		height: 3px;
		bottom: 0; */
		opacity: 1;
	}
	
	.index_hotel_deals_header .text_bottom .tabs li span:hover::before ,
	.index_hotel_deals_header .text_bottom .tabs li .tab_button:hover::before{
		/* color: var(--seventh_color); */
	}
}



@media (max-width: 760px) {


	.index_hotel_deals_header{
		flex-direction: column;
	}

		.index_hotel_deals_header .index_news_area {
			width: 100%;
		}

		.index_news_area .tabs_btn_now_arrow i {
			font-size: 1.5rem;
			color: #fff;
			transform: translateX(-1rem);
		}

		
	/* .hotel_deals_right_col {
		flex-direction: row;
	} */

}

@media (max-width: 480px) {

	.index_hotel_deals_header {
		flex-wrap: wrap;
	}

	/* .hotel_deals_bot {
		grid-template-columns: 1fr;
	}

	.hotel_deals_right_col {
		flex-direction: column;
		grid-template-columns: repeat(1 , 1fr);
	} */
}




























/* ====================================================================
   Section 3：飯店房型介紹 .index_hotel_roomsBg
   ==================================================================== */

.index_hotel_roomsBg {
	padding: clamp(2.5rem, 4.167vw, 5rem) 0;
	background-color: var(--second_color);
	overflow: hidden;
	/* display: none; */
}

	.index_hotel_roomsBg .wrap{
		max-width: 108.125rem;
	}

		.index_hotel_rooms_header{

		}
			.index_hotel_rooms_header .index_title_main2{
				color: #fff;
			}
			.index_hotel_rooms_header  .index_title_sub2{
				color: #fff;
			}
			.index_hotel_rooms_header  .line{
				/* background-color: #fff; */
				background-color: var(--fifth_color);
			}
			/* .index_hotel_rooms_header  .line{
				background-color: var(--fifth_color);
			} */
				.index_hotel_rooms_header  .index_tit_line{
				}
				.index_hotel_rooms_header  :before{
					/* background-color: var(--primary_color); */
					background-color: #fff;
				}
				













			.index_hotel_rooms_header  .index_more_link_btn a {
				color: #fff;
			}


	.hotel_rooms_area_inner{

	}




    .index_hotel_roomsBg .swiper {
      width: 100%;
      /* height: 300px; */
      margin-left: auto;
      margin-right: auto;
    }

    .index_hotel_roomsBg .swiper-slide {
      background-size: cover;
      background-position: center;
    }

    .index_hotel_roomsBg .mySwiper2 {
      /* height: 80%; */
      width: 100%;
      /* height: 100%; */
      /* background-color: #ddd; */
    }

    .index_hotel_roomsBg .mySwiper {
      /* height: 20%; */
      box-sizing: border-box;
      /* padding: 10px 0; */
    }

    .index_hotel_roomsBg .mySwiper .swiper-slide {
      width: 100%;
      /* height: 100%; */
      /* opacity: 0.4; */
    }

    .index_hotel_roomsBg .mySwiper .swiper-slide-thumb-active {
      opacity: 1;
    }

    .index_hotel_roomsBg .mySwiper .swiper-slide:not(.swiper-slide-thumb-active) .rooms_thumb_list{  
		border-radius: clamp(0.645rem, 1.04vw, 1.25rem);
		aspect-ratio: 1.62 / 1;    
		background-color: #fff;
    }
    .index_hotel_roomsBg .mySwiper .swiper-slide:not(.swiper-slide-thumb-active) .hotel_rooms_thumb_img{      
      opacity: 0.4;
    }





    .index_hotel_roomsBg .swiper-slide img {
      /* display: block; */
      /* width: 100%; */
      /* height: 100%; */
      /* object-fit: cover; */
    }



	.hotel_rooms_area_inner .wrap{
		/* display: grid; */
		/* grid-template-columns:  calc(82% - (clamp(2.581rem, 4.17vw, 5rem)) * 0.5)  calc(18% - (clamp(2.581rem, 4.17vw, 5rem) * 0.5)); */
		/* gap: clamp(2.581rem, 4.17vw, 5rem); */
		/* max-width: 108.125rem; */

		/* grid-template-columns: calc(100% - clamp(8.71rem, 14.06vw, 16.875rem) - clamp(2.581rem, 4.17vw, 5rem))  clamp(8.71rem, 14.06vw, 16.875rem); */
		/* align-items: stretch; */
	}

		.hotel_rooms_Large_area{
			/* width: 82%; */
		}
			.hotel_rooms_Large_area .swiper-slide {
				height: 100% !important;
				/* background-color: #fff; */
			}
		.hotel_rooms_Small_area{
			/* width: 18%; */
			position: relative;
		}



		.hotel_rooms_Small_area{
			/* width: 18%; */
		}






/* 在螢幕寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 990.1px){

    .swiper_rooms_Large {
      width: 100%;
      height: 100% !important;
    }
	.swiper_rooms_Small {
		height: inherit !important;
		max-width: inherit !important;
	}


.main .index_hotel_roomsBg .swiper-button-prev  ,
.main .index_hotel_roomsBg .swiper-button-next {
	left: unset;
	right: unset;
	top: unset;
	bottom: unset;
	transform: unset;
	position: relative;
}

.main .index_hotel_roomsBg .swiper-button-prev {
	background-image: url(../index/images/top_arrow2.svg);
	/* left: 5%; */
	margin: 0 auto clamp(0.645rem, 1.04vw, 1.25rem);
}

.main .index_hotel_roomsBg .swiper-button-next {
	background-image: url(../index/images/bottom_arrow2.svg);
	/* right: 5%; */
	margin: clamp(0.645rem, 1.04vw, 1.25rem) auto 0;
}



}




@media (max-width: 990px) {

	.hotel_rooms_area_inner .wrap {
		display: flex;
		grid-template-columns: unset;
		gap: 1.5625rem;
		flex-direction: column;
	}

	.main .index_hotel_roomsBg .swiper-button-prev  , 
	.main .index_hotel_roomsBg .swiper-button-next {
		margin: 0 !important;
	}

	.main .index_hotel_roomsBg .swiper-button-prev {
		top: 50%;
		right: unset;
		left: 0;
		transform: translateY(-50%);
	}

	.main .index_hotel_roomsBg .swiper-button-next {
		top: 50%;
		right: 0;
		left: unset;
		transform: translateY(-50%);
	}

}



























/* ====================================================================
   Section 4：飯店餐廳介紹 .index_hotel_diningBg
   ==================================================================== */

.index_hotel_diningBg {
	/* padding: clamp(2.097rem, 3.39vw, 4.063rem) 0; */
	/* background-color: #f7f7f5; */
	overflow: hidden;
}


	.index_hotel_dining_header {
		margin-bottom: clamp(0.839rem, 1.35vw, 1.625rem);
	}




	/* 輪播外層：position:relative 供 arrows 定位 */
	.index_hotel_dining_area_inner {
		position: relative;
		/* padding-bottom: clamp(2.5rem, 4.167vw, 5rem); */
	}


	.index_hotel_diningBg .hotel_dining_list{
		padding-top: 1rem;
		padding-bottom:1rem;
	}




/* arrows 定位：左右側邊（超出 wrap 內容區但在 section 內） */
.index_hotel_dining_area_inner .swiper-button-prev {
	position: absolute;
	left: clamp(0.25rem, 1.5vw, 1.5rem);
	top: 50%;
	transform: translateY(-50%);
}

.index_hotel_dining_area_inner .swiper-button-next {
	position: absolute;
	right: clamp(0.25rem, 1.5vw, 1.5rem);
	top: 50%;
	transform: translateY(-50%);
}

.index_hotel_dining_area_inner .swiper-button-prev{
	/* border: 1px solid rgba(255, 255, 255, .7); */
}
.index_hotel_dining_area_inner .swiper-button-next{
	
}

/* 
.index_hotel_dining_area_inner .swiper-button-prev:before  ,
.index_hotel_dining_area_inner .swiper-button-next:before {
	display: block;
	content: "";
    position: absolute;
    top: 0;
	left: 0;
    transform: translateY(0%);
    z-index: 6;
    width: 100%;
    height: auto;
	aspect-ratio: 1;
    border-radius: 50%;    
    background: rgba(30, 79, 126, .32);
    backdrop-filter: blur(2px);    
    display: flex;
    align-items: center;
    justify-content: center;    
    transition: var(--transition-data); 
}*/



/* 在螢幕寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 990.1px) {


	.index_hotel_dining_area_inner .wrap{
		position: relative;
	}

	/* arrows 定位：左右側邊（超出 wrap 內容區但在 section 內） */
	.main .index_hotel_dining_area_inner .swiper-button-prev {
		position: absolute;
		left:calc(clamp(1.936rem, 3.12vw, 3.75rem) * -0.5);
		top: 50%;
		transform: translateY(-50%);
	}

	.main .index_hotel_dining_area_inner .swiper-button-next {
		position: absolute;
		right:calc(clamp(1.936rem, 3.12vw, 3.75rem) * -0.5);
		top: 50%;
		transform: translateY(-50%);
	}

}




@media (max-width: 990px) {

	

}



@media (max-width: 760px) {
	.index_hotel_dining_area_inner .swiper-button-prev,
	.index_hotel_dining_area_inner .swiper-button-next { 
		/* display: none; */
		left: unset;
		right: unset;
	 }

	.index_hotel_dining_area_inner .swiper-button-prev {
		/* left: 0;  */
		left: calc(5dvw + (1.936rem / 2 * -1) + 0.3125rem);
		/* display: none; */
	}
	.index_hotel_dining_area_inner .swiper-button-next { 
		right: calc(5dvw + (1.936rem / 2 * -1) + 0.3125rem);
		/* display: none; */
	}


}

















/* ====================================================================
   Section 5：酒店設施介紹 .index_hotel_facilitiesBg
   ==================================================================== */

.index_hotel_facilitiesBg {
	padding: clamp(2.5rem, 4.167vw, 5rem) 0 0;
	/* background-color: #fff; */
	overflow: hidden;
}

/* 標題列：無 more-link，改靠左 */
.index_hotel_facilities_header {
	justify-content: flex-start;
	/* margin-bottom: clamp(0.75rem, 1.042vw, 1.25rem); */
}
	.index_hotel_facilities_header  .index_title_main2{
		/* white-space: nowrap; */
	}





/* 樓層指示條 */
.index_hotel_facilities_floor_bar {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: clamp(1rem, 1.563vw, 1.875rem);
}

.index_hotel_facilities_floor_dot {
	display: inline-block;
	width: 0.625rem;
	height: 0.625rem;
	border-radius: 50%;
	background-color: var(--third_color);
	flex-shrink: 0;
}

.index_hotel_facilities_floor_label {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--dark_color_sec);
	font-family: var(--foreign_font);
}

/* 設施輪播外層：全寬，position:relative 供 arrows 定位 */
.index_hotel_facilities_area_inner {
	position: relative;
	overflow: hidden;
	padding-bottom: clamp(2.5rem, 4.167vw, 5rem);
}

/* Swiper 本身 overflow:visible 以呈現側邊 peek 效果 */
.index_hotelFacilitiesSwiper {
	overflow: visible;
	padding-left: max(1rem, calc(50% - 570px));
	padding-right: max(1rem, calc(50% - 570px));
	box-sizing: border-box;
}

/* 設施輪播箭頭：左右側（同 dining 模式） */
.index_hotel_facilities_area_inner .swiper-button-prev {
	position: absolute;
	left: clamp(0.25rem, 1.5vw, 1.5rem);
	top: 40%;
	transform: translateY(-50%);
}

.index_hotel_facilities_area_inner .swiper-button-next {
	position: absolute;
	right: clamp(0.25rem, 1.5vw, 1.5rem);
	top: 40%;
	transform: translateY(-50%);
}





	.index_hotel_facilities_area{

	}
		.index_hotel_facilities_area .wrap{
			
		}








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




@media screen and (min-width: 768.1px) {


	.index_hotel_facilities_area{

	}
		.index_hotel_facilities_area .wrap{
			max-width: 100%;
			width: 100%;
		}


			.index_hotel_facilitiesBg .index_hotelFacilitiesSwiper {
				overflow: hidden;
			}
			
				.index_hotel_facilitiesBg .swiper-wrapper {
				}

					.index_hotel_facilitiesBg .swiper-slide {
						min-height: inherit !important;
						overflow: visible;
						display: flex;
						flex-direction: column;
						justify-content: center;
					}
						.index_hotel_facilitiesBg .hotel_facilities_in {
							transform-origin: center top;
							transition: transform .45s cubic-bezier(.22,.61,.36,1);
						}

							.index_hotel_facilitiesBg .swiper-slide:not(.swiper-slide-active){
								display: flex;
								flex-direction: column;
								justify-content: flex-end;

								justify-content: center;/*客戶需求*/
							} 


















	/* ================================================================== */
    /*沒有前後效果的樣式---------------*/
	/* ================================================================== */
    .index_hotel_facilitiesBg:not(.centerMode) .index_hotel_facilities_area .wrap{
        /* padding: clamp(0.5rem, 1.04vw, 1.25rem); */
    }
    .index_hotel_facilities_area:has(.count_1, .count_2, .count_3, .count_4, .count_5) .wrap{
        margin-left: auto;
        margin-right: auto;
    }    
    .index_hotel_facilities_area:has(.count_1) .wrap{
		max-width: calc(91.5625rem / 4  * 2);
    }
    .index_hotel_facilities_area:has(.count_2) .wrap{
		max-width: calc(91.5625rem / 1);
		width: 90%;
    }
    .index_hotel_facilities_area:has(.count_3) .wrap{
		max-width: calc(91.5625rem / 1);
		width: 90%;
    }
    .index_hotel_facilities_area:has(.count_4) .wrap{
		max-width: calc(100%  - 1.25rem);
		/* width: 90%; */
    }
    .index_hotel_facilities_area:has(.count_5) .wrap{
		max-width: calc(100%  - 1.25rem);
		/* width: 90%; */
    }









	



	/* ================================================================== */
    /*有前後效果的樣式---------------*/
	/* ================================================================== */

    /* centerMode 時讓 Swiper overflow 到 section 邊緣，active slide 前後的 peek 才可見 */
    .index_hotel_facilitiesBg.centerMode .index_hotel_facilities_area_inner {
        overflow: visible;
    }
		
		.index_hotel_facilitiesBg.centerMode .index_hotel_facilities_area {
		}




		/* 設施輪播箭頭：左右側  */
		.index_hotel_facilitiesBg.centerMode .index_hotel_facilities_area_inner .swiper-button-prev ,
		.index_hotel_facilitiesBg.centerMode .index_hotel_facilities_area_inner .swiper-button-next {
			position: absolute;
			left: unset;
			right:unset;
			top: 50%;
			transform: translateY(-50%);
		}
		.index_hotel_facilitiesBg.centerMode .index_hotel_facilities_area_inner .swiper-button-prev {
			left: calc((100dvw - (var(--index_facilities_slide) * var(--index_facilities_multiplier))) / 2 - (clamp(1.936rem, 3.12vw, 3.75rem) * 0.5) + clamp(0rem, calc(0.626rem - 0.521vw), 0.375rem) );
		}

		.index_hotel_facilitiesBg.centerMode .index_hotel_facilities_area_inner .swiper-button-next {
			right: calc((100dvw - (var(--index_facilities_slide) * var(--index_facilities_multiplier))) / 2 - (clamp(1.936rem, 3.12vw, 3.75rem) * 0.5) + clamp(0rem, calc(0.626rem - 0.521vw), 0.375rem) );
		}







		.index_hotel_facilitiesBg.centerMode .swiper-wrapper {
			height: auto !important;
			/* align-items: center; */
			transition-property: transform;
			transition-timing-function: cubic-bezier(.22,.61,.36,1);
			/* align-items: center; */
			align-items: flex-end;
			min-height: calc(var(--index_facilities_slide_act_min_h) + var(--index_facilities_gap) * 2) !important;
			transition-property: transform, height , min-height;

			align-items: center; /*客戶需求*/
		}




			.index_hotel_facilitiesBg.centerMode .swiper-slide {
				/* width:  calc(var(--index_facilities_slide) * 1.1) !important; */
				width: var(--index_facilities_slide)!important;
			}


		.index_hotel_facilitiesBg.centerMode .swiper-slide-prev {
			/* transform: translateX(calc(var(--index_facilities_slide) * -1))!important; */
			transform: translateX(var(--index_facilities_Offset)) !important;
		}

		.index_hotel_facilitiesBg.centerMode .swiper-slide-next {
			/* transform: translateX(calc(var(--index_facilities_slide) * 1))!important; */
			transform: translateX(calc(var(--index_facilities_Offset) * -1)) !important;
		}
		
		.index_hotel_facilitiesBg.centerMode .swiper-slide-active{
		
		} 
		
		.index_hotel_facilitiesBg.centerMode .swiper-slide:has(+ .swiper-slide-prev){
			/* transform: translateX(calc(var(--index_facilities_slide) * -1))!important; */
			transform: translateX(var(--index_facilities_Offset)) !important;
		}
		.index_hotel_facilitiesBg.centerMode .swiper-slide-next + .swiper-slide{
			/* transform: translateX(calc(var(--index_facilities_slide) * 1))!important; */
			transform: translateX(calc(var(--index_facilities_Offset) * -1)) !important;
		}

		




			.index_hotel_facilitiesBg.centerMode .swiper-slide .hotel_facilities_list {
				padding: 0 var(--index_facilities_gap);
			}


			.index_hotel_facilitiesBg.centerMode .hotel_facilities_card {
				transition: transform 0.45s cubic-bezier(.22,.61,.36,1);
				transform-origin: center center;
			}

			.index_hotel_facilitiesBg.centerMode .swiper-slide:not(.swiper-slide-active) .hotel_facilities_card{
			}

				.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_card {
					transform: scale(var(--index_facilities_multiplier));
					/* opacity: 0.5; */
					/* transform-origin: center calc(50% + clamp(-1.563rem, calc(2.173vw - 2.608rem), 0rem)); */
					transform-origin: center calc(50% + clamp(-1.563rem, -2.481rem + 1.91vw, -0.188rem));
				}

					.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_in {
						row-gap: calc(clamp(1.29rem, 2.08vw, 2.5rem) / var(--index_facilities_multiplier));
					}

					.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_list .floor {
						font-size: calc(clamp(2rem, 1.2rem + 1.29vw, 2.75rem) / var(--index_facilities_multiplier));
						gap: calc(clamp(0.323rem, 0.52vw, 0.625rem) / var(--index_facilities_multiplier));
					}
						/* .index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_list .floor i {
							font-size: calc(clamp(1.364rem, 0.818rem + 0.88vw, 1.875rem) / var(--index_facilities_multiplier));
						} */
						.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_list .floor .floor_dot {
							width: calc(clamp(0.5rem, 1.04vw, 1.25rem) / var(--index_facilities_multiplier));			
						}

					.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_content {
						gap: calc(calc(clamp(0.875rem, 1.25vw, 1.5rem) * 0.6) / var(--index_facilities_multiplier));
					}

					.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_name {
						font-size: calc(clamp(2rem, 1.2rem + 1.29vw, 2.75rem) / var(--index_facilities_multiplier));
					}

					.index_hotel_facilitiesBg.centerMode .swiper-slide-active .hotel_facilities_desc {
						font-size: calc(clamp(0.938rem, 0.871rem + 0.11vw, 1rem) / var(--index_facilities_multiplier));
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 1;
						overflow: hidden;
					}





}







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



/* ============================================
   Section 5：酒店設施介紹 (沒有前後視覺差)
   ============================================ */



/* 在螢幕寬度大於990時，套用這裡的特定樣式 */
/* @media screen and (min-width: 990.1px) {

	.index_hotel_facilities_area .wrap{
	}
	.index_hotel_facilities_header  .index_title_main2{
		white-space: nowrap;
	}

	.index_hotel_facilities_header  .index_title_main2{
		white-space: nowrap;
	}

	.index_hotel_facilitiesBg{

	}

	.index_hotel_facilities_area .wrap:has(.count_gt){	
		max-width: 99.9%;
		width: 100%;
	}
		.index_hotel_facilities_area .wrap:has(.count_gt) .swiper-button-prev{	
			width: clamp(1.29rem, 2.08vw, 2.5rem);
			left: calc((100dvw / 3) - clamp(1.29rem, 2.08vw, 2.5rem) - clamp(0.692rem, 2.6vw, 3.125rem) - 5px);
		}
		.index_hotel_facilities_area .wrap:has(.count_gt) .swiper-button-next {
			width: clamp(1.29rem, 2.08vw, 2.5rem);
			right: calc((100dvw / 3) - clamp(1.29rem, 2.08vw, 2.5rem) - clamp(0.692rem, 2.6vw, 3.125rem) - 5px);
		}


}

@media screen and (min-width: 1280.1px) {

	.index_hotel_facilities_area .wrap:has(.count_1){	
		width: calc(90% / 2);	
	}
	
	.index_hotel_facilities_area:has(:is(.count_1, .count_2)) .swiper-button-prev,
	.index_hotel_facilities_area:has(:is(.count_1, .count_2)) .swiper-button-next {
		display: none;
	}
} */

/* 在螢幕寬度990 ~ 1280，套用這裡的特定樣式 */
/* @media screen and (min-width: 990.1px) and (max-width: 1280px) {

	.index_hotel_facilities_area .wrap:has(.count_1){	
		width: calc(90% / 2);	
	}

	.index_hotel_facilities_area .wrap:has(.count_2){	
	}

	.index_hotel_facilities_area .wrap:has(.count_3){	
	}
	

	.index_hotel_facilities_area:has(:is(.count_1, .count_2)) .swiper-button-prev,
	.index_hotel_facilities_area:has(:is(.count_1, .count_2)) .swiper-button-next {
		display: none;
	}


} */

/* 在螢幕寬度大於426，套用這裡的特定樣式 */
/* @media screen and (min-width: 426.1px) and (max-width: 990px) {

	.index_hotel_facilities_area .wrap:has(.count_1 , .count_2, .count_3){	
	}

	.index_hotel_facilities_area .wrap:has(.count_gt){	
		max-width: 99.9%;
		width: 100%;
	}

	.index_hotel_facilities_area:has(:is(.count_1)) .swiper-button-prev,
	.index_hotel_facilities_area:has(:is(.count_1)) .swiper-button-next {
		display: none;
	}

} */






@media (max-width: 990px) {
	.index_hotelFacilitiesSwiper {
		/* padding-left: 1.25rem; */
		/* padding-right: 1.25rem; */
	}

	
	.index_hotel_facilities_area .wrap:has(.count_gt){	
		/* width:90%; */
	}
}




@media (max-width: 768px) {

.index_hotel_facilities_area_inner {
    /* position: relative; */
    overflow: unset;
}

	.main .index_hotel_facilities_area_inner .swiper-button-prev,
	.main .index_hotel_facilities_area_inner .swiper-button-next {
		/* display: none; */
		right: unset;
		left: unset;
	}
	.main .index_hotel_facilities_area_inner .swiper-button-prev {	
		left: 0;	
		left: calc(1.936rem / 2 * -1 + .3125rem);
	}
	.main .index_hotel_facilities_area_inner .swiper-button-next { 
		right: 0;
		right: calc(1.936rem / 2 * -1 + .3125rem);
	}

	.index_hotelFacilitiesSwiper {
		padding-left: 1rem;
		padding-right: 1rem;
	}




}