body,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
button,
input,
select,
optgroup,
textarea {
   font-family: "Sarabun", serif;
   /* font-size: 16px; */
   font-weight: 500;
}
body,
button,
input,
select,
optgroup,
textarea {
   font-size: 16px;
}

body.page-template-template-page-system-php {
   background-color: #f4f4f4;
}

:root {
   --bs-font-sans-serif: "Sarabun", serif;
   --bs-font-monospace: "Sarabun", serif;
   --bs-body-font-family: var(--bs-font-sans-serif);
}

.sarabun-thin {
   font-family: "Sarabun", serif;
   font-weight: 100;
   font-style: normal;
}

.sarabun-extralight {
   font-family: "Sarabun", serif;
   font-weight: 200;
   font-style: normal;
}

.sarabun-light {
   font-family: "Sarabun", serif;
   font-weight: 300;
   font-style: normal;
}

.sarabun-regular {
   font-family: "Sarabun", serif;
   font-weight: 400;
   font-style: normal;
}

.sarabun-medium {
   font-family: "Sarabun", serif;
   font-weight: 500;
   font-style: normal;
}

.sarabun-semibold {
   font-family: "Sarabun", serif;
   font-weight: 600;
   font-style: normal;
}

.sarabun-bold {
   font-family: "Sarabun", serif;
   font-weight: 700;
   font-style: normal;
}

.sarabun-extrabold {
   font-family: "Sarabun", serif;
   font-weight: 800;
   font-style: normal;
}

.sarabun-thin-italic {
   font-family: "Sarabun", serif;
   font-weight: 100;
   font-style: italic;
}

.sarabun-extralight-italic {
   font-family: "Sarabun", serif;
   font-weight: 200;
   font-style: italic;
}

.sarabun-light-italic {
   font-family: "Sarabun", serif;
   font-weight: 300;
   font-style: italic;
}

.sarabun-regular-italic {
   font-family: "Sarabun", serif;
   font-weight: 400;
   font-style: italic;
}

.sarabun-medium-italic {
   font-family: "Sarabun", serif;
   font-weight: 500;
   font-style: italic;
}

.sarabun-semibold-italic {
   font-family: "Sarabun", serif;
   font-weight: 600;
   font-style: italic;
}

.sarabun-bold-italic {
   font-family: "Sarabun", serif;
   font-weight: 700;
   font-style: italic;
}

.sarabun-extrabold-italic {
   font-family: "Sarabun", serif;
   font-weight: 800;
   font-style: italic;
}

.font_10 {
   font-size: 8px;
}

.font_12 {
   font-size: 10px;
}

.font_14 {
   font-size: 12px;
}

.font_16 {
   font-size: 14px;
}

.font_18 {
   font-size: 16px;
}

.font_20 {
   font-size: 16px;
}

.font_22 {
   font-size: 18px;
}

.font_24 {
   font-size: 20px;
}

.font_28 {
   font-size: 24px;
}

.font_30 {
   font-size: 30px;
}

.font_32 {
   font-size: 28px;
}

.font_34 {
   font-size: 30px;
}

.font_36 {
   font-size: 32px;
}

.prf_box_l {
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0px 7px;
}

.prf_box,
a.prf_box {
   text-decoration: none;
   outline: none;
   color: #1A4970;
   cursor: pointer;
   user-select: none;
}

.dropdown-toggle.prf_box::after {
   content: unset;
}

.prf_box_dropdown {
   box-shadow: 0px 0px 0px 2px #054582;
   border: 0;
   border-radius: 8px;
   overflow: hidden;
   padding: 12px 0;
}

.prf_box_dropdown .dropdown-item {
   color: #1A4970;
   opacity: 0.7;
   transition: .3s;
   font-size: 18px;
   font-weight: 500;
   background-color: #fff;
   padding: 8px 20px;
}

.prf_box_dropdown .dropdown-item:hover {
   opacity: 1;
}

.prf_box_dropdown>li>a:hover {
   background-color: #fff;
}

.dropdown-item.active_temp_pg_1 {
   background-color: #054582;
   color: #fff;
}

.sys_b_logo_img {
   min-width: unset;
   max-width: 40px;
   max-height: 40px;
   background-image: var(--background-logo-mo);
}

.font_100 {
   font-weight: 100;
}

.font_300 {
   font-weight: 300;
}

.font_400 {
   font-weight: 400;
}

.font_500 {
   font-weight: 500;
}

.font_600 {
   font-weight: 600;
}

.font_700 {
   font-weight: 700;
}

.font_800 {
   font-weight: 800;
}

.font_900 {
   font-weight: 900;
}

.bg_center {
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
}

.sys_box_logo {
   display: flex;
   align-items: center;
   justify-content: flex-start;
}

.main-header {
   background-color: #fff;
}

.main-header .logo a {
   text-decoration: none;
   outline: none;
   color: #054582;
}

.main-header .logo {
   width: 260px;
   height: 60px;
   /* box-shadow: -5px 0px 0px 0px #27AAE1 inset; */
   background-color: #fff;
   color: #054582;
   text-decoration: none;
   outline: none;
   transition: .3s;
   font-family: "Sarabun", serif;
   display: flex;
}

.main-sidebar {
   width: 260px;
   padding-top: 60px;
   box-shadow: -5px 0px 0px 0px #27AAE1 inset;
   background-color: #fff;
}

.main-header .navbar {
   min-height: 60px;
   box-shadow: -5px 0px 0px 0px #27AAE1;
}

.content-wrapper {
   /* box-shadow: -5px 0px 0px 0px #27AAE1; */
   transition: .3s;
}

.content-wrapper,
.main-footer,
.main-header .navbar {
   margin-left: 260px;
}

.sys_b_logo_title {
   font-weight: 700;
   font-size: 18px;
}

.prf_name {
   font-size: 18px;
   line-height: 19px;
}

.prf_role {
   font-size: 14px;
   line-height: 15px;
   color: #000;
}

.prf_name,
.prf_role {
   text-overflow: ellipsis;
   overflow: hidden;
   max-width: 160px;
   white-space: nowrap;
   font-weight: 500;
}

.sidebar-menu>li>a {
   padding-left: 20px;
   display: flex;
   align-items: center;
}

img.icon_menu_left {
   /* margin-right: 5px; */
   max-width: 25px;
   max-height: 25px;
}

