@charset "utf-8";
/* CSS Document */
body {padding:0;margin:0; 
      font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Jhenghei", sans-serif;}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
}

body{background-color:#ffffff;text-decoration:none;}
.wrapper{width:100%;}
.header_wrap {background-color:#293b45;margin:0 auto;text-align:center;background-image:url(../images/headerbg.jpg);}
.header {}
.header img {width:100%;}

.container {width:100%;max-width:950px;margin:0 auto;}

.content_wrap {width:100%;max-width:950px;margin:0 auto;}
.content {background-color:#ffffff;padding:2% 5%;width:90%;}
.content h1 {text-align:center;color:#9b7e28;}

.maincontent_wrap {background-color:#3e5c67;background-image:url(../images/headerbg.jpg);}
.question {margin-bottom:30px;}

.subtitle {font-weight:bold;color:#215a54;font-size:20px;}
form > div {clear: both;overflow: hidden;padding: 0px; margin: 0 0 0px 0;}
form > div > fieldset > div > div { margin: 0 0 5px 0;}
form > div > label,legend {text-align: left; margin: 0 0 5px 0;}
form > div > div,form > div > fieldset > div {float: none; }
form > div > fieldset label {font-size: 90%;}

fieldset {border: 0;padding: 0;}
.title-text {padding:5px auto;color:#2e2e2e;font-weight:bold;font-size:20px;}
.checkbox_list {padding:5px auto;color:#35505b;font-size:18px;}
.checkbox_list label {display:block;
margin-top:-20px;
margin-left:20px;}
.tnc-title {padding:5px auto;color:#35505b;font-weight:bold;font-size:15px;}
.tnc-text {padding:5px auto;color:#35505b;font-size:15px;}
.pull_wrap {width:100%;margin:10px auto;display:block;float:left;}
.pullitems {width:100%;color:#D31D20;font-weight:bold;padding-top:0px;margin-right:2%;float:left;font-size:18px;display:block;}
.pull{margin:0px auto;width:100%;float:left;display:block;}
.pull select {width:100%;font-size:16px;display:block;}
input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=tel],
textarea,select 
 {
 border-top: 0px solid #b1b1b1;
 border-left: 0px solid #b1b1b1;
 border-right: 0px solid #b1b1b1;
 border-bottom: 0px solid #b1b1b1;}

.field_wrap select{height:30px;background-color:#f2f2f2;} /* Field2背景色*/
textarea{background-color:#f2f2f2;}

/* Field1背景色*/
input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=tel] {

  font-size: 16px;
  background-color:#ededed;
  font-family: 'Lato';
  padding: 5px 0px 5px 5px;
  margin-top:5px;
  border:0px solid #ffffff;
 
}

input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=password]:focus,
input[type=tel]:focus,
textarea:focus {
  outline: 0;
  border-color: none;
}

/* Field1 Hover背景色*/
input[type=text]:hover,
input[type=email]:hover,
input[type=url]:hover,
input[type=password]:hover,
textarea:focus {border:0px solid #5c969a;}

.form_sptext {font-size:18px; color:#a3a3a3;}
.q_half {width:40%;float:left;}
.q_half2 {width:40%;float:left;}
.id1 {width:20px;float:left;margin-right:10px;} 
.id2 {width:80px;float:left;type="text" ;}
.full {width:100%;}

.web {}
.web img {width:100%;}
.mobile {display:none;}
.mobile img {width:100%;}

.title_intro {text-align:center; font-size:16px;color:#bca561;font-weight:bold;margin-bottom:25px;}

.btn_wrap {text-align:center;background-color:#293b45;}
.btn_wrap  img{margin:15px auto;}

.btn_join {text-align:center;background-color:#3e5c67;display:none;}
.btn_join img{margin:15px auto;}

.btn_join1_wrap{background-color:#002a3a;margin-top:-5px;}
.btn_join1 {padding:10px;max-width:300px;margin:0 auto;}
.btn_join1 img{width:100%;}

.btn_radio{padding:4px;}
.success h1{padding:100px 0;}
.reminder {color:#EB1C1F;font-size:13px;text-align:center;padding:5px;text-align:center;margin:0 auto;}
.title-text .reminder {margin-left:10px;float:right;}
.field_wrap {width:60%;margin:15px auto;padding:0px;clear:both;overflow:hidden;}
.field_wrap2 {width:100%;margin:15px auto;padding:0px;}

.formtable {width:100%;}
.formtable th{font-size:12px;padding:4px 5px;}
.formtable .specialth {background-color:#669CAA;color:#ffffff;width:50px;display:block;}
.formitems {padding:5px auto;text-align:left;color:#669CAA;}
.specialth input {text-align:center;}
.formtable td{}
.q6_title {color:#D31D20;font-size:18px;font-weight:bold;}
.percent_wrap {float:left; width:50%;margin:17px auto;}
.percent_wrap .title-text {font-weight:300;font-size:16px;}
.percenticon {padding-top:10px;display:block;}
.btn_tnc {padding:0;background-color:#3e5c67;text-align:center;padding-bottom:30px;margin-top:-5px;}
.btn_tnc img{width:90px;}

@media only screen and (max-width: 40em) /* 640 */
{
.logo_wrap {height:200px;}
.result_wrap {width:100%;max-width:700px;margin:0px auto;padding:5px 15px;}
.description .title img {width:80%;}
.web {display:none;}
.mobile {display:block;}
.field_wrap {width:96%;margin:15px auto;padding:0px;}
.question {margin-bottom:30px;}
.content {background-color:#ffffff;padding:2% 2%;width:96%;}
.content h1 {font-size:28px;}
.success h1{font-size:24px;}
.field_wrap2 {width:100%;margin:15px auto;padding:0px;}
.formtable th{font-size:8px;padding:2px 3px;}
.pullitems {width:100%;padding-top:0px;margin-right:2%;float:left;}
.pull{margin:0px auto;width:100%;float:left;}
.btn_join {display:block;margin-top:-5px;}
}

 @media (max-width: 480px){


 }

  @media (max-width: 320px){

  }