@charset "utf-8";
/* CSS Document */
.abg{
	position:relative;
	width:100%;
	background-color:#E5F1F1;
	}
.head{
	position: relative;
	width: 100%;
	padding-bottom: 400px;
	display:block;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: 50% 0%;
	background-image: url(../images/head.png);
	background-size: auto 100%;
	font-weight: 700;
	}
.head2{
	position: relative;
	width: 100%;
	padding-bottom:247px;
	display:block;
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position: 50% 0%;
	background-image: url(../images/head2.png);
	background-size:auto 100%;
	}
.head2 .f1_h{
	position:absolute;
	width:100%;
	font-size:4.16rem;/*50*/
	
	color:#173C26;
	font-weight:700;
	top:9%;
	left:50%;
	transform:translateX(-50%);
	text-align:center;
	/**/
	/*padding:0;line-height:7rem;*/
	}	
.titbx,.titbx2{
	position:relative;
	width:450px;
	padding-bottom:90px;
	/**/
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position:50% 0%;
	background-image: url(../images/titbx.png);
	background-size:100% auto;
	margin:10px auto 0;
	}
.titbx{/*top:-30px;*/}
.titbx2{margin:1rem auto 1.8rem;}
.titbx::before,.titbx2::before{
	position:absolute;
	content:attr(data-index);
	font-size:2.5rem;/*30*/
	font-weight:700;
	color:#FFF;
	top:9%;
	left:50%;
	transform:translateX(-50%);
	}
.content{
	position:relative;
	width:1000px;
	min-height:calc(100vh - 500px);
	margin:0 auto;
	padding:0 0 3rem;
	}
.content .con2{
	width:100%;
	margin:1rem auto 0;
	}
.content .con3{
	float:right;
	width:80%;
	min-height:280px;
	margin:2rem 0 0 0;
	}
.content .con2,.content .con3{
	position:relative;
	border-radius:10px;
	padding:2rem 3%;
	background-color:#FFF;
	}
.content .acbx{
	position:relative;
	width:95%;
	border-radius:10px;
	padding:2.5% 3%;
	background-color:#FFF;
	margin:1rem auto 2rem;
	overflow:hidden;
	/**/
	-webkit-filter: drop-shadow(0 10px 5px rgba(0, 0, 0, .1));
    filter: drop-shadow(0 10px 5px rgba(0, 0, 0, .1));
	}
.content .acbx > div:nth-child(1){
	float:left;
	position:relative;
	width:50.52%;/*480*/
	padding-bottom:31.575%;/*300*/
	border-radius:10px;
	background-color:#CCC;
	overflow:hidden;
	}
.content .acbx > div:nth-child(1) img{
	position:absolute;
	width:100%;
	display:block;
	top:0;
	left:0;
	}
.content .acbx > div:nth-child(2){
	float:right;
	position:relative;
	width:45%;
	height:100%;
	/*padding-bottom:31.575%;*/
	display:block;
	font-size:1.333rem;/*16*/
	color:#4F4B46;
	}
.content .acbx > div:nth-child(2) .t1{
	position:relative;/*absolute*/
	width:105%;
	font-size:2.5rem;/*30*/
	color:#4E4141;
	font-weight:700;
	margin:0 0 .5rem;
	top:0;
	left:0;
	/*
  	overflow:hidden;
  	white-space: nowrap;
  	text-overflow: ellipsis;*/
	}
.content .acbx > div:nth-child(2) .c1{
	position:relative;/*absolute*/
	width:100%;
	/*height:35%;48*/
	margin-bottom:.8rem;
	/*top:18%;
	left:0;*/
	/**/
  	overflow: hidden;
  	display: -webkit-box;
  	text-overflow: ellipsis;
  	-webkit-line-clamp:3; /*行數*/
  	-webkit-box-orient:vertical;
 	white-space: normal;
	}
.content .acbx > div:nth-child(2) .participant{
	position:relative;/*absolute*/
	width:100%;
	left:1%;
	bottom:33%;
	}
.content .acbx > div:nth-child(2) .participant > span{font-weight:500;}
.content .acbx > div:nth-child(2) .date{
	position:relative;/*absolute*/
	font-weight:500;
	width:100%;
	left:1%;
	bottom:23%;
	}
