
/*========================================================*/
/*-------首頁內容--------*/
/*========================================================*/









/*/////////////////////////////////////////////////////////*/
/*-------共用區塊--------*/
/*/////////////////////////////////////////////////////////*/

.indexmain{
	display: flex;
	flex-direction: column;
}

/*首頁內容區塊*/	
.mainContent{
	/* padding: 50px 0px; */
	padding-bottom: 90px;
	position: relative;
	overflow: hidden;
	flex-grow: 1;
	padding: 0;
}

	.mainContent::before ,
	.mainContent::after{
		position: absolute;
		/* content: ""; */
		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);
	}






	.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(--seventh_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-bottom: 1.5625rem; /*25*/
			gap: 0.625rem;   
		}
			.index_title .title{
				color: var(--dark_color);
				border-bottom: none;
				/*font-size: clamp(1.25rem, 1.25vw, 1.5rem);*/  /*字體 最小值 20px、大小約 1.25vw、最大值 24px*/
				font-size: clamp(1.25rem,2.5vw,3rem); /*20 - 48*/
				font-weight: 700;
				line-height: normal;
				letter-spacing: 16.8px;

				display: flex;
				flex-direction: column;
				gap: 0.625rem;   
			}
			.index_title .title .en{
				position: relative;
				font-size: clamp(1rem,1.6667vw,2rem);
				font-weight: 700;
				color: #606060;
				letter-spacing: 3.2px;
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 5px;
				font-family: var(--foreign_font);
			}
			.index_title .title .en .title_deco_left{
				content: "";
				width: 3.125rem;
				height: 1px;
				background-color: #000;
				
				
			}
			.index_title .title .en .title_deco_right{
				content: "";
				width: 3.125rem;
				height: 1px;
				background-color: #000;
				
			}
			.index_title.title_right .title{
				text-align: right;
				color: #000;
			}
			
				.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 strong span{
					color: var(--second_color);
				}
				.index_title img{
					width: 100%;
					height: auto;
				}



		


				/*首頁more_按鈕---------------*/
				.more_btn{
					margin-left: auto;
				}
					.more_btn button {
						position: relative;
						border-radius: 0;
						border: 1px solid var(--second_color);
						
						padding: 0.7292vw 0; /*14px 20px*/
						display: flex;
						justify-content: center;
						align-items: center;
						gap: 10px;
						background-color: transparent;
						background-color: var(--second_color);
						max-width: 175px;
						width:9.1146vw;
						min-width: 135px;
						font-size: clamp(.8125rem, 0.8333vw, 1rem);  /*字體 最小值 13px、大小約 0.8333vw、最大值 16px*/
						line-height: normal;
						height: auto;
						color: #fff;
						cursor: pointer;

						white-space: nowrap;
						font-family: var(--foreign_font);
						
					}
					.more_btn button::after {
						/* content:"\2192"; */
						content:"\F138";
						/* width:20px;
						height:20px; */
						font-family: "bootstrap-icons";
						font-size: 20px;
					}
					.more_btn:hover button{
						opacity: 0.7;
						transition: all 0.3s ease;
					}					
						.more_btn:hover button::after {
							padding-left: 10px;						
							transition: 0.3s ease all;
						}







/* @media (max-width: 1100px){
	.main {
		padding-top: 59.6px;
	}
	.main.fixed {
		padding-top: 51px;
	}
} */

		
	
@media (max-width: 1100px){
	
	.mainContent{
		padding: 0;
	}	

		.index_item{
			padding-top: 50px;
			padding-top: 25px;
		}

			/*----- 首頁標題1 -----*/
			.index_title{
				margin-bottom: 12.5px;
			}


			/*首頁more_按鈕---------------*/
			.more_btn button {
				padding: 10px;
			}
	

}


/* @media (max-width: 550px){	
	
	.main {
		padding-top: 40.1px;
	}
	.main.fixed {
		padding-top: 40.1px;
	}
} */






/*========================================================*/
/*-------首頁banner--------*/
/*========================================================*/


