html {
    font-size: 10px;
}

body,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Arial', '微軟正黑體', sans-serif;
    font-size: var(--font-size-base);
}

/* start of overriding layouts/layout/css/layout.css */
.page-header-fixed .page-container {
    margin-top: var(--page-header-height);
}

.page-header.navbar {
    height: var(--page-header-height);
    min-height: var(--page-header-height);
    border-bottom: 3px solid #fff;
    font-weight: 700;
    width: 100%;
    margin: 0;
    padding: 0 10px;
    filter: none;
    background-color: #fff;
    background-image: none;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.05);
}

.page-header.navbar .page-logo {
    float: left;
    display: block;
    width: 0;
    height: 0;
    padding-left: 0px;
    padding-right: 20px;
    margin-top: 5px;
}

.page-header.navbar .page-logo .logo-default {
    height: 45px;
    margin: -10px 0 0 0;
}

.page-header.navbar .page-logo .logo-mobile {
    height: 45px;
    margin: -10px 0 0 0;
    display: none;
}

@media (max-width: 991px) {
    .page-header.navbar .page-logo .logo-default {
        display: none;
    }

    .page-header.navbar .page-logo .logo-mobile {
        display: block;
    }
}

.page-header.navbar .top-menu .navbar-nav {
    padding-top: 0;
    margin-right: 20px;
}

.page-header.navbar .menu-toggler.responsive-toggler {
    margin: 0 6px 0;
}

.page-sidebar .page-sidebar-menu > li.heading + li > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.heading + li > a {
    border-top: var(--menu-border);
}

.page-sidebar .page-sidebar-menu .sub-menu li,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li {
    margin-top: 0px !important;
    /*    border-bottom: var(--grid-border); */
}

.page-sidebar .page-sidebar-menu .sub-menu li > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > a {
    padding: 10px 15px 10px 25px;
    border-bottom: var(--submenu-border);
}

.page-sidebar .page-sidebar-menu .sub-menu li:last-child > a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > a {
    border-bottom: 0;
}

.page-sidebar .page-sidebar-menu li > a > .arrow:before,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li > a > .arrow:before {
    content: '\f107';
}

.page-sidebar .page-sidebar-menu li > a > .arrow.open:before,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li > a > .arrow.open:before {
    content: '\f106';
}

@media (min-width: 992px) {
    .page-sidebar {
        width: var(--page-sidebar-width);
        float: left;
        position: relative;
        margin-right: -100%;
    }

    .page-content-wrapper .page-content {
        margin-left: var(--page-sidebar-width);
        margin-top: 0;
        min-height: 600px;
        padding: 10px 20px;
    }

    .page-sidebar-closed.page-sidebar-closed-hide-logo .page-header.navbar .page-logo .logo-default {
        display: block;
    }

    .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li.nav-item {
        width: 256px !important;
        position: relative !important;
        z-index: 10000;
        display: none !important;
        cursor: auto;
    }

    .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li:hover > a,
    .page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li.open > a {
        background: transparent;
        color: #fff;
    }
}

textarea.tf-control {
    border-width: 1px;
}


/* end of overriding layouts/layout/css/layout.css -------------------- */

/* start of header */
.icon_notice_Group {
    margin-right: 24px;
    position: relative;
    display: inline-flex;
    justify-content: flex-end;
    align-content: center; 
}

@media only all and (max-width: 991px) {
    .page-header.navbar .top-menu {
        display: inline-flex;
        justify-content: flex-end;
        align-content: center;
    }
}

@media only all and (max-width:768px) {
    .page-header.navbar .top-menu {
        width: 100%;
        margin-top: 20px;
    }

    .page-header.navbar {
        height: var(--page-header-height);
        min-height: var(--page-header-height);
        height: auto;
        min-height: 120px;
    }
}
.icon_notice_Group .icon_notice {
    position: relative;
    padding: 0;
    margin: 0;
}

.icon_notice_Group .icon_notice a.btn,
.icon_notice_Group .icon_notice a.btn.show,
.icon_notice_Group .icon_notice a.btn.focus,
.icon_notice_Group .icon_notice a.btn:focus,
.icon_notice_Group .icon_notice a.btn:focus-visible {
    font-size: 0 !important;
    text-decoration: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #edeff1;
    border-color: #edeff1;
    text-align: center;
    position: relative;
    padding: 0;
    margin: 0;
}

.icon_notice_Group .icon_notice .header_img {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 54%;
    transform: translate(-50%, -54%);
}

.icon_notice_Group .icon_notice .topIconNoticeRed {
    position: absolute;
    top: -5px;
    left: 25px;
    border-radius: 15px !important;
    line-height: 13px;
    background-color: #d10505;
    display: inline-block;
    color: #fff;
    font-size: 1.2rem;
    padding: 3px 3px 1px 5px;
    margin: 0;
}

.icon_notice_Group .user_box {
    position: absolute;
    top: 30px;
    right: -20px;
    z-index: 9956;
    width: 400px;
    border: 1px solid #070303;
}

.btn-group > .dropdown-menu:before,
.dropdown-toggle > .dropdown-menu:before,
.dropdown > .dropdown-menu:before {
    position: absolute;
    top: -8px;
    right: 25px;
    left: auto;
    display: inline-block !important;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #000000;
    border-left: 8px solid transparent;
    content: '';
}

.btn-group > .dropdown-menu:after,
.dropdown-toggle > .dropdown-menu:after,
.dropdown > .dropdown-menu:after {
    position: absolute;
    top: -7px;
    right: 26px;
    left: auto;
    display: inline-block !important;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #fff;
    border-left: 7px solid transparent;
    content: '';
}

.icon_notice_Group ul.list_item_3 {

    list-style-position: outside;
    padding: 10px 20px 0 20px;
}

.icon_notice_Group ul.list_item_3 li {
    margin-bottom: 10px;
       list-style-image: url('/frontweb/skin/assets_ext/extends/img/com-icon-1-08745669801af6cedc55a978d409fbd5.png');
      vertical-align: top;
}

.icon_notice_Group ul.list_item_3 li a {
    color: #000;
    font-size: 1.6rem !important;
    line-height: 1.2;
    font-weight: 400;
    text-decoration: none;
    display: inline-block;
     vertical-align: top;
    width: 100%;
    border-bottom: 1px solid #fff;
}
.icon_notice_Group ul.list_item_3 li a:hover {
    color: #f25702;
}

