
/*========================================================*/
/*-------首頁內容--------*/
/*========================================================*/









/*/////////////////////////////////////////////////////////*/
/*-------共用區塊--------*/
/*/////////////////////////////////////////////////////////*/

.indexmain{
	display: flex;
	flex-direction: column;


	/* height: 200vh; */
}
.indexmain::after{
	position: absolute;
	content: "";
	background-image: url(../images/bg.webp);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	aspect-ratio: 4.72 /  1;
	width: 100%;
	bottom: 0;
	left: 0;
	z-index: -2;
}

/*首頁內容區塊*/	
.mainContent{
	padding: 36px 0px;
	padding: 29px 0px;
	/* padding-bottom: 90px; */
	position: relative;
	overflow: hidden;
	flex-grow: 1;
	/* padding: 0; */
}

	.mainContent::before ,
	.mainContent::after{
		/* position: absolute;
		background-position: left top;
		background-repeat: no-repeat;
		background-size: cover;
		z-index: -1; */
	}
	/* .mainContent::before{		
		background-image: url(../images/bg_left.webp);		
		bottom: 0;
		left: 0;
		width: 20.4vw;
		padding-top: calc(20.4vw * 4.74);
	}
	.mainContent::after{
		background-image: url(../images/bg_right.webp);
		top: 0;
		right: 0;
		width: 35vw;
		padding-top: calc(35vw * 2.42);
	} */



	.mainContent .main_right_area{
		display: grid;
		/* grid-template-columns: 2.067fr 1fr; */
		grid-template-columns: 2.45fr 1fr;
		gap: 24px;
	}
		.mainContent .main_right_in{
			display: flex;
			flex-direction: column;
			gap: 24px;
		}
		

	.index_item{
		/* padding-top: 90px; */
	}





	/*----- 首頁標題1 -----*/
	/* .index_title {
		font-size: 2.81rem; 
		font-size: min(max(2.36vw, 1.125rem), 2.81rem); 
		line-height: 1;
		color: var(--primary_color);
		text-align: center;
		font-weight: 500;
		margin-bottom: 45px;
	}	
		.index_title strong{
			font-size: inherit;
			line-height: initial;
			padding: 0;
			margin: 0;
			display: inline-block;
			font-weight: inherit;
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 5px 24px;
		}	
		.index_title span{
			position: relative;
			font-size: inherit;
			line-height: initial;
		}
		.index_title span::before{
			position: absolute;
			content: "";
			background-color: var(--fourth_color);
			width: 1px;
			height: 65%;
			top: 50%;
			left: -12px;
			transform: translate(0%  , -50%);
		}
		.index_title span:first-of-type:before{	
			display: none;
		} */

		.index_title {
			/* display: flex;
			justify-content: center;
			align-items: center;
			gap: 10px; */
			/* margin: 0.5em 0 0.2em; */
			margin-bottom: 0.2em;
		}
			.index_title .title{
				line-height: 1.5;
                font-size: 1.1rem;
				font-size: clamp(0.875rem, 0.9167vw, 1.1rem);  /*字體 最小值 14px、大小約 0.9167vw、最大值 17.6px*/
                color: var(--sixth_color);
			}
				.index_title strong{
					font-size: inherit;
					line-height: initial;
					padding: 0;
					margin: 0;
					display: inline-block;
					font-weight: inherit;
					/* display: flex;
					align-items: center;
					justify-content: center;
					gap: 5px 24px; */
				}
				.index_title img{
					max-width: 52px;
					width: 2.7083vw;
					min-width: 25px;
					height: auto;
				}



		


				/*首頁more_按鈕---------------*/
				.more_btn{

				}
					.more_btn button {
						position: relative;
						border: none;
						/* padding: 0.7292vw 1.0417vw; */ /*14px 20px*/
						display: flex;
						justify-content: center;
						align-items: baseline;
						gap: 3px;
						background-color: var(--seventh_color);
						min-width: 70px;
						width: 3.6458vw;
						color: #fff;
						cursor: pointer;
						white-space: nowrap;
						/*font-size: 0.8125rem;*/ /*13px*/
						font-size: clamp(0.875rem, 0.8333vw, 1rem);  /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
						padding: 0 0 2px;
						height: auto; /*18.7px*/
						line-height: 1.5;
						/* aspect-ratio: 6 /  1; */
						border-radius: 100px;
					}
					.more_btn button::after {
						content:"";
						background-image: url(../images/more.svg);
						background-repeat: no-repeat;
						/* background-size: 10px; */
						background-size: clamp(.625rem, 0.5208vw, 0.625rem);  /*字體 最小值 10px、大小約 0.5208vw、最大值 10px*/
						background-position: center;
						aspect-ratio: 1.45 /  1;
						width: 0.8125rem; /*13px*/
					}
					.more_btn:hover button{
						background-color: var(--fifth_color);
						/* border-color:  var(--fifth_color); */
					}					
						/* .more_btn:hover button::after {
							padding-left: 10px;						
							transition: 0.3s ease all;
						} */