@media (max-width: 1199px) {
   /* img.icon_menu_left {
      max-width: 25px;
      max-height: 25px;
   } */

   .main-sidebar {
      -webkit-transform: translate(-360px, 0);
      -ms-transform: translate(-360px, 0);
      -o-transform: translate(-360px, 0);
      transform: translate(-360px, 0);
      transition: .3s;
      box-shadow: unset;
   }

   .sidebar-open .main-sidebar {
      width: 100%;
      -webkit-transform: unset;
      -ms-transform: unset;
      -o-transform: unset;
      transform: unset;
   }

   .page-template-template-page-system-php.sidebar-open {
      overflow: hidden;
   }

   .content-wrapper,
   .main-footer {
      margin-left: 0;
   }

   .sidebar-open .content-wrapper,
   .sidebar-open .main-footer {
      margin-left: 100%;
   }

   .main-header .navbar {
      margin: 0;
      display: none;
   }

   .sidebar-open .main-header .logo {
      box-shadow: -5px 0px 0px 0px #27AAE1 inset;
   }

   .main-header .logo {
      /* box-shadow: unset; */
      height: 50px;
      display: flex;
      align-items: center;
      justify-content: space-between;
   }

   .main-header .logo,
   .main-header .navbar {
      width: 100%;
   }

   /* .sys_b_logo_img {
      min-width: unset;
      max-width: 40px;
      max-height: 40px;
      background-image: var(--background-logo-mo);
   } */


   .main-sidebar,
   .left-side {
      padding-top: 50px;
   }
}

.m_bars_open {
   cursor: pointer;
   font-size: 30px;
}

.sidebar-open .m_bars_open:before {
   content: "\f00d";
}

.sidebar-sys-menu {
   font-weight: 500;
   font-size: 16px;
}

.sidebar-sys-menu .treeview-menu>li>a {
   font-weight: 500;
   font-size: 14px;
   padding: 9px 10px 8px;
}

.sidebar-sys-menu a {
   text-decoration: none;
   outline: none;
   color: #1A4970;
   transition: 0.3s;
}

/* .sidebar-sys-menu>li {
   transition: 0.3s;
   background: rgba(43, 100, 179, 0);
}

.sidebar-sys-menu>li.active,
.sidebar-sys-menu>li:hover {
   background: rgb(43, 99, 179);
   background: -moz-linear-gradient(104deg, rgba(43, 99, 179, 1) 0%, rgba(39, 170, 225, 1) 100%);
   background: -webkit-linear-gradient(104deg, rgba(43, 99, 179, 1) 0%, rgba(39, 170, 225, 1) 100%);
   background: linear-gradient(104deg, rgba(43, 99, 179, 1) 0%, rgba(39, 170, 225, 1) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2b63b3", endColorstr="#27aae1", GradientType=1);
} */
.sidebar-sys-menu>li {
   position: relative;
   outline: none;
}

.sidebar-sys-menu>li::after {
   content: "";
   position: absolute;
   inset: 0;
   background: linear-gradient(104deg, rgba(43, 99, 179, 1) 0%, rgba(39, 170, 225, 1) 100%);
   opacity: 0;
   transition: opacity .3s ease-in-out;
   z-index: -1;
}

.sidebar-sys-menu>li.active::after,
.sidebar-sys-menu>li:hover::after,
.sidebar-sys-menu>li:active::after,
.sidebar-sys-menu>li:focus::after {
   opacity: 1;
}

.sidebar-sys-menu li:hover {
   opacity: 0.9;
   color: #fff;
}

.sidebar-sys-menu>li.active:hover {
   opacity: 1;
}

.sidebar-sys-menu>li.active a,
.sidebar-sys-menu>li:hover a,
.sidebar-sys-menu>li:active a,
.sidebar-sys-menu>li:focus a {
   color: #fff;
}

.sidebar-sys-menu .fa-angle-left:before {
   content: "\f0d9";
}

.m_bars_m {
   display: inline-flex;
   align-items: center;
   justify-content: center;
}

.sidebar-menu li>a>.pull-right-container {
   transform: translateY(-50%);
   margin-top: 0;
   right: 20px;
}

.content-wrapper,
.right-side {
   background-color: #F4F4F4;
   z-index: auto;
   /* ! กำหนด index: auto เพราะกด modal แล้วมันซ้อนข้างหลัง modal-backdrop กดอะไรไม่ได้ */
}

.sidebar-sys-menu .treeview-menu {
   background-color: #fff;
   margin: 0 20px;
   color: #000;
   border-radius: 20px;
   padding: 10px 10px 10px 10px;
}

.sidebar-sys-menu>li.treeview.active {
   padding-bottom: 20px;
}

.sidebar-sys-menu>li.active .treeview-menu>li>a {
   color: #1A4970;
   border-radius: 30px;
   background-color: #fff;
   transition: .3s;
}

.sidebar-sys-menu>li.active .treeview-menu>li>a:hover,
.sidebar-sys-menu>li.active .treeview-menu>li.active>a {
   background-color: #C0EAFF;
}

.sidebar-sys-menu .treeview-menu>li {
   margin-bottom: 9px;
}

.sidebar-sys-menu .treeview-menu>li:last-child {
   margin-bottom: 0;
}

.h_title_page {
   font-size: 24px;
   font-weight: 500;
   color: #1A4970;
   display: inline-block;
}

a.bth__add,
button.bth__add {
   text-decoration: none;
   outline: none;
   color: #fff;
   background-color: #054582;
   font-size: 16px;
   font-weight: 500;
   border-radius: 10px;
   padding: 6px 15px 5px;
   display: inline-block;
   min-width: 120px;
   text-align: center;
}

.bth__add .bth_add_icon {
   font-size: 18px;
   margin-right: 10px;
}

a.bth__export,
button.bth__export {
   text-decoration: none;
   outline: none;
   color: #fff;
   background-color: #3CAF47;
   font-size: 16px;
   font-weight: 500;
   border-radius: 25px;
   padding: 5px 15px 4px;
   display: inline-block;
   min-width: 110px;
   text-align: center;
   border: 0;
}

.inp_g_temp_1 {
   display: inline-block;
   position: relative;
}

input.temp_1_inp_dtpk {
   font-size: 14px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 2px #054582 inset;
   outline: none;
   padding: 7px 35px 7px 15px;
   background: url(images/icon_12defdate.png), #fff;
   background-repeat: no-repeat;
   background-size: 24px;
   background-position: right 10px center;
   width: 150px;
}

input.temp_1_inp {
   font-size: 14px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 1px #054582;
   outline: none;
   padding: 7px 15px;
   min-width: 280px;
}

