/* CSS Document */
@page {
  size: auto;
}
a[href^="tel"] {
  text-decoration: inherit;
  color: inherit;
}
*:focus {
  outline: none;
  border-color: inherit;
  -webkit-box-shadow: none;
  box-shadow: none;
}
body {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  font-size: 20px;
  color: #000;
  background-color: #f1f2f3;
}
input,
textarea,
select {
  box-shadow: none !important;
  -webkit-appearance: none;
}
/* PickerDate */
div.datepicker.datepicker-dropdown.dropdown-menu {
  min-width: 500px;
}
.datepicker table {
  width: 100%;
}
.datepicker thead td,
.datepicker thead th {
  font-size: 18px;
}
.datepicker td,
.datepicker th {
  width: 40px;
  height: 40px;
}
@media only screen and (max-width: 414px) {
  div.datepicker.datepicker-dropdown.dropdown-menu {
    left: 0 !important;
    min-width: 84%;
    margin: 2px 2rem;
  }
  .datepicker table {
    width: 100%;
  }
  .datepicker td,
  .datepicker th {
    width: 40px;
    height: 40px;
  }
}
/* /. Picker Date */
.form-control {
  color: #000; /*333*/
}
.body_bg_w {
  background-color: #ffffff;
}
.body_bg_grey_eee,
.bg_grey_eee {
  background-color: #eee;
}
.body_bg_grey_333 {
  background-color: #333;
}
.body_bg_grey_222 {
  background-color: #222;
}
.body_bg_grey_111 {
  background-color: #111;
}
.body_bg_grey_17 {
  background-color: #171717;
}
.bg_grey_333 {
  background-color: #333 !important;
}
.bg_grey_2c {
  background-color: #2c2c2c !important;
}
.bg_grey_222 {
  background-color: #222 !important;
}
.bg_grey_111 {
  background-color: #111 !important;
}
.bg_grey_17 {
  background-color: #171717 !important;
}
.bg_grey_e5 {
  background-color: #e5e5e5 !important;
}
.bg_grey_ee {
  background-color: #eeeeee !important;
}
.bg_grey_cc {
  background-color: #cccccc !important;
}
.bg_grey_f1f2f3 {
  background-color: #f1f2f3 !important;
}
.bg_grey_FAFBFC {
  background-color: #fafbfc !important;
}
.bg_grey_fa {
  background-color: #fafafa !important;
}
.bg_grey_f4 {
  background-color: #f4f4f4 !important;
}
.bg_grey_f6 {
  background-color: #f6f6f6 !important;
}
a {
  color: #000; /*404040*/
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a:hover {
  color: #e7383b;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a.link_blue {
  color: #b1261f;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a.link_blue:hover {
  color: #95b3d7;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
.sidebar:not(.bg-transparent) .card .card {
  border-width: 0px;
}
.fa-1dot2x {
  font-size: 1.2em;
}
.fa-1dot5x {
  font-size: 1.5em;
}
.navbar-xl .navbar-nav-link {
  padding: 1.25rem 0.4rem 1rem 0.4rem;
}
.navbar-xl .navbar-brand {
  padding-top: 0rem;
  padding-bottom: 0rem;
}
.navbar-brand img {
  height: 2rem;
  display: block;
}
.navbar-top {
  padding-top: 3.15rem;
}
.navbar-top_50p {
  padding-top: 50px;
}
.navbar-top_54p {
  padding-top: 54px;
}
.navbar-light {
  color: #444444;
  background-color: #fff;
  border-bottom-color: rgba(0, 0, 0, 0.125);
  border-bottom: 1px solid #ececec;
}
.navbar-xl:first-child
  ~ .page-content
  .sidebar:not(.sidebar-component)
  .sidebar-content {
  top: 3.15rem;
}
.sidebar-content.top-0 {
  top: 0rem !important;
}
.sidebar-light {
  background-color: #fff;
  color: #000;
  border-right: 1px solid #ececec;
  background-clip: content-box;
}
.sidebar-light .nav-sidebar .nav-item > .nav-link.active {
  background-color: transparent;
  color: #cc0000;
}
.txt_navtab {
  font-family: "TrueTextOnline-Bold";
  font-size: 16px;
}
.txt_iconmenuleft {
  font-family: "TrueTextOnline-Regular";
  font-size: 12px;
  line-height: 1.5;
}
.txt_navtab-user {
  font-family: "TrueTextOnline-Regular";
  font-size: 18px;
  color: #353535;
}
.badge {
  padding: 0.2rem 0.375rem;
  font-size: 70%;
}
.badge_25p {
  position: absolute;
  top: 25px;
  right: 25px;
  font-size: 0.7em;
  background: green;
  color: white;
  min-width: 25px;
  height: 25px;
  text-align: center;
  line-height: 18px;
  border-radius: 50%;
  padding: 0.3rem;
}
.badge_50p {
  float: left;
  left: 25px;
  margin: 6px;
  position: relative;
  top: 25px;
}
.badge_red {
  background-color: red;
  border: 2px solid white;
  border-radius: 12px;
  box-shadow: 1px 1px 1px black;
  color: white;
  font: bold 15px/13px Helvetica, Verdana, Tahoma;
  height: 16px;
  padding: 4px 3px 0 3px;
  text-align: center;
  min-width: 14px;
}
.navbar-light .navbar-nav-link,
.sidebar-light .nav-sidebar .nav-link,
.navbar-light .navbar-toggler,
a.breadcrumb-elements-item,
a.breadcrumb-item,
.sidebar-light .sidebar-mobile-toggler a,
.sidebar-light .sidebar-mobile-toggler a:hover,
.sidebar-light .sidebar-mobile-toggler,
.text-default {
  color: #888; /*rgba(166, 166, 166, 1)*/
}
.sidebar-light .nav-sidebar .nav-link.txt_black {
  color: #000;
}
.bg_blue_light {
  background-color: #c5d7ea;
}
.bg_blue {
  background-color: #b1261f;
}
.bg_grey_40 {
  background-color: #404040;
}
.bg_grey_444 {
  background-color: #444444;
}
.bg_grey_4A {
  background-color: #4a4a4a;
}
.bg_dark_red {
  background-color: #e06666;
}
.bg_dark_blue {
  background-color: #3d85c6;
}
.bg_body_blue_light {
  background-color: #f6f9fc;
}
.bg_body_grey_f6 {
  background-color: #f6f6f6;
}
.bg_body_grey_f1 {
  background-color: #f1f1f1;
}
.text_grey {
  color: #999999 !important;
}
.text_blue {
  color: #3d85c6 !important;
}
.text_green {
  color: #6aa84f !important;
}
.text_light_green {
  color: #93c47d !important;
}
.text_yellow {
  color: #f1c232 !important;
}
.text_gold {
  color: #f9a600 !important;
}
.text_orange {
  color: #ff8000 !important;
}
.text_red {
  color: #cc4125 !important;
}
.container_1000p {
  max-width: 1030px !important;
}
.txt_blue {
  color: #00aee4 !important;
}
.txt_blue2 {
  color: #4282be;
}
.txt_black {
  color: #000;
}
.txt_black a {
  color: #000;
}
.txt_black a:hover {
  color: #b1261f;
}
.table_xl td,
.table_xl th {
  padding: 0.8rem 1.25rem !important;
  border-bottom: 1px solid #ddd;
  border-top: 0px;
}
.table_lg td,
.table_lg th {
  padding: 0.8rem 1.25rem !important;
  border-bottom: 1px solid #ddd;
  border-top: 0px;
}
.table_sm td,
.table_sm th {
  padding: 0.1rem 0.7rem !important;
  border: 1px solid #dddddd;
}
.table_sm td {
  padding: 0.1rem 0.7rem !important;
  border: 1px solid #dddddd;
  line-height: 1.2;
}
.table_sm tr:first-child th {
  padding: 0.1rem 0.2rem !important;
  border-bottom: 1px solid #ddd;
  border-top: 0px solid #dddddd !important;
}
.table_sm tr:last-child td {
  border-bottom: 0px solid #ddd;
}
.table_sm td:last-child,
.table_sm th:last-child {
  border-right: 0px;
}
.table_schoolinfo td,
.table_schoolinfo th {
  padding: 0.2rem 1rem;
  border-bottom: 1px solid #ddd;
  border-top: 0px;
}
.table_schoolinfo thead td,
.table_schoolinfo thead th {
  padding: 0.8rem 1rem;
  border-bottom: 1px solid #ddd;
  border-top: 0px;
}
.schoolinfo_box-title {
  overflow: hidden;
  -moz-border-radius: 0 0 0px 0px;
  -webkit-border-radius: 0 0 0px 0px;
  border-radius: 0 0 0px 0px;
  padding: 0px;
  width: 230px;
  height: 32px;
  padding-top: 2px;
  color: #666;
  line-height: 1.9rem;
  text-overflow: ellipsis;
  word-wrap: break-word;
}
.card {
  margin-bottom: 1.25rem;
  border: 0px solid rgba(0, 0, 0, 0.125);
  box-shadow: 0 1px 5px 0 rgba(14, 30, 62, 0.18);
  border-radius: 8px; /* 5px */
}
.card-header {
  border-bottom: 0px solid rgba(0, 0, 0, 0.125);
}
.txt_red,
.txt_red a {
  color: #cc0000 !important;
}
.txt_darkred,
.txt_darkred a {
  color: #cc4125 !important;
}
.txt_yellow {
  color: #eec13f !important;
}
.txt_yellow_f1 {
  color: #F1C232 !important;
}
.txt_orange {
  color: #ff4c00 !important;
}
.txt_lightpurple {
  color: #8E7CC3 !important;
}
.txt_darkorange {
  color: #e69138 !important;
}
.txt_w {
  color: #ffffff;
}
.txt_w_16p {
  color: #ffffff;
  font-size: 16px;
}
.txt_green,
.txt_green a {
  color: #93c47d !important;
}
.text-grey-e2 {
  color: #e2e2e2;
}
.icon_svg_black {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
}
.grayscale_40 {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  opacity: 0.4;
}
.table_convert table tr:nth-child(odd) td {
  background-color: #fff;
}
.table_convert table tr:nth-child(even) td {
  background-color: #f2f2f2;
}
.table-hover tbody tr:hover td {
  color: #b1261f;
  background-color: rgba(0, 0, 0, 0.04);
}
.table-hover tbody tr:hover td a {
  color: #b1261f;
}
.table-hover tbody tr.disabled:hover td {
  color: #000;
  background-color: rgba(0, 0, 0, 0.04);
}
.bg_table_gray th {
  background-color: #d9d9d9 !important;
  color: #b1261f !important;
}
.bg_tableftoor_gray th,
.bg_tableftoor_gray td {
  background-color: #d9d9d9 !important;
  color: #333 !important;
}
.bg_tableteam_gray th {
  background-color: #bfbfbf !important;
  color: #fff !important;
}
.bg_tableteam_graydark th {
  background-color: #a6a6a6 !important;
  color: #fff !important;
}
.bg_tableservice_blue th {
  background-color: #4d81be !important;
  color: #fff !important;
}
.bg_tablesplan_gray {
  background-color: #f1f1f1 !important;
  color: #515050 !important;
}
.bg_tablesplan_red {
  background-color: #cc0000 !important;
  color: #515050 !important;
}
.bg_tablesplan_gray_sub {
  background-color: #b1261f;
}
.bg_table_red th {
  background-color: #c00000 !important;
  color: #fff !important;
}
.bg_tablefoot_gray td {
  background-color: #f2f2f2 !important;
}
.bg_table_blue th {
  background-color: #4f81bc !important;
}
.bg-light-me {
  background-color: #f2f2f2;
}
.bg-grey-me {
  background-color: #e0e0e0;
}
.bg_green {
  background-color: #9abc59;
}
.bg_yellow {
  background-color: #eec13f;
}
.bg_orange {
  background-color: #ff4c00;
}
.pr-2-point {
  padding-right: 0.625rem;
}
.pr_90p {
  padding-right: 90px;
}
.pr_90p_20p {
  padding-right: 90px;
}
.dropdown-item:focus,
.dropdown-item:hover {
  text-decoration: none;
  background-color: #f5f5f5;
  color: #cc0000;
}
.picker__list-item {
  font-size: 18px;
  color: #333;
}
.picker__list-item:focus,
.picker__list-item:hover {
  cursor: pointer;
  color: #cc0000;
  background-color: #f5f5f5;
  z-index: 10;
}
.dropdown-item.disabled,
.dropdown-item:disabled,
.dropdown-item.disabled:focus {
  color: #999 !important;
  background-color: transparent !important;
  cursor: default !important;
  font-weight: normal;
}
.AnyTime-btn:hover {
  color: #333;
  background-color: #f5f5f5;
  border-radius: 50%;
}
.AnyTime-time .AnyTime-cur-btn,
.AnyTime-time .AnyTime-cur-btn:hover {
  color: #fff;
  background-color: #cc0000;
  border-radius: 50%;
}
.table-condensed tr td {
  width: 40px;
  height: 40px;
}
@media (max-width: 767.98px) {
  .daterangepicker.dropdown-menu {
    margin-left: auto;
  }
  .daterangepicker {
    width: 320px;
    padding-left: 0rem;
    padding-right: 0rem;
  }
  .table-condensed tr td {
    width: 40px;
    height: 41px;
  }
  .daterangepicker .ranges {
    width: 305px;
  }
}
/* Resize */
.pt_me-3 {
  padding-top: 1.25rem !important;
}
.pb_me-3 {
  padding-bottom: 1.25rem !important;
}
.pb_me-4 {
  padding-bottom: 10px !important;
}
.pb_me_768 {
  padding-bottom: 0px !important;
}
.pb_me_768_1366 {
  padding-bottom: 10px !important;
}
.pb_me_768_1024 {
  padding-bottom: 10px !important;
}
/* /.Resize */
.w_15p {
  width: 15px;
}
.w_50,
.w_50p {
  width: 50px;
}
.w_60p {
  width: 60px;
}
.w_62p {
  width: 62px;
}
.w_70p {
  width: 70px;
}
.w_90p {
  width: 90px;
}
.w_95p {
  width: 95px;
}
.w_140 {
  width: 140px;
}
.w_150 {
  width: 150px;
}
.dropdown-menu {
  font-size: 1rem;
  border-radius: 0.4rem;
  overflow: hidden;
  border: 0px solid rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 5px 0 rgb(14 30 62 / 18%);
}
.dropdown-menu {
  padding: 0;
}
.w-90 {
  width: 50%;
}
.w-80 {
  width: 80%;
}
.w-70 {
  width: 70%;
}
.w-60 {
  width: 60%;
}
.w-40 {
  width: 40%;
}
.w-33 {
  width: 33.333%;
}
.w-30 {
  width: 30%;
}
.w-20 {
  width: 20%;
}
.w-16 {
  width: 16.666%;
}
.w-10 {
  width: 10%;
}
.w-8 {
  width: 8.333%;
}
.w_50pc_100m {
  width: 50%;
}
.h_33pc_autom {
  height: 33.333%;
}
.h_66pc_autom {
  height: 66.666%;
}
.w-10p {
  width: 10px !important;
  min-width: 10px;
}
.w-15p {
  width: 15px !important;
  min-width: 15px;
}
.w-20p,
.w_20p {
  width: 20px !important;
  min-width: 20px;
}
.w_24p {
  width: 24px !important;
  min-width: 24px;
}
.w_250p {
  width: 250px;
}
.w_450p_250m {
  width: 450px;
}
.w_270p {
  width: 270px;
}
.w_400p {
  width: 400px;
}
.w-icon {
  width: 35px !important;
  min-width: 35px;
  margin-bottom: 3px;
}
.w-icon-2 {
  width: 20px !important;
  min-width: 20px;
}
.w-25p {
  width: 25px !important;
  min-width: 25px;
}
.w-30p {
  width: 30px !important;
  min-width: 30px;
}
.w-35p {
  width: 35px !important;
  min-width: 35px;
}
.w-40p {
  width: 40px !important;
  min-width: 40px;
}
.w-45p {
  width: 45px !important;
  min-width: 45px;
}
.w-50p {
  width: 50px !important;
  min-width: 50px;
}
.w-55p {
  width: 55px !important;
  min-width: 55px;
}
.w-60p {
  width: 60px !important;
  min-width: 60px;
}
.w-62p {
  width: 62px !important;
  min-width: 62px;
}
.w-70p {
  width: 70px !important;
  min-width: 70px;
}
.w-80p {
  width: 80px !important;
  min-width: 80px;
}
.w-90p {
  width: 90px !important;
  min-width: 90px;
}
.w-100p {
  width: 100px !important;
  min-width: 100px;
}
.w-110p {
  width: 110px !important;
  min-width: 110px;
}
.w-120p {
  width: 120px !important;
  min-width: 120px;
}
.w-130p {
  width: 130px !important;
  min-width: 130px;
}
.w-140p {
  width: 140px !important;
  min-width: 140px;
}
.w-150p {
  width: 150px !important;
  min-width: 150px;
}
.w-160p {
  width: 160px !important;
  min-width: 160px;
}
.w-170p {
  width: 170px !important;
  min-width: 170px;
}
.w-180p {
  width: 180px !important;
  min-width: 180px;
}
.w-200p {
  width: 200px !important;
  min-width: 200px;
}
.w-220p {
  width: 220px !important;
  min-width: 220px;
}
.w-250p {
  width: 250px !important;
  min-width: 250px;
}
.w-250p-200m {
  width: 250px !important;
}
.w-300p {
  width: 300px !important;
  min-width: 300px;
}
.w-350p {
  width: 350px !important;
  min-width: 350px;
}
.w-350p_390p {
  width: 390px !important;
  min-width: 390px;
}
.w-110p_m80p {
  width: 110px !important;
  min-width: 110px;
}
.w-80p_m90p {
  width: 80px !important;
  min-width: 80px;
}
.width-90 {
  width: 90%;
}
.h-33 {
  height: 33.333%;
}
.h-66 {
  height: 66.666%;
}
.h-25p {
  height: 25px !important;
}
.h-48p {
  height: 48px !important;
}
.h-40p {
  height: 40px !important;
}
.h-50p {
  height: 50px !important;
}
.h-80p {
  height: 80px !important;
}
.wh_40p {
  width: 40px;
  height: 40px;
}
.l-5p {
  left: 5px;
}
.icon-4x {
  font-size: 60px;
}
.icon-5x {
  font-size: 80px;
}
.btn {
  border: 0px solid transparent;
}
.btn_step1 {
  color: #fff;
  background-color: #796d9b;
  border-radius: 0.2rem;
  padding: 0.1375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.btn_step1:hover {
  color: #796d9b;
  background-color: #fff;
  border: 0px solid #ececec;
}
.btn_step2 {
  color: #fff;
  background-color: #2daba8;
  border-radius: 0.2rem;
  padding: 0.1375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.btn_step2:hover {
  color: #2daba8;
  background-color: #fff;
  border: 0px solid #ececec;
}
.btn_step3 {
  color: #fff;
  background-color: #eabd26;
  border-radius: 0.2rem;
  padding: 0.1375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.btn_step3:hover {
  color: #eabd26;
  background-color: #fff;
  border: 0px solid #ececec;
}
.btn_step4 {
  color: #fff;
  background-color: #f29724;
  border-radius: 0.2rem;
  padding: 0.1375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.btn_step4:hover {
  color: #f29724;
  background-color: #fff;
  border: 0px solid #ececec;
}
.btn_step5 {
  color: #fff;
  background-color: #eb5d4f;
  border-radius: 0.2rem;
  padding: 0.1375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.btn_step5:hover {
  color: #eb5d4f;
  background-color: #fff;
  border: 0px solid #ececec;
}
.btn_step6 {
  color: #fff;
  background-color: #d53c3e;
  border-radius: 0.2rem;
  padding: 0.1375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.btn_step6:hover {
  color: #d53c3e;
  background-color: #fff;
  border: 0px solid #ececec;
}
.btn_schoolprofile_menu {
  color: #b1261f;
  background-color: #ececec;
  border-top-left-radius: 0.2rem;
  border-top-right-radius: 0.2rem;
  border-bottom-left-radius: 0rem;
  border-bottom-right-radius: 0rem;
  padding: 0.5375rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
  font-size: 13px;
  width: 152px;
  transition: 0s background-color;
}
.btn_schoolprofile_menu.active {
  color: #fff;
  background-color: #b1261f;
}
.btn_schoolprofile_menu:hover {
  color: #b1261f;
  background-color: #ececec !important;
  border: 1px solid #ececec;
  transition-delay: 0s;
}
.btn_circle_icon {
  color: #cc0000 !important;
  background-color: transparent;
  padding: 10px 12px;
  border-radius: 5rem;
  border: 0px;
}
.btn_circle_icon:hover {
  color: #cc0000 !important;
  background-color: #f3f3f3;
  padding: 10px 12px;
  border-radius: 5rem;
  border: 0px;
}
.btn_circle_icon_more {
  color: #888 !important;
  background-color: transparent;
  padding: 5px 10px;
  border-radius: 5rem;
  border: 0px;
}
.btn_circle_icon_more:hover {
  color: #888 !important;
  background-color: #f3f3f3;
  padding: 5px 10px;
  border-radius: 5rem;
  border: 0px;
}
.btn_blue {
  color: #fff;
  background-color: #d4d4d4;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #d4d4d4;
}
.btn_blue:hover {
  color: #fff;
  background-color: #cc1800;
  border: 1px solid #cc1800;
}
.btn_blue.disabled,
.btn_blue:disabled {
  color: #fff;
  background-color: #d4d4d4;
  border: 1px solid #d4d4d4;
}
.btn_sky {
  color: #fff;
  background-color: #53b6e0;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #53b6e0;
}
.btn_sky:hover {
  color: #fff;
  background-color: #d4d4d4;
  border: 1px solid #d4d4d4;
}
.btn_sky.disabled,
.btn_sky:disabled {
  color: #fff;
  background-color: #53b6e0;
  border: 1px solid #53b6e0;
}
.btn_blue_browse {
  color: #fff;
  background-color: #337ab7;
  font-size: 1.2rem;
}
.btn_red_browse {
  color: #fff;
  background-color: #b1261f;
  font-size: 1.2rem;
}
.btn_green {
  color: #fff;
  background-color: #9bbb59;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #9bbb59;
}
.btn_green:hover {
  color: #9bbb59;
  background-color: #fff;
  border: 1px solid #fff;
}
.btn_green:disabled {
  color: #fff;
  background-color: #9bbb59;
}
.btn_green.disabled,
.btn_green:disabled {
  color: #fff;
  background-color: #9bbb59;
}
.btn_green:not([disabled]):not(.disabled).active,
.btn_green:not([disabled]):not(.disabled):active,
.show > .btn_green.dropdown-toggle {
  color: #fff;
  background-color: #9bbb59;
  border-color: #9bbb59;
}
.btn_orange {
  color: #fff;
  background-color: #f79646;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #f79646;
}
.btn_orange:hover {
  color: #f79646;
  background-color: #fff;
  border: 1px solid #f79646;
}
.btn_orange.disabled,
.btn_orange:disabled {
  color: #fff;
  background-color: #f79646;
}
.btn_orange:not([disabled]):not(.disabled).active,
.btn_orange:not([disabled]):not(.disabled):active,
.show > .btn_orange.dropdown-toggle {
  color: #f79646;
  background-color: #fff;
  border-color: #fff;
}
.btn_orange_light_border {
  color: #f08b43;
  background-color: #ffffff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #f08b43;
}
.btn_orange_light_border:hover {
  color: #fff;
  background-color: #f08b43;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #f08b43;
}
.btn_orange_light_border_sm {
  color: #f08b43;
  background-color: #ffffff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.0375rem 0.575rem;
  border: 1px solid #f08b43;
}
.btn_orange_light_border_sm:hover {
  color: #fff;
  background-color: #f08b43;
  border: 1px solid #f08b43;
}
.btn_green_light_border {
  color: #9bbb59;
  background-color: #ffffff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.775rem;
  border: 1px solid #9bbb59;
}
.btn_green_light_border_sm {
  color: #9bbb59;
  background-color: #ffffff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.66rem;
  border: 1px solid #9bbb59;
}
.btn_green_light_border_sm:hover {
  color: #ffffff;
  background-color: #9bbb59;
  border: 1px solid #9bbb59;
}
/*
.btn_orange_light_border:hover {
  color: #fff;
  background-color: #9BBB59;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: .1375rem .875rem;
  border: 0px;
}
*/
.btn_waitapprove {
  font-size: 1.2rem;
  color: #f79646;
}
.btn_red {
  color: #fff;
  background-color: #c00000;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
}
.btn_red:hover,
.btn_red:focus {
  color: #c00000;
  background-color: #fff !important;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  box-shadow: none !important;
}
.btn_search_blue {
  color: #fff;
  background-color: #b1261f;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
}
.btn_blue_light {
  color: #a6a6a6;
  background-color: #f2f2f2;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
}
.btn_blue_light:hover {
  color: #fff;
  background-color: #d4d4d4; /*4f81bd*/
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 0px;
}
.btn_grey_light {
  color: #a6a6a6;
  background-color: #f2f2f2;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
}
.btn_grey_light:hover {
  color: #fff;
  background-color: #d4d4d4; /*4f81bd*/
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 0px;
}
.btn_grey_light_sm {
  color: #a6a6a6;
  background-color: #f2f2f2;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.0375rem 0.575rem;
}
.btn_grey_light_sm:hover {
  color: #fff;
  background-color: #d4d4d4; /*4f81bd*/
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 0px;
}
.btn_red_light:hover {
  color: #fff;
  background-color: #b1261f;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 0px;
}
.btn_blue_light_border {
  color: #b1261f;
  background-color: #ffffff; /*FFF*/
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #b1261f;
}
.btn_blue_light_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_blue_FA_border {
  color: #b1261f;
  background-color: #fafafa; /*FFF*/
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #b1261f;
}
.btn_blue_FA_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_blue_w_border {
  color: #b1261f;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #b1261f;
}
.btn_blue_w_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_skyblue_light {
  color: #fff;
  background-color: #95b3d7;
  border-radius: 0.2rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
}
.btn_skyblue_light:hover {
  color: #fff;
  background-color: #b1261f;
  border-radius: 0.2rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 0px;
}
.btn_red_light_border {
  color: #c00000;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 1px solid #c00000;
}
.btn_red_light_border:hover {
  color: #fff;
  background-color: #c00000;
  border: 1px solid #c00000;
}
.btn_red_light_border.disable {
  color: #888 !important;
  background-color: #fff !important;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1rem;
  border: 1px solid #d9d9d9 !important;
}
.btn_red_sm {
  color: #ffffff;
  background-color: #c00000;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.66rem;
  border: 1px solid #c00000;
}
.btn_red_sm:hover {
  color: #c00000;
  background-color: #ffffff;
  border: 1px solid #c00000;
}
.btn_red_light_border_sm {
  color: #c00000;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.66rem;
  border: 1px solid #c00000;
}
.btn_red_light_border_sm:hover {
  color: #fff;
  background-color: #c00000;
  border: 1px solid #c00000;
}
.disable {
  color: #fff !important;
  background-color: #ccc !important;
  border-radius: 5rem !important;
  font-size: 1.2rem;
  padding: 0.1375rem 0.66rem;
  border: 1px solid #ccc !important;
}
.disable:hover {
  cursor: no-drop !important;
}
.card_disable {
  color: #fff !important;
  background-color: #ccc !important;
  font-size: 1.2rem;
  padding: 0.1375rem 0.66rem;
  border: 1px solid #ccc !important;
  opacity: 0.5;
}
.card_disable:hover {
  cursor: no-drop !important;
}
.card_disable_light {
  color: #fff !important;
  background-color: #f3f3f3 !important;
  opacity: 0.8;
}
.btn_grey_light_border {
  color: #888;
  background-color: #fafbfb;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.5rem;
  border: 1px solid #d9d9d9;
}
.btn_grey_light_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_grey_light_border_sm {
  color: #999;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.66rem;
  border: 1px solid #d9d9d9;
}
.btn_grey_light_border_sm:hover {
  color: #fff;
  background-color: #888;
  border: 1px solid #888;
}
.btn_black_light_border {
  color: #000;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.5rem;
  border: 1px solid #333;
}
.btn_black_light_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_grey_light_border_nobg {
  color: #c4c6c9;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.5rem;
  border: 1px solid #c4c6c9;
  /*background-color: #F5F8FB !important;*/
}
.btn_grey_light_border_nobg:hover {
  color: #969899;
  border: 1px solid #969899;
  box-shadow: 0 0 0 0rem rgba(0, 0, 0, 0) inset !important;
}
.btn_splan_grey_light_border {
  color: #bbb;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.5rem;
  border: 1px solid #dfdfdf;
}
.btn_splan_grey_light_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_blue_w {
  color: #b1261f;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
}
.btn_blue_w:hover {
  color: #fff;
  background-color: #b1261f;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 0.875rem;
  border: 0px;
}
.btn_backpage {
  color: #376094;
  background-color: #d9d9d9;
  border-radius: 0.2rem;
  font-size: 1.2rem;
  padding: 0.6rem 0.875rem;
  font-family: "TrueTextOnline-Bold";
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url(../images/main/arrow_checked.svg);
}
.temp_dark
  .custom-checkbox
  .custom-control-input:checked
  ~ .custom-control-label::after {
  background-image: url("../images/main/arrow_checked_grey.svg");
}
.temp_dark
  .custom-checkbox
  .custom-control-input:checked
  ~ .custom-control-label::before {
  background-color: #9f9f9f;
}
.temp_dark .custom-checkbox .custom-control-label::before {
  border-radius: 5rem;
}
.temp_dark .custom-control-label::before {
  position: absolute;
  top: 0px;
  left: -27px;
  display: block;
  width: 20px;
  height: 20px;
  pointer-events: none;
  content: "";
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  box-shadow: 0 0 0 0 transparent;
  border: #9f9f9f solid 2px;
}
.temp_dark .custom-control-label::after {
  position: absolute;
  top: -4px !important;
  left: -30px;
  display: block;
  width: 25px;
  height: 28px;
  content: "";
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
}
.temp_dark .custom-control {
  position: relative;
  display: block;
  min-height: 1.5385rem;
  padding-left: 28px;
}
.temp_dark.form-check-switchery:not(.dropdown-item).form-check-right {
  padding-left: 0;
  padding-right: 2.5rem;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("../images/main/arrow_radio.svg");
}
.top_check_txt {
  top: -20px;
}
.h_form-check {
  height: 26px;
}
.modal-content {
  background-color: #f2f2f2;
  border-radius: 15px;
  border: 0px;
  /*  overflow: hidden;*/
}
.modal-content.bg_grey_222 {
  background-color: #222222 !important;
  border-radius: 15px;
  border: 0px;
  /*  overflow: hidden;*/
}
.modal-open .modal,
.modal-open {
  padding-right: 0px !important;
}
.rounded {
  border-radius: 8px !important;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -khtml-border-radius: 8px;
}
.rounded-top {
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
}
.rounded-right {
  border-top-right-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}
.rounded-left {
  border-top-left-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
}
.rounded-bottom {
  border-bottom-right-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
}
.rounded-top-20 {
  border-top-left-radius: 0.2rem !important;
  border-top-right-radius: 0.2rem !important;
}
.rounded-right-20 {
  border-top-right-radius: 0.2rem !important;
  border-bottom-right-radius: 0.2rem !important;
}
.rounded-left-20 {
  border-top-left-radius: 0.2rem !important;
  border-bottom-left-radius: 0.2rem !important;
}
.rounded-right-40 {
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
}
.rounded-left-40 {
  border-top-left-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}
.rounded-bottom-20 {
  border-bottom-right-radius: 0.2rem !important;
  border-bottom-left-radius: 0.2rem !important;
}
.rounded-top-left {
  border-top-left-radius: 8px !important;
}
.rounded-top-right {
  border-top-right-radius: 8px !important;
}
.rounded-bottom-left {
  border-bottom-left-radius: 8px !important;
}
.rounded-bottom-right {
  border-bottom-right-radius: 8px !important;
}
.rounded_bottom_right_0 {
  border-bottom-right-radius: 0rem !important;
}
.rounded_4p {
  border-radius: 4px !important;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -khtml-border-radius: 4px;
}
.rounded_6p {
  border-radius: 6px !important;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -khtml-border-radius: 6px;
}
.rounded_8p {
  border-radius: 8px !important;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -khtml-border-radius: 8px;
}
.rounded_10p {
  border-radius: 10px !important;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -khtml-border-radius: 10px;
}
.rounded_top_10p {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.rounded_20p {
  border-radius: 20px !important;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -khtml-border-radius: 20px;
}
.rounded_30p {
  border-radius: 30px !important;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -khtml-border-radius: 30px;
}
.rounded_m0_10p {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -khtml-border-radius: 10px;
}
.rounded_m0_8p {
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -khtml-border-radius: 8px;
}
.card > .table:first-child tbody:first-child tr:first-child td:first-child,
.card > .table:first-child tbody:first-child tr:first-child th:first-child,
.card > .table:first-child thead:first-child tr:first-child td:first-child,
.card > .table:first-child thead:first-child tr:first-child th:first-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  tbody:first-child
  tr:first-child
  td:first-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  tbody:first-child
  tr:first-child
  th:first-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  thead:first-child
  tr:first-child
  td:first-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  thead:first-child
  tr:first-child
  th:first-child {
  border-top-left-radius: 10px;
}
.card > .table:first-child tbody:first-child tr:first-child td:last-child,
.card > .table:first-child tbody:first-child tr:first-child th:last-child,
.card > .table:first-child thead:first-child tr:first-child td:last-child,
.card > .table:first-child thead:first-child tr:first-child th:last-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  tbody:first-child
  tr:first-child
  td:last-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  tbody:first-child
  tr:first-child
  th:last-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  thead:first-child
  tr:first-child
  td:last-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  thead:first-child
  tr:first-child
  th:last-child {
  border-top-right-radius: 10px;
}
.card > .table:first-child tbody:first-child tr:first-child,
.card > .table:first-child thead:first-child tr:first-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  tbody:first-child
  tr:first-child,
.card
  > [class*="table-responsive"]:first-child
  > .table:first-child
  thead:first-child
  tr:first-child {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.card > .table:last-child,
.card > [class*="table-responsive"]:last-child > .table:last-child {
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}
.card-header:first-child {
  border-radius: 10px 10px 0 0;
}
.card > .table:last-child tbody:last-child tr:last-child,
.card > .table:last-child tfoot:last-child tr:last-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tbody:last-child
  tr:last-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tfoot:last-child
  tr:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.card > .table:last-child tbody:last-child tr:last-child td:first-child,
.card > .table:last-child tbody:last-child tr:last-child th:first-child,
.card > .table:last-child tfoot:last-child tr:last-child td:first-child,
.card > .table:last-child tfoot:last-child tr:last-child th:first-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tbody:last-child
  tr:last-child
  td:first-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tbody:last-child
  tr:last-child
  th:first-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tfoot:last-child
  tr:last-child
  td:first-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tfoot:last-child
  tr:last-child
  th:first-child {
  border-bottom-left-radius: 10px;
}
.card > .table:last-child tbody:last-child tr:last-child td:last-child,
.card > .table:last-child tbody:last-child tr:last-child th:last-child,
.card > .table:last-child tfoot:last-child tr:last-child td:last-child,
.card > .table:last-child tfoot:last-child tr:last-child th:last-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tbody:last-child
  tr:last-child
  td:last-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tbody:last-child
  tr:last-child
  th:last-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tfoot:last-child
  tr:last-child
  td:last-child,
.card
  > [class*="table-responsive"]:last-child
  > .table:last-child
  tfoot:last-child
  tr:last-child
  th:last-child {
  border-bottom-right-radius: 10px;
}
figure .box {
  position: relative;
}
.box_numberimg {
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: #e0e0e0;
  padding-left: auto;
  padding-top: 9px;
  opacity: 0.6;
  width: 100%;
  height: 100%;
  color: #888;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.box_plusaddimage {
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: #e0e0e0;
  padding-left: auto;
  opacity: 0.6;
  width: 100%;
  height: 100%;
  color: #888;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.box_plus_center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.box_numberimg:hover {
  opacity: 0.9;
  -webkit-transition-duration: 0.15s, 0.15s;
}
.modal-header .close {
  position: absolute;
  right: 15px;
  opacity: 0.7;
}
.modal-header .close:hover {
  opacity: 1;
}
.modal_slide .modal-header .close {
  opacity: 1;
}
.modal_slide .modal-header .close:hover {
  opacity: 0.7;
}
.modal_slide li {
  text-transform: none !important;
}
.modal-header .pr_20p {
  right: 20px;
}
.modal-header {
  padding-bottom: 0px !important;
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("../../assets/images/main/arr_down.svg");
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 10px center;
}
select.select_lg {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
}
select.select_lg_333 {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_333.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
}
select.select_date,
.select_date {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("../../assets/images/main/ic_calendar_333.svg");
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
}
select.select_filter,
.select_filter {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("../../assets/images/main/ic_filter_333.svg");
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
}
select[multiple="multiple"] {
  background: none;
  border: 1px solid #dddddd;
}
select.select_w {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("../../assets/images/main/arr_down_w.svg");
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 10px center;
}
.selectdiv:after {
  content: "\f078";
  font: normal normal normal 17px/1 FontAwesome;
  color: #0ebeff;
  right: 11px;
  top: 6px;
  height: 34px;
  padding: 15px 0px 0px 8px;
  border-left: 1px solid #0ebeff;
  position: absolute;
  pointer-events: none;
}
.picker__header > select {
  padding: 0 25px 0 10px;
  margin-left: 10px;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down.svg);
  width: auto;
  background-repeat: no-repeat;
  background-position: right 8px center;
}
.table-sm-p0 td,
.table-sm-p0 th {
  padding: 0rem 0rem !important;
}
.nav-item-submenu > .nav-link:after {
  top: 1.3rem;
}
.menu_userguide.nav-item-submenu > .nav-link:after {
  top: 0.3rem;
}
.color_333 {
  color: #333 !important;
}
.color_333:hover {
  color: #fff !important;
}
.color_9F {
  color: #9f9f9f;
}
.table-bordered-light td,
.table-bordered-light th {
  border: 1px solid #f6f9fc;
}
.border-gray td {
  border-color: #f6f9fc !important;
}
.progressbar {
  padding-right: 50px;
  position: relative;
}
.progressbar_num {
  position: absolute;
  top: -8px;
  right: 0px;
}
.progressbar_radius {
  border-radius: 1rem;
}
.txt_schoolnamehead {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 22px;
  color: #fff;
  line-height: 1em;
}
.txt_schoolname_sm {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 22px;
  color: #b1261f;
}
.txt_schoolname_big {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 36px;
  color: #b1261f;
}
.table td,
.table th {
  padding: 0.3rem 1.25rem;
}
.table_sp td,
.table_sp th {
  padding: 1rem 1.25rem;
}
.table_p-0 td,
.table_p-0 th {
  padding: 0rem 0rem;
}
.table_reportcard td,
.table_reportcard th {
  padding: 0.5rem 0.45rem;
}
/* 02 */
.txt_student_num {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 100px;
}
.txt_level_head {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 50px;
}
.txt_level_head_2 {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 22px;
}
.txt_level_title {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #404040;
  line-height: 1.5em;
  font-size: 18px;
}
.bg_card_grey_f3 {
  background-color: #f3f3f3;
}
.bg_card_grey_888 {
  background-color: #888888;
}
.bg_card_ict {
  background-color: #ffffff;
}
.bg_card_ict_grey {
  background-color: #f2f2f2;
}
.bg_progress_green {
  background-color: #9bbb59;
}
.bg_progress_orange {
  background-color: #f79646;
}
.bg_progress_gray {
  background-color: #bfbfbf;
}
.bg_progress_yellow {
  background-color: #ffc107 !important;
  border-radius: 1rem;
}
.bg_progress_red {
  background-color: #cc0000 !important;
  border-radius: 1rem;
}
.txt_ict_icon {
  color: #b1261f;
}
.txt_ict_bighead {
  font-family: "TrueTextOnline-Regular";
  font-size: 40px;
  color: #b1261f;
}
.txt_ictlevel_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 50px;
}
.txt_ictlevel_title {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #95b3d7;
  line-height: 1.5em;
  font-size: 18px;
}
.txt_ictteamprovince_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 60px; /*24*/ /*40*/ /*33*/
}
.txt_ictteamprovince_title {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #a6a6a6;
  line-height: 1.5em;
  font-size: 16px; /*14*/
}
.txt_ictteam_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #404140;
  line-height: 1em;
  font-size: 24px;
}
.txt_ictteam_title {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #7f7f7f;
  line-height: 1.5em;
  font-size: 14px;
}
.txt_spcoach_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 40px;
}
.txt_ictprogress_green {
  color: #9bbb59;
}
.txt_ictprogress_orange {
  color: #f79646;
}
.txt_ictprogress_gray {
  color: #bfbfc2;
}
.ictprogress {
  line-height: 0.5em;
}
.ictreport {
  line-height: 1em;
}
.txt_teamhead {
  font-family: "TrueTextOnline-Bold";
}
.txt_stephead {
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.txt_loginhead {
  font-family: "TrueTextOnline-Bold";
  color: #b1261f;
  font-size: 26px;
}
.txt_sp_detail {
  color: #000000; /*808080*/
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: #fff;
  background-color: #b1261f;
  border-color: #b1261f #b1261f #b1261f;
}
.nav-tabs {
  border-bottom: 5px solid #b1261f;
}
.nav-tabs .nav-link {
  borddetailp-left-radius: 0;
  border-top-right-radius: 0;
  color: #888;
  background-color: #fff;
  border-bottom: 0px solid #b1261f;
  border-left: hidden;
  border-right: hidden;
  border: 0px;
}
.nav-tabs .nav-item {
  margin-bottom: 0px;
}
.dot_circle {
  height: 15px;
  width: 15px;
  border-radius: 50%;
  display: inline-block;
}
.dot_circle_sm {
  height: 7px;
  width: 7px;
  border-radius: 5rem;
  display: inline-block;
  min-width: 7px;
}
.dot_circle_5p {
  height: 10px;
  width: 10px;
  border-radius: 5rem;
  display: inline-block;
  min-width: 10px;
}
.dot_circle_10p {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  display: inline-block;
}
.dot_circle_red_5p {
  height: 5px;
  width: 5px;
  border-radius: 50%;
  display: inline-block;
  background-color: #cc0000;
}
.dot_circle_red_8p {
  height: 8px;
  width: 8px;
  border-radius: 50%;
  display: inline-block;
  background-color: #cc0000;
}
.dot_circle_red_10p {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  display: inline-block;
  background-color: #cc0000;
}
.dot_circle_red_12p {
  height: 12px;
  width: 12px;
  border-radius: 50%;
  display: inline-block;
  background-color: #cc0000;
}
.position_dot {
  right: 0px;
  top: -12px;
}
.dot_noti {
  right: -13px;
  top: -10px;
}
.dot_circle_top10 {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  display: inline-block;
  color: #ffffff;
  font-size: 14px;
  text-align: center;
}
.circle_back {
  border: 2px solid #ddd;
  height: 50px;
  border-radius: 50%;
  width: 50px;
  background-color: #f6f9fc;
}
.circle_back:hover {
  border: 2px solid #9f9f9f;
}
.circle_sp {
  border: 2px solid;
  border-radius: 5rem;
  width: 25px;
  height: 25px;
  margin-left: 5px;
}
.circle_sp:hover {
  background-color: #eee;
}
.circle_25p {
  border: 2px solid;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  margin-left: 0px;
  font-size: 18px;
  font-family: "TrueTextOnline-Bold";
  line-height: 1.7rem;
}
.circle_ic_42p {
  background: #ffffff;
  color: #888;
  border-radius: 25px;
  display: inline-block;
  font-weight: bold;
  margin-bottom: 0.3125rem !important;
  text-align: center;
  border: 1px solid #d9d9d9;
  padding: 10px;
  height: 42px;
  width: 42px;
}
.circle_ic_42p.disable {
  background: #ccc !important;
  color: #fff !important;
  border-radius: 25px;
  display: inline-block;
  font-weight: bold;
  margin-bottom: 0.3125rem !important;
  text-align: center;
  border: 1px solid #d9d9d9;
  padding: 10px;
  height: 42px;
  width: 42px;
  cursor: not-allowed !important;
  pointer-events: all !important;
  font-size: 1rem !important;
  line-height: 1.3rem;
}
.content_middle {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.txt_username_top10 {
  white-space: nowrap;
  width: 78px;
  overflow: hidden;
  text-overflow: clip;
  color: #a6a6b2;
}
.page-item.active .page-link {
  z-index: 1;
  color: #fff;
  background-color: #b1261f;
  border-color: #b1261f;
}
select.form-control:not([size]):not([multiple]) {
  height: 3rem;
}
select.form-control.h2dot5:not([size]):not([multiple]) {
  height: 42px; /*2.5rem*/
}
.form-control {
  border: 0px solid #f3f3f3;
  font-size: 18px;
  height: 3rem;
  border-radius: 10px;
}
.tokenfield.form-control {
  height: auto;
}
.tokenfield .token:not([class*="bg-"]):focus,
.tokenfield .token:not([class*="bg-"]):hover {
  background-color: #b1261f;
  color: #fff;
}
.form-control.noborder.h2dot5 {
  border: 0px solid #f3f3f3;
  border-radius: 10px;
  font-size: 18px;
  height: 42px; /*2.5rem*/
}
.form-control.h2dot5 {
  border: 1px solid #ddd; /*F3F3F3*/
  border-radius: 5rem;
  font-size: 18px;
  height: 42px; /*2.5rem*/
}
.form-control.black.h2dot5 {
  border: 0px solid #ddd; /*F3F3F3*/
  border-radius: 5rem;
  font-size: 18px;
  height: 42px; /*2.5rem*/
}
.form-control.txt_20 {
  border: 0px solid #f3f3f3;
  font-size: 20px;
  height: 3rem;
  border-radius: 10px;
}
.border-danger {
  border-color: #f44336 !important;
  border: 1px solid #f44336 !important;
}
.bg-menuleft-blue {
  background-color: #ccd6ec;
  color: #808080 !important;
}
.form_card {
  margin-bottom: 0rem;
  border: 0px solid rgba(0, 0, 0, 0.125);
  box-shadow: 0 3px 6px 0 rgba(14, 30, 62, 0.08) !important;
  border-radius: 10px;
}
.bd-callout {
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  border: 0px solid #eee;
  border-left-width: 8px;
  border-radius: 0.2rem;
}
.bd-callout h4 {
  margin-top: 0;
  margin-bottom: 0.25rem;
}
.bd-callout p:last-child {
  margin-bottom: 0;
}
.bd-callout code {
  border-radius: 0.25rem;
}
.bd-callout + .bd-callout {
  margin-top: -0.25rem;
}
.bd-callout-blue {
  border-left-color: #b1261f;
}
.bd-callout-blue h4 {
  color: #b1261f;
}
.bd-callout-info {
  border-left-color: #5bc0de;
}
.bd-callout-info h4 {
  color: #5bc0de;
}
.bd-callout-warning {
  border-left-color: #f0ad4e;
}
.bd-callout-warning h4 {
  color: #f0ad4e;
}
.bd-callout-danger {
  border-left-color: #d9534f;
}
.bd-callout-danger h4 {
  color: #d9534f;
}
.fix_width_ictprogress {
  width: 120px;
}
.fix_height_100p {
  height: 100px;
  overflow: auto;
}
.fix_height_185p {
  height: 185px;
  overflow: auto;
}
.fix_height_305p {
  height: 305px;
  overflow: auto;
}
.fix_height_350p {
  height: 350px;
  overflow: auto;
}
.pc_width_province {
  min-width: 190px;
}
.m_width_team_month {
  width: 300px;
}
.form-control-feedback {
  line-height: 3rem;
}
input:disabled,
textarea:disabled {
  /*  color: rgb(155, 187, 89);*/
  color: #888888;
  cursor: default;
}
.m_width_coach {
  min-width: 180px;
}
.m_width_school {
  min-width: 185px;
}
.m_width_engage {
  min-width: 160px;
}
.m_width_icttalent {
  min-width: 340px;
}
.m_width_performance_check {
  min-width: 40px;
}
.m_width_performance_btn {
  min-width: 260px;
}
.m_width_schoolcode {
  min-width: 110px;
}
.m_width_schoolstatus {
  min-width: 130px;
}
.m_width_schoolprovice {
  min-width: 140px;
}
.m_width_schoolstudent {
  min-width: 100px;
}
.m_width_schoolprofile_name {
  min-width: 300px;
}
.m_width_schoolprofile_role {
  min-width: 260px;
}
.m_width_schoolprofile_rank {
  min-width: 240px;
}
.m_width_schoolprofile_address {
  min-width: 300px;
}
.m_width_building {
  min-width: 300px;
}
.m_width_20p {
  min-width: 20px;
}
.m_width_30p {
  min-width: 30px;
}
.m_width_40p {
  min-width: 40px;
}
.m_width_45p {
  min-width: 45px;
}
.m_width_47p {
  min-width: 47px;
}
.m_width_50p {
  min-width: 50px;
}
.m_width_55p {
  min-width: 55px;
}
.m_width_60p {
  min-width: 60px;
}
.m_width_70p {
  min-width: 70px;
}
.m_width_80p {
  min-width: 80px;
}
.m_width_90p {
  min-width: 90px;
}
.m_width_100p {
  min-width: 100px;
}
.m_width_105p {
  min-width: 105px;
}
.m_width_110p {
  min-width: 110px;
}
.m_width_120p {
  min-width: 120px;
}
.m_width_130p {
  min-width: 130px;
}
.m_width_140p {
  min-width: 140px;
}
.m_width_150p {
  min-width: 150px;
}
.m_width_160p {
  min-width: 160px;
}
.m_width_170p {
  min-width: 170px;
}
.m_width_180p {
  min-width: 180px;
}
.m_width_190p {
  min-width: 190px;
}
.m_width_200p {
  min-width: 200px;
}
.m_width_220p {
  min-width: 220px;
}
.m_width_230p {
  min-width: 230px;
}
.m_width_240p {
  min-width: 240px;
}
.m_width_250p {
  min-width: 250px;
}
.m_width_260p {
  min-width: 260px;
}
.m_width_270p {
  min-width: 270px;
}
.m_width_280p {
  min-width: 280px;
}
.m_width_300p {
  min-width: 300px;
}
.m_width_320p {
  min-width: 320px;
}
.m_width_340p {
  min-width: 340px;
}
.m_width_360p {
  min-width: 360px;
}
.m_width_400p {
  min-width: 400px;
}
.m_width_450p {
  min-width: 450px;
}
.m_width_500p {
  min-width: 500px;
}
.m_width_150p_m110p {
  min-width: 150px;
}
.w_100_m90 {
  width: 100px;
  min-width: 100px;
}
.m_width_120pc_250m {
  min-width: 120px;
}
.m_width_140pc_250m {
  min-width: 250px;
}
.m_width_140pc_300m {
  min-width: 300px;
}
.m_width_160pc_250m {
  min-width: 160px;
}
.ms_width_110p {
  min-width: 110px;
}
.ms_width_100p {
  min-width: 100px;
}
.m_maxwidth_tablefixed {
  min-width: 345px;
  width: 345px;
}
.media-title {
  margin-bottom: 0.125rem;
  margin-top: 0.75rem;
  line-height: 0.75rem;
}
.noti_imguser {
  position: relative;
}
.noti_imguser_abs {
  position: absolute;
  top: 0px;
  right: -2px;
}
.noti_imguser_num {
  position: absolute;
  top: 0px;
  right: -8px;
}
.noti_imguser_bar {
  position: absolute;
  top: 0px;
  right: 5px;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-100 {
  opacity: 100 !important;
}
.form-input-addtask {
  padding: 0.4375rem 1.25rem;
  line-height: 1.8385;
}
.form-input-addtask:hover,
.form-input-addtask:focus {
  background-color: #eeeeee;
  border-radius: 0.2rem;
  line-height: 1.8385;
}
.txt_stephead {
  font-family: "TrueTextOnline-Bold";
  font-size: 22px;
}
.modal-body-fixed {
  max-height: 740px;
  overflow-y: auto;
  margin-bottom: 20px;
}
.form-control::-webkit-input-placeholder {
  color: #bbbbbb;
} /* WebKit, Blink, Edge */
.form-control:-moz-placeholder {
  color: #bbbbbb;
} /* Mozilla Firefox 4 to 18 */
.form-control::-moz-placeholder {
  color: #bbbbbb;
} /* Mozilla Firefox 19+ */
.form-control:-ms-input-placeholder {
  color: #bbbbbb;
} /* Internet Explorer 10-11 */
.form-control::-ms-input-placeholder {
  color: #bbbbbb;
} /* Microsoft Edge */
/* /. SP */
/* fontend */
.page-header-light {
  background-color: #fafafa;
  border-bottom: 0px solid #ddd;
}
.border_front_grey {
  border: 1px solid #efefef !important;
}
.form_card_front {
  margin-bottom: 0rem;
  border: 0px solid rgba(0, 0, 0, 0.125);
  box-shadow: 0 1px 6px 0 rgba(14, 30, 62, 0.08) !important;
  border-radius: 0.2rem;
}
.form_card_front:hover {
  border: 0px solid rgba(0, 0, 0, 0.125);
}
.card_front {
  margin-bottom: 1.25rem;
  border: 0px solid rgba(0, 0, 0, 0.125);
  /*  box-shadow: 0 1px 6px 0 rgba(14, 30, 62, 0.08);*/
  box-shadow: 0 1px 6px 0 rgba(14, 30, 62, 0.18);
  border-radius: 10px;
}
.txt_partnership_cop_head {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #404040;
  line-height: 1em;
  font-size: 32px;
}
.txt_partnership_cop_title {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #a6a6a6;
  line-height: 1.5em;
  font-size: 14px;
}
.txt_partnership_name_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #404040;
  line-height: 1em;
  font-size: 20px;
}
.txt_partnership_name_title {
  font-style: normal;
  color: #a6a6a6;
  line-height: 1.5em;
  font-size: 18px;
}
.txt_partnership_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 32px;
}
.txt_partnership_title {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #95b3d7;
  line-height: 1.5em;
  font-size: 14px;
}
.img_partnership_ceo {
  float: left;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
.rounded-img-card {
  border-top-left-radius: 0.2rem !important;
  border-bottom-left-radius: 0.2rem !important;
  border-top-right-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}
/* /. fontend */
/* Report Wall */
.txt_reportwallhead {
  font-family: "TrueTextOnline-Bold";
}
.txt_reportwall_date {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #fff;
  line-height: 1em;
  font-size: 1.7em;
}
.txt_reportwall_month {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #fff;
  line-height: 1em;
  font-size: 0.7em;
}
.txt_reportwall_dmy {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 1.2em;
}
.txt_reportwall_num {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
  font-size: 1.5em;
}
.txt_reportwall_namehead {
  font-family: "TrueTextBBold";
  color: #b1261f;
  font-size: 1.2em;
}
.txt_reportwall_statushead {
  font-family: "TrueTextBBold";
  color: #b1261f;
  font-size: 1.2em;
}
.shadow-sm {
  box-shadow: 0 1px 6px 0 rgba(14, 30, 62, 0.08) !important;
}
.d_reportwall_padding {
  padding: 0 1.5rem;
}
.w_reportwall_60 {
  width: 60px;
}
.form-control:disabled,
.form-control[readonly] {
  background-color: #ffffff;
  opacity: 1;
}
.bg_card_school_grey:disabled {
  background-color: #fbfbfb !important;
}
.bg_card_school_grey_disabled:disabled {
  background-color: #f2f2f2 !important;
}
.input-group-text {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.4375rem 0.875rem;
  margin-bottom: 0;
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.5385;
  color: #000;
  text-align: center;
  white-space: nowrap;
  background-color: #ffffff;
  border: 0px solid #ddd;
  border-radius: 10px;
}
.picker__footer button {
  border: 0;
  padding: 0rem 0.475rem;
  font-weight: 500;
  cursor: pointer;
  display: inline-block;
  border-radius: 0.1875rem;
  transition: all ease-in-out 0.15s;
  margin: 0 5px;
}
.picker--opened .picker__holder {
  max-height: 350px;
  border-top-width: 1px;
  border-bottom-width: 1px;
  display: block;
  overflow: hidden;
}
.picker__day {
  padding: 0.4375rem;
  min-width: 2.12503rem;
  border-radius: 0.1875rem;
  font-size: 1rem;
}
.picker__month,
.picker__year {
  font-weight: 700;
  display: inline-block;
  margin-left: 0.2rem;
  margin-right: 0.2rem;
  font-size: 1.3rem;
}
.picker__year {
  color: #999;
  font-size: 1.3rem;
  font-weight: 400;
}
.picker__weekday {
  width: 14.285714286%;
  text-align: center;
  padding-bottom: 0.46875rem;
  padding-top: 0.9375rem;
  color: #999;
  font-weight: 400;
  font-size: 1rem;
}
.picker__day--highlighted:before,
.picker__day--today:before {
  display: none;
}
.picker__holder {
  width: 100%;
  max-width: 500px;
}
.daterangepicker .table-condensed .month {
  font-size: 1.3rem;
  color: #000;
  padding-top: 0.46875rem;
  padding-bottom: 0.46875rem;
  font-weight: 700;
}
.daterangepicker td.active,
.daterangepicker td.active:focus,
.daterangepicker td.active:hover {
  color: #fff;
  background-color: #b1261f;
  border-radius: 0.1875rem;
}
.daterangepicker th {
  color: #999;
  font-weight: 400;
  font-size: 1rem;
}
/* /. Report Wall */
/* Behavior */
.txt_behaviorhead {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 22px;
  color: #b1261f;
  line-height: 1em;
}
.bg_grey_behaviorhead {
  background-color: #f2f2f2;
}
.bg_grey_f2 {
  background-color: #f2f2f2;
}
.input_performance {
  background-color: #f2f2f2;
  height: 2.4rem;
}
.txt_grey_behaviortitle,
.txt_grey_username,
.txt_grey {
  color: #888888; /*A6A6B2*/
}
.txt_grey_light {
  color: #ccc;
}
.txt_grey_a1 {
  color: #a1a1a1;
}
.txt_grey_888 {
  color: #888888;
}
.txt_grey_cf {
  color: #cfcfcf;
}
.txt_grey_35 {
  color: #353535;
}
.txt_grey_43 {
  color: #000;
}
.txt_grey_4343 {
  color: #434343;
}
.txt_grey_444 {
  color: #444444;
}
.txt_grey_d9 {
  color: #d9d9d9;
}
.txt_grey_333 {
  color: #333;
}
.txt_grey_56 {
  color: #565656;
}
a.txt_grey_56:hover {
  color: #ffffff;
}
.txt_grey_8a {
  color: #8a8a8a;
}
.txt_grey_999 {
  color: #999;
}
.txt_grey_ddd {
  color: #ddd;
}
.txt_grey_e5 {
  color: #e5e5e5;
}
.txt_grey_ccc {
  color: #ccc;
}
/* /.Behavior */
/* Performance */
.btn-success:hover {
  color: #fff;
  background-color: #4caf50;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #ffffff; /*9BBB59*/
}
.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  background-color: #9bbb59;
  box-shadow: none;
}
.custom-checkbox .custom-control-label::before {
  border-radius: 5px; /*2rem*/
}
.custom-radio .custom-control-label::before {
  border-radius: 5rem; /*5px*/
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #ffffff; /*9BBB59*/
}
.custom-control {
  position: relative;
  display: block;
  min-height: 1.5385rem;
  padding-left: 2.2rem;
}
.custom-control-label::before {
  position: absolute;
  top: -2px;
  left: -2.1rem;
  display: block;
  width: 1.8rem;
  height: 1.8rem;
  pointer-events: none;
  content: "";
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #fff;
  box-shadow: 0 0 0 0 transparent;
  border: #ddd solid 2px;
}
.custom-control-label-w::before {
  background-color: #fff;
}
.custom-control-label::after {
  position: absolute;
  top: 0px !important;
  left: -2.2rem;
  display: block;
  width: 2rem;
  height: 1.5rem;
  content: "";
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
}
/* circle red selectbox */
.custom-checkbox02
  .custom-control-input:checked
  ~ .custom-control-label::before {
  background-color: #cc0000;
}
.custom-checkbox02 .custom-control-label::before {
  border-radius: 2rem;
}
.custom-checkbox02
  .custom-control-input:checked
  ~ .custom-control-label::after {
  background-image: url(../images/main/arrow_checked_w.svg);
}
.label_checkbox {
  display: inline-block;
  margin-bottom: 0rem;
  padding-left: 20px;
  padding-top: 5px;
}
.label_checkbox_me {
  display: inline-block;
  margin-bottom: 0.4rem;
  padding-left: 20px;
  padding-top: 5px;
}
label {
  display: inline-block;
  margin-bottom: 0rem !important;
}
.custom-control-me {
  min-height: 0rem;
  margin-bottom: 0.5rem;
  position: relative;
  top: -20px;
}
.minwidth {
  min-width: 100px;
}
.minwidth_20p {
  min-width: 20px;
}
.minwidth_25p {
  min-width: 25px;
}
.minwidth_50 {
  min-width: 50px;
}
.minwidth_60p {
  min-width: 60px;
}
.minwidth_70p {
  min-width: 70px;
}
.minwidth_80p {
  min-width: 80px;
}
.minwidth_100p {
  min-width: 100px;
}
.minwidth_105p {
  min-width: 105px;
}
.minwidth_110p {
  min-width: 110px;
}
.minwidth_115p {
  min-width: 115px;
}
.minwidth_120p {
  min-width: 120px;
}
.minwidth_140p {
  min-width: 140px;
}
.minwidth_200p {
  min-width: 200px;
}
.minwidth_280p {
  min-width: 280px;
}
.minwidth_300 {
  min-height: 300px;
  height: auto;
}
.minwidth_350p {
  min-width: 350px !important;
}
.minheight_chat {
  min-height: 100px;
}

.minheight_28 {
  min-height: 28px;
}
.minheight_40 {
  min-height: 40px;
}
.minheight_42 {
  min-height: 42px;
}
.minheight_50 {
  min-height: 50px;
}
.minheight_56 {
  min-height: 56px;
}
.minheight_60 {
  min-height: 60px;
}
.minheight_80 {
  min-height: 80px;
}
.minheight_90 {
  min-height: 90px;
}
.minheight_100 {
  min-height: 100px;
}
.minheight_120 {
  min-height: 120px;
}
.minheight_130 {
  min-height: 130px;
}
.minheight_150 {
  min-height: 150px;
}
.minheight_190 {
  min-height: 190px;
}
.minheight_200 {
  min-height: 200px;
}
.minheight_210 {
  min-height: 210px;
}
.minheight_220 {
  min-height: 220px;
}
.minheight_250 {
  min-height: 250px;
}
.minheight_260 {
  min-height: 260px;
}
.minheight_290 {
  min-height: 100%;
  /*  min-height: 290px;*/
}
.minheight_330 {
  min-height: 330px;
}
.minheight_360 {
  min-height: 360px;
}
.minheight_380 {
  min-height: 380px;
}
.minheight_400 {
  min-height: 400px;
}
.maxwidth_100 {
  max-width: 100%;
}
.maxwidth_40p {
  max-width: 40px;
  width: 40px;
}
.maxwidth_50p {
  max-width: 50px;
  width: 50px;
}
.maxwidth_55p {
  max-width: 55px;
  width: 55px;
}
.maxwidth_60p {
  max-width: 60px;
  width: 60px;
}
.maxwidth_70p {
  max-width: 70px;
  width: 70px;
}
.maxwidth_80p {
  max-width: 80px;
  width: 80px;
}
.maxwidth_100p {
  max-width: 100px;
  width: 100px;
}
.maxwidth_105p {
  max-width: 105px;
}
.maxwidth_110p {
  max-width: 110px;
}
.maxwidth_120p {
  max-width: 120px;
}
.maxwidth_130p {
  max-width: 130px;
}
.maxwidth_140p {
  max-width: 140px;
  width: 140px;
}
.maxwidth_150p {
  max-width: 150px;
  width: 150px;
}
.maxwidth_160p {
  max-width: 160px;
  width: 160px;
}
.maxwidth_170p {
  max-width: 170px;
  /*  width: 170px;*/
}
.maxwidth_190p {
  max-width: 190px;
}
.maxwidth_200p {
  max-width: 200px;
}
.maxwidth_220p {
  max-width: 220px;
}
.maxwidth_240p {
  max-width: 240px;
}
.maxwidth_280p {
  max-width: 280px;
}
.maxwidth_240p_m100 {
  max-width: 240px;
}
.maxwidth_280p_m200 {
  max-width: 280px;
}
.maxwidth_300p {
  max-width: 300px;
}
.maxwidth_400p {
  max-width: 400px !important;
}
.maxwidth_500p {
  max-width: 500px;
}
.maxwidth_600p {
  max-width: 600px;
}
.maxwidth_900p {
  max-width: 900px;
}
.maxwidth_900p_mauto {
  max-width: 900px;
}
.maxwidth_400p_m100 {
  max-width: 400px;
}
.maxheight_40vh {
  max-height: 40vh;
}
.maxheight_50 {
  max-height: 50px;
}
.maxheight_60 {
  max-height: 60px;
}
.maxheight_80 {
  max-height: 80px;
}
.maxheight_100 {
  max-height: 100px;
}
.maxheight_120 {
  max-height: 120px;
}
.maxheight_150 {
  max-height: 150px;
}
.maxheight_170 {
  max-height: 170px;
}
.maxheight_200 {
  max-height: 200px;
}
.maxheight_210 {
  max-height: 210px;
}
.maxheight_230 {
  max-height: 230px;
}
.maxheight_260 {
  max-height: 260px;
}
.maxheight_300 {
  max-height: 300px;
}
.maxheight_360 {
  max-height: 360px;
}
.maxheight_400 {
  max-height: 400px;
}
.maxheight_430 {
  max-height: 430px;
}
.maxh_100vh_-100p {
  height: calc(100vh - 110px);
}
.maxheight_overview_m {
  max-height: 530px;
}
.maxheight_geomap_m0 {
  max-height: 556px;
}
.maxheight_geomap_730_m0 {
  max-height: 730px;
}
.maxheight_geomap_420_m0 {
  max-height: 423px;
}
.maxheight_geomap_600_m0 {
  max-height: 603px;
}
.minheight_stepbar {
  min-height: 50px;
}
.maxheight_noti_m0 {
  max-height: 252px;
}
.minheight_geo_insight {
  max-height: calc(100% - 200px);
}
.w_geo_dropdown {
  width: 360px;
}
.h_15p {
  height: 15px;
}
.h_20p {
  height: 20px;
}
.h_24p {
  height: 24px;
}
.h_25p {
  height: 25px;
}
.h_28p {
  height: 28px;
}
.h_30p {
  height: 30px;
}
.h_32p {
  height: 32px;
}
.h_34p {
  height: 34px;
}
.h_40p {
  height: 40px;
}
.h_42p {
  height: 42px;
}
.h_45p {
  height: 45px;
}
.h_46p {
  height: 46px;
}
.h_50p {
  height: 50px;
}
.h_54p {
  height: 54px;
}
.h_56p {
  height: 56px;
}
.h_66p {
  height: 66px;
}
.h_70p {
  height: 70px;
}
.h_77p {
  height: 77px !important;
}
.h_80p {
  height: 80px !important;
}
.h_96p {
  height: 96px;
}
.h_105p {
  height: 105px;
}
.h_111p {
  height: 111px;
}
.h_152p {
  height: 152px;
}
.h_186p {
  height: 186px;
}
.h_200p {
  height: 200px;
}
.h_220p {
  height: 220px;
}
.h_208p {
  height: 208px;
}
.h_336p {
  height: 336px;
}
.h_458p {
  height: 458px;
}
.h_100per-0p {
  height: calc(100% - 0px);
}
.h_100per-30p {
  height: calc(100% - 30px);
}
.h_100per-34p {
  height: calc(100% - 34px);
}
.h_100per-36p {
  height: calc(100% - 36px);
}
.h_100per-60p {
  height: calc(100% - 60px);
}
.h_100per-62p {
  height: calc(100% - 62px);
}
.h_100per-66p {
  height: calc(100% - 66px);
}
.h_100per-88p {
  height: calc(100% - 88px);
}
.h_100per-100p {
  height: calc(100% - 100px);
}
.h_100per-134p {
  height: calc(100% - 134px);
}
.h_100per-266p {
  height: calc(100% - 266px);
}
.h_100per-200p {
  height: calc(100% - 200px);
}
.h_100per-391p {
  height: calc(100% - 391px);
}
.h_100per-458p {
  height: calc(100% - 458px);
  min-height: 100px;
}
.h_100per-462p {
  height: calc(100% - 462px);
}
.h_100per-528p {
  height: calc(100% - 528px);
}
.h_100per-536p {
  height: calc(100% - 536px);
}
.h_100per-594p {
  height: calc(100% - 594px);
}
.h_56pc_46m {
  height: 56px;
}
.wordbreak_breakall {
  word-break: break-all;
}
.wordbreak_breakword {
  word-break: break-word;
}
.ranges ul li.active {
  color: #fff;
  background-color: #cc0000;
}
.bg-slate {
  background-color: #cc0000;
}
.btn-group-sm > .btn,
.btn-sm {
  padding: 0.2rem 0.75rem;
  font-size: 1rem;
  line-height: 1.6667;
  border-radius: 5rem; /*2.20rem*/
}
.daterangepicker .daterangepicker_input i {
  top: auto;
  bottom: 1rem;
}
.bg-primary {
  background-color: #b1261f !important;
}
.ranges .daterangepicker-inputs .daterangepicker_input > span {
  margin-bottom: 0rem;
}
.ranges .daterangepicker-inputs {
  padding: 1rem;
  padding-top: 0.6rem;
}
.mb-me-3 {
  margin-bottom: 20px;
}
.w_18p {
  width: 18px;
}
.w_20p {
  width: 20px !important;
}
.w_24p {
  width: 24px;
}
.w_28p {
  width: 28px;
}
.w_30p {
  width: 30px;
}
.w_40p {
  width: 40px;
}
.w_80p {
  width: 80px !important;
}
.w_90 {
  width: 90px;
}
.w_100 {
  width: 100px;
}
.w_100p {
  width: 100px !important;
}
.w_120p {
  width: 120px !important;
}
.w_150p {
  width: 150px !important;
}
.w_280p {
  width: 280px;
}
.table_performance td,
.table_performance th {
  padding: 0.3rem 0.3rem;
}
/* /.Performance */
/* SP */
.txt_sp_headnum {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #b1261f;
  line-height: 1.2em;
  font-size: 34px;
}
.txt_sp_titlenum {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #95b3d7;
  line-height: 1em;
  font-size: 18px;
}
.txt_sp_titlenum_16 {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #95b3d7;
  line-height: 1em;
  font-size: 16px;
}
.txt_progress {
  font-size: 22px;
}
.crown_gold {
  color: #b8880c;
}
.crown_silver {
  color: #848482;
}
.sp-img figure {
  /*width: 100%;
  height: 160px;
  overflow: hidden;
  margin-bottom: 10px;
  position: relative;*/
  width: 100%;
  height: 160px;
  overflow: hidden;
  margin-bottom: 10px;
  background-color: #fafafa;
}
.sp-img figure img {
  /*display: block;
  width: 100%;
  margin: 0% 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);*/
  position: relative;
  left: 50%;
  top: 50%;
  height: 100%;
  width: auto;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.sp-img-small figure {
  width: 100%;
  height: 75px;
  overflow: hidden;
  position: relative;
}
.sp-img-small figure img {
  display: block;
  width: 150%;
  margin: 0% 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.sp-img-small-square figure {
  width: 100%;
  height: 90px;
  overflow: hidden;
  position: relative;
}
.sp-img-small-square figure img {
  display: block;
  width: 150%;
  margin: 0% 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.sp-img-small-square-home figure {
  width: 100%;
  height: 75px;
  overflow: hidden;
  position: relative;
}
.sp-img-small-square-home figure img {
  display: block;
  width: 150%;
  margin: 0% 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.plr_1rem {
  padding-left: 1rem;
  padding-right: 1rem;
}
.txt_nametopic_gray {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 18px;
  color: #808080;
}
.txt_grading_1dot5 {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 1.5rem;
}
.txt_grading_2 {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 2rem;
}
.txt_grading_3 {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 3rem;
}
.txt_grading_4 {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 4rem;
}
.txt_grading_10 {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 10rem;
}
.txt_grading_26p {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 26px;
}
.txt_grading_bignum {
  font-family: "TrueTextOnline-Bold";
  color: #6f8a3b;
  font-size: 10rem;
}
.arrow_back {
  opacity: 0.2;
}
.arrow_back:hover {
  opacity: 0.4;
}
.arrow_back_2 {
  opacity: 1;
}
.arrow_back_2:hover {
  opacity: 0.4;
}
.font-topic {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 24px;
  font-weight: normal;
  line-height: 1.2em;
  color: #b1261f;
}
.multiselect.btn-light {
  background-color: #f2f2f2;
  border-color: #ddd;
}
/* /. SP */
.txt_tmn_btn_grey {
  font-family: "TrueTextOnline-Bold";
  color: #8f8f8f;
  font-size: 50px;
  height: 186px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 10px;
}
/* Menu Pracharat */
.dropbtn {
  font-size: 16px;
  border: none;
  outline: none;
  padding: 1.25rem 1.25rem 1rem 1.25rem;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
  height: 40px;
}
.dropdown-content a {
  float: none;
  color: black;
  padding: 22px 16px;
  text-decoration: none;
  text-align: left;
  height: 40px;
}
.dropdown-content a:hover {
  background-color: #ddd;
}
.dropdown:hover .dropdown-content {
  display: block;
}
/* /. Menu Pracharat */
/* Performance */
.approved:disabled ~ .custom-control-label {
  color: #404040;
}
.custom-checkbox .approved:disabled:checked ~ .custom-control-label::before {
  background-color: #9bbb59;
}
/* /. Performance */
/* Swiper */
.swiper-pagination-bullet {
  background: #ddd !important;
  opacity: 1 !important;
  border: 0px solid #dddddd !important;
}
.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 0px;
}
.swiper-pagination-bullet-active {
  opacity: 1 !important;
  background: #999 !important;
}
.mr-27p {
  margin-right: 27px !important;
}
.swiper-container-12 {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
/* ./Swiper */
.btn_modal_border_red {
  min-width: 120px;
  height: 40px;
  border: 1px solid #cc0000;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 24px;
  color: #cc0000;
  background-color: #fff;
}
.btn_modal_border_red:hover,
.btn_modal_border_red:focus {
  border: 1px solid #cc0000;
  color: #cc0000;
  background-color: #ffc1c2;
}
.btn_modal_border_red_active,
.btn_modal_border_red.btn-success {
  min-width: 120px;
  height: 40px;
  border: 1px solid #cc0000;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 24px;
  color: #fff;
  background-color: #cc0000;
}
.btn_modal_border_red_active:hover,
.btn_modal_border_red_active:focus {
  border: 1px solid #cc0000;
  color: #cc0000;
  background-color: #ffc1c2;
}
.btn_modal_border_grey {
  min-width: 120px;
  height: 40px;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 24px;
  color: #888888;
  background-color: #fff;
}
.btn_modal_border_grey:hover,
.btn_modal_border_grey:focus {
  border: 1px solid #cc0000;
  color: #fff;
  background-color: #cc0000;
}
.hover_card:hover .card {
  background-color: #fafafa !important;
}
.txt_modal_head {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.5em;
  font-size: 24px;
}
.form_control_input_50p {
  font-family: "TrueTextOnline-regular";
  font-size: 20px;
  line-height: 27.5px;
  height: 50px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
}
.form_control_input_40p {
  font-family: "TrueTextOnline-regular";
  font-size: 18px;
  line-height: 27.5px;
  height: 40px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
}
.form_control_input_30p {
  font-family: "TrueTextOnline-bold";
  font-size: 18px;
  line-height: 25px;
  height: 30px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 6px;
  padding: 5px 10px;
}
.txt_bighead_red {
  font-family: "SukhumvitSet-Medium";
  font-size: 36px;
  line-height: 40px;
  color: #cc0000;
}
.daterangepicker td.active,
.daterangepicker td.active:focus,
.daterangepicker td.active:hover {
  color: #fff;
  background-color: #cc0000;
  border-radius: 2.1875rem;
}
.daterangepicker .table-condensed tr > td,
.daterangepicker .table-condensed tr > th {
  padding: 0.4375rem;
  min-width: 2.414rem;
  transition: all ease-in-out 0.15s;
}
.daterangepicker td.available:focus,
.daterangepicker td.available:hover {
  color: #333;
  background-color: #f5f5f5;
  border-radius: 50%;
}
.daterangepicker select.monthselect {
  margin-right: 2%;
  width: 60%;
}
.daterangepicker .calendar {
  border-radius: 10px;
}
.ranges {
  border-radius: 10px;
}
.txt_bold {
  font-family: "TrueTextOnline-Bold";
}
/* --------------------------------------- */
.border_bottom_1 {
  border-bottom: 1px solid #eee !important;
}
.border_top_1 {
  border-top: 1px solid #eee !important;
}
.border_left_1 {
  border-left: 1px solid #d9d9d9 !important;
}
.border_right_1 {
  border-right: 1px solid #d9d9d9 !important;
}
.border_right_1_e5 {
  border-right: 1px solid #e5e5e5 !important;
}
.border_right_1_ec {
  border-right: 1px solid #ececec !important;
}
.border_1_grey_e5 {
  border: 1px solid #e5e5e5;
}
.line-height-0dot9 {
  line-height: 0.9 !important;
}
.line-height-0dot8 {
  line-height: 0.8 !important;
}
.line-height-0dot7 {
  line-height: 0.7 !important;
}
.line-height-0dot6 {
  line-height: 0.6 !important;
}
.line-height-0dot5 {
  line-height: 0.5 !important;
}
.line-height-0dot8 {
  line-height: 0.8 !important;
}
.line-height-1 {
  line-height: 1 !important;
}
.line-height-1dot2 {
  line-height: 1.2 !important;
}
.line-height-1dot3 {
  line-height: 1.3 !important;
}
.line-height-2dot5 {
  line-height: 2.5 !important;
}
.line-height-3 {
  line-height: 3 !important;
}
.line-height_26p {
  line-height: 26px !important;
}
.card-footer:last-child {
  border-radius: 0 0 10px 10px;
}
hr {
  border-top: 1px solid #cccccc;
}

.card.a_link.disabled,
.a_link.disabled {
  opacity: 0.5;
  background-color: #efefef;
}
.card.a_link:hover {
  background-color: #efefef;
}
.card.a_link .txt_link {
  color: #d9d9d9;
}
.card.a_link .txt_link:hover {
  color: #a6a6a6;
}
.card-body.a_link:hover {
  background-color: #efefef;
}
.a_link:hover {
  background-color: #efefef;
}
.pt_3p {
  padding-top: 3px !important;
}
.pt_5p {
  padding-top: 5px !important;
}
.pt_10p {
  padding-top: 10px !important;
}
.pt_12p {
  padding-top: 12px !important;
}
.pt_13p {
  padding-top: 13px !important;
}
.pt_15p {
  padding-top: 15px !important;
}
.pt_20p {
  padding-top: 20px !important;
}
.pt_30p {
  padding-top: 30px !important;
}
.pt_40p {
  padding-top: 40px !important;
}
.pt_50p {
  padding-top: 50px !important;
}
.pt_20p_m0 {
  padding-top: 20px !important;
}
.py_2p {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}
.py_4p {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
.py_5p {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
.py_6p {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}
.py_8p {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}
.py_9p {
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}
.py_10p {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
.py_15p {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}
.py_20p {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}
.ck-editor__editable {
  max-height: 400px !important;
}
.custom-control-label-grey::before {
  background-color: #ffffff;
  border: 2px solid #cbcbcb;
}
.custom-checkbox
  .bg-blue.custom-control-input:checked
  ~ .custom-control-label::before {
  background-color: #365887;
  border: 2px solid #365887;
}
.border_bottom_1_white {
  border-bottom: 1px solid #ffffff !important;
}
.border_bottom_1_ddd {
  border-bottom: 1px solid #ddd !important;
}
.border_bottom_1_eee {
  border-bottom: 1px solid #eee !important;
}
.border_bottom_1_ccc {
  border-bottom: 1px solid #ccc !important;
}
.border_bottom_1_e5 {
  border-bottom: 1px solid #e5e5e5 !important;
}
.border_bottom_1_ec {
  border-bottom: 1px solid #ececec !important;
}
.border_bottom_1_f1f2f3 {
  border-bottom: 1px solid #f1f2f3 !important;
}
.border_right_1_white {
  border-right: 1px solid #ffffff !important;
}
.border_gray_ddd {
  border-top: 1px solid #ddd;
}
.border_gray_all_ddd {
  border: 1px solid #ddd;
}
.border_grey_666 {
  border: 1px solid #666666;
}
.border_grey_f2 {
  border: 1px solid #f2f2f2;
}
.border_grey_f3 {
  border: 1px solid #f3f3f3;
}
.border_grey_e5 {
  border: 1px solid #e5e5e5;
}
.border_grey_ddd {
  border: 1px solid #ddd;
}
.border_grey_d9 {
  border: 1px solid #d9d9d9;
}
.border_grey_333 {
  border: 1px solid #333333;
}
.border_grey_444 {
  border: 1px solid #444444;
}
.border_grey_ec {
  border: 1px solid #ececec;
}
.border_black_2p {
  border: 2px solid #333;
}
.border_red {
  border: 1px solid #cc0000 !important;
}
.border_red_2p {
  border: 2px solid #e06666 !important;
}
.border_w_2p {
  border: 2px solid #ffffff !important;
}
.border_grey_2p {
  border: 2px solid #666666 !important;
}
/* Step Bar */
.progress_step {
  list-style: none;
  margin: 0;
  padding: 0;
  display: table;
  table-layout: fixed;
  width: 100%;
  color: #849397;
  font-family: "TrueTextOnline-Bold";
}
.progress_step > li {
  position: relative;
  display: table-cell;
  text-align: center;
  font-size: 1em;
}
.progress_step > li:before {
  content: attr(data-step);
  display: block;
  margin: 0 auto;
  background: #dfe3e4;
  width: 2.3em;
  height: 2.3em;
  text-align: center;
  margin-bottom: 0.2em;
  line-height: 2.3em;
  border-radius: 100%;
  position: relative;
  z-index: 1000;
  color: #fff;
  font-family: "SukhumvitSet-Medium";
}
.progress_step > li:after {
  content: "";
  position: absolute;
  display: block;
  background: #dfe3e4;
  width: 100%;
  height: 0.2em;
  top: 1.15em;
  left: 50%;
  margin-left: 1em;
  z-index: 0;
}
.progress_step > li:last-child:after {
  display: none;
}
.progress_step > li.is-complete {
  color: #2ecc71;
}
.progress_step > li.is-complete:before,
.progress > li.is-complete:after {
  color: #fff;
  background: #2ecc71;
}
.progress_step > li.is-active {
  color: #000;
}
.progress_step > li.is-active:before {
  color: #fff;
  background: #9bbb57;
  font-family: "SukhumvitSet-Medium";
}
.progress_step_none > li:before {
  z-index: -1 !important;
  margin-bottom: 0.2em;
}
.progress_step_none .active {
  color: #b1261f;
}
.active .circle_splannum_blue,
.circle_splanum_blue:hover {
  background-color: #b1261f;
  color: #ffffff;
  border: 3px solid #b1261f;
}
.active .circle_step_green {
  background-color: #dfe3e4;
  color: #ffffff;
  border: 3px solid #dfe3e4;
}
.is-active .circle_step_green {
  background-color: #9bbb57;
  color: #ffffff;
  border: 3px solid #9bbb57;
}
.is-reject .circle_step_green {
  background-color: #cc0000;
  color: #ffffff;
  border: 3px solid #cc0000;
  /*  background-image: url("../images/main/ic_reject.svg");*/
  background-position: left top;
  background-repeat: no-repeat;
}
.is-progress .circle_step_green {
  background-color: #ffffff;
  color: #9bbb57;
  border: 3px solid #9bbb57;
}
.donation .is-reject a.active,
.donation .is-reject a {
  color: #cc0000;
  text-decoration: none;
}
.donation .progress_step_sm > li.is-reject:before {
  color: #fff;
  background: #cc0000;
  font-family: "SukhumvitSet-Medium";
}
.circle_step_green {
  /*  border: 3px solid;*/
  border-radius: 50%;
  width: 50px;
  height: 50px;
  margin-left: 0px;
  font-size: 34px;
  font-family: "TrueTextOnline-Bold";
  line-height: 2.9rem;
  color: #ffffff;
  background-color: #dfe3e4;
  border: 3px solid #dfe3e4;
  top: -25px;
  z-index: 1001;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
}
/* Small */
.progress_step_sm {
  list-style: none;
  margin: 0;
  padding: 0;
  display: table;
  table-layout: fixed;
  width: 100%;
  color: #849397;
  font-size: 0.7em;
}
.progress_step_sm > li {
  position: relative;
  display: table-cell;
  text-align: center;
  font-size: 1em;
}
.progress_step_sm > li:before {
  content: attr(data-step);
  display: block;
  margin: 0 auto;
  background: #dfe3e4;
  width: 1.8em;
  height: 1.8em;
  text-align: center;
  margin-bottom: 0.25em;
  line-height: 1.6em;
  border-radius: 100%;
  position: relative;
  z-index: 1000;
  color: #fff;
  font-family: "SukhumvitSet-Medium";
  border: 2px solid #dfe3e4;
}
.progress_step_sm > li:after {
  content: "";
  position: absolute;
  display: block;
  background: #dfe3e4;
  width: 100%;
  height: 0.2em;
  top: 0.8em;
  left: 50%;
  margin-left: 0em;
  z-index: 0;
}
.donation.progress_step > li.line-reject:after {
  background: #cc0000 !important;
}
.progress_step_sm > li.line-reject:after {
  content: "";
  position: absolute;
  display: block;
  background: #cc0000 !important;
  width: 100%;
  height: 0.2em;
  top: 0.8em;
  left: 50%;
  margin-left: 0em;
  z-index: 0;
}
.progress_step_sm > li:last-child:after {
  display: none;
}
.progress_step_sm > li.is-complete {
  color: #2ecc71;
}
.progress_step_sm > li.is-complete:before,
.progress > li.is-complete:after {
  color: #fff;
  background: #2ecc71;
}
.progress_step_sm > li.is-active {
  color: #000;
}
.progress_step_sm > li.is-active:before {
  color: #fff;
  background: #9bbb57;
  font-family: "SukhumvitSet-Medium";
  border: 2px solid #9bbb57;
}
.progress_step_sm > li.is-progress:before {
  color: #9bbb57;
  background: #ffffff;
  font-family: "SukhumvitSet-Medium";
  border: 2px solid #9bbb57;
}
.progress_step_sm > li.is-reject:before {
  color: #fff;
  background: #cc0000;
  font-family: "SukhumvitSet-Medium";
  border: 2px solid #cc0000;
}
.donation .nav-link {
  display: block;
  padding: 0.625rem 1.25rem 0 1.25rem;
}
/* /.Small */
/**
 * Needed for IE8
 */
.progress__last:after {
  display: none !important;
}
*,
*:after,
*:before {
  box-sizing: border-box;
}
.ms_width_110p {
  min-width: 110px;
}
.ms_width_100p {
  min-width: 100px;
}
.progress_step {
  margin-bottom: 1.3em;
}
.border-1 {
  border: 1px solid !important;
}
/* /.Step Bar */
.minheight_300 {
  min-height: 300px;
}
.minheight_360 {
  min-height: 360px;
}
.icon_48p {
  font-size: 48px;
}
.circle_green {
  border: 3px solid;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  margin-left: 0px;
  font-size: 34px;
  font-family: "TrueTextOnline-Bold";
  line-height: 3rem;
}
.border_y5_w {
  border-bottom: 5px solid #ffffff;
  border-top: 5px solid #ffffff;
}
.ic_center {
  top: -50px;
  left: 50%;
  z-index: 1001;
  transform: translate(-50%, 50%);
}
.ic_center-65 {
  top: -65px;
  left: 50%;
  z-index: 1001;
  transform: translate(-50%, 50%);
}
.btn:hover .ic_svg_hover_white {
  filter: invert(100) sepia(0) saturate(0) hue-rotate(0deg) brightness(100);
  opacity: 1 !important;
}
.disable .ic_svg_hover_white {
  filter: invert(100) sepia(0) saturate(0) hue-rotate(0deg) brightness(100) !important;
  opacity: 1 !important;
}
.icon_120p {
  font-size: 120px;
}
.txt_muted {
  font-family: "TrueTextOnline-Regular";
  color: #a6a6b2;
  font-size: 20px;
}
.txt_superhead {
  font-size: 100px;
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #b1261f;
  line-height: 1em;
}
.h_100p {
  height: 100px;
}
.h_120p {
  height: 120px;
}
.h_125p {
  height: 125px;
}
.h_130p {
  height: 130px;
}
.h_140p {
  min-height: 110px;
}
.maxh_100vh {
  max-height: calc(100vh);
}
.maxh_100vh_lg-70p {
  height: calc(100vh - 70px);
}
.maxh_100vh_lg-112p {
  height: calc(100vh - 110px);
}
.maxh_100vh_lg-117p {
  height: calc(100vh - 117px);
}
.body_bg_w {
  background-color: #ffffff;
}
.font_mfl_topic {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.5em;
  color: #b1261f;
}
.box_mfl_topic {
  overflow: hidden;
  -moz-border-radius: 0 0 0px 0px;
  -webkit-border-radius: 0 0 0px 0px;
  border-radius: 0 0 0px 0px;
  padding: 0px;
  width: 100%;
  max-height: 60px;
  margin-bottom: 0px;
}
.breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;
  padding-right: 0.325rem;
  color: inherit;
  content: ">";
}
.breadcrumb-item + .breadcrumb-item {
  padding-left: 0.325rem;
}
a.breadcrumb-item:hover {
  color: #888;
}
.bg_w {
  background-color: #ffffff;
}
.radius_bottom_l {
  border-bottom-left-radius: 10px;
}
.radius_bottom_r {
  border-bottom-right-radius: 10px;
}
.radius_8px {
  border-radius: 8px !important;
}
.radius_20px {
  border-radius: 20px !important;
}
.txt_20 {
  font-size: 20px !important;
}
.txt_19 {
  font-size: 19px;
}
.txt_18 {
  font-size: 18px !important;
}
.txt_17 {
  font-size: 17px;
}
.txt_16 {
  font-size: 16px !important;
}
.txt_15 {
  font-size: 15px;
}
.txt_14 {
  font-size: 14px !important;
}
.txt_13 {
  font-size: 13px;
}
.txt_12 {
  font-size: 12px;
}
.txt_11 {
  font-size: 11px;
}
.txt_10 {
  font-size: 10px;
}
.txt_5 {
  font-size: 5px;
}
.txt_22 {
  font-size: 22px !important;
}
.txt_24 {
  font-size: 24px !important;
}
.txt_30 {
  font-size: 30px !important;
}
.txt_40 {
  font-size: 40px !important;
}
.txt_50 {
  font-size: 50px !important;
}
.txt_60 {
  font-size: 60px !important;
}
[data-toggle="collapse"] .fa:before {
  content: "\f056";
}
[data-toggle="collapse"].collapsed .fa:before {
  content: "\f055";
}
.scroll {
  white-space: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
.scroll_hide::-webkit-scrollbar {
  display: none;
}
.hori_menu .logo,
.hori_menu nav {
  width: 100%;
}
.hori_menu .nav-item {
  color: #333;
}
header {
  background: #152637;
}
.hori_menu nav {
  /*  background: #b1261f;*/
  white-space: nowrap;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  /*border-radius: 0 0 3px 3px;*/
}
.hori_menu .nav-item.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  color: #333;
  border-bottom: 0px solid #fff;
}
.h_27p {
  height: 27px;
}
.hori_menu_dark .logo,
.hori_menu_dark nav {
  width: 100%;
}
.hori_menu_dark .nav-item {
  color: #999;
}
.hori_menu_dark nav {
  white-space: nowrap;
  overflow-x: scroll;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}
.nav_item_me,
.nav_cned_item_me {
  padding: 5px 16px 5px;
}
.nav_item_me,
.nav_cned_item_me_2p {
  padding: 5px 5px 2px;
}
.nav_item_me:not(:last-child),
.nav_cned_item_me:not(:last-child),
.nav_cned_item_me_2p:not(:last-child),
.nav_mco_item_me:not(:last-child) {
  border-right: 0px solid rgba(114, 124, 135, 0.2);
}
* {
  box-sizing: border-box;
}
header,
nav {
  font-size: 0;
}
.nav_item_me {
  font-size: 14px;
}
.nav_item_me,
.vertical-align-middle,
.nav_cned_item_me,
.nav_cned_item_me_2p {
  display: inline-block;
  vertical-align: top; /*middle*/
}
.nav_mco_item_me {
  display: table-cell;
  vertical-align: middle;
}
.scroll::-webkit-scrollbar {
  display: none;
}
.txt_pcr_submenu a.active,
.txt_pcr_submenu a:hover {
  color: #0072bf;
  /*  background-color: #FFFFFF;*/
}
/* /.Menu Horizontal Slide */
/* Menu Slider */
.nav_slide_item {
  display: -webkit-inline-box;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  max-width: 100%;
}
.nav_slide_item {
  color: #83818c;
  padding: 5px 30px;
  text-decoration: none;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  margin: 0 6px;
  z-index: 1;
  font-family: "TrueTextOnline-regular";
  font-size: 18px;
  font-weight: 500;
  position: relative;
}
.nav_slide_item:before {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #dfe2ea;
  border-radius: 0px 0px 0 0;
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.nav_slide_item:not(.is-active):hover:before {
  opacity: 1;
  bottom: 0;
}
.nav_slide_item:not(.is-active):hover {
  color: #000;
}
.nav-indicator {
  position: absolute;
  left: 0;
  bottom: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  height: 3px;
  z-index: 1;
  border-radius: 0px 0px 0 0;
}
@media (max-width: 580px) {
  .nav_slide {
    overflow: auto;
  }
}
/* /.Menu Slider */
.plr_15p {
  padding-left: 20px !important;
  padding-right: 20px !important;
}
.plr_m0_15p {
  padding-left: 20px;
  padding-right: 20px;
}
.btn_circle_grey_32 {
  color: #bbb;
  background-color: #fff;
  border-radius: 5rem;
  border: 1px solid #dfdfdf;
  font-size: 0.8rem;
  width: 32px;
  height: 32px;
  padding: 6px 8px;
}
.btn_circle_grey_32:hover,
.btn_circle_grey_32:active,
.btn_circle_grey_32:focus {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
  opacity: 1;
}
.btn_circle_grey_32_noborder {
  color: #bbb;
  background-color: #fff;
  border-radius: 5rem;
  border: 0px solid #dfdfdf;
  font-size: 0.8rem;
  width: 32px;
  height: 32px;
  padding: 6px 8px;
}
.btn_circle_grey_32_noborder:hover,
.btn_circle_grey_32_noborder:active,
.btn_circle_grey_32_noborder:focus {
  color: #fff;
  background-color: #b1261f;
  border: 0px solid #b1261f;
  opacity: 1;
}
.over_opacity_80:hover {
  opacity: 0.8;
}
.z-index_1001 {
  z-index: 1001;
}
.z-index_1002 {
  z-index: 1002;
}
.z-index_1003 {
  z-index: 1003;
}
.z-index_1004 {
  z-index: 1004;
}
.z-index_1005 {
  z-index: 1005;
}
.z-index_1009 {
  z-index: 1009;
}
.z-index_2009 {
  z-index: 2009;
}
.z-index_3009 {
  z-index: 3009;
}
.z-index_4009 {
  z-index: 4009;
}
.z-index_5009 {
  z-index: 5009;
}
.z-index_10009 {
  z-index: 10009;
}
.z_index9999 {
  z-index: 9999;
}
.card_footer {
  padding: 0.9375rem 15px;
  background-color: #ffffff;
  border-top: 1px solid #eee;
}
.l_5p {
  left: 5px !important;
}
.r_5p {
  right: 5px !important;
}
.p_15p {
  padding: 15px;
}
.pl_3p {
  padding-left: 3px !important;
}
.pl_5p {
  padding-left: 5px !important;
}
.pr_5p {
  padding-right: 5px !important;
}
.pl_10p {
  padding-left: 10px !important;
}
.pl_15p {
  padding-left: 15px !important;
}
.pl_20p {
  padding-left: 20px !important;
}
.pl_30p {
  padding-left: 30px !important;
}
.pl_35p {
  padding-left: 35px !important;
}
.pl_40p {
  padding-left: 40px !important;
}
.pl_50p {
  padding-left: 50px !important;
}
.pl_55p {
  padding-left: 55px !important;
}
.pl_60p {
  padding-left: 60px !important;
}
.pr_10p {
  padding-right: 10px !important;
}
.pr_15p {
  padding-right: 15px !important;
}
.pr_20p {
  padding-right: 20px !important;
}
.pr_30p {
  padding-right: 30px !important;
}
.px_3_me {
  padding-left: 15px !important;
  padding-right: 15px !important;
}
.px_2p {
  padding-left: 2px;
  padding-right: 2px;
}
.px_8p {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
.px_15p,
.px_15p_m0 {
  padding-left: 15px !important;
  padding-right: 15px !important;
}
.px_20p {
  padding-left: 20px !important;
  padding-right: 20px !important;
}
.px_30p {
  padding-left: 30px !important;
  padding-right: 30px !important;
}
.px_35p {
  padding-left: 35px;
  padding-right: 35px;
}
.px_40p {
  padding-left: 40px;
  padding-right: 40px;
}
.ml_1p {
  margin-left: 1px !important;
}
.ml_10p {
  margin-left: 10px !important;
}
.ml_15p {
  margin-left: 15px !important;
}
.mr_15p {
  margin-right: 15px !important;
}
.ml_20p {
  margin-left: 20px !important;
}
.mr_20p {
  margin-right: 20px !important;
}
.ml_30p {
  margin-left: 30px !important;
}
.mr_30p {
  margin-right: 30px !important;
}
.ml_40p {
  margin-left: 40px !important;
}
.mr_40p {
  margin-right: 40px !important;
}
.card-footer {
  padding: 0.9375rem 15px;
  background-color: #ffffff;
  border-top: 1px solid #eee;
}
/* VideoJS */
.video-js {
}
.video-js .vjs-big-play-button {
}
.vjs-poster {
  background-color: #ffffff !important;
}
.video-js .vjs-big-play-button {
  display: none !important;
}
.vjs-big-play-button,
.video-js:hover .vjs-big-play-button,
.video-js .vjs-big-play-button:focus {
  display: none !important;
}
.video-js .vjs-big-play-button:before,
.video-js .vjs-control:before,
.video-js .vjs-modal-dialog,
.vjs-modal-dialog .vjs-modal-dialog-content {
  font-size: 2em;
}
/* /. VideoJS */
.hide {
  display: none;
}
/* Hori Card*/
.card_front {
  margin-bottom: 1.25rem;
  border: 0px solid rgba(0, 0, 0, 0.125);
  box-shadow: 0 1px 5px 0 rgba(14, 30, 62, 0.08);
  border-radius: 10px;
}
.border_front_grey {
  border: 1px solid #efefef !important;
}
.bg_card_ict {
  background-color: #ffffff;
}
.rounded-img-card {
  border-top-left-radius: 10px !important;
  border-bottom-left-radius: 0rem !important;
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 0rem !important;
}
.img_partnership_ceo {
  float: left;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
.minheight_210 {
  min-height: 210px;
}
.plr_5p {
  padding-left: 5px;
  padding-right: 5px;
}
.plr_10p {
  padding-left: 10px !important;
  padding-right: 10px !important;
}
a .hover_50 {
  opacity: 0.5;
}
a:hover .hover_50 {
  opacity: 0.8;
}
a:hover .img_filter_bright {
  filter: brightness(0.5);
}
/* /.Hori Card */
.sidebar-mobile-toggler a {
  padding: 0.55rem 1.25rem;
  transition: all ease-in-out 0.15s;
}
.img_hover:hover img {
  opacity: 0.6;
}
.txt_hover:hover {
  color: #cc0000 !important;
}
.mobile-skin.iphone6-portrait {
  position: relative;
  background: url("../images/screen_mobile.png") no-repeat;
  height: 860px;
  background-size: cover;
  z-index: 10;
}
.overflow_scroll {
  overflow: scroll !important;
}
.overflow_visible {
  overflow: visible !important;
}
.scrollbar_x {
  overflow: scroll !important;
  position: relative;
  height: 100%;
  border-radius: 0px;
}
.scrollbar_x::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_x::-webkit-scrollbar-button {
  background: #ccc;
}
.scrollbar_x::-webkit-scrollbar-track-piece {
  background: #888;
}
.scrollbar_x::-webkit-scrollbar-thumb {
  background: #eee;
}
.no_scrollbar::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.no_scrollbar::-webkit-scrollbar-button {
  background: #ccc;
}
.no_scrollbar::-webkit-scrollbar-track-piece {
  background: #888;
}
.no_scrollbar::-webkit-scrollbar-thumb {
  background: #eee;
}
.scrollbar_100vh {
  overflow-x: hidden;
  position: relative;
  height: calc(100vh); /*100vh*/
  border-radius: 10px;
}
.scrollbar_100vh::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_100vh::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_100vh::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_100vh::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_100vh_noscroll {
  overflow-x: hidden;
  position: relative;
  height: 100%;
  border-radius: 0px;
}
.scrollbar_100vh_noscroll::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.scrollbar_100vh_noscroll::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_100vh_noscroll::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_100vh_noscroll::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_100vh_md {
  overflow-x: hidden;
  position: relative;
  height: calc(100vh); /*100vh*/
  border-radius: 10px;
}
.scrollbar_100vh_md::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.scrollbar_100vh_md::-webkit-scrollbar-button {
  display: none;
  background: #ccc;
}
.scrollbar_100vh_md::-webkit-scrollbar-track-piece {
  background: #888;
}
.scrollbar_100vh_md::-webkit-scrollbar-thumb {
  background: #eee;
}
.scrollbar_100vh_768 {
  overflow-x: hidden;
  position: relative;
  height: calc(100vh); /*100vh*/
  border-radius: 10px;
}
.scrollbar_100vh_768::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_100vh_768::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_100vh_768::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_100vh_768::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_100vh_150 {
  overflow-x: hidden;
  position: relative;
  height: calc(100vh - 150px);
  border-radius: 0 0 10px 10px;
}
.scrollbar_100vh_150::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_100vh_150::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_100vh_150::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_100vh_150::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_0p {
  overflow-x: hidden;
  position: relative;
  height: calc(100%); /*100vh*/
  border-radius: 0rem;
}
.scrollbar_0p::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.scrollbar_y_0p {
  overflow-y: hidden;
  position: relative;
  height: calc(100%); /*100vh*/
  border-radius: 0rem;
}
.scrollbar_y_0p::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.scrollbar_me {
  overflow-x: hidden;
  position: relative;
  height: calc(100vh);
  border-radius: 0rem;
}
.scrollbar_me::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_me::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_me::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_me::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_me_pc {
  overflow-x: hidden;
  position: relative;
  height: calc(100vh);
  border-radius: 0rem;
}
.scrollbar_me_pc::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_me_pc::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_me_pc::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_me_pc::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_me_xy {
  position: relative;
  height: calc(100%);
  border-radius: 0rem;
}
.scrollbar_me_xy::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scrollbar_me_xy::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_me_xy::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_me_xy::-webkit-scrollbar-thumb {
  background: #888;
}
.ex_300 .tableFixHead {
  overflow: auto;
  height: calc(100vh - 300px);
}
.tableFixHead {
  overflow: auto;
  height: calc(100vh - 420px);
}
.tableFixHead thead tr th {
  position: sticky;
  top: -2px;
  z-index: 1;
}
/* Just common table stuff. Really. */
.tableFixHead table {
  border-collapse: collapse;
  width: 100%;
}
.tableFixHead th,
.tableFixHead td {
  padding: 8px 16px;
}
.tableFixHead th {
  background: #2c2c2c;
}
.tableFixHead tr.bg_grey_17 th {
  background: #171717;
}
.tableFixHead_grey thead tr th {
  position: sticky;
  top: -2px;
  z-index: 1;
}
/* Just common table stuff. Really. */
.tableFixHead_grey table {
  border-collapse: collapse;
  width: 100%;
}
.tableFixHead_grey th,
.tableFixHead_grey td {
  padding: 8px 16px;
}
.tableFixHead_grey th {
  background: #ddd;
}
.ex_map .tableFixHead_grey {
  overflow: auto;
  /*  height: calc(100vh - 0px);*/
  height: 100%;
}
.tableFixHead_dark thead tr th {
  position: sticky;
  top: -2px;
  z-index: 1;
}
.tableFixHead_dark table {
  border-collapse: collapse;
  width: 100%;
}
.tableFixHead_dark th,
.tableFixHead_dark td {
  padding: 8px 16px;
}
.tableFixHead_dark th {
  background: #171717;
}
.ex_map .tableFixHead_dark {
  overflow: auto;
  height: 100%;
}
.ex_map .tableFixHead th {
  /*  background: #ddd !important;*/
}
.px-1_me {
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
}
/* TrueConnect */
.bg_red {
  background-color: #cc0000;
}
.bg_grey_f3 {
  background-color: #dddddd;
}
.bg_grey_fafbfc {
  background-color: #fafbfc;
}
.table td,
.table th,
.table tr {
  transition: background-color ease-in-out 0s;
}
.border_bottom_1_666 {
  border-bottom: 1px solid #666666 !important;
}
.border_bottom_1_f3 {
  border-bottom: 1px solid #dddddd !important;
}
.border_bottom_1_f3_pc {
  border-bottom: 1px solid #dddddd !important;
}
.border_bottom_1_111 {
  border-bottom: 1px solid #111 !important;
}
.border_bottom_1_222 {
  border-bottom: 1px solid #222 !important;
}
.border_bottom_1_333 {
  border-bottom: 1px solid #333 !important;
}
.border_bottom_1_4d {
  border-bottom: 1px solid #4d4d4d !important;
}
.border_top_1_f3 {
  border-top: 1px solid #dddddd !important;
}
.border_top_1_111 {
  border-top: 1px solid #111111 !important;
}
.border_top_1_333 {
  border-top: 1px solid #333333 !important;
}
.border_top_1_ccc {
  border-top: 1px solid #cccccc !important;
}
.border_top_1_e5 {
  border-top: 1px solid #e5e5e5 !important;
}
.border_top_1_f3_pc {
  border-top: 1px solid #dddddd !important;
}
.border_x_1_f3 {
  border-left: 1px solid #dddddd !important;
  border-right: 1px solid #dddddd !important;
}
.border_x_1_f3_pc {
  border-left: 1px solid #dddddd !important;
  border-right: 1px solid #dddddd !important;
}
.border_right_1_111 {
  border-right: 1px solid #111111 !important;
}
.border_right_1_f3 {
  border-right: 1px solid #dddddd !important;
}
.border_right_1_333 {
  border-right: 1px solid #333333 !important;
}
.border_right_1_ddd {
  border-right: 1px solid #ddd !important;
}
.border_right_1_66 {
  border-right: 1px solid #666 !important;
}
.border_right_1_f3_pc {
  border-right: 1px solid #dddddd !important;
}
.border_right_1_333_pc {
  border-right: 1px solid #333 !important;
}
.border_right_md_1 {
  border-right: 1px solid #dddddd !important;
}
.border_left_1_333 {
  border-left: 1px solid #333 !important;
}
.border_left_1_f3_pc {
  border-left: 1px solid #dddddd !important;
}
.border_left_1_e5 {
  border-left: 1px solid #e5e5e5 !important;
}
.temp_dark .switchery > small {
  background-color: #999999 !important;
  width: 15px;
  height: 15px;
}
.temp_dark .switchery {
  background-color: #666666 !important;
  border: 0px solid #ddd;
  cursor: pointer;
  display: block;
  line-height: 1;
  width: 30px;
  height: 15px;
}
.form-check-switchery:not(.dropdown-item) {
  padding-left: 2.5rem;
}
.switch label input[type="checkbox"]:checked + .lever:after {
  background-color: #ff5252 !important;
}
.switch label input[type="checkbox"]:checked + .lever {
  background-color: #ff5252 !important;
}
.txt_kpi_head_date {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  /*  line-height: 1.35em;*/
  font-size: 18px; /*24*/ /*40*/ /*33*/
}
.box_type_green {
  background-color: #6ea954;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_green2 {
  background-color: #78a761;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
  min-width: 15px;
  min-height: 15px;
}
.box_type_greenlight {
  background-color: #96c580;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_greenlight2 {
  background-color: #93c47d;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
  min-width: 15px;
  min-height: 15px;
}
.box_type_red {
  background-color: #cc0000; /*E06666*/
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_red2 {
  background-color: #e06666;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
  min-width: 15px;
  min-height: 15px;
}
.box_type_15p {
  width: 15px;
  height: 15px;
  margin-right: 5px;
  border-radius: 3px;
  min-width: 15px;
  min-height: 15px;
}
.circle_type_7p {
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 100px;
  min-width: 7px;
  min-height: 7px;
  border: 1px solid;
}
.circle_type_10p {
  width: 10px;
  height: 10px;
  margin-right: 5px;
  border-radius: 100px;
  min-width: 10px;
  min-height: 10px;
  border: 1px solid;
}
.circle_type_12p {
  width: 12px;
  height: 12px;
  margin-right: 5px;
  border-radius: 100px;
  min-width: 12px;
  min-height: 12px;
  border: 1px solid;
}
.circle_type_13p {
  width: 13px;
  height: 13px;
  margin-right: 5px;
  border-radius: 100px;
  min-width: 13px;
  min-height: 13px;
  border: 1px solid;
}
.box_type_1p {
  width: 10px;
  height: 1px;
  margin-right: 5px;
  border-radius: 3px;
  min-width: 10px;
  min-height: 1px;
}
.box_type_10p {
  width: 10px;
  height: 10px;
  margin-right: 5px;
  border-radius: 3px;
  min-width: 10px;
  min-height: 10px;
}
.box_type_20p {
  width: 20px;
  height: 20px;
  margin-right: 5px;
  border-radius: 4px;
  min-width: 20px;
  min-height: 20px;
}
.box_type_yellow {
  background-color: #eec13f;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_yellow2 {
  background-color: #ff9900;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
  min-width: 15px;
  min-height: 15px;
}
.box_type_blue {
  background-color: #4786c4;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_blue2 {
  background-color: #6fa8dc;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
  min-width: 15px;
  min-height: 15px;
}
.box_type_grey {
  background-color: #999; /*D9D9D9*/
  width: 15px;
  height: 15px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_green_20p {
  background-color: #6ea954;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_greenlight_20p {
  background-color: #96c580;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_red_20p {
  background-color: #c60000;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_yellow_20p {
  background-color: #eec13f;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_blue_20p {
  background-color: #4786c4;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
}
.box_type_grey_20p {
  background-color: #999; /*D9D9D9*/
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
}
.bar_status_grey {
  background-color: #ccc; /*D9D9D9*/
  width: 100%;
  height: 10px;
  position: absolute;
  top: 50%;
  transform: translate(0%, -50%);
  z-index: 0;
}
.circle_type_red {
  background-color: #e06666;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  border-radius: 5rem;
}
.circle_type_yellow {
  background-color: #f6b26b;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  border-radius: 5rem;
}
.circle_type_green {
  background-color: #93c47d;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  border-radius: 5rem;
}
.circle_type_blue {
  background-color: #6fa8dc;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  border-radius: 5rem;
}
.circle_dark {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  font-size: 20px;
  color: #fff;
  text-align: center;
  background: #474747;
}
.circle_dark_border {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  font-size: 24px;
  color: #666666;
  text-align: center;
  border: 1px solid #666666;
}
.circle_dark_border:hover {
  color: #fff;
  border: 1px solid #999999;
}
.circle_dark_bg {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  font-size: 24px;
  color: #666666;
  text-align: center;
  background: rgba(51, 51, 51, 0.8);
}
.circle_dark_bg:hover {
  color: #fff;
  background: rgba(51, 51, 51, 1);
}
.circle_dark_bg_border {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  font-size: 24px;
  color: #666666;
  text-align: center;
  background-color: transparent;
  border: 1px solid #333;
}
.circle_dark_bg_border:hover {
  color: #fff;
  background-color: #333;
  border: 1px solid #333;
}
.capsule_dark_bg {
  height: 100%;
  border-radius: 5rem;
  color: #666666;
  background: rgba(51, 51, 51, 0.8);
}
.bg_kpi_progress_green {
  background-color: #6ea954 !important;
}
.bg_kpi_progress_green2 {
  background-color: #93c47d !important;
}
.bg_kpi_progress_greenlight {
  background-color: #96c580 !important;
}
.bg_kpi_progress_yellow {
  background-color: #eec13f !important;
}
.bg_kpi_progress_yellow2 {
  background-color: #ffd966 !important;
}
.bg_kpi_progress_gray {
  background-color: #999 !important;
}
.bg_kpi_progress_red {
  background-color: #c60000 !important;
}
.bg_kpi_progress_red2 {
  background-color: #e06666 !important;
}
.bg_kpi_progress_orange {
  background-color: #ff8a00 !important;
}
.bg_kpi_table_grey {
  background-color: #eeeeee !important; /*F2F2F2*/
  color: #333 !important;
}
.bg_kpi_progress_blue {
  background-color: #4786c4 !important;
}
.bg_kpi_progress_bluelight {
  background-color: #00aee4 !important;
}
.bg_kpi_grey_f2 {
  background-color: #f2f2f2;
}
.bg_kpi_grey_f3 {
  background-color: #f3f3f3;
}
.bg_kpi_grey_dd {
  background-color: #dddddd;
}
.bg_kpi_grey_ee {
  background-color: #eeeeee;
}
.bg_kpi_grey_d9 {
  background-color: #d9d9d9;
}
.bg_kpi_red {
  background-color: #f4cccc;
}
.bg_kpi_greenlight {
  background-color: #d9ead3;
}
a:hover .bg_kpi_head_hover {
  background-color: #eeeeee;
}
.bg_grey_f3_hover {
  background-color: #f3f3f3;
}
a .bg_grey_f3_hover {
  background-color: #fff;
}
a:hover .bg_grey_f3_hover {
  background-color: #f3f3f3;
}
a:hover .bg_kpi_red {
  background-color: #f4bebe;
}
.rounded_2x {
  border-radius: 10px;
}
a:hover .hover_ic_copy {
  background-image: url("../images/bms/ic_copy.png");
  background-position: right 20px center;
  background-repeat: no-repeat;
  background-size: contain;
}
.btn_kpi_grey_light_border.bg_transparent {
  color: #888;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1rem;
  border: 1px solid #d9d9d9;
}
.btn_kpi_grey_light_border {
  color: #888;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1rem;
  border: 1px solid #d9d9d9;
}
.btn_kpi_grey_light_border:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_kpi_grey_light_border.h2dot5,
.btn_kpi_red_light_border.h2dot5,
.btn_kpi_red.h2dot5 {
  padding: 0.35rem 1rem;
}
.btn_kpi_grey_light_border2 {
  color: #888;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1rem;
  border: 1px solid #d9d9d9;
}
.btn_kpi_grey_light_border2:hover {
  color: #fff;
  background-color: #b1261f;
  border: 1px solid #b1261f;
}
.btn_ex_grey_light_border {
  color: #666666;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.2rem;
  border: 1px solid #666666;
}
.btn_ex_grey_light_border:hover,
.btn_ex_grey_light_border.active {
  color: #fff !important;
  background-color: #333;
  border: 1px solid #999999;
}
.btn_ex_grey_light_border2.red:hover,
.btn_ex_grey_light_border2.red.active {
  color: #cc4125 !important;
  background-color: #333;
  border: 1px solid #cc4125 !important;
}
.btn_ex_grey_light_border.h_42p {
  color: #666666;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.35rem 1.2rem;
  border: 1px solid #666666;
}
.btn_ex_grey_light_border_333.h42p {
  color: #666666;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.2rem;
  border: 1px solid #333;
}
.btn_ex_grey_light_border_333 {
  color: #666666;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.2rem;
  border: 1px solid #333;
}
.btn_ex_grey_light_border_333:hover,
.btn_ex_grey_light_border_333.active {
  color: #fff !important;
  background-color: #333;
  border: 1px solid #333;
}
.btn_ex_grey_light_border_333.h_42p {
  color: #666666;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.35rem 1.2rem;
  border: 1px solid #333;
}
.btn_ex_red_light_border {
  color: #cc4125;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.2rem;
  border: 1px solid #cc4125;
}
.btn_ex_red_light_border:hover,
.btn_ex_red_light_border.active {
  color: #fff !important;
  background-color: #cc4125 !important;
  border: 1px solid #cc4125;
}
.btn_ex_red_light_border.h_42p {
  color: #cc4125;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.35rem 1.2rem;
  border: 1px solid #cc4125;
}
.btn_ex_w_light_border {
  color: #fff;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.2rem;
  border: 1px solid #fff;
}
.btn_ex_w_light_border:hover,
.btn_ex_w_light_border.active {
  color: #cc4125 !important;
  background-color: #fff !important;
  border: 1px solid #fff;
}
.btn_ex_w_light_border.h_42p {
  color: #fff;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.35rem 1.2rem;
  border: 1px solid #fff;
}
.btn_ex_grey_light_border2 {
  color: #666666;
  background-color: transparent;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.2rem;
  border: 1px solid #333;
}
.btn_ex_grey_light_border2:hover,
.btn_ex_grey_light_border2.active {
  color: #fff;
  background-color: #111;
  border: 1px solid #999999;
}
.btn_kpi_green_sm {
  color: #6ea954;
  /*  background-color: #FFFFFF;*/
  border-radius: 5rem;
  font-size: 14px;
  padding: 0rem 0.2rem;
  border: 1px solid #6ea954;
  text-align: center;
}
.btn_kpi_greenlight_sm {
  color: #96c580;
  /*  background-color: #FFFFFF;*/
  border-radius: 5rem;
  font-size: 14px;
  padding: 0rem 0.2rem;
  border: 1px solid #96c580;
  text-align: center;
}
.btn_kpi_red_light_border {
  color: #c60000;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.5rem;
  border: 1px solid #c60000;
}
.btn_kpi_red_light_border:hover {
  color: #fff;
  background-color: #c60000;
  border: 1px solid #c60000;
}
.btn_kpi_red {
  color: #fff;
  background-color: #c60000;
  border-radius: 5rem;
  font-size: 1.2rem;
  padding: 0.1375rem 1.5rem;
  border: 1px solid #c60000;
}
.btn_kpi_red:hover {
  color: #c60000;
  background-color: #fff;
  border: 1px solid #c60000;
}
.btn_kpi_red_sm {
  color: #c60000;
  /*  background-color: #FFFFFF;*/
  border-radius: 5rem;
  font-size: 14px;
  padding: 0rem 0.2rem;
  border: 1px solid #c60000;
  text-align: center;
}
.btn_kpi_grey_sm {
  color: #999;
  /*  background-color: #FFFFFF;*/
  border-radius: 5rem;
  font-size: 14px;
  padding: 0rem 0.2rem;
  border: 1px solid #999;
  text-align: center;
}
.btn_kpi_yellow_sm {
  color: #eec13f;
  /*  background-color: #FFFFFF;*/
  border-radius: 5rem;
  font-size: 14px;
  padding: 0rem 0.2rem;
  border: 1px solid #eec13f;
  text-align: center;
}
.btn_plus_grey_d9 {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #d9d9d9;
  line-height: 1.35em;
  font-size: 14px;
  border: 1px solid #d9d9d9;
  height: 40px;
  width: 40px !important;
  min-width: 40px;
  border-radius: 50% !important;
}
.btn_plus_grey_d9:hover {
  color: #c90000;
  border: 1px solid #c90000;
}
/*start progress bar timeline*/
.table_bms_timeline {
  font-family: "TrueTextOnline-Regular";
  border-bottom: 1px solid #dddddd;
  border-top: 0px;
  font-size: 20px;
  color: #000;
}
.table.table_bms_timeline td,
.table.table_bms_timeline th {
  padding: 0 14px;
}
.btn_option_timeline {
  visibility: hidden;
}
.table_bms_timeline tr:hover .btn_option_timeline {
  visibility: visible;
}
.table_bms_timeline .btn_circle_icon_more {
  padding: 4px 6px;
}
.table_bms_timeline:hover .btn_circle_icon_more {
  background-color: #ffffff;
  padding: 0 6px;
}
.progress_bar_timeline {
  color: #000;
  font-size: 14px;
  padding: 0rem 0.2rem;
  text-align: center;
}
.border_left_timeline {
  border-top-left-radius: 5rem;
  border-bottom-left-radius: 5rem;
}
.border_right_timeline {
  border-top-right-radius: 5rem;
  border-bottom-right-radius: 5rem;
}
.bg_timeline_green {
  background-color: #b6d7a8;
}
.bg_timeline_yellow {
  background-color: #ffe599;
}
.bg_timeline_red {
  background-color: #ea9999;
}
.bg_timeline_gray {
  background-color: #d9d9d9;
}
.border_left_red_timeline {
  border-left: 2px solid #e06666;
}
.pointer_timeline {
  width: 22px;
  height: 22px;
  position: relative;
  background: #e06666;
}
.pointer_timeline:before {
  content: "";
  position: absolute;
  right: -22px;
  bottom: 0;
  width: 22px;
  height: 0;
  border-left: 11px solid #e06666;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
}
/*end progress bar timeline*/
.bar_kpi_headtopic_w {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  padding: 8px 14px;
  background-color: #ffffff;
  font-size: 20px;
  border-bottom: 1px solid #dddddd;
}
.bar_kpi_headtopic_w2 {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  background-color: #ffffff;
  font-size: 16px;
}
.bar_kpi_headtopic_greenlight {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #fff;
  line-height: 1.3em;
  padding: 8px 14px;
  background-color: #96c580;
  font-size: 16px;
  border-bottom: 1px solid #dddddd;
}
.bar_kpi_headtopic_redline {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #fff;
  line-height: 1.3em;
  padding: 8px 14px;
  background-color: #c60000;
  font-size: 16px;
  border-bottom: 1px solid #dddddd;
}
.bar_kpi_headtopic_black {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  /*  background-color: #FFFFFF;*/
  font-size: 20px; /*16*/
  padding: 8px 14px;
}
a .card-header:hover .bar_kpi_headtopic_black {
  color: #cc0000;
  background-color: #f3f3f3;
}
.bar_bms_headpopover_black {
  font-family: "TrueTextOnline-regular";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  font-size: 20px;
  padding: 8px 14px;
}
.bar_bms_headtopic_black {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  /*  background-color: #FFFFFF;*/
  font-size: 24px; /*16*/
  padding: 8px 14px;
}
.card_bms_hover:hover {
  background-color: #f3f3f3;
}
.card_bms_hover:hover .btn_kpi_grey_light_border.disabled {
  background-color: #f3f3f3;
  border: 0px;
}
.card_bms_hover .active,
.card_bms_hover.active {
  background-color: #f3f3f3;
  color: #e7383b;
}
.card_dark_hover:hover {
  background-color: #666;
}
.card_dark_hover:hover.bg_grey_222 {
  background-color: #2c2c2c !important;
}
.card_dark_hover:hover .btn_kpi_grey_light_border.disabled {
  background-color: #666;
  border: 0px;
}
.card_dark_hover .active,
.card_dark_hover.active {
  background-color: #666;
  color: #fff;
}
.card_dark_hover:hover.bg_mic_red {
  background-color: #b75c5c;
}
.card_dark_hover:hover.bg_mic_yellow {
  background-color: #c69f30;
}
.card_dark_hover:hover.bg_mic_green_light {
  background-color: #71985e;
}
.card_dark_hover:hover.bg_mic_green {
  background-color: #5c895c;
}
.card_dark_hover:hover.bg_mic_blue {
  background-color: #3a6ea1;
}
.card_dark_hover:hover.bg_mic_blue2 {
  background-color: #3a6ea1;
}
.card_dark_hover:hover.bg_mic_grey {
  background-color: #b7b7b7;
}
.card_dark_hover:hover.bg_mic_grey2 {
  background-color: #777777;
}
.card_dark_hover:hover.bg_red_alert {
  background-color: #9f331d;
}
.bar_kpi_navlink {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  /*  background-color: #FFFFFF;*/
  font-size: 16px;
  padding: 6px 14px !important;
}
.bar_bms_navlink {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  font-size: 20px;
  padding: 15px 14px 14px 14px !important;
}
.bar_bms_navlink2 {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  font-size: 20px;
  padding: 5px 14px !important;
}
.bar_bms_navlink3 {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  font-size: 20px !important;
  padding: 12px 14px !important;
}
.bar_bms_navlink4 {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 22px;
  font-size: 20px;
  padding: 6px 14px !important;
}
.bar_kpi_headtopic_white {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #ffffff;
  line-height: 1.3em;
  font-size: 16px;
  padding: 8px 14px;
}
.bar_kpi_headtopic_red {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  padding: 8px 14px;
  background-color: #ffffff;
  font-size: 16px;
  border-bottom: 1px solid #dddddd;
}
.bar_kpi_headtopic_redlight {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #ffffff;
  line-height: 1.3em;
  padding: 8px 14px;
  background-color: #db6266;
  font-size: 16px;
  border-bottom: 1px solid #dddddd !important;
}
.bar_kpi_headpic_grey {
  font-family: "TrueTextOnline-Bold";
  font-size: 18px;
  font-style: normal;
  color: #555555;
  line-height: 1.3em;
  padding: 3px 14px;
  background-color: #eeeeee; /*F3F3F3*/
}
.bar_kpi_headpic_grey_f3 {
  font-family: "TrueTextOnline-Bold";
  font-size: 18px;
  font-style: normal;
  color: #555555;
  line-height: 1.3em;
  padding: 3px 14px;
  background-color: #f3f3f3;
}
.bar_cluster_headpic_grey {
  font-family: "TrueTextOnline-Bold";
  font-size: 18px;
  font-style: normal;
  color: #555555;
  line-height: 1.3em;
  padding: 3px 14px;
  background-color: #eeeeee; /*F3F3F3*/
}
.txt_cluster_head_grey {
  font-family: "TrueTextOnline-Bold";
  font-size: 16px;
  font-style: normal;
  color: #000;
  line-height: 1.3em;
}
.txt_cluster_head_w {
  font-family: "TrueTextOnline-Bold";
  font-size: 16px;
  font-style: normal;
  color: #fff;
  line-height: 1.3em;
}
.bar_cluster_headpic_red {
  font-family: "TrueTextOnline-Bold";
  font-size: 18px;
  font-style: normal;
  color: #fff;
  line-height: 1.3em;
  padding: 3px 14px;
  background-color: #c60000;
}
.txt_cluster_grey_16p {
  font-family: "TrueTextOnline-Bold";
  font-size: 16px;
  font-style: normal;
  color: #888;
  line-height: 1.3em;
}
a:hover .txt_cluster_grey_16p,
a:hover .bar_cluster_headpic_grey {
  color: #e7383b;
  background-color: #dddddd;
}
a:hover .txt_kpi_head {
  color: #e7383b;
}
.kpi_hover_card:hover .card {
  background-color: #fafafa !important;
  /*  color: #000;*/
}
.bar_kpi_headtopic_grey {
  font-family: "TrueTextOnline-Bold";
  font-size: 16px;
  font-style: normal;
  color: #888;
  line-height: 1.3em;
  padding: 8px 14px;
}
.px_kpi_card {
  padding: 8px 14px;
}
.px_kpi_card2 {
  padding: 10px 14px; /*14 14*/
}
.px_kpi_card3 {
  padding-left: 14px !important;
  padding-right: 14px !important;
}
.px_kpi_card4 {
  padding: 8px 4px;
}
.px_kpi_card5 {
  padding: 5px 14px;
}
.px_kpi_card6 {
  padding: 8px 10px;
}
.px_kpi_card_m {
  padding: 8px 9px;
}
.px_kpi_card7 {
  padding: 3px 14px;
}
.px_kpi_card8 {
  padding: 3px 14px;
}
.px_kpi_card9 {
  padding: 3px 14px;
}
.px_kpi_card10 {
  padding: 14px 14px;
}
.px_kpi_card11 {
  padding: 3px 10px;
}
.px_kpi_card12 {
  padding: 5px 10px;
}
.px_kpi_card13 {
  padding: 10px 10px 8px 10px;
}
.px_kpi_card14 {
  padding: 5px 10px;
}
.px_kpi_card15 {
  padding: 12px 18px;
}
.px_kpi_card16 {
  padding: 5px 15px;
}
.px_kpi_card17 {
  padding: 10px 15px;
}
.p_kpi_card_0_5 {
  padding: 0px 0px;
}
.p_kpi_card_6_10 {
  padding: 6px 10px;
}
.p_kpi_card_8_10 {
  padding: 8px 10px;
}
.p_kpi_card_10_5 {
  padding: 10px 5px;
}
.p_kpi_card_10_10 {
  padding: 10px 10px;
}
.p_kpi_card_12_10 {
  padding: 12px 10px;
}
.px_kpi_card_m0_p10p {
  padding: 8px 10px;
}
.px_mic_chart {
  padding: 3px 10px;
}
.p_mic_chart_l {
  padding: 5px 10px 5px 15px !important;
}
.p_mic_chart_r {
  padding: 5px 15px 5px 10px !important;
}
.px_5p {
  padding-left: 5px !important;
  padding-right: 5px !important;
}
.px_6p {
  padding-left: 6px !important;
  padding-right: 6px !important;
}
.px_7p {
  padding-left: 7px !important;
  padding-right: 7px !important;
}
.px_8p {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
.px_9p {
  padding-left: 9px !important;
  padding-right: 9px !important;
}
.px_10p {
  padding-left: 10px !important;
  padding-right: 10px !important;
}
.px_15p {
  padding-left: 15px !important;
  padding-right: 15px !important;
}
.px_m15p_10p {
  padding-left: 10px !important;
  padding-right: 10px !important;
}
.px_14p {
  padding-left: 14px !important;
  padding-right: 14px !important;
}
.pr_0p {
  padding-right: 0px !important;
}
.p_5p {
  padding: 5px;
}
.table_cn_border.table-hover tbody tr:hover td {
  color: #b1261f;
  background-color: #ffffff;
}
.table_cn_border.table-hover tbody tr.bg_kpi_grey_f3 td {
  color: #000;
  background-color: #f3f3f3;
}
.txt_kpi_blod {
  font-family: "TrueTextOnline-Bold" !important;
}
.txt_kpi_green {
  color: #6ea954 !important;
}
.txt_kpi_greenlight {
  color: #96c580 !important;
}
.txt_kpi_red {
  color: #cc0000 !important; /*C60000*/
}
.txt_kpi_red_bold {
  color: #cc0000 !important;
  font-family: "TrueTextOnline-Bold" !important;
}
.txt_kpi_blue {
  color: #4786c4;
}
.txt_kpi_w {
  color: #ffffff;
}
.txt_kpi_yellow {
  color: #eec13f;
}
.txt_kpi_grey {
  color: #888888;
}
.txt_kpi_grey_888 {
  color: #888888;
}
.txt_tcn_grey {
  color: #f3f3f3;
}
.txt_kpi_title_16p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  line-height: 1.2em;
  /*  background-color: #FFFFFF;*/
  font-size: 16px;
}
.txt_kpi_head_16p {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  line-height: 1.2em;
  font-size: 16px;
}
.txt_kpi_head_20p {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  line-height: 1.2em;
  /*  background-color: #FFFFFF;*/
  font-size: 20px;
}
.txt_kpi_head_r_20p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  line-height: 1.2em;
  /*  background-color: #FFFFFF;*/
  font-size: 20px;
}
.txt_kpi_head_22p {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  line-height: 1.2em;
  /*  background-color: #FFFFFF;*/
  font-size: 22px;
}
.txt_kpi_head_24p {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  line-height: 1.2em;
  /*  background-color: #FFFFFF;*/
  font-size: 24px;
}
.txt_kpi_head_26p {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  line-height: 1.2em;
  /*  background-color: #FFFFFF;*/
  font-size: 26px;
}
.txt_kpi_num_100p {
  font-size: 100px;
  font-family: "TrueTextOnline-bold";
  line-height: 6rem;
}
.kpi_active {
  background-color: #bfbfbf;
}
.hover_grey:hover {
  background-color: #dddddd;
}
.hover_grey_fa:hover {
  background-color: #fafbfc;
}
.badge_square {
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #ffffff;
  line-height: 1em;
  font-size: 28px;
  margin-top: auto;
  margin-bottom: auto;
  padding: 5px;
}
.badge_5p {
  padding: 5px 5px;
  font-size: 0;
  position: relative;
  top: -3px;
  left: 0;
}
.badge_7p {
  padding: 7px 7px;
  font-size: 0;
  position: relative;
  top: -6px;
  left: 0;
}
.badge_10p {
  padding: 10px 10px;
  font-size: 0;
  position: relative;
  top: -9px;
  left: 0;
}
.breadcrumb-item {
  padding-top: 0px;
  font-size: 18px;
}
.swiper-container-horizontal
  > .swiper-pagination-bullets
  .swiper-pagination-bullet {
  margin: 0 4px;
  border: 0px solid #d9d9d9 !important;
}
.content {
  padding: 0.75rem 0.75rem;
}
.progress {
  background-color: #ffffff;
}
.progress_grey {
  background-color: #dddddd;
}
.progress_grey_222 {
  background-color: #222222;
}
.progress_grey_2c {
  background-color: #2c2c2c;
}
.progress_grey_333 {
  background-color: #333333;
}
.progress_grey_666 {
  background-color: #666666;
}
.progress_grey_e5 {
  background-color: #e5e5e5;
}
.m_width_6part {
  width: 16.66%;
}
.m_width_fix_table {
  min-width: 360px;
  width: 360px;
}
.mt_kpi_thead {
  margin-top: 50px;
}
.card-group .card:first-child {
  border-bottom-left-radius: 10px;
}
.card-group .card {
  border-radius: 0rem;
}
.card-group .card:last-child {
  border-bottom-right-radius: 10px;
}
.px_kpi_me_3 {
  padding-left: 0.3rem;
  padding-right: 0.3rem;
}
.px_kpi_14p {
  padding-left: 14px;
  padding-right: 14px;
}
/*
.fitscreen {
  overflow: hidden;
}
*/
.fitscreen .p-2 {
  padding: 0.3rem !important;
}
.fitscreen .p_2_me {
  padding: 0.5rem !important;
}
.fitscreen .row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -0.3rem;
  margin-left: -0.3rem;
}
.fitscreen .col,
.fitscreen .col-1,
.fitscreen .col-10,
.fitscreen .col-11,
.fitscreen .col-12,
.fitscreen .col-2,
.fitscreen .col-3,
.fitscreen .col-4,
.fitscreen .col-5,
.fitscreen .col-6,
.fitscreen .col-7,
.fitscreen .col-8,
.fitscreen .col-9,
.fitscreen .col-auto,
.fitscreen .col-lg,
.fitscreen .col-lg-1,
.fitscreen .col-lg-10,
.fitscreen .col-lg-11,
.fitscreen .col-lg-12,
.fitscreen .col-lg-2,
.fitscreen .col-lg-3,
.fitscreen .col-lg-4,
.fitscreen .col-lg-5,
.fitscreen .col-lg-6,
.fitscreen .col-lg-7,
.fitscreen .col-lg-8,
.fitscreen .col-lg-9,
.fitscreen .col-lg-auto,
.fitscreen .col-md,
.fitscreen .col-md-1,
.fitscreen .col-md-10,
.fitscreen .col-md-11,
.fitscreen .col-md-12,
.fitscreen .col-md-2,
.fitscreen .col-md-3,
.fitscreen .col-md-4,
.fitscreen .col-md-5,
.fitscreen .col-md-6,
.fitscreen .col-md-7,
.fitscreen .col-md-8,
.fitscreen .col-md-9,
.fitscreen .col-md-auto,
.fitscreen .col-sm,
.fitscreen .col-sm-1,
.fitscreen .col-sm-10,
.fitscreen .col-sm-11,
.fitscreen .col-sm-12,
.fitscreen .col-sm-2,
.fitscreen .col-sm-3,
.fitscreen .col-sm-4,
.fitscreen .col-sm-5,
.fitscreen .col-sm-6,
.fitscreen .col-sm-7,
.fitscreen .col-sm-8,
.fitscreen .col-sm-9,
.fitscreen .col-sm-auto,
.fitscreen .col-xl,
.fitscreen .col-xl-1,
.fitscreen .col-xl-10,
.fitscreen .col-xl-11,
.fitscreen .col-xl-12,
.fitscreen .col-xl-2,
.fitscreen .col-xl-3,
.fitscreen .col-xl-4,
.fitscreen .col-xl-5,
.fitscreen .col-xl-6,
.fitscreen .col-xl-7,
.fitscreen .col-xl-8,
.fitscreen .col-xl-9,
.fitscreen .col-xl-auto {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 0.3rem;
  padding-left: 0.3rem;
}
.fitscreen .pl-2,
.fitscreen .px-2 {
  padding-left: 0.3rem !important;
}
.fitscreen .pr-2,
.fitscreen .px-2 {
  padding-right: 0.3rem !important;
}
/*
.fitscreen .pt-2, .fitscreen .py-2 {
  padding-top: .3rem !important;
}
.fitscreen .pb-2, .fitscreen .py-2 {
  padding-bottom: .3rem !important;
}
*/
.fitscreen .pb-md-3,
.fitscreen .py-md-3 {
  /*  padding-bottom: 0.6rem !important;*/
}
.fitscreen .pt-md-3,
.fitscreen .py-md-3 {
  padding-top: 0.6rem !important;
}
.fitscreen .pl-md-3,
.fitscreen .px-md-3 {
  padding-left: 0.6rem !important;
}
.fitscreen .pr-md-3,
.fitscreen .px-md-3 {
  padding-right: 0.6rem !important;
}
.h_100per_0m {
  height: 100%;
}
.img_kpi_chartmini {
  width: 100%;
  height: 15px;
  padding-left: 10px;
  max-width: 65px;
}
.fitscreen select.form-control:not([size]):not([multiple]) {
  height: 46px;
}
.fitscreen select.select_40p:not([size]):not([multiple]) {
  height: 42px;
}
.fitscreen select.select_45p:not([size]):not([multiple]) {
  height: 45px;
}
.fitscreen select.select_50p:not([size]):not([multiple]) {
  height: 50px;
}
/*DatePicker*/
.datepicker table tr td span.active.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled.disabled,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover.active,
.datepicker table tr td span.active.disabled:hover.disabled,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active.disabled:hover[disabled],
.datepicker table tr td span.active.disabled[disabled],
.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active:hover.disabled,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active:hover:hover,
.datepicker table tr td span.active:hover[disabled],
.datepicker table tr td span.active[disabled] {
  background-color: #c60000 !important;
}
.datepicker table tr td span.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active:hover {
  background-color: #c60000 !important;
  background-image: -moz-linear-gradient(
    to bottom,
    #c60000,
    #c60000
  ) !important;
  background-image: -ms-linear-gradient(to bottom, #c60000, #c60000) !important;
  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    from(#c60000),
    to(#c60000)
  ) !important;
  background-image: -webkit-linear-gradient(
    to bottom,
    #c60000,
    #c60000
  ) !important;
  background-image: -o-linear-gradient(to bottom, #c60000, #c60000) !important;
  background-image: linear-gradient(to bottom, #c60000, #c60000) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c60000', endColorstr='#0044cc', GradientType=0) !important;
  border-color: #c60000 #c60000 #c60000 !important;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
}
.datepicker table tr td span.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active:hover {
  background-color: #c60000 !important;
  background-image: -moz-linear-gradient(
    to bottom,
    #c60000,
    #c60000
  ) !important;
  background-image: -ms-linear-gradient(to bottom, #c60000, #c60000) !important;
  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    from(#c60000),
    to(#c60000)
  ) !important;
  background-image: -webkit-linear-gradient(
    to bottom,
    #c60000,
    #c60000
  ) !important;
  background-image: -o-linear-gradient(to bottom, #c60000, #c60000) !important;
  background-image: linear-gradient(to bottom, #c60000, #c60000) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c60000', endColorstr='#0044cc', GradientType=0) !important;
  border-color: #c60000 #c60000 #c60000 !important;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.datepicker {
  padding: 14px !important;
}
.datepicker.p-0 {
  padding: 0px !important;
}
.datepicker {
  cursor: pointer;
}
/* /.DatePicker*/
/* 100 vh */
.top-content {
  width: 100%;
  height: calc(100vh - 50px);
  padding: 0;
  padding: 0.3rem;
}
.top-content.e_topmenu {
  width: 100%;
  height: calc(100vh - 148px);
  padding: 0;
  padding: 0.3rem;
}
.review-bar {
  width: 100%;
  height: 50px;
  background-color: green;
}
@media (max-width: 820px) {
  .daterangepicker.opensleft .calendar {
    margin-right: 0.9375rem;
    margin-left: 0.9375rem;
  }
  .daterangepicker .calendar,
  .daterangepicker .ranges {
    margin-left: 0.9375rem;
    margin-bottom: 15px;
  }
}
@media (max-width: 768px) {
  .img_kpi_chartmini {
    width: 100%;
  }
}
@media (max-width: 576px) {
  .daterangepicker.opensleft .calendar {
    margin-right: 0.9375rem;
    margin-left: 0;
  }
  .daterangepicker .calendar,
  .daterangepicker .ranges {
    margin-left: 0;
  }
  .border_right_md_1 {
    border-right: 0px !important;
  }
  .top-content {
    width: 100%;
    height: calc(100vh - 66px);
    padding: 0;
  }
  .fitscreen .p-2 {
    padding: 10px 10px 0 10px !important;
  }
}
.small_me {
  font-size: 70%;
  font-weight: 400;
}
@media (max-width: 320px) {
  .small_me {
    font-size: 55%;
    font-weight: 400;
  }
}
/* /.100 vh */
.filter.form-control {
  border: 1px solid #dddddd;
}
.info-container {
  font-size: 16px;
  color: #333333;
}
.info-container .info {
  margin-top: 0.5rem !important;
}
.btn.moveall,
.btn.remove {
  border-top: 1px solid #dddddd;
  border-left: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}
.btn.move,
.btn.removeall {
  border-top: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}
/* /.TrueConnect*/
/* Arrow left-right */
.cd-table-navigation a.prev {
  left: 345px;
  right: auto;
  -webkit-transform: translateY(55px) translateX(15px) rotate(180deg);
  -moz-transform: translateY(55px) translateX(15px) rotate(180deg);
  -ms-transform: translateY(55px) translateX(15px) rotate(180deg);
  -o-transform: translateY(55px) translateX(15px) rotate(180deg);
  transform: translateY(55px) translateX(15px) rotate(180deg);
}
.cd-table-navigation a {
  position: absolute;
  z-index: 2;
  top: 40%;
  right: 15px;
  -webkit-transform: translateY(55px);
  -moz-transform: translateY(55px);
  -ms-transform: translateY(55px);
  -o-transform: translateY(55px);
  transform: translateY(55px);
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  color: transparent;
  height: 60px;
  width: 40px;
  background: rgba(64, 64, 66, 0.8) url(../images/responsive_table/cd-arrow.svg)
    no-repeat center center;
  border-radius: 3px;
  -webkit-transition: background-color 0.3s, opacity 0.3s, visibility 0.3s,
    -webkit-transform 0.3s;
  -moz-transition: background-color 0.3s, opacity 0.3s, visibility 0.3s,
    -moz-transform 0.3s;
  transition: background-color 0.3s, opacity 0.3s, visibility 0.3s,
    transform 0.3s;
}
ol,
ul {
  list-style: none;
}
/* /.Arrow left-right */
.progress_h {
  height: 3px;
}
.progress_h4p {
  height: 4px;
}
.progress_h5p {
  height: 5px;
}
.progress_h6p {
  height: 6px;
}
.progress_h8p {
  height: 8px;
  margin-top: 2px;
}
.progress_h10p {
  height: 10px;
}
.progress_h20p {
  height: 20px;
}
.px_kpi_navbar {
  padding-left: 25px; /*20*/
  padding-right: 25px; /*20*/
}
.px_navbar_me {
  padding-left: 25px;
  padding-right: 25px;
}
.px_navbar_me_35p {
  padding-left: 35px;
  padding-right: 35px;
}
.px_navbar_w100 {
  padding-left: 10px;
  padding-right: 10px;
  min-width: 100px;
  text-align: center;
}
.uniform-uploader .filename_me {
  color: #999;
  padding: 0.4375rem 0.875rem;
  -ms-flex: 1;
  flex: 1;
  border: 1px solid #ddd;
  background-color: #fff;
  text-align: left;
  word-break: break-word;
  border-top-left-radius: 0.1875rem;
  border-bottom-left-radius: 0.1875rem;
}
.img_kpi_hover a img {
  opacity: 0.7;
}
.img_kpi_hover a:hover img {
  opacity: 1;
}
.img_kpi_hover {
  background-color: #f2f2f2;
  color: #888;
}
.img_kpi_hover:hover {
  background-color: #ffffff;
  color: #000;
}
.mb_2p {
  margin-bottom: 2px;
}
.mb_4p {
  margin-bottom: 4px;
}
.mb_5p {
  margin-bottom: 5px;
}
.mb_10p {
  margin-bottom: 10px;
}
.mb_15p {
  margin-bottom: 15px;
}
.datepicker table tr td.active.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active.disabled:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active[disabled] {
  background-color: #c90000 !important;
}
.datepicker table tr td.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active:hover {
  background-color: #006dcc;
  background-image: -moz-linear-gradient(
    to bottom,
    #c90000,
    #c90000
  ) !important;
  background-image: -ms-linear-gradient(to bottom, #c90000, #c90000) !important;
  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    from(#c90000),
    to(#c90000)
  ) !important;
  background-image: -webkit-linear-gradient(
    to bottom,
    #c90000,
    #c90000
  ) !important;
  background-image: -o-linear-gradient(to bottom, #c90000, #c90000) !important;
  background-image: linear-gradient(to bottom, #c90000, #c90000) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c90000', endColorstr='#c90000', GradientType=0) !important;
  border-color: #c90000 #c90000 #c90000 !important;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.box_kpi_h40p {
  max-height: 40px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mt_2p {
  margin-top: 2px;
}
.mt_3p {
  margin-top: 3px;
}
.mt_5p {
  margin-top: 5px;
}
.my_3p {
  margin-top: 3px;
  margin-bottom: 3px;
}
.my_5p {
  margin-top: 5px;
  margin-bottom: 5px;
}
.my_7p {
  margin-top: 7px;
  margin-bottom: 7px;
}
.my_10p {
  margin-top: 10px;
  margin-bottom: 10px;
}
.pb_2p {
  padding-bottom: 2px;
}
.pb_3p {
  padding-bottom: 3px;
}
.pb_5p {
  padding-bottom: 5px;
}
.pb_10p {
  padding-bottom: 10px;
}
.pb_11p {
  padding-bottom: 11px;
}
.px_m0_15p {
  padding-left: 15px;
  padding-right: 15px;
}
.pb_15p {
  padding-bottom: 15px !important;
}
.pb_20p {
  padding-bottom: 20px;
}
.pb_25p {
  padding-bottom: 25px;
}
.pb_30p {
  padding-bottom: 30px;
}
.pb_40p {
  padding-bottom: 40px;
}
.pb_80p {
  padding-bottom: 80px;
}
.form-control-search-border {
  display: block;
  width: 100%;
  padding: 0.1375rem 0.475rem;
  font-size: 20px;
  line-height: 1.5385;
  color: #000;
  background-color: transparent;
  background-clip: padding-box;
  border: 0px solid #ddd;
  border-radius: 0.1875rem;
  box-shadow: 0 0 0 0 transparent;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  height: 2.5rem;
}
.form-control-search-border_dark {
  display: block;
  width: 100%;
  padding: 0.1375rem 0.475rem;
  font-size: 20px;
  line-height: 1.5385;
  color: #fff;
  background-color: transparent;
  background-clip: padding-box;
  border: 0px solid #ddd;
  border-radius: 0.1875rem;
  box-shadow: 0 0 0 0 transparent;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  height: 2.5rem;
}
.form-control-find-border {
  display: block;
  width: 100%;
  padding: 0.1375rem 15px;
  font-size: 20px;
  line-height: 1.5385;
  color: #000;
  background-color: transparent;
  background-clip: padding-box;
  border: 0px solid #ddd;
  border-radius: 0.1875rem;
  box-shadow: 0 0 0 0 transparent;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  height: 2.5rem;
}
.input-group-text-search-border {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.1375rem 0 0.1375rem 0.875rem;
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5385;
  color: #000;
  text-align: center;
  white-space: nowrap;
  background-color: transparent;
  border: 0px solid #ddd;
  border-radius: 10px;
}
.border_search_gray {
  border-radius: 5rem;
  border: 1px solid #ddd; /*F3F3F3 CCC*/
}
.border_search_dark {
  border-radius: 5rem;
  border: 1px solid #333; /*F3F3F3 CCC*/
}
.border_search_dark_57 {
  border-radius: 5rem;
  border: 1px solid #575757;
}
.border_search_grey_ccc {
  border-radius: 5rem;
  border: 1px solid #ccc;
}
.border_search_w {
  border-radius: 5rem;
  border: 1px solid #fff;
}
.bg_bms_portal {
  background-image: url("../images/bms/bg.png");
  background-position: top 125px center;
  background-repeat: no-repeat;
  background-size: cover;
}
.txt_bms_portal_red {
  /*
  font-family: 'Kanit', sans-serif;
  font-weight: 500;
*/
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #cc0000;
  font-size: 24px; /*20*/
}
.txt_bms_admin_portal_red {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #cc0000;
  font-size: 36px; /*20*/
}
.txt_bms_user_portal_red {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #cc0000;
  font-size: 36px; /*20*/
}
.txt_bms_portal_head {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 24px;
}
.txt_bms_portal_head_18p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 18px;
}
.txt_bms_portal_head_20p,
.txt_bms_me_head_20p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 20px;
}
.txt_bms_me_head_14p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 14px;
}
.txt_bms_me_head_16p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 16px;
}
.txt_bms_me_head_22p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 22px;
}
.txt_bms_me_head_24p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 24px;
}
.txt_bms_me_head_26p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 26px;
}
.txt_bms_me_head_28p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 28px;
}
.txt_bms_me_head_30p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 30px;
}
.txt_bms_me_head_40p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 40px;
}
.txt_pride_head_40p {
  font-family: "Kanit", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #434343;
  font-size: 40px;
}
.txt_pride_head_28p {
  font-family: "Kanit", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #434343;
  font-size: 28px;
}
.txt_pride_head_22p {
  font-family: "Kanit", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #434343;
  font-size: 22px;
}
.txt_pride_head_lg {
  font-family: "TrueTextOnline-bold";
  font-weight: 400;
  font-style: normal;
  color: #434343;
  font-size: 40px;
}
.txt_pride_head_sm {
  font-family: "TrueTextOnline-bold";
  font-weight: 400;
  font-style: normal;
  color: #434343;
  font-size: 22px;
}
.ic_good {
  width: 60px;
}
.txt_bms_me_20p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 20px;
}
.txt_bms_portal_head_22p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 22px;
}
.txt_bms_portal_head_24p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 24px;
}
.txt_bms_portal_head_26p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 26px;
}
.txt_bms_portal_head_36p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 36px;
}
.txt_bms_portal_head_48p {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 48px;
}
.txt_bms_portal_head_r_20p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #000;
  line-height: 1em;
  font-size: 20px;
}
.txt_bms_title_20p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #888;
  line-height: 1.35em;
  font-size: 20px;
}
.txt_bms_title_18p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #888;
  line-height: 1.35em;
  font-size: 18px;
}
.txt_bms_title_16p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #888;
  line-height: 1.35em;
  font-size: 16px;
}
.txt_grey_sort_18p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #999;
  line-height: 1.35em;
  font-size: 18px;
}
.txt_bms_filter_black_18p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #000;
  line-height: 1.35em;
  font-size: 18px;
}
.txt_bms_filter_red_18p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #cc0000;
  line-height: 1.35em;
  font-size: 18px;
}
.bg_bms_green {
  background-color: #93c47d;
}
.bg_bms_red {
  background-color: #e06666;
}
.w_menu_admin {
  width: 200px;
}
.pl_200p_0m {
  padding-left: 200px;
}
.admin_menu a.nav-link:hover {
  background-color: #f3f3f3;
}
.circle {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  font-size: 20px;
  text-align: center;
  background: #ebebeb;
  color: #a5a5a5;
}
.circle_24p {
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  font-size: 18px;
  color: #fff;
  text-align: center;
  background: #ebebeb;
}
a:hover .circle {
  background: #a5a5a5;
  color: #fff;
}
.txt_true_bold {
  font-family: "TrueTextOnline-bold";
}
.btn_overdue {
  min-width: 60px;
  height: 17px;
  border: 1px solid #cc0000;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-bold";
  font-size: 12px;
  line-height: 16px;
  color: #cc0000;
  padding: 0px 10px;
}
.btn_overdue_5p {
  min-width: 50px;
  height: 17px;
  border: 1px solid #cc0000;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-bold";
  font-size: 12px;
  line-height: 16px;
  color: #cc0000;
  padding: 0px 5px;
}
/* Picker Date 20201009 */
.picker__box {
  padding: 10px;
}
.picker__nav--next,
.picker__nav--prev {
  position: absolute;
  padding: 1rem;
  top: 33%;
  margin-top: -1rem;
  line-height: 1;
  border-radius: 0.1875rem;
  transition: all ease-in-out 0.15s;
}
.picker__nav--next:hover,
.picker__nav--prev:hover {
  cursor: pointer;
  color: #333;
  background-color: #f5f5f5;
  border-radius: 5rem;
}
.picker--opened .picker__holder {
  max-height: 350px;
  width: 290px;
  border-top-width: 1px;
  border-bottom-width: 1px;
  display: block;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid#ddd;
}
.picker__day {
  padding: 7px;
  min-width: 29px;
  border-radius: 5rem;
  font-size: 16px;
  margin: 0px;
}
.picker--focused .picker__day--highlighted,
.picker__day--highlighted,
.picker__day--highlighted:hover {
  cursor: pointer;
  color: #fff;
  background-color: #f44336;
  border-radius: 5rem;
}
.picker--focused .picker__list-item--selected,
.picker__list-item--selected,
.picker__list-item--selected:hover {
  color: #cc0000;
  background-color: #f5f5f5;
  z-index: 10;
}
.picker--focused .picker__day--selected,
.picker__day--selected,
.picker__day--selected:hover {
  background-color: #cc0000;
  color: #fff;
}
.picker__weekday {
  width: 14.285714286%;
  text-align: center;
  padding-bottom: 0.46875rem;
  padding-top: 0.9375rem;
  color: #999;
  font-weight: 400;
  font-size: 16px;
}
@media (max-width: 1026px) {
  .picker__holder {
    width: 400px;
  }
  .picker--opened .picker__holder {
    max-height: 355px;
    max-width: 290px;
  }
  .picker__day {
    padding: 7px;
    margin: 0px;
  }
}
.top_5p {
  top: 5px;
}
.top_10p {
  top: 10px;
}
.right_5p {
  right: 5px;
}
.right_7p {
  right: 7px;
}
.right_10p {
  right: 10px;
}
.right_15p {
  right: 15px;
}
.right_20p {
  right: 20px;
}
.right_23p {
  right: 23px;
}
.bottom_10p {
  bottom: 10px;
}
/* Table fixed */
.datatable-header {
  display: none;
}
.dataTables_paginate .paginate_button.current,
.dataTables_paginate .paginate_button.current:focus,
.dataTables_paginate .paginate_button.current:hover {
  color: #fff;
  background-color: #888;
}
.table_fixed_me th,
.table_fixed_me td,
.table_fixed_me tfoot td {
  min-width: 120px;
  width: 120px;
  max-width: 120px;
}
.table_fixed_me thead tr th:nth-of-type(2) {
  max-width: 220px;
  min-width: 220px;
  width: 220px;
}
.table_fixed_me td:first-child {
  min-width: 310px;
  max-width: 310px;
}
.dataTables_scrollBody {
  max-height: 100% !important;
}
.dataTable thead .sorting:after,
.dataTable thead .sorting:before {
  display: none;
}
.dataTables_scroll .dataTables_scrollBody td,
.dataTables_scroll .dataTables_scrollBody th {
  white-space: pre-line;
}
@media (max-width: 1024px) {
  .datatable-footer {
    padding: 0px;
  }
  .dataTables_info {
    margin-bottom: 0px;
  }
  .dataTables_scrollBody {
    max-height: auto !important;
  }
}
@media (max-width: 991.98px) {
  .datatable-scroll td,
  .datatable-scroll th {
    white-space: pre-line;
  }
}
@media (max-width: 768px) {
  .dataTables_scrollBody {
    max-height: 680px !important;
  }
}
@media (max-width: 576px) {
  .temp_dark .table_fixed_me td,
  .temp_dark .sorting_1 {
    min-width: auto !important;
    max-width: auto !important;
  }
  .table_fixed_me td,
  .sorting_1 {
    min-width: 120px !important;
    max-width: 120px !important;
  }
  .table_ex_w.table_fixed_me td,
  .sorting_1 {
    min-width: auto !important;
    max-width: auto !important;
  }
  .table_fixed_me td:first-child {
    min-width: 150px !important;
    max-width: 150px !important;
  }
  .table td,
  .table th {
    padding: 0.3rem 0.5rem;
  }
  .dataTables_scrollBody {
    max-height: 400px !important;
  }
  .table_cn_noborder_p0 td,
  .table_cn_noborder_p0 th {
    padding: 0rem 0rem;
    border-bottom: 0px;
    border-top: 0px;
  }
}
@media (max-width: 375px) {
  .dataTables_scrollBody {
    max-height: 330px !important;
  }
}
@media (max-width: 320px) {
  .dataTables_scrollBody {
    max-height: 250px !important;
  }
}
/* /.Table fixed */
.h_mic_card {
  height: 105px;
  overflow: hidden;
}
.card_bms_hover.card a.ic_del {
  background-color: #fff;
  padding: 0px 8px;
  border-radius: 5rem;
  border: 0px;
  display: none;
}
.card_bms_hover.card:hover a.ic_del {
  background-color: #fff;
  padding: 0px 8px;
  border-radius: 5rem;
  border: 0px;
  display: block;
}
/* Hori Card v.2021*/
.content_card_nobg {
  padding: 15px 5px 15px 5px;
}
.content_card_nobg_2 {
  padding: 15px 15px 15px 15px;
}
.w_card {
  min-width: 350px;
  max-width: 350px;
  margin-bottom: 0px;
}
.txt_bms_portal_title_20p {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #000;
  line-height: 26px;
  font-size: 20px;
  height: auto;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  padding-top: 5px;
  margin-bottom: 5px;
}
.txt_bms_portal_head_20p {
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 26px;
  font-size: 20px;
  height: auto;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.fit_box_height > img {
  max-height: 144px;
  min-height: 144px;
  object-fit: contain;
  object-position: center;
  width: 100%;
  background-color: #ca1416;
}
.card_hover:hover .content-width img {
  filter: brightness(80%);
}
.card_hover:hover .txt_bms_portal_title_20p {
  color: #cc0000;
}
.card_hover_2:hover {
  color: #cc0000;
  background-color: #f8f8f8;
}
.card_hover:hover {
  background-color: #fafafa;
  filter: brightness(98%);
  cursor: pointer;
}
.popover-body {
  padding: 5px 10px;
}
.scrollbar_y_pc {
  overflow-y: hidden;
  position: relative;
  height: calc(100%);
  cursor: pointer;
}
.scrollbar_y_pc::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
.scrollbar_y_pc::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scrollbar_y_pc::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scrollbar_y_pc::-webkit-scrollbar-thumb {
  background: #888;
}
.scrollbar_y_pc .card:first-child {
  maring-left: 5px;
}
.scrollbar_y_pc .card:last-child {
  margin-right: 10px !important;
}
@media (max-width: 1920px) {
  .maxwidth_geo_donut2 {
    max-width: 190px !important;
  }
}
@media (max-width: 1366px) {
  .w_card {
    min-width: 286px;
    max-width: 286px;
  }
  .px_kpi_navbar {
    padding-left: 20px;
    padding-right: 20px;
  }
  .fit_box_height > img {
    max-height: 119px;
    min-height: 119px;
  }
  .txt_kpi_head_40p_w {
    font-size: 34px;
  }
  .maxwidth_geo_donut {
    max-width: 120px !important;
  }
  .maxwidth_geo_donut2 {
    max-width: 150px !important;
  }
  .maxwidth_ex_110 {
    max-width: 90px !important;
    width: 90px !important;
  }
  .maxwidth_ex_90 {
    max-width: 76px !important;
    width: 76px !important;
  }
  .maxwidth_ex_65 {
    max-width: 65px !important;
    width: 65px !important;
  }
  .maxwidth_ex_70 {
    max-width: 70px !important;
    width: 70px !important;
  }
}
@media (max-width: 1180px) {
  .w_card {
    min-width: 286px;
    max-width: 286px;
  }
  .fit_box_height > img {
    max-height: 110px;
    min-height: 110px;
  }
}
@media (max-width: 1024px) {
  .w_card {
    min-width: 286px;
    max-width: 286px;
  }
  .fit_box_height > img {
    max-height: 110px;
    min-height: 110px;
  }
}
@media (max-width: 820px) {
  .w_card {
    min-width: 286px;
    max-width: 286px;
  }
  .fit_box_height > img {
    max-height: 179px;
    min-height: 179px;
  }
}
@media (max-width: 768px) {
  .w_card {
    min-width: 286px;
    max-width: 286px;
  }
  .fit_box_height > img {
    max-height: 168px;
    min-height: 168px;
  }
}
@media (max-width: 736px) {
  .scrollbar_y_pc::-webkit-scrollbar {
    width: 0px;
    height: 0px;
  }
}
@media (max-width: 720px) {
  .fit_box_height > img {
    max-height: 133px;
    min-height: 133px;
  }
}
@media (max-width: 576px) {
  .w_card {
    min-width: 286px;
    max-width: 286px;
  }
  .content_card_nobg {
    padding: 10px 5px 0px 5px;
  }
  .txt_bms_portal_title_20p {
    line-height: 22px;
    font-size: 18px;
    padding-top: 3px;
    margin-bottom: 3px;
    max-height: 67px;
  }
}
@media (max-width: 540px) {
  .fit_box_height > img {
    max-height: 131px;
    min-height: 131px;
  }
}
@media (max-width: 414px) {
  .w_card {
    min-width: 170px;
    max-width: 170px;
  }
  .fit_box_height > img {
    max-height: 78px;
    min-height: 78px;
  }
}
@media (max-width: 375px) {
  .w_card {
    min-width: 165px;
    max-width: 165px;
  }
  .fit_box_height > img {
    max-height: 74px;
    min-height: 74px;
  }
}
/* /.Hori Card v.2021 */
/* Notification Right-Slider */
.noti_hover_card:hover .card {
  background-color: #fafafa !important;
}
.noti_hover_card .card.noti_alert {
  background-color: #f3f3f3 !important;
}
.noti_hover_card:hover .card.noti_alert {
  background-color: #fafafa !important;
}
#right-sidebar {
  background: #fff;
  width: 240px;
  position: fixed;
  height: 100%;
  overflow-x: hidden;
  z-index: 1031;
  right: 0px;
  top: 0;
  border-left: 1px solid #ececec;
  margin-top: 0px;
  padding-bottom: 0px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.right-sidebar-page {
  width: 330px !important;
}
.right-sidebar-page.w_485p {
  width: 485px !important;
}
.btn-bottom-right-sidebar-close {
  width: 32px;
  height: 32px;
  position: fixed;
  bottom: 10px;
  right: 10px;
  background: #e74c3c !important;
  font-size: 15px;
  padding: 6px 8px 8px 10px;
  border-radius: 100%;
  color: #fff;
  -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.35);
  -moz-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.35);
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.35);
  opacity: 0.8;
  cursor: pointer;
  display: none;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.right-sidebar-toggle-box {
  float: left;
  margin-top: 23px;
  margin-left: -15px;
  background: #76cf1c;
  border-radius: 2%;
  -webkit-border-radius: 2%;
  width: 32px;
  height: 32px;
  position: absolute;
  right: -15px;
}
.hide-right-bar-page {
  margin-right: -330px !important;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.hide-right-bar-page.w_485p {
  margin-right: -485px !important;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 414px) {
  .right-sidebar-page {
    width: 100% !important;
  }
  .right-sidebar-page.w_485p {
    width: 100% !important;
  }
  .hide-right-bar-page {
    margin-right: -414px !important;
  }
}
/* /.Notification Right-Slider */
.ml_15px {
  margin-left: 15px !important;
}
.mr_10px {
  margin-right: 10px !important;
}
.mr_15px {
  margin-right: 15px !important;
}
.back_hover:hover img {
  opacity: 0.5;
}
.back_hover:hover .txt_kpi_bighead_20p,
.back_hover:hover .txt_kpi_bighead_20p_w,
.back_hover:hover .txt_888_18 {
  opacity: 0.5;
}
.txt_kpi_bighead_20p {
  font-size: 20px;
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #000;
  line-height: 1.2em;
}
.txt_kpi_bighead_20p_w {
  font-size: 20px;
  font-family: "TrueTextOnline-Bold";
  font-style: normal;
  color: #fff;
  line-height: 1.2em;
}
/* Employeecard */
.employeecard .swiper-container {
  width: 100%;
  height: 100%;
}
.employeecard .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  width: 330px !important;
}
.employeecard .swiper-container-horizontal > .swiper-pagination-bullets,
.employeecard .swiper-pagination-custom,
.employeecard .swiper-pagination-fraction {
  bottom: -5px !important;
}
.no_truecard {
  bottom: 7px;
  left: 35px;
  color: #ccc;
}
.emp_employeesize {
  width: 85px;
}
.emp_logotruemoney {
  height: 140px;
}
.emp_logotrue {
  width: 60px;
}
.emp_cardsize {
  height: 208px;
}
.emp_logobarcode {
  width: 50px;
}
.emp_logobarcode_2 {
  width: 70px;
}
.card.emp_cardsize {
  background-color: #f1f2f3;
}
.emp_cardsize .card-body {
  background-color: #fff;
}
.btn_me_h48p {
  font-family: "TrueTextOnline-Regular";
  font-size: 20px;
  background-color: #fff;
  color: #000;
  border-radius: 10px !important;
  padding: 0.6rem 0.875rem;
  border: 1px solid #ddd;
}
.btn_me_h48p:hover {
  color: #000;
  background-color: #fff !important;
  border: 1px solid #cc0000;
}
.btn_me_h48p.btn_active {
  color: #000;
  background-color: #fff !important;
  border: 1px solid #cc0000;
}
.btn_me_h48p:not(.bg-transparent):not([class*="btn-outline"]):not(
    .btn-light
  ):not(.btn-link):not([class*="alpha-"]):not(.fab-menu-btn):hover {
  box-shadow: 0 0 0 62.5rem rgb(0 0 0 / 0%) inset !important;
}
.btn_me_h48p.btn_seleced {
  color: #000;
  background-color: #fff !important;
  border: 0px solid #cc0000;
  box-shadow: 0 0 0 62.5rem rgb(0 0 0 / 8%) inset;
}
.btn_me_h48p.btn_seleced:hover {
  color: #000;
  background-color: #ebebeb !important;
}
/* /.Employeecard */
/* Slick */
.slick-slide:nth-child(odd) {
  background-color: transparent !important;
}
.slick-prev:before,
.slick-next:before {
  color: #bfbfbf !important;
}
.nav_me_item {
  padding: 0px 0px 0px;
}
/*
.slick-prev {
    left: 18px !important;
}
.slick-next {
    right: 18px !important;
}
*/
.slick-prev::before {
  font-family: "icomoon" !important;
  content: "\e9c8" !important;
  font-size: 36px !important;
}
.slick-next::before {
  font-family: "icomoon" !important;
  content: "\e9cb" !important;
  font-size: 36px !important;
}
.slick-prev,
.slick-next {
  height: 36px !important;
}
/* /.Slick*/
.bg_star {
  color: #f2c94c;
}
.bg_star_grey {
  color: #dddddd;
}
.custom-control-label.tmn::before {
  position: absolute;
  top: 3px;
  left: -2.1rem;
  display: block;
  width: 1.8rem;
  height: 1.8rem;
  pointer-events: none;
  content: "";
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #fff;
  box-shadow: 0 0 0 0 transparent;
  border: #ddd solid 2px;
}
.bar_ex_navlink {
  font-style: normal;
  color: #000;
  line-height: 1.3em;
  font-size: 20px;
  padding: 10px 10px 10px 10px !important;
}
.bar_ex_navlink_w {
  font-style: normal;
  color: #666;
  line-height: 1.3em;
  /*    font-size: 16px;*/
  padding: 0.1375rem 1.2rem;
}
.nav-tabs-ex-rounded2 .nav-link.red {
  color: #ffffff;
}
.nav-tabs-ex-rounded2 .nav-item.show .nav-link.active.red,
.nav-tabs-ex-rounded2 .nav-link.active.red,
.nav-tabs-ex-rounded2 .nav-link.red:hover {
  color: #cc4125;
}
.nav-tabs-ex {
  background-color: #ffffff;
  border: 0px solid #cc0000;
  font-size: 20px;
  border-bottom: 3px solid;
}
.nav-tabs-ex .nav-item.show .nav-link.active,
.nav-tabs-ex .nav-link.active,
.nav-tabs-ex .nav-link:hover {
  background-color: #f2f2f2;
  color: #cc0000;
  border-bottom: 3px solid;
}
.nav-tabs-ex .nav-link {
  position: relative;
  transition: all ease-in-out 0s;
}
.nav-tabs-ex-rounded {
  background-color: #333;
  border: 1px solid #575757;
  font-size: 20px;
  /*    border-bottom: 3px solid;*/
}
.nav-tabs-ex-rounded .nav-item.show .nav-link.active,
.nav-tabs-ex-rounded .nav-link.active,
.nav-tabs-ex-rounded .nav-link:hover {
  background-color: #333;
  color: #fff;
  /*    border-bottom: 3px solid;*/
}
.nav-tabs-ex-rounded .nav-link {
  position: relative;
  transition: all ease-in-out 0s;
}
.nav-tabs-ex-rounded2 {
  background-color: #222;
  border: 1px solid #333;
  font-size: 20px;
  /*    border-bottom: 3px solid;*/
}
.nav-tabs-ex-rounded2 .nav-item.show .nav-link.active,
.nav-tabs-ex-rounded2 .nav-link.active,
.nav-tabs-ex-rounded2 .nav-link:hover {
  background-color: #222;
  color: #fff;
  /*    border-bottom: 3px solid;*/
}
.nav-tabs-ex-rounded2 .nav-link {
  position: relative;
  transition: all ease-in-out 0s;
}
.table_ex_black td {
  font-family: "TrueTextOnline-Regular";
  padding: 0.3rem 10px;
  border-bottom: 1px solid #dddddd;
  border-top: 0px;
  font-size: 18px;
  color: #000;
}
.table_ex_black2 td {
  font-family: "TrueTextOnline-Regular";
  padding: 0.3rem 10px;
  border-bottom: 1px solid #dddddd;
  border-top: 0px;
  font-size: 18px;
  color: #000;
}
.table_ex_black2 th {
  font-family: "TrueTextOnline-Bold";
  padding: 0.3rem 10px;
  border-bottom: 1px solid #dddddd;
  border-top: 0px;
  font-size: 18px;
  color: #000;
}
.table_ex_black2 th {
  /*  background-color: #FFF;*/
  color: #000; /*434343*/
}
.table_ex_black2 th.txt_bold {
  font-family: "TrueTextOnline-Bold";
}
.table_ex_black2 td:first-child,
.table_ex_black2 th:first-child {
  border-left: 0px solid #ddd;
}
.table_ex_black2 td:last-child,
.table_ex_black2 th:last-child {
  border-right: 0px solid #ddd;
}
.table_ex_black2.txt_bold td:last-child {
  font-family: "TrueTextOnline-bold";
}
.table_ex_black2 tr:last-child td {
  border-bottom: 1px solid #ddd;
}
.table_ex_dark td {
  font-family: "TrueTextOnline-Regular";
  padding: 0.3rem 10px;
  border-bottom: 1px solid #333;
  border-top: 0px;
  font-size: 18px;
  color: #fff;
}
.table_ex_dark thead th {
  font-family: "TrueTextOnline-Bold";
  padding: 0.3rem 10px;
  border-top: 0px solid #333 !important;
  border-bottom: 1px solid #333;
  border-top: 0px;
  font-size: 18px;
  color: #fff;
}
.table_ex_dark thead th.border_top_1_333_m {
  font-family: "TrueTextOnline-Bold";
  padding: 0.3rem 10px;
  border-top: 0px solid #333 !important;
  border-bottom: 1px solid #333;
  border-top: 0px;
  font-size: 18px;
  color: #fff;
}
.table_ex_dark tr:hover td {
  background-color: #222;
}
.table_ex_dark th {
  /*  background-color: #FFF;*/
  color: #fff; /*434343*/
}
.table_ex_dark th.txt_bold {
  font-family: "TrueTextOnline-Bold";
}
.table_ex_dark td:first-child,
.table_ex_dark th:first-child {
  border-left: 0px solid #ddd;
}
.table_ex_dark td:last-child,
.table_ex_dark th:last-child {
  border-right: 0px solid #ddd;
}
.table_ex_dark.txt_bold td:last-child {
  font-family: "TrueTextOnline-bold";
}
.table_ex_dark tr:last-child td {
  border-bottom: 1px solid #333;
}
.table_ex_dark tr:last-child td:first-child {
  border-bottom-left-radius: 8px;
}
.table_ex_dark tr:last-child td:last-child {
  border-bottom-right-radius: 8px;
}
.table_ex_dark td:last-child {
  padding: 0.3rem 10px 0.3rem 10px;
}
.temp_dark .table_ex_dark tr:last-child td:first-child {
  border-bottom-left-radius: 0px;
}
.temp_dark .table_ex_dark tr:last-child td:last-child {
  border-bottom-right-radius: 0px;
}
.table_ex_w td {
  font-family: "TrueTextOnline-Bold";
  padding: 0.1rem 10px;
  border-bottom: 1px solid #e5e5e5;
  border-top: 0px;
  font-size: 18px;
  color: #333333;
  height: 30px;
  line-height: 20px;
}
.table_ex_w thead th {
  font-family: "TrueTextOnline-Bold";
  padding: 0.3rem 10px;
  border-top: 0px !important;
  border-bottom: 1px solid #e5e5e5;
  font-size: 18px;
  color: #333333;
  height: 40px;
}
/*
.table_ex_w thead th.border_top_1_333_m {
  font-family: 'TrueTextOnline-Bold';
  padding: 0.3rem 10px;
  border-top: 0px solid #E5E5E5 !important;
  border-bottom: 1px solid #E5E5E5;
  border-top: 0px;
  font-size: 18px;
  color: #333333;
}
*/
.table_ex_w.table_hover tr:hover td {
  background-color: #f6f6f6;
}
.table_ex_w th {
  /*  background-color: #FFF;*/
  color: #fff; /*434343*/
  border-right: 1px solid #e5e5e5;
}
.table_ex_w th:last-child {
  border-right: 0px solid #e5e5e5;
}
.table_ex_w.tableFixHead th {
  background: #f6f6f6;
}
.table_ex_w th.txt_bold {
  font-family: "TrueTextOnline-Bold";
}
.table_ex_w td {
  border-right: 1px solid #e5e5e5;
}
.table_ex_w td:last-child {
  border-right: 0px solid #e5e5e5;
}
.table_ex_w td:first-child,
.table_ex_w th:first-child {
  border-left: 0px solid #e5e5e5;
}
.table_ex_w td:last-child,
.table_ex_w th:last-child {
  border-right: 0px solid #e5e5e5;
}
.table_ex_w.txt_bold td:last-child {
  font-family: "TrueTextOnline-bold";
}
.table_ex_w tr:last-child td {
  border-bottom: 0px solid #e5e5e5;
}
.table_ex_w tr:last-child td:first-child {
  border-bottom-left-radius: 10px;
}
.table_ex_w tr:last-child td:last-child {
  border-bottom-right-radius: 10px;
}
.table_ex_w td:last-child {
  padding: 0.3rem 10px 0.3rem 10px;
}
.temp_dark .table_ex_w tr:last-child td:first-child {
  border-bottom-left-radius: 10px;
}
.temp_dark .table_ex_w tr:last-child td:last-child {
  border-bottom-right-radius: 10px;
}
.table_ex_w.dataTable thead .sorting_asc:after {
  content: "\e9c2";
  opacity: 1;
  color: #cccccc;
}
.table_ex_w.dataTable thead .sorting_desc:after {
  content: "\e9c1";
  opacity: 1;
  color: #cccccc;
}
.table.wordbreak_breakall {
  word-break: break-all;
}
.table.wordbreak_breakword div {
  word-break: break-word;
}
.table.wordbreak_breakword {
  word-break: break-word;
}
.table.wordbreak_breakall div {
  word-break: break-all;
}
.table.wordbreak_breakall {
  word-break: break-all;
}
.position_menu_dark {
  left: 0px;
  right: 0px;
  bottom: -3px;
}
/* Temp_Dark checkbox */
.temp_dark .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #e06666 !important;
  background-color: #e06666 !important;
}
.temp_dark .custom-control-input:active ~ .custom-control-label::before {
  background-color: #e06666 !important;
  border-color: #e06666 !important;
}
.temp_dark .red .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #cc4125 !important;
  background-color: #cc4125 !important;
}
.temp_dark .red .custom-control-input:active ~ .custom-control-label::before {
  background-color: #cc4125 !important;
  border-color: #cc4125 !important;
}
.temp_dark
  .custom-control-input-green:not(:disabled):active
  ~ .custom-control-label::before {
  background-color: #e06666 !important;
  border-color: #e06666 !important;
}
.temp_dark
  .custom-switch
  .custom-control-input:checked
  ~ .custom-control-label::after {
  background-color: #999;
  -webkit-transform: translateX(0.75rem);
  transform: translateX(0.75rem);
}
.temp_dark .custom-control-label::before {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  content: "";
  background-color: #666666;
  border: 0px;
}
.temp_dark
  .bg_check_grey
  .custom-control-input:checked
  ~ .custom-control-label::before {
  border-color: #9f9f9f !important;
  background-color: #9f9f9f !important;
}
.temp_dark .bg_check_grey .custom-control-label::before {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  content: "";
  background-color: transparent;
  border: 1px solid #666666;
}
.temp_dark .custom-control-label::after {
  position: absolute;
  top: 4px !important;
  left: -2.2rem;
  display: block;
  width: 2rem;
  height: 1.5rem;
  content: "";
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
}
.temp_dark .custom-switch .custom-control-label::before {
  left: -2.25rem;
  width: 1.75rem;
  pointer-events: all;
  border-radius: 0.5rem;
}
.temp_dark .custom-switch .custom-control-label::after {
  top: calc(0.25rem + 0px);
  left: calc(-2.25rem + 0px);
  width: calc(1rem - 0px);
  height: calc(1rem - 0px);
  background-color: #adb5bd;
  border-radius: 0.5rem;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out,
    -webkit-transform 0.15s ease-in-out;
}
.temp_dark .custom-control-label::after {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  content: "";
  background: no-repeat 50%/50% 50%;
}
.temp_dark .custom-control-label {
  cursor: pointer;
  line-height: 1.7;
}
/* /.Temp_Dark checkbox */
/* Temp_Dark Scrollbar */
.temp_dark .datatable-scroll-wrap {
  max-height: calc(100vh - 420px);
  height: calc(100vh - 420px);
}
.temp_dark.ex_300 .datatable-scroll-wrap {
  max-height: calc(100vh - 300px);
  height: calc(100vh - 300px);
}
.temp_dark .datatable-scroll-wrap,
.temp_dark10_row .datatable-scroll-wrap {
  position: relative;
  height: calc(100%);
  border-radius: 0rem;
}
.temp_dark.ex_map .datatable-scroll-wrap {
  max-height: 500px;
  height: 500px;
}
.temp_dark.fix_h460p .datatable-scroll-wrap {
  max-height: 100%;
  height: 460px;
}
.temp_dark.fix_h600p .datatable-scroll-wrap {
  max-height: 100%;
  height: 600px;
}
.temp_dark .datatable-scroll-wrap::-webkit-scrollbar,
.temp_dark10_row .datatable-scroll-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.temp_dark.ex_map .datatable-scroll-wrap::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.temp_dark .datatable-scroll-wrap::-webkit-scrollbar-button,
.temp_dark10_row .datatable-scroll-wrap::-webkit-scrollbar-button {
  display: none;
  background: #2c2c2c;
}
.temp_dark .datatable-scroll-wrap::-webkit-scrollbar-track-piece,
.temp_dark10_row .datatable-scroll-wrap::-webkit-scrollbar-track-piece {
  background: #222222;
}
.temp_dark .datatable-scroll-wrap::-webkit-scrollbar-thumb,
.temp_dark10_row .datatable-scroll-wrap::-webkit-scrollbar-thumb {
  background: #2c2c2c;
}
.temp_dark .datatable-scroll-wrap::-webkit-scrollbar-corner,
.temp_dark10_row .datatable-scroll-wrap::-webkit-scrollbar-corner {
  background-color: #222222;
}
.temp_dark10_row .datatable-scroll-wrap {
  max-height: 430px;
  height: 430px;
}
.temp_dark.ex_map .datatable-scroll-wrap {
  max-height: 380px;
  height: 380px;
}
.table_ex_dark thead th {
  padding: 10px 5px;
}
.dataTable thead .sorting,
.dataTable thead .sorting_asc,
.dataTable thead .sorting_asc_disabled,
.dataTable thead .sorting_desc,
.dataTable thead .sorting_desc_disabled {
  padding-right: 1.5rem;
}
.dataTable thead .sorting:after,
.dataTable thead .sorting:before,
.dataTable thead .sorting_asc:after,
.dataTable thead .sorting_asc_disabled:after,
.dataTable thead .sorting_desc:after,
.dataTable thead .sorting_desc_disabled:after {
  right: 5px;
}
@media (max-width: 3840px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 380px;
    height: 380px;
  }
  .tableFixHead {
    overflow: auto;
    height: calc(100vh - 1500px);
  }
}
@media (max-width: 2560px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 310px;
    height: 310px;
  }
}
@media (max-width: 1920px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 350px;
    height: 350px;
  }
}
@media (max-width: 1366px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 385px;
    height: 385px;
  }
}
@media (max-width: 1024px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 380px;
    height: 380px;
  }
}
@media (max-width: 768px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 600px;
    height: 600px;
  }
}
@media (max-width: 736px) {
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 100%;
    height: 100%;
  }
}
@media (max-width: 576px) {
  .temp_dark .datatable-scroll-wrap {
    max-height: 100%;
    height: 100%;
  }
  .temp_dark.ex_map .datatable-scroll-wrap {
    max-height: 100%;
    height: 100%;
  }
  .dataTable thead .sorting,
  .dataTable thead .sorting_asc,
  .dataTable thead .sorting_asc_disabled,
  .dataTable thead .sorting_desc,
  .dataTable thead .sorting_desc_disabled {
    padding-right: 1.5rem;
  }
}
/* /.Temp_Dark Scrollbar */
.maxwidth_geo_donut {
  max-width: 150px;
}
.maxwidth_geo_donut2 {
  max-width: 240px;
}
.img_hover .rounded-circle:hover {
  background-color: #ccc;
}
/* Modal Warning */
.txt_geo_head_red {
  font-family: "TrueTextOnline-bold";
  font-style: normal;
  color: #cc4125;
  line-height: 1.35em;
  font-size: 28px;
}
.txt_geo_grey_999 {
  color: #999999;
  font-size: 18px;
}
@media (min-width: 992px) {
  .modal_800p {
    max-width: 800px;
    width: 95%;
  }
}
@media (max-width: 576px) {
  .txt_geo_head_red {
    font-size: 22px;
  }
}
/* /.Modal Warning */
.body-toggle-assignee {
  max-width: 345px;
  width: 345px;
}
@media (max-width: 580px) {
  .body-toggle-assignee {
    max-width: unset;
    width: calc(100% - 12px);
  }
}
/* GEO Channel */
.text_light_red,
.text_red {
  color: #e06666 !important;
}
.background_light_red {
  background-color: #e06666 !important;
}
.background_light_redorange {
  background-color: #e75739 !important;
}
.background_grey {
  background-color: #999999 !important;
}
.background_blue {
  background-color: #3d85c6 !important;
}
.background_green {
  background-color: #6aa84f !important;
}
.background_light_green {
  background-color: #93c47d !important;
}
.background_yellow {
  background-color: #f1c232 !important;
}
.background_gold {
  background-color: #f9a600 !important;
}
.background_orange {
  background-color: #ff8000 !important;
}
.background_red {
  background-color: #cc4125 !important;
}
.card_dark_hover:hover.background_light_red {
  background-color: #b75c5c !important;
}
.card_dark_hover:hover.background_red {
  background-color: #b53a22 !important;
}
.card_dark_hover:hover.background_yellow {
  background-color: #daaf2c !important;
}
.card_dark_hover:hover.background_orange {
  background-color: #e97704 !important;
}
.card_dark_hover:hover.background_light_green {
  background-color: #7eaa6a !important;
}
.card_dark_hover:hover.background_green {
  background-color: #5a9042 !important;
}
.card_dark_hover:hover.background_blue {
  background-color: #3272ac !important;
}
:root .swiper_menuslide {
  --swiper-navigation-size: 25px;
  --swiper-theme-color: #888888;
}
.swiper_menuslide .swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: none;
}
.swiper_menuslide .swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: none;
}
.swiper_menuslide .swiper-bg-left {
  z-index: 9;
  opacity: 1;
  background: rgb(23, 23, 23);
  background: linear-gradient(
    90deg,
    rgba(23, 23, 23, 1) 0%,
    rgba(23, 23, 23, 1) 50%,
    rgba(23, 23, 23, 0) 100%
  );
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 45px;
}
.swiper_menuslide .swiper-bg-right {
  z-index: 9;
  opacity: 1;
  background: rgb(23, 23, 23);
  background: linear-gradient(
    270deg,
    rgba(23, 23, 23, 1) 0%,
    rgba(23, 23, 23, 1) 50%,
    rgba(23, 23, 23, 0) 100%
  );
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 45px;
}
.swiper_menuslide .swiper-bg-left.bg_grey {
  background: rgb(246, 246, 246);
  background: linear-gradient(
    90deg,
    rgba(246, 246, 246, 1) 0%,
    rgba(246, 246, 246, 1) 60%,
    rgba(246, 246, 246, 0) 100%
  );
  width: 35px; /*45px*/
}
.swiper_menuslide .swiper-bg-right.bg_grey {
  background: rgb(246, 246, 246);
  background: linear-gradient(
    270deg,
    rgba(246, 246, 246, 1) 0%,
    rgba(246, 246, 246, 1) 60%,
    rgba(246, 246, 246, 0) 100%
  );
  width: 35px; /*45px*/
}
.swiper_menuslide .swiper-button-prev,
.swiper_menuslide .swiper-rtl .swiper-button-next {
  left: 15px;
  right: auto;
}
.swiper_menuslide .swiper-button-next,
.swiper_menuslide .swiper-rtl .swiper-button-prev {
  right: 15px;
  left: auto;
}
.swiper_menuslide .swiper-button-prev,
.swiper_menuslide .swiper-rtl .swiper-button-next.l_20p {
  left: 30px;
  right: auto;
}
.swiper_menuslide .swiper-button-next,
.swiper_menuslide .swiper-rtl .swiper-button-prev.r_20p {
  right: 30px;
  left: auto;
}
.swiper_menuslide .swiper-slide:first-child {
  margin-left: 40px;
}
.swiper_menuslide .swiper-slide:last-child {
  margin-right: 40px;
}
.swiper_menuslide .d_right .swiper-slide:first-child {
  margin-left: 15px !important;
}
.swiper_menuslide .d_right .swiper-slide:last-child {
  margin-right: 15px !important;
}
.swiper_px_m0 {
  padding-left: 35px; /*35*/
  padding-right: 35px; /*35*/
}
.swiper_menuslide.bg_grey .swiper-button-prev,
.swiper_menuslide .swiper-rtl .swiper-button-next {
  left: 0px;
  right: auto;
}
.swiper_menuslide.bg_grey .swiper-button-next,
.swiper_menuslide .swiper-rtl .swiper-button-prev {
  right: 0px;
  left: auto;
}
.swiper_menuslide.bg_grey .swiper-slide:first-child {
  margin-left: 0px; /*5.5%*/
}
.swiper_menuslide.bg_grey .swiper-slide:last-child {
  margin-right: 70px; /*5.5%*/
}
.swiper_menuslide .swiper-button-lock {
  display: block;
}
@media (max-width: 1024px) {
  .swiper_px_m0 {
    padding-left: 0px;
    padding-right: 0px;
  }
  .swiper_menuslide .swiper-button-prev,
  .swiper_menuslide .swiper-container-rtl .swiper-button-next {
    display: none;
  }
  .swiper_menuslide .swiper-button-next,
  .swiper_menuslide .swiper-container-rtl .swiper-button-prev {
    display: none;
  }
  .swiper_menuslide .swiper-bg-left.bg_grey {
    display: none;
  }
  .swiper_menuslide .swiper-bg-right.bg_grey {
    display: none;
  }
  .swiper_menuslide.bg_grey .swiper-slide:first-child {
    margin-left: 0px; /*5.5%*/
  }
  .swiper_menuslide.bg_grey .swiper-slide:last-child {
    margin-right: 0px; /*5.5%*/
  }
  .swiper_menuslide .swiper-bg-left {
    background: none;
  }
  .swiper_menuslide .swiper-bg-right {
    background: none;
  }
  .swiper_menuslide .swiper-slide:first-child {
    margin-left: 15px;
  }
  .swiper_menuslide .swiper-slide:last-child {
    margin-right: 15px;
  }
}
/* /.GEO Channel */
/* Executive Dashboard*/
.input_gqa_search_grey {
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-regular";
  font-size: 18px;
  line-height: 25px;
  display: flex;
  align-items: center;
  color: #888888;
  width: 100%;
}
.form_control_gqa_select {
  font-family: "TrueTextOnline-regular";
  font-size: 18px;
  line-height: 26px;
  color: #333333;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
}
.form_control_select_18 option:active,
.form_control_gqa_select option:active {
  background-color: #ccc;
  color: #000;
}
.form_control_gqa_select option:checked {
  background-color: #fff;
  color: #eec13f;
}
.form_control_gqa_select select {
  background-color: #fff;
  color: #eec13f;
}
.form_control_select_18 {
  font-family: "TrueTextOnline-bold";
  font-size: 18px;
  line-height: 24px;
  color: #333333;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
}
.form_control_select_18 option:active,
.form_control_select_18 option:active {
  background-color: #ccc;
  color: #000;
}
.form_control_select_18 option:checked {
  background-color: #fff;
  color: #eec13f;
}
.form_control_select_18 select {
  background-color: #fff;
  color: #eec13f;
}
.card_voe {
  background: #f6f6f6;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
  padding: 10px 20px;
  margin-bottom: 0px;
  box-shadow: none;
  margin-bottom: 0px !important;
}
.card_voe_w {
  background: #fff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
  padding: 10px 20px;
  margin-bottom: 0px;
  box-shadow: none;
  margin-bottom: 0px !important;
}
a .card_voe:hover {
  background: #fafafa;
}
.txt_voe_detail_name {
  font-family: "TrueTextOnline-bold";
  font-size: 18px;
  line-height: 18px;
  color: #333333;
}
.txt_voe_detail_job {
  font-family: "TrueTextOnline-bold";
  font-size: 16px;
  line-height: 18px;
  color: #888888;
}
.form_border_grey_e5 {
  border: 1px solid #e5e5e5;
  font-size: 18px;
  height: 50px;
  border-radius: 10px;
}
.form_border_grey_e5.rounded_8p {
  border: 1px solid #e5e5e5;
  font-size: 18px;
  height: 50px;
  border-radius: 8px;
}
.pickadate_gqa .form_border_grey.h_40p,
.pickadate_gqa .form_border_grey_e5.h_40p,
.form_border_grey_e5.h_40p {
  height: 40px !important;
}
.select_me.dropdown-toggle::after {
  display: none;
}
.select_me {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 28px;
  color: #333333;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding-right: 35px;
  background-color: #fff;
}
.img_workspace {
  width: 32px !important;
  height: 32px !important;
  max-height: 32px !important;
  border-radius: 50% !important;
  vertical-align: middle !important;
}
.scroll_h_workspace {
  height: auto;
  max-height: calc(100vh - 520px);
}
.scroll_h_workspace_200p {
  height: auto;
  max-height: 200px;
}
.scroll_h_workspace_250p {
  height: auto;
  max-height: 250px;
}
.scroll.scroll_h_workspace_250p::-webkit-scrollbar,
.scroll.scroll_h_workspace_200p::-webkit-scrollbar {
  display: block;
}
.scroll_h_workspace_250p::-webkit-scrollbar,
.scroll_h_workspace_200p::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.scroll_h_workspace_250p::-webkit-scrollbar-button,
.scroll_h_workspace_200p::-webkit-scrollbar-button {
  display: none;
  background: #888;
}
.scroll_h_workspace_250p::-webkit-scrollbar-track-piece,
.scroll_h_workspace_200p::-webkit-scrollbar-track-piece {
  background: #ccc;
}
.scroll_h_workspace_250p::-webkit-scrollbar-thumb,
.scroll_h_workspace_200p::-webkit-scrollbar-thumb {
  background: #888;
}
.scroll_h_chooseworkspace {
  height: auto;
  max-height: calc(100vh - 200px);
}
.rounded-circle.img-item {
  border: 1px solid #e5e5e5;
}
.border_logo_thumbnail {
  border: 1px solid #fff;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_pass {
  background-color: #93c47d;
  color: #fff;
  border-color: #93c47d;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_notpass {
  background-color: #e75739;
  color: #fff;
  border-color: #e75739;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_na {
  background-color: #999999;
  color: #fff;
  border-color: #999999;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_0 {
  background-color: #cc0000;
  color: #fff;
  border-color: #cc0000;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_1 {
  background-color: #e75739;
  color: #fff;
  border-color: #e75739;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_2 {
  background-color: #ff8a00;
  color: #fff;
  border-color: #ff8a00;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_3 {
  background-color: #eec13f;
  color: #fff;
  border-color: #eec13f;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_4 {
  background-color: #93c47d;
  color: #fff;
  border-color: #93c47d;
}
.ui-checkboxradio-label.ui-checkboxradio-checked.txt_gqa_radiogroup_5 {
  background-color: #00aee4;
  color: #fff;
  border-color: #00aee4;
}
.ui-button.txt_gqa_radiogroup_pass:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_pass:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_pass:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_pass
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_pass
  button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_pass
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #93c47d;
  border-color: #e5e5e5;
}
.ui-button.txt_gqa_radiogroup_notpass:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_notpass:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_notpass:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_notpass
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_notpass
  button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_notpass
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #e75739;
  border-color: #e5e5e5;
}
.ui-button.txt_gqa_radiogroup_na:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_na:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_na:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_na
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_na
  button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_na
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #999999;
  border-color: #999999;
}
.ui-button.txt_gqa_radiogroup_0:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_0:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_0:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_0
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_0 button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_0
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #cc0000;
  border-color: #cc0000;
}
.ui-button.txt_gqa_radiogroup_1:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_1:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_1:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_1
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_1 button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_1
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #e75739;
  border-color: #e75739;
}
.ui-button.txt_gqa_radiogroup_2:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_2:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_2:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_2
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_2 button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_2
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #ff8a00;
  border-color: #ff8a00;
}
.ui-button.txt_gqa_radiogroup_3:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_3:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_3:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_3
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_3 button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_3
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #eec13f;
  border-color: #eec13f;
}
.ui-button.txt_gqa_radiogroup_4:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_4:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_4:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_4
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_4 button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_4
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #93c47d;
  border-color: #93c47d;
}
.ui-button.txt_gqa_radiogroup_5:not([class*="bg-"]):active,
.ui-button.txt_gqa_radiogroup_5:not([class*="bg-"]):focus,
.ui-button.txt_gqa_radiogroup_5:not([class*="bg-"]):hover,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_5
  button:not([class*="bg-"]):active,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_5 button:not([class*="bg-"]):focus,
