/* 滿版圖片樣式 */
.full-width-image-wrapper {
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	display: block;
}

.full-width-image {
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
	padding: 0;
	object-fit: cover;
}

/* 上方漂浮圖樣式 */
.youth-image-top {
	position: absolute;
	top: -49px;
	left: 41px;
	width: 93px;
	z-index: 5;
}

/* 運動幣專區主視覺 */
.coins-hero-card {
	--coins-green: #39b54a;
	--coins-green-dark: #2f9b3c;
	--coins-blue: #2a3a9e;
	--coins-orange: #f05a28;
	--coins-border: #e0e4ea;
	/* 卡片整體（圖二那種大白卡） */
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
	overflow: hidden;
	position: relative;
	z-index: 0;
}

.coins-hero-icon {
	position: absolute;
	top: -32px;
	left: 24px;
	width: 64px;
	height: 88px;
	background: #fef4d7;
	border: 4px solid #5c6d89;
	border-radius: 12px;
	transform: rotate(-8deg);
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.16);
	z-index: 2;
}

.coins-hero-icon::before {
	content: "";
	position: absolute;
	top: 8px;
	left: 50%;
	width: 26px;
	height: 6px;
	background: #5c6d89;
	border-radius: 8px;
	transform: translateX(-50%);
}

.coins-hero-icon::after {
	content: "";
	position: absolute;
	bottom: 10px;
	left: 10px;
	right: 10px;
	height: 26px;
	border-radius: 6px;
	background: linear-gradient(135deg, #f8c66d, #f47d43);
}

/* 綠色標題列 */
.sports-coins-header {
	background: #33b14a;
	padding: 22px 16px;
	margin: 0 !important;
	margin-bottom: 0 !important;
	width: 100%;
	text-align: center;
	border-radius: 0;
	box-shadow: none;
	position: relative;
	z-index: 1;
}

.sports-coins-title {
	color: #fff;
	font-weight: 800;
	letter-spacing: 0.2em;
	margin: 0;
	padding: 0;
	font-size: 2.75rem;
	line-height: 1;
	text-align: center;
}

.youth-header.sports-coins-header {
	position: relative !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	margin-bottom: 0 !important;
}

.youth-container.coins-hero-body {
	padding-top: 0 !important;
	margin-top: 0 !important;
	background: #ffffff !important;
	border-radius: 0 0 8px 8px !important;
	box-shadow: none !important;
}

/* 主體左右 padding */
.coins-hero-body {
	position: relative;
	z-index: 1;
	align-items: center;
	margin-top: 0 !important;
	padding-top: 0 !important;
	padding: 34px 34px 30px !important;
	min-height: auto;
}

.coins-hero-left {
	padding: 0 !important;
	text-align: left;
	padding-top: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	width: 100%;
}

/* 左區塊標題：抽籤登記 */
.coins-hero-heading {
	font-size: 2.5rem;
	font-weight: 900;
	margin: 0 0 18px 0;
	line-height: 1.1;
	color: #1f1f1f;
	letter-spacing: 0;
	text-align: left;
	width: 100%;
}

/* 每一列：label｜內容 */
.coins-hero-info {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
}

.coins-hero-row {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
}

/* label（藍字）固定寬度，才會整齊對齊 */
.coins-hero-label {
	color: #1f4e9e;
	font-weight: 800;
	font-size: 1.125rem;
	width: 92px;
	flex: 0 0 92px;
	text-align: left;
	position: relative;
	padding-right: 14px;
	white-space: nowrap;
}

/* 畫出分隔線（像圖二的｜） */
.coins-hero-label::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 18px;
	background: #cfd7e6;
}

/* 內容文字 */
.coins-hero-text {
	font-size: 1.125rem;
	line-height: 1.7;
	color: #222;
	flex: 1;
	min-width: 0;
	text-align: left;
}

/* 強調橘字 */
.coins-hero-highlight {
	color: #ff5a2a;
}

.coins-hero-row .coins-hero-highlight {
	color: #ff5a2a;
}

/* 按鈕區位置 */
.coins-hero-actions {
	margin-top: 22px;
	text-align: center;
	width: 100%;
}

.coins-hero-btn.new-btn {
	background: #ffffff !important;
	border: 2px solid #006B2A !important;
	color: #006B2A !important;
	border-radius: 999px !important;
	padding: 12px 22px !important;
	display: inline-flex !important;
	align-items: center !important;
	font-weight: 700 !important;
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12) !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s
		ease, color 0.2s ease !important;
}

.coins-hero-btn.new-btn:hover {
	transform: translateY(-1px) !important;
	box-shadow: 0 10px 18px rgba(0, 0, 0, 0.16) !important;
	background: #006B2A !important;
	border-color: #006B2A !important;
	color: #ffffff !important;
}

.coins-hero-btn.new-btn:hover .new-btn-icon {
	background: #004D1F !important;
	content: none !important;
	background-image: none !important;
}

.coins-hero-btn.new-btn .new-btn-icon {
	margin-left: 14px !important;
	width: 34px !important;
	height: 34px !important;
	border-radius: 50% !important;
	background: #006B2A !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	content: none !important;
	background-image: none !important;
	position: relative !important;
}

