*{box-sizing: border-box;}
html {	
	font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;
	-webkit-text-size-adjust:none;
	background:#fbfbfb;
}
body{
}
.clearfix::after {
	content: "";
	display: table;
	clear: both;
}

/*消除IE arrow*/
select::-ms-expand {
    border:none;
	background-color: transparent;
	color:#00a94f;
}


/* ---mobile first--- */
@media screen and (max-width: 640px) {
img{display:block;width:100%;height:auto;}
.t30{font-size:4.6875vw;letter-spacing:0.2em;font-weight: bold;}
.t24{font-size:3.75vw;letter-spacing:0.2em;font-weight: bold;}
.t20{font-size:3.125vw;letter-spacing:0.2em;font-weight: bold;}
.green{color:#00a94f;}
.gray{color:#666666;}
.red{color:#a40035;}
	/*popup*/
	.popup{background:rgba(0, 0, 0, 0.4);position:fixed;z-index: 999;top:0;right:0;left:0;bottom:0;}
	.idok{position: relative;z-index: 999;display:block;width:83%;max-width: 600px;margin:8vw auto;background:#f4f4f4;padding:20px;border:2px solid #00a94f;border-radius: 8px;overflow: auto;}
	.idok p, .idtrouble p{font-size:4.6875vw;font-weight: bold;margin-bottom:20px;}
	.idok img, .idtrouble img{display:block;max-width:85px;margin:0 auto;}
	.idok a, .idtrouble a{display:block;margin:30px auto 40px auto;text-align: center;font-size:4.6875vw;font-weight: bold;color:#222222;}
	.idok a:hover, .idtrouble a:hover{color:#00a94f;}
	.idtrouble{position: relative;z-index: 999;display:block;width:83%;max-width:600px; margin:8vw auto;background:#f4f4f4;padding:20px;border:2px solid #d52d12;border-radius: 8px;}
	
#css_table {
    display:table;
	width:100%;
	margin-top:4%;
	padding-bottom: 6%;
  }
.css_tr {
      display: table-row;
  }
.css_tr_white {
      display: table-row;background:#ffffff;
  }
.link{font-size:3.125vw;font-weight: bold;}
.css_td {
      display: table-cell;color:#222222;font-size:3.125vw;font-weight: bold;
  }
.css_td.gray li{color:#666666;font-size:3.125vw;font-weight: bold;padding:0px 0 0 30px;}
.css_td_big {
      display: table-cell;padding:1% 8%;font-size:3.4375vw;font-weight: bold; color:#222222;
  }
.css_tr_yellow{display:table-row;background-color:#fffbc0;}
.css_td.left, .css_td_big.left{display:block;width:88%;text-align: left;padding:10px 0px 10px 30px;}
.css_td.right, .css_td_big.right{width:12%;text-align: right;padding:10px 30px 10px 0px;}
	
header{width:100%;height:58px;background-color:#ffffff;border-top:5px solid #12a848;border-bottom:5px solid #fff42f;}
	a.logo{display:block;width:113px;height:26px;background-image: url(../images/logo-2x.png);background-repeat: no-repeat;background-size:113px auto;margin:13px 0 0 15px;}
article{width:82%;margin:0 auto;margin-bottom:8%;position:relative;}

	.weclome{margin:8% 0;}
	.hello{margin:6% 8%;font-size:4.6875vw;letter-spacing:0.2em;font-weight: bold;}
	.point{margin:3vw 0;font-size:3.125vw;color:#d77400;}
	.goBtn{display:block;width:45%;padding:3.75vw;margin:40px auto;text-align: center;background-color:#ffffff;color:#00a94f;font-size:3.75vw;font-weight: bold; border:2px solid #00a94f;border-radius: 4px;text-decoration: none;}
	.goBtn:hover,.goBtn:focus,.goBtn:active{background-color:#fff200;}
	.goback{display:inline-block;width:45%;padding:3.75vw;margin:40px 20px 40px auto;text-align: center;background-color:#ffffff;color:#00a94f;font-size:3.75vw;font-weight: bold; border:2px solid #00a94f;border-radius: 4px;text-decoration: none;}
	.goback:hover,.goback:focus,.goback:active{background-color:#fff200;}
	.gonext{display:inline-block;width:45%;padding:3.75vw;margin:40px auto 40px 0;text-align: center;background-color:#ffffff;color:#00a94f;font-size:3.75vw;font-weight: bold; border:2px solid #00a94f;border-radius: 4px;text-decoration: none;}
	.gonext:hover,.gonext:focus,.gonext:active{background-color:#fff200;}
.leftText{margin-left: 7%;}	
ul{width:100%;}
	.pay-list li{width:100%;overflow:hidden;border:2px solid #00a94f;border-radius: 4px;padding:4%;margin-bottom:2%; cursor: pointer;}
	.pay-list a.right{float:right;font-size:  4.0625vw;font-weight: bold;text-decoration: none;color:#00a94f;}
	.pay-list a.left{float:left;font-size: 4.0625vw;font-weight: bold;text-decoration: none;color:#00a94f;}
	.pay-list li:hover{background:#fff200;}
	.pay-list p{font-size:4.375vw;color:#00a94f;font-weight: bold;padding-bottom:4%}
input{border:none;font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;color:#008852;font-size:3.75vw;font-weight: bold;width:100%;background-color:#dcdcdc;padding:5%;border-radius:4px;box-shadow:none;}
input::placeholder{color:#008852;font-size:3.75vw;font-weight: bold;font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;} 
.input2left{display:inline-block;width:46%; left:1%}
.input2right{display:inline-block;width:46%;position:absolute;right: 1%}
.input4left{display:inline-block;width:24%;}
.input4right{display:inline-block;width:23%;position:absolute;right: 1%}
.codeWidth{width:130%;}
	/*.dropdownBtn{display:block;border:none;color:#008852;font-size:3.75vw;font-weight: bold;width:100%;background-color:#dcdcdc;padding:5%;border-radius:4px;cursor: pointer;margin-bottom:15px;}
	.dropdownBtn p{display:inline-block;padding-right:2%;}
	.dropdownBtn span{display:inline-block;border-style: solid;border-width: 8px 4px 0 4px;border-color: #008852 transparent transparent transparent;}*/
/*IE隱藏箭頭樣式*/	
.dropdownMenu::-ms-expand {display: none; }	
.dropdownMenu{
/*移除箭頭樣式*/appearance:none;-moz-appearance:none;-webkit-appearance:none;
/*改變右邊箭頭樣式*/background: url(../images/arrow.png) no-repeat right center transparent;
font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;display:block;width:100%;max-height:150px;overflow: auto; font-size:3.75vw;font-weight: bold;text-decoration: none;color:#008852;padding: 5% 15% 5% 5%;border:none;border-radius: 4px;background-color:#dcdcdc;margin-bottom:20px;}
.dropdownMenuLeft{
	/*移除箭頭樣式*/appearance:none;-moz-appearance:none;-webkit-appearance:none;
	/*改變右邊箭頭樣式*/background: url(../images/arrow.png) no-repeat right center transparent;
	font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;display:inline-block;width:48%;max-height:150px;overflow: auto; font-size:3.75vw;font-weight: bold;text-decoration: none;color:#008852;padding: 5% 15% 5% 5%;border:none;border-radius: 4px;background-color:#dcdcdc;margin-bottom:20px;}
.dropdownMenuRight{position:absolute;right: 1%;
		/*移除箭頭樣式*/appearance:none;-moz-appearance:none;-webkit-appearance:none;
		/*改變右邊箭頭樣式*/background: url(../images/arrow.png) no-repeat right center transparent;
		font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;display:inline-block;width:48%;max-height:150px;overflow: auto; font-size:3.75vw;font-weight: bold;text-decoration: none;color:#008852;padding: 5% 15% 5% 5%;border:none;border-radius: 4px;background-color:#dcdcdc;margin-bottom:20px;}
	.dropdownMenu option{font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;font-size:3.75vw}
	ul.listCheck{display:block;width:100%;background-color:#f4f4f4;border-radius: 8px;padding:2%;}
	ul.listCheck li{font-size:3.75vw;color:#222222;line-height:8vw;}
	.disc{width:150px;}
footer{width:100%;height:47px;border-top:5px solid #fff42f;color:#ffffff;text-align: center;line-height: 42px;font-size:3.75vw;position:relative;bottom:0;}
	.gradient{
		background:url(../images/bg-footer.png) no-repeat center center, -webkit-linear-gradient(right, #55b642, #109f3d); /* For Safari 5.1 to 6.0 */
		background:url(../images/bg-footer.png) no-repeat center center, -o-linear-gradient(left, #55b642, #109f3d); /* For Opera 11.1 to 12.0 */
		background:url(../images/bg-footer.png) no-repeat center center, -moz-linear-gradient(left, #55b642, #109f3d); /* For Firefox 3.6 to 15 */
		background:url(../images/bg-footer.png) no-repeat center center, linear-gradient(to left, #55b642, #109f3d); /* Standard syntax (must be last) */	
	}
}

/*tablet*/
@media screen and (min-width: 641px){
.wrapper{display:block;max-width:850px;width:88%;margin:0 auto;}
img{display:block;margin:0 auto;width:auto;height:auto;}

.t30{font-size:26px;letter-spacing:0.1em;font-weight: bold;text-align: left;}
.t24{font-size:20px;letter-spacing:0.1em;font-weight: bold;}
.t20{font-size:16px;letter-spacing:0.1em;font-weight: bold;}
.green{color:#00a94f;}
.gray{color:#666666;}
.red{color:#a40035;}

	/*popup*/
	.popup{background:rgba(0, 0, 0, 0.4);position:fixed;z-index: 999;top:0;right:0;left:0;bottom:0;}
	.idok{position: relative;z-index: 999;display:block;width:83%;max-width:600px; margin:8vh auto;background:#f4f4f4;padding:20px;border:2px solid #00a94f;border-radius: 8px;}
	.idok p, .idtrouble p{font-size:4.0625vh;font-weight: bold;margin-bottom:20px;}
	.idok img, .idtrouble img{display:block;max-width:85px;margin:0 auto;}
	.idok a, .idtrouble a{display:block;margin:30px auto 40px auto;text-align: center;font-size:3.12vh;font-weight: bold;color:#222222;}
	.idok a:hover, .idtrouble a:hover{color:#00a94f;}
	.idtrouble{position: relative;z-index: 999;display:block;width:83%;max-width:600px; margin:8vw auto;background:#f4f4f4;padding:20px;border:2px solid #d52d12;border-radius: 8px;}
	


#css_table {
    display:table;
	max-width:960px;
	width:100%;
	margin-top:30px;
	padding-bottom: 60px;
  }
.css_tr {
      display: table-row;
  }
.css_tr_white {
      display: table-row;background:#ffffff;
  }
.css_td {
      display: table-cell;color:#222222;font-size:20px;font-weight: bold;
  }
.css_td.gray li{color:#666666;font-size:20px;font-weight: bold;padding:0px 0 0 30px;}
.css_td_big {
      display: table-cell;padding:1% 8%;font-size:22px;font-weight: bold; color:#222222;
  }
.css_tr_yellow{display:table-row;background-color:#fffbc0;}
.css_td.left, .css_td_big.left{display:block;width:80%;text-align: left;padding:10px 0px 10px 30px;}
.css_td.right, .css_td_big.right{width:45%;text-align: right;padding:10px 30px 10px 0px;}
.link{font-size:20px;font-weight: bold;}
header{width:100%;height:58px;background-color:#ffffff;border-top:5px solid #12a848;border-bottom:5px solid #fff42f;}
	a.logo{display:block;width: 850px;height: 40px;background-image: url(../images/logo-2x.png);background-repeat: no-repeat;background-position:0 13px;background-size:113px auto;/* margin:13px 0 0 15px; */margin: 0 auto;}
article{display:block;width:88%;max-width:960px;margin:0 auto 8% auto;position:relative;}

	.weclome{display:block;width:88%;margin:40px auto 40px auto;}
	.hello{font-size:26px;letter-spacing:0.1em;font-weight: bold;text-align: left;display:block;width:850px;margin:40px auto 40px auto;}
	.point{display:block;width:88%;margin:2vh 0;font-size:14px;color:#d77400;}
	.goBtn{display:block;width:45%;max-width:298px;padding:3.75vh;margin:40px auto;text-align: center;background-color:#ffffff;color:#00a94f;font-size:20px;font-weight: bold; border:2px solid #00a94f;border-radius: 4px;text-decoration: none;}
	.goBtn:hover,.goBtn:focus,.goBtn:active{background-color:#fff200;}
	.goback{display:inline-block;width:45%;padding:3.75vw;margin:40px auto;text-align: center;background-color:#ffffff;color:#00a94f;font-size:20px;font-weight: bold; border:2px solid #00a94f;border-radius: 4px;text-decoration: none;float: left}
	.goback:hover,.goback:focus,.goback:active{background-color:#fff200;}
	.gonext{display:inline-block;width:45%;padding:3.75vw;margin:40px auto;text-align: center;background-color:#ffffff;color:#00a94f;font-size:20px;font-weight: bold; border:2px solid #00a94f;border-radius: 4px;text-decoration: none;float:right;}
	.gonext:hover,.gonext:focus,.gonext:active{background-color:#fff200;}
	.leftText{margin-left: 27%;}	
ul{display:block;margin:0 auto;width:88%;max-width: 960px;}
.pay-list li{width:100%;max-width:960px;overflow:hidden;border:2px solid #00a94f;border-radius: 4px;padding:3.75vh;margin-bottom:2%; cursor: pointer;}
.pay-list a.right{float:right;font-size:22px;font-weight: bold;text-decoration: none;color:#00a94f;}
.pay-list a.left{float:left;font-size:22px;font-weight: bold;text-decoration: none;color:#00a94f;}
.pay-list li:hover{background:#fff200;}
.pay-list p{font-size:24px;color:#00a94f;font-weight: bold;padding-bottom:4%}
.pay-list p.black{font-size:24px;color:#000000;font-weight: bold;padding-bottom:1%}
input{display: block;border:none;font-family: Arial, "微軟正黑體", Helvetica, "sans-serif";color:#008852;font-size:22px;font-weight: bold;width:100%;max-width: 658px;background-color:#dcdcdc;padding:5%;border-radius:4px;box-shadow:none;margin: 0 6% 0 0%;}
.input4{display:inline-block;width:25%;}
.input2left{display:inline-block;width:40%;}
.input2right{display:inline-block;width:40%;position:absolute;right: 1%}
.input4left{display:inline-block;width:20%;}
.input4right{display:inline-block;width:20%;position:absolute;right: -5%}
input::placeholder{color:#008852;font-size:22px;font-weight: bold;font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;} 
	/*.dropdownBtn{display:block;border:none;color:#008852;font-size:24px;font-weight: bold;width:100%;background-color:#dcdcdc;padding:5%;border-radius:4px;cursor: pointer;margin-bottom:15px;}
	.dropdownBtn p{display:inline-block;padding-right:2%;}
	.dropdownBtn span{display:inline-block;border-style: solid;border-width: 8px 4px 0 4px;border-color: #008852 transparent transparent transparent;}
	
/*IE隱藏箭頭樣式*/	
.dropdownMenu::-ms-expand {display: none; }	
.dropdownMenu{
/*移除箭頭樣式*/appearance:none;-moz-appearance:none;-webkit-appearance:none;
/*改變右邊箭頭樣式*/background: url(../images/arrow.png) no-repeat right center transparent;
font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;display:block;width:100%;max-width:729px;max-height:150px;overflow: auto; font-size:22px;font-weight: bold;text-decoration: none;color:#008852;padding: 5% 10% 5% 5%;border:none;border-radius: 4px;background-color:#dcdcdc;margin:0 auto 20px auto;}
.dropdownMenuLeft{
	/*移除箭頭樣式*/appearance:none;-moz-appearance:none;-webkit-appearance:none;
	/*改變右邊箭頭樣式*/background: url(../images/arrow.png) no-repeat right center transparent;
	font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;display:inline-block;width:48%;max-height:150px;overflow: auto; font-size:1.75vw;font-weight: bold;text-decoration: none;color:#008852;padding: 5% 15% 5% 5%;border:none;border-radius: 4px;background-color:#dcdcdc;margin-bottom:20px;}
.dropdownMenuRight{position:absolute;right: 1%;
		/*移除箭頭樣式*/appearance:none;-moz-appearance:none;-webkit-appearance:none;
		/*改變右邊箭頭樣式*/background: url(../images/arrow.png) no-repeat right center transparent;
		font-family: Arial, "微軟正黑體", Helvetica, "sans-serif" ;display:inline-block;width:48%;max-height:150px;overflow: auto; font-size:1.75vw;font-weight: bold;text-decoration: none;color:#008852;padding: 5% 15% 5% 5%;border:none;border-radius: 4px;background-color:#dcdcdc;margin-bottom:20px;}
	ul.listCheck{display:block;width:100%;background-color:#f4f4f4;border-radius: 8px;padding:2%;}
	ul.listCheck li{font-size:24px;color:#222222;line-height:34px;}
	.disc{width:240px;}
footer{display:block;margin:0 auto;width:100%;height:47px;border-top:5px solid #fff42f;color:#ffffff;text-align: center;line-height: 42px;font-size:14px;position:relative;bottom:0;}
	.gradient{
		background:url(../images/bg-footer.png) no-repeat center center, -webkit-linear-gradient(right, #55b642, #109f3d); /* For Safari 5.1 to 6.0 */
		background:url(../images/bg-footer.png) no-repeat center center, -o-linear-gradient(left, #55b642, #109f3d); /* For Opera 11.1 to 12.0 */
		background:url(../images/bg-footer.png) no-repeat center center, -moz-linear-gradient(left, #55b642, #109f3d); /* For Firefox 3.6 to 15 */
		background:url(../images/bg-footer.png) no-repeat center center, linear-gradient(to left, #55b642, #109f3d); /* Standard syntax (must be last) */	
	}
}

@media screen and (min-width: 769px){
	.disc{width:310px;}
	input{display: block;border:none;font-family: Arial, "微軟正黑體", Helvetica, "sans-serif";color:#008852;font-size:22px;font-weight: bold;width:100%;max-width: 729px;background-color:#dcdcdc;padding:5%;border-radius:4px;box-shadow:none;margin: 0 5% 0 0%;}
	.input2right{display:inline-block;width:40%;position:absolute;right: 6%}
	.input4left{display:inline-block;width:20%;}
	.input4right{display:inline-block;width:20%;position:absolute;right: -4%}
	.link{font-size:22px;font-weight: bold;}
}