/* 1440x900 */
@media screen and (min-width: 1101px) and (max-width: 1450px) and 
(min-height: 850px) and (max-height: 1000px) {
	.more_btn button {
		min-width: 90px;
		width: 4.6875vw;
	}
}



/* @media (max-width: 1100px){
	.main {
		padding-top: 59.6px;
	}
	.main.fixed {
		padding-top: 51px;
	}
} */

		
	
@media (max-width: 1100px){
	
	.mainContent{
		/* padding:24px 0; */
		padding:0px 0 24px;
	}	

		.index_item{
			/* padding-top: 50px;
			padding-top: 25px; */
		}

			/*----- 首頁標題1 -----*/
			.index_title{
				margin-bottom: 10px;
			}


			/*首頁more_按鈕---------------*/
			.more_btn button {
				/* padding: 10px; */
			}
	

			
	.mainContent .main_right_area{
		display: flex;
		grid-template-columns: unset;
		flex-direction: column;
		/* gap: 24px; */
	}
		.mainContent .main_right_in{
			/* display: flex;
			flex-direction: column;
			gap: 24px; */
		}
		

			/*首頁more_按鈕---------------*/
			.more_btn{
				margin-top: 10px;
			}

}


/* @media (max-width: 550px){	
	
	.main {
		padding-top: 40.1px;
	}
	.main.fixed {
		padding-top: 40.1px;
	}
} */






/*========================================================*/
/*-------首頁banner--------*/
/*========================================================*/