.coins-hero-btn.new-btn .new-btn-icon::before {
	content: "" !important;
	width: 6px !important;
	height: 6px !important;
	border: solid #ffffff !important;
	border-width: 0 2px 2px 0 !important;
	transform: rotate(-45deg) !important;
	display: inline-block !important;
	margin-left: 2px !important;
	position: absolute !important;
}

.coins-hero-notice {
	color: #cc2c2c;
	text-align: center !important;
	margin-top: 18px;
	line-height: 1.6;
}

/* 禁用按鈕樣式 - 完全灰色且無法點擊 */
.coins-hero-btn-disabled, .coins-hero-btn-disabled.new-btn,
	.coins-hero-actions .coins-hero-btn-disabled {
	background: #e0e0e0 !important;
	border: 2px solid #b0b0b0 !important;
	border-color: #b0b0b0 !important;
	color: #888888 !important;
	border-radius: 999px !important;
	padding: 12px 22px !important;
	display: inline-flex !important;
	align-items: center !important;
	font-weight: 700 !important;
	box-shadow: none !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
	opacity: 0.7 !important;
	transition: none !important;
}

/* 禁用按鈕 hover 狀態 - 保持灰色 */
.coins-hero-btn-disabled:hover, .coins-hero-btn-disabled.new-btn:hover,
	.coins-hero-actions .coins-hero-btn-disabled:hover {
	background: #e0e0e0 !important;
	border-color: #b0b0b0 !important;
	color: #888888 !important;
	transform: none !important;
	box-shadow: none !important;
}

/* 禁用按鈕內的圖標 - 完全灰色 */
.coins-hero-btn-disabled .new-btn-icon, .coins-hero-btn-disabled.new-btn .new-btn-icon,
	.coins-hero-actions .coins-hero-btn-disabled .new-btn-icon {
	background: #b0b0b0 !important;
	background-color: #b0b0b0 !important;
	margin-left: 14px !important;
	width: 34px !important;
	height: 34px !important;
	border-radius: 50% !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
}

/* 禁用按鈕圖標 hover 狀態 - 保持灰色 */
.coins-hero-btn-disabled:hover .new-btn-icon, .coins-hero-btn-disabled.new-btn:hover .new-btn-icon,
	.coins-hero-actions .coins-hero-btn-disabled:hover .new-btn-icon {
	background: #b0b0b0 !important;
	background-color: #b0b0b0 !important;
}

/* 禁用按鈕圖標內的箭頭 - 灰色 */
.coins-hero-btn-disabled .new-btn-icon::before, .coins-hero-btn-disabled.new-btn .new-btn-icon::before,
	.coins-hero-actions .coins-hero-btn-disabled .new-btn-icon::before {
	content: "" !important;
	width: 6px !important;
	height: 6px !important;
	border: solid #888888 !important;
	border-color: #888888 !important;
	border-width: 0 2px 2px 0 !important;
	transform: rotate(-45deg) !important;
	display: inline-block !important;
	margin-left: 2px !important;
	position: absolute !important;
}

/* 灰色小字樣式 - 置中對齊 */
.coins-hero-disabled-text {
	color: #F75000;
	font-size: 0.875rem;
	text-align: center !important;
	margin: 12px auto 0 auto !important;
	line-height: 1.5;
	width: 100%;
	display: block;
	align-self: center !important;
}

/* 右區塊置中 + 讓吉祥物位置穩 */
.coins-hero-right {
	border-left: 2px solid var(--coins-border);
	padding-left: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 1;
}

.coins-hero-mascot-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

.coins-hero-mascot-link {
	display: block;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	border-radius: 18px;
}

.coins-hero-mascot-link:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
}

.coins-hero-mascot-link:focus {
	outline: 4px solid #005fcc;
	outline-offset: 3px;
	border-radius: 18px;
}

.coins-hero-mascot {
	max-width: 260px;
	height: auto;
	display: block;
	border-radius: 18px;
	object-fit: contain;
}

/* 右側那個膠囊文字（圖二綠框） */
.coins-hero-pill {
	display: block !important;
	border: 2px solid #33b14a;
	color: #33b14a;
	border-radius: 999px;
	padding: 10px 20px;
	font-weight: 900;
	font-size: 1.375rem;
	background: #ffffff;
}

/* RWD：小螢幕字體縮小，避免爆版 */
@media screen and (max-width: 991.98px) {
	.sports-coins-title {
		font-size: 2.125rem;
	}
	.coins-hero-body {
		padding: 22px 18px 18px !important;
	}
	.coins-hero-heading {
		font-size: 2rem;
	}
	.coins-hero-label {
		width: 80px;
		flex: 0 0 80px;
		font-size: 1rem;
	}
	.coins-hero-text {
		font-size: 1rem;
	}
	.coins-hero-mascot {
		max-width: 210px;
	}
	.coins-hero-pill {
		font-size: 1.125rem;
	}
	.coins-hero-right {
		border-left: none;
		border-top: 2px solid var(--coins-border);
		padding-left: 0;
		padding-top: 24px;
		margin-top: 24px;
	}
}

