:root {
  --bs-body-bg:#fff;
  --bs-nav-bg:#ffffffc8;
  --bs-login-bg:#F4F3EE;
  --bs-font-color:#333333;
  --bs-main-red: #a63648;
  --bs-main-gray: #EEF0F0;
  --bs-main-blue:#2B70B6;
  --bs-main-green:#51AA8B;
  --bs-main-orang:#DE4719;
  --bs-main-blue-d:#034559;
  --bs-red-ncku-01: #3F030D;
  --bs-red-ncku-02: #9c2034;
  --bs-book-ncku-01: #826642;
  --bs-gray-ncku-01: #545458;
  --bs-gray-ncku-02: #e1e1e1;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
}

/* 罕用字，不能刪 */
@font-face {
    font-family: 'EudcKai';
    src: url('https://i.ncku.edu.tw/ncku/ncku_cns/font/EUDCKAI.TTF');
    font-display: fallback;
    unicode-range:  U+E000-EFFF, U+F000-F848 ;
}
@font-face {
    font-family: 'EudcMing';
    src: url('https://i.ncku.edu.tw/ncku/ncku_cns/font/EudcMing.TTF');
    font-display: fallback;
    unicode-range:  U+E000-EFFF, U+F000-F848 ;
}
body {
    margin: 0;
    font-family: -apple-system,  BlinkMacSystemFont,  "Microsoft JhengHei", "EudcKai"  , "EudcMing"  ,"Segoe UI",  "Roboto",  "Helvetica Neue", Arial, sans-serif,  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-align: var(--bs-body-text-align);
    background-color: var(--bs-body-bg);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: var(--bs-login-bg);
}

  /* 文字及背景用色 */
.font-main-red {
    color:var(--bs-main-red);
}
.font-main-blue {
  color: var(--bs-main-blue);
}
.font-main-blue-d {
  color: var(--bs-main-blue-d);
}
.font-main-green {
  color: var(--bs-main-green);
}
.font-main-orang {
  color: var(--bs-main-orang);
}
.font-main-gray {
  color:var(--bs-main-gray);
}
.font-book {
  color:var(--bs-book-ncku-01);
}
.font-blue02 {
  color:var(--bs-blue-ncku-02);
}
.font-red-ncku-01 {
  color: var(--bs-red-ncku-01);
}
.font-gray-600 {
  color:var(--bs-gray-600);
}
.font-gray-700 {
  color:var(--bs-gray-700);
}
.font-gray-900 {
  color:var(--bs-gray-900);
}
.text-bg-main {
  color: #fff !important;
  background-color: var(--bs-main-green) !important;
}
.error {
  color: var(--bs-red-ncku-03);
  font-weight: bold;
}
.bg-main-red {
  background: var(--bs-main-red);
}
.bg-main-gray {
  background: var(--bs-main-gray);
}
.bg-main-blue {
  background: var(--bs-main-blue);
}
.bg-main-green {
  background: var(--bs-main-green);
}
.bg-main-orang {
  background: var(--bs-main-orang);
}
.bg-main-white {
  background: var(--bs-nav-bg);
}
.bg-blue-ncku-01 {
    background: var(--bs-blue-ncku-01);
}
.bg-red-ncku-03 {
    background: var(--bs-red-ncku-03);
}
.bg-red-ncku-00 {
    background: #9c2034c9;
}
.bg-gray-ncku-03 {
    background: var(--bs-gray-ncku-03);
}
.bg-login-top {
    background: var(--bs-login-bg);
}
.bg-book-ncku-02 {
    background: var(--bs-book-ncku-02);
}
.error {
    color:var(--bs-red-ncku-02)!important;
    font-weight: bold;
}
.font-engword {
    word-break: keep-all;
}
.modal .fade .modal-dialog .modal-body{
    z-index: 1030;
}
.modal-header {
    background: var(--bs-main-green);
    color: #fff;
}
.form-check-input:checked {
  background-color: var(--bs-main-red);
  border-color: var(--bs-main-red);
}
footer {
    /* background: #f3f4f5; */
    flex: 0 0 auto;
    }

.cardfooter-text {
    font-size: .9rem;
    line-height: 1.5;
  }
.copyright-text {
    font-size: .8rem;
    line-height: 1.3;
  }

:root {
    --period-kind-color-02: #d0cafa; /*中午*/
    --period-kind-color-04: #ebf7c3; /*傍晚*/
    --period-kind-color-05: #d0d0d0; /*夜間*/
}

