.container_form {
  width: 100%;
  margin:0 auto;
  text-align: center;
  padding: 20px;
  background-color: white;
}
.container_form td {

}

.container_formLI {
  width: 100%;
  margin:0 auto;
  text-align: center;
  justify-content: center;
  padding: 20px;
  /*background-color: none;*/
}

.HEX{
  /*background:#00ffcca3;*/
  background:#FFFFFFa3;
  width:20%;
  margin: 0 auto;
}

.primary_body {
  display: flex;
  flex-wrap: wrap;
 justify-content: center;
  align-content: flex-start;

  width: 90%;
  margin: 0 auto;
  /*justify-content: center;
  align-items: center;
  /*float: center;*/
 /* background-color: black;*/
}
.form_border_body{
  height:100%;
  background-color:white;
  border-color:gray;
  border-width:1px;
  border-style:solid;
  /*vertical-align: button;
  overflow-y: hidden;*/
    display: flex;
  flex-wrap: wrap;
 justify-content: center;
  align-content: flex-start;
}
.form_border_GS_m{
  height: 40px;
  background-color: #8fd19e;
  border-color:gray;
  border-width:1px;
  border-style:solid;
  /*vertical-align: button;
  overflow-y: hidden;*/
}
.form_border_GS{
  height: 40px;
  background-color: #8fd19e;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}

.form_border_pri{
  height: 30px;
  background-color: #CBDBC7;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}

.form_border_snd{
  height: 30px;
  background-color: #D4D4D4;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  /*border-bottom-style:solid;*/
}

.form_border_WS_m{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-style:solid;
}

.form_border_WS{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}

.form_border_WS_R{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-right-style:solid;
  border-bottom-style:solid;
}

.form_border_WS_RB_SM{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-right-style:solid;
  border-bottom-style:solid;
}

.form_border_WS_LB{
  height: 100px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}

.form_border_WS_RB{
  height: 100px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-right-style:solid;
  border-bottom-style:solid;
}

.font_color_W{
  color: white;
}
.font_top_1{
  margin-top: 20%; 
}

/*文字對齊*/
.font_left_b{
  font-size:16px;
  padding-left: 1%;
  font-weight:bold;
  text-align:left;
  line-height: 35px;
}

.font_left{
  font-size:15px;
  padding-left: 1%;
  text-align:left;
  line-height: 35px;
}

.font_center{
  font-size:5px;
  padding-right: 1%;
  text-align:center;
  line-height: 33px;
}
.font_right{
  font-size:15px;
  padding-right: 1%;
  text-align:right;
  line-height: 35px;
}

.inputtextstyle{
margin :0px auto;
height:calc(100% - 10px);
width:calc(100% - 10px);
padding:0px 10px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle:focus {
border-color:#66AFE9;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.inputtextstyle_login{
margin :0px auto;
height:calc(100% - 10px);
width:calc(100% - 10px);
padding:0px 10px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_login:focus {
border-color:#66AFE9;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.inputtextstyle_checkbox{
margin :0px auto;
/*height:50px;
width:50px;*/
padding:0px 10px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_checkbox:focus {
border-color:#66AFE9;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.inputtextstyle_SM{
margin :0 auto;
height:25px;
width:calc(16% - 10px);
padding:0px 0px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_SM:focus {
border-color:#66AFE9;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}


.inputtextstyle_big{
margin:5px auto;
height:calc(100% - 10px);
width:calc(100% - 10px);
padding:0px 10px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_big:focus {
border-color:#1D641D;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.inputtextstyle_none{
height:calc(100% - 10px);
width:calc(100% - 10px);
padding:0px 10px;
background:white;
border-width:0px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_none:focus {
border-color:#66AFE9;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.inputtextstyle_list{
padding:0px 10px;
margin-top: 10x;
margin-bottom : 10px;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_list:focus {
border-color:#66AFE9;/*#66afe9;*/
outline: 0;
 -webkit-box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1pxrgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.btn_padding{
  margin :4PX auto;
}

.btn_padding_B{
  margin :10PX auto;
}

/*切割大小*/
.f1{float:left;margin-left:5px;margin-right:5px;width:calc(5% - 10px)}
.f2{float:left;margin-left:5px;margin-right:5px;width:calc(10% - 10px)}
.f3{float:left;margin-left:5px;margin-right:5px;width:calc(15% - 10px)}
.f4{float:left;margin-left:5px;margin-right:5px;width:calc(20% - 10px)}
.f5{float:left;margin-left:5px;margin-right:5px;width:calc(25% - 10px)}
.f6{float:left;margin-left:5px;margin-right:5px;width:calc(30% - 10px)}
.f7{float:left;margin-left:5px;margin-right:5px;width:calc(35% - 10px)}
.f8{float:left;margin-left:5px;margin-right:5px;width:calc(40% - 10px)}
.f9{float:left;margin-left:5px;margin-right:5px;width:calc(45% - 10px)}
.f10{float:left;margin-left:5px;margin-right:5px;width:calc(50% - 10px)}
.f11{float:left;margin-left:5px;margin-right:5px;width:calc(55% - 10px)}
.f12{float:left;margin-left:5px;margin-right:5px;width:calc(60% - 10px)}
.f13{float:left;margin-left:5px;margin-right:5px;width:calc(65% - 10px)}
.f14{float:left;margin-left:5px;margin-right:5px;width:calc(70% - 10px)}
.f15{float:left;margin-left:5px;margin-right:5px;width:calc(75% - 10px)}
.f16{float:left;margin-left:5px;margin-right:5px;width:calc(80% - 10px)}
.f17{float:left;margin-left:5px;margin-right:5px;width:calc(85% - 10px)}
.f18{float:left;margin-left:5px;margin-right:5px;width:calc(90% - 10px)}
.f19{float:left;margin-left:5px;margin-right:5px;width:calc(95% - 10px)}
.f20{float:left;margin-left:5px;margin-right:5px;width:calc(100% - 10px)}

.w1{float:left;width:5%}
.w2{float:left;width:10%}
.w3{float:left;width:15%}
.w4{float:left;width:20%}
.w5{float:left;width:25%}
.w6{float:left;width:30%}
.w7{float:left;width:35%}
.w8{float:left;width:40%}
.w9{float:left;width:45%}
.w10{float:left;width:50%}
.w11{float:left;width:55%}
.w12{float:left;width:60%}
.w13{float:left;width:65%}
.w14{float:left;width:70%}
.w15{float:left;width:75%}
.w16{float:left;width:80%}
.w17{float:left;width:85%}
.w18{float:left;width:90%}
.w19{float:left;width:95%}
.w20{width:100%;/*overflow:auto*/}
.w2aa{float:left;width:7%}
.w2bb{float:left;width:8%}


.l1{margin-left:calc(5% + 5px);margin-right:5px}
.l2{margin-left:calc(10% + 5px);margin-right:5px}
.l3{margin-left:calc(15% + 5px);margin-right:5px}
.l4{margin-left:calc(20% + 5px);margin-right:5px}
.l5{margin-left:calc(25% + 5px);margin-right:5px}
.l6{margin-left:calc(30% + 5px);margin-right:5px}
.l7{margin-left:calc(35% + 5px);margin-right:5px}
.l8{margin-left:calc(40% + 5px);margin-right:5px}
.l9{margin-left:calc(45% + 5px);margin-right:5px}
.l10{margin-left:calc(50% + 5px);margin-right:5px}
.l11{margin-left:calc(55% + 5px);margin-right:5px}
.l12{margin-left:calc(60% + 5px);margin-right:5px}
.l13{margin-left:calc(65% + 5px);margin-right:5px}
.l14{margin-left:calc(70% + 5px);margin-right:5px}
.l15{margin-left:calc(75% + 5px);margin-right:5px}
.l16{margin-left:calc(80 + 5px);margin-right:5px}
.l17{margin-left:calc(85% + 5px);margin-right:5px}
.l18{margin-left:calc(90% + 5px);margin-right:5px}
.l19{margin-left:calc(95% + 5px);margin-right:5px}

.s1{width:5%}
.s2{width:10%}
.s3{width:15%}
.s4{width:20%}
.s5{width:25%}
.s6{width:30%}
.s7{width:35%}
.s8{width:40%}
.s9{width:45%}
.s10{width:50%}
.s11{width:55%}
.s12{width:60%}
.s13{width:65%}
.s14{width:70%}
.s15{width:75%}
.s16{width:80%}
.s17{width:85%}
.s18{width:90%}
.s19{width:95%}
.s20{width:100%}

/*----最小----*/
@media (max-width: 320px) {
.container_form {
  width: 95%;
  padding: 0px;
  margin:0 auto;
}
.w1{float:left;width:100%}
.w2{float:left;width:100%}
.w3{float:left;width:100%}
.w4{float:left;width:100%}
.w5{float:left;width:100%}
.w6{float:left;width:100%}
.w7{float:left;width:100%}
.w8{float:left;width:100%}
.w9{float:left;width:100%}
.w10{float:left;width:100%}
.w11{float:left;width:100%}
.w12{float:left;width:100%}
.w13{float:left;width:100%}
.w14{float:left;width:100%}
.w15{float:left;width:100%}
.w16{float:left;width:100%}
.w17{float:left;width:100%}
.w18{float:left;width:100%}
.w19{float:left;width:100%}
.w20{width:100%;/*overflow:auto*/}

.s1{width:100%}
.s2{width:100%}
.s3{width:100%}
.s4{width:100%}
.s5{width:100%}
.s6{width:100%}
.s7{width:100%}
.s8{width:100%}
.s9{width:100%}
.s10{width:100%}
.s11{width:100%}
.s12{width:100%}
.s13{width:100%}
.s14{width:100%}
.s15{width:100%}
.s16{width:100%}
.s17{width:100%}
.s18{width:100%}
.s19{width:100%}
.s20{width:100%}

.font_right{
  font-size:15px;
  padding-left: 1%;
  text-align:left;
  line-height: 35px;
}
.form_border_WS_R{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.form_border_WS_RB_SM{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.form_border_WS_LB{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.form_border_WS_RB{
  height: 100px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}

}

/*----手機大小----*/
@media (min-width: 321px) and (max-width: 768px) {
.container_form {
  width: 95%;
  padding: 0px;
  margin:0 auto;
}
.w1{float:left;width:100%}
.w2{float:left;width:100%}
.w3{float:left;width:100%}
.w4{float:left;width:100%}
.w5{float:left;width:100%}
.w6{float:left;width:100%}
.w7{float:left;width:100%}
.w8{float:left;width:100%}
.w9{float:left;width:100%}
.w10{float:left;width:100%}
.w11{float:left;width:100%}
.w12{float:left;width:100%}
.w13{float:left;width:100%}
.w14{float:left;width:100%}
.w15{float:left;width:100%}
.w16{float:left;width:100%}
.w17{float:left;width:100%}
.w18{float:left;width:100%}
.w19{float:left;width:100%}
.w20{width:100%;/*overflow:auto*/}

.s1{width:100%}
.s2{width:100%}
.s3{width:100%}
.s4{width:100%}
.s5{width:100%}
.s6{width:100%}
.s7{width:100%}
.s8{width:100%}
.s9{width:100%}
.s10{width:100%}
.s11{width:100%}
.s12{width:100%}
.s13{width:100%}
.s14{width:100%}
.s15{width:100%}
.s16{width:100%}
.s17{width:100%}
.s18{width:100%}
.s19{width:100%}
.s20{width:100%}

.font_right{
  font-size:15px;
  padding-left: 1%;
  text-align:left;
  line-height: 35px;
}
.form_border_WS_R{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.form_border_WS_RB_SM{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.form_border_WS_LB{
  height: 35px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.form_border_WS_RB{
  height: 100px;
  background-color: white;
  border-color:gray;
  border-width:1px;
  border-left-style:solid;
  border-right-style:solid;
  border-bottom-style:solid;
}
.inputtextstyle{
margin :5px auto;
height:calc(100% - 10px);
width:calc(100% - 5px);
padding:0px 10px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_login{
margin :5px auto;
height:calc(100% - 10px);
width:calc(80% - 5px);
padding:0px 10px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.inputtextstyle_SM{
margin :0 auto;
height:25px;
width:calc(35% - 10px);
padding:0px 0px;
background:white;
border-width:1px;
border-style: solid;/*groove;*/
border-color:#C3C3C3;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.HEX{
  /*background:#00ffcca3;*/
  background:#FFFFFFa3;
  width:95%;
  margin: 0 auto;
}

}

/*----半螢幕大小----*/
@media (min-width: 769px) and (max-width: 1000px) {
.container_form {
  width: 95%;
  padding: 0px;
  margin:0 auto;
}

}