@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Noto+Serif+TC:wght@200..900&display=swap");
body {
  background-color: #ffd93e;
  font-family: "Noto Sans TC", sans-serif;
}

.wrapper {
  position: relative;
  width: 100%;
}

.logo {
  position: absolute;
  display: block;
}
@media (max-width: 991px) {
  .logo {
    left: 5.6508577195vw;
    top: 4.4399596367vw;
    width: 11.2008072654vw;
  }
}
@media (min-width: 992px) {
  .logo {
    left: 2.9166666667vw;
    top: 2.2916666667vw;
    width: 5.78125vw;
  }
}

.form-control::-moz-placeholder {
  color: #C1C1C1 !important;
  opacity: 1;
}

.form-control::placeholder {
  color: #C1C1C1 !important;
  opacity: 1;
}

h3 {
  font-weight: bold;
  color: #fff;
}
@media (max-width: 991px) {
  h3 {
    font-size: 5.4490413724vw;
    padding-top: 5.8526740666vw;
    padding-bottom: 5.4490413724vw;
  }
}
@media (min-width: 992px) {
  h3 {
    letter-spacing: 0.115em;
    font-size: 2.8125vw;
    padding-top: 3.0208333333vw;
    padding-bottom: 2.8125vw;
  }
}

form {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
  border: 1px solid #f7ad1a;
}
@media (max-width: 991px) {
  form {
    width: 94.8536831483vw;
    border-radius: 10.595358224vw;
    box-shadow: 0 0.4036326942vw 0.8072653885vw rgba(0, 0, 0, 0.1);
    padding-top: 13.1180625631vw;
    padding-left: 5.0454086781vw;
    padding-right: 5.0454086781vw;
    padding-bottom: 13.1180625631vw;
  }
}
@media (min-width: 992px) {
  form {
    width: 73.6458333333vw;
    height: 35.5729166667vw;
    border-radius: 5.46875vw;
    box-shadow: 0 0.2083333333vw 0.4166666667vw rgba(0, 0, 0, 0.1);
    padding-top: 6.7708333333vw;
    padding-left: 12.5520833333vw;
    padding-right: 12.5520833333vw;
  }
}

.form-label {
  font-weight: bold;
  color: #333;
}

@media (max-width: 991px) {
  .input-group {
    margin-bottom: 2.0181634712vw;
    border-radius: 3.229061554vw;
    border: 1px solid #f7ad1a;
    overflow: hidden;
  }
}
@media (min-width: 992px) {
  .input-group {
    height: 3.3333333333vw;
    margin-bottom: 1.71875vw;
  }
}
.input-group .form-label {
  background: #f7ad1a;
  color: #fff;
  text-align: center;
}
@media (max-width: 991px) {
  .input-group .form-label {
    width: 100%;
    height: 6.458123108vw;
    font-size: 3.6326942482vw;
    line-height: 6.458123108vw;
    border-radius: 0;
    margin-bottom: 0;
    border: none;
  }
}
@media (min-width: 992px) {
  .input-group .form-label {
    width: 15.46875vw;
    height: 3.3333333333vw;
    font-size: 1.4583333333vw;
    line-height: 3.3333333333vw;
    border-radius: 1.6666666667vw 0 0 1.6666666667vw;
    border: 1px solid #f7ad1a;
  }
}
@media (max-width: 991px) {
  .input-group .form-control {
    width: 100%;
    height: 8.2744702321vw;
    font-size: 3.6326942482vw;
    border-radius: 0;
    border: none;
  }
}
@media (min-width: 992px) {
  .input-group .form-control {
    width: 32.8125vw;
    height: 3.3333333333vw;
    font-size: 1.4583333333vw;
    border-radius: 0 1.6666666667vw 1.6666666667vw 0;
    border: 1px solid #f7ad1a;
  }
}
.input-group .form-control:focus {
  border-color: none;
  box-shadow: none;
}
@media (max-width: 991px) {
  .input-group #CAPTCHA {
    width: 50%;
    border-radius: 0 !important;
    border: none;
  }
}
@media (min-width: 992px) {
  .input-group #CAPTCHA {
    width: 20.8333333333vw;
    border-radius: 0 1.6666666667vw 1.6666666667vw 0 !important;
    border: 1px solid #f7ad1a;
  }
}
@media (max-width: 991px) {
  .input-group #CAPTCHA-text {
    height: 8.2744702321vw;
    line-height: 8.2744702321vw;
    padding-left: 2.0181634712vw;
    padding-right: 1.5136226034vw;
    font-size: 3.6326942482vw;
    background: #eee;
  }
}
@media (min-width: 992px) {
  .input-group #CAPTCHA-text {
    height: 3.3333333333vw;
    padding-left: 1.0416666667vw;
    padding-right: 0.78125vw;
    font-size: 1.8229166667vw;
  }
}
.input-group .btn-captcha-refresh {
  background: none;
  border: none;
  opacity: 0.4;
}
@media (max-width: 991px) {
  .input-group .btn-captcha-refresh {
    width: 8.2744702321vw;
    height: 8.2744702321vw;
    padding: 0.8072653885vw;
  }
}
@media (min-width: 992px) {
  .input-group .btn-captcha-refresh {
    width: 3.3333333333vw;
    height: 3.3333333333vw;
    padding: 0.3125vw;
  }
}