.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 {	
				padding-top: 30.65%;
				background-repeat: no-repeat;
				background-size: cover;
				background-position: center;
				width: 100%;		
			}


			.indexmain .banner .mobileBanner{
				display:none;
			}



			.indexmain .banner .banner_text {
				position: absolute;
				display: flex;
				flex-direction: column;
				gap:25px 0;
				width: 38.5417vw;
				min-width: 520px;
				max-width: 740px;
				
				z-index: 10;
				top: 50%;
				right: unset;
				left: 10%;
				
				transform: translate(0, -50%);
				background: rgba(255, 255, 255, 0.70);
				backdrop-filter: blur(12.5px);
				padding: 40px 50px;
				padding: clamp(1.25rem,2.0833vw,2.5rem);
				border-left:10px solid var(--second_color);
			}
				.indexmain .banner .banner_text strong{
					
					font-size: clamp(1.125rem,1.9271vw,2.3125rem);
					font-weight: 700;
					color: #333;
					line-height: normal;

					display: -webkit-box;
					-webkit-box-orient: vertical;	
					-webkit-line-clamp: 2;	
					overflow: hidden;
					word-wrap: break-word;
				}
				.indexmain .banner .banner_text p.text{
					/* font-size: 1rem; */
					font-size: clamp(.8125rem, 0.8333vw, 1rem);  /*字體 最小值 13px、大小約 0.8333vw、最大值 16px*/
					font-size: clamp(1rem,1.25vw,1.5rem);
					color: var(--dark_color);
					line-height: 2.25rem;
					font-weight: 500;
					display: -webkit-box;
					-webkit-box-orient: vertical;	
					-webkit-line-clamp: 2;	
					overflow: hidden;
				}

				.indexmain .banner .more_btn button {
					background-color: var(--second_color);
				}








					.indexmain .banner .swiper-button-prev ,
					.indexmain .banner .swiper-button-next{
						opacity: 0;
						transition: 0.3s ease all;
					}
					.indexmain .banner .swiper-button-prev{		
						left: calc((100vw - 13px - 1800px) / 2);						
					}
					.indexmain .banner .swiper-button-next{
						right: calc((100vw - 13px - 1800px) / 2);
					}
					.indexmain .banner:hover  .swiper-button-prev ,
					.indexmain .banner:hover  .swiper-button-next{
						opacity: 1;
					}



	/* .banner_decorate{
	}
		.banner_decorate img{
			width: 100%;
			height: auto;
		} */





@media (max-width: 1700px){

	.indexmain .banner .swiper-button-prev{		
		left: 2.5%;
	}
	.indexmain .banner .swiper-button-next{
		right: 2.5%;
	}

}



		
@media (max-width: 1350px){

	.indexmain .banner .banner_text {
		gap:15px 0;
		/* bottom: 27%; */
		/* right: 20%; */
		/* transform: translate(20%, 27%); */
	}

}	

@media (max-width: 1100px){
	
	.indexmain .banner{
		height: 100%;	
		
	}
	.indexmain .swiper-button-prev, 
	.indexmain .swiper-button-next {
		width: 30px;
		height: 30px;
		background-size: 30px;
	}

	.indexmain .banner .mobileBanner {
		display: block;		
	}
	.indexmain .banner .pcBanner {
		display: none;		
	}
	
	.indexmain .banner .swiper-slide a{
		position: relative;
		display: block;
		padding-top: 100%;
	}
	.indexmain .banner .swiper-slide .mobileBanner{
		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;
	}
	.indexmain .banner .banner_text {
		position: absolute;
		display: flex;
		flex-direction: column;
		gap: 15px 0;
		max-width:483px;
		width: 90%;
		min-width: unset;
		max-width: 900px;
		z-index: 10;
		top: 50%;
		bottom: unset;
		left: 50%;
		right: unset;
		transform: translate(-50%, -50%);
	}

		.indexmain .banner .banner_text strong{
			font-size: clamp(1.125rem, 0.9375vw, 1.25rem);  /*字體 最小值 18px、大小約 0.9375vw、最大值 20px*/
		}
		.indexmain .banner .banner_text p.text{
			font-size: clamp(1rem, 0.9375vw, 1.125rem);  /*字體 最小值 16px、大小約 0.9375vw、最大值 18px*/
			line-height: 1.5;
		}




		.indexmain .banner .swiper-button-prev{		
			left: 5%;
		}
		.indexmain .banner .swiper-button-next{
			right: 5%;
		}





}





@media (max-width: 640px){

	.indexmain .swiper-button-prev, 
	.indexmain .swiper-button-next {
		display: none;
	}
	
}





/*============================================================*/
/*-------首頁最新消息區--------*/
/*============================================================*/

