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


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

:root {
	--news-card-h: 0px;
	--broadcast-card-gap: 24px;
	--broadcast-card-h: var(--news-card-h);
	/* --broadcast-card-h:(clamp(1.125rem, 0.725rem + 0.65vw, 1.5rem) * 2) + (clamp(1.125rem, 0.992rem + 0.22vw, 1.25rem) * 1.75) + (clamp(0.75rem, 0.617rem + 0.22vw, 0.875rem) * 1.42) */
	/* --broadcast-card-h:(1.3125rem * 2) + (clamp(1.125rem, 0.992rem + 0.22vw, 1.25rem) * 1.75) + (clamp(0.75rem, 0.617rem + 0.22vw, 0.875rem) * 1.42 + 0.625rem) */
	/* --broadcast-card-gap:  clamp(0.75rem, -0.05rem + 1.29vw, 1.5rem); */
}


@media (max-width: 990px){

	:root {
		--broadcast-card-gap: 12px;
	}

}






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


/*首頁內容區塊*/	
.mainContent{
	padding:1.5rem 0 0; 
	    /* background-color: #e1baba; */
}






.index_itemBg{
	padding-top: 3.097rem;
}









	/*----- 首頁標題1 -----*/
	.index_title {
		 /* 26.47px , 1.5625vw , 30.00px */
		 color: #ffffff;
		  /* 10.32px , 1.0417vw , 20.00px */
		 /* font-size: 1.875rem; */
		 font-size: clamp(1.25rem, 0.583rem + 1.08vw, 1.875rem); /* 20 30 */
		 line-height: 1.2;
		 letter-spacing: -0.05em;
		 /* font-style: italic; */
		 font-weight: 700;
		 border-bottom: rgba(255 255 255 / 0.1) 1px solid;
		 padding-bottom: clamp(0.516rem, 0.419rem + 0.48vw, 1rem);
		 margin-bottom: clamp(1.032rem, 0.839rem + 0.97vw, 2rem);
	}	
		.index_title strong{	
			font-size: inherit;
			line-height: inherit;
			padding: 0;
			margin: 0;
			display: inline-block;
			font-weight: inherit;
		}	
	



.more_button{
	padding: 0;
	margin: 0;
	background: transparent;
	border: none;
	font-weight: 700;
	font-size: 0.75rem;
	line-height: 1rem;
	line-height: 1.33;
	cursor: pointer;
	color: #fff;
	transition: 0.3s ease all;
}
.more_button:hover{
	transition: 0.3s ease all;
	color: var(--primary_color);
}


	



@media (max-width: 990px){
	
	.mainContent{	
		padding: 0;
		/* padding: 25px 0px;	 */
	}	



		/*----- 首頁標題1 -----*/
		.index_title{
			font-size: 1.5625rem;
			line-height: 1.2;
		}
		

}

















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

.home_banner_area{
	position: relative;
	/* overflow: hidden; */
	background-color: #000;
	/* min-height: 60dvh; */
}
.home_banner_area .banner{
	background: #000;
	/* min-height: 60dvh; */
}