@media only all and (max-width:768px) {
    .icon_notice_Group .user_box {
        position: absolute;
        top: 30px;
        right: -242px;
        width: 300px;
    }

    .btn-group > .dropdown-menu:before,
    .dropdown-toggle > .dropdown-menu:before,
    .dropdown > .dropdown-menu:before {

        left: 35px;
        right: auto;
    }

    .btn-group > .dropdown-menu:after,
    .dropdown-toggle > .dropdown-menu:after,
    .dropdown > .dropdown-menu:after {

        left: 36px;
        right: auto;
    }
}
/* end of header */

/* start of page-content */
.page-content {
    background-color: var(--page-content-bg);
}

.page-content .page-content-footer {
    text-align: center;
    font-weight: 700;
}

/* end of page-content -------------------- */

/* start of sidebar */
.page-sidebar {
    height: 100vh;
    position: fixed;
    overflow: auto;
    background: rgb(255, 238, 254);
    background: linear-gradient(356deg, rgba(228, 242, 254, 1) 0%, rgba(255, 254, 254, 1) 100%);
}

.page-sidebar .page-sidebar-menu a {
    font-size: var(--font-size-base) !important;
}

.page-sidebar .page-sidebar-menu .sub-menu,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu {
    padding: 0;
    margin: 0;
    background-color: var(--submenu-bgcolor);
}

.page-sidebar .page-sidebar-menu li.heading {
    background: var(--menu-header-bg);
    color: var(--menu-header-color);
    line-height: 1;
}

.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li .sub-menu li > a,
.page-sidebar .page-sidebar-menu li .sub-menu li:hover > a,
.page-sidebar .page-sidebar-menu li .sub-menu li:hover > a > i {
    background-color: var(--submenu-hover-bgcolor) !important;
    color: var(--submenu-hover-color);
}

.page-sidebar .sidebar-toggler2 {
    cursor: pointer;
    width: 100%;
    display: inline-block;
    text-align: right;
}

/* end of sidebar -------------------- */

/* start of card */
.card.card-std {
    --bs-card-border-radius: 10px;
    border: none;
    box-shadow: 5px 10px 5px rgba(116, 116, 116, 0.2);
    margin-bottom: 20px !important;
}

.card.card-std .card-body {
    padding: 15px 20px 20px 20px;
}

/* end of card */

/* start of portlet */
.portlet > .portlet-title:before,
.portlet > .portlet-title:after {
    content: none !important;  /* 或用 "" */
    display: none !important;
}

.portlet.box {
    background-color: #e7e7e0;
    margin-bottom: 20px;
    box-shadow: none;
    border-radius: 10px;
    border: 1px solid #8eb9bc;
}

.portlet.box > .portlet-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-base);
    font-weight: 700;
    padding: 6px 20px;
    border-radius: 10px 10px 0 0;
    background: var(--portlet-title-bg);
    color: var(--portlet-title-color);
    border-bottom: 1px solid #8eb9bc;
}

.portlet.box > .portlet-title > .caption {
    display: inline-flex;
    align-items: center;
    padding: 0;
    font-size: inherit;
    font-weight: inherit;
}

.portlet.box > .portlet-title > .tools {
    white-space: nowrap;
    float: none !important;
    display: block !important;
    padding: 0 !important;
}

.portlet.box > .portlet-title > .tools > a {
    filter: invert(100%) hue-rotate(180deg);
}

.portlet.box > .portlet-body {
    background-color: #fff;
    border-radius: 0 0 10px 10px;
}

.portlet.box > .portlet-body:only-child {
    border-radius: 10px;
}

/* end of portlet -------------------- */

/* start of portlet 2 */
.portlet.box.portlet-s2 {
    background-color: #fff;
    margin-bottom: 20px;
    box-shadow: none;
    border-radius: 10px;
    border: 2px solid #e0bda8;
}

.portlet.box.portlet-s2 > .portlet-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-base);
    font-weight: 700;
    padding: 6px 20px;
    border-radius: 10px 10px 0 0;
    background: #fdf9f6;
    color: #a35526 !important;
    border-bottom: 1px solid #e0bda8;
}

/* end of portlet 2 -------------------- */

/* start of portlet 3 */
.portlet.box.portlet-s3 {
    background-color: #fff;
    margin-bottom: 20px;
    box-shadow: none;
    border-radius: 10px;
    border: 4px solid #a7ccdd !important;
}

.portlet.box.portlet-s3 > .portlet-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--font-size-base);
    font-weight: 700;
    padding: 6px 20px;
    border-radius: 10px 10px 0 0;
    background: #f7fcfe;
    color: #316a85;
    border-bottom: 1px solid #a7ccdd;
}

/* end of portlet 3 -------------------- */

/* start of quill -------------------- */
.ql-toolbar.ql-snow {
    margin-top: 10px;
    border: 1px solid #767676 !important;
}

.ql-container.ql-snow {
    border: 1px solid #767676 !important;
    border-top: none !important;
}

/* end of quill -------------------- */

/* start of datatable */
/* 取消bs5的table-hover效果 */
.table > :not(caption) > * > * {
    box-shadow: unset;
    --bs-table-bg: transparent;
}

table.table tr th,
table.table tr td {
    padding: 4px 10px;
    font-size: var(--font-size-base);
    vertical-align: middle;
    text-align: var(--grid-cell-text-align);
}

table.dataTable {
    width: 100%;
    --bs-border-width: 0; /* 取消bs5定義 */
}

table.dataTable thead tr th,
table.dataTable thead tr td,
table.dataTable tbody tr th,
table.dataTable tbody tr td {
    padding: 4px 10px;
    font-size: var(--font-size-base);
    vertical-align: middle;
    text-align: var(--grid-cell-text-align);
}

table.dataTable tr.heading > th {
    background: var(--grid-head-bgcolor);
    color: #000;
}

table.dataTable thead th,
table.dataTable thead td {
    border-bottom: 1px solid #111;
}

table.dataTable > tbody > tr:first-child > * {
    border-top: var(--grid-border);
}

div.dt-container.dt-empty-footer tbody > tr:last-child > * {
    border-bottom: none;
}

.dt-container .form-select {
    appearance: auto;
    background-image: none;
    height: 28px;
}

.dt-container .input-sm {
    padding: 4px 10px;
    font-size: 12px;
}

.dt-container .form-control:focus,
.dt-container .form-select:focus {
    border: 1px solid #3b82f6 !important;
    box-shadow: none;
}

table.table-bordered,
table.table-bordered > tbody > tr > td,
table.table-bordered > tbody > tr > th,
table.table-bordered > tfoot > tr > td,
table.table-bordered > tfoot > tr > th,
table.table-bordered > thead > tr > td,
table.table-bordered > thead > tr > th {
    border: var(--grid-border);
}