@media screen and (max-width: 575px) {
	.coins-hero-icon {
		display: none;
	}
	.coins-hero-body {
		padding: 32px 20px 24px 20px !important;
		min-height: auto;
	}
	.coins-hero-left {
		padding: 0 12px !important;
	}
	.sports-coins-title {
		font-size: 1.6rem;
	}
	.coins-hero-heading {
		font-size: 1.6rem;
		margin-bottom: 20px;
	}
	.coins-hero-row {
		font-size: 0.95rem;
		gap: 6px;
		flex-wrap: wrap;
		justify-content: center !important;
	}
	.coins-hero-info {
		gap: 18px;
	}
	.coins-hero-label {
		min-width: 80px;
		font-size: 0.95rem;
		text-align: right !important;
		margin-right: 8px;
		padding-right: 8px;
	}
	.coins-hero-text {
		text-align: left !important;
		width: 100%;
	}
	.coins-hero-row {
		justify-content: center !important;
		flex-wrap: wrap;
	}
	.coins-hero-actions {
		margin-top: 24px;
	}
	.coins-hero-btn {
		width: 100%;
		justify-content: center;
	}
	.coins-hero-disabled-text {
		text-align: center !important;
		margin: 12px auto 0 auto !important;
		width: 100%;
		align-self: center !important;
	}
	.coins-hero-mascot {
		width: 200px;
		height: 240px;
	}
}

@media screen and (min-width: 749px) {
	.mobile-carousel {
		display: none;
	}
	.desktop-carousel {
		display: block;
	}
	.mobile-block-carousel {
		display: none;
	}
	.desktop-block-carousel {
		display: block;
	}
}

@media screen and (max-width: 748px) {
	.desktop-carousel {
		display: none;
	}
	.mobile-carousel {
		display: block;
	}
	.desktop-block-carousel {
		display: none;
	}
	.mobile-block-carousel {
		display: block;
	}
}

/* 固定尺寸輪播板塊樣式 */
.full-width-carousel-wrapper {
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #f5f5f5; /* 添加背景色 */
}

.fixed-carousel-block {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	width: 100%;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* 添加陰影效果 */
}

/* 輪播控制按鈕樣式 - 疊在輪播圖片上 */
/* 移除底部控制面板樣式 */
.carousel-control-panel-bottom {
	display: none; /* 隱藏底部控制面板 */
}

/* 輪播容器內的按鈕容器 - 疊在圖片上 */
.desktop-block-carousel .carousel-control-buttons,
	.mobile-block-carousel .carousel-control-buttons {
	position: absolute;
	bottom: 20px;
	left: 20px; /* 改為左側 */
	z-index: 200; /* 確保按鈕在圖片和指示器上方 */
	display: flex;
	gap: 10px;
	background-color: rgba(0, 0, 0, 0.6);
	padding: 8px 12px;
	border-radius: 6px;
}