.temp_1_title {
   margin-right: 10px;
   font-size: 14px;
   font-weight: 500;
   color: #000;
}

input.temp_1_inp_daterang {
   font-size: 14px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 2px #054582 inset;
   outline: none;
   padding: 7px 35px 7px 15px;
   background-image: url(images/calendar_asd2135w6x9.png);
   background-position: right 9px center;
   background-size: 25px;
   background-repeat: no-repeat;
   color: #000;
   width: 100%;
}

input.temp_1_inp_daterang::placeholder {
   color: #848484;
}

input.temp_1_inp_single_daterang {
   font-size: 14px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 2px #054582 inset;
   outline: none;
   padding: 7px 35px 7px 15px;
   background-image: url(images/calendar_asd2135w6x9.png);
   background-position: right 9px center;
   background-size: 25px;
   background-repeat: no-repeat;
   color: #000;
   width: 100%;
}

input.temp_1_inp_single_daterang::placeholder {
   color: #848484;
}

input.temp_1_inp_search {
   font-size: 14px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 2px #054582 inset;
   outline: none;
   padding: 7px 35px 7px 15px;
   width: 100%;
}

input.temp_1_inp_search::placeholder {
   color: #848484;
}

.temp_1_inp_btn_search {
   display: inline-flex;
   position: absolute;
   top: 0;
   right: 0;
   z-index: 2;
   height: 100%;
   align-items: center;
   justify-content: center;
   padding: 0 10px;
   border-radius: 50%;
   border: 0;
   cursor: pointer;
   color: #1A4970;
   font-size: 18px;
   background-image: url('images/btn_inp_search.png');
   background-position: 4px center;
   background-repeat: no-repeat;
   background-size: 17px;
   width: 35px;
}

.temp_1_inp_parent_search {
   display: inline-block;
   position: relative;
   min-width: 280px;
}

a.a_unset {
   text-decoration: unset;
   outline: unset;
}

select.temp_1_select {
   font-size: 14px;
   color: #000;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 2px #054582 inset;
   outline: none;
   padding: 7px 35px 7px 15px;
   min-width: 180px;
   -webkit-appearance: none;
   background: url('images/bth_select_1.png'), #fff;
   background-position: right 15px center;
   background-repeat: no-repeat;
   background-size: 16px;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
   max-width: 180px;
}

.temp_1_select_parent_search {
   display: inline-block;
   position: relative;
   min-width: 180px;
   background-color: #fff;
   border-radius: 25px;
}

.temp_1_select_btn_search {
   display: inline-flex;
   position: absolute;
   top: 0;
   right: 0;
   z-index: -2;
   height: 100%;
   align-items: center;
   justify-content: center;
   padding: 0 10px;
   border-radius: 50%;
   border: 0;
   cursor: pointer;
   color: #1A4970;
   font-size: 24px;
}

.table>:not(caption)>*>* {
   background-color: #e8e8e8;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
   /* --bs-table-bg-type: rgb(232, 232, 232); */
   --bs-table-bg-type: #fff;
}

.table-striped>tbody>tr:last-child td {
   border-bottom: unset;
}

/* .table-hover>tbody>tr:hover>* {
   --bs-table-bg-state: rgba(0,0,0,0.05);
} */

.color_cecece,
a.color_cecece,
button.color_cecece {
   color: #cecece;
}

.color_494949,
a.color_494949,
button.color_494949 {
   color: #494949;
}

.color_727272,
a.color_727272,
button.color_727272 {
   color: #727272;
}

.color_27aae1,
a.color_27aae1,
button.color_27aae1 {
   color: #27aae1;
}

.color_7f7f7f,
a.color_7f7f7f,
button.color_7f7f7f {
   color: #7f7f7f;
}

.color_606060,
a.color_606060,
button.color_606060 {
   color: #606060;
}

.color_7a7a7a,
a.color_7a7a7a,
button.color_7a7a7a {
   color: #7a7a7a;
}

.color_3CAF47,
a.color_3CAF47,
button.color_3CAF47 {
   color: #3CAF47;
}

.color_D30000,
a.color_D30000,
button.color_D30000 {
   color: #D30000;
}

.color_DD0000,
a.color_DD0000,
button.color_DD0000 {
   color: #DD0000;
}

.color_1A4970,
a.color_1A4970,
button.color_1A4970 {
   color: #1A4970;
}

.color_0098FF,
a.color_0098FF,
button.color_0098FF {
   color: #0098FF;
}

.color_054582,
a.color_054582,
button.color_054582 {
   color: #054582;
}

.color_898989,
a.color_898989,
button.color_898989 {
   color: #898989;
}

.color_000,
a.color_000,
button.color_000 {
   color: #000;
}

.color_fff,
a.color_fff,
button.color_fff {
   color: #fff;
}

.bg_fff {
   background-color: #fff;
}

.bg_000 {
   background-color: #000;
}


.table_temp_1 thead>tr>th {
   background-color: #054582;
   color: #fff;
   font-weight: 500;
   align-content: center;
}

.table_temp_1 thead>tr>th:first-child {
   border-top-left-radius: 12px;
}

.table_temp_1 thead>tr>th:last-child {
   border-top-right-radius: 12px;
}

.table_temp_1 tbody>tr:last-child>td:first-child {
   border-bottom-left-radius: 20px;
}

.table_temp_1 tbody>tr:last-child>td:last-child {
   border-bottom-right-radius: 20px;
}

.table_temp_2.table>:not(caption)>*>* {
   background-color: #fff;
}

.table_temp_2 thead>tr>th {
   background-color: #e8e8e8 !important;
   color: #1a4970;
}

.table.table_temp_2>thead>tr>th,
.table.table_temp_2>tbody>tr>th,
.table.table_temp_2>tfoot>tr>th,
.table.table_temp_2>thead>tr>td,
.table.table_temp_2>tbody>tr>td,
.table.table_temp_2>tfoot>tr>td {
   border-color: transparent;
   align-content: center;
}

.table_temp_3.table>:not(caption)>*>* {
   background-color: #dbdbdb;
}

.table_temp_3 thead>tr>th {
   background-color: #dbdbdb !important;
   color: #898989;
   font-weight: 500;
}

.table.table_temp_3>thead>tr>th,
.table.table_temp_3>tbody>tr>th,
.table.table_temp_3>tfoot>tr>th,
.table.table_temp_3>thead>tr>td,
.table.table_temp_3>tbody>tr>td,
.table.table_temp_3>tfoot>tr>td {
   border-color: transparent;
   align-content: center;
}

