/* 首頁廣告圖片 20241217 */
body.hideWindow {
	overflow: hidden;
}

.indexImg {
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 999999;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	background: rgba(255,255,255,.5);
}

.indexImg::before {
	content: '';
	width: 100%;
	height: 100%;
	backdrop-filter: blur(5px);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
}

.indexImg_cont {
	position: relative;
	z-index: 5;
	max-width: calc(100% - 40px);
	max-height: calc(100% - 40px);
}

.indexImg_close {
	position: absolute;
	right: 0;
	top: -1.5em;
	z-index: 20;
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
}

.indexImg_check {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	width: 100%;
	padding: 10px;
}

.indexImg_check input+label{padding-left: 10px;}

.swiper-indexImg .swiper-wrapper{
	max-width: 100%;
	display: block;
}

.swiper-indexImg .swiper-slide{
	display: flex;
	justify-content: center;
	align-content: center;
	align-content: center;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: auto !important;
	max-width: 100%;
	transition: 1s;
	opacity: 0 !important;
}

.swiper-indexImg .swiper-slide img{
	max-width: 100%;
}

.swiper-indexImg .swiper-slide.swiper-slide-active{
	position: relative;
	z-index: 5;
	opacity: 1 !important;
}



/*首頁*/
.bannerindex {
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	position: fixed;
	--swiper-navigation-color: #dfdfdf;
	--swiper-pagination-color: #dfdfdf;
	--swiper-pagination-bullet-inactive-color: #dfdfdf;
	--swiper-pagination-bullet-size: 10px;
	--swiper-pagination-bullet-inactive-opacity: .5;
	--swiper-pagination-bullet-horizontal-gap: 5px;
}

.bannerindex * {
	-webkit-transition: ease .3s;
	-moz-transition: ease .3s;
	-ms-transition: ease .3s;
	-o-transition: ease .3s;
	transition: ease .3s;
}

.swiper-banner {
	width: 100%;
	height: 100vh;
	position: absolute;
	left: -50%;
	margin-left: 50%;
}

.swiper-banner .swiper-slide>img {
	width: auto;
	max-width: 100%;
	/* height: 100vh */
	height: auto;
	display: block;
}

.effect1>img {
	transform: scale(1.05, 1.05) translate(5%, 5%);
	transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
	/*tr     =    (sc-1)/2sc*100%              */
	/* --1.25       0.25/2.5*100%=10%          */
}

.leftUp>img {
	-webkit-animation-name: leftUp;
	animation-name: leftUp;
}

@-webkit-keyframes leftUp {
	0% {
		transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
	}

	100% {
		transform: scale(1.05, 1.05) translate(-0.5%, -0.5%);
	}
}

@keyframes leftUp {
	0% {
		transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
	}

	100% {
		transform: scale(1.05, 1.05) translate(-0.5%, -0.5%);
	}
}

.moveRight>img {
	-webkit-animation-name: moveRight;
	animation-name: moveRight;
}

@-webkit-keyframes moveRight {
	0% {
		transform: scale(1.05, 1.05) translate(-0.5%, 0);
	}

	100% {
		transform: scale(1.05, 1.05) translate(0.5%, 0);
	}
}

@keyframes moveRight {
	0% {
		transform: scale(1.05, 1.05) translate(-0.5%, 0);
	}

	100% {
		transform: scale(1.05, 1.05) translate(0.5%, 0);
	}
}

.moveDown>img {
	-webkit-animation-name: moveDown;
	animation-name: moveDown;
}

@-webkit-keyframes moveDown {
	0% {
		transform: scale(1.05, 1.05) translate(0, -0.5%);
	}

	100% {
		transform: scale(1.05, 1.05) translate(0, 0.5%);
	}
}

@keyframes moveDown {
	0% {
		transform: scale(1.05, 1.05) translate(0, -0.5%);
	}

	100% {
		transform: scale(1.05, 1.05) translate(0, 0.5%);
	}
}

.centerBig>img {
	-webkit-animation-name: centerBig;
	animation-name: centerBig;
}

@-webkit-keyframes centerBig {
	100% {
		transform: scale(1.05, 1.05);
	}
}

@keyframes centerBig {
	100% {
		transform: scale(1.05, 1.05);
	}
}

.rightDownBig>img {
	-webkit-animation-name: rightDownBig;
	animation-name: rightDownBig;
}

@-webkit-keyframes rightDownBig {
	100% {
		transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
	}
}

@keyframes rightDownBig {
	100% {
		transform: scale(1.05, 1.05) translate(0.5%, 0.5%);
	}
}

.swiper-banner .swiper-slide>img {
	animation-duration: 5s;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 5s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-fill-mode: forwards;
}

/* .swiper-pagination {
	bottom: 15px;
	left: 50%;
	margin-left: -45px;
} */

/* .swiper-banner .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	margin: 0 5px;
}

.swiper-banner .swiper-slide img {
	opacity: 0 !important;
}

.swiper-banner .swiper-slide-active img {
	opacity: 1 !important;
}
*/

.mobile_wp {
	display: none;
}

.indexBanner01_text{max-width: 1660px; width: 90%; display: flex; align-items: flex-end; align-content: flex-end; justify-content: flex-start; height: 700px; max-height:40vw; position: absolute; transform: translateX(-50%); left: 50%; top: 0; z-index: 5; font-family: "Noto Sans TC", "Noto Sans", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-variation-settings: "wdth" 100; color: #FFFFFF;}
.indexBanner01_text figure{display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; max-width: 680px; width: 50%; transform: skewX(-5deg);}
.indexBanner01_text figure>p{flex: 1.5;}
.indexBanner01_text figure>p img{max-width: 100%;}
.indexBanner01_text figure>blockquote{flex: 1; padding-left: 1.05vw;}
.indexBanner01_text figure>blockquote>img{max-height: 1.95vw;}
.indexBanner01_link{display: flex; justify-content: flex-start; margin-top: 0.5vw;}
.indexBanner01_link a{display: flex; justify-content: center; align-content: center; align-content: center; text-align: center; font-size: 1.8vw; color: inherit; font-family: "Noto Sans TC", "Noto Sans", sans-serif; font-weight: inherit; padding: 0.55vw 1.1vw; border-radius: 50px; border: 1px solid #FFFFFF; line-height: 1; transition: .3s;}
.indexBanner01_link a+a{margin-left: 1.05vw;}
.indexBanner01_link a:hover{background: #FFFFFF; color: #212121;}

/* .indexBanner01_text{display: none;} */


@media screen and (max-width: 768px) {
	.bannerindex {
		position: relative;
		height: 0;
		padding-bottom: 47%
	}

	.swiper-banner {
		left: 0;
		margin: 0;
	}

	.swiper-banner .swiper-slide img {
		height: auto;
	}

	#content_main {
		margin-top: 0;
	}
}

@media (max-width:650px) {
	.indexBanner01_text figure{flex-wrap: wrap; width: 35%;}
	.indexBanner01_text figure>p, .indexBanner01_text figure>blockquote{flex: unset;}
}