.carousel-control-btn {
	background-color: #fff;
	border: 2px solid #8A4B00;
	color: #8A4B00;
	padding: 10px 15px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 1rem;
	min-width: 45px;
	height: 45px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.carousel-control-btn:hover {
	background-color: #8A4B00;
	color: #fff;
	border-color: #8A4B00;
	transform: scale(1.05);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.carousel-control-btn:focus {
	outline: 3px solid #005fcc;
	outline-offset: 2px;
	background-color: #8A4B00;
	color: #fff;
}

.carousel-control-btn:active {
	transform: scale(0.95);
}

.carousel-control-btn i {
	font-size: 1.125rem;
}

.sports-coins-carousel-controls {
	position: absolute;
	bottom: 20px;
	left: 20px;
	z-index: 200;
	display: flex;
	gap: 10px;
	background-color: rgba(0, 0, 0, 0.6);
	padding: 8px 12px;
	border-radius: 6px;
}

.carousel-control-btn .sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

/* 確保輪播容器有相對定位 */
.desktop-block-carousel, .mobile-block-carousel {
	position: relative;
}

/* 桌面版控制按鈕顯示 */
@media screen and (min-width: 749px) {
	.desktop-carousel-controls {
		display: flex;
	}
	.mobile-carousel-controls {
		display: none;
	}
}

/* 手機版控制按鈕顯示 */
@media screen and (max-width: 748px) {
	.desktop-carousel-controls {
		display: none;
	}
	.mobile-carousel-controls {
		display: flex;
	}
	/* 手機版按鈕位置調整 */
	.mobile-block-carousel .carousel-control-buttons {
		bottom: 15px;
		left: 15px; /* 改為左側 */
		padding: 6px 10px;
	}
	.carousel-control-btn {
		padding: 8px 12px;
		min-width: 40px;
		height: 40px;
		font-size: 0.875rem;
	}
	.carousel-control-btn i {
		font-size: 1rem;
	}
}

/* 桌面版固定尺寸 - 完全獨立樣式 */
@media screen and (min-width: 749px) {
	.fixed-carousel-block {
		width: 100%;
		height: auto; /* 改為自適應高度 */
		max-width: 100%;
	}

	/* 桌面版輪播容器 */
	.desktop-block-carousel {
		width: 100%;
		height: auto;
		overflow: hidden;
		position: relative;
	}

	/* 桌面版輪播內層容器 */
	.desktop-block-carousel .carousel-inner {
		position: relative;
		width: 100%;
		overflow: hidden;
	}

	/* 桌面版輪播項目 */
	.desktop-block-carousel .carousel-item {
		position: relative;
		width: 100%;
		height: auto;
		text-align: center;
		display: block; /* 保持 block，使用 visibility 和 opacity 控制 */
		visibility: hidden; /* 預設隱藏 */
		opacity: 0;
		transition: opacity 0.6s ease-in-out, visibility 0.6s ease-in-out;
	}

	/* 桌面版輪播項目 - 活動狀態 */
	.desktop-block-carousel .carousel-item.active {
		visibility: visible; /* 活動項目顯示 */
		opacity: 1;
	}

	/* 桌面版輪播圖片 */
	.desktop-block-carousel .carousel-item img {
		max-height: 600px; /* 設置最大高度，確保圖片不會過大 */
		width: auto;
		max-width: 100%;
		object-fit: contain; /* 確保圖片完整顯示 */
		margin: 0 auto; /* 居中顯示 */
		display: inline-block;
	}

	/* 桌面版輪播指示器 */
	.desktop-block-carousel .carousel-indicators {
		bottom: 10px;
		margin-bottom: 0;
		z-index: 10; /* 確保指示器在圖片上方，但低於按鈕 */
	}
	.desktop-block-carousel .carousel-indicators li {
		width: 12px;
		height: 12px;
		border-radius: 50%;
		margin: 0 5px;
		background-color: rgba(255, 255, 255, 0.5);
	}
	.desktop-block-carousel .carousel-indicators .active {
		background-color: #fff;
	}
}

/* 手機版固定尺寸 - 完全獨立樣式 */
@media screen and (max-width: 748px) {
	/* 手機版輪播容器包裝 */
	.full-width-carousel-wrapper {
		width: 100%;
		max-width: 100%;
		margin: 0;
		padding: 0;
		overflow: hidden;
		background-color: #f5f5f5;
	}

	/* 手機版固定容器 */
	.fixed-carousel-block {
		width: 100%;
		max-width: 100%;
		margin: 0;
		padding: 0;
		overflow: hidden;
		text-align: center;
	}

	/* 手機版輪播容器 */
	.mobile-block-carousel {
		width: 100%;
		height: auto;
		overflow: hidden;
		margin: 0;
		padding: 0;
		position: relative;
	}

	/* 手機版輪播內層容器 */
	.mobile-block-carousel .carousel-inner {
		position: relative;
		width: 100%;
		height: 0;
		padding-bottom: 75%; /* 設置固定高度比例 */
		overflow: hidden;
	}

	/* 手機版輪播項目 - 固定比例容器 */
	.mobile-block-carousel .carousel-item {
		position: absolute; /* 絕對定位，所有項目疊在同一位置 */
		top: 0;
		left: 0;
		width: 100%;
		height: 100%; /* 填滿父容器 */
		overflow: hidden;
		background-color: #f5f5f5;
		margin: 0;
		visibility: hidden; /* 預設隱藏 */
		opacity: 0;
		transition: opacity 0.6s ease-in-out, visibility 0.6s ease-in-out;
		z-index: 1; /* 預設在底層 */
	}

	/* 手機版輪播項目 - 活動狀態 */
	.mobile-block-carousel .carousel-item.active {
		visibility: visible; /* 活動項目顯示 */
		opacity: 1;
		z-index: 2; /* 活動項目在上層 */
	}

	/* 手機版輪播圖片 */
	.mobile-block-carousel .carousel-item img {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		max-width: 100%;
		max-height: 100%;
		width: auto;
		height: auto;
		object-fit: cover; /* 改為cover以減少白邊 */
	}

	/* 手機版輪播指示器 */
	.mobile-block-carousel .carousel-indicators {
		bottom: 15px;
		margin-bottom: 0;
		z-index: 10; /* 確保指示器在圖片上方，但低於按鈕 */
	}
	.mobile-block-carousel .carousel-indicators li {
		width: 12px;
		height: 12px;
		border-radius: 50%;
		margin: 0 5px;
		background-color: rgba(255, 255, 255, 0.7);
		border: 1px solid rgba(0, 0, 0, 0.2);
	}
	.mobile-block-carousel .carousel-indicators .active {
		background-color: #fff;
		border: 1px solid rgba(0, 0, 0, 0.3);
	}

	/* 手機版行政公告標題位置調整 - 避免被上方擋住，並縮小黃色背景區域 */
	.wave-section {
		padding-top: 80px; /* 增加上方內距，為行政公告標題預留空間 */
		padding-bottom: 30px !important; /* 減少下方內距，縮小黃色背景區域 */
		padding-left: 15px; /* 左右內距 */
		padding-right: 15px;
		min-height: auto !important; /* 允許自動調整高度 */
		overflow: visible !important; /* 確保背景可以完全顯示 */
		clip-path: none !important; /* 手機版移除 clip-path，讓背景完全顯示 */
		-webkit-clip-path: none !important; /* WebKit 瀏覽器也移除 */
	}
	.announcement-container {
		margin-top: 5px; /* 最小上方外距 */
		margin-bottom: 5px; /* 最小下方外距 */
		max-width: 100%; /* 手機版讓容器更寬 */
		width: 100%; /* 填滿可用空間 */
		padding: 5px; /* 最小內距 */
	}
	.announcement-title {
		margin-top: 20px; /* 增加標題上方外距，確保不被擋住 */
		padding-top: 10px; /* 增加標題上方內距 */
	}

	/* 手機版行政公告表格調整 - 改成卡片式布局 */
	.announcement-list .card-body {
		padding: 15px !important; /* 減少內距 */
		border: none !important; /* 移除 card-body 的邊框 */
	}
	#announcementTable {
		border-collapse: separate;
		border-spacing: 0;
	}

	/* 限制 aFirst 只顯示最新的 5 筆 */
	#announcementTable tbody tr.aFirst:nth-child(n+6) {
		display: none !important;
	}

	/* 將表格行改成圖2樣式：第一行標籤+標題，第二行日期（整列） */
	#announcementTable tbody tr {
		display: grid; /* 使用 grid 布局 */
		grid-template-columns: auto 1fr; /* 第一行：左側標籤固定寬度，右側標題自動填滿 */
		grid-template-rows: 1fr auto; /* 第一行：標籤+標題（自動填滿），第二行：日期（整列） */
		align-items: start; /* 頂部對齊 */
		border: 1px solid #e0e0e0; /* 恢復邊框 */
		border-radius: 8px; /* 恢復圓角 */
		margin-bottom: 12px; /* 卡片間距 */
		padding: 12px; /* 卡片內距 */
		background-color: #fff;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); /* 恢復陰影 */
		gap: 8px; /* 元素間距 */
		min-height: 100px; /* 固定最小高度，確保所有卡片高度一致，足夠容納完整文字 */
		height: auto; /* 允許根據內容自動增加高度，優先顯示全部文字 */
	}

	/* 第一個 td（類型標籤）- 左側，跨上下兩列，垂直文字 */
	#announcementTable tbody tr td:first-child {
		display: flex; /* 使用 flex 以便置中文字 */
		align-items: center; /* 垂直置中 */
		justify-content: center; /* 水平置中 */
		background-color: #8A4B00; /* 高對比深橘棕，白字對比約 6.8:1 */
		color: #fff;
		padding: 8px 12px;
		border-radius: 4px;
		font-size: 0.875rem;
		font-weight: bold;
		width: 60px; /* 固定寬度 */
		min-width: 60px; /* 最小寬度 */
		height: auto; /* 高度自適應 */
		text-align: center;
		writing-mode: vertical-rl; /* 垂直文字（從上到下） */
		text-orientation: mixed;
		grid-column: 1; /* 第一欄 */
		grid-row: 1/3; /* 跨兩行（標題和日期） */
		align-self: stretch; /* 填滿高度 */
		flex-shrink: 0; /* 不允許縮小 */
	}

	/* 第二個 td（標題）- 第一行右側 */
	#announcementTable tbody tr td:nth-child(2) {
		grid-column: 2; /* 第二欄 */
		grid-row: 1; /* 第一行 */
		display: block;
		border: 1px solid #e0e0e0; /* 手機版標題邊框 */
		border-radius: 6px;
		padding: 8px; /* 內距，避免文字貼邊 */
		width: 100%;
		min-width: 0; /* 允許收縮，避免擠壓 */
		align-self: stretch; /* 填滿第一行的可用空間 */
	}

	/* 第三個 td（日期）- 第二行，整列顯示 */
	#announcementTable tbody tr td:last-child {
		grid-column: 1/3; /* 跨全部兩欄（整列） */
		grid-row: 2; /* 第二行 */
		display: block;
		text-align: right;
		color: #666;
		font-size: 0.75rem;
		padding: 0;
		padding-top: 8px; /* 與上方內容的間距 */
		margin: 0;
		border: none !important; /* 不要日期框框 */
		width: 100%;
		background-color: transparent; /* 移除背景框感 */
		white-space: nowrap; /* 日期不換行 */
	}

	/* 標題連結和文字樣式 */
	#announcementTable tbody tr td:nth-child(2) a {
		display: block;
		color: #000000 !important;
		text-decoration: none;
		width: 100%;
		line-height: 1.6;
		font-size: 0.875rem;
		text-align: left;
	}
	#announcementTable tbody tr td:nth-child(2) a:hover {
		color: #000000 !important;
		text-decoration: underline;
	}

	/* popbox 文字樣式 - 手機版固定兩行、總計 24 字顯示上限 */
	#announcementTable tbody tr td:nth-child(2) .popbox {
		display: -webkit-box; /* 多行省略 */
		-webkit-box-orient: vertical;
		box-orient: vertical;
		-webkit-line-clamp: 2; /* 最多兩行 */
		line-clamp: 2;
		line-height: 1.6;
		min-height: calc(1.6em * 2); /* 高度固定為兩行 */
		max-height: calc(1.6em * 2);
		white-space: normal; /* 允許換行 */
		word-wrap: break-word;
		word-break: break-word;
		overflow-wrap: break-word;
		overflow: hidden; /* 超出隱藏 */
		text-overflow: ellipsis; /* 第二行尾端省略 */
	}
}