.indexNewsBg{
	padding: clamp(2.5625rem,4.2708vw,5.125rem) 0;
	position: relative;
}
.indexNewsBg::before{
	content: "";
	background-image: url(../images/color_blocks.webp);
	background-size: clamp(18.875rem,31.4583vw,37.75rem);
	background-position: center left;
	background-repeat: no-repeat;
	aspect-ratio: 1 / 1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	z-index: -1;

	
}
.indexNewsBg:after{
	content: "";
	background-image: url(../images/color_blocks.webp);
	background-size: clamp(8.5rem,14.1667vw,17rem);
	background-position: top right;
	background-repeat: no-repeat;
	aspect-ratio: 1 / 1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: -1;

	
}
	.indexNewsBg .wrap{
		max-width: clamp(39.0625rem,65.1042vw,78.125rem);
	}
	.indexNewsBg .wrap .p_tab_text_area{
		background-color: transparent;
	}
	
		.indexNewsBg .index_title {
			text-align: center;
			justify-content: center;
		}



		.indexNewsBg .more_btn{
			margin: 0 auto;
			margin-top: clamp(1.2904rem, 2.0833vw, 2.5000rem); /* 20.65px , 2.0833vw , 40.00px */
		}
			.indexNewsBg .more_btn button{
				margin: 0 auto;
				border-color: var(--seventh_color);
				border: 2px solid var(--six_color);
				border-radius: 10px;
				color: var(--six_color);
				background-color: #fff;
			}




	.indexNewsBg .p_tab_text_area {
		padding:0px;
		width: 100%;
	}

	.indexNewsBg .tab_area {
		margin-top: 1.25rem;
		border-bottom: none;
		
		font-size: clamp(1rem, 0.93vw, 1.125rem);	
	}



	.indexNewsBg .tabs{
		
	}


	.indexNewsBg .tabs a, 
	.indexNewsBg .tabs li{
		background: none;
		color: var(--fourth_color);
		font-size: inherit;
		font-weight: 400;
		border-right: 1px solid #A72126;
		letter-spacing: clamp(0rem, .1563vw, .1875rem); /*3 - 0px*/;
		padding: 0  clamp(.9375rem, 1.5625vw, 1.875rem); /* 23.23px , 2.3438vw , 45.00px */
	}
	
	.indexNewsBg .tabs li:last-of-type{
		
		border-right:none;
	}

	.indexNewsBg .tabs li span {
		padding: 0;
		font-size: clamp(1rem, 1.0417vw, 1.25rem); /* 16px , 1.0417vw , 20px */
		font-weight: 400;
		line-height: normal;
		letter-spacing: 3px;
		color: var(--fifth_color);
	}
	.indexNewsBg .tabs li.active span {
		color: var(--fifth_color);
		font-weight: 700;
		box-shadow: none;		
	}
	.indexNewsBg .tabs li span:hover {
		box-shadow: 0 0 #3d3d3d inset;
		box-shadow:none;
	}
	.indexNewsBg .tabs li a:hover, 
	.indexNewsBg .tabs li span:hover {
		
		/* color: #fff; */
		opacity: 0.5;
		font-size:1.25rem; /*20px*/
		
	}
		.news_content_area{
			display: flex;
			align-items: flex-start;
			flex-wrap: wrap;
			margin-top: 1.5625rem;
			/* gap: 25px; */
			/* display: grid; */
			/* grid-template-columns: 1fr minmax(auto , 475px); */
		}
		
		


@media(max-width:1100px){

	.news_content_area{
		display: flex;
		flex-direction: column;
		
	}
	
}




@media (max-width:990px){
	
}


/* 在螢幕寬度大於761時，套用這裡的特定樣式 */
@media screen and (min-width: 761px) {

	.indexNewsBg .tabs{
		display: flex;
    	justify-content: flex-start;
	}

}

@media (max-width:760px){

	.indexNewsBg .tab_area {
		margin-top: 10px;
	}		
		.indexNewsBg .tabs a, .indexNewsBg .tabs li {
			border-right: none;
		}

		.indexNewsBg .tabs li {
			padding: 10px 0;
		}
		       


}













