/*========================================================*/
/*-------最新消息區塊--------*/
/*========================================================*/

/* 最新消息區塊 */
.news_area{
	padding: 0;
	margin: 0;
	list-style-type: none;
	/* display: flex; */
	flex-wrap: wrap;

	display: grid;
	grid-template-columns: repeat(4 , 1fr);
	transition: 0.3s ease all;
	gap: clamp(0.9678rem, 1.5625vw, 1.8750rem); /* 15.48px , 1.5625vw , 30.00px */
}




/* 最新消息列表 */
.news_list {
	color: var(--dark_color);
	/*padding: 0.9375rem;*/ /*15*/
	display: flex;
	flex-direction: column;
}
	.news_box{
		box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
		background-color: #fff;
		border-top-right-radius: clamp(1.6130rem, 2.6042vw, 3.1250rem); /* 25.81px , 2.6042vw , 50.00px */
		border-top-left-radius:clamp(0.3226rem, 0.5208vw, 0.6250rem); /* 5.16px , 0.5208vw , 10.00px */
		border-bottom-right-radius: clamp(0.3226rem, 0.5208vw, 0.6250rem); /* 5.16px , 0.5208vw , 10.00px */
		border-bottom-left-radius: clamp(1.6130rem, 2.6042vw, 3.1250rem); /* 25.81px , 2.6042vw , 50.00px */
		overflow: hidden;
		display: flex;
		flex-direction: column;
		flex-grow: 1;
	}




	/* 最新消息列表_圖 */
	.newsImg {
		text-align: center; /* 圖片置中 */
	}
		/*圖*/
		.newsImg img {
			/* box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;		 */
		}
			.newsImg a{
				position: relative;
				padding-top: 72.25%;
				display: block;
				overflow: hidden;	
				transition: 0.3s ease all;	
				background-color: #000;
			}
				.newsImg 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;
				}
				.newsImg a:hover img{
					opacity: 0.5;
					transform: scale(1.05);		
				}









/* 最新消息列表_下方資訊 */
.news_bottom {
	padding:  clamp(0.9678rem, 1.5625vw, 1.8750rem); /* 15.48px , 1.5625vw , 30.00px */
	background: var(--fourth_color);
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: clamp(0.3226rem, 0.5208vw, 0.6250rem); /* 5.16px , 0.5208vw , 10.00px */
	flex-grow: 1;
}
.news_bottom::before {
	position: absolute;
	pointer-events: none;
	content: "";
	bottom: 0;
	right: 0;
	background-image: url(../images/news_bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 99.9%;
	width: 60%;
	aspect-ratio: 267 / 175;
	z-index: 0;
}



	/* 最新消息列表_上方資訊 */
	/* .news_top {
	} */

		/* 最新消息列表_上方資訊_日期與點擊數通用樣式 */
		.news_list .date,
		.news_list .collect {
			color:inherit;
			font-size: 0.9375rem; /*15*/
			font-weight: 500;
			line-height: normal;
			font-family: var(--foreign_font);
			/* margin-bottom: 10px; */
		}

		/* 圖標通用樣式 */
		.news_list .date i, 
		.news_list .collect i {
			/*font-size: 12px;
			color: inherit;
			margin-right: 5px;*/ /* 圖標與文字間距 */
		}
		.news_list .date{
			/*color: inherit;*/
		}
		/* .news_list .collect {
			color: var(--fifth_color);
		} */




	.news_list .news_info{
		display: flex;
		flex-direction: column;
		gap: clamp(0.9678rem, 1.5625vw, 1.8750rem); /* 15.48px , 1.5625vw , 30.00px */
		position: relative;
		z-index: 3;
	}






	/* 最新消息列表_標題 */
	.news_bottom .title {
		margin: 0;
		color:inherit;
		word-break: break-word;  /*英文依照單字斷行*/
		font-size: clamp(1.1250rem, 1.0417vw, 1.2500rem); /* 18.00px , 1.0417vw , 20.00px */
		font-weight: 700;
		line-height: normal;
		letter-spacing: 2px;


		min-height: clamp(2.2500rem, 2.0833vw, 2.5000rem); /* 36.00px , 2.0833vw , 40.00px */
	}

	.news_bottom .title a {
		display: block;
		text-decoration: none; /* 移除超連結下劃線 */
		color:inherit;
		
		display: -webkit-box;
		-webkit-box-orient: vertical;	
		-webkit-line-clamp: 2;	
		overflow: hidden;

		word-break: break-word;  /*英文依照單字斷行*/
	}

	.news_bottom .title a:hover {
		color: var(--primary_color); /* 滑鼠懸停時超連結顏色 */
	}

	/* 最新消息列表_簡述 */
	.news_bottom .description {
		color: inherit;;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		word-break: break-word;  /*英文依照單字斷行*/

		font-size: clamp(1.0000rem, 0.9375vw, 1.1250rem); /* 16.00px , 0.9375vw , 18.00px */
		font-style: normal;
		font-weight: 400;
		line-height: 1.5; /* 27px */
		letter-spacing: 1.8px;
	}

	.news_bottom .more_btn{
		display: flex;
		justify-content: flex-end;
		align-items: flex-end;
		margin-top: clamp(1.1291rem, 1.8229vw, 2.1875rem); /* 18.07px , 1.8229vw , 35.00px */
		flex-grow: 1;
	}
		.news_bottom .more_btn a{
			color: var(--dark_color);
			font-size: 0.9375rem;
			font-weight: 400;
			line-height: normal;
			letter-spacing: .1406rem;
			display: flex;
			align-items: center;
			column-gap:clamp(0.3226rem, 0.5208vw, 0.6250rem); /* 5.16px , 0.5208vw , 10.00px */
			text-decoration: none;
		}
			.news_bottom .more_btn img{
				width: clamp(0.9678rem, 1.5625vw, 1.8750rem); /* 15.48px , 1.5625vw , 30.00px */
				height: auto;;
			}
			.news_bottom .more_btn a:hover{
				opacity: 0.7;
			}










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

    
}




@media (max-width: 1280px){

    .news_area{
        grid-template-columns: repeat(3 , 1fr);
        /*gap: clamp(0.9678rem, 1.5625vw, 1.8750rem); *//* 15.48px , 1.5625vw , 30.00px */
    }

}	


@media (max-width: 1100px){

}

@media (max-width: 768px){

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

}

@media (max-width: 640px){
    
    	
	.news_area{
        display: flex;
        flex-direction: column;
        grid-template-columns: unset;
		position: relative;
	}

	.news_card {
		/*padding: 0.3125rem 0.0625rem;*/ /*5 1*/
	}
	
}