/* 移除舊樣式，避免衝突 */
.carousel-indicators {
	bottom: 0;
	margin-bottom: 1rem;
}

.carousel-indicators li {
	background-color: rgba(255, 255, 255, 0.5);
}

.carousel-indicators .active {
	background-color: #fff;
}

/* 主要內容區域焦點樣式 - 導航列 */
#coupon:focus {
	outline: 4px solid #005fcc;
	outline-offset: 3px;
	box-shadow: 0 0 0 4px rgba(0, 95, 204, 0.3), 0 0 8px 4px
		rgba(0, 95, 204, 0.5);
	background-color: rgba(0, 95, 204, 0.05); /* 輕微背景色變化 */
}

/* 合作店家專區按鈕樣式 - 強制覆蓋 */
.vendor-wrapper .new-btn, .vendor-step .new-btn {
	background: #ffffff !important;
	border: 2px solid #F5AD15 !important;
	border-radius: 30px !important;
	color: #F5AD15 !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	padding: 12px 24px !important;
	transition: all 0.3s ease !important;
}

.vendor-wrapper .new-btn:hover, .vendor-step .new-btn:hover {
	background: #F5AD15 !important;
	color: #ffffff !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(245, 173, 21, 0.2) !important;
}

.vendor-wrapper .new-btn:active, .vendor-step .new-btn:active {
	background: #F5AD15 !important;
	color: #ffffff !important;
	transform: translateY(0) !important;
	box-shadow: 0 2px 6px rgba(245, 173, 21, 0.2) !important;
}