.btns {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap !important;
}
@media (max-width: 991px) {
  .btns {
    margin-top: 11.0998990918vw;
  }
}
@media (min-width: 992px) {
  .btns {
    margin-top: 5.7291666667vw;
  }
}
.btns a {
  text-decoration: none;
  border: 1px solid #f7ad1a;
  color: #f7ad1a;
  text-align: center;
  font-weight: bold;
  background: #ffffff;
}
@media (max-width: 991px) {
  .btns a {
    width: 35.3178607467vw;
    height: 6.0544904137vw;
    line-height: 5.0454086781vw;
    margin-left: 1.4127144299vw;
    margin-right: 1.4127144299vw;
    margin-bottom: 2.8254288597vw;
    font-size: 3.6326942482vw;
    border-radius: 3.0272452069vw;
  }
}
@media (min-width: 992px) {
  .btns a {
    width: 10.9375vw;
    height: 3.125vw;
    line-height: 2.8645833333vw;
    margin-left: 0.3645833333vw;
    margin-right: 0.3645833333vw;
    margin-bottom: 0.7291666667vw;
    font-size: 1.4583333333vw;
    border-radius: 1.5625vw;
    letter-spacing: 0.1em;
  }
}
.btns button {
  border: 1px solid #f7ad1a;
  background: #f7ad1a;
  color: #ffffff;
  text-align: center;
  font-weight: bold;
}
@media (max-width: 991px) {
  .btns button {
    width: 35.3178607467vw;
    height: 6.0544904137vw;
    line-height: 3.0272452069vw;
    margin-left: 1.4127144299vw;
    margin-right: 1.4127144299vw;
    margin-bottom: 2.8254288597vw;
    font-size: 3.6326942482vw;
    border-radius: 3.0272452069vw;
    padding-top: 0vw;
  }
}
@media (min-width: 992px) {
  .btns button {
    width: 10.9375vw;
    height: 3.125vw;
    line-height: 1.5625vw;
    margin-left: 0.3645833333vw;
    margin-right: 0.3645833333vw;
    margin-bottom: 0.7291666667vw;
    font-size: 1.4583333333vw;
    border-radius: 1.5625vw;
    padding-top: 0vw;
  }
}

.note {
  color: #8E8E8E;
}
@media (max-width: 991px) {
  .note {
    font-size: 3.6326942482vw;
  }
}
@media (min-width: 992px) {
  .note {
    font-size: 0.8333333333vw;
    letter-spacing: 0.1041666667vw;
  }
}