table.dataTable .tbody-cell-left td {
    text-align: left;
}

table.dataTable .tbody-cell-center td {
    text-align: center;
}

table.dataTable .tbody-cell-right td {
    text-align: right;
}

table.dataTable .heading-center th {
    text-align: center;
}

table.dataTable .heading th.left {
    text-align: left;
}

table.dataTable .heading th.center {
    text-align: center;
}

table.dataTable .heading th.right {
    text-align: right;
}

table.dataTable tr.nowrap th,
table.dataTable tr.nowrap td {
    white-space: nowrap;
}

table.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: transparent;
}

table.table-striped > tbody > tr:nth-of-type(even) {
    background-color: var(--grid-row-even-bgcolor);
}

table.table-hover > tbody > tr:hover,
table.table-hover > tbody > tr:hover > td {
    background: var(--grid-row-hover-bgcolor) !important;
}

/* end of datatable -------------------- */

/* start of tabs */
.nav-tabs {
    background: var(--tabs-header-bg);
    padding: 0 0 1px 0;
    border-bottom: 3px solid #f15219;
}

.nav-tabs .nav-item {
    padding: 0 6px 0 0;
    margin-top: 4px;
}

.nav-tabs .nav-link {
    color: #000;
    background-color: #efefef;
    border: 3px solid #efefef;
    border-radius: 5px 5px 0 0;
    padding: 6px 16px 3px 16px;
    font-size: var(--font-size-lg);
    font-weight: 700;
}

.nav-tabs .nav-link.active {
    --bs-nav-tabs-link-active-color: #fff;
    --bs-nav-tabs-link-active-bg: #f15219;
    --bs-nav-tabs-link-active-border-color: #f15219;
}

.nav-tabs .nav-link:hover {
    color: #fff;
    background-color: #000;
    border: 3px solid #000;
}

/* end of tabs -------------------- */

/* start of funcbar */
.funcbar {
    display: inline-block;
    width: 100%;
    border-bottom: 3px solid #018891;
    margin-bottom: 5px;
}

.funcbar .caption {
    float: left;
    margin: 3px 5px;
    font-size: var(--font-size-funcbar);
    font-weight: 700;
    color: var(--funcbar-color);
}

.funcbar .action-group {
    float: right;
}

/* end of funcbar -------------------- */

/* start of modal dialog */
.modal .modal-content {
    background-color: var(--modal-content-bg);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 10px;
}

.modal .modal-header {
    background: var(--modal-header-bg);
    padding: 15px;
    border-radius: 10px 10px 0 0;
}

.modal .modal-header .modal-title {
    color: #fff;
    font-size: var(--font-size-base);
    font-weight: bold;
}

.modal .modal-header .btn-close {
    filter: invert(100%);
}

.modal .modal-body {
    padding: 20px;
}

.modal .modal-footer {
    background-color: var(--modal-footer-bg);
    padding: 15px;
    border-radius: 0 0 10px 10px;
    justify-content: center;
}

/* 不要出現兩條scrollbar */
.modal.fade.show::-webkit-scrollbar {
    display: none;
}

@media (min-width: 992px) {
    .modal-lg, .modal-xl {
        --bs-modal-width: 900px;
    }
}

/* end of modal dialog -------------------- */

.mb-4 {
    margin-bottom: 1.5rem !important;
}

@media (min-width: 1200px) {
    .action-group.fixed-colno-4 button.btn {
        width: calc(100% / 4 - 14px);
    }
}

/* begin of tippy  -------------------- */
i[data-tippy-content],
i[data-tippy-template] {
    margin-left: 2px;
}

.tippy-box ul,
.tippy-box ol {
    margin: 0;
    padding: 0 5px 0 20px;
}

/* end of tippy  -------------------- */

/* begin of sweetalert2 */
div:where(.swal2-container) h2:where(.swal2-title) {
    font-size: var(--font-size-base);
    font-weight: 700;
}

div:where(.swal2-container) .swal2-html-container {
    font-size: var(--font-size-base);
}

div:where(.swal2-container) div:where(.swal2-actions) {
    width: 80%;
    margin: 3em auto 0;
}

.swal2-actions.fixed-colno-2 button.btn {
    width: calc(100% / 2 - 20px);
}

div:where(.swal2-container) {
    z-index: 10099; /* cover bootstrap modal class */
}

/* end of sweetalert2 */

/* begin of caption-switcher */
.portlet > .portlet-title.caption-switcher > .selector {
    position: relative;
    display: inline-block;
    float: right;
}

.portlet > .portlet-title.caption-switcher > .selector select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #c0bbcd;
    border: 0px solid #9fa5e3;
    padding: 10px;
    font-size: var(--font-size-lg);
    border-radius: 4px;
    color: #fff;
    font-weight: bold;
    /*outline: none;  去掉點擊時的外框線 */
}

.portlet > .portlet-title.caption-switcher > .selector::after {
    content: '▼';
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: var(--font-size-lg);
    color: #fff;
}

.portlet > .portlet-title.caption-switcher > .selector option {
    background-color: #faf7ff;
    color: #000;
}

.portlet > .portlet-title.caption-switcher > .selector option:hover {
    background-color: #d0d0d0;
}

.portlet > .portlet-title.caption-switcher > .title_sr {
    float: left;
    font-size: var(--font-size-lg);
    font-weight: 700;
    padding: 10px 0;
}

.portlet > .portlet-title.caption-switcher > .hidden-selected-text {
    visibility: hidden;
    white-space: nowrap;
    font-size: var(--font-size-lg);
    font-weight: bold;
    padding: 10px;
    position: absolute;
}

/* end of caption-switcher */

/* begin of validator */
.help-block {
    margin: 3px 0;
}

.help-block.help-block-error {
    color: #e73d4a;
}

span.required::before {
    content: '*';
    color: #ae0606;
}

/* end of validator */

/* begin of misc */
.captcha-img {
    cursor: pointer;
}

span.input-group-addon:has(> .fa-calendar) {
    cursor: pointer;
}

span.input-group-addon > i {
    color: inherit;
}

.font-green-meadow {
    color: #adb5bd !important;
}

.font-blue-steel {
    color: #ced4da !important;
}

.separator-line-1 {
    border-top: 1px solid #667374;
    margin: 10px 0;
}

.separator-line-3 {
    border-top: 3px solid #667374;
    margin: 10px 0;
}

/* end of misc */

/* start of dashboard */
@media only all and (max-width: 992px) {
    .index_card .grid .aa-td {
        width: 100% !important;
    }
}