.table.table_temp_3>tbody>tr:nth-of-type(odd)>* {
   --bs-table-bg-type: #dbdbdb;
}

.btn_delete,
a.btn_delete,
button.btn_delete {
   background-color: #D30000;
   color: #fff;
   padding: 3px 4px;
   border-radius: 4px;
   text-decoration: none;
   outline: none;
   display: inline-flex;
   width: 30px;
   height: 30px;
   justify-content: center;
   align-items: center;
}

.btn_view,
a.btn_view,
button.btn_view {
   background-color: #054582;
   color: #fff;
   padding: 3px 4px;
   border-radius: 4px;
   text-decoration: none;
   outline: none;
   display: inline-flex;
   width: 30px;
   height: 30px;
   justify-content: center;
   align-items: center;
}

.btn_edit,
a.btn_edit,
button.btn_edit {
   background-color: #054582;
   color: #fff;
   padding: 4px 6px;
   border-radius: 4px;
   text-decoration: none;
   outline: none;
   display: inline-flex;
   width: 30px;
   height: 30px;
   justify-content: center;
   align-items: center;
}

select.pag_temp_1_select {
   font-size: 20px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   box-shadow: 0px 0px 0px 1px #054582 inset;
   outline: none;
   padding: 3px 30px 3px 13px;
   -webkit-appearance: none;
   background: url(images/bth_select_2.png), #fff;
   background-position: right 15px center;
   background-repeat: no-repeat;
   background-size: 14px;
}

.pag_temp_2_dropdown1 {
   font-size: 20px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   box-shadow: 0px 0px 0px 1px #054582 inset;
   outline: none;
   padding: 3px 35px 3px 13px;
   -webkit-appearance: none;
   background: url(images/bth_select_2.png), #fff;
   background-position: right 10px center;
   background-repeat: no-repeat;
   background-size: 14px;
}

.dropdown-toggle.pag_temp_2_dropdown1::after {
   content: unset;
}

.pag_temp_1_prev,
a.pag_temp_1_prev,
.pag_temp_1_next,
a.pag_temp_1_next {
   display: inline-flex;
   color: #1A4970;
   align-items: center;
   justify-content: center;
   padding: 0 7px;
   font-size: 22px;
   cursor: pointer;
   text-decoration: none;
   outline: none;
}

.pag_temp_1_prev.btn_not_fount,
.pag_temp_1_next.btn_not_fount {
   color: #BFBFBF;
}

.pag_temp_1_curr {
   background-color: #054582;
   color: #fff;
   font-size: 20px;
   padding: 5px 15px;
   border-radius: 10px;
   border: 0;
   user-select: none;
}

.pag_temp_1 {
   display: inline-block;
}

.pag_temp_2 {
   display: inline-block;
}

.pag_temp_2_select {
   font-size: 20px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 15px;
   box-shadow: 0px 0px 0px 1px #054582 inset;
   outline: none;
   padding: 3px 30px 3px 13px;
   -webkit-appearance: none;
   background: url(images/bth_select_2.png), #fff;
   background-position: right 15px center;
   background-repeat: no-repeat;
   background-size: 14px;
   min-width: 91px;
}

.pag_temp_2_dropdown2 {
   font-size: 20px;
   color: #848484;
   font-weight: 500;
   border: 0;
   border-radius: 15px;
   box-shadow: 0px 0px 0px 1px #054582 inset;
   outline: none;
   padding: 3px 35px 3px 13px;
   -webkit-appearance: none;
   background: url(images/bth_select_1.png), #fff;
   background-position: right 10px center;
   background-repeat: no-repeat;
   background-size: 14px;
   min-width: 91px;
}

.dropdown-toggle.pag_temp_2_dropdown2::after {
   content: unset;
}

@media(max-width:767px) {
   .temp_1_inp_parent_search {
      min-width: 100%;
      width: 100%;
   }

   .temp_1_select,
   select.temp_1_select {
      max-width: unset;
      min-width: 100%;
      width: 100%;
   }

   .inp_g_temp_1 {
      width: 100%;
   }
}

.bth__back,
a.bth__back {
   background-color: #054582;
   color: #fff;
   text-decoration: none;
   outline: none;
   font-size: 14px;
   padding: 6px 15px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: 95px;
   text-align: center;
   border: 0;
   border-radius: 25px;
   user-select: none;
}

.bth__del,
a.bth__del {
   background-color: #D30000;
   color: #fff;
   text-decoration: none;
   outline: none;
   font-size: 14px;
   padding: 6px 15px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: 95px;
   text-align: center;
   border: 0;
   border-radius: 25px;
   cursor: pointer;
   user-select: none;
}

.box_temp_1 {
   background-color: #fff;
   border: 0;
   border-radius: 17px;
   padding: 25px 45px 45px;
}

.finp_req {
   color: #FF0000;
}

.finp_g_inp,
input.finp_g_inp,
textarea.finp_g_inp {
   background-color: #E5E5E5;
   color: #000;
   font-size: 18px;
   border: 0;
   border-radius: 10px;
   padding: 9px 15px;
   width: 100%;
   outline: none;
}

.finp_g_inp::placeholder {
   color: #707070;
}

.finp_g_label {
   padding-bottom: 10px;
   font-size: 18px;
}

.finp_g_small {
   padding-bottom: 10px;
   font-size: 12px;
   color: #606060;
}

.btn_clear,
button.btn_clear,
a.btn_clear {
   background-color: #d30000;
   color: #fff;
   outline: none;
   text-decoration: none;
   border: 0;
   border-radius: 5px;
   text-align: center;
   display: inline-block;
   transition: .3s;
   min-width: auto;
   font-size: 14px;
   font-weight: 400;
   padding: 5px 10px;
}

.btn_plus,
button.btn_plus,
a.btn_plus {
   background-color: #054582;
   color: #fff;
   outline: none;
   text-decoration: none;
   border: 0;
   border-radius: 5px;
   text-align: center;
   display: inline-block;
   transition: .3s;
   min-width: auto;
   font-size: 14px;
   font-weight: 400;
   padding: 5px 10px;
}

.btn_cancel,
button.btn_cancel,
a.btn_cancel {
   background-color: #D30000;
   color: #fff;
   outline: none;
   text-decoration: none;
   padding: 15px 20px;
   font-size: 20px;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   text-align: center;
   width: 100%;
   display: inline-block;
}