.banner-link{
	
}

	.banner-background {
		width: 100%;
		/* aspect-ratio: 1920 / 675; */
		/*min-height: 30.625rem;*/ /*490*/
		border-radius: 0 0 1.5rem 1.5rem;
		/* min-height: 35rem;
    	max-height: 60dvh; */
		aspect-ratio: 120 / 41;
		position: relative;
		display: block;
		overflow: hidden;
		/* filter: brightness(.5); */
	}

		.banner-background picture{
			width: 100%;
			height: 100%;
			display: block;
		}
			.banner-background .banner-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;
			}

			.banner-img-mb{
				display: none;
			}


			
	.banner-content {
		position: absolute;
		box-sizing: border-box;
		max-width: 113.75rem;
		width: 90%;
		left: 50%;
		top: 50%;
		transform: translateX(-50%) translateY(-50%);
		z-index: 2;
		/* bottom: clamp(3.347rem, 1.25rem + 3.38vw, 5.313rem); */
		/* padding: 0 clamp(1.291rem, 0.001rem + 2.08vw, 2.5rem); */
		/* margin-bottom: calc(clamp(1.129rem, 0.001rem + 1.82vw, 2.188rem) * 1.3); */
	}

        .banner-text {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            /* row-gap: calc(clamp(1.129rem, 0.001rem + 1.82vw, 2.188rem) * 0.9); */
        }

        .banner-subtitle {
            /* font-weight: 500; */
            /* font-size: clamp(1rem, 0.733rem + 0.43vw, 1.25rem); */
            color: #fff;
            margin-bottom: clamp(0.258rem, 0.21rem + 0.24vw, 0.5rem);
            font-size: 1rem;
            line-height: 1.5;
            letter-spacing: 0.3em;
            /* font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; */
			font-family: var(--foreign_font);
        }

        .banner-title {
            font-size: 4.5rem;
            font-size: clamp(2.322rem, 1.887rem + 2.18vw, 4.5rem);
            line-height: 1;
            color: #fff;
            font-weight: 700;
            margin-bottom: clamp(1.032rem, 0.839rem + 0.97vw, 2rem);
        }

        .banner-button{
            padding: 0;
            margin: 0;
            cursor: pointer;
            border: none;
            margin: 0 auto;
            display: flex;
            /* padding: 1rem 2.5rem; */
			padding: 1.25rem 2.5rem;
            border-radius: 50px;
			color: #000;
            background-color: var(--primary_color);
            font-size: 1rem;
            line-height: 1;
            font-weight: 700;
			transition: 0.3s ease all;
			transform-origin: center;
			overflow: hidden;
			position: relative;
        }
        .banner-button span{
            z-index: 2;
			color: inherit;            
            font-size: inherit;       
            line-height: inherit;       
            font-weight: inherit;       
			position: relative;
			display: block;
			text-decoration: none;
        }
		.banner-link:hover .banner-button{
			transform: scale(1.05);
			transform-origin: center;
			transition: 0.3s ease all;
			box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
		}
		.banner-button:before {
			content: "";
			position: absolute;
			z-index: -1;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background:  #fff;
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
			-webkit-transform-origin: 0 50%;
			transform-origin: 0 50%;
			-webkit-transition-property: transform;
			transition-property: transform;
			-webkit-transition-duration: 0.5s;
			transition-duration: 0.5s;
			-webkit-transition-timing-function: ease-out;
			transition-timing-function: ease-out;
		}

		.banner-link:hover .banner-button:before {
			-webkit-transform: scaleX(1);
			transform: scaleX(1);
			-webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
			transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
			z-index: 0;
		}
		.banner-link:hover .banner-button span {
			color: var(--dark_color);
		}


	/*.banner-bottom {
		position: absolute;
		bottom: clamp(0.968rem, -0.001rem + 1.56vw, 1.875rem);
		max-width: 113.75rem;
		transform: translateX(-50%);
		z-index: 6;
		width: 90%;

		display: flex;
		flex-direction: column;
		row-gap: clamp(1.129rem, 0.001rem + 1.82vw, 2.188rem);
	}

		.banner-lines {
			display: flex;
			align-items: center;
			height: 0.0313rem;
			width: 100%;
			position: relative;
		}
		.banner-lines .banner-line--base{
			height: 0.125rem;
			width: 0%;
			position: relative;
			z-index: 1;
		}
		.banner-lines .banner-line--accent{
			background-color:rgba(255, 255, 255, 0.4);
			position: absolute;
			height: inherit;
			width: inherit;
			top: 50%;
			transform: translateY(-50%);
			left: 0;
			z-index: 0;
		}



	.banner-controls {
		display: flex;
		align-items: center;
		gap: clamp(1.129rem, 0.001rem + 1.82vw, 2.188rem);
	}

		.banner-controls-left{
			
		}

			.banner-controls .swiper-pagination {
				width: auto;
				color: #fff;
				font-size: 1rem;
				position: unset;
				height: auto;
				letter-spacing: 0.5rem;
				font-family: var(--foreign_font);
			}



		 .banner-controls-right{
			display: flex;
			align-items: center;
			gap: 0.3125rem;
		}
			.banner-controls .banner-button{
				position: unset;
				margin: 0px;
				width:1.25rem; 
				height: auto;
				aspect-ratio: 1;
				background-size: 99.9%;
				background-position: center;
				background-repeat: no-repeat;
				-webkit-transform: unset;
				transform: unset;
			}

			.banner-controls .swiper-button-prev{		
				background-image: url(../index/images/left_arrow.svg);
			}
			.banner-controls .swiper-button-next{
				background-image: url(../index/images/right_arrow.svg);
			} */





/* 動畫初始 */
/* .banner-background {
  opacity: 0;
  transform: scale(1);
  transition: opacity 1s linear, transform 6s linear;
} */
/* 動畫觸發 */
/* .swiper-slide-active .banner-background {
  opacity: 1;
  transform: scale(1.1);
  z-index: 1;
} */

