@charset "utf-8";

#citi .main ,
#citi .main .form li .tit,
#citi .main .form .card_table span a{
	color: var(--main-color);/*統一參數*/
}
.tit{
	font-size: 16px;
}
#citi .nav_bg,
#citi .footer {
    background-color: var(--main-color);/*統一參數*/
}
#citi .main .form .card_table span a{
	border-bottom:1px solid var(--main-color);/*統一參數*/;
}
.main_all{
	background-color: #fff;
}

.main{
	height: auto;
	width:calc(100% - 30px);
	min-width: 320px;
	max-width: 1000px;
	margin: 0 auto;
	background-color: #fff;
	
}
.main *{
	box-sizing: border-box;

}
.main h3{
	font-size: 25px;
	color: #333333;
	margin-top: 20px;
    font-weight: 500;
    padding: 0 10px;
	text-align: center;
}
.main .g-recaptcha{
    margin-top: 30px;
	transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform-origin: center;
    -webkit-transform-origin: center;
    text-align: -webkit-center;
	
}
.main .agree{
	text-align:left;
	line-height: 23px;
    width: 100%;
	font-size: 14px;
}
.main .agree label{
    display: block;
    margin:10px 0 0 0 ;
    padding: 0 10px 5px 30px;
    
    text-indent: -20px;
}
.main .agree input[type="radio"],
.main .agree input[type="checkbox"]{
	margin-right:5px;
}