.btn_def,
button.btn_def,
a.btn_def {
   background-color: #494949;
   color: #fff;
   outline: none;
   text-decoration: none;
   padding: 15px 20px;
   font-size: 20px;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   text-align: center;
   width: 100%;
   display: inline-block;
}

.btn_next,
button.btn_next,
a.btn_next {
   background-color: #054582;
   color: #fff;
   outline: none;
   text-decoration: none;
   padding: 15px 20px;
   font-size: 20px;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   text-align: center;
   width: 100%;
   display: inline-block;
   transition: .3s;
}

.btn_save,
button.btn_save,
a.btn_save {
   background-color: #3CAF47;
   color: #fff;
   outline: none;
   text-decoration: none;
   padding: 15px 20px;
   font-size: 20px;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   text-align: center;
   width: 100%;
   display: inline-block;
}

.btn_login,
button.btn_login,
a.btn_login {
   background-color: #054582;
   color: #fff;
   outline: none;
   text-decoration: none;
   padding: 11px 20px 10px;
   font-size: 16px;
   font-weight: 500;
   border: 0;
   border-radius: 10px;
   text-align: center;
   width: 100%;
   display: inline-block;
}

.box_login .finp_g_inp {
   font-size: 16px;
   padding: 11px 15px 10px;
}

.box_login_temp_inp {
   max-width: 326px;
   margin: auto;
}

@media(min-width:992px) {

   .btn_clear,
   button.btn_clear,
   a.btn_clear {
      min-width: 165px;
      border-radius: 15px;
      padding: 15px 15px 14px;
   }

   .btn_plus,
   button.btn_plus,
   a.btn_plus {
      min-width: 165px;
      border-radius: 15px;
      padding: 15px 15px 14px;
   }

   .btn_cancel,
   button.btn_cancel,
   a.btn_cancel {
      min-width: 200px;
   }

   .btn_def,
   button.btn_def,
   a.btn_def {
      min-width: 200px;
   }

   .btn_next,
   button.btn_next,
   a.btn_next {
      min-width: 200px;
   }

   .btn_save,
   button.btn_save,
   a.btn_save {
      min-width: 200px;
   }

   .btn_login,
   button.btn_login,
   a.btn_login {
      min-width: 200px;
   }
}

@media(min-width:1200px) {

   .btn_cancel,
   button.btn_cancel,
   a.btn_cancel {
      min-width: 300px;
   }

   .btn_def,
   button.btn_def,
   a.btn_def {
      min-width: 300px;
   }

   .btn_next,
   button.btn_next,
   a.btn_next {
      min-width: 300px;
   }

   .btn_save,
   button.btn_save,
   a.btn_save {
      min-width: 300px;
   }

   .btn_login,
   button.btn_login,
   a.btn_login {
      min-width: 300px;
   }
}

.swal2-container .swal2-icon {
   width: 136px;
   height: 136px;
   border: 0;
   border-radius: unset;
   margin: 30px auto 10px;
}

.swal2-container .swal2-popup {
   border-radius: 17px;
}

.swal2-container .swal2-html-container {
   font-size: 22px;
   /* line-height: normal; */
   line-height: unset;
   font-weight: 500;
   padding: 10px;
   margin: 0px;
}

.swal2-container .swal2-actions {
   width: 100%;
   padding: 0 26px;
}

.swal2-container .alert_unconnectCode .swal2-actions {
   width: 100%;
   display: flex !important;
   justify-content: space-between;
}

/* .swal2-container .alert_unconnectCode .swal2-confirm {
   width: 40%;
}
.swal2-container .alert_unconnectCode .swal2-cancel {
   width: 40%;
} */
.swal2-container .alert_unconnectCode .swal2-title {
   padding: .8em 1em;
}

.swal2-popup.alert_unconnectCode {
   padding: 0 0 1.8em;
}

button.swal2-confirm.swal2-styled {
   background-color: #7CD698;
   border-radius: 15px;
   padding: 18px;
   margin: 0;
   font-size: 22px;
   font-weight: 500;
   width: 100%;
   outline: none;
}

button.swal2-cancel.swal2-styled {
   background-color: #7f7f7f;
   border-radius: 15px;
   padding: 18px;
   margin: 0;
   font-size: 22px;
   font-weight: 500;
   width: 100%;
   outline: none;
}

input.finp_g_inp[disabled] {
   background-color: #AFAFAF;
   color: #494949;
}

select.finp_g_inp {
   outline: none;
   -webkit-appearance: none;
   background-image: url('images/icon_select_temp_2.png');
   background-position: right 15px center;
   background-repeat: no-repeat;
   background-size: 10px;
   padding: 9px 30px 9px 15px;
}

.pd_table_pc>thead>tr>th:first-child {
   padding-left: 15px;
}

.pd_table_pc>thead>tr>th:last-child {
   padding-right: 15px;
}

.pd_table_pc>tbody>tr>td:first-child {
   padding-left: 15px;
}

.pd_table_pc>tbody>tr>td:last-child {
   padding-right: 15px;
}

@media(min-width:1200px) {
   .pd_table_pc>thead>tr>th:first-child {
      padding-left: 30px;
   }

   .pd_table_pc>thead>tr>th:last-child {
      padding-right: 30px;
   }

   .pd_table_pc>tbody>tr>td:first-child {
      padding-left: 30px;
   }

   .pd_table_pc>tbody>tr>td:last-child {
      padding-right: 30px;
   }

   .fix_width_td_pc {
      width: 50%;
   }
}

.shw_paren_pass:hover .shw_pass {
   display: inline-block;
}

.shw_pass {
   user-select: none;
   display: none;
}

.shw_pass.active>i:before {
   content: "\f070";
}

.box_login {
   background-color: #fff;
   border-radius: 20px;
   padding: 30px;
   max-width: 500px;
   margin: auto;
}

.btn_forgot_pw,
a.btn_forgot_pw {
   text-decoration: none;
   outline: none;
   color: #054582;
   font-size: 12px;
   font-weight: 500;
}

.box_login_title {
   color: #054582;
   font-weight: 700;
   font-size: 22px;
}

@media(min-width:380px) {
   .box_login_title {
      font-size: 30px;
   }
}

@media(min-width:1200px) {
   .box_login_title {
      font-size: 38px;
   }
}

.alert_danger button.swal2-confirm.swal2-styled {
   background-color: #054582;
}

.pointer {
   cursor: pointer;
}

.def_icon_date {
   background: url('images/icon_12defdate.png'), #E5E5E5;
   background-repeat: no-repeat;
   background-size: 30px;
   background-position: right 10px center;
}