/* 進度條_動畫初始 */
/* .banner-line--base {
  width: 0;
  background-color: #fff;
} */
/* 進度條_動畫觸發 */
/* .banner-line--base.active {
  width: 100%;
  transition: width 6s linear;
} */


@media (max-width: 990px){

	.banner-background {
		aspect-ratio: 411 / 440;
	}

	.banner-img-pc{
		display: none;
	}
	.banner-img-mb{
		display: block;
	}


}











/*================================================================================================================*/
/*-------首頁下方區塊_功能區--------*/
/*================================================================================================================*/


.index_tag_bottom_Bg{
	padding: clamp(3.097rem, 2.516rem + 2.9vw, 6rem) 0 0;
}



	.index_tag_bottom_Bg .tab_area {
		border-bottom: none;
	}

	.index_tag_bottom_Bg .p_tab_text_area {
		background: #fff0;
		padding: 0px;
		/* background: var(--sixth_color); */
		background: #34343a;
	}


		.index_tag_bottom_Bg .img-scroll {
			height:  2.5000rem;
		}
		.index_tag_bottom_Bg .tabs li {
			color: #fff;
			border-right: none;
			/* font-size: 1.25rem; */
			font-size: clamp(1.125rem, 0.992rem + 0.22vw, 1.25rem); /* 18 20 */
			width: 25%;
			border-radius:0;
			border-top-left-radius:clamp(0.903rem, 1.46vw, 1.75rem);
			/* border-top-right-radius:clamp(0.1250rem, 0.2083vw, 0.2500rem); */
			border-top-right-radius:clamp(0.903rem, 1.46vw, 1.75rem);
			overflow: hidden;
			line-height: 2.5000rem;
		}
		.index_tag_bottom_Bg .tabs li.active {
			color: var(--primary_color);
		}

		
		.index_tag_bottom_Bg .tabs span {
			background: var(--sixth_color);
			text-align: left;
			padding: 0 clamp(0.645rem, 1.04vw, 1.25rem);
			padding: 0 1.25rem;
			/* background: #ddd; */
		}
		.index_tag_bottom_Bg .tabs li span:hover {
			color: var(--primary_color);
			box-shadow: none;
			opacity: 0.5;
		}

		.index_tag_bottom_Bg  .tabs li.active span {
			box-shadow:none;
			background: #34343a;
		}





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

	/* .index_tag_bottom_Bg .img-scroll  */
	.index_tag_bottom_Bg  .tab_area{
		max-width: 76rem;
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}
    
		.index_tag_bottom_Bg .index_itemBg{
			padding: clamp(3.097rem, 2.516rem + 2.9vw, 6rem) 0 ;
		}
		
}


@media (max-width: 990px){

	.index_tag_bottom_Bg  .tab_area{
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}

	.index_tag_bottom_Bg .p_tab_text_area{
		background: transparent;
		border-top: #34343a 1px solid;
	}

		.index_tag_bottom_Bg .index_itemBg{
			padding-top: clamp(1.548rem, -0.001rem + 2.5vw, 3rem);
			padding-bottom: clamp(3.097rem, 2.516rem + 2.9vw, 6rem) ;
			/* padding-top: calc(3.097rem * 0.5); */
		}

	

}


@media (max-width: 760px){


	.index_tag_bottom_Bg   .tabs_btn_now{
		background: var(--sixth_color);
		border-bottom:none;
		border-radius:0;
		border-top-left-radius:clamp(0.903rem, 1.46vw, 1.75rem);
		border-top-right-radius:clamp(0.1250rem, 0.2083vw, 0.2500rem);
		font-size: 1.25rem;
    	line-height: 1.75;
		line-height: 1.9;
	}

		.index_tag_bottom_Bg   .tabs_btn_now span{
			font-size: inherit;
			display: block;
			color: inherit;
			line-height: inherit;
		}

		.index_tag_bottom_Bg .tabs li{
			width: 100%;
			border-radius: 0;
			border-bottom-color: #575757;
			font-size: 1rem;
		}

		.index_tag_bottom_Bg  .tabs_btn_now_arrow {
			top: 50%;
			transform: translateY(-50%);
			right: 1.25rem;
		}
}




















/*========================================================*/
/*-------首頁_最新消息+今日廣播區塊--------*/
/*========================================================*/


.index_news_todayBroadcastBg{
	
}

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

	.index_news_todayBroadcastBg{
		max-width: 76rem;
		width: 90%;
		margin: 0 auto;
		display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(2.064rem, 3.33vw, 4rem);
        justify-content: space-between;
		align-items: stretch;
		align-items: flex-start;
	}
	
}














