/*====================================================*/
/*-------首頁--------*/
/*====================================================*/

.indexMain{
	position: relative;
}


/*首頁內容區塊*/	
.mainContent{
	
	padding: clamp(1.1291rem, 1.8229vw, 2.1875rem) 0 0; /* 最小值 18.07px、大小約 1.8229vw、最大值 35.00px */
	/* background-color: #222; */
}

/* 首頁各區域 */
.indexitem{
	/* padding: 80px 0 0; */
	padding: 0;
	padding-top: lamp(2.5807rem, 4.1667vw, 5.0000rem); /* 最小值 41.29px、大小約 4.1667vw、最大值 80.00px */
	overflow: hidden;
}

/* 首頁標題 ------------------*/
.index_tit{
	padding-bottom: clamp(1.1291rem, 1.8229vw, 2.1875rem); /* 最小值 18.07px、大小約 1.8229vw、最大值 35.00px */
	font-size: clamp(1.2500rem, 1.7708vw, 2.1250rem); /* 字體 最小值 20.00px、大小約 1.7708vw、最大值 34.00px */
	line-height: 1.1;
	color: var(--primary_color);
	text-align: center;
	letter-spacing: 6px;
}
	.index_tit h2{
		padding: 0;
		margin: 0;
		font-size: inherit;
		line-height: inherit;
		display: inline-block;
		position: relative;
		z-index: 2;
	}
	.index_tit h2.en{
		display: block;
		padding: 0;
		margin: 0;
		font-size: clamp(.875rem,1.3021vw,1.5625rem);
		line-height: inherit;
		position: relative;
		z-index: 2;
		color: #bdbdbd;
		margin-top: 5px;
		letter-spacing: 4px;
		font-family: var(--foreign_foreign);
	}
	.index_tit h2:before{
		position: absolute;
		content: "";
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		bottom: -100px;
		left: -68px;
		width: 100px;
		padding: 50% 0;
		z-index: -1;
		opacity: 0;
	}



	
/* 首頁標題2 ------------------*/
.index_tit2{
	/* padding-bottom: 35px; */
	font-size: 20px;
	line-height: 1.1;
	color: #66CCCC;
	font-family: 'Noto Serif TC', serif;
	text-align: center;
	letter-spacing: 6px;
}
	.index_tit2 h2{
		padding: 0;
		margin: 0;
		font-size: inherit;
		line-height: inherit;
		display: inline-block;
		position: relative;
		z-index: 2;
		/* border-bottom: 1px #999999 solid; */
	}

	


@media (max-width: 990px){
	
	.main {
		/* padding-top: 69px; */
	}	
	.indexMain::before {
		display: none;
	}

	.indexitem{
		/* padding: 30px 0 0; */
	}

	/* 首頁標題 ------------------*/
	.index_tit{
		/* padding-bottom: 20px;
		font-size: 30px; */
		letter-spacing: 3px;
	}


}



@media (max-width: 768px){
	
	/* 首頁標題2 ------------------*/
	.index_tit2{
		text-align: center;
		padding-bottom: 20px;
		font-size: 30px;
		letter-spacing: 3px;
	}

}

















/*====================================================*/
/*-------首頁輪播--------*/
/*====================================================*/


.indexBannerArea{
    position: relative;
	width: 100%;
	/*max-width: 73.125rem;*/ /*1170*/
	margin: 0 auto;
	overflow: hidden;
}


.indexBannerArea #particles-js{
	position:absolute;
	z-index: 2;
	width: 100%;
	/*height: 100vh;*/
	height: 100%;
	/* background-color: #2c2e43; */
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;	
	
	pointer-events: none;
}

.indexBannerArea .banner_down{
	z-index: 10;
}
	.indexBannerArea .banner_down .indexBannerList .indexBannerIn{
		/* display: none; */
	}
/* .indexBannerArea .banner_up{
	z-index: 11 !important;
	position: absolute !important;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #fff0 !important;

	display: none;
}
	.indexBannerArea .banner_up .indexBannerList .pcBanner ,
	.indexBannerArea .banner_up .indexBannerList .mobileBanner{
		background-image:none !important;
	}
	
.indexBannerArea .swiper-button-prev{		
	background-image: url(../index/images/left_arrow2.png);
}
.indexBannerArea .swiper-button-next{
	background-image: url(../index/images/right_arrow2.png);
} */



