@charset "UTF-8";
:root {
  --fzSecTitle: 28px;
  --fz3: 24px;
}

@media screen and (min-width: 768px) {
  :root {
    /* Font size - width 991px up (desktop) */
    --fzSecTitle: 32px;
    --fztSecContenTitle: 30px;
    --fz2: 28px;
    --fz3: 24px;
    --fz4: 20px;
  }
}
/* 
::-webkit-scrollbar {
    display: unset !important;
} */
.form-main {
  /* @media (min-width: 769px) {
      .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
          float: left;
      }
  } */
  /****************
    form start  
    from: https://beta3w.pcschool.com.tw/2024/css/content.css
    直接複製的 form 模板
  ****************/
  /* 有用到頁：設計課程頁、資訊課程頁、政府職訓課程詳情 */
  /* layout rules: 
  form-col, form-col-lg-6, form-col-12 
  from bootstrap5's col, col-6 ...
  */
  /* custom */
  /* 已詳細閱讀... */
}
.form-main .row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  /* margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x)); */
}
.form-main .justify-content-center {
  justify-content: center !important;
}
.form-main .clearfix:before,
.form-main .clearfix:after,
.form-main .dl-horizontal dd:before,
.form-main .dl-horizontal dd:after,
.form-main .container:before,
.form-main .container:after,
.form-main .container-fluid:before,
.form-main .container-fluid:after,
.form-main .row:before,
.form-main .row:after,
.form-main .form-horizontal .form-group:before,
.form-main .form-horizontal .form-group:after,
.form-main .btn-toolbar:before,
.form-main .btn-toolbar:after,
.form-main .btn-group-vertical > .btn-group:before,
.form-main .btn-group-vertical > .btn-group:after,
.form-main .nav:before,
.form-main .nav:after,
.form-main .navbar:before,
.form-main .navbar:after,
.form-main .navbar-header:before,
.form-main .navbar-header:after,
.form-main .navbar-collapse:before,
.form-main .navbar-collapse:after,
.form-main .pager:before,
.form-main .pager:after,
.form-main .panel-body:before,
.form-main .panel-body:after,
.form-main .modal-header:before,
.form-main .modal-header:after,
.form-main .modal-footer:before,
.form-main .modal-footer:after {
  content: " ";
  display: table;
}
.form-main .col-xs-1,
.form-main .col-xs-2,
.form-main .col-xs-3,
.form-main .col-xs-4,
.form-main .col-xs-5,
.form-main .col-xs-6,
.form-main .col-xs-7,
.form-main .col-xs-8,
.form-main .col-xs-9,
.form-main .col-xs-10,
.form-main .col-xs-11,
.form-main .col-xs-12 {
  float: left;
}
.form-main .col-xs-1,
.form-main .col-sm-1,
.form-main .col-md-1,
.form-main .col-lg-1,
.form-main .col-xs-2,
.form-main .col-sm-2,
.form-main .col-md-2,
.form-main .col-lg-2,
.form-main .col-xs-3,
.form-main .col-sm-3,
.form-main .col-md-3,
.form-main .col-lg-3,
.form-main .col-xs-4,
.form-main .col-sm-4,
.form-main .col-md-4,
.form-main .col-lg-4,
.form-main .col-xs-5,
.form-main .col-sm-5,
.form-main .col-md-5,
.form-main .col-lg-5,
.form-main .col-xs-6,
.form-main .col-sm-6,
.form-main .col-md-6,
.form-main .col-lg-6,
.form-main .col-xs-7,
.form-main .col-sm-7,
.form-main .col-md-7,
.form-main .col-lg-7,
.form-main .col-xs-8,
.form-main .col-sm-8,
.form-main .col-md-8,
.form-main .col-lg-8,
.form-main .col-xs-9,
.form-main .col-sm-9,
.form-main .col-md-9,
.form-main .col-lg-9,
.form-main .col-xs-10,
.form-main .col-sm-10,
.form-main .col-md-10,
.form-main .col-lg-10,
.form-main .col-xs-11,
.form-main .col-sm-11,
.form-main .col-md-11,
.form-main .col-lg-11,
.form-main .col-xs-12,
.form-main .col-sm-12,
.form-main .col-md-12,
.form-main .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
.form-main .d-none {
  display: none !important;
}
@media (min-width: 768px) {
  .form-main .d-md-block {
    display: block !important;
  }
  .form-main .d-md-none {
    display: none !important;
  }
}
.form-main .col-xs-12 {
  width: 100%;
}
.form-main .col-12 {
  flex: 0 0 auto;
  width: 100%;
}
@media (min-width: 768px) {
  .form-main .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
}
.form-main .text-small {
  font-size: 75%;
}
.form-main .has-error {
  color: #c00000;
  font-size: 80%;
}
.form-main .agreeLink,
.form-main .agreeLink:hover,
.form-main .agreeLink:visited,
.form-main .agreeLink:focus {
  color: #333333 !important;
}
.form-main .form-contact input:not([type=checkbox]),
.form-main .form-contact select {
  width: 100%;
  height: 40px;
  line-height: 1;
  max-height: 40px;
  font-size: 16px;
  font-weight: 500;
  background-color: #fff;
  border: 1px solid #b1b1b1;
  color: var(--text-gray);
  border-radius: 5px;
  padding: 5px;
  -webkit-appearance: auto;
}
.form-main .form-contact input:not([type=checkbox]):focus,
.form-main .form-contact select:focus {
  outline: 0;
  border-color: var(--link);
}
.form-main .form-contact input[type=checkbox] {
  border: 1px solid;
}
.form-main .form-contact .row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  /* margin-top: calc(-1* var(--bs-gutter-y));
  margin-right: calc(-0.5* var(--bs-gutter-x));
  margin-left: calc(-0.5* var(--bs-gutter-x)); */
  margin: auto;
  width: 100%;
}
.form-main .form-contact .btn-wrapper {
  text-align: center;
  width: 100%;
}
.form-main .form-contact .row .btn-theme {
  background-color: #c00000;
  color: #ffffff;
  font-weight: 500;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5rem 5rem;
  min-width: 200px;
  margin: 5px auto 24px;
  display: inline-block;
}
.form-main .form-col {
  flex: 1 0 0%;
  padding-bottom: 1rem;
}
.form-main .form-col-lg-6 {
  padding-bottom: 1rem;
  width: 100%;
}
.form-main .form-col-12 {
  flex: 0 0 auto;
  width: 100%;
  padding-bottom: 1rem;
}
.form-main .form-read-group .form-check .form-check-label .read-note {
  font-weight: normal;
}
.form-main .form-read-group .form-check .form-check-label .read-link {
  display: inline;
  color: #c00000;
}
.form-main .read-group .btn-wrapper {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.form-main .read-link {
  font-weight: 400;
  color: var(--text-bk);
  text-decoration: underline;
  display: inline;
}
@media screen and (min-width: 992px) {
  .form-main {
    /* layout rules: 
    form-col, form-col-lg-6, form-col-12 
    from bootstrap5's col, col-6 ...
    */
    /* custom */
    /* 已詳細閱讀... */
  }
  .form-main .form-col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .form-main .form-col-lg-6:nth-of-type(1) {
    padding-right: 6px;
  }
  .form-main .form-col-lg-6:nth-of-type(2) {
    padding-left: 6px;
  }
}

/****************
  form end 
****************/
/****************
  form main 
  2025/10上線版，統一報名表單，可以放在任一地方
  名人推薦集合頁、內頁長相一樣，檔案略有差異 
  start
****************/
.form-main {
  padding: 20px 0 20px;
  background-image: url("../../2025/images/bg-testimonial-form.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 100% 50%;
  /* background-attachment: fixed; */
  position: relative;
  margin-left: -8px;
  margin-right: -8px;
  width: 104%;
}

.form-main .form-container {
  max-width: 1200px;
  margin: auto;
}

.form-main .form-header {
  padding: 0.5rem 0 0.2rem;
  text-align: center;
}
.form-main .form-header .section-title,
.form-main .form-header .section-title2 {
  margin-bottom: 0;
  text-shadow: 1px 1px 5px #ffffff;
  font-size: var(--fzSecTitle);
  font-weight: 700;
}
.form-main .form-contact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin-bottom: 5%;
}
.form-main .form-contact-inside {
  padding: 10px;
  background-color: rgba(255, 255, 255, 0.568627451);
  border-radius: 10px;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  box-shadow: 0 0 5px #bbbbbb;
}
.form-main .form-contact-deco {
  padding: 0 15px 0%;
  text-align: center;
  position: relative;
}
.form-main .form-contact-deco .img {
  width: 100%;
  max-width: 450px;
}

@media (min-width: 768px) {
  .form-main {
    padding: 6% 0 0;
  }
  .form-main .form-container {
    padding-bottom: 0%;
  }
  .form-main .form-contact-inside {
    width: 100%;
  }
  .form-main .form-contact-deco {
    order: 1;
  }
  .form-main .form-contact-deco .img {
    max-width: 100%;
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
  }
}
/****************
  form main 
  2025/10上線版，統一報名表單，可以放在任一地方
  名人推薦集合頁、內頁長相一樣，檔案略有差異 
  end
****************//*# sourceMappingURL=form-main00.css.map */