/*========================================================*/
/*-------首頁_最新消息區塊--------*/
/*========================================================*/

.index_newsBg{
}
	.index_newsBg .wrap{
		
	}

		.index_news_area{
			
		}
			.index_newsBg .index_title{				
				display: flex;	
				flex-wrap: wrap;			
				align-items: baseline;				
				justify-content: space-between;								
				gap: .3125rem;
			}
			.index_newsBg .more_button{
				
			}

			.news-card{
				/* padding: 1.25rem; */
				padding: 1.3125rem;
			}

			.news-card a {
				flex-direction: column;
				row-gap: .625rem;
			}
			/* 日期-------------------- */
			.news-date{
				/* font-size: clamp(0.875rem, 0.742rem + 0.22vw, 1rem); */
				font-size: clamp(0.75rem, 0.617rem + 0.22vw, 0.875rem);
				font-weight: 600;
				padding-bottom: .3125rem;
				box-sizing: border-box;
			}

			/* 右邊區塊---------------- */
			.news-content {
				width: 100%;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				gap: inherit;
				position: relative;
				z-index: 2;
			}

			.news-info{
				display: flex;
				flex-direction: column;
				gap: .3125rem;
			}

			/* 標籤區塊---------------- */
			.news-tag_area {
				display: flex;
				align-items: center;
				justify-content: right;
				gap: 10px;
				/* padding-bottom: 5px; */
			}

			/* 標籤通用樣式------------ */
			.news_tag {
				padding: 3px 15px;
				box-sizing: border-box;
				border-radius: 25px;
				font-size: clamp(0.75rem, 0.683rem + 0.11vw, 0.813rem);
				word-break: keep-all;

				display: flex;
				justify-content: center;

				min-width: 3.75rem;
			}
			/* 置頂 */
			.top_tag {
				/* border: 1px solid var(--primary_color); */
				background-color: var(--black_color);
				color: var(--primary_color);

				outline: 1px solid var(--primary_color);
				outline-offset: 0px; /* 往外推 1px */
			}
			/* 熱門 */
			.hot_tag {
				/* border: 1px solid var(--black_color); */
				background-color: var(--primary_color);
				color: var(--black_color);

				outline: 1px solid var(--black_color);
				outline-offset: 0px; /* 往外推 1px */
			}


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

	.index_itemBg .news-container {
		row-gap: var(--broadcast-card-gap);
	}

}

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

	.index_itemBg .news-container {
		row-gap: 12px;
	}

}



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

	.index_newsBg{
		padding-top: 0;
	}
		.index_newsBg .wrap{
			max-width: 99.9%;
			width: 100%;
		}
	.news-container {
		/* border: 1px #fff solid; */
	}
}

@media (max-width: 480px){
	.news-content {
		flex-direction: column;
	}
	.news-tag_area {
		justify-content: left;
	}
}











/*========================================================*/
/*-------首頁_今日廣播區塊--------*/
/*========================================================*/