.indexBannerList{
	position: relative;
	display: flex;
	flex-direction: column;
}
	.indexBannerList  .pcBanner{
		display: flex;
		flex-direction: column;
		padding: 0;
		aspect-ratio: 3.5 / 1;
		justify-content: center;
	}
	.indexBannerList a{
		display: block;
		flex-grow: 1;
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		/* padding-left: 7%; */
		padding: 0;
		text-decoration: none;
		flex-grow: 1;
	}





	.indexBannerIn{
		max-width: 23.125rem; /*370px*/
		width: 90%;
		width: 100%;
		max-height: 100%;
		/* 20250328 移除文字發光效果 by tom */
		/* text-shadow: rgb(255, 255, 255) 0px 0px 10px; */
		backdrop-filter: blur(2px);
		z-index: inherit;
		margin-left: 11%;
		background-color: rgb(255 255 255 / 70%);
		padding: 0.9375rem; /*15px*/
		border-radius: 0.9375rem; /*15px*/
	}
		/* 首頁banner列表標題  */
		h2.indexBanner_title{
			padding: 0;
			margin: 0;
			display: inline-block;
			font-weight: bolder;
			font-size: clamp(1.2500rem, 1.5625vw, 1.8750rem); /* 字體 最小值 20.00px、大小約 1.5625vw、最大值 30.00px */
			line-height: 1.5;
			color: #343434;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 2;
			overflow: hidden;
			/* backdrop-filter: blur(3px); */
		}
		/* 首頁banner列表文字 */
		.indexBanner_remark{
			font-size: clamp(0.8125rem, 0.7813vw, 0.9375rem); /* 字體 最小值 13.00px、大小約 0.7813vw、最大值 15.00px */
			line-height: 1.5;
			color: #343434;
			margin-top: .625rem; /*10px*/
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 3;
			overflow: hidden;
			/* backdrop-filter: blur(3px); */
		}
		
		/* 首頁banner列表按鍵 */
		.indexBannerList .btn{
			width: 100%;
			margin-top: 1.25rem; /*20px*/
			margin-left: auto;
			text-align: right;
		}
			.indexBannerList .btn label{
				display: flex;
				justify-content: flex-end;
				align-items: center;
			}
			.indexBannerList .btn strong ,
			.indexBannerList .btn input{
				background: var(--second_color);
				width: 9.375rem; /*150px*/
				height: 2.625rem; /*42px*/
				line-height: 2.375rem; /*38px*/
				border-radius: 1.875rem; /*30px*/
				display: block;
				color: #fff;
				text-align: center;
			}
			











		/*banner影片模組----------------------------------------*/
		.index_bannerVideo{
			min-height: inherit;
			display: flex;
			flex-direction: column;
			flex-grow: 1;
			width: 100%;
		}
		.youtube-player{
			width: 100%;
		}
			.index_bannerVideo span{
				position: relative;
				display: block;
				overflow: hidden;
				display: block;
				width: 100%;
				aspect-ratio: 16 / 9;
			}
			
				.index_bannerVideo iframe{
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
				}




	/*暫停按鍵---------------------*/
	.swiper_play_btn{
		display: flex;
		align-items: center;
		gap: 0.625rem;
		position: absolute;
		bottom: 0.625rem;
		left: 0.625rem;
		z-index: 999;
	}

		.swiper_play_btn .swiper-button-pause , 
		.swiper_play_btn .swiper-button-play {
			background-color: var(--fourth_color);
			border-radius: 50%;
			aspect-ratio: 1;
			padding: 0.5rem;
			cursor: pointer;
			display: flex;
		}
		.swiper_play_btn .swiper-button-pause{

		}
		.swiper_play_btn .swiper-button-play{
			background-color: var(--primary_color);
		}

		.swiper_play_btn .swiper-button-pause i , 
		.swiper_play_btn .swiper-button-play i{
			color: #fff;
			font-size: 1rem;
		}
		.swiper_play_btn .swiper-button-pause i{
			color: #333;
		}

		.swiper_play_btn .swiper-button-pause:not(.active), 
		.swiper_play_btn .swiper-button-play:not(.active) {
			display: none;
		}
















		
@media (max-width: 990px){

	.indexBannerList  .pcBanner{
		display: none;
	}
	.indexBannerList  .mobileBanner{
		display: flex;
		flex-direction: column;
		padding: 0;
		/* aspect-ratio: 1 / 1; */
		aspect-ratio:  1 / 1.5;
		justify-content: center;
	}


	.indexBannerIn{		
		/* max-width: 50%; */
		margin-left: 2.5%;
		width: 90%;
        max-width: unset;
	}
		/* 首頁banner列表標題  */
		h2.indexBanner_title{
			/* font-size: 25px; */
		}
		/* 首頁banner列表文字 */
		.indexBanner_remark{		
			/* font-size: 14px;	 */
		}
		.indexBannerList .btn label input {
			/* font-size: 14px;
			width: 120px;
			height: 40px;
			line-height: 40px;
			border-radius: 6px; */
		}

		.indexBannerArea .swiper-button-prev, 
		.indexBannerArea .swiper-button-next {
			/* display: none; */
			width:2.5rem;
		}
}





		
@media (max-width: 640px){
	
	.indexBannerIn{		
		margin: 0 auto;
		width: 80%;
	}

}
