/* 登入頁 */
@media (min-width: 1600px) {
  .container-xxxl {
    max-width: 1600px;
  }
}
.container-xxxl {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x)* .5);
  padding-left: calc(var(--bs-gutter-x)* .5);
  margin-right: auto;
  margin-left: auto;
}
.btn-language {
  width: 50px;
  height: 50px;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
  cursor: pointer;
  z-index: 999;
  font-size: .75rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-main {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-main-red);
  --bs-btn-border-color: var(--bs-main-red);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-red-ncku-01);
  --bs-btn-hover-border-color: var(--bs-red-ncku-01);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-main-red);
  --bs-btn-active-border-color: var(--bs-main-red);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-gray-600);
  --bs-btn-disabled-border-color: var(--bs-gray-600);
}
.btn-main-blue {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-main-blue);
  --bs-btn-border-color: var(--bs-main-blue);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-main-red);
  --bs-btn-hover-border-color: var(--bs-main-red);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-main-blue);
  --bs-btn-active-border-color: var(--bs-main-blue);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-gray-600);
  --bs-btn-disabled-border-color: var(--bs-gray-600);
}
.btn-main-green {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-main-green);
  --bs-btn-border-color: var(--bs-main-green);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-main-red);
  --bs-btn-hover-border-color: var(--bs-main-red);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-main-green);
  --bs-btn-active-border-color: var(--bs-main-green);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-gray-600);
  --bs-btn-disabled-border-color: var(--bs-gray-600);
}
.btn-main-orang {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-main-orang);
  --bs-btn-border-color: var(--bs-main-orang);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-main-red);
  --bs-btn-hover-border-color: var(--bs-main-red);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-main-orang);
  --bs-btn-active-border-color: var(--bs-main-orangn);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-gray-600);
  --bs-btn-disabled-border-color: var(--bs-gray-600);
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-red-ncku-01);
  --bs-btn-border-color: var(--bs-red-ncku-01);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-main-red);
  --bs-btn-hover-border-color: var(---bs-main-red);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-red-ncku-01);
  --bs-btn-active-border-color: var(--bs-red-ncku-01);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-gray-ncku-01);
  --bs-btn-disabled-border-color: var(--bs-gray-ncku-01);
}
.btn-default {
    --bs-btn-color: #535353;
    --bs-btn-bg: #e4ebf1;
    --bs-btn-border-color: #cfcfd1;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #515151;
    --bs-btn-hover-border-color: #535353;
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #535353;
    --bs-btn-active-border-color: #51585e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #6c757d;
    --bs-btn-disabled-border-color: #6c757d;
}
.btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: #00916f;
  --bs-btn-border-color: ##00916f;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #157347;
  --bs-btn-hover-border-color: #146c43;
  --bs-btn-focus-shadow-rgb: 60, 153, 110;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #00916f;
  --bs-btn-active-border-color: #00916f;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #198754;
  --bs-btn-disabled-border-color: #198754;
}

/* 登入頁 */
.login-block-bg {
  background: transparent linear-gradient(220deg, #FDFBF6 0%, #ffffffbf 100%) 0% 0% no-repeat padding-box;
  border: 10px solid #FFFFFF;
  border-radius: 4rem;
}
.common-bg {
  background: transparent linear-gradient(220deg, #f8f8f8b0 0%, #ffffff96 100%) 0% 0% no-repeat padding-box;
  border: 5px solid #FFFFFF;
  border-radius: 1.6rem;
}

.date_bg {
  background: var(--bs-main-green);
  color: #fff;
  border-radius: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 登入後 */
.nav-link {
  color: var(--bs-font-color);
  padding-left: 10px;
  padding-right: 10px;
}
.form-check-input {
  background-color: #fff;
  border: 1.5px solid #888888;
}
/* 選單 */
.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: var(--bs-main-red);
}
/* 頁籤 */
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
  color: #ffffff;
  background-color: var(--bs-main-orang);
  border-color: var(--bs-main-orang);
}
.nav-tabs {
  --bs-nav-tabs-border-width: var(--bs-border-width);
  --bs-nav-tabs-border-color: var(--bs-main-orang);
  --bs-nav-tabs-border-radius: var(--bs-border-radius);
  --bs-nav-tabs-link-hover-border-color: #a63648;
  --bs-nav-tabs-link-active-color: var(--bs-emphasis-color);
  --bs-nav-tabs-link-active-bg: var(--bs-body-bg);
  --bs-nav-tabs-link-active-border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-body-bg);
  border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color);
}

.nav-tabs .nav-link {
  border: var(--bs-nav-tabs-border-width) solid var(--bs-main-orang);
  background: #f9fbfc;
}
.nav-tabs .nav-link:hover {
  isolation: isolate;
  border-color: var(--bs-main-orang);
}
/* grid 按鈕 */
button.grid_button[name="add"],
button.grid_button[name="B-add"],
button.grid_button[name="A-add"],
input.grid_button[name="add"],
input.grid_button[name="show_test"] {
  color: #fff;
  background-color: #084298;
  border:#084298;
}