.index_banner{

}

	.index_banner .wrap{
		
	}

		.indexmain .banner{
			background: #fff0;
			position: relative;
			/* height: 345px; */
		}

	.indexmain .banner .swiper-container_pc {
		/* background-color: #013c73; */
	}

	.indexmain .banner .banner_item{

	}
		.indexmain .banner .swiper-slide a{
			position: relative;
			
			/* border-radius: 10px; */
			display: block;
			overflow: hidden;
		}


			.indexmain .banner .pcBanner ,
			.indexmain .banner .mobileBanner {	
				padding-top: 33.9%;
				background-repeat: no-repeat;
				background-size: cover;
				background-position: center;
				width: 100%;		
			}


			.indexmain .banner .mobileBanner{
				display:none;
			}



			.banner_item_bottom{
				pointer-events: none;
				color: #fff;
				position: absolute;
				z-index: 2;
				bottom: 0;
				left: 0;
				width: 100%;
				aspect-ratio: 2.9498 / 1;
				display: flex;
				align-items: flex-end;
				/* padding: 90px 25px 20px; */
				padding: 0 25px 20px;
				transition: 0.7s ease all;
				background-image: linear-gradient(to top, #4b4137 0%, #4b4137 10%, rgb(75 65 55 / 40%) 30%, rgb(75 65 55 / 19%) 37%, #4b413700 50%, #4b413700 95%, #4b413700 100%);
			}
	
				.banner_item_in{
					display: -webkit-box;
					-webkit-box-orient: vertical;	
					-webkit-line-clamp: 3;	
					overflow: hidden;
					line-height: 1.5;
					font-size: clamp(0.875rem, 0.8333vw, 1rem);  /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
				}
				.banner_item a:hover .banner_item_bottom{
					/* opacity: 0; */
					bottom: -100%;
				}


@media (max-width: 1700px){

	.indexmain .banner .swiper-button-prev{		
		left: 2.5%;
	}
	.indexmain .banner .swiper-button-next{
		right: 2.5%;
	}

}




/* @media screen and (min-width: 1351px) {



} */

		
@media (max-width: 1400px){

	.index_banner .wrap{
		max-width: unset;
		width: 100%;	
	}

	.indexmain .banner .banner_text {
		gap:15px 0;
		bottom: 27%;
		/* right: 20%; */
		transform: translate(20%, 27%);
	}

}	





@media (max-width: 1100px){
	

	.index_banner .wrap{
		padding-bottom: 24px;	
	}

	.indexmain .banner{
		height: 100%;	
		
	}
	.indexmain .swiper-button-prev, 
	.indexmain .swiper-button-next {
		width: 30px;
		height: 30px;
		background-size: 30px;
	}

	.indexmain .banner .mobileBanner {
		display: block;		
		/* aspect-ratio: 3 / 1; */
	}
	.indexmain .banner .pcBanner {
		display: none;		
	}
	
	.indexmain .banner .swiper-slide a{
		position: relative;
		display: block;
		/* padding-top: 100%; */

		display: flex;
		flex-direction: column-reverse;
		padding: 0;
		text-decoration: none;
	}
	

		.indexmain .banner .swiper-button-prev{		
			left: 5%;
		}
		.indexmain .banner .swiper-button-next{
			right: 5%;
		}





		.banner_item_bottom{
			position: unset;
			z-index:unset;
			bottom: unset;
			left: unset;
			width: 100%;
			aspect-ratio: unset;
			padding: 10px 10px ;
			background-image:none;
			background: var(--fifth_color);
		}
			.banner_item a:hover .banner_item_bottom{
				bottom: unset;
			}


}





@media (max-width: 640px){

	.indexmain .swiper-button-prev, 
	.indexmain .swiper-button-next {
		display: none;
	}
	
}













/*========================================================*/
/*-------首頁_中心簡介_區塊--------*/
/*========================================================*/

/* 首頁_中心簡介 */
.indexAboutBg{
    background-color: #fcf4ed;
    padding: 15px;
}
	.indexAboutBg .text_area{
		/* line-height: 1.13;
		font-size: 0.8rem; */
		/*font-size: clamp(0.875rem, 0.8333vw, 1rem); */ /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
	}

	.indexAboutBg .more_btn{
		display: flex;
		justify-content: flex-end;
	}



@media (max-width: 1100px){

	.indexAboutBg{
		padding: 10px;
	}

}









/*========================================================*/
/*-------首頁_最新消息_區塊--------*/
/*========================================================*/

.indexNewsBg{
} 

/* .indexNewsArea{
} */

	.indexNewsBg .more_btn{
		display: flex;
		justify-content: flex-end;
	}

/*-----首頁最新消息區--------------------------------------*/

		.news {
			width:100%;
		}
		.news_wrap{
		    margin: 0px auto; 
		}
		.news_bar{
			display: inline-block;
			width:100%;
			margin-bottom: 0px;
		}
		.news_list{
			position: relative;
			/*padding: 1.1458vw 0px;*/ /*22px 0*/
			padding: 0;
			display: flex;
			flex-wrap: nowrap;
			align-items: baseline;
			gap: 0.8em;
			width: 100%;
			color: var(--dark_color);
			/*font-size: clamp(0.75rem, 0.6771vw, 0.8125rem);*/  /*字體 最小值 12px、大小約 0.6771vw、最大值 13px*/
			font-size: clamp(0.875rem, 0.8333vw, 1rem);  /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
			margin: 0 0 0.8em 0;
			padding-bottom: 0.8em;
			border-bottom: 0.0625em dashed var(--eighth_color);
			font-weight: 400;
		}
		.news_list:first-of-type{
			padding-top: 0px; 
		}
		.news_list_top{
			display: flex;
			align-items: center;
			gap: 0.4em;
		}
			.news_list_top .icon{
				font-size: 0.625rem; /*10px*/
			}
				.news_list_top .icon i{
					color: inherit;
					font-size: inherit;
				}

			.news_list_date{
				font-family: var(--foreign_font);
				box-sizing: border-box;
				/* min-width: 95px; */
				text-align: center;
				font-size: inherit;
				color: inherit;
				display: flex;
				gap: 5px;
				white-space: nowrap;
				margin: 0;
				font-size: 0.75rem; /*12px*/
			}

			
			.news_list_sort{
				background-color: var(--second_color);
				padding: 8px 20px;
				color:#fff;
				font-size: inherit;
				box-sizing: border-box;
				text-align:center;
				border-radius: 30px;
				display: none;
			}


			.pinned .news_list_top{
				padding-left: clamp(calc(23px + 10px), calc(2.0833vw + 10px), calc(40px + 10px));  /*字體 最小值 12px、大小約 0.9375vw、最大值 18px*/
			}
			/* .pinned .news_list_top::before {
				content: "\F4EA";
				font-family: "bootstrap-icons";
				color: #fff;
				background-color: var(--ninth_color);
				display: inline-flex;
				justify-content: center;
				align-items: center;
				max-width: 40px;
				width: 2.0833vw;
				min-width: 23px;
				aspect-ratio: 1 / 1;
				border-radius: 50%; 
				font-size: inherit;
				line-height: normal;
				position: absolute;
				left: 0;
				transition: 0.3s ease all;
				transform-origin: center center;
			} */



			.news_list_remark{
				text-align:left;
				box-sizing: border-box;
				width: 100%;
				word-wrap: break-word;
				word-break: break-all;
				transition: 0.3s ease all;
				
			}
			.news_list_remark a {
				line-height: 1.5;
				text-decoration:none;
				color: inherit;
				display: block;
				/* padding-right: 50px; */
				position: relative;
				font-size: inherit;
			}
			.news_list_remark a:hover {
				opacity:0.5;
				transition: 0.3s ease all;
			}	
				.news_list_remark .remark{
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 1;
					overflow: hidden;
					font-weight: inherit;
				}

				.round_more_btn {
					position: absolute;
					right: 0;
					top: 50%;
					transform: translateY(-50%);
					z-index: 3;
					border-radius: 50%;
					overflow: hidden;
					transition: 0.3s ease all;
					display: none;
				}

				.round_more_btn b {
					max-width: 40px;
					width: 2.0833vw;
					min-width: 23px;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: var(--primary_color);
					aspect-ratio: 1 / 1;
				}

				.round_more_btn i {
					font-size: inherit;
					color: #fff;
				}

				.news_list_remark:hover .round_more_btn {
					right: -5px;
				}
				

@media (max-width:1100px){
	.news_wrap{
		width: auto;
	}			
}


@media (max-width:640px){

.news_list {
    padding: 10px 0px;
    margin-bottom: 0;
    gap: 10px 0;
}
	/* .news_list_sort1 ,
	.news_list_sort2 {
		margin: 0;
		min-width: 100px;
	}	 */
	.news_list_remark {
		margin-top: 0;
	}
			
}

     
        






/*========================================================*/
/*-------首頁_吳守禮專區_區塊--------*/
/*========================================================*/

.indexWusoliBg{
} 

	.indexWusoli_area{
		
	}

		.indexWusoli_area a{
			position: relative;	
			display: block;
			text-decoration: none;
			color: #fff;
			overflow: hidden;
		}

		.indexWusoli_img{
			position: relative;
			padding-top: 141%;
			/* border-radius: 10px; */
			display: block;
			overflow: hidden;
		}
			.indexWusoli_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.3s ease all;
			}
			.indexWusoli_area a:hover .indexWusoli_img img{
				/* transform: scale(1.1); */
			}
	

		.indexWusoli_bottom{
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			padding: 90px 10px 20px;
			transition: 0.7s ease all;
			background-image: linear-gradient(to top, rgba(0, 0, 0, 1.0) 0%, rgba(0, 0, 0, 0.8) 50%, #00000000 100%);
		}

			.indexWusoli_in{
				display: -webkit-box;
				-webkit-box-orient: vertical;	
				-webkit-line-clamp: 3;	
				overflow: hidden;
				line-height: 1.5;
				font-size: clamp(0.875rem, 0.8333vw, 1rem);  /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
			}
			.indexWusoli_area a:hover .indexWusoli_bottom{
				/* opacity: 0; */
				bottom: -100%;
			}



/*========================================================*/
/*-------首頁_學術活動_區塊--------*/
/*========================================================*/

.indexEventBg{
} 


	.indexEventBg .more_btn{
		display: flex;
		justify-content: flex-end;
	}

/*-----首頁學術活動區--------------------------------------*/

		.event {
			width:100%;
		}
		.event_wrap{
			margin: 0px auto; 
		}
		.event_bar{
			display: inline-block;
			width:100%;
			margin-bottom: 0px;
		}
		.event_list{
			position: relative;
			/*padding: 1.1458vw 0px;*/ /*22px 0*/
			padding: 0;
			display: flex;
			flex-direction: column;
			align-items: unset;
			gap: 0.8em;
			width: 100%;
			color: var(--dark_color);
			font-size: clamp(0.75rem, 0.6771vw, 0.8125rem);  /*字體 最小值 12px、大小約 0.6771vw、最大值 13px*/
			margin: 0 0 0.8em 0;
			padding-bottom: 0.8em;
			border-bottom: 0.0625em dashed var(--eighth_color);
			font-weight: 400;
		}
		.event_list:first-of-type{
			padding-top: 0px; 
		}
		.event_list_top{
			display: flex;	
			flex-wrap: nowrap;		
			align-items: center;	
			gap: 0.8em;
			font-size: 0.625rem; /*10px*/
		}
		
			.event_list_date ,
			.event_list_sort{
				display: flex;
				align-items: center;
				color: initial;
				font-size: inherit;
				box-sizing: border-box;
				gap: 0.4em;
				color: #666666;
			}
				.event_list_date i ,
				.event_list_sort i{
					color: inherit;
					font-size: inherit;
					font-size: 0.625rem; /*10px*/
				}

			.event_list_date span ,
			.event_list_sort span{
				font-family: var(--foreign_font);
				box-sizing: border-box;
				/* min-width: 95px; */
				text-align: center;
				font-size: 0.75rem; /*12px*/
				/* font-size: clamp(0.75rem, 0.6771vw, 0.8125rem); */  /*字體 最小值 12px、大小約 0.6771vw、最大值 13px*/
				color: inherit;
				display: flex;
				gap: 5px;
				white-space: nowrap;
				margin: 0;
			}


			.pinned .event_list_top{
				padding-left: clamp(calc(23px + 10px), calc(2.0833vw + 10px), calc(40px + 10px));  /*字體 最小值 12px、大小約 0.9375vw、最大值 18px*/
			}
			.event_list_sort span{
				/*font-size: clamp(0.75rem, 0.6771vw, 0.8125rem);*/  /*字體 最小值 12px、大小約 0.6771vw、最大值 13px*/
			}





			/* .pinned .event_list_top::before {
				content: "\F4EA";
				font-family: "bootstrap-icons";
				color: #fff;
				background-color: var(--ninth_color);
				display: inline-flex;
				justify-content: center;
				align-items: center;
				max-width: 40px;
				width: 2.0833vw;
				min-width: 23px;
				aspect-ratio: 1 / 1;
				border-radius: 50%; 
				font-size: inherit;
				line-height: normal;
				position: absolute;
				left: 0;
				transition: 0.3s ease all;
				transform-origin: center center;
			} */



			.event_list_remark{
				text-align:left;
				box-sizing: border-box;
				width: 100%;
				word-wrap: break-word;
				word-break: break-all;
				transition: 0.3s ease all;
			}
			.event_list_remark a {
				line-height: 1.5;
				text-decoration:none;
				color: inherit;
				display: block;
				/* padding-right: 50px; */
				position: relative;
				font-size: inherit;
			}
			.event_list_remark a:hover {
				opacity:0.5;
				transition: 0.3s ease all;
			}	
				.event_list_remark .remark{
					line-height: 1.3;
					/* font-size: 1.2rem; */
					/*font-size: clamp(0.9375rem, 19.2px, 1.2rem);*/  /*字體 最小值 15px、大小約 1vw、最大值 19.2px*/
					font-size: clamp(0.875rem, 0.8333vw, 1rem);  /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 3;
					overflow: hidden;
					font-weight: inherit;
				}

				/* .round_more_btn {
					position: absolute;
					right: 0;
					top: 50%;
					transform: translateY(-50%);
					z-index: 3;
					border-radius: 50%;
					overflow: hidden;
					transition: 0.3s ease all;
					display: none;
				} */

				/* .round_more_btn b {
					max-width: 40px;
					width: 2.0833vw;
					min-width: 23px;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: var(--primary_color);
					aspect-ratio: 1 / 1;
				}

				.round_more_btn i {
					font-size: inherit;
					color: #fff;
				}

				.event_list_remark:hover .round_more_btn {
					right: -5px;
				} */
				

@media (max-width:1100px){
	.event_wrap{
		width: auto;
	}			
}


@media (max-width:640px){

.event_list {
	padding: 10px 0px;
	margin-bottom: 0;
	gap: 10px 0;
}
	/* .event_list_sort1 ,
	.event_list_sort2 {
		margin: 0;
		min-width: 100px;
	}	 */
	.event_list_remark {
		margin-top: 0;
	}
			
}

		


















/*========================================================*/
/*-------首頁_活動花絮_區塊--------*/
/*========================================================*/

.indexAlbumBg{

}
	ul.indexAlbum_area{
		margin: 0;
		padding: 0;
		list-style-type : none;
		display: flex;
		flex-wrap: wrap;
		margin: 0 -10px;
		gap: 10px 0;
	}
		ul.indexAlbum_area li{
			margin: 0;
			padding: 0;
			list-style-type : none;
			display: block;
			box-sizing: border-box;
			width: 50%;
			padding: 0 10px;
		}
			ul.indexAlbum_area li a{
				position: relative;
				/* padding-top: 100%; */
				padding-top: 56%;
				display: block;
				overflow: hidden;
				
			}
				ul.indexAlbum_area li 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: 1100px){

	ul.indexAlbum_area{
		margin: 0 -5px;
		gap: 10px 0;
	}
		ul.indexAlbum_area li{
			padding: 0 5px;
		}
}

