/*@charset "UTF-8";*/
html {
  width: 100%;
  height: 100%; }

body {
  width: 100%;
  height: 100%;
  color: #2e3233;
  font-size: 18px;
  line-height: 1.7;
  background-color: #e2e2e2;
  font-family: 'Noto Sans TC', sans-serif;
  letter-spacing: 0.05em; }

/**/
form {
  width: 100%;
  height: 100%; }

.page {
  width: 100%;
  height: 100%;
  position: relative; }
  .page .bg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px); }
  .page .header {
    width: 100%;
    height: 120px; }
    .page .header .container {
      background-color: #FFF; }
      .page .header .container h1 {
        height: 70px;
        margin-top: 25px;
        margin-bottom: 25px; }
        .page .header .container h1 .header-logo {
          height: 70px; }
  .page .content {
    width: 100%;
    height: calc(100% - 120px); }
    .page .content .container {
      background-color: #FFF;
      min-height: 100%; }

/*UI*/
.btn-demo {
  background-color: #cad532;
  color: #2e3233;
  font-size: 1em;
  font-weight: 300;
  padding-top: 10px;
  padding-bottom: 10px; }
  .btn-demo:hover, .btn-demo.hover {
    background-color: #9aa510;
    color: #2e3233; }
  .btn-demo:active, .btn-demo.active {
    background-color: #8c9700;
    color: #2e3233; }
  .btn-demo:focus, .btn-demo3focus {
    background-color: #8c9700;
    color: #2e3233; }
  .btn-demo:disabled, .btn-demo.disabled {
    background-color: #e4ea98;
    color: #9a9f6c; }

@media (min-width: 1200px) {
  .modal-lg {
    width: 1000px; } }
.page-index .bg {
  background-image: url(../images/bg-index.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%; }
.page-index .header .container {
  background-color: rgba(0, 0, 0, 0.5); }
.page-index .content .container {
  text-align: center;
  background-color: rgba(0, 0, 0, 0.5); }
  .page-index .content .container h2 {
    color: #FFF;
    text-shadow: 0px 2px 20px rgba(0, 0, 0, 0.9);
    font-weight: 400;
    font-size: 40px;
    margin: 0; }
  .page-index .content .container .btn-index {
    display: inline-block;
    color: #FFF;
    margin-top: 80px;
    margin-bottom: 80px; }
    .page-index .content .container .btn-index:hover, .page-index .content .container .btn-index.hover {
      color: #cad532; }
    .page-index .content .container .btn-index:active, .page-index .content .container .btn-index.active {
      color: #b4c115; }
  .page-index .content .container .slogan {
    color: #dce74b;
    font-weight: 400;
    margin-bottom: 0;
    line-height: 1.3em;
    font-size: 1.7em; }
  .page-index .content .container .slogan-en {
    color: #dce74b;
    font-weight: 400;
    margin-bottom: 0;
    line-height: 1.3em;
    letter-spacing: 0.05em;
    padding-right: 0.3em;
    font-size: 1.38em;
    margin-bottom: 50px; }

.page-grade .bg {
  background-image: url(../images/bg-grade.png);
  background-repeat: no-repeat;
  background-position: left -5% top;
  background-size: auto 100%; }
.page-grade .header .container {
  background-color: #FFF; }
  .page-grade .header .container .header-logo {
    display: none; }
.page-grade .content .container {
  background-color: #FFF;
  background-image: url(../images/bg-grade.png);
  background-repeat: no-repeat;
  background-position: left 8% bottom 0%;
  background-size: 33.33333333% auto; }
  .page-grade .content .container h2 {
    font-size: 1.7em;
    margin-top: 60px;
    margin-bottom: 50px;
    margin-left: 18px; }
    @media screen and (max-width: 767px) {
      .page-grade .content .container h2 {
        margin-top: 0px; } }
  .page-grade .content .container .btn-demo {
    margin: 18px; }
    .page-grade .content .container .btn-demo .uni-width {
      display: inline-block;
      width: 4em; }
      .page-grade .content .container .btn-demo .uni-width .grade-num {
        font-size: 1.6em;
        line-height: 1em;
        font-weight: 600;
        display: inline-block;
        vertical-align: middle;
        margin-right: 4px; }
      .page-grade .content .container .btn-demo .uni-width .grade-text {
        display: inline-block;
        vertical-align: middle; }
  .page-grade .content .container .for-padding {
    height: 180px; }

.modal-guide .modal-content {
  border: none; }
  .modal-guide .modal-content .modal-header {
    border-bottom: none;
    background-color: #cad532;
    border-radius: 6px 6px 0 0; }
    .modal-guide .modal-content .modal-header .modal-title {
      font-size: 1.6em;
      font-weight: 700; }
  .modal-guide .modal-content .modal-body {
    padding-left: 50px;
    padding-right: 50px; }
    .modal-guide .modal-content .modal-body ol li {
      margin-bottom: 10px; }
    .modal-guide .modal-content .modal-body .btn-demo {
      margin-top: 30px;
      margin-bottom: 30px; }

.page-test .bg {
  background-image: url(../images/bg-test.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%; }
.page-test .header {
  position: fixed;
  z-index: 1030; }
  .page-test .header .container {
    background-color: #FFF; }
.page-test .content {
  height: 100%;
  padding-top: 152px; }
  @media (min-width: 992px) {
    .page-test .content {
      padding-top: 120px; } }
  .page-test .content .container {
    background-color: #FFF;
    padding-bottom: 120px; }
    .page-test .content .container .test-warning {
      color: #ff2d1d;
      font-weight: 700; }

.div_text_item {
  margin-bottom: 48px; }
  .div_text_item .div_text_subject {
    margin-bottom: 20px; }

.modal-analyzing .modal-header {
  border-bottom: none; }
  .modal-analyzing .modal-header .modal-title {
    margin-top: 35px;
    margin-bottom: 35px; }
.modal-analyzing .modal-body {
  background-color: #cad532;
  border-radius: 0 0  6px 6px; }
  .modal-analyzing .modal-body > p {
    font-size: 1.8em;
    line-height: 1.4em; }

.progress-SRdemo {
  margin-top: 0px;
  height: 12px;
  background-color: #a6eef2;
  border-radius: 6px;
  position: relative;
  overflow: visible;
  margin-left: 5em;
  margin-right: 5em; }
  @media (min-width: 992px) {
    .progress-SRdemo {
      margin-top: 60px;
      margin-left: -30px;
      margin-right: -30px; } }
  .progress-SRdemo .progress-bar {
    background-color: #3cabb2;
    color: #3cabb2;
    border-radius: 6px;
    font-size: 1em;
    line-height: 1em;
    text-align: center; }
    .progress-SRdemo .progress-bar .progress-bar-text {
      position: absolute;
      left: -5em;
      top: -.25em;
      width: 5em; }
    .progress-SRdemo .progress-bar .progress-bar-precent {
      position: absolute;
      right: -4em;
      top: -.25em;
      width: 4em; }

.test-analyzing {
  width: 160px;
  height: 160px;
  margin: 50px auto;
  position: relative; }
  .test-analyzing .test-analyzing-text {
    width: 160px;
    height: 160px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -80px;
    text-align: center;
    line-height: 160px;
    color: #378a25;
    font-size: 2em; }

.page-result .bg {
  background-image: url(../images/bg-result.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%; }
.page-result .header .container {
  background-color: #FFF; }
.page-result .content .container {
  background-color: #FFF; }
@media (min-width: 992px) {
  .page-result .for-padding {
    padding-right: 30px; } }
@media (min-width: 1200px) {
  .page-result .for-padding {
    padding-right: 80px; } }

.result-item {
  text-align: center; }
  .result-item .result-item-title {
    font-size: 1.4em; }
    .result-item .result-item-title > img {
      display: inline-block;
      vertical-align: text-bottom;
      margin-right: 5px; }
  .result-item .result-item-content {
    color: #378a25;
    font-size: 1.4em;
    line-height: 1em;
    margin-top: 25px;
    margin-bottom: 25px; }
    .result-item .result-item-content label {
      font-size: 2.5em;
      font-weight: 400; }

.result-item.ability {
  margin-top: 0px; }
  @media (min-width: 992px) {
    .result-item.ability {
      margin-top: 45px; } }

.result-item.range {
  margin-top: 100px;
  margin-bottom: 100px; }
  @media (min-width: 992px) {
    .result-item.range {
      margin-top: 140px;
      margin-bottom: 0px; } }

.bookList-item {
  border: 1px solid #c6c6c6;
  background-color: #FFF;
  padding: 15px 15px 15px 15px;
  margin-bottom: 30px; }
  .bookList-item .frontCover {
    height: 200px;
    margin-top: 20px -15px;
    position: relative;
    overflow: hidden; }
    .bookList-item .frontCover > img.frontCover-img {
      height: 200px; }
  .bookList-item > h4 {
    font-weight: 700;
    height: 1em;
    overflow: hidden;
    margin-top: 20px;
    margin-bottom: 20px; }
  .bookList-item > p {
    display: block;
    color: #378a25;
    margin-bottom: 5px; }

/*# sourceMappingURL=styles.css.map */