.index_today_broadcastBg{

}
	.index_today_broadcastBg .wrap{
		
	}

	.index_today_broadcastBg  .index_title{
		/* position: relative; */
	}


		.index_today_broadcast_area{

		}




		.today_broadcast-container {
			width: 100%;
			position: relative;
		}

		.swiper_container_todaybroadcast {
			/*height: 420px; *//* 先給固定高度，之後再微調 */
		}

		.swiper_container_todaybroadcast .swiper-wrapper {
			/* height: 100%; */
			height: auto;
			/* gap: clamp(0.75rem, -0.05rem + 1.29vw, 1.5rem); */
		}

		.swiper_container_todaybroadcast .swiper-slide {
			height: auto;
		}

		.index_today_broadcastBg .swiper-pagination{

		}






			.broadcast-card{
				border-radius: 1rem;
				padding: clamp(1.125rem, 0.725rem + 0.65vw, 1.5rem); /* 18 24 */
				background-color: var(--dark_color);
			}

			.broadcast-card.broadcast-card.active{
				background-color: var(--primary_color);
				padding: clamp(0.75rem, 0.483rem + 0.43vw, 1rem) clamp(1.125rem, 0.725rem + 0.65vw, 1.5rem);
			}
			.broadcast-card.broadcast-card.active .broadcast-title-en{
				color: rgba(0, 0, 0, 0.6);
			}
			.broadcast-card.broadcast-card.active .broadcast-title-tw{
				color: var(--dark_color);
			}
			.broadcast-card.broadcast-card.active .broadcast-bottom{
				color: var(--dark_color);
			}


			.broadcast-card.broadcast-card:not(.active) .broadcast-title-en{
				display: none;
			}

				.broadcast-card a{
					display: flex;
					align-items: center;
					justify-content: space-between;
					gap: .3125rem;
					text-decoration: none;
				}

				
					.broadcast-card-left{

					}
						.broadcast-title-en{
							/* font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; */
							font-family: var(--foreign_font);
							/* font-size: 0.75rem; */
							font-size: clamp(0.625rem, 0.492rem + 0.22vw, 0.75rem); /* 10 12 */
							line-height: 1rem;
							color: rgba(255, 255, 255, 0.6);
						}
						.broadcast-title-tw{
							/* font-size: 1.25rem; */
							font-size: clamp(1.125rem, 0.992rem + 0.22vw, 1.25rem); /* 18 */
							line-height: 1.75;
							color: var(--white_color);
							font-weight: 700;

							display: -webkit-box;
							-webkit-box-orient: vertical;	
							-webkit-line-clamp: 1;	
							overflow: hidden;
						}

						.broadcast-bottom{
							/* font-size: 0.875rem; */
							font-size: clamp(0.75rem, 0.617rem + 0.22vw, 0.875rem); /* 12 14 */
							line-height: 1.42;
							opacity: 0.8;
							font-weight: 700;
							color: var(--second_dark_color);
							display: flex;
							align-items: center;
							gap: 0.3125rem;
						}
							.broadcast-bottom .name{
								display: flex;
								align-items: center;
								gap: inherit;
							}
							.broadcast-bottom .name::after{
								content: "";
								background-color: var(--dark_color);
								opacity: 0.8;
								width: 0.125rem;
								height: calc(1.42 * 0.875rem);
								display: inline-block;
							}
							.broadcast-bottom .time{
								
							}



					.broadcast-card-right{
						
					}
						.broadcast-card-right .lamp{
							width: 1rem;
							aspect-ratio: 1;
							background-color: #dc2626;
							box-shadow: 0 0 #0000, 0 0 #0000, 0 0 10px red;
							border-radius: 9999px;
							animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
							opacity: 0;
						}

						@keyframes pulse {
							50% {
								opacity: .5
							}
						}

						/* .index_today_broadcastBg .swiper-slide-active .broadcast-card-right .lamp */
						.index_today_broadcastBg .broadcast-card.active .broadcast-card-right .lamp{
							opacity: 1;
						}




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


	.index_today_broadcastBg{
		padding-top: 0;
	}

	.index_today_broadcastBg  .index_title{
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}




	.index_today_broadcastBg .swiper-pagination{
		/* position: absolute; */
		left: unset !important;
		right: unset !important;
		top: unset !important;
		bottom: unset !important;
		transform: unset !important;
		position: unset!important;
		max-height: 0.625rem;
		display: flex;
		gap: .1563rem;
	}

	.today_broadcast-container{
		/* border: 1px #fff solid; */
		/* padding-right: 15px; */
	}
	.index_today_broadcastBg .wrap{
		max-width: 99.9%;
		width: 100%;
	}
		.swiper_container_todaybroadcast {
			min-height: auto;
			max-height: inherit !important;
			/*height: 420px; *//* 先給固定高度，之後再微調 */
		}


		.index_today_broadcastBg .swiper-slide:not(.swiper-slide-active) .broadcast-card{
			/* opacity: 0.3; */
		}



		.today_broadcast-container .broadcast-card {
			min-height: var(--broadcast-card-h);
		}


		/* .today_broadcast-container .count_1  .swiper-wrapper{
			min-height: calc( (var(--broadcast-card-h)) * 1 + (24px * 0) + (1rem * 0))  !important;
			max-height: calc( (var(--broadcast-card-h)) * 1 + (24px * 0) + (1rem * 1))  !important;
		}
		.today_broadcast-container .count_2  .swiper-wrapper{
			min-height: calc( (var(--broadcast-card-h)) * 2 + (24px * 1) + (1rem * 1))  !important;
			max-height: calc( (var(--broadcast-card-h)) * 2 + (24px * 1) + (1rem * 1))  !important;
		}
		.today_broadcast-container .count_3  .swiper-wrapper{
			min-height: calc( (var(--broadcast-card-h)) * 3 + (24px * 2) + (1rem * 1))  !important;
			max-height: calc( (var(--broadcast-card-h)) * 3 + (24px * 2) + (1rem * 1))  !important;
		}
		.today_broadcast-container .count_4  .swiper-wrapper{
			min-height: calc( (var(--broadcast-card-h)) * 4 + (24px * 3) + (1rem * 0))  !important;
			max-height: calc( (var(--broadcast-card-h)) * 4 + (24px * 3) + (1rem * 0))  !important;
		}
			
		.today_broadcast-container .count_5  .swiper-wrapper .broadcast-card ,
		.today_broadcast-container .count_gt  .swiper-wrapper .broadcast-card {
		} */
		 
		
		
}