.card-body .topIconNoticeRed {
    position: relative;
    display: inline-block;
    width: auto;
    height: 20px;
}

.card-body .topIconNoticeRed .topIconBox {
    position: absolute;
    top: -5px;
    left: 0px;
    color: #fff;
    padding: 0px 4px 2px 3px;
    margin: 0;
    border-radius: 15px;
    line-height: 13px;
    background-color: #d10505;
    display: inline-block;
}

.card-body .topIconNoticeRed .topIconBox a {
    color: #fff;
    font-size: 1.2rem;
    font-weight: normal;
    text-decoration: none;
}

.title_s .topIconNoticeRed {
    margin-left: 6px;
}

.title_s .topIconBox {
    padding: 1px 4px 2px 4px;
    line-height: 15px;
}

.inedx_table_adjust {
    margin-top: -11px;
}

.index_card .title_s {
    font-size: 2.2rem;
}

.iconExp {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    zoom: 0.9;
}

.iconExp div {
    font-size: 1.4rem;
    margin: 5px 10px;
}

@media only all and (max-width: 1024px) {
    .iconExp {
        justify-content: flex-start;
        zoom: 1;
    }
}

.tag_group {
    margin-bottom: 20px;
}

.tag_group .btn {
    border-radius: 25px;
    height: 35px;
    zoom: 0.8;
}

/* end of dashboard -------------------- */

/* start of full-calendar */
.fc-toolbar h2 {
    color: #000;
}

.fc-col-header-cell-cushion,
.fc-daygrid-day-number {
    color: #000;
}

#calendar a {
    text-decoration: none;
}

.fc-daygrid-day-number,
.fc-event-title {
    font-weight: normal !important;
}

.fc .fc-button-primary {
    background-color: #018891;
    border-color: #018891;
}

.fc .fc-button {
    padding: 0.2em 0.4em;
    border-radius: 6px;
    display: inline-block;
}

.fc-today-button.fc-button {
    padding: 0.2em 1.1em !important;
}

.fc .fc-toolbar.fc-header-toolbar {
    margin-bottom: 1px;
    padding-bottom: 5px;
    border-bottom: 3px solid #018891;
}

.status_red {
    color: #f2473a;
}

.status_orange {
    color: #ffc000;
}

.status_purple {
    color: #bd92df;
}

.status_green {
    color: #b0da60;
}

.status_gray {
    color: #67b6f3;
}

.status_black {
    color: #000000;
}

.status_bg_red,
.status_bg_orange,
.status_bg_purple,
.status_bg_green,
.status_bg_gray {
    text-align: center;
    font-weight: 500;
}

.status_bg_red {
    background-color: #f2473a;
    border-color: #f2473a;
}

.status_bg_orange {
    background-color: #ffc000;
    border-color: #ffc000;
}

.status_bg_purple {
    background-color: #bd92df;
    border-color: #bd92df;
}

.status_bg_green {
    background-color: #b0da60;
    border-color: #b0da60;
}

.status_bg_gray {
    background-color: #67b6f3;
    border-color: #67b6f3;
}

.fc-h-event .fc-event-main {
    color: #000000 !important;
}

/* end of full-calendar */

/* begin of card CRUD */
.invide_card {
    width: 100%;
    padding: 0;
    margin: 0;
}

.addcardGroup {
    width: 100%;
    overflow: auto;
    padding: 15px 15px 0 15px;
    background-color: #969aa2;
    border: 2px solid #767676;
    border-radius: 10px;
    border-width: 5px;
}

.duplicate-sections {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    padding: 0;
    width: 100%;
}

.ss_tag {
    background-color: #d9ff33;
    padding-right: 5px;
    padding-left: 5px;
}

/* end of card CRUD */

/* begin of card CRUD2 */
.invide_card_small {
    width: 100%;
    border-radius: 10px;
    padding: 10px 5px 10px 0px;
    background-color: #fff;
    position: relative;
    box-shadow: 0 0.5rem 1rem rgba(52, 58, 64, 0.075);
}

.tf-help-inline.right {
    position: absolute;
    right: 10px;
    top: 20px;
}

.tf-help-inline.right .iconGroup button {
    margin: 0 2px;
}

.infro_img {
    width: 26px;
    height: auto;
    vertical-align: middle;
    position: relative;
}

.invide_card_small .aa-td {
    padding: 4px 4px;
}

.invide_card .aa-table .aa-th,
.invide_card .aa-table .aa-td {
    padding: 4px 4px;
}

@media only all and (max-width: 1800px) {
    .invide_card_small {
        padding: 40px 5px 10px 0px;
    }

    .tf-help-inline.right {
        right: 10px;
        top: 10px;
    }

    .aa-table .invide_card_small .tf-control.w-sm,
    .aa-table .invide_card_small .tf-control.w-md {
        width: 100% !important;
    }
}

@media only all and (max-width: 1000px) {
    .invide_card_small {
        padding: 10px 20px 10px 20px;
    }

    .tf-help-inline.right {
        right: 20px;
        top: 10px;
    }
}

.invide_card_small .tf-label img {
    margin-top: 5px;
}

/* end of card CRUD2 */

/* start of 流程小豆干 */
.draggable {
    cursor: move;
}

.style01_btn,
.style02_btn,
.style03_btn,
.style04_btn {
    font-weight: bold;
    /*    white-space: nowrap;*/
    line-height: 2rem;
    height: 68px;
}

.style01_btn {
    color: #fff;
    background-color: #31619f;
}

.style02_btn {
    color: #fff;
    background-color: #f7924d;
}

.style03_btn {
    color: #fff;
    background-color: #259ca7;
}

.style04_btn {
    color: #fff;
    background-color: #31619f;
    background: #31619f url(/frontweb/skin/assets_ext/extends/img/icon_casecycle-ec660239c85c138f599b87aa0eb77061.svg) 50% 50% no-repeat;
    background-size: 60%;
    border:6px solid #9be428;
}

/*小豆干於拖拉時，解除下方網頁不能捲動的狀況*/
@media only all and (min-width: 768px) {
    .page-header-fixed.page-sidebar-closed-hide-logo.page-content-white {
        overflow: auto !important;
    }
}

.connectedSortable {
    background-color: #fff;
    height: auto;
    display: inline-block;
    width: 100%;
    margin-left: 0;
    margin-bottom: 20px;
}

.open_draggable {
    position: fixed;
    top: 83vh;
    right: -2px;
    text-align: left;
    z-index: 1011;
    overflow: hidden;
}