/* 合作店家專區標題樣式 */
.vendor-header {
	background-color: #F5AD15 !important;
}

/* 合作店家專區容器樣式 - 增強邊框和陰影 */
.vendor-container {
	border: 2px solid #e0e0e0 !important;
	border-radius: 10px !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25), 0 4px 12px
		rgba(0, 0, 0, 0.15) !important;
	background: white !important;
	transition: box-shadow 0.3s ease !important;
}

.vendor-container:hover {
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3), 0 6px 16px
		rgba(0, 0, 0, 0.2) !important;
}

/* 合作店家專區區塊樣式 - 增強分隔線 */
.vendor-step {
	border-right: 2px solid #d0d0d0 !important;
	padding: 40px 20px !important;
}

.vendor-step:last-child {
	border-right: none !important;
}

/* 響應式設計 - 手機版移除右側邊框 */
@media ( max-width : 767px) {
	.vendor-step {
		border-right: none !important;
		border-bottom: 2px solid #d0d0d0 !important;
		padding-bottom: 30px !important;
		margin-bottom: 30px !important;
	}
	.vendor-step:last-child {
		border-bottom: none !important;
		margin-bottom: 0 !important;
	}
}

/* 合作店家專區按鈕圖標樣式 - 圓形背景 + 箭頭 */
.vendor-wrapper .new-btn .new-btn-icon, .vendor-step .new-btn .new-btn-icon
	{
	width: 24px !important;
	height: 24px !important;
	margin-left: 8px !important;
	border-radius: 50% !important;
	background: #F5AD15 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
	background-image: none !important;
	content: none !important;
	transition: all 0.3s ease !important;
}

/* 箭頭樣式 - 使用偽元素 */
.vendor-wrapper .new-btn .new-btn-icon::before, .vendor-step .new-btn .new-btn-icon::before
	{
	content: "" !important;
	width: 6px !important;
	height: 6px !important;
	border: solid #ffffff !important;
	border-width: 0 2px 2px 0 !important;
	transform: rotate(-45deg) !important;
	display: inline-block !important;
	margin-left: 2px !important;
}

/* 懸停時圖標背景變白色，箭頭變黃色 */
.vendor-wrapper .new-btn:hover .new-btn-icon, .vendor-step .new-btn:hover .new-btn-icon
	{
	background: #ffffff !important;
}

.vendor-wrapper .new-btn:hover .new-btn-icon::before, .vendor-step .new-btn:hover .new-btn-icon::before
	{
	border-color: #F5AD15 !important;
}

/* 按下時保持白色背景 */
.vendor-wrapper .new-btn:active .new-btn-icon, .vendor-step .new-btn:active .new-btn-icon
	{
	background: #ffffff !important;
}

.vendor-wrapper .new-btn:active .new-btn-icon::before, .vendor-step .new-btn:active .new-btn-icon::before
	{
	border-color: #F5AD15 !important;
}