button.grid_button[name="upd"],
button.grid_button[name="B-upd"],
button.grid_button[name="A-upd"],
button.grid_button[name="view_update"],
button.grid_button[name="finish_ftalk"],
button.grid_button[name="avlblt"],
button.grid_button[name="update"],
input.grid_button[name="fill_record"],
input.grid_button[name="upd"] {
  color: #fff;
  background-color: #0aa2c0;
  border:#0aa2c0;
}
button.grid_button[name="update_avlblt"] {
  color: #fff;
  background-color: #6ea8fe;
  border:#6ea8fe;
}
button.grid_button[name="del"],
button.grid_button[name="B-del"],
button.grid_button[name="A-del"],
button.grid_button[name="cancel"],
button.grid_button[name="clear_record"],
button.grid_button[name="delete"],
button.grid_button[name="cancel_close"],
input.grid_button[name="del"] {
  color: #fff;
  background-color: #dc3545;
  border:#dc3545;
}

button.grid_button[name="disable"],
button.grid_button[name="change-status"],
input.grid_button[name="rename"],
button.grid_button[name="unlock"],
input.grid_button[name="disable"] {
  color: #fff;
  background-color: #842029;
  border:#842029;
}

:disabled {
  opacity:.2;
  pointer-events: none;
}

button.grid_button[name="A-clear"] {
  color: #fff;
  background-color: #b14e5e;
  border:#b14e5e;
}

button.grid_button[name="reassign"],
button.grid_button[name="correct_name"] {
  color: #fff;
  background-color: #1aa179;
  border:#1aa179;
}
button.grid_button[name="enable"],
button.grid_button[name="view_close"],
button.grid_button[name="assign"],
button.grid_button[name="counsel"],
input.grid_button[name="show_result"],
input.grid_button[name="enable"] {
  color: #fff;
  background-color: #1fab98;
  border:#1fab98;
}

button.grid_button[name="up"],
input.grid_button[name="up"] {
  color: #000;
  background-color: #ced4da;
  border:#ced4da;
}

button.grid_button[name="down"],
input.grid_button[name="down"] {
  color: #000;
  background-color: #adb5bd;
  border:#adb5bd;
}

button.grid_button[name="save"],
button.grid_button[name="A-send"],
button.grid_button[name="close"],
button.grid_button[name="B-resol"],
input.grid_button[name="save"] {
  color: #fff;
  background-color: #3F030D;
  border:#3F030D;
}
button.grid_button[name="view"],
button.grid_button[name="stat"],
button.grid_button[name="view_email"],
button.grid_button[name="B-view"],
button.grid_button[name="A-view"],
input.grid_button[name="view_email"],
input.grid_button[name="statistics"] {
  color: #fff;
  background-color: #ca6510;
  border:#ca6510;
}

/* 首頁頁籤用 */
.ui-widget {
  font-family: -apple-system,  BlinkMacSystemFont,  "Microsoft JhengHei", "EudcKai"  , "EudcMing"  ,"Segoe UI",  "Roboto",  "Helvetica Neue", Arial, sans-serif,  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"!important;
  font-size: 1em;
}

#detail_tabs .ui-widget-header {
  border: 0px;
  background: #e9e9e900;
  color: #333;
  font-weight: bold;
  border-bottom: 1px solid #e4ebf1;
  border-radius: 0px;
}

#detail_tabs .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
  border: 1px solid var(--bs-main-orang);
  border-bottom:0px;
  background: var(--bs-main-orang);
  font-weight: normal;
  color: #fff;
}

#detail_tabs .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
  border: 1px solid var(--bs-main-orang);
  font-weight: normal;
}
.date-input {
  border-radius: 5px;
  border: .5px solid #0499c7c0;
  padding: 5px 8px;
}
.to-purify, .to-purify-inplace {
  visibility: hidden;
}

/* 選單靠右 */
@media (min-width: 992px) {
  .navbar-expand-lg .offcanvas .offcanvas-body {
      display: flex;
      flex-grow: 0;
      padding: 0;
      overflow-y: visible;
      justify-content: flex-end;
  }
}
  /* 下拉選單靠右才不會跑出版面 */
.dropdown-menu[data-bs-popper] {
    top: 100%;
    right: 0;
    left:auto;
}

/* jQuery BlockUI 插件 */
div.blockMsg {
    width: 300px;
    text-align: center;
    background: #0aa2c0!important;
    color: #fff!important;
    border:5px solid #f5f5f5!important;
    border-radius: 90px;
    opacity:.70;
}
div.blockMsg p {
  font-size:20px;
  padding-top:15px;
}
@media (max-width: 575.99px) {
    div.blockMsg {
      width:90%!important;
      left:5%!important;
      text-align: center;
      background: #0aa2c0!important;
      color: #fff!important;
      border:5px solid #f5f5f5!important;
      border-radius: 90px;
      opacity:.70;
      font-size:20px;
  }
}

/* 收合下拉 */
.accordion-button:not(.collapsed) {
  color: #ffffff;
  background-color: #c0727e;
  box-shadow: inset 0 calc(-1* var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}

#cle-cke-style{
  .ck-editor__editable_inline:not(.ck-comment__input *) {
    height: var(--cle-cke-height, 20rem);
    overflow-y: auto;
  }
}