.ui-datepicker-buttonpane.txt_gqa_radiogroup_5
  button:not([class*="bg-"]):hover {
  color: #fff;
  background-color: #00aee4;
  border-color: #00aee4;
}
.txt_gqa_home_bighead {
  font-family: "TrueTextOnline-bold";
  font-size: 36px;
  line-height: 40px;
  color: #cc0000;
}
.txt_gqa_usercircle {
  font-family: "TrueTextOnline-bold";
  font-size: 14px;
  line-height: 19px;
  color: #888888;
}
.card_attach_100 {
  width: 100px;
  height: 100px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
}
tr.hover_show:hover .background_light_red {
  background-color: #b75c5c !important;
}
tr.hover_show:hover .background_red {
  background-color: #b53a22 !important;
}
tr.hover_show:hover .background_yellow {
  background-color: #daaf2c !important;
}
tr.hover_show:hover .background_orange {
  background-color: #e97704 !important;
}
tr.hover_show:hover .background_light_green {
  background-color: #7eaa6a !important;
}
tr.hover_show:hover .background_green {
  background-color: #5a9042 !important;
}
tr.hover_show:hover .background_blue {
  background-color: #3272ac !important;
}
/*
.txt_gqa_subcard_sm {
  font-family: 'TrueTextOnline-bold';
  font-size: 13px;
  line-height: 12px;
}
.swiper-button-next:hover, .swiper-button-prev:hover {
  opacity: 0.6;
}
@media (max-width:768px) {
  .swiper_menuslide.bg_grey .swiper-slide:first-child {
    margin-left: 0px;
  }
  .swiper_menuslide.bg_grey .swiper-slide:last-child {
    margin-right: 0px; 
  }
}
*/
.hover_show a {
  opacity: 0;
  cursor: pointer;
}
.hover_show:hover a {
  opacity: 1;
  cursor: pointer;
}
tr.hover_show:hover {
  opacity: 1;
  background-color: #fafafa;
  cursor: pointer;
}
.ic_9dot {
  top: 1px;
  color: #888;
}
.navbar_header .navbar-nav-link {
  position: relative;
  display: block;
  cursor: pointer;
  padding: 0.875rem 1rem;
  outline: 0;
  transition: all ease-in-out 0s;
}
.navbar_header .dropdown-users > .navbar-nav-link,
.navbar_header .dropdown-users > .navbar-nav-link > span {
  padding: 5px 5px !important;
  margin-left: 5px;
  border-radius: 50px;
}
.navbar_header .dropdown-users {
  margin-top: 0px !important;
}
.navbar_header .dropdown-grid > .navbar-nav-link,
.navbar_header .dropdown-grid > .navbar-nav-link > span {
  padding: 13px 13px;
  margin: 0px;
  margin-left: 0px; /*5px*/
  border-radius: 50px;
}
.navbar_header .dropdown-hamburger > .navbar-nav-link,
.navbar_header .dropdown-hamburger > .navbar-nav-link > span {
  padding: 7px 11px;
  margin: 3px 0 3px 8px;
  border-radius: 50%;
}
.navbar_header .navbar-light .navbar-nav-link:focus,
.navbar_header .navbar-light .navbar-nav-link:hover {
  color: #cc0000 !important;
  background-color: rgba(0, 0, 0, 0.04);
  border-radius: 50%;
}
.navbar_header .navbar-light .navbar-nav-link.text_nobg:focus,
.navbar_header .navbar-light .navbar-nav-link.text_nobg:hover {
  color: #cc0000 !important;
  background-color: transparent;
  border-radius: 50%;
}
.dropdown-hamburger .dropdown-item.active {
  color: #cc0000;
  background-color: #fff;
}
.dropdown-hamburger .txt_vl_head {
  font-family: "TrueTextOnline-regular";
}
.dropdown-item.txt_black_nolink:focus,
.dropdown-item.txt_black_nolink:hover {
  text-decoration: none;
  background-color: #fff;
  color: #333;
}