#fileName {
   display: block;
   background-image: url(images/icon_12defimage.png);
   background-size: 30px;
   background-repeat: no-repeat;
   background-position: right 10px center;
   color: #606060;
   word-break: break-all;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
}


@media(min-width:1200px) {
   .min_w_30p {
      min-width: 50%;
   }

   .box_img_pre {
      box-shadow: 1px 0px 1px 0px #E5E5E5;
      /* max-width: 350px; */
      /* min-width: 350px; */
      width: 300px;
   }
}

@media(min-width:1400px) {
   .w-xxl-auto {
      width: auto !important;
   }
}

@media(min-width:1600px) {
   .min_w_30p {
      min-width: 40%;
   }

   .w_33p_1600 {
      width: 33.33333333%;
   }

   .w_66p_1600 {
      width: 66.66666667%;
   }
}

@media(min-width:1800px) {
   .min_w_30p {
      min-width: 30%;
   }

   .w_36p_1800 {
      width: 36.33333333%;
   }
}

#imagePreview img {
   max-height: 350px;
   box-shadow: 0px 0px 3px 0px #e5e5e5;
}

.modal-content {
   border-radius: 17px;
}

.btn_close_modal {
   position: absolute;
   right: 15px;
   top: 15px;
   background-color: transparent;
   border: 0;
   font-size: 25px;
   padding: 0;
   margin: 0;
   display: flex;
   width: 30px;
   height: 30px;
   align-items: center;
   justify-content: center;
}

.min_width_100p {
   min-width: 100% !important;
}

.txt_line_1 {
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
}