.content .acbx > div:nth-child(2) .gobt{
	position:relative;/*absolute*/
	width: 180px;
	height: 45px;
	cursor: pointer;
	border-radius: 5px;
	margin:5% 0 0;
	/*left: -.5%;
	bottom: 1%;*/
	background-color: #FFB00F;
	font-size: 1.42rem;/*17*/
	font-weight: 400;
	color: #fff;
	/**/
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	/**/
	transition: all .5s;
	}
	
.content .acbx > div:nth-child(2) .gobt span{
	display:inline-block;
	padding-left:.8rem;
	}
.content .acbx > div:nth-child(2) .gobt::after{
	position:relative;
	content:"";
	width:20px;
	padding-bottom:20px;
	display:inline-block;
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position:50% 0%;
	background-image: url(../images/arrow1.png);
	background-size:100% auto;
	top:1px;
	}
.content .acbx > div:nth-child(2) .gobt:hover{
	background-color:#ff8400;
	}
.backbt{
	position:relative;
	width: 180px;
	height: 45px;
	cursor: pointer;
	border-radius: 5px;
	margin:3rem auto 2rem;
	background-color:#4CA15F;
	font-size: 1.42rem;/*17*/
	font-weight: 400;
	color:#fff;
	/**/
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	/**/
	transition: all .5s;
	}
.backbt span{
	display:inline-block;
	padding-left:.8rem;
	color:#fff;
	}
.backbt span::after{
	position:relative;
	content:"";
	width:20px;
	padding-bottom:20px;
	display:inline-block;
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position:50% 0%;
	background-image: url(../images/arrow1.png);
	background-size:100% auto;
	top:4px;
	}
.backbt:hover{
	background-color:#3a854b;
	}
	
/**/
.content .mubx{
	position:relative;
	width:100%;
	border-radius:10px;
	background-color:#FFF;
	padding:2rem 0;
	margin:85px 0 0 0;
	}
.content .acmu{
	float:left;
	position:sticky;
	width:19%;
	top:0;
	text-align:center;
	margin-top:-62px;
	}
.content .acmu a{
	position:relative;
	width:100%;
	display:block;
	font-size:1.75rem;
	line-height:52px;
	color:#383838;
	}
.content .acmu a:hover{
	color:#4CA156;
	}
.content .acmu a::before{
	position:absolute;
	content:"";
	width:0;
	height:80%;
	background-color:#4CA156;
	left:0;
	top:10%;
	}