/*============================================================*/
/*-------首頁最新消息區_列表--------*/
/*============================================================*/



	.index_news_area{
		display: grid;
		grid-template-columns: repeat(4 , 1fr);
		
		display: flex;
		flex-direction: column;

	}


		/* 首頁最新消息列表 */
		.index_news_area .news_list{
			box-sizing: border-box;
			padding: clamp(.9375rem,1.5625vw,1.875rem) 0;
			border-top: 1px dashed var(--fifth_color);
		}
		.index_news_area .news_box{
			position: relative;
			/* overflow: hidden; */
			/* border: 1px #f0f0f000 solid; */
			display: grid;
			grid-template-columns: clamp(4.375rem,7.3438vw,8.8125rem) clamp(4.6875rem,7.8125vw,9.375rem) clamp(28.4375rem,47.3958vw,56.875rem);
			align-items: center;
			gap: .625rem;
			
		}
		.index_news_area .news_box:hover{
			opacity: 0.7;
			transition: all 0.3s ease;
			cursor: pointer;
			
		}



        /* 首頁最新消息圖片 */
		.index_news_area .news_Img{
		    padding-bottom: 77%;
		}
		.index_news_area .news_Img span{
		   overflow: hidden;
		   background-color: #000;
		   position: relative;
		   padding-top: 57.85%;
		   display:block;
		}
			.index_news_area .news_Img img{
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				float: none;
				/* border-radius: 50%; */
				width: 100% !important;
				height: 100% !important;
				object-fit: cover;
				transition: 0.3s ease all;
			}


        /* 首頁最新消息下方文字區塊 */
		.index_news_area .news_bottom{
			/* background-color: #f0f0f0;*/
			background-color: #fff;
			position: absolute;
			bottom: 0px;
			left: 0;
			width: 100%;
			/* height: 135px; */
			transition:height 0.5s;		
		}
		.index_news_area .news_bottom_box{
			/* padding: 15px 25px 50px; */
			padding: 0  clamp(0.9375rem, 1.3021vw, 1.5625rem); /* 15.00px , 1.3021vw , 25.00px */
			padding-top: clamp(0.5625rem, 0.7813vw, 0.9375rem); /* 9.00px , 0.7813vw , 15.00px */
			padding-bottom: clamp(1.8750rem, 2.6042vw, 3.1250rem); /* 30.00px , 2.6042vw , 50.00px */
			background-color: var(--second_color);
			display: flex;
			flex-direction: column;
			height: 100%;
		}
			.index_news_area .news_bottom a{
				display: block;
				width: 100%;
    			height: 100%;
				text-decoration: none;
			}
				.index_news_area .news_Tag{
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 40px;
					background: var(--six_color);
					font-size: clamp(.75rem,1.25vw,1.5rem);
					letter-spacing: 2.4px;
					padding: clamp(.3125rem,0.5208vw,.625rem) clamp(.4375rem,0.7813vw,.9375rem);
					line-height: 1;
					color: #fff;
				}
				.index_news_area .news_date{
					font-family: var(--foreign_font);
					font-size: clamp(.75rem,1.25vw,1.5rem);
					line-height: 1;
					text-align: center;
					position: relative;
					color: var(--fifth_color);
				}
				.index_news_area .news_date:after{
					content: "/";
					position: absolute;
					height: 1px;
					font-family: var(--foreign_font);
					font-size: clamp(.75rem,1.25vw,1.5rem);
					color: #000;
					padding-left: 8px;
					
				}
				
				

				.index_news_area .news_list .date_category{
					color: #ffffff;
					display: inline-flex;
					gap: .3125rem;
					flex-wrap: wrap;
					align-items: center;
				}
					.index_news_area .news_list .date_category .date{
						color: inherit;
						font-family: var(--foreign_font);
						font-size: clamp(0.8750rem, 0.9375vw, 1.1250rem); /* 14.00px , 0.9375vw , 18.00px */
						font-weight: 500;
						line-height: normal;
					}
					.index_news_area .news_list .date_category .category{
						color: #000;
						font-size: 1rem;
						font-weight: 500;
						line-height: 1;
						background-color: var(--third_color);
						padding: .4375rem;
					}






				.index_news_area .news_title{
					font-size: clamp(.75rem,1.25vw,1.5rem);
					line-height: 1.5;
					position: relative;
					color: #000;
					max-width: 56.875rem;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 1;
					overflow: hidden;
					
					padding-left: 0.625rem;
				}
				



				
					


				.index_news_area .news_button{
					margin-top: .625rem;
					color: #fff;
					display: flex;
					align-items: center;
					justify-content: flex-end;
					gap: .3125rem;
				}
					.index_news_area .news_button strong{
						color: #FFF;
						font-size: clamp(1.1250rem, 1.0417vw, 1.2500rem); /* 18.00px , 1.0417vw , 20.00px */
						font-weight: 400;
						line-height: normal;
						letter-spacing: .1875rem;
					}
					.index_news_area .news_button img{
						width: clamp(1.1250rem, 1.0417vw, 1.2500rem); /* 18.00px , 1.0417vw , 20.00px */
						height: auto;
					}



					