/* 合作店家專區禁用按鈕樣式 - 灰色且無法點擊 */
.vendor-btn-disabled, .call-to-action-btn .vendor-btn-disabled,
	.vendor-wrapper .vendor-btn-disabled, .vendor-step .vendor-btn-disabled
	{
	background: #e0e0e0 !important;
	border: 2px solid #b0b0b0 !important;
	border-color: #b0b0b0 !important;
	border-radius: 30px !important;
	color: #888888 !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	padding: 12px 24px !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
	opacity: 0.7 !important;
	transition: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* 禁用按鈕 hover 狀態 - 保持灰色 */
.vendor-btn-disabled:hover, .call-to-action-btn .vendor-btn-disabled:hover,
	.vendor-wrapper .vendor-btn-disabled:hover, .vendor-step .vendor-btn-disabled:hover
	{
	background: #e0e0e0 !important;
	border-color: #b0b0b0 !important;
	color: #888888 !important;
	transform: none !important;
	box-shadow: none !important;
}

/* 禁用按鈕內的圖標 - 灰色 */
.vendor-btn-disabled .new-btn-icon, .call-to-action-btn .vendor-btn-disabled .new-btn-icon,
	.vendor-wrapper .vendor-btn-disabled .new-btn-icon, .vendor-step .vendor-btn-disabled .new-btn-icon
	{
	background: #b0b0b0 !important;
	background-color: #b0b0b0 !important;
	width: 24px !important;
	height: 24px !important;
	margin-left: 8px !important;
	border-radius: 50% !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
}

/* 禁用按鈕圖標 hover 狀態 - 保持灰色 */
.vendor-btn-disabled:hover .new-btn-icon, .call-to-action-btn .vendor-btn-disabled:hover .new-btn-icon,
	.vendor-wrapper .vendor-btn-disabled:hover .new-btn-icon, .vendor-step .vendor-btn-disabled:hover .new-btn-icon
	{
	background: #b0b0b0 !important;
	background-color: #b0b0b0 !important;
}

/* 禁用按鈕圖標內的箭頭 - 灰色 */
.vendor-btn-disabled .new-btn-icon::before, .call-to-action-btn .vendor-btn-disabled .new-btn-icon::before,
	.vendor-wrapper .vendor-btn-disabled .new-btn-icon::before,
	.vendor-step .vendor-btn-disabled .new-btn-icon::before {
	content: "" !important;
	width: 6px !important;
	height: 6px !important;
	border: solid #888888 !important;
	border-color: #888888 !important;
	border-width: 0 2px 2px 0 !important;
	transform: rotate(-45deg) !important;
	display: inline-block !important;
	margin-left: 2px !important;
}

/* 合作店家專區灰色小字樣式 - 置中對齊 */
.vendor-disabled-text {
	color: #F75000;
	font-size: 0.875rem;
	text-align: center !important;
	margin: 12px auto 0 auto !important;
	line-height: 1.5;
	width: 100%;
	display: block;
}

/* 四個導航按鈕樣式 - 符合圖一設計 */
.youth-btn-hover.youth-btn-rounded {
	background-color: #ffffff !important;
	color: #B33612 !important;
	border: 2px solid #dc3545 !important; /* 紅色邊框 */
	border-radius: 999px !important; /* 橢圓形 */
	min-width: 150px !important;
	padding: 10px 24px !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	transition: all 0.3s ease !important;
	text-decoration: none !important;
	display: inline-block !important;
}

/* 懸停狀態 - 橘色底、白色文字 */
.youth-btn-hover.youth-btn-rounded:hover {
	background-color: #B33612 !important;
	color: #ffffff !important;
	border-color: #B33612 !important;
}

/* 按下狀態 - 白色底、橘色文字 */
.youth-btn-hover.youth-btn-rounded:active {
	background-color: #ffffff !important;
	color: #B33612 !important;
	border-color: #dc3545 !important;
	transform: translateY(1px) !important;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

/* 焦點狀態 - 無障礙設計 */
.youth-btn-hover.youth-btn-rounded:focus {
	outline: 3px solid #005fcc !important;
	outline-offset: 3px !important;
}

/* 禁用按鈕樣式 - 灰色且無法點擊 */
.youth-btn-disabled, .youth-btn-hover.youth-btn-rounded.youth-btn-disabled
	{
	background-color: #e0e0e0 !important;
	color: #888888 !important;
	border: 2px solid #b0b0b0 !important;
	border-color: #b0b0b0 !important;
	border-radius: 999px !important;
	min-width: 150px !important;
	padding: 10px 24px !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	display: inline-block !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
	opacity: 0.7 !important;
	transition: none !important;
}

/* 禁用按鈕 hover 狀態 - 保持灰色 */
.youth-btn-disabled:hover, .youth-btn-hover.youth-btn-rounded.youth-btn-disabled:hover
	{
	background-color: #e0e0e0 !important;
	color: #888888 !important;
	border-color: #b0b0b0 !important;
	transform: none !important;
	box-shadow: none !important;
}

/* 禁用按鈕 active 狀態 - 保持灰色 */
.youth-btn-disabled:active, .youth-btn-hover.youth-btn-rounded.youth-btn-disabled:active
	{
	background-color: #e0e0e0 !important;
	color: #888888 !important;
	border-color: #b0b0b0 !important;
	transform: none !important;
	box-shadow: none !important;
}

/* 禁用按鈕 focus 狀態 - 移除焦點樣式 */
.youth-btn-disabled:focus, .youth-btn-hover.youth-btn-rounded.youth-btn-disabled:focus
	{
	outline: 3px solid #005fcc !important;
	outline-offset: 3px !important;
}

/* 響應式設計 - 手機版按鈕調整 */
@media screen and (max-width: 575px) {
	.youth-btn-hover.youth-btn-rounded {
		min-width: 120px !important;
		padding: 8px 16px !important;
		font-size: 0.9rem !important;
	}
	.youth-btn-disabled, .youth-btn-hover.youth-btn-rounded.youth-btn-disabled
		{
		min-width: 120px !important;
		padding: 8px 16px !important;
		font-size: 0.9rem !important;
	}
}

/* 隱藏榮耀時刻區塊 */
section#award {
	display: none !important;
}

/* 贊助專區紅色按鈕樣式 */
.sponsorship-modern-btn.red {
	background: #dc3545 !important;
	color: #ffffff !important;
	box-shadow: 0 4px 16px rgba(220, 53, 69, 0.20) !important;
}

.sponsorship-modern-btn.red:hover {
	background: #c82333 !important;
	color: #ffffff !important;
	box-shadow: 0 8px 32px rgba(220, 53, 69, 0.30) !important;
}

.sponsorship-modern-btn.red:focus {
	outline: 3px solid #005fcc !important;
	outline-offset: 3px !important;
}

/* 更多服務區塊 - 單一按鈕置中布局 */
.more-services-modern-cards {
	display: flex !important;
	gap: 32px !important;
	justify-content: center !important;
	align-items: stretch !important;
}

.more-services-modern-card {
	flex: 0 0 auto !important;
	max-width: 600px !important;
	min-width: 0 !important;
	width: 100% !important;
}

@media ( max-width : 991px) {
	.more-services-modern-cards {
		flex-direction: column !important;
		gap: 32px !important;
		align-items: center !important;
	}
	.more-services-modern-card {
		max-width: 90% !important;
		width: 90% !important;
	}
}

/* 各項補助申請區塊 - 兩個卡片並排顯示 */
.subsidy-apply-modern-cards {
	display: flex !important;
	gap: 24px !important;
	justify-content: center !important;
	align-items: stretch !important;
	flex-wrap: wrap !important;
}

.subsidy-apply-modern-card {
	flex: 1 1 calc(50% - 12px) !important;
	min-width: 300px !important;
	max-width: 100% !important;
	background: #ffffff !important;
	border-radius: 12px !important;
	padding: 32px 24px !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
	display: flex !important;
	flex-direction: column !important;
	text-align: center !important;
}

/* 讓 more-services-modern-card 在 subsidy-apply-modern-cards 容器中也能並排顯示 */
.subsidy-apply-modern-cards .more-services-modern-card {
	flex: 1 1 calc(50% - 12px) !important;
	min-width: 300px !important;
	max-width: 100% !important;
	height: 100% !important;
	min-height: 320px !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: flex-start !important;
}

/* 確保兩個卡片的描述文字區域高度一致 */
.subsidy-apply-modern-cards .more-services-modern-card-desc {
	flex: 1 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 60px !important;
}

/* 第二列直播卡：與學生觀賽同寬同高（與第一列單卡同寬） */
.subsidy-apply-modern-cards-row2 .more-services-modern-card {
	flex: 0 0 calc(( 100% - 24px)/2) !important;
	width: calc(( 100% - 24px)/2) !important;
	min-width: 300px !important;
	max-width: calc(( 100% - 24px)/2) !important;
	min-height: 320px !important;
	box-sizing: border-box !important;
}

.more-services-modern-video-wrap {
	width: 100%;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 12px;
	background: #000;
}

.more-services-modern-video-wrap iframe {
	display: block;
	vertical-align: top;
}

.subsidy-apply-modern-card-header {
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	color: #1f1f1f !important;
	margin-bottom: 20px !important;
	line-height: 1.4 !important;
	text-align: center !important;
}

.subsidy-apply-modern-card-body {
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 20px !important;
}

.subsidy-apply-modern-card-desc {
	font-size: 1rem !important;
	color: #333 !important;
	line-height: 1.6 !important;
	text-align: center !important;
	width: 100% !important;
}

.subsidy-apply-modern-icon {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	margin-bottom: 0 !important;
	margin-top: 0 !important;
}

.subsidy-apply-modern-icon svg {
	width: 64px !important;
	height: 64px !important;
}

.subsidy-apply-modern-btn {
	display: inline-block !important;
	padding: 12px 32px !important;
	background: #8A4B00 !important;
	color: #ffffff !important;
	border-radius: 8px !important;
	text-align: center !important;
	text-decoration: none !important;
	font-weight: 600 !important;
	font-size: 1rem !important;
	transition: all 0.3s ease !important;
	border: none !important;
	cursor: pointer !important;
	margin-top: auto !important;
	width: auto !important;
	min-width: 140px !important;
	box-shadow: 0 2px 8px rgba(138, 75, 0, 0.3) !important;
}

.subsidy-apply-modern-btn:hover {
	background: #6F3D00 !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(138, 75, 0, 0.4) !important;
}

.subsidy-apply-modern-btn:focus {
	outline: 3px solid #005fcc !important;
	outline-offset: 3px !important;
}

/* 禁用按鈕樣式 */
.subsidy-apply-modern-btn-disabled {
	background: #cccccc !important;
	color: #666666 !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
	box-shadow: none !important;
}

.subsidy-apply-modern-btn-disabled:hover {
	background: #cccccc !important;
	color: #666666 !important;
	transform: none !important;
	box-shadow: none !important;
}

/* 響應式設計 - 手機版改為單列 */
@media ( max-width : 767px) {
	.subsidy-apply-modern-cards {
		flex-direction: column !important;
		gap: 20px !important;
	}
	.subsidy-apply-modern-card {
		flex: 1 1 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		padding: 24px 20px !important;
	}
	.subsidy-apply-modern-cards .more-services-modern-card {
		flex: 1 1 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		width: 100% !important;
		min-height: auto !important;
	}
	.subsidy-apply-modern-card-header {
		font-size: 1.125rem !important;
		margin-bottom: 16px !important;
	}
	.subsidy-apply-modern-card-desc {
		font-size: 0.875rem !important;
	}
}

/* 調整氣泡位置 - 避免擋住文字 */
.youth-bubble-pos-5 {
	left: 5% !important;
	bottom: 35% !important;
}

@media ( max-width : 991px) {
	.youth-bubble-pos-5 {
		left: 3% !important;
		bottom: 30% !important;
	}
}

@media ( max-width : 767px) {
	.youth-bubble-pos-5 {
		left: 2% !important;
		bottom: 25% !important;
	}
}