.content .acmu a.on::before{width:6px;background-color:#4CA156;}
.content .acmu a.on{color:#4CA156;font-weight:700;}
/**/
.ctxt{
	position:relative;
	font-size:1.5rem;
	line-height:2.5rem;
	color:#4F4B46;
	padding:0 .3rem 2.5rem;
	}
.ctxt2{
	position:relative;
	width:97%;
	font-size:1.5rem;
	line-height:2.5rem;
	color:#4F4B46;
	padding:0 .3rem 1rem;
	margin:0 auto;
	}
.nb{padding:0 0 2.5rem 2.2rem;}
.disc{padding:0 0 2.5rem 1.8rem;}
.nb .disc{padding:0 0 0 1.8rem;} 
.disc .nb{padding:0 0 0 2.2rem;} 
.nb > li,.disc > li{
	position:relative;
	margin-bottom:1rem;
	}
.nb > li{list-style-type:decimal;}
.disc > li{list-style-type: disc;}
.nonebx{
	position:absolute;
	width:100%;
	font-size: 1.6rem;
	line-height: 30px;
	font-weight: 500;
	padding:60px 0;
	color: #4F4B46;
	text-align: center;
	top: 40%;
	left: 50%;
	transform: translate(-50%,-50%);/**/
	
	}
.item{
	position:relative;
	width:100%;
	display:block;
	padding:0 0 0 25px;
	font-size:2.08rem;
	line-height:30px;
	font-weight:700;
	color:#4D3939;
	margin:0 0 1rem;
	}	
.item::before{
	position:absolute;
	content:"";
	width:8px;
	height:100%;
	background-color:#FFD200;
	left:0;
	top:0;
	}
.item > span{
	font-size:1.5rem;
	font-weight:400;
	}
/**/
.download{
	position:relative;
	width:100%;
	text-align:center;
	margin:3rem auto 2rem;
	}
.download a{
	position:relative;
	height:100px;
	display:inline-block;
	margin:0 2%;
	/**/
	transition: all .5s;
	}
.download a img{
	height:100%;
	}
.topbx{
	position:fixed;
	width:1000px;
	margin:0 auto;
	text-align:right;
	bottom:15%;
	left:50%;
	transform:translateX(-50%);
	}
.topbx .topbt{
	position:absolute;
	width:50px;
	padding-bottom:50px;
	display:block;
	cursor: pointer;
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position:50% 50%;
	background-image: url(../images/top.png);
	background-size:100% auto;
	right:-25px;
	bottom:30px;
	}
/**/
/*表單*/
input,textarea,select{
	font-family:Arial,'Noto Sans TC','微軟正黑體', sans-serif;
	border:1px solid #CBCBCB;
	/**/
	transition: all .3s;
	-moz-transition: all .3s;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	}
select::-ms-expand{display:none;}
select:focus{
	border: 1px solid #007e7d;
	box-shadow:.1rem .2rem .5rem rgba(0, 0, 0, .1);
	-webkit-box-shadow:.1rem .2rem .5rem rgba(0, 0, 0, .1);
	}
.exchangebx{
	position: relative;
	width:97%;
	padding: .3rem 0 0;
	margin:0 auto 2rem;
	}
.exchangebx li{
	position: relative;
	margin:0 0 .8rem;
	}
.exchangebx li select{
	position: relative;
	width:100%;
	font-size:1.5rem;
	line-height:2.2rem;
	font-weight:300;
	display:inline-block;
	color:#4F4B46;
	padding:.3rem .8rem;
	border-radius:.5rem;
	border:1px solid #CBCBCB;
	background-color:#fff;
	/**/
	outline:none;
	-webkit-appearance: none; /*Chrome*/
	-moz-appearance: none;/*FF*/
	-ms-appearance: none;
	-o-appearance: none;
	appearance:none;/*CSS3*/
	background-image: url(../images/expand.svg);
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position:98.5% 50%;
	background-size:22px auto;
	}
/**/
.storebx{
	position: relative;
	width:97%;
	font-size: 1.3rem;
	line-height: 2rem;
	color: #4F4B46;
	margin: 0 auto 1rem;
	}
.storebx span{font-weight:400;}
.storebx thead td{
	font-size:1.5rem;
	font-weight: 400;
	line-height:2.5rem;
	color: #FFF;
	}
.storebx thead tr{background-color:#9ACA74;}
.storebx td{ padding:5px 5px;}
.storebx tbody tr:nth-child(even){background-color:#ececec;}
/**/
.community{
	position:relative;
	float:right;
	width:115px;
	text-align:right;
	top:-5px;
	margin-bottom:-3px;
	}	
/**/
.tbc{
	position:relative;
	margin:2rem 0;
	}
.tbc td{
	padding:8px 5px;
	line-height:1.8rem;
	}
.tbc tr:nth-child(odd){
	background-color: #e5f1f1;
	}
.tbc tr:first-child{
	background-color:#93c9cc;
	line-height:1.8rem;/*2.5rem*/
	color:#FFF;
	}
.tbc tr:first-child td{ padding:.8rem 0;}
.tbc td p{padding:.5rem .5rem;}
.tbc td p:nth-child(even){background-color:rgba(207,233,233,.5);}
	
.tcc{position:relative; text-align:center;}
.cbt{
	position:relative;/*absolute*/
	width:300px;
	height: 60px;
	cursor: pointer;
	border-radius:8px;
	margin:0 auto 3.5%;
	background-color:#FFB00F;
	font-size: 2.2rem;/*17*/
	font-weight: 500;
	color: #fff;
	/**/
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	/**/
	transition: all .5s;
	}
.cbt:hover{background-color:#ff8400;}
.cbt span{position:relative;color:#fff; display:inline-block; padding-left:5%;}
.cbt::after{
	position:relative;
	content:"";
	width:35px;
	padding-bottom:35px;
	display:inline-block;
	background-attachment:scroll;
	background-repeat: no-repeat;
	background-position:50% 0%;
	background-image: url(../images/arrow1.png);
	background-size:100% auto;
	top:1px;
	}

@media only screen and (max-width:1600px){
/**/

}
@media only screen and (max-width:1400px){
/**/
}
@media only screen and (max-width:1000px){	
/**/
.content .acbx > div:nth-child(2) .t1{font-size:1.85rem;/*30*/}
.head{
	padding-bottom:40%;
	background-size:auto 100%;
	}
.head2{padding-bottom:24.7%;}
.head2 .f1_h{
	font-size:5vw;/*50*/
	top:9%;
	}
.content{
	width:95%;
	min-height:calc(100vh - 400px);
	}
.content .acbx > div:nth-child(2) .c1{top:20%;}	
.download a{
	height:70px;
	margin:0 2%;
	}
.download a img{
	height:100%;
	}
.topbx{
	width:95%;
	bottom:15%;
	}
.topbx .topbt{
	width:40px;
	padding-bottom:40px;
	right:-20px;
	bottom:30px;
	}
}
@media only screen and (max-width:800px){
/**/	
}
/**/
@media only screen and (max-width:780px){
/**/
.head{
	padding-bottom:69.375%;
	background-image: url(../images/head_m.png);
	}	
.head2{
	padding-bottom:26.6%;
	background-image: url(../images/head2_m.png);
	}
.head2 .f1_h{
	font-size:5.5vw;/*50*/
	/*line-height:3rem;*/
	top:14%;
	}
.titbx,.titbx2{
	width:300px;
	padding-bottom:60px;
	}
.titbx{/*top:-8px;*/}
.titbx::before,.titbx2::before{
	width:73%;
	text-align:center;
	font-size:1.7rem;/*30*/
	font-weight:700;/*700*/
	word-break:keep-all;
	white-space:nowrap;
	top:7%;
	}
/**/
.content .con3 {width:100%;margin: 2rem 0 0 0;}
/**/
.content .acbx > div:nth-child(1){
	float:none;
	width:100%;/*480*/
	padding-bottom:62.5%;/*300*/
	}
.content .acbx > div:nth-child(2){
	float:none;
	width:100%;
	padding:1rem 0 .5rem;
	}
.content .acbx > div:nth-child(2) .t1{
	font-size:2.5rem;
	position:relative;
	width:100%;
	margin:0 0 1rem;
	}
.content .acbx > div:nth-child(2) .c1{
	position:relative;
	height:auto;
	margin-bottom:1rem;
	top:0;
	/**/
  	overflow:auto;
  	display: block;

	
	}
.content .acbx > div:nth-child(2) .participant{
	position:relative;
	left:0;
	bottom:0;
	}
.content .acbx > div:nth-child(2) .date{
	position:relative;
	left:0;
	bottom:0;
	padding:1rem 0;
	}
.content .acbx > div:nth-child(2) .gobt{
	position:relative;
	left:0;
	bottom:0;
	margin:0 auto;
	}
/**/
.content .acmu{display:none;}
/**/
.ctxt{
	font-size:1.25rem;
	line-height:2rem;
	padding:0 .3rem 2.2rem;
	}
.ctxt2{
	width:100%;
	font-size:1.25rem;
	line-height:2rem;
	}
.nb{padding:0 0 2.2rem 1.5rem;}
.disc{padding:0 0  2.2rem 1.5rem;}
.nb > li,.disc > li{
	position:relative;
	margin-bottom:.8rem;
	}
.item{
	padding:0 0 0 20px;
	font-size:1.6rem;
	line-height:22px;
	margin:0 0 1rem;
	font-weight:400;
	}	
.item > span{
	font-size:1.25rem;
	font-weight:400;
	}
.topbx{
	bottom:20%;
	z-index:1;
	}
.topbx .topbt{
	width:30px;
	padding-bottom:30px;
	right:-5px;
	bottom:30px;
	}
/**/
.exchangebx{
	width:100%;
	padding:.3rem 0 0;
	}
.exchangebx li{
	position: relative;
	margin:0 0 .8rem;
	}
.exchangebx li select{
	font-size:1.3rem;
	}
/**/
.storebx{
	width:100%;
	font-size: 1.25rem;
	line-height: 1.8rem;
	}
.storebx thead td{
	font-size:1.35rem;
	line-height:2.3rem;	
	}

.cbt{
	width: 90%;
	height: 55px;
	font-size:1.85rem;/*17*/
	}
.cbt::after{
	width:30px;
	padding-bottom:30px;
	}
}
@media only screen and (max-width:685px){ 
/**/

}
@media only screen and (max-width:580px){
/**/
.download {
  	margin: 1rem auto 2rem;
	}
.download a{
	width:70%;
	height:auto;
	display:block;
	margin:0 auto 5%;
	/**/
	transition: all .5s;
	}
.download a img{
	width:100%;
	height:auto;
	}
}
@media only screen and (max-width:560px){
/**/

}
@media only screen and (max-width:470px){
/**/
.content .acbx > div:nth-child(2) .t1{font-size:2.1rem;}	
	
}

@media only screen and (max-width:380px){
/**/
}
@media only screen and (max-width:360px){
/**/


}
@media only screen and (max-width:340px){
/**/
}