/*====================================================*/
/*-------首頁_about--------*/
/*====================================================*/

.indexAboutBg{
	display: none;
}
	.indexAboutBg .wrap{
		
	}


	/*----- 內頁標題塊2 -----*/
	.indexAboutBg .right_title2 {
		font-size: 45px;
		font-size: clamp(1.9375rem, 2.3438vw, 2.8125rem);  /*字體 最小值 31px、大小約 2.3438vw、最大值 45px*/
		line-height: 1.2; /*55px*/
		color: var(--primary_color);
		font-weight: 700;
		position: relative;
		margin: 0 auto;
		margin: clamp(3.7098rem, 5.9896vw, 7.1875rem) auto; /* 最小值 59.36px、大小約 5.9896vw、最大值 115px */
		width: fit-content;
		border-bottom: none;
		padding-bottom: 0;
	}	

		.indexAboutBg .right_title2  .right_title_content{
			position: relative;
			display: flex;
			flex-direction: column-reverse;
			gap: 0.625rem; /*10px*/
			align-items: center;
			padding: 0 clamp(1.9355rem, 3.1250vw, 3.7500rem); /* 最小值 30.97px、大小約 3.1250vw、最大值 60px */
			text-align: center;
		}


		
		.indexAboutBg  .right_title2 strong{
			font-size: inherit;
			line-height: initial;
			padding: 0;
			margin: 0;
			display: inline-block;
			font-weight: inherit;
			/* margin-bottom: calc(22px - 16px); */
		}	
	
		.indexAboutBg .right_title2  .index_sub_title{
			color: var(--primary_color);
			font-size: clamp(1.2500rem, 1.6667vw, 2.0000rem); /* 字體 最小值 20.00px、大小約 1.6667vw、最大值 32.00px */
			line-height: 1.13;
			font-family: var(--foreign_foreign);
		}
		.indexAboutBg .right_title2:after {
			display: none;
		}
		
		.indexAboutBg .right_title2 p {
			font-size: clamp(0.875rem, 0.8333vw, 1rem); /*字體 最小值 14px、大小約 0.8333vw、最大值 16px*/
			color: var(--primary_color);
			line-height: 1.5;
			font-weight: normal;
		}

		.indexAboutBg .right_title2  .right_title_decorate{
			width: clamp(1.6130rem, 2.6042vw, 3.1250rem); /* 最小值 25.81px、大小約 2.6042vw、最大值 50px */
			position: absolute;
			/* top: 50%;
			background-color: #ddd; */
		}
			.indexAboutBg .right_title2  .right_title_decorate img{
				width: 100%;
				height: auto;
			}

			.indexAboutBg .right_title2  .right_title_decorate1{
				width: clamp(1.9355rem, 3.1250vw, 3.7500rem); /* 最小值 30.97px、大小約 3.1250vw、最大值 60px */
				right: clamp(-1.9355rem, -3.1250vw, -3.7500rem); /* 最小值 30.97px、大小約 3.1250vw、最大值 60px */
				transform: translateX(0%) translateY(-50%) rotate(331deg);
			}
		.indexAboutBg .right_title2  .right_title_decorate2{
			left: clamp(-1.6130rem, -2.6042vw, -3.1250rem); /* 最小值 25.81px、大小約 2.6042vw、最大值 50px */
			transform: translateX(0%) translateY(-50%);
		}






















/*====================================================*/
/*-------首頁捐款項目內容區塊--------*/
/*====================================================*/