.main .buttonbox{
	text-align:center;
	padding: 30px 0 50px 0;
}
.main .buttonbox input[type="button"],
.main .buttonbox input[type="submit"],
.main .buttonbox .button,
.main .buttonbox .light_gray{
	font-family:微軟正黑體;
    display:inline-block;
	cursor:pointer;
	cursor:hand;
	padding:10px 30px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #B7B7B7;
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	background:-ms-linear-gradient( top, #ededed 5%, #dfdfdf 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf) );
	background-color:#ededed;
	color:#222222;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	text-shadow:0 0 1px #555555;
 	box-shadow:inset 1px 1px 0px 0px #ffffff;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	-moz-box-shadow:inset 1px 1px 0px 0px #ffffff;
	font-size:15px;
}
.main .buttonbox input[type="button"]:hover,
.main .buttonbox input[type="submit"]:hover,
.main .buttonbox .button:hover,
.main .buttonbox .light_gray:hover,
.main .buttonbox input[type="button"]:active,
.main .buttonbox input[type="submit"]:active,
.main .buttonbox .button:active,
.main .buttonbox .light_gray:active{
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	background:-ms-linear-gradient( top, #dfdfdf 5%, #ededed 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #dfdfdf), color-stop(100%, #ededed) );
	background-color:#dfdfdf;
	color:#111111;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
}

.main .buttonbox input[type="button"]:last-child,
.main .buttonbox input[type="submit"]:last-child,
.main .buttonbox .button:last-child,
.main .buttonbox .gray{
	border:1px solid #6b6b6b;
	background:-moz-linear-gradient( center top, #1f1f1f 5%, #4f4f4f 100% );
	background:-ms-linear-gradient( top, #1f1f1f 5%, #4f4f4f 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #1f1f1f), color-stop(100%, #4f4f4f) );
	background-color:#1f1f1f;
	color:#CCCCCC;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1f1f1f', endColorstr='#4f4f4f');
	text-shadow:0 0 3px #555555;
 	box-shadow:inset 1px 1px 0px 0px #000000;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #000000;
 	-moz-box-shadow:inset 1px 1px 0px 0px #000000;
}
.main .buttonbox input[type="button"]:last-child:hover,
.main .buttonbox input[type="submit"]:last-child:hover,
.main .buttonbox .button:last-child:hover,
.main .buttonbox .gray:hover,
.main .buttonbox input[type="button"]:last-child:active,
.main .buttonbox input[type="submit"]:last-child:active,
.main .buttonbox .button:last-child:active,
.main .buttonbox .gray:active{
	background:-moz-linear-gradient( center top, #4f4f4f 5%, #1f1f1f 100% );
	background:-ms-linear-gradient( top, #4f4f4f 5%, #1f1f1f 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #4f4f4f), color-stop(100%, #1f1f1f) );
	background-color:#4f4f4f;
	color: #E4E4E4;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f4f4f', endColorstr='#1f1f1f');
}

.main .form{
	display: inline-flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
	padding:20px 0;
	border-bottom:1px solid #DCDCDC;
    width: 100%;
}
.main .form li{
	width:calc(100% / 2);
	padding: 15px 10px;
	
}
.main .form .only_one{
	width:100%;
}

.main .form .card_table{
    width: calc(100% / 2);
    padding: 20px 25px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #D5D5D5;
    font-size: 15px;
    line-height: 250%;
}
.main .form .card_table:hover{
    background:#E8E8E8;
}
.main .form .card_table span,
.main .form .card_table span a{
	color:#333333;
}
.main .form .card_table span a{
	border-bottom:1px solid #333333;
	padding: 3px 5px;
}
.main .form .card_table span a:hover{
	color:#000000;
	background:#ffffff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}


.main .form li .tit{
	display: block;
	width: 100%;
	color:#333333;
}

.main .form li .tit label{
	float:right;
    color: #333333;
}
.main .form li .tit input[type="radio"],
.main .form li .tit input[type="checkbox"]{
	margin-right:5px;
}

.main .form li .ps{
	font-size: 13px;
	color: #888888;
}
.main .form li .fill{
	padding-top:5px;
    color: #333333;
	font-family:微軟正黑體;
}
.main .form li .fill input,
.main .form li .fill select,
.main .form li .fill option,
.main .form li .fill textarea,
.main .form li .fill label{
	display:inline-block;
	padding: 5px;
	margin-bottom:5px;
	font-family:微軟正黑體;
}

.main .form li .fill input,
.main .form li .fill select,
.main .form li .fill option,
.main .form li .fill textarea{
	width:100%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #D5D5D5;
	font-size:15px;
}
.main .form li .fill textarea{
	min-height:150px;
}
.main .form li .fill input:invalid,
.main .form li .fill select:invalid,
.main .form li .fill option:invalid,
.main .form li .fill textarea:invalid,
.main .form li .fill label:invalid{
  border: 2px solid #ff0000;
}
.main .form li .fill input:last-child,
.main .form li .fill select:last-child,
.main .form li .fill option:last-child,
.main .form li .fill textarea:last-child,
.main .form li .fill label:last-child{
	margin-right:0;
}
.main .form li .fill input[type="radio"],
.main .form li .fill input[type="checkbox"]{
	width:auto;
	margin-right:5px;
}
	
.main .form li .two input,
.main .form li .two select,
.main .form li .two option,
.main .form li .two textarea,
.main .form li .two label{
	width:calc(100% / 2 - 4.3px);
}

.main .form li .two2 input{
	width:calc(100% / 2 - 2.3px);
	
	
}
.main .form li .three input,
.main .form li .three select,
.main .form li .three option,
.main .form li .three textarea,
.main .form li .three label{
	width:calc(100% / 3 - 2.8px);
}
.main .form li .three2 input,
.main .form li .three2 label{
	width:calc(100% / 5 - 5.8px);
}

.main .form li .three3 select{
	width:calc(100% / 3 - 8.8px);
}


.main .form li .four input,
.main .form li .four select,
.main .form li .four option,
.main .form li .four textarea,
.main .form li .four label{
	width:calc(100% / 4 - 4.3px);
}

@media screen and (max-width: 480px) {
	.main .form li{
		width: 100%;
		padding:15px 0;
	}
	.main .form li .two label,
	.main .form li .three label,
	.main .form li .four label{
		width:auto;
	}
	.main .form .card_table{
    width: calc(100%);
    padding: 20px 25px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #D5D5D5;
    font-size: 15px;
	margin: 0 0 15px 0;
    line-height: 250%;
}
}