.open_draggable .btn.btn-b1 {
    width: 60px;
    height: 50px;
}

.open_draggable .btn.btn-b1 img {
    width: 30px;
    height: auto;
}

.offcanvas.offcanvas-bottom {
    z-index: 1012;
    right: 0;
    left: 0;
    height: 160px;
    border-top: 1px solid #fff;
    background-color: #fff;
    box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.1), 4px 6px 20px 0 rgba(0, 0, 0, 0.1);
    padding-bottom: 10px;
}

.offcanvas-header button.btn-close {
    opacity: 0.8;
    padding: 0 !important;
    margin: 0 !important;
    height: 1rem;
    zoom: 2;
    position: absolute;
    right: 10px;
    top: 10px;
}

.offcanvas-header button.btn-close:hover {
    opacity: 1;
}

.offcanvas-header {
    display: flex;
    align-items: center;
    padding: 1rem 1rem 0 1rem;
}

.offcanvas-body {
    flex-grow: 1;
    padding: 0 1rem;
    overflow-y: auto;
}

.offcanvas-title {
    font-size: 2.6rem;
    font-weight: bold;
    padding-left: 24px;
}

.connectedSortable.dragsec_01,
.offcanvas-body .dragsec_01 {
    list-style-type: none;
    margin: 0;
    padding: 0;
    padding: 10px;
    margin: 0 10px;
    cursor: move;
}

.connectedSortable.dragsec_01 li,
.offcanvas-body .dragsec_01 li {
    margin: 5px;
    width: 100px;
    height: 68px;
    padding: 5px 10px;
    border-radius: 10px;
    text-align: center;
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    float: left;
    aspect-ratio: 4 / 3;
}

.data_table {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    padding: 10px;
    margin: 0 10px 0 0px;
    width: calc(50% - 10px);
}

.data_table .data_td_left {
    width: 25%;
    color: #73712b;
    font-weight: 500;
    text-align: right;
    padding-right: 5px;
    margin-bottom: 10px;
}

.data_table .data_td_right {
    width: 70%;
}

.data_table .data_td_right span {
    margin-right: 10px;
}

/* end of 流程小豆干 -------------------- */

/* start of td裡的流程小豆干 */
.rwddragsec {
    width: 100%;
    overflow: auto;
}

.rwddragsec .connectedSortable {
    width: 300px;
}

td .connectedSortable {
    background-color: transparent;
    height: auto;
    display: inline-block;
    width: 100%;
    margin-left: 0;
    border-radius: 0px;
    box-shadow: none;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 0px;
}

td .connectedSortable.dragsec_01 {
    list-style-type: none;
    margin: 0;
    padding: 0;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
}

.table tbody tr td .style01_btn,
.table tbody tr td .style02_btn,
.table tbody tr td .style03_btn,
.table tbody tr td .style04_btn {
    zoom: 0.8;
}

.connectedSortable.disabled .style01_btn,
.connectedSortable.disabled .style02_btn,
.connectedSortable.disabled .style03_btn,
.connectedSortable.disabled .style04_btn {
    zoom: 0.8;
    color: #181818;
    background-color: #dcdcdc;
}

.table tbody tr td .style04_btn {
    padding: 0 20px;
}

.td_img_box a:hover {
    text-decoration: none;
    color: transparent;
}

/* end of td裡的流程小豆干 -------------------- */

/* start of 流程小豆干 td裡的小圖示 */
.result_notice {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-content: center;
}

.result_notice .caseP_img {
    width: 25px;
    height: auto;
}

@media only all and (max-width: 768px) {
    .result_notice {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-content: center;
    }
}

.result_notice div {
    display: inline-block;
    white-space: nowrap;
    line-height: 24px;
    height: 24px;
    vertical-align: middle;
    margin-right: 10px;
}

.result_notice div:last-child {
    margin-right: 0;
}

.result_notice .td_img {
    width: 24px;
    height: auto;
    margin-top: -4px;
}

.iconGroup2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: default;
}

.iconGroup2 .td_img,
.iconGroup3 .td_img {
    width: 24px !important;
    height: auto;
    vertical-align: middle;
}

.status_red {
    color: #f2473a;
}

.status_orange {
    color: #ffc000;
}

.status_purple {
    color: #bd92df;
}

.status_green {
    color: #b0da60;
}

.status_gray {
    color: #aabdcc;
}

.status_black {
    color: #000000;
}

.chioseGroup2 {
    display: flex;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
}

.chioseGroup2 .col-auto:nth-child(1) {
    text-align: left;
    white-space: nowrap;
    width: 160px;
}

.chioseGroup2 .col-auto:nth-child(2) {
    white-space: nowrap;
    width: 80px;
}

.chioseGroup2 .col-auto:nth-child(3) {
    white-space: nowrap;
    width: 100px;
}

.chioseGroup3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: column;
}

.chioseGroup3 .col-auto {
    width: 100%;
    position: relative;
    height: 30px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: row;
}

.chioseGroup3 .col-auto .status_black {
    display: inline-block;
    white-space: nowrap !important;
}

.tdSecondIcon {
    display: inline-block;
    right: 40px;
}

.chioseGroup3 .td_img {
    right: 0;
}

.chioseGroup4 {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
}

.chioseGroup4 .col-auto {
    position: relative;
    width: 50%;
}

.chioseGroup4 .col-auto:nth-child(2) {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    flex-direction: column;
}

.chioseGroup2 .td_img,
.chioseGroup3 .td_img,
.chioseGroup4 .td_img,
td a .td_img {
    width: 30px;
    height: auto;
    vertical-align: middle;
    margin-top: -4px;
}

.dt-container td a {
    text-decoration: none;
}

.dt-container td a:hover {
    text-decoration: underline;
}

.table tbody tr.disabled td {
    background-color: #ebebeb !important;
    opacity: 0.9;
}

.table tbody tr.disabled td .status_black {
    opacity: 0.6;
}

.table tbody tr.disabled td .connectedSortable.disabled .style01_btn,
.table tbody tr.disabled td .connectedSortable.disabled .style02_btn,
.table tbody tr.disabled td .connectedSortable.disabled .style03_btn,
.table tbody tr.disabled td .connectedSortable.disabled .style04_btn {
    color: #181818;
    background-color: #dcdcdc;
}

/* end of 流程小豆干 td裡的小圖示 -------------------- */

/* start of 表格裡的圖示按鈕 */
.style_btn_select {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_preview-5da1fa158609bf920bec8514d11e4a10.svg) 0% 50% no-repeat;
}