/* 在螢幕寬度大於1101時，套用這裡的特定樣式 */
@media screen and (min-width: 1101px) {

	/* 首頁最新消息hover效果 */
	/* .index_news_area .news_list:hover */
	.index_news_area .news_list.show{
		overflow: hidden;
	}
	/*.index_news_area .news_list:hover .news_box {
		border: 1px #f0f0f0 solid; 
		box-shadow: 0 18px 40px #33333300;
	}
	 .index_news_area .news_list:hover  .news_description{
		opacity:1;
		transition:2s ease all;								
	}	 */

	/* .index_news_area .news_list:hover  .news_Tag */
	.index_news_area .news_list.show .news_Tag{
		opacity: 0;
		transition:0.1s ease all;
	}
	
	/* .index_news_area .news_list:hover .news_bottom */
	.index_news_area .news_list.show .news_bottom {
		z-index: 9;
		height: 100%;
		transition:height 0.5s;		
	}

	
	
	/* .index_news_area .news_list:hover .news_description p */
	.index_news_area .news_list.show .news_description p{	
		max-height: 100%; 
		transition:max-height 0.1s;		
	}	


}



@media (max-width: 1280px){
	.index_news_area .news_box{
		
		display: block;
	}
	.index_news_area .news_Tag{
		display: inline-block;
	}
	.index_news_area .news_date{
		display: inline-block;
	}
	.index_news_area .news_date:after{
		display: none;
	}

	
	.index_news_area .news_title{					
		padding-left: 0rem;
	}
	
	
}
/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */ 
@media screen and (min-width: 991px) and (min-height: 500px) and 
(max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.5) and 
(-webkit-max-device-pixel-ratio: 1.74), only screen and (min-resolution: 150dpi) and 
(max-resolution: 174dpi) { 

		.index_news_area .news_box{
			position: relative;
			/* overflow: hidden; */
			/* border: 1px #f0f0f000 solid; */
			display: grid;
			grid-template-columns: clamp(4.375rem,7.3438vw,8.8125rem) clamp(4.6875rem,7.8125vw,9.375rem) clamp(28.4375rem,47.3958vw,56.875rem);
			align-items: center;
			gap: .625rem;
			
		}
}



@media (max-width: 1100px){
	
	.index_news_area{
		grid-template-columns: repeat(2 , 1fr);
	}
		.index_news_area .news_Img {
			padding-bottom: 49.5%;
		}
}






@media (max-width: 640px){

	
}





/* =============================== */
/* 新聞講座 */
/* =============================== */
.indexPublicBg{
	
	padding: 15% 0 0;
	position: relative;
}
.decoration_line{
	position: absolute;
    content: "";
    background-image: url(../index/images/decorate_line.webp);
    background-position: top;
	background-size: 100%;
	background-repeat: no-repeat;
    left: 0;
    top: 0;
	transform: rotate(-2.453deg);
    aspect-ratio: 2045 / 494;
    width: 100%;
    z-index: -1;

}
.indexPublicBg::before{
	content: "";
	background-image: url(../images/color_blocks.webp);
	background-size: clamp(8.5rem,14.1667vw,17rem);
	background-position: bottom left;
	background-repeat: no-repeat;
	aspect-ratio: 1 / 1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 30%;
	right: -10%;
	transform: translateY(-50%);
	z-index: -1;
}
.indexPublicBg:after{
	content: "";
	background-image: url(../images/color_blocks.webp);
	background-size: clamp(18.875rem,31.4583vw,37.75rem);
	background-position: center right;
	background-repeat: no-repeat;
	aspect-ratio: 1 / 1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: -1;

	
}

	.indexPublicBg .wrap{
		max-width: clamp(39.0625rem,65.1042vw,78.125rem);
	}
	.indexPublicBg .wrap .public_swiper{
		width: 75%;
	}
	.indexPublicBg .index_title{
		
	}
	.indexPublicBg .index_title strong{
		color: #fff;
	}
	.indexPublicBg .wrap .index_Public_area{
		/* max-width: 86.5625rem; */
		padding-left: var(--header_wrap_pc);
		
	}
		.indexPublicBg .wrap .indexPublicArea{
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: clamp(.9375rem,1.5625vw,1.875rem);
			flex-wrap: wrap;

		}
	.indexPublicBg .wrap .indexPublicArea .public_img{
		max-width: clamp(30rem,50vw,60rem);
		width: 100%;
	}
	.indexPublicBg .wrap .indexPublicArea .public_img a{
		display: block;
		position: relative;
		padding-top: 48.95%;
	}
	.indexPublicBg .wrap .indexPublicArea .public_img a img{
		width:100%;
		height:auto;
		transition: all 0.3s ease-out;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		float: none;
		width: 100% !important;
		height: 100% !important;
		object-fit: cover;
		transition: all 0.3s ease-out;

	}


	