.text_line_1 {
   -webkit-line-clamp: 1;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.text_line_2 {
   -webkit-line-clamp: 2;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.text_line_3 {
   -webkit-line-clamp: 3;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.text_line_4 {
   -webkit-line-clamp: 4;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.text_line_5 {
   -webkit-line-clamp: 5;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.chk_listmed {
   cursor: pointer;
}

.chk_listmed.active .chk_boxmed i::before {
   color: #054582;
   font-weight: 900;
}

.scroll_table_left {
   max-height: 62vh;
}

.scroll_table_right {
   max-height: 67vh;
   border-radius: 17px;
   border-top-right-radius: 40px;
}

.scroll_table_left::-webkit-scrollbar,
.scroll_table_right::-webkit-scrollbar {
   width: 10px;
   height: 10px;
}

.scroll_table_left::-webkit-scrollbar-track,
.scroll_table_right::-webkit-scrollbar-track {
   box-shadow: inset 0 0 6px #f4f4f4;
   /* background-color: #f4f4f4; */
}

.scroll_table_left::-webkit-scrollbar-thumb,
.scroll_table_right::-webkit-scrollbar-thumb {
   background-color: #3874a5;
   -webkit-border-radius: 50px;
   -moz-border-radius: 50px;
   border-radius: 50px;
}

.scroll_tb tr.chk_listmed.active td {
   /* background-color: #cce8ff; */
   --bs-table-bg-type: #cce8ff;
}

.del_setMedlist_mt {
   color: #d30000;
   font-size: 12px;
   display: inline-block;
   cursor: pointer;
}

.del_boxmed {
   display: inline-block;
   color: #d30000;
   cursor: pointer;
}

button.btn_disabled {
   background-color: #cccccc;
   color: #898989;
}

.select2_temp_1 select {
   opacity: 0;
}

.select2_temp_1 .select2 {
   width: 100% !important; /* กำหนด 100% เพราะช่องค้นหา ชุดสื่อ หน้าHome มีขนาดเกินขอบ */
   min-width: -webkit-fill-available;
}

.select2_temp_1 .select2-container--default .select2-results__option i {
   margin-right: 10px;
}


.select2_temp_1 .select2-container--default .select2-selection--single {
   background-color: #e5e5e5;
   border: 0;
   min-height: 45px;
   border-radius: 10px;
}

.select2_temp_1 .select2-container--default .select2-selection--single .select2-selection__rendered {
   /* padding: 6px 15px 6px 6px; */
   padding: 6px 15px 6px 0px;
}

.select2_temp_1 .select2-container--default .select2-selection--single,
.select2_temp_1 .select2-selection .select2-selection--single {
   /* padding: 6px 12px 6px 6px; */

   /* system/?action=setmedia-add */
   padding: 6px 12px;
}

.select2_temp_1 .select2-container--default .select2-selection--single .select2-selection__arrow {
   position: absolute;
   right: 13px;
   top: 50%;
   transform: translateY(-50%);
   background-image: url(images/icon_select_temp_2.png);
   background-position: center;
   background-repeat: no-repeat;
   background-size: 10px;
   width: 15px;
}

.select2_temp_1 .select2-container--default .select2-selection--single .select2-selection__arrow b {
   display: none;
}

.custom-temp_Select2 .select2-dropdown {
   background-color: #e5e5e5;
   border: 0;
}

.custom-temp_Select2.select2-container--default .select2-results__option[aria-selected=true] {
   background-color: #ccc;
   color: #000;
}

.select2_temp_1 .custom-temp_Select2.select2-container--default .select2-selection--single,
.select2_temp_1 .custom-temp_Select2 .select2-selection .select2-selection--single {
   padding: 6px 12px;
}

.select2-results__options {
   border-radius: 12px;
}

.datepickers-container {
   /* แก้ปัญหา datepickers อยู่ใน modal แล้วกด datepickers มันไปอยู่ข้างหลัง modal */
   z-index: 1055;
}

.select2_temp_1.v_temp_2 .select2-container--default .select2-selection--single {
   border-radius: 50px;
   min-height: 40px;
   background: linear-gradient(#ffffff 50%, #ffffff 100%) padding-box, linear-gradient(90deg, rgba(43, 99, 179, 1) 0%, rgba(39, 170, 225, 1) 100%) border-box;
   border: 3px solid transparent;
}

.select2_temp_1.v_temp_2 .select2-container--default .select2-selection--single .select2-selection__rendered {
   line-height: 18px;
   color: #054582;
}

.custom-temp_Select3 .select2-dropdown {
   background-color: transparent;
   border: 0;
   color: #054582;
   border-radius: 12px;
}

.custom-temp_search .select2-dropdown {
   background-color: #fff;
}

.custom-temp_search .select2-search__field {
   border-radius: 15px;
   padding-left: 15px;
}

.custom-temp_search .select2-results__options {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
}

.custom-temp_search .select2-results__option:first-child {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
}

.custom-temp_Select3.select2-container--default .select2-results__option[aria-selected=true] {
   background-color: #ccc;
   color: #000;
}

.custom-temp_Select3.select2-container--default i {
   color: #054582;
}

.select2-container--default .select2-results__option[aria-selected=true]:hover {
   color: #fff;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
   background-color: #054582;
}

.custom-temp_Select3.select2-container--default .select2-results__option--highlighted[aria-selected] {
   background-color: #054582;
   color: #fff;
}

.custom-temp_Select3.select2-container--default .select2-results__option--highlighted[aria-selected] i {
   color: #fff;
}

.custom-temp_Select3.select2-container--default .select2-results__option--highlighted[aria-selected] .text-date-end {
   color: #ffd4d4;
}

.select2-results__option {
   background-color: #fff;
}

.select2-results__option:first-child {
   border-top-left-radius: 12px;
   border-top-right-radius: 12px;
}

.select2-results__option:last-child {
   border-bottom-left-radius: 12px;
   border-bottom-right-radius: 12px;
}

.temp_1_select2+.select2-container--default .select2-selection--single {
   font-size: 14px;
   color: #000;
   font-weight: 500;
   border: 0;
   border-radius: 25px;
   box-shadow: 0px 0px 0px 2px #054582 inset;
   outline: none;
   /* padding: 7px 35px 7px 15px; */
   -webkit-appearance: none;
   background: url(images/bth_select_1.png), #fff;
   background-position: right 15px center;
   background-repeat: no-repeat;
   background-size: 16px;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
   min-height: 35px;
   /* min-width: 200px;
   max-width: 250px; */
}

.temp_1_select2 {
   opacity: 0;
   width: 200px;
}

.temp_1_select2+.select2-container--default .select2-selection--single .select2-selection__arrow {
   display: none;
}

.temp_1_select2+.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.temp_1_select2+.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
   border-top-left-radius: 15px;
   border-top-right-radius: 15px;
}

.temp_1_select2+.select2-container--default .select2-selection--single .select2-selection__clear {
   margin-right: 10px;
}

.custom_temp_1_select2 .select2-dropdown {
   border: 2px solid #054582;
   border-top: 0;
   /* min-width: 200px;
   max-width: 250px; */
}

.custom_temp_1_select2 .select2-results__options {
   border-radius: 0;
}

.custom_temp_1_select2 .select2-results__option:first-child {
   border-radius: 0;
}

.custom_temp_1_select2 .select2-results__option:last-child {
   border-radius: 0;
}

/* .select2-results {
   box-shadow: 0px 0px 2px 0px #e5e5e5;
} */
.select2-container--default .select2-results>.select2-results__options {
   box-shadow: 0px 0px 2px 0px #e5e5e5;
}

.max_wid573 {
   max-width: 573px;
}

.modal_h .modal-title {
   margin-top: 17px;
}

.modal_h {
   padding-bottom: 5px;
}

.col_menu_left {
   width: 40px;
   padding-right: 10px;
   text-align: center;
}

.unconnect_code {
   font-size: 11px;
   padding: 5px 16px 4px;
}

.bg_hm_about {
   background-repeat: no-repeat;
   background-size: cover;
   background-position: left;
}

.max_wid1920px {
   max-width: 1920px;
}

.fadein_after_img {
   opacity: 0;
   transition: opacity 0.3s ease-in-out;
}

.cus_size_m,
.cus_size_m .dropdown-menu,
.cus_size_m button {
   font-weight: 700;
   color: #054582;
}

.cus_size_m button.choose-page-custom {
   border: 0;
   box-shadow: 0px 0px 2px 1px #a5a5a5;
}

.cus_size_m .dropdown-menu {
   box-shadow: 0px 0px 1px 1px #a5a5a5;
   overflow: hidden;
}

.nav_page_d.dropdown-menu {
   max-height: 53vh;
   overflow: auto;
}

/* .loadingoverlay {
   background: linear-gradient(104deg, rgba(43, 100, 179, 0.3) 0%, rgba(39, 170, 225, 0.3) 100%) !important;
}

.loadingoverlay svg, .loadingoverlay circle {
   fill: #fff !important;
} */

.md_overlay_load {
   display: flex;
   width: 100%;
   height: 100%;
   align-items: center;
   justify-content: center;
   color: #cccccc;
   font-size: 60px;
   position: absolute;
   z-index: -1;
}

.md_overlay_load i {
   animation: spin 2s linear infinite;
}

@keyframes spin {
   from {
      transform: rotate(0deg);
   }

   to {
      transform: rotate(360deg);
   }
}

@media(min-width:576px) {

   .view-content {
      font-size: 14px;
   }
}

@media(min-width:768px) {

   .cus_size_m button.choose-page-custom {
      min-width: 68px;
   }

   .cus_size_m,
   .cus_size_m .dropdown-menu,
   .cus_size_m button {
      font-size: 24px;
   }

   .cus_size_m .border-pagination,
   .cus_size_m a.border-pagination {
      width: 50px;
      height: 50px;
      font-size: 24px;
   }

   .cus_size_m .dropdown-page {
      padding-right: 30px !important;
      padding-left: 30px !important;
   }

   input.temp_1_inp_single_daterang {
      width: 150px;
   }

   input.temp_1_inp_daterang {
      width: auto;
   }

   .temp_1_select2+.select2-container--default .select2-selection--single {
      min-width: 200px;
      max-width: 250px;
   }

   .custom_temp_1_select2 .select2-dropdown {
      min-width: 200px;
      max-width: 250px;
   }
}

@media(min-width:992px) {
   .bg_hm_about {
      background-position: center;
   }

   .max_lg_wid357px {
      max-width: 357px;
   }
}

@media(min-width:1200px) {

   .view-content {
      font-size: 16px;
   }

   .box_sha_nav {
      /* box-shadow: -5px 0px 0px 0px #27AAE1; ปิดไว้เพราะขนาด 4k มันโหล่ออกมาด้านล่าง*/ 
   }

   .font_10 {
      font-size: 9px;
   }

   .font_12 {
      font-size: 11px;
   }

   .font_14 {
      font-size: 13px;
   }

   .font_16 {
      font-size: 15px;
   }

   .font_18 {
      font-size: 17px;
   }

   .font_20 {
      font-size: 18px;
   }

   .font_22 {
      font-size: 20px;
   }

   .font_24 {
      font-size: 22px;
   }

   .font_28 {
      font-size: 26px;
   }

   .font_30 {
      font-size: 30px;
   }

   .font_32 {
      font-size: 30px;
   }

   .font_34 {
      font-size: 32px;
   }

   .font_36 {
      font-size: 34px;
   }

   img.icon_menu_left {
      /* margin-right: 10px; */
      max-width: 30px;
      max-height: 30px;
   }

   .min_xl_wid204px,
   button.min_xl_wid204px,
   a.min_xl_wid204px {
      min-width: 204px;
   }

   .min_xl_wid343px,
   button.min_xl_wid343px,
   a.min_xl_wid343px {
      min-width: 343px;
   }

   .max_xl_wid500px {
      max-width: 500px;
   }
}

@media(min-width:1400px) {
   .h_title_page {
      font-size: 26px;
   }

   .box_login.box_login_user {
      min-height: unset;
      max-width: 600px;
      padding: 30px 50px;
   }

   .min_xxxl_wid240px {
      min-width: 240px;
   }
}

@media(min-width:1600px) {
   .h_title_page {
      font-size: 28px;
   }
}

@media(min-width:1800px) {
   .font_10 {
      font-size: 10px;
   }

   .font_12 {
      font-size: 12px;
   }

   .font_14 {
      font-size: 14px;
   }

   .font_16 {
      font-size: 16px;
   }

   .font_18 {
      font-size: 18px;
   }

   .font_20 {
      font-size: 20px;
   }

   .font_22 {
      font-size: 22px;
   }

   .font_24 {
      font-size: 24px;
   }

   .font_28 {
      font-size: 28px;
   }

   .font_30 {
      font-size: 30px;
   }

   .font_32 {
      font-size: 32px;
   }

   .font_34 {
      font-size: 34px;
   }

   .font_36 {
      font-size: 36px;
   }

   .h_title_page {
      font-size: 30px;
   }

   .content-wrapper,
   .main-footer,
   .main-header .navbar {
      margin-left: 360px;
   }

   .main-header .logo {
      width: 360px;
   }

   .main-sidebar {
      width: 360px;
   }

   .sys_b_logo_img {
      min-width: 78px;
      max-width: 80px;
      max-height: 80px;
   }

   .sys_b_logo_title {
      font-size: 24px;
   }

   .main-header .navbar {
      min-height: 90px;
   }

   .main-header .logo {
      height: 90px;
   }

   .main-sidebar {
      padding-top: 90px;
      padding-bottom: 90px;
   }

   .prf_name {
      font-size: 20px;
      line-height: 21px;
   }

   .prf_role {
      font-size: 16px;
      line-height: 17px;
   }

   .sidebar-sys-menu,
   .sidebar-sys-menu .treeview-menu>li>a {
      font-size: 22px;
   }

   .sidebar-sys-menu .treeview-menu>li>a img.icon_menu_left {
      /* margin-right: 15px; */
      max-width: 42px;
      max-height: 42px;
   }

   img.icon_menu_left {
      /* margin-right: 24px; */
      max-width: 36px;
      max-height: 38px;
   }

   .sidebar-menu>li>a {
      min-height: 77px;
   }

   .table_temp_1 thead>tr>th {
      padding-top: 18px;
      padding-bottom: 17px;
   }

   .table>:not(caption)>*>* {
      /* padding-top: 15px;
      padding-bottom: 14px; */
      padding-top: 13px;
      padding-bottom: 12px;
   }

   .modal .btn_cancel,
   .modal button.btn_cancel,
   .modal a.btn_cancel {
      padding: 21px 20px 21px;
      border-radius: 15px;
   }

   .modal .btn_def,
   .modal button.btn_def,
   .modal a.btn_def {
      padding: 21px 20px 21px;
      border-radius: 15px;
   }

   .modal .btn_next,
   .modal button.btn_next,
   .modal a.btn_next {
      padding: 21px 20px 21px;
      border-radius: 15px;
   }

   .modal .btn_save,
   .modal button.btn_save,
   .modal a.btn_save {
      padding: 21px 20px 21px;
      border-radius: 15px;
   }

   .modal .btn_login,
   .modal button.btn_login,
   .modal a.btn_login {
      border-radius: 15px;
   }


   .col_menu_left {
      width: 60px;
   }

   .col_menu_right {
      padding-left: 7px;
   }

   td.pl_xxxl_67px,
   th.pl_xxxl_67px {
      padding-left: 67px;
   }

   .temp_modal_inp .finp_g_inp,
   .temp_modal_inp input.finp_g_inp,
   .temp_modal_inp textarea.finp_g_inp {
      font-size: 22px;
      padding: 20px 15px;
      border-radius: 15px;
   }

   .temp_modal_inp .def_icon_date {
      background-size: 40px;
   }

   button.min_xxxl_wid345px,
   a.min_xxxl_wid345px {
      min-width: 345px;
   }

   .swal2-popup {
      width: 572px !important;
   }

   .swal2-actions {
      margin-top: 15px;
   }

   .box_login {
      min-height: 552px;
   }

   .min_xxl_wid_475px {
      min-width: 475px;
   }

   .padd_xxl_20px,
   button.padd_xxl_20px,
   a.padd_xxl_20px {
      padding: 20px;
   }

   .select2_temp_1.padd_xxl_pc .select2-container--default .select2-selection--single .select2-selection__rendered {
      padding: 16px 15px 16px 0px;
   }

   .select2_temp_1.padd_xxl_pc .select2-container--default .select2-selection--single {
      min-height: 60px;
   }

   .finp_g_inp.padd_xxl_pc,
   input.finp_g_inp.padd_xxl_pc,
   textarea.finp_g_inp.padd_xxl_pc {
      padding: 16px 15px 17px;
   }

   select.finp_g_inp.padd_xxl_pc {
      padding: 16px 30px 17px 15px;
   }

   .min_xxxl_wid204px,
   button.min_xxxl_wid204px,
   a.min_xxxl_wid204px {
      min-width: 204px;
   }

   .temp_1_title {
      /* system/?action=users-list */
      font-size: 16px;
   }

   .max_xxxl_wid1620px {
      max-width: 1620px;
   }

   .max_xxxl_wid1920px {
      max-width: 1920px;
   }

   .max_xxxl_wid1258px {
      max-width: 1258px;
   }

   .min_xxl_wid180px {
      min-width: 180px;
   }

   .font_xxxl_22 {
      font-size: 22px;
   }

   .text-view-content {
      min-width: 188px;
   }

   .row-cols-xxxl-6>* {
      flex: 0 0 auto;
      width: 16.66666667%;
   }
}