
img{display: block;}
/*button.btn,a.btn{width: 30rem;height:4.8rem;background: #265C7F; color: #fff;text-align: center;line-height: 4.8rem;font-size: 1.7rem;}*/
.kv{
	position: relative;
	background: url(../images/kv_bg.jpg) center center no-repeat;
	background-size: cover;
	height: 56.25vw;
}
.container{max-width: 161rem;margin:0 auto;}
.kv .container,.thanks .container{
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.kv-con{
	position: absolute;
	width: 81.8rem;
	height: 100%;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding-top: 24rem;
}
.kv-con-bg{
	position: absolute;
	width: 81.8rem;
	height: 100%;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	background: url(../images/kv-txtmask.png) center top no-repeat;
    background-size: 100% auto;
    mix-blend-mode: multiply;
}

.kv-title{width: 61.3rem;margin-bottom: 8rem;mix-blend-mode: luminosity;}
.kv-logo{width: 42.4rem;margin-top: 24rem;}


p{font-size: 2.2rem;line-height: 4.4rem;font-weight: 400;color: #444040;}
h3{font-size: 3.6rem;text-align: center;
	font-weight: 900;font-family:'Noto Serif TC','微軟正黑體', 'Microsoft JhengHei', sans-serif;
color: #265A95;position: relative;margin-bottom: 1em;}

span{font-size: 1.6rem;line-height: 3.4rem;color: #ADADAD;}
.sec-slogen{font-size: 1.4rem;position: absolute;width: 100%;left: 0;z-index: 2;color: #fff;top: 5rem;letter-spacing: .8em;text-align: center;}
.swiper-ctrl{
	width: 100%;
	position: relative;
	margin-top: 1.5rem;
	display: flex;
	justify-content: center;align-items: center;
}
.swiper-process{
	position: relative;
	height: 2px;
	width: 80rem;
	background: #C8C9CA;
	margin-right: 1rem;
}
.swiper-process-bar{
	position: relative;
	left: 0;
	top: 0;
	background: #717071;
	height: 100%;
	width: 0%;
}
.swiper-arrows{display: flex;}
.swiper-arrow{
	width: 3rem;
	height: 3rem;
	background: url(../images/arrow.svg) center center no-repeat;
	background-size: cover;
	margin: 0 1rem;
	cursor: pointer;
}

.swiper-arrow-left{
	transform: scaleX(-1);
}

/*.sec1,.sec2,.sec4{height: 100vh;max-height: 56.25vw;}*/
section:not(.kv){
	background: #fff;
	padding: 16rem 0;
}
section .pic-container{
	max-width: 161rem;
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: stretch;
	justify-content: center;
	flex-direction: row-reverse;
/* 	height: 86rem; */
}

section:nth-child(odd) .pic-container{
	flex-direction: row;
}
.sec-pic{
/* 	height: 86rem; */
	width: 68.9rem;
	flex: 0 0 auto;
}
.sec-txts{
	text-align: center;
	font-weight: 400;
	padding-left:0rem ;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	background: #E0DFD8;
	width: 92rem;
	flex: 1;
}
.sec-txts h3{margin-bottom: 8rem;}
section:nth-child(odd) .sec-txts{
/* 	padding-left:0rem ; */
/* 	padding-right: 8.5rem; */
/* 	align-items: flex-end;	 */
}
section:nth-child(odd) .sec-txts h3{
/* 	text-align: right; */
}
section:nth-child(odd) .sec-txts p{
/* 	color: #7B7B7B; */
/* 	text-align: right; */
}
.sec5-box img{width: 100%;height: 100%;object-fit: cover;}

/* sec1 */

.sec1 h3{
	width: 61.5rem;
}


/* sec2 */


.sec2 h3{
	width: 53.2rem;
}
.sec-pic-head{
	height: 24.2rem;
	width: 100%;
	background: #21455F;
	display: flex;
	justify-content: center;
	align-items: center;
}
.sec2 .sec-slogen{position: relative;top: initial;left: initial;}
.sec2 .sec-pic{
	width: 93rem;
}
.sec2 .sec-txts{
	width: 68rem;
}
/* sec3 */

.sec3 h3{
	width: 59.5rem;
}
.sec3 .sec-pic{
	width: 69.2rem;
}
.sec3 .sec-txts{
	width: calc(100% - 69.2rem);
}

/* sec4 */

.sec4 h3{
	width: 52.2rem;
}
.sec4 .sec-pic{
	width: 92.6rem;
}
.sec4 .sec-txts{
	background: #B5C9B1;
	width: calc(100% - 92.6rem);
}
.sec4 .sec-txts p{color: #444040;}

/* .sec4 .sec-slogen{top: 12rem;} */

/* sec5 */

.sec5 h3{
	width: 52.2rem;
}
.sec5 .sec-pic{
	width: 70rem;
}
.sec5 .sec-txts{
	width: calc(100% - 70rem);
}

.sec5 .sec5-tbox1{background: #738E40;}
.sec5 .sec5-tbox1 p{color: #fff;}
.sec-txts .swiper-container .swiper-slide{padding: 0;}

.sec5 .sec5-tbox1 h3{width:62.2rem ;}
.sec5 .sec5-tbox2 h3{width:68.5rem ;}
.sec5 .sec5-tbox3 h3{width:55.9rem ;}
.sec5 .sec5-tbox4 h3{width:36.9rem ;}
.sec5 .sec5-tbox5 h3{width:43.2rem ;}
.sec5 .sec5-tbox6 h3{width:37rem ;}
.sec5 .sec5-tbox7 h3{width:55.9rem ;}


/* sec6 */



.sec6 h3{
    width: 52.2rem;
}
.sec6 .sec-pic{
    width: 93rem;
}
.sec6 .sec-txts{
    width: calc(100% - 93rem);
}

.sec6 .sec6-tbox1{background: #6D635A;}
.sec6 .sec6-tbox1 p{color: #fff;}

.sec6 .sec6-tbox1 h3{width:49.6rem ;}
.sec6 .sec6-tbox2 h3{width:36.9rem ;}
.sec6 .sec6-tbox3 h3{width:49.5rem ;}
.sec6 .sec6-tbox4 h3{width:49.5rem ;}
.sec6 .sec6-tbox5 h3{width:36.9rem ;}
.sec6 .sec6-tbox6 h3{width:30.7rem ;}
.sec6 .sec6-tbox7 h3{width:37rem ;}


/* sec7 */



.sec7 h3{
    width: 52.2rem;
}
.sec7 .sec-pic{
    width: 69rem;
}
.sec7 .sec-txts{
    width: calc(100% - 69rem);
}

.sec7 .sec7-tbox1{background: #6f7376;}
.sec7 .sec7-tbox1 p{color: #fff;}
.sec-txts .swiper-container .swiper-slide{padding: 0;}

.sec7 .sec7-tbox1 h3{width:68.3rem ;}
.sec7 .sec7-tbox2 h3{width:65.8rem ;}
.sec7 .sec7-tbox3 h3{width:43rem ;}
.sec7 .sec7-tbox4 h3{width:37rem ;}
.sec7 .sec7-tbox5 h3{width:49.5rem ;}
.sec7 .sec7-tbox6 h3{width:65.9rem ;}
.sec7 .sec7-tbox7 h3{width:43.3rem ;}


/* sec8 */

section.sec8{
	width: 100%;
	background: url('../images/sec8-pic.jpg') center center no-repeat;
	background-size: cover;
	height: 56.25vw;
	display: flex;
	justify-content: center;
	align-items: center;
}

.sec8-title{
	width: 82rem;
/* 	margin: 0 auto; */

}
.sec8 p{
	position: absolute;
	font-size: 2.8rem;
	color: #fff;
	bottom: 6rem;
	text-align: center;
	line-height: 2em;
}

/* form */

.map-section{
	padding: 16rem 0 26rem 0;
}
.map-section .container{
	position: relative;
	display: flex;
	max-width: 100%;
	align-items:center;
	justify-content: center;
}
.build-info{margin-left: 0rem;}
.build-info ul{font-family: "Noto Serif TC";font-weight: bold;margin-bottom: 5rem;}
.build-info li{color: #444040;font-size: 2.2rem;line-height: 2em;}
.map-section{    background-color: #F8F0EE;}
.form{    background-color: #F8F0EE !important;padding: 10rem 0 18rem 0;overflow: hidden;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}


.form-ing{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}
.form-logo{
	width: 88rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
.form-logo img{
	width: 49.5rem;
}

.form .container{
	/*padding:0rem 0 8rem 0;*/
	width: calc(100% - 38rem);
	justify-content: space-between;
}
.form-container{
	width: 79.6rem;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-direction: column;
}
.form-title{
	font-size: 4rem;
	text-align: center;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1em;
}
.form-title::before,.form-title::after{width: 26rem;height: 1px;background: #444040;position: relative;content: "";display: inline-block;vertical-align: middle;}

.form .form-con{width: 100%;margin-right: 0;}
.form .form-content{
	width: 100%;
}



.map{
	width:56.7rem;
	height: 27.5rem;
	/*height: 58rem;*/
}
.section-info{
	width: 78.1rem;

/* 	mix-blend-mode: luminosity; */
}
.form .sec-ing{bottom: -20rem;left: calc(50% - 35rem ); }
.map-btn{
	margin-bottom: 5.6rem;
}

.form .form-content > ul > li.form-content-title,.form .send-row{
	background: transparent;

}
 .form .send-row button{
 	padding: 0;
 	width: 17.5rem;
 	background: #000;
 	color: #fff;
 }
.form .send-row button{
	font-size: 3.2rem;
	text-align: center;
	font-weight: 900;
	line-height: 7.5rem;
	color: #fff;
}
.form .form-content li.send-row{padding-left: 0;justify-content: flex-end;padding: 0;}
button.send{
	outline: none;border:none;
/* 	margin:0 auto; */
}


.footer-bar{
	width: 100%;

}
footer{height: 14.3rem;
background: url(../images/footer-bg.jpg);display: flex;justify-content: center;align-items: center;}
.footer-logo{
	width: 15.2rem;
	/*padding: 3rem 0;*/
	margin:0 auto;
}
.sec-txts .swiper-container{
	width: 100%;
	height: 100%;
	margin-left: 0;
}
.swiper-container .swiper-slide{position: relative;}
.sec-tbox{
	position: relative;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.sec-pic{position: relative;}
.sec-txts .swiper-slide p{margin-right: 2.2rem;}
.swiper-pagination{
	position: absolute;
	text-align: center;
	margin-top: 3rem;
	bottom: -3rem;
	left: 0;
	width: 100%;
	text-align: center;

}

.swiper-pagination-bullet{
	line-height: .4rem;
	width: 1.5rem;
	height: 1.5rem;
	background: transparent;
	border: 1px solid #000;
	border-radius: .75rem;
	opacity: 1;
	margin-right: 2rem;
}

.swiper-pagination-bullet-active{
	background: #000;	
}

.thanks{height: 100dvh;}
.thanks .container{padding-bottom: 0;}
.thanks .container > img{width: 480px;} 
.thank-footer{position: absolute;bottom: 0;left:0;width: 100%;}


.nav-mb{display: none;}



@media screen and (max-width: 900px){
	main{padding-bottom: 14rem;overflow: hidden;background: #F8F0EE;}
/*	main{overflow: initial;}
	section{overflow-x: hidden;}*/
	.nav-pc{display: none;}
	.nav-mb{display: flex;}

	p{font-size: 1.9rem;line-height: 2em;}
	/*.thanks .container > img{width: 436px;max-width:60vw } */
	section:not(.kv){padding: 0;}

	.kv{
		height: 100dvh;

	}
	.kv-con-bg{display: none;}
	.kv-title{width: 18.5rem;}
	.kv-logo{width: 32.3rem;bottom: 11.8rem;position: absolute;left: calc(50% - 32.3rem / 2);}

	section .pic-container,section:nth-child(odd) .pic-container{flex-direction: column-reverse;z-index: 5;}
	section:nth-child(odd) .sec-txts{padding-left: 0;padding-right: 0;align-items: center;}
	section:nth-child(odd) .sec-txts h3{text-align: center;}
	.swiper-section .container{padding: 0rem 0 0rem 0;}
	section .pic-container{height: initial;}
	.sec-txts{width: 100% !important;height: auto;}
	.sec-pic{width: 100% !important;height: auto;}
	.sec-txts{
		justify-content: flex-start;
		margin-top: -5rem;
		padding-top: 12.6rem;
		min-height: 64.3rem;
	}
	.sec-txts h3{margin-bottom: 5rem;}
	.sec-pic-head{height: 19.4rem;}

/* 	.sec3 .pic-container{flex-direction: column;} */
	.sec4 .sec-txts{padding-bottom:9rem ;}
	.sec5 .sec-txts,.sec6 .sec-txts,.sec7 .sec-txts{padding-top: 0;padding-bottom:0 ;}
	.sec5 .sec-tbox,.sec6 .sec-tbox,.sec7 .sec-tbox{padding-top: 12.6rem !important;        min-height: 65rem;}


	.sec5 .sec5-tbox1 h3{width:calc(0.73 * 62.2rem );}
	.sec5 .sec5-tbox2 h3{width:calc(0.73 * 68.5rem );}
	.sec5 .sec5-tbox3 h3{width:calc(0.73 * 55.9rem );}
	.sec5 .sec5-tbox4 h3{width:calc(0.73 * 36.9rem );}
	.sec5 .sec5-tbox5 h3{width:calc(0.73 * 43.2rem );}
	.sec5 .sec5-tbox6 h3{width:calc(0.73 * 37rem );}
	.sec5 .sec5-tbox7 h3{width:calc(0.73 * 55.9rem );}

	.sec6 .sec6-tbox1 h3{width:calc(0.73 * 49.6rem );}
	.sec6 .sec6-tbox2 h3{width:45.1rem;}
	.sec6 .sec6-tbox3 h3{width:54.3rem;}
	.sec6 .sec6-tbox4 h3{width:calc(0.73 * 49.5rem );}
	.sec6 .sec6-tbox5 h3{width:54.4rem;}
	.sec6 .sec6-tbox6 h3{width:44.8rem;}
	.sec6 .sec6-tbox7 h3{width:49.8rem;}

	.sec7 .sec7-tbox1 h3{width:calc(0.73 * 68.3rem );}
	.sec7 .sec7-tbox2 h3{width:calc(0.73 * 65.8rem );}
	.sec7 .sec7-tbox3 h3{width:calc(0.73 * 43rem );}
	.sec7 .sec7-tbox4 h3{width:54.4rem;}
	.sec7 .sec7-tbox5 h3{width:calc(0.73 * 49.5rem );}
	.sec7 .sec7-tbox6 h3{width:calc(0.73 * 65.9rem );}
	.sec7 .sec7-tbox7 h3{width:calc(0.73 * 43.3rem );}

	section.sec8{background: url('../images/mb/sec8-bg.jpg');height: 76.6rem;flex-direction: column;background-size: cover;}

	.sec8-title{width: 3.83rem;margin-bottom: 6rem;}
	.sec8 p{position: relative;font-size: 1.9rem;bottom: initial;}


	.swiper-ctrl{justify-content: center !important;margin-top: 2.5rem;}
	.swiper-arrow{width: 3.5rem;height: 3.5rem;}
	

	.form {padding-bottom: 8rem;padding-top: 6rem !important;height: auto;}
	.form .container{padding-top: 0rem;
		width: 100%;
		flex-direction: column;align-items: center;padding-bottom: 7rem;
		padding-left: 0;
	}
	.form .form-content li.send-row{justify-content: center;}
	.form-title{width: 100%;margin-bottom: 3rem;padding: 0 6rem;}
	.form .form-con{
		padding:0 6rem 6rem 6rem;
	}
	.form-title::before, .form-title::after{width: 20rem;}
/* 	.form-container{padding-bottom: 25rem;}
	.form-con{padding: 0;}

	button.btn, a.btn{width: 32.5rem;height: 5.2rem;font-size: 1.8rem;}


	.form .form-con{margin-left: 0;margin-right: 0;}
	.form .form-content{width: 55rem;} */
/* 	.form .form-content li input[type="text"], .form .form-content li input[type="tel"], .form .form-content li input[type="email"], .form .form-content li select{
		width: 42.4rem;
		height: 4.7rem;
		font-size: 2rem;
		line-height: 4.7rem;
	} */
/* 	.form-title{margin-bottom: 3rem;}
	.form .form-content li label{font-size: 2.5rem;}
	.form .form-content li.demand-check{margin-top: .5rem;}
	.form .demand-check .form-check-inline{width: 100%;text-align: right;padding-left: 12rem;}
	.form .demand-check span.margin-r{font-size: 2rem;margin-right: 0;}
	.form .form-content li.send-row{justify-content: center;}
	.form .send-row button{width: 21.2rem;}
	.form .form-content > ul > li.form-content-title, .form .send-row{font-size: 3.2rem;line-height: 7.7rem;}
	.form .form-content-title, .form .send-row button{font-size: 3.2rem;line-height: 7.7rem;height: 7.7rem;background: initial;}
 */
	.map{display: none;}
	.swiper-section .sec-txts h3{z-index: 2;}

	.section-info{width: 57.5rem;margin-top: 0;margin-bottom: 2rem;}

	.build-info{margin-left: 0;width: 57.5rem;text-align: center;}
	.build-info ul{display: flex;flex-wrap: wrap;flex-direction: row;}
	.build-info li{font-size: 2.8rem;width: auto;display: inline-block;}
	.build-info{width: 100%;}
}