@media (max-width: 1620px){
	.indexPublicBg .wrap .indexPublicArea{
		flex-direction: column-reverse;
		align-items: flex-start;

	}
	.indexPublicBg .wrap .public_swiper{
		width: 100%;
	}
	.indexPublicBg .wrap .indexPublicArea .public_img{
		max-width: unset;
		width: 100%;
	}
}


/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */ 
@media screen and (min-width: 991px) and (min-height: 500px) and 
(max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.5) and 
(-webkit-max-device-pixel-ratio: 1.74), only screen and (min-resolution: 150dpi) and 
(max-resolution: 174dpi) { 
	.indexPublicBg .wrap .indexPublicArea{
		flex-wrap: nowrap;

	}

	.indexPublicBg .wrap .public_swiper{
		width: 70%;
	}
	.indexPublicBg .wrap .indexPublicArea .public_img{
		max-width: clamp(30rem,50vw,60rem);
		width: 100%;
	}
}



@media screen and (min-width: 1101px) {

	.indexPublicBg .wrap{
		display: block;
		margin: 0;
		/* margin-left: auto; */
		/* width: 100%; */
		
		max-width: clamp(39.0625rem,65.1042vw,78.125rem);
		width: 100%;
		margin: 0 auto;
	}


}


@media (max-width: 1100px){
	.indexPublicBg .wrap .index_Public_area{
		/* max-width: 86.5625rem; */
		padding-left: unset;
		
	}
	
}






























/*============================================================*/
/*-------首頁_關於辦公室區塊--------*/
/*============================================================*/

.indexAboutBg{
	
	padding: 30% 0 0;
		
	position: relative;
		
	padding: 0;
		
	padding-top: 13%;
		
	padding-bottom: 15%;
}
.indexAboutBg:before{
	content: "";
	background-image: url(../index/images/bg2.webp);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
	aspect-ratio: 1933 / 900;
	aspect-ratio: 1000 / 507;
	/* padding-right: 77.3px; */
	transform: unset;
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	z-index: -1;
}
.indexAboutBg .index_title .title .en{
	position: relative;
	font-size: clamp(1rem,1.6667vw,2rem);
	font-weight: 700;
	color: #606060;
	letter-spacing: 3.2px;
	display: flex;
	align-items: center;
	justify-content:flex-start;
	gap: 5px;


}
.indexaboutArea{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: clamp(.9375rem,1.5625vw,1.875rem);
}
.indexaboutArea .about_left,
.indexaboutArea .about_right{
	width: 50%;
}

.indexaboutArea .about_content{
	letter-spacing: 4.8px;
	color: #fff;
    color: var(--dark_color);
	font-weight: 500;
	line-height: 1.5;
	font-size: clamp(1rem,1.25vw,1.5rem);
	margin-bottom: clamp(1.375rem,2.2917vw,2.75rem);

	display: -webkit-box;
	-webkit-line-clamp: 6;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;

	/* text-shadow: 1px 1px 14px rgba(66 5 119 / 50%), 1px 1px 3px rgba(66 5 119 / 50%), 1px 2px 4px rgba(66 5 119 / 50%), 1px -2px 4px rgba(66 5 119 / 20%); */
}