@media (max-width: 990px){

	.index_today_broadcastBg .index_title {
		/* margin-bottom: clamp(1.032rem, 0.839rem + 0.97vw, 2rem); */
	}

	.swiper_container_todaybroadcast {
		/* min-height: auto; */
		/* max-height: calc((118.88px * 2) + 3rem); */
		/*height: 420px; *//* 先給固定高度，之後再微調 */
	}
	.index_today_broadcastBg .swiper-pagination{
		display: none;
	}
}



@media (max-width: 768px){

	.swiper_container_todaybroadcast {
		/* max-height: calc((118.88px * 1) + 0rem); */
	}
		.broadcast-card {
			padding: clamp(0.774rem, 0.629rem + 0.73vw, 1.5rem);
			border-radius: clamp(0.516rem, 0.419rem + 0.48vw, 1rem);
		}
		
}




@media  (max-width: 640px) {

	.today_broadcast-container  .swiper-wrapper .swiper-slide{
		/* height: auto !important; */
	}

}










/*========================================================*/
/*-------首頁_年度精選節目+直播區塊--------*/
/*========================================================*/


/* .index_seasonal_liveBg{
	
}

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

	.index_seasonal_liveBg{
		max-width: 76rem;
		width: 90%;
		margin: 0 auto;
		padding: clamp(3.097rem, 2.516rem + 2.9vw, 6rem) 0;
	}
	.index_seasonal_liveBg.active{		
		display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(2.064rem, 3.33vw, 4rem);
        justify-content: space-between;
		padding: clamp(3.097rem, 2.516rem + 2.9vw, 6rem) 0 0;
		
	}


} */











/*========================================================*/
/*-------首頁_年度精選節目區塊--------*/
/*========================================================*/

.index_seasonalBg{

}
	.index_seasonalBg .wrap{
		
	}

		.index_seasonal_area{
			
		}
			.index_seasonalBg .index_title{				
				/* display: flex;	
				flex-wrap: wrap;			
				align-items: baseline;				
				justify-content: space-between;								
				gap: .3125rem; */
			}


			.seasonal-container{
				/* display: flex;
				flex-direction: column; */
				display: grid;
				grid-template-columns: repeat(4, minmax(0, 1fr));
				gap: clamp(1.032rem, 1.67vw, 2rem);
			}

			.index_seasonalBg .seasonal-card{
				display: flex;
				flex-direction: column;
			}

				.index_seasonalBg .seasonal-card a{
					color: #FFF;
					display: flex;
					flex-direction: column;
					justify-content: center;
					text-decoration: none;
					/* padding: clamp(1.032rem, 1.67vw, 2rem); */
					flex-grow: 1;
				}
				.index_seasonalBg .seasonal-card a:hover{
					color: var(--primary_color);
				}


					.index_seasonalBg .seasonal-img{
						margin: 0 auto clamp(0.516rem, 0.83vw, 1rem);
						/* width: 2rem; */
						width: 100%;
						position: relative;
						aspect-ratio: 451 / 253.8;
						border-radius: clamp(0.774rem, 1.25vw, 1.5rem);
						display: block;
						overflow: hidden;
						transition: 0.5s ease all;
					}
						.index_seasonalBg .seasonal-img img{
							width: 100%;
							height: auto;
							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.5s ease all;
						}


					.index_seasonalBg .seasonal-title{
						/* font-size: 1.125rem; */
						font-size: clamp(1rem, 0.867rem + 0.22vw, 1.125rem);
						line-height: 1.58;
						font-weight: 600;
						text-align: center;
					}



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

	.index_seasonalBg{
		/* padding-top: 0; */
		/* padding: clamp(3.097rem, 2.516rem + 2.9vw, 6rem) 0; */
	}
		.index_seasonalBg .wrap{
			/* max-width: 99.9%; */
			/* width: 100%; */
			height: 100%;
			display: flex;
			flex-direction: column;
		}

			.index_seasonal_area {
				display: flex;
				flex-direction: column;
				/* height: 100%; */
				flex-grow: 1;
			}

				.seasonal-container {
					/* border: 1px #fff solid; */
					/* display: grid;
					grid-template-columns: repeat(2, minmax(0, 1fr)); */
					flex-grow: 1;
				}

				/* .index_seasonal_liveBg:not(.active) .seasonal-container {
					display: grid;
					grid-template-columns: repeat(4, minmax(0, 1fr));
					
				} */




}