.style_btn_select:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_preview_white-926ad59d1c3376448011d7345ecc2da2.svg) 0% 50% no-repeat;
}

.style_btn_delect {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_delete-30d8b09071e45f83c2584ad5d30cd610.svg) 0% 50% no-repeat;
}

.style_btn_delect:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_delete_white-b854263af4b1e07da8ef54f0905b4857.svg) 0% 50% no-repeat;
}

.style_btn_edit {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_edit_2-76a52ee6f86090941fc13436fb45cda5.svg) 0% 50% no-repeat;
}

.style_btn_edit:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_edit_2_white-353f72e0758f7d87845ddacb3dbed35c.svg) 0% 50% no-repeat;
}

.style_btn_email {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_email-9af00b45fe1ae8029d63ee23707e4533.svg) 0% 50% no-repeat;
}

.style_btn_email:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_email_white-a7665daa7a5502fc33ffed5fad3caf2d.svg) 0% 50% no-repeat;
}

.style_btn_add {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_add-dd82cd508e08bafc07a349902a722a76.svg) 0% 50% no-repeat;
}

.style_btn_add:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_add_white-d29adc4510e2e0b4ea85650e22ee7f39.svg) 0% 50% no-repeat;
}

.style_btn_upload {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_upload-056a5288db173a07af889dded945cad0.svg) 0% 50% no-repeat;
}

.style_btn_upload:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_upload_white-9ea1c44b516cb535e71333550f60777c.svg) 0% 50% no-repeat;
}

.style_btn_review {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_review-20f1cae1d07b6480462203349e1a9d6a.svg) 0% 50% no-repeat;
}

.style_btn_review:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_review_white-f7ae1e9a2cfbd46e2e3beb9ac2be4534.svg) 0% 50% no-repeat;
}

.style_btn_close {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_close-c085fada5c0581bf36a794de3cc32d35.svg) 0% 50% no-repeat;
}

.style_btn_close:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_close_white-d751165907dc359066514c9a97198033.svg) 0% 50% no-repeat;
}

.style_btn_open {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_open-cfbce3da72a6018775fcc08efcfe89fa.svg) 0% 50% no-repeat;
}

.style_btn_open:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_open_white-c6b1441e79b2dc5d63b8f238282438f0.svg) 0% 50% no-repeat;
}

.style_btn_delete_3 {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_delete_3-c24df16eefaa60d0ce8673fe63b8f6fe.svg) 0% 50% no-repeat;
}

.style_btn_delete_3:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_delete_3_white-62a75e7ab711e3e0ffba816cf363f3fe.svg) 0% 50% no-repeat;
}

.style_btn_record {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_record-695188f6dacac5f98adbc47e175c25bb.svg) 0% 50% no-repeat;
}

.style_btn_record:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_record_white-94791a3faa7a7484e9eb437f40cb9d6e.svg) 0% 50% no-repeat;
}

.style_btn_setting {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_setting-d534dbc2820b3ae05bc6bbdcd16de164.svg) 0% 50% no-repeat;
}

.style_btn_setting:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_setting_white-9b02b678c1f48eb29a723c8d2821d895.svg) 0% 50% no-repeat;
}

.style_btn_lock {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_lock-1ce5943099a6f3466e35d011d510543f.svg) 0% 50% no-repeat;
}

.style_btn_lock:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_lock_white-5ae4fa87a1512d56c65b8122a67744a7.svg) 0% 50% no-repeat;
}

.style_btn_unlock {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_unlock-36518be9ae98346457ce47e21e2088b4.svg) 0% 50% no-repeat;
}

.style_btn_unlock:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_unlock_white-3948370329485295ac604e67557f161b.svg) 0% 50% no-repeat;
}

.style_btn_save {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_save-1e9ebfd933a01cc2fc7ed1f19c03c9be.svg) 0% 50% no-repeat;
}

.style_btn_save:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_save_white-a0fd39b54780a8e02773df84772acb2f.svg) 0% 50% no-repeat;
}

.style_btn_link {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_link-1f1b7f3ea4a3929d78fb29cd7b2e5437.svg) 0% 50% no-repeat;
}

.style_btn_link:hover {
    background: url(/frontweb/skin/assets_ext/extends/img/icon_link_white-ff93941f1e154e016d91fe34022647b8.svg) 0% 50% no-repeat;
}

.iconGroup {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
}

.iconGroup .hide {
    visibility: hidden;
    display: inline-block;
}

.iconGroup button {
    margin: 0 6px 0 0;
}

.iconGroup button:last-child,
.iconGroup a:last-child {
    margin-right: 0;
}

.style_btn_review,
.style_btn_select,
.style_btn_delect,
.style_btn_edit,
.style_btn_email,
.style_btn_add,
.style_btn_upload,
.style_btn_close,
.style_btn_open,
.style_btn_delete_3,
.style_btn_record,
.style_btn_setting,
.style_btn_save,
.style_btn_lock,
.style_btn_unlock,
.style_btn_link {
    background-color: transparent;
    border: none;
    white-space: nowrap;
    width: 26px;
    height: 26px;
    border-radius: 0.375rem;
    background-size: 26px;
    vertical-align: top;
    margin-top: -2px;
}

.style_btn_review:hover,
.style_btn_select:hover,
.style_btn_delect:hover,
.style_btn_edit:hover,
.style_btn_email:hover,
.style_btn_add:hover,
.style_btn_upload:hover,
.style_btn_close:hover,
.style_btn_open:hover,
.style_btn_delete_3:hover,
.style_btn_record:hover,
.style_btn_setting:hover,
.style_btn_save:hover,
.style_btn_lock:hover,
.style_btn_unlock:hover,
.style_btn_link:hover {
    background-color: #000;
    background-size: 26px;
}

/* end of 表格裡的圖示按鈕 -------------------- */

/* start of 永遠置下 */
.bottom_space {
    display: block;
    width: 100%;
    height: 35px;
}

.btnfixed-bottom {
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 2px 10px 0 rgba(100, 100, 100, 0.3);
    height: 70px;

    position: fixed;
    left: 0;
    bottom: 0;
    right: 100px !important;
    z-index: 1010;

    margin-left: 260px;
    margin-right: 20px;
    width: calc(100% - 240px - 40px) !important;
}

.btnfixed-bottom button {
    margin-top: 20px;
}

/* end of 永遠置下 -------------------- */

/* start of 報告矩陣 */
.nameGroup span {
    margin-right: 5px;
}

.nameGroup span:last-child {
    margin-right: 0;
}