.indexaboutArea .about_right .about_img{
	max-width: clamp(19.25rem,32.1354vw,38.5625rem);
	width: 100%;
}
.indexaboutArea .about_right .about_img a{
	position: relative;
	display: block;
	padding-top: 55.2%;
}
.indexaboutArea .about_right .about_img a img{
	width:100%;
	height:auto;
	transition: all 0.3s ease-out;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	float: none;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	transition: all 0.3s ease-out;
}
.indexaboutArea .more_btn{
	
    
}
.indexaboutArea .more_btn button{
	
border-color: #fff;
	
border: 2px solid #8520F7;
	
border-radius: 10px;
	
color: #8520F7;
	
background-color: #fff;
	
border: none;
	
color: var(--seventh_color);
}







@media (max-width: 1280px){

	.indexAboutBg:before {
		top: 45%;
		transform: translateY(-49%);
	}

}

@media (max-width: 1100px){

	.indexAboutBg:before {
		top: 41%;
        transform: translateY(-48%);
	}

}

@media (max-width: 990px){
	.indexAboutBg{

	padding-bottom: 5%;
}
	/*----- 首頁標題1 -----*/
	.indexAboutBg .index_title{
		margin-bottom: 5%;
	}

	.indexaboutArea .about_content {
    color: #000;
		text-shadow:none;
}
	.indexAboutBg:before{
	content: "";
	background-image: url(../images/color_blocks.webp);
	background-size: clamp(18.875rem,31.4583vw,37.75rem);
	background-position: center right;
	background-repeat: no-repeat;
	aspect-ratio: 1 / 1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: -1;
	transform: translateY(0%);
	}
}


@media (max-width: 768px){
	.indexaboutArea{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.indexaboutArea .about_left,
	.indexaboutArea .about_right{
		width: 100%;
	}
	.indexaboutArea .about_right .about_img{
		max-width: unset;
		width: 100%;
	}



}



@media (max-width: 640px){
	.indexAboutBg{

		padding-bottom: 10%;
	}
}



















/*============================================================*/
/*-------首頁_快速連結區塊--------*/
/*============================================================*/

.indexLinkBg{
	
	
	padding: 0;
	padding-top: clamp(1.25rem,4.2708vw,5.125rem) ;
	padding-bottom: clamp(1.25rem, 2.6042vw, 3.1250rem); /* 25.81px , 2.6042vw , 50.00px */
	position: relative;
}
.indexLinkBg::before{
	position: absolute;
	content: "";
	background-color: transparent;
	background-image: url(../index/images/bg_quick_links.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: bottom;
	width: 100%;
	height: 100%;
	bottom: -2px;
	left: 0;
	z-index: 0;
}

	
		.indexLink_area{			
			position: relative;						
			z-index: 5;						
			padding-bottom: clamp(1.6130rem, 2.6042vw, 3.1250rem); /* 25.81px , 2.6042vw , 50.00px */
		}
		.indexLink_area ul{			
			padding-left: 0;
			list-style-type: none;
			display: grid;
			grid-template-columns: repeat(3,1fr);
			gap: clamp(.75rem,1.3021vw,1.5625rem);
		}
		.indexLink_area ul li{			
			
		}
		.indexLink_area ul li a{			
			display: block;
		}
		.indexLink_area ul li a .link_area{			
			position: relative;
		}
		.indexLink_area ul li a .link_area .link_img{			
			max-width: clamp(12.5625rem,20.9375vw,25.125rem);
		}
		.indexLink_area ul li a .link_area .link_img span {			
			position: relative;
			display: block;
			padding-top: 113.9%;
		}
		.indexLink_area ul li a .link_area .link_img span img{			
			width:100%;
			height:auto;
			transition: all 0.3s ease-out;
			position: absolute;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			float: none;
			width: 100% !important;
			height: 100% !important;
			object-fit: cover;
			transition: all 0.3s ease-out;
		}
		.indexLink_area ul li a .link_area .link_title{			
			position: absolute;
			bottom: 0;
			font-size: clamp(1.25rem,2.0833vw,2.5rem);
			font-weight: 700;
			color: #fff;
			letter-spacing: 4px;
			line-height: 1;
			text-align: center;
			width: 100%;
			padding: clamp(1.0625rem,1.8229vw,2.1875rem) 0;
			background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 43.67%, #000 85.59%);
			font-family: "Noto Sans TC",serif;
		}


@media (max-width: 640px){
	.indexLink_area ul{	

		
		grid-template-columns: repeat(1,1fr);
		margin: 0 auto;
		
	}
	.indexLink_area ul li a .link_area .link_img{			
			max-width: unset;
		}
}
