@media (max-width: 768px){

	.seasonal-container{
		column-gap: .625rem;
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

}

@media (max-width: 400px){
	
	.seasonal-container{
		column-gap: 1.25rem;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}












/*========================================================*/
/*-------首頁_直播區塊--------*/
/*========================================================*/


.index_liveBg{

}
	.index_liveBg .wrap{
		
	}

	.index_liveBg  .index_title{
		/* position: relative; */
	}


		.index_live_area{

		}
			/* .live-container {
				width: 100%;
				position: relative;
				padding: 0;
				padding-bottom: 56.25%;
				overflow: hidden;
				border-radius: clamp(0.516rem, 0.419rem + 0.48vw, 1rem);
			}

				.live-container iframe{
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
				} */

				.live-container {
					width: 100%;
					position: relative;
					padding: 0;
					padding-bottom: 56.25%; /* 保持 16:9 比例 */
					overflow: hidden;
					border-radius: clamp(0.516rem, 0.419rem + 0.48vw, 1rem);
					cursor: pointer; /* 讓使用者知道這可以點擊 */
					background-color: #000; /* 預防萬一的黑色背景 */
				}

				/* 讓圖片、未來的 iframe 都絕對定位並填滿容器 */
				.live-container iframe,
				.live-container .video-cover {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					border: none;
				}

				/* 確保圖片不變形地填滿 */
				.live-container .video-cover {
					object-fit: cover;
				}

				/* YouTube 風格的播放按鈕，置中對齊 */
				.live-container .play-button {
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
					width: 68px;
					height: 48px;
					background-color: rgba(33, 33, 33, 0.8);
					border-radius: 12px;
					transition: background-color 0.2s ease;
					z-index: 2; /* 確保按鈕在圖片上方 */
				}

				/* 播放按鈕內部的白色三角形 */
				.live-container .play-button::before {
					content: "";
					position: absolute;
					top: 50%;
					left: 55%;
					transform: translate(-50%, -50%);
					border-style: solid;
					border-width: 10px 0 10px 18px;
					border-color: transparent transparent transparent #fff;
				}

				/* 滑鼠懸停在容器上時，按鈕變成 YouTube 紅 (#ff0000) */
				.live-container:hover .play-button {
					background-color: #ff0000;
				}
				




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

	/* .index_seasonal_liveBg:not(.active) .index_liveBg{
		display: none;
	} */
	.index_liveBg{
		padding-top: 0;
	}

	.index_liveBg  .index_title{
		/* position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center; */
	}

	.live-container{
	}
		.index_liveBg .wrap{
			/* max-width: 99.9%; */
			/* width: 100%; */
		}
}





@media (max-width: 990px){

	.index_liveBg .index_title {
		/* margin-bottom: clamp(1.032rem, 0.839rem + 0.97vw, 2rem); */
	}

}


@media (max-width: 768px){


}






















/*========================================================*/
/*-------首頁_年度精選節目區塊--------*/
/*========================================================*/

.index_featuredBg{

}
	.index_featuredBg .wrap{
		
	}

		.index_featured_area{
			
		}
			.index_featuredBg .index_title{
				/* display: flex;	
				flex-wrap: wrap;			
				align-items: baseline;				
				justify-content: space-between;								
				gap: .3125rem; */
				/* text-align: center; */
			}


			.featured-container{
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				gap: clamp(1.291rem, 0.001rem + 2.08vw, 2.5rem);
			}

			.index_featuredBg .featured-card{
				width: calc((100% / 4) - (3 * clamp(1.291rem, 0.001rem + 2.08vw, 2.5rem) / 4)); /* 4欄平均寬度，扣除間距 */
				display: flex;
				flex-direction: column;
			}

				.index_featuredBg .featured-card a{
					color: #FFF;
					display: flex;
					flex-direction: column;
					justify-content: center;
					text-decoration: none;
					/* padding: clamp(1.032rem, 1.67vw, 2rem); */
					flex-grow: 1;
					gap: clamp(0.774rem, 1.25vw, 1.5rem);
					transition: 0.5s ease all;
				}



					.index_featuredBg .featured-img{
						position: relative;
						/* aspect-ratio: 1;
						border-radius: 50%; */
						display: block;
						overflow: hidden;
						transition: 0.5s ease all;
						/* aspect-ratio: 451 / 253.8; */
						aspect-ratio: 3 / 2;
    					border-radius: clamp(0.774rem, 1.25vw, 1.5rem);
					}
						.index_featuredBg .featured-img 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.5s ease all;
						}



					.index_featuredBg .featured-info{												
						display: flex;												
						flex-direction: column;												
						gap: 0.1250rem;
					}

					.index_featuredBg .featured-title-tw{
						font-size: clamp(1rem, 0.867rem + 0.22vw, 1.125rem);
						font-weight: 600;
						text-align: center;
						/* font-size: 1.125rem; */
						line-height: 1.58;
					}
					.index_featuredBg .featured-title-en{
						font-weight: 600;
						text-align: center;
						font-size: 0.6250rem;
						letter-spacing: 0.1em;
					}



				.index_featuredBg .featured-card a:hover{
					color: var(--primary_color);
					transition: 0.5s ease all;
				}
				.index_featuredBg .featured-card a:hover .featured-img{
					transform: scale(1.05);
					transition: 0.5s ease all;
				}









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

	.index_featuredBg{
		/* padding-top: 0; */
	}
		.index_featuredBg .wrap{
			/* max-width: 99.9%;
			width: 100%;
			height: 100%;
			display: flex;
			flex-direction: column; */
		}

			.index_featured_area {
				/* display: flex;
				flex-direction: column;
				flex-grow: 1; */
			}

				.featured-container {
					/* border: 1px #fff solid; */
					/* display: grid;
					grid-template-columns: repeat(2, minmax(0, 1fr)); */
					/* flex-grow: 1; */
				}

				.index_featured_liveBg:not(.active) .featured-container {
					/* display: grid;
					grid-template-columns: repeat(4, minmax(0, 1fr)); */
					
				}




}