.title_s {
    color: var(--funcbar-color);
    font-size: var(--font-size-lg);
    font-weight: 700;
    padding: 3px 0;
    border-bottom: 3px solid var(--funcbar-color);
    margin-bottom: 1px;
}

.matrix_expo {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

.result_notice button[disabled] {
    background-color: transparent !important;
}

.result_notice button[disabled]:hover {
    filter: invert(100%) !important;
}

@media (max-width: 1400px) {
    .matrix_expo .matrix_doc {
        margin-bottom: 10px;
    }

    .matrix_expo .matrix_icon {
        margin-bottom: 10px;
    }
}

@media (max-width: 768px) {
    .matrix_expo .result_notice {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-content: flex-start;
    }
}

.matrix_expo a,
td a {
    text-decoration: none;
}

.matrix_expo a:hover,
td a:hover {
    text-decoration: underline;
}

.td_color_project {
    font-size: 1.8rem !important;
    background-color: #e1ecf7 !important;
}

.td_color_th {
    font-family: '微軟正黑體', sans-serif;
    color: #000;
    font-weight: 600;
    background-color: #e1ecf7 !important;
}

.td_color_1 {
    background-color: #f8fbfd !important;
}

.td_color_gray {
    background-color: #f3f4f6 !important;
}

.matrix_1 {
    background-color: #c5d9ec !important;
}

.matrix_1_light {
    background-color: #eff6fd !important;

    white-space: nowrap !important;
}

.matrix_2 {
    background-color: #e1d2e9 !important;
}

.matrix_2_light {
    background-color: #fcf6ff !important;

    white-space: nowrap !important;
}

.iconGroup .td_img {
    padding-top: 3px;
    width: 26px;
    height: auto;
    vertical-align: middle !important;
}

.matrix_1_light .td_img,
.matrix_2_light .td_img {
    width: 30px;
    height: auto;
    vertical-align: middle !important;
}

.matrix_td_normal {
    width: 60px;
}

.icon_black {
    filter: saturate(200%) grayscale(100%) contrast(0%);
}


/*團隊成員*/
.mud-chip {
    border: none;
    cursor: default;
    display: inline-flex;
    outline: 0;
    padding: 0 20px 0 14px;
    position: relative;
    box-sizing: border-box;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    align-items: center;
    white-space: nowrap;
    vertical-align: middle;
    justify-content: center;
    text-decoration: none;
    line-height: normal;
    margin: 4px;
    height: 31px;
    font-size: 1.4rem;
    border-radius: 16px;
    color: #fff;
    background-color: #08a0c1;
}

.mud-chip-red {
    background-color: #e01b0c;
}

.mud-chip-content {
    align-items: center;
    justify-content: space-between;
    display: inline-flex;
    height: 100%;
    max-width: 100%;
    user-select: none;
}

@media only all and (max-width: 1280px) {
    .chioseGroup {
        width: 150px;
    }
}

.mud-chip:hover {
    background-color: #000;
}


.mud-icon-button {
    color: inherit;
    border: 0;
    cursor: pointer;
    margin: 0;
    display: inline-flex;
    outline: 0;
    padding: 0;
    position: relative;
    align-items: center;
    user-select: none;
    border-radius: 0;
    vertical-align: middle;
    -moz-appearance: none;
    justify-content: center;
    text-decoration: none;
    background-color: rgba(0, 0, 0, 0);
    flex: 0 0 auto;
    padding: 12px;
    overflow: visible;
    font-size: 3rem !important;
    text-align: center;
    border-radius: 50%;
    color: #000;
    padding: 1px;
    margin-right: -14px;
    margin-left: 6px;
    margin-top: 1px;
    height: 18px;
    width: 18px;

}


.chioseGroup {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between !important;
    align-items: flex-start !important
}

.chioseGroup .col-auto:nth-child(1) {
    width: calc(100% - 60px);
    text-align: left;
}


.chioseGroup .col-auto:nth-child(2) {
    width: 60px;
    text-align: right;
    padding-top: 4px;
}

.text-top {
    vertical-align: top !important;
}

.chioseGroup a {
    text-decoration: none !important;
    color: #fff;
    font-weight: normal;
}

.mt-n1 {
    margin-top: -6px;
}


/* end of 報告矩陣 -------------------- */

/* start of [G102] */
td.child {
    padding: 0 !important;
}

.child .table {
    margin-bottom: 0;
    border: 2px solid #cadaeb;
}

.child .table td:nth-child(n) {
    border: 1px solid #767676;
    background-color: #e1ecf7;
}

.child .table td:nth-child(2n) {
    background-color: #fff;
}

table.dataTable.dtr-column > tbody > tr.dtr-expanded td.dtr-control:before,
table.dataTable.dtr-column > tbody > tr.dtr-expanded th.dtr-control:before,
table.dataTable.dtr-column > tbody > tr.dtr-expanded td.control:before,
table.dataTable.dtr-column > tbody > tr.dtr-expanded th.control:before {
    border-top: 10px solid rgba(180, 80, 172, 1);
}

table.dataTable.dtr-column > tbody > tr > td.dtr-control:before,
table.dataTable.dtr-column > tbody > tr > th.dtr-control:before,
table.dataTable.dtr-column > tbody > tr > td.control:before,
table.dataTable.dtr-column > tbody > tr > th.control:before {
    border-left: 10px solid rgba(180, 80, 172, 1);
}

/* end of 報告矩陣 -------------------- */

/* start of [G104] [G105]  */
.inno-container.mt-radio-list > .inno-container.mt-radio-list {
    margin-left: 41px;
    width: calc(100% - 41px);
}

.aa-tbody.table-bordered > .aa-tr.grid {
    border: 1px solid #767676;
    border-bottom: none;
}

.aa-tbody.table-bordered > .aa-tr.grid:last-child {
    border-bottom: 1px solid #767676;
}

.aa-tbody.table-bordered > .aa-tr.grid .tf-label {
    background-color: #f3f4f6;
    border-right: 1px solid #767676;
}

.inno-container.mt-radio-list > .inno-container.mt-radio-list .mt-checkbox-inline .mt-checkbox,
.inno-container.mt-radio-list > .inno-container.mt-radio-list .mt-checkbox-inline .mt-radio,
.inno-container.mt-radio-list > .inno-container.mt-radio-list .mt-radio-inline .mt-checkbox,
.inno-container.mt-radio-list > .inno-container.mt-radio-list .mt-radio-inline .mt-radio {
    display: inline-block;
    margin-right: 5px;
}

@media (max-width: 982px) {
    .aa-tbody.table-bordered > .aa-tr.grid .tf-label {
        background-color: #fff;
        border-right: 1px solid #fff;
    }

    .aa-tbody.table-bordered > .aa-tr.grid > .tf-label {
        background-color: #f3f4f6;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #767676;
        padding-bottom: 5px;
    }

    .inno-container.mt-radio-list > .inno-container.mt-radio-list {
        background-color: #f3f4f6;
        background-color: #fff;
        padding: 10px 20px;
        margin-left: 41px;
        width: calc(100% - 41px);
    }
}

/* end of 報告矩陣 -------------------- */

/* start of 儀錶板行事曆 */
.popper,
.tooltip {
    position: absolute;
    z-index: 9999;
    background: #2c3e50;
    color: black;
    width: 150px;
    border-radius: 3px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    padding: 10px;
    text-align: center;
}

.style5 .tooltip {
    background: #1E252B;
    color: #FFFFFF;
    max-width: 200px;
    width: auto;
    font-size: .8rem;
    padding: .5em 1em;
}

.popper .popper__arrow,
.tooltip .tooltip-arrow {
    width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    margin: 5px;
}

.tooltip .tooltip-arrow,
.popper .popper__arrow {
    border-color: #2c3e50;
}

.style5 .tooltip .tooltip-arrow {
    border-color: #1E252B;
}

.popper[x-placement^="top"],
.tooltip[x-placement^="top"] {
    margin-bottom: 5px;
}

.popper[x-placement^="top"] .popper__arrow,
.tooltip[x-placement^="top"] .tooltip-arrow {
    border-width: 5px 5px 0 5px;
    border-left-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    bottom: -5px;
    left: calc(50% - 5px);
    margin-top: 0;
    margin-bottom: 0;
}

.popper[x-placement^="bottom"],
.tooltip[x-placement^="bottom"] {
    margin-top: 5px;
}

.tooltip[x-placement^="bottom"] .tooltip-arrow,
.popper[x-placement^="bottom"] .popper__arrow {
    border-width: 0 5px 5px 5px;
    border-left-color: transparent;
    border-right-color: transparent;
    border-top-color: transparent;
    top: -5px;
    left: calc(50% - 5px);
    margin-top: 0;
    margin-bottom: 0;
}

.tooltip[x-placement^="right"],
.popper[x-placement^="right"] {
    margin-left: 5px;
}

.popper[x-placement^="right"] .popper__arrow,
.tooltip[x-placement^="right"] .tooltip-arrow {
    border-width: 5px 5px 5px 0;
    border-left-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
    left: -5px;
    top: calc(50% - 5px);
    margin-left: 0;
    margin-right: 0;
}

.popper[x-placement^="left"],
.tooltip[x-placement^="left"] {
    margin-right: 5px;
}

.popper[x-placement^="left"] .popper__arrow,
.tooltip[x-placement^="left"] .tooltip-arrow {
    border-width: 5px 0 5px 5px;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    right: -5px;
    top: calc(50% - 5px);
    margin-left: 0;
    margin-right: 0;
}

/* end of 儀錶板行事曆 */

/* start of overriding assets_ext/extends/css/tf-flexform.css -------------------- */
.mt-checkbox.mt-checkbox-outline:hover > input:not([disabled]):checked ~ span,
.mt-checkbox.mt-checkbox-outline:hover > input:not([disabled]) ~ span,
.mt-checkbox.mt-checkbox-outline > input:checked ~ span,
.mt-checkbox.mt-checkbox-outline > input:focus ~ span,
.mt-checkbox.mt-checkbox-outline > span,
.mt-radio.mt-checkbox-outline:hover > input:not([disabled]):checked ~ span,
.mt-radio.mt-checkbox-outline:hover > input:not([disabled]) ~ span,
.mt-radio.mt-checkbox-outline > input:checked ~ span,
.mt-radio.mt-checkbox-outline > input:focus ~ span,
.mt-radio.mt-checkbox-outline > span {
    border-radius: 4px;
}

select.tf-control {
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: var(--bs-form-select-bg-img);
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
}
/* end of of overriding assets_ext/extends/css/tf-flexform.css -------------------- */

/* start of  table td popover -------------------- */
:root {
    --bs-border-color-translucent: rgba(0, 0, 0, 1);
}

.popover {
    font-size: 1.6rem;
}

.popover-body {
    padding: 10px;
}

.popover-custom-content a {
    color: #1b1b1b;
    font-weight: 400;
    text-decoration: none !important;
}

.popover-custom-content a:hover {
    color: #f25702;
    text-decoration: underline !important;
}

.popover-custom-content h6 {
    color: #1b1b1b;
    font-weight: 400;
}

.popover-custom-content ul {
    margin-bottom: 0;

}

.popover-custom-content ul li a {
    display: inline-block;
    margin-left: -6px;
    width: calc(100% + 6px);
}
/* end of  table td popover -------------------- */
/* start of CIRB -------------------- */
.table_CIRB .tf-label {
    width: 130px;
    white-space: nowrap;
}

.table_CIRB .aa-tr.grid .aa-td {
    padding: 0px 0 15px 0;
}

.table_CIRB .aa-tr.grid .aa-td.col-md-2:first-child {
    margin-left: -30px;
}

.table_CIRB .aa-tr.grid .aa-td.col-md-2:nth-child(3n) {
    margin-left: 30px !important;
    padding-right: 50px !important;
}

.table_CIRB .aa-tr.grid .aa-td.col-md-4 {
    width: calc(50% - 130px);
    padding-right: 0;
}

.table_CIRB .aa-tr.grid .aa-td .form-control {
    height: 70px;
}

.table_CIRB table.dataTable tr.heading > th {
    background: #79858b !important;
    color: #fff;
}

.table_CIRB table.dataTable th,
.table_CIRB table.dataTable td {
    border: 1px solid #e5e5e5 !important;
    padding: 8px 5px;
}

@media (max-width: 992px) {
    .table_CIRB .tf-label {
        width: 100%;
    }

    .table_CIRB .aa-tr.grid .aa-td.col-md-2:first-child {
        margin-left: 0px;
    }

    .table_CIRB .aa-tr.grid .aa-td.col-md-2:nth-child(3n) {
        margin-left: 0px !important;
        padding-right: 0px !important;
    }

    .table_CIRB .aa-tr.grid .aa-td.col-md-4 {
        width: 100%;
    }

    .table_CIRB .aa-tr.grid .aa-td .form-control {
        height: auto;
    }
}

.login_card .title_box .aa-table {
    margin-bottom: 0;
}

.nav-link {
    font-weight: 600;
}
/* end of CIRB -------------------- */