/* 首頁捐款項目內容區塊 */        
.indexDonateProjectBg{	
	overflow: hidden;
	padding: clamp(1.6130rem, 2.6042vw, 3.1250rem) 0; /*最小值 25.81px、大小約 2.6042vw、最大值 50.00px */
	position: relative;
}
	.indexDonateProjectBg .wrap{
	position: relative;
	z-index: 3;
	}
	

	.indexDonateProjectBg .btn_area input {
		background:#fff;
		border-color: transparent;
		color: var(--second_color);
		box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
	}


        /* 首頁捐款項目區 */
		ul.indexDPArea{
			padding: 0;
			margin: 0;
			display: block;
			list-style-type: none;

			display: grid;
			grid-template-columns: repeat(3 , 1fr);
			gap: .9375rem; /*15px*/
			/* margin: 0 -15px; */
		}
            /* 首頁捐款項目列表 */
			ul.indexDPArea li{
				padding: 0;
				margin: 0;
				display: block;
				list-style-type: none;

				box-sizing: border-box;
				width: 100%;
				/* width: 33.3%; */
				/* padding: 0 10px 17px;
				flex: 0 0 calc(100% / 12* 4); */

			}
				.indexDPlist{
					/* height: 100%; */
					box-shadow: 1px 1px 15px #00000038;
					display: flex;
					flex-direction: column;
				}
					/* 首頁捐款項目圖片 */
                    .indexDPimg{						
					}
						.indexDPimg a{
							display: block;
							text-decoration: none;
							position: relative;
							/* padding-top: 45%; */
							padding-top: 66%;
							overflow: hidden;
							transition: 0.5s ease all;				
						}
						.indexDPimg img{	
							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;
							transform-origin: center;					
						}
						.indexDPimg a:hover img{	
							transform: scale(1.1);
							transition: 0.5s ease all;					
						}
						
                   .indexDP_indexBottom{
						border-bottom: 6px var(--fourth_color) solid;
						position: relative;
						/*padding: 20px 20px calc(20px + 36px);*/  /*36是按鈕高度*/
						padding: 5px 20px;
						height: calc(100% - 20px * 2);  /*20是padding上下高度*/
						background-color: #fff;
						}
				   		/* 首頁捐款項目標題 */
						.indexDP_indexBottom h3{
							padding: 0;
							margin: 0;
							display: block;
							font-size: clamp(1.1250rem, 1.1979vw, 1.4375rem); /* 字體 最小值 18.00px、大小約 1.1979vw、最大值 23.00px */
							line-height: 1.5;
							margin-bottom: 5px;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 2;
							overflow: hidden;
						}		
							.indexDP_indexBottom h3 a{
								display: block;
								text-decoration: none;
								color: #333;
							}	
							.indexDP_indexBottom h3 a:hover{
								color: var(--second_color);
								transition: 0.5s ease all;
							}						
						
						.indexDP_indexBottom .indexDP_remark{
							font-size: 1rem;
							line-height: 1.5;
							font-family: var(--foreign_foreign);
							color: #818181;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
							overflow: hidden;
							margin-bottom: 0px;
						}	

						/* 首頁捐款項目按鈕 */						
						.indexDP_indexBottom .btn{
							/* margin-top: 15px; */
							/* text-align: right; */
							position: absolute;
							right: 20px;
							bottom: 20px;
						}
							.indexDP_indexBottom .btn a{
								background-color: #6cc;
								color: #fff;
								padding: 10px 25px;
								display: inline-block;
								text-decoration: none;
								border-radius: 30px;
							}	
							




@media (max-width: 990px){

	/* 首頁捐款項目區 */
	ul.indexDPArea{
		/* margin: 0 -10px; */
	}
		/* 首頁捐款項目列表 */
		ul.indexDPArea li{
			/* width: 33.3%; */
			/* padding: 0 10px; */
		}
			.indexDP_indexBottom {
				/* padding: 10px; */
				padding: 10px 10px calc(10px + 36px);  /*36是按鈕高度*/
				height: calc(100% - 10px * 2);  /*10是padding上下高度*/
			}
				/* 首頁捐款項目標題 */
					.indexDP_indexBottom h3{
						/* font-family: var(--foreign_foreign);
						margin-bottom: 0px; */
					}		
				.indexDP_indexBottom .indexDP_remark{
					/* font-size: 15px; */
				}	
				/* 首頁捐款項目按鈕 */						
				.indexDP_indexBottom .btn{
					right: 10px;
					bottom: 10px;
					/* margin-top: 10px; */
				}
				
				
}

@media (max-width: 768px){

	/* 首頁捐款項目區 */
	ul.indexDPArea{
		/* display: block;
		margin: 0 0 -30px; */
		grid-template-columns: repeat(1 , 1fr);
	}
		/* 首頁捐款項目列表 */
		ul.indexDPArea li{
			width: 100%;
			padding: 0 0 0;
		}
		.indexDP_indexBottom {
			height: auto;
        	padding: 10px;
		}
			/* 首頁捐款項目按鈕 */						
			.indexDP_indexBottom .btn{
				text-align: right;
				right: unset;
				bottom: unset;
				position: unset;
			}
				.indexDP_indexBottom .btn a {
					padding: 8px 10px;
				}
}				


.indexDonateProjectBg .aos-animate{
    /* display: flex;
    flex-wrap: wrap; */
}