.pickadate_gqa .picker {
  width: 370px;
}
.pickadate_gqa .picker__footer {
  display: none;
}
.pickadate_gqa .picker--opened .picker__holder {
  max-height: 460px;
}
.pickadate_gqa .picker__box {
  padding: 5px;
}
.pickadate_gqa .picker__day {
  padding: 5px;
}
.gqa_menuleft {
  width: 200px;
  max-width: 200px;
}
@media (max-width: 1026px) {
  .pickadate_gqa .picker__day {
    padding: 7px;
    margin: 5px;
  }
}
@media (max-width: 768px) {
  .pickadate_gqa .picker__day {
    padding: 7px;
    margin: 5px;
  }
}
@media (max-width: 567px) {
  .pickadate_gqa .picker__day {
    padding: 2px;
    margin: 5px;
  }
}
.sidebar-mobile-main .sidebar-main {
  box-shadow: 0.25rem 0 1rem rgb(0 0 0 / 10%);
}
.gqa_menuleft li:hover {
  background-color: #fafafa;
}
@media (min-width: 1366px) {
  .gqa_menuleft .col-lg-2 {
    -ms-flex: 0 0 13%;
    flex: 0 0 13%;
    max-width: 13%;
  }
  .gqa_menuleft .col-lg-10 {
    -ms-flex: 0 0 87%;
    flex: 0 0 87%;
    max-width: 87%;
  }
}
@media (min-width: 1920px) {
  .gqa_menuleft .col-lg-2 {
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .gqa_menuleft .col-lg-10 {
    -ms-flex: 0 0 90%;
    flex: 0 0 90%;
    max-width: 90%;
  }
  .table_dark.h_lock .dataTables_scrollBody {
    height: calc(100vh - 370px);
    max-height: calc(100vh - 370px) !important;
  }
}
.gqa_menuleft.nav-sidebar .nav-link {
  font-family: "TrueTextOnline-bold";
  color: #888888;
}
.gqa_menuleft.nav-sidebar .nav-link.active {
  font-family: "TrueTextOnline-bold";
  color: #cc0000;
}
.pickadate_gqa .form-control {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
}
.gqa_form {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
}
.gqa_menuleft .form-control {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
}
.gqa_menuleft .dropdown-toggle::after {
  font-family: icomoon;
  display: inline-block;
  border: 0;
  vertical-align: middle;
  font-size: 0.6875rem;
  margin-left: 0.46875rem;
  line-height: 1;
  position: absolute;
  content: "\e9cA";
  top: 11px;
  bottom: 0;
  right: 15px;
  height: 8px;
}
.gqa_menuleft .dropdown-toggle.collapsed::after {
  transform: rotate(180deg);
}
.gqa_menuleft .noti {
  background: #cc0000;
  border-radius: 10px;
  min-width: 18px;
  min-height: 18px;
  color: #fff;
  text-align: center;
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 5px;
}
.gqa_menuleft .noti .txt_noti {
  font-family: "TrueTextOnline-bold";
  font-size: 12px;
  line-height: 8px;
  color: #ffffff;
}
.form_control_gqa_input {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 27.5px;
  height: 50px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 10px;
}
.card_gqa_file {
  height: 40px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 20px;
}
.form_control_gqa_textarea {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  min-height: 150px;
}
.form_control_gqa_textarea_450p {
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  min-height: 450px;
}
.txt_gqa_baht {
  font-family: "TrueTextOnline-bold";
  font-size: 14px;
  line-height: 19px;
  color: #888888;
}
.txt_gqa_submenu {
  font-family: "TrueTextOnline-regular";
  font-size: 18px;
}
.txt_gqa_submenu a {
  border-bottom: 3px solid transparent;
  line-height: 1.3rem;
}
.txt_gqa_submenu a.active,
.txt_gqa_submenu a:hover.active {
  color: #cc0000;
  /* background-color: #FFFFFF; */
  border-bottom: 3px solid;
}
.txt_gqa_submenu a:hover {
  color: #cc0000; /*cc0000*/
  /* background-color: #FFFFFF; */
  border-bottom: 3px solid #cc0000;
}
.txt_gqa_mess {
  font-family: "TrueTextOnline-regular";
  font-size: 20px;
  line-height: 28px;
  color: #888888;
}
.btn_gqa_greylight {
  min-width: 100px;
  height: 30px;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  border-radius: 20px;
  font-family: "TrueTextOnline-bold";
  font-size: 18px;
  line-height: 15px;
  color: #777777;
}
.btn_gqa_greylight:hover,
.btn_gqa_greylight:focus {
  border: 1px solid #cc0000;
  color: #fff;
  background-color: #cc0000;
}
.overflow-y-scroll {
  overflow-y: scroll;
}
.overflow-x-hidden {
  overflow-x: hidden !important;
}
/* /.GQA */
/* ME */
/* Top Nav */
.w-32p {
  width: 32px !important;
  min-width: 32px;
}
.navbar_header .navbar {
  padding: 0 10px;
  z-index: 1040; /*1050*/
}
.navbar_header .navbar-light {
  color: #444444;
  background-color: #fff;
  border-bottom-color: rgba(0, 0, 0, 0.125);
  border-bottom: 1px solid #dddddd;
  border-top: 0px;
  /*  height: 50px;*/
}
.scroll {
  white-space: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
.size_popup {
  /*  min-height: 260px;*/
  /*    max-height: 550px;*/
  overflow-y: scroll;
  min-width: 310px;
  width: 310px;
  height: auto;
  max-height: calc(100vh - 100px);
}
.ic_maxwidth {
  max-width: 55px;
}
.txt_termcond {
  font-size: 18px;
  color: #888888;
}
.txt_vl_head {
  font-family: "TrueTextOnline-Regular";
  font-style: normal;
  color: #000000;
  line-height: 1.35em !important;
  font-size: 20px;
}
.btn_topnav_gray_hover {
  border-radius: 5rem;
  border: 1px solid #bdbdbd;
}
.btn_topnav_grey_light_border {
  color: #888;
  background-color: #fff;
  border-radius: 5rem;
  font-size: 20px;
  padding: 0.1375rem 1rem;
  border: 1px solid #d9d9d9 !important;
}
.btn_topnav_grey_light_border:hover,
.btn_topnav_grey_light_border:focus,
.btn_topnav_grey_light_border:active {
  color: #fff;
  background-color: #cc0000;
  border-radius: 5rem;
  font-size: 20px;
  padding: 0.1375rem 1rem;
  border: 1px solid #cc0000 !important;
}
.navbar_header .dropdown-menu {
  position: absolute;
}
.navbar-light .navbar-nav-link {
  padding: 3px 7px;
  margin: 0px 0 0px 8px; /*2px 0 2px 8px*/ /*5px 0 5px 8px*/
}
[class^="icon-"],
[class*=" icon-"] {
  top: 0px;
}
.top_hamburger_menu:before,
.top_hamburger_menu:after,
.top_hamburger_menu div {
  background: #888888;
  content: "";
  display: block;
  height: 1px;
  border-radius: 0px;
  margin: 6px 0;
}
.top_hamburger_menu {
  width: 20px;
}
.profile-menu .img-item {
  display: inline-block;
  width: 32px;
  height: 32px;
  -o-object-fit: cover;
  object-fit: cover;
}
@media (max-width: 576px) {
  .dropdown-hamburger .size_popup {
    width: 100vw;
    right: -10px;
    border-radius: 0;
    margin-top: 0;
    box-shadow: none;
    border-top: 1px solid #ddd;
    min-height: calc(100vh - 50px);
    overflow-x: hidden;
  }
}
.vlearn-menu-open {
  display: flex;
}
.profile-menu {
  width: 300px;
  top: 35px;
  z-index: 1;
}
/* /. Top Nav */
/* VAUDIT */
.dp_yellow {
  color: #eec13f;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 28px;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding: 0.4375rem 0.875rem;
  padding-right: 35px;
  border-radius: 8px !important;
}
.dp_orange {
  color: #ff8a00;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 28px;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding: 0.4375rem 0.875rem;
  padding-right: 35px;
  border-radius: 8px !important;
}
.dp_red {
  color: #cc0000;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 28px;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding: 0.4375rem 0.875rem;
  padding-right: 35px;
  border-radius: 8px !important;
}
.dp_green {
  color: #93c47d;
  font-family: "TrueTextOnline-bold";
  font-size: 20px;
  line-height: 28px;
  height: 40px !important;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  width: 100% !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url(../../assets/images/main/arr_down_lg_12.svg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: right 15px top 3px;
  padding: 0.4375rem 0.875rem;
  padding-right: 35px;
  border-radius: 8px !important;
}
.btn_vautid_chat {
  font-family: "TrueTextOnline-bold";
  font-size: 18px;
  line-height: 20px;
  color: #cc0000;
  background-color: #fff;
}
.btn_vautid_chat:hover {
  color: #fff;
  background-color: #cc0000;
}
.hover_red:hover .txt_voe_form_filename {
  color: #cc0000 !important;
}
.btn_class_dotgrey_40 {
  position: relative;
  cursor: pointer;
  color: #888888;
  background-color: transparent;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.btn_class_dotgrey_40:hover {
  color: #fff;
  background-color: #cc0000;
  box-shadow: none !important;
}
.btn_class_dotgrey_40:hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%)
    hue-rotate(99deg) brightness(100%) contrast(100%);
}
.btn_class_dotgrey {
  position: relative;
  cursor: pointer;
  color: #888888;
  background-color: transparent;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.btn_class_dotgrey:hover,
.btn_class_dotgrey:focus,
.btn_class_dotgrey:active,
.breadcrumb-elements-item.show .btn_class_dotgrey {
  color: #fff;
  background-color: #cc0000;
  box-shadow: none !important;
}
a.breadcrumb-elements-item:hover {
  opacity: 1 !important;
}
.btn_class_dotgrey:hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%)
    hue-rotate(99deg) brightness(100%) contrast(100%);
}
.btn_class_dotgrey i {
  font-size: 24px;
  position: relative;
  margin: 0;
}
.card_vaudit_file {
  height: 40px;
  border: 1px solid #cccccc;
  box-sizing: border-box;
  border-radius: 20px;
}
.modal_bg_darkblack {
  background-color: #000000;
  opacity: 0.9;
}
.close_grey {
  opacity: 1 !important;
}
.close_grey:hover {
  opacity: 0.6 !important;
}
/* /.VAUDIT */
/* Hall of fame */
a:hover img {
  filter: brightness(1.1);
}
/* /.Hall of fame */
/* Nationwide Show Arrow */
/* /.repordcard */
/* ////////////////////////////////////////////////////////////////////////////////////////// */
@media (min-width: 768px) {
  .col-md-pull-12 {
    right: 100%;
  }
  .col-md-pull-11 {
    right: 91.66666667%;
  }
  .col-md-pull-10 {
    right: 83.33333333%;
  }
  .col-md-pull-9 {
    right: 75%;
  }
  .col-md-pull-8 {
    right: 66.66666667%;
  }
  .col-md-pull-7 {
    right: 58.33333333%;
  }
  .col-md-pull-6 {
    right: 50%;
  }
  .col-md-pull-5 {
    right: 41.66666667%;
  }
  .col-md-pull-4 {
    right: 33.33333333%;
  }
  .col-md-pull-3 {
    right: 25%;
  }
  .col-md-pull-2 {
    right: 16.66666667%;
  }
  .col-md-pull-1 {
    right: 8.33333333%;
  }
  .col-md-pull-0 {
    right: auto;
  }
  .col-md-push-12 {
    left: 100%;
  }
  .col-md-push-11 {
    left: 91.66666667%;
  }
  .col-md-push-10 {
    left: 83.33333333%;
  }
  .col-md-push-9 {
    left: 75%;
  }
  .col-md-push-8 {
    left: 66.66666667%;
  }
  .col-md-push-7 {
    left: 58.33333333%;
  }
  .col-md-push-6 {
    left: 50%;
  }
  .col-md-push-5 {
    left: 41.66666667%;
  }
  .col-md-push-4 {
    left: 33.33333333%;
  }
  .col-md-push-3 {
    left: 25%;
  }
  .col-md-push-2 {
    left: 16.66666667%;
  }
  .col-md-push-1 {
    left: 8.33333333%;
  }
  .col-md-push-0 {
    left: auto;
  }
  .container {
    max-width: 760px;
  }
  .h-md-100 {
    height: 100%;
  }
  .pr_md-10p {
    padding-right: 10px !important;
  }
  .pr_md-60p {
    padding-right: 60px !important;
  }
  .leftmenu_user_768 {
    position: fixed;
    z-index: 1005;
    background-color: #fff;
    width: 270px;
  }
}
@media (min-width: 1280px) {
  .sidebar-xs
    .sidebar-main.sidebar-light
    .nav-sidebar
    > .nav-item-submenu
    > .nav-group-sub {
    background-color: #fcfcfc;
  }
  .sidebar-light .nav-sidebar .nav-link:not(.disabled):hover {
    color: #000;
    background-color: #efefef;
  }
  .navbar-expand-md .navbar-brand {
    min-width: 1rem;
  }
  .sidebar-xs .sidebar-main {
    width: 76px;
  }
  .nav-sidebar .nav-link {
    padding: 0.35rem 1.25rem;
  }
  .sidebar-xs
    .sidebar-main.sidebar-fixed
    .nav-sidebar
    > .nav-item-submenu:focus
    > .nav-group-sub,
  .sidebar-xs
    .sidebar-main.sidebar-fixed
    .nav-sidebar
    > .nav-item-submenu:hover
    > .nav-group-sub {
    left: 5.5rem;
  }
  .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu > .nav-group-sub {
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
  }
  .sidebar-xs
    .sidebar-main.sidebar-light
    .nav-sidebar
    > .nav-item-submenu
    > .nav-group-sub {
    background-color: #fcfcfc;
    border: 0px solid rgba(0, 0, 0, 0.125);
  }
  .rounded-md-left {
    border-top-left-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
  }
  .rounded-md-top-0 {
    border-top-left-radius: 10px !important;
    border-top-right-radius: 0rem !important;
  }
  .rounded-md-top-right-0 {
    border-top-left-radius: 10px !important;
    border-top-right-radius: 0rem !important;
  }
  .rounded-md-bottom-1 {
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
  }
}
@media (min-width: 1140px) {
  .col-xl-2_4 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
}
@media (min-width: 992px) {
  .modal-lg {
    max-width: 1150px;
    width: 95%;
  }
  .w-lg-37 {
    width: 37.5% !important;
  }
  .w-lg-62 {
    width: 62.5% !important;
  }
}
@media (min-width: 1024px) {
  .container {
    max-width: 1000px;
  }
  .top-content_0 {
    width: 100%;
    height: calc(100vh - 0px);
    padding: 0;
    padding: 0rem;
  }
}
@media (min-width: 1280px) {
  .widthscreen {
    width: 1240px;
    max-width: 1240px;
  }
  .widthscreen_mfl {
    width: 1240px;
    max-width: 1240px;
    padding: 0 20px;
  }
  .container {
    max-width: 1220px;
  }
  .scrollbar_100vh_pc {
    overflow-x: hidden;
    position: relative;
    height: calc(100%); /*100vh*/
    border-radius: 10px;
  }
  .scrollbar_100vh_pc::-webkit-scrollbar {
    width: 3px;
    height: 3px;
  }
  .scrollbar_100vh_pc::-webkit-scrollbar-button {
    display: none;
    background: #888;
  }
  .scrollbar_100vh_pc::-webkit-scrollbar-track-piece {
    background: #ccc;
  }
  .scrollbar_100vh_pc::-webkit-scrollbar-thumb {
    background: #888;
  }
  .top-xl-0 {
    top: 0px;
  }
}
@media (min-width: 1366px) {
  .container {
    max-width: 1300px;
  }
  .container_1200p {
    max-width: 1220px;
  }
  .container_1000p {
    max-width: 1000px;
  }
  .w_table_addkpi {
    width: 606px;
  }
}
@media (min-width: 1380px) {
  .widthscreen_mfl {
    padding: 0 0px;
  }
}
@media (max-width: 1366px) {
  .modal-body-fixed {
    max-height: 450px;
    overflow-y: auto;
  }
}
@media (min-width: 1920px) {
  .container {
    max-width: 1600px;
  }
  .container_1200p {
    max-width: 1220px;
  }
  .container_1000p {
    max-width: 1000px;
  }
  .w_table_addkpi {
    width: 770px;
  }
}
@media (max-width: 1200px) {
  .txt_ictteamprovince_head {
    font-size: 24px;
  }
  .txt_ictteam_head {
    font-size: 24px;
  }
  .modal-body-fixed {
    max-height: 450px;
    overflow-y: auto;
  }
  .sp-img-small figure {
    height: 60px;
  }
  .sp-img-small-square figure {
    height: 80px;
  }
  .sp-img-small-square-home figure {
    height: 70px;
  }
  .schoolinfo-img-big figure {
    height: 270px;
  }
  .w_table_addkpi {
    width: 480px;
  }
  .h_mic_card {
    height: 130px;
    overflow: hidden;
  }
  .h_100per_0m {
    height: 100%;
  }
}
@media (max-width: 1024px) {
  .navbar-top {
    padding-top: 3.15rem;
  }
  .txt_navtab {
    font-size: 16px;
  }
  .navbar-lg .dropdown-user > .navbar-nav-link,
  .navbar-lg .dropdown-user > .navbar-nav-link > span {
    padding-top: 0.57rem;
    padding-bottom: 0.5rem;
  }
  .navbar-lg .navbar-nav-link {
    padding: 1rem 0.8rem;
  }
  .txt_ictteamprovince_head {
    font-size: 24px;
  }
  .m_width_engage {
    min-width: 140px;
  }
  .m_width_icttalent {
    min-width: 340px;
  }
  .m_width_school {
    min-width: 185px;
  }
  .minwidth {
    min-width: 75px;
  }
  .txt_sp_headnum {
    font-size: 32px;
  }
  .txt_progress {
    font-size: 18px;
  }
  .spname_ellipsis {
    max-width: 160px;
  }
  .sp-img-small-square figure {
    height: 65px;
  }
  .sp-img-small figure {
    height: 55px;
  }
  .sp-img-small-square-home figure {
    height: 50px;
  }
  .txt_sp_titlenum {
    font-size: 16px;
  }
  .widthscreen_quest {
    padding: 0 0px;
  }
  .box-topic_splan_pdf {
    max-width: 280px;
  }
  .txt_cned_headnum-sm {
    font-size: 30px;
  }
  .img-square-70 figure {
    height: 58px !important;
  }
  .minheight_stepbar {
    min-height: 72px;
  }
  /* TrueConnect */
  .px_kpi_card {
    padding: 5px 14px; /*5 10*/
  }
  .px_kpi_card2 {
    padding: 14px 14px; /*10 14*/
  }
  .px_kpi_card5 {
    padding: 5px 14px; /*5 10*/
  }
  .px_kpi_card6 {
    padding: 8px 10px; /*8 14*/ /*8 6*/
  }
  .px_kpi_card_m {
    padding: 8px 6px;
  }
  .px_kpi_card8 {
    padding: 8px 14px;
  }
  /*
  .txt_kpi_head_num3 {
    font-size: 22px;
  }
  .txt_kpi_title {
    font-size: 16px;
  }
*/
  .bar_kpi_headtopic_w {
    padding: 8px 9px;
  }
  .bar_kpi_headtopic_w3 {
    padding: 8px 9px;
  }
  /*
  .txt_kpi_bighead2,.txt_kpi_bighead3 {
    font-size: 18px;
  }
  .txt_kpi_bighead_date {
    font-size: 18px;
  }*/
  .table_cn_border td {
    font-size: 16px;
  }
  .txt_kpi_bighead4 {
    font-size: 24px;
  }
  .px_kpi_navbar {
    padding-left: 20px;
    padding-right: 20px;
  }
  /* /.TrueConnect */
  /* BMS */
  .w_table_addkpi {
    width: 480px;
  }
  /* /.BMS */
  .maxwidth_m100p_1024 {
    max-width: 100px;
    width: 100px;
  }
  .maxwidth_m100p_1024_no768 {
    max-width: 100px;
    width: 100px;
  }
  .bar_bms_navlink4 {
    font-size: 16px;
  }
  .h_mic_card {
    height: 130px;
    overflow: hidden;
  }
  .pb_me_768_1366 {
    padding-bottom: 0px !important;
  }
  .pb_me_768_1024 {
    padding-bottom: 10px !important;
  }
  .scrollbar_100vh,
  .scrollbar_100vh_150 {
    overflow-x: hidden;
    position: relative;
    height: 100%;
  }
  .scrollbar_0p {
    height: 100%;
  }
  .scrollbar_me_xy {
    height: 100%;
  }
  .maxwidth_ex_110 {
    max-width: 90px !important;
    width: 90px !important;
  }
  .maxwidth_ex_90 {
    max-width: 76px !important;
    width: 76px !important;
  }
  .maxwidth_ex_65 {
    max-width: 65px !important;
    width: 65px !important;
  }
  .maxwidth_ex_70 {
    max-width: 70px !important;
    width: 70px !important;
  }
  .maxheight_geomap_m0,
  .maxheight_geomap_730_m0,
  .maxheight_geomap_420_m0,
  .maxheight_geomap_600_m0 {
    max-height: 100%;
  }
  .maxheight_noti_m0 {
    max-height: 263px;
  }
  .maxh_100vh_lg-70p {
    height: calc(100vh - 70px);
  }
  .maxh_100vh_lg-117p {
    height: calc(100vh - 117px);
  }
}
@media (max-width: 992px) {
  .pb_me_10p_m {
    padding-bottom: 10px !important;
  }
  .h_100per_0m {
    height: auto;
  }
}
@media (max-width: 820px) {
  .container {
    max-width: 810px;
  }
}
@media (max-width: 768px) {
  .container {
    padding-left: 15px;
    padding-right: 15px;
  }
  /* Resize */
  .pt_me-3 {
    padding-top: 10px !important;
  }
  .pb_me-3 {
    padding-bottom: 10px !important;
  }
  .pb_me-4 {
    padding-bottom: 10px !important;
  }
  .pb_me_10p_m {
    padding-bottom: 0px !important;
  }
  .pb_me_m10p {
    padding-bottom: 10px !important;
  }
  .content {
    padding: 0.5rem 0.25rem;
    -ms-flex-positive: 1;
    flex-grow: 1;
  }
  /* /.Resize */
}
@media (max-width: 736px) {
  .border_bottom_1_f3_m {
    border-bottom: 1px solid #dddddd;
  }
  .border_bottom_1_333_m {
    border-bottom: 1px solid #333;
  }
  .border_x_1_f3_pc {
    border-left: 0px solid #dddddd !important;
    border-right: 0px solid #dddddd !important;
  }
  .border_right_1_f3_pc {
    border-right: 0px solid #dddddd !important;
  }
  .border_right_1_333_pc {
    border-right: 0px solid #333 !important;
  }
  .border_right_1_f3_m {
    border-right: 1px solid #dddddd !important;
  }
  .border_left_1_f3_pc {
    border-left: 0px solid #dddddd !important;
  }
  .border_bottom_1_f3_pc {
    border-bottom: 0px solid #dddddd !important;
  }
  .border_top_1_333_m {
    border-top: 1px solid #333333 !important;
  }
  .border_top_1_f3_m {
    border-top: 1px solid #dddddd !important;
  }
  .border_top_1_f3_pc {
    border-top: 0px solid #dddddd !important;
  }
}
@media (max-width: 576px) {
  .border_bottom_1_f3_m {
    border-bottom: 1px solid #dddddd;
  }
  .border_bottom_1_333_m {
    border-bottom: 1px solid #333333;
  }
  .border_x_1_f3_pc {
    border-left: 0px solid #dddddd !important;
    border-right: 0px solid #dddddd !important;
  }
  .border_right_1_f3_pc {
    border-right: 0px solid #dddddd !important;
  }
  .border_right_1_333_pc {
    border-right: 0px solid #333 !important;
  }
  .border_right_1_e5_pc {
    border-right: 0px solid #e5e5e5 !important;
  }
  .border_top_1_e5_m {
    border-top: 1px solid #e5e5e5 !important;
  }
  .border_right_1_f3_m {
    border-right: 1px solid #dddddd !important;
  }
  .border_left_1_f3_pc {
    border-left: 0px solid #dddddd !important;
  }
  .border_bottom_1_f3_pc {
    border-bottom: 0px solid #dddddd !important;
  }
  .border_top_1_f3_m {
    border-top: 1px solid #dddddd !important;
  }
}
@media (max-width: 414px) {
}
@media (max-width: 375px) {
  .w-350p_390p {
    width: 350px !important;
    min-width: 350px;
  }
}
@media (max-width: 320px) {
}
@media print {
}