@media (max-width: 768px){

	.featured-container{
		/* column-gap: .625rem; */
	}

		.index_featuredBg .featured-card{
			/* width: 100%;  */
			width: calc((100% / 2) - (1 * clamp(1.291rem, 0.001rem + 2.08vw, 2.5rem) / 2));
		}

}

















/*========================================================*/
/*-------首頁_照片花絮區塊--------*/
/*========================================================*/

.index_galleryBg{
	    padding: 3.097rem 0;
}
	.index_galleryBg .wrap{
		
	}

		.index_gallery_area{
			
		}
			.index_galleryBg .index_title{
				display: flex;	
				flex-wrap: wrap;			
				align-items: baseline;				
				justify-content: space-between;								
				gap: .3125rem;
			}

			.index-gallery-container{

			}




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

	.index_galleryBg .photo_list {
		width: calc((100% / 5) - (4 * clamp(0.774rem, 1.25vw, 1.5rem) / 5)); /* 5欄平均寬度，扣除間距  */
		width: calc((100% / 4) - (3 * clamp(0.774rem, 1.25vw, 1.5rem) / 4));
	}


	.index_galleryBg .photo_info {
		position: absolute;
		top: 70%;
		left: 50%;
		transform: translate(-50%, -70%);
		width: 95%;
		transition: all .2s ease-in;
		opacity: 0;
	}

	.index_galleryBg .photo_list a:hover .photo_info {
		/* position: absolute; */
		top: 50%;
		/* left: 50%; */
		transform: translate(-50%, -50%);
		/* width: 95%; */
		transition: all .2s ease-in;
		opacity: 1;
	}
	.index_galleryBg .photo_list a:hover .photo_img {
		filter: grayscale(100);
		transition: all .2s ease-in;
	}

	.index_galleryBg .photo_img::after{
		display: none;
	}
}



@media (max-width: 990px){

	.index-gallery-container{
		gap:clamp(0.774rem, 1.25vw, 1.5rem);
	}
		.index_galleryBg .photo_list {
			width: calc((100% / 3) - (2 * clamp(0.774rem, 1.25vw, 1.5rem) / 3)); /* 3欄平均寬度，扣除間距  */
		}

}


@media (max-width: 768px) and (min-width: 1px){

	.index-gallery-container{
		gap:clamp(1.25rem, 1.25vw, 1.5rem);
	}
		.index_galleryBg .photo_list {
			width: calc((100% / 2) - (1 * clamp(1.25rem, 1.25vw, 1.5rem) / 2)); /* 2欄平均寬度，扣除間距  */
		}

}