@charset "UTF-8";

.w200 {
    width: 200px;
}

.text-break {
  word-break: break-all !important;
}

.text-highlight {
  color: #E85514 !important;
}

.text-be-primary {
  color: #0065FD;
}

.text-gray {
  color: #545454;
}

.text-gray-light {
  color: #a0a0a0;
}

.font-base {
  font-size: 1rem;
}

.font-sm {
  font-size: 0.875rem !important;
}

.font-lg {
  font-size: 1.125rem !important;
}

.font-xl {
  font-size: 1.25rem !important;
}

.font-xxl {
  font-size: 1.5rem !important;
}

.font-extra {
  font-size: 2rem !important;
}

.link-underline {
  text-decoration: underline;
}

.btn-primary {
  --bs-btn-hover-bg: #354D6B;
}

.btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: rgba(156, 154, 154, 0.6);
  --bs-btn-hover-border-color: rgba(156, 154, 154, 0.1);
}

.btn-info {
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
}

.btn-body-secondary {
  --bs-btn-color: #3B4148;
  --bs-btn-border-color: #FFAD17;
  --bs-btn-border-width: 2px;
  --bs-btn-bg: transparent;
  --bs-btn-hover-border-color: #FFAD17;
  --bs-btn-hover-color: #FFAD17;
  --bs-btn-hover-bg: transparent;
  --bs-btn-active-color: #FFAD17;
  --bs-btn-active-bg: transparent;
  --bs-btn-active-border-color: #FFAD17;
  width: 208px;
}

.btn-outline-white {
  --bs-btn-color: #fff;
  --bs-btn-border-color: #fff;
  --bs-btn-bg: transparent;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-hover-color: #3B4148;
  --bs-btn-hover-bg: transparent;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: transparent;
  --bs-btn-active-border-color: #fff;
}

.btn[class*=btn-be-],
.btn[class*=btn-form] {
  --bs-btn-padding-x: 20px;
  --bs-btn-padding-y: 10px;
  --bs-btn-border-radius: 0.25rem;
  line-height: 1;
}

.btn[class*=btn-be-].btn-primary {
  --bs-btn-bg: #0065FD;
  --bs-btn-border-color: #0065FD;
  --bs-btn-hover-bg: rgba(0, 101, 253, 0.75);
  --bs-btn-hover-border-color: rgba(0, 101, 253, 0.2);
}
.btn[class*=btn-be-].btn-outline-primary {
  --bs-btn-color: #0065FD;
  --bs-btn-border-color: #0065FD;
  --bs-btn-hover-bg: #0065FD;
  --bs-btn-active-bg: #0065FD;
  --bs-btn-disabled-color: #0065FD;
  --bs-btn-disabled-border-color: #0065FD;
  --bs-btn-disabled-opacity: 0.5;
}
.btn[class*=btn-be-].btn-danger {
  --bs-btn-bg: #A24547;
  --bs-btn-border-color: #A24547;
  --bs-btn-disabled-bg: #A24547;
  --bs-btn-disabled-opacity: 0.5;
}

.btn-form-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #fead07;
  --bs-btn-border-color: #fead07;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: rgba(254, 173, 7, 0.7);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: rgba(254, 173, 7, 0.7);
  --bs-btn-active-border-color: rgba(254, 173, 7, 0.7);
}

.gap-20 {
  gap: 20px;
}

.custom-gutter-46 {
  --bs-gutter-x: 46px;
}

.custom-mb-9 {
  margin-bottom: 9px;
}

.custom-mb-12 {
  margin-bottom: 12px;
}

.custom-mb-26 {
  margin-bottom: 26px;
}

.custom-mb-29 {
  margin-bottom: 29px;
}

.custom-mb-50 {
  margin-bottom: 50px;
}

.custom-mb-72 {
  margin-bottom: 72px;
}

.container {
  max-width: 1200px;
}

label.is-required {
  display: flex;
}
label.is-required:after {
  content: "*";
  display: inline-block;
  margin-left: 1px;
  color: #eb0000;
}
label span {
  order: 3;
  margin: 2px 0 0 1px;
  color: #545454;
  font-size: 13px;
}

.form-group .text {
  color: #545454;
}

.form-label {
  margin: 0;
}

.form-control.date-input {
  position: relative;
}
.form-control.date-input:after {
  content: "";
  position: absolute;
  right: 14px;
  top: 10px;
  display: block;
  width: 16px;
  height: 16px;
  background: url(../img/icons/calendar.svg) #fff center;
  pointer-events: none;
}

.form-check-input {
  background-size: 10px;
}
.form-check-input:hover {
  border-color: #b4c4ff;
}
.form-check-input:disabled {
  border-color: #e9eff6;
}
.form-check-input.check-v-icon:checked[type=checkbox] {
  --bs-form-check-bg-image: url(../../../img/icons/check-white.svg);
  background-color: #1B4DFF;
}

.form-check-label {
  color: #000;
}

.table-fixed {
  table-layout: fixed;
}

.table:not(.table-borderless) > *:not(tfoot) > * > *:not(:last-child) {
  border-right: 1px solid #8e8e8e;
}

.modal-content {
  border: 0;
}

.modal-header {
  padding-right: 14px;
  color: #fff;
  background-color: #567094;
}
.modal-header .btn-close {
  --bs-btn-close-color: #fff;
  --bs-btn-close-bg: url(../../../img/icons/x-circle.svg);
  --bs-btn-close-opacity: 1;
  width: 24px;
  height: 24px;
  margin-right: 0;
  padding: 0;
  background-size: 100%;
}

.modal-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.modal-heading {
  --bs-border-color: #a0a0a0;
  font-size: 1.25rem;
}

.modal-btn-row {
  --bs-border-color: #b9b9b9;
  display: flex;
  justify-content: flex-end;
  gap: 20px;
  margin-top: 20px;
  padding-top: 18px;
}
.modal-btn-row .btn {
  --bs-btn-border-radius: 4px;
}

.modal-lg,
.modal-xl {
  --bs-modal-padding: 29px 36px;
}

@media (min-width: 992px) {
  .table {
    table-layout: fixed;
  }
  .modal-header {
    padding-right: 29px;
  }
  .modal-header .btn-close {
    width: 35px;
    height: 35px;
  }
  .modal-heading {
    font-size: 1.5rem;
  }
  .modal-lg {
    --bs-modal-padding: 46px 70px;
  }
  .modal-xl {
    --bs-modal-padding: 29px 78px;
  }
}
.wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.page-bg {
  background: url(../img/bg.png) #f0f0f0 no-repeat left top;
  background-size: 300%;
}

.header {
  height: 60px;
}
.header .navbar {
  --bs-navbar-padding-y: 5px;
}
.header .navbar-brand {
  height: 50px;
}
.header .navbar-toggler {
  --bs-border-width: 0;
}
.header .navbar-toggler:focus {
  box-shadow: none;
}
.header .navbar-toggler[aria-expanded=true] {
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.2929 0.292893C12.6834 -0.0976311 13.3164 -0.0976311 13.707 0.292893C14.0975 0.683418 14.0975 1.31643 13.707 1.70696L8.41399 6.99992L13.707 12.2929L13.7753 12.3691C14.0957 12.7618 14.0731 13.3408 13.707 13.707C13.3408 14.0731 12.7618 14.0957 12.3691 13.7753L12.2929 13.707L6.99992 8.41399L1.70696 13.707C1.31643 14.0975 0.683418 14.0975 0.292893 13.707C-0.0976311 13.3164 -0.0976311 12.6834 0.292893 12.2929L5.58586 6.99992L0.292893 1.70696L0.224534 1.63078C-0.0958165 1.23801 -0.0732227 0.659009 0.292893 0.292893C0.659009 -0.0732227 1.23801 -0.0958165 1.63078 0.224534L1.70696 0.292893L6.99992 5.58586L12.2929 0.292893Z' fill='%23211714'/%3e%3c/svg%3e");
}
.header .navbar-toggler[aria-expanded=true] .navbar-toggler-icon {
  width: 14px;
  height: 14px;
  margin: 0 4px 4px 0;
}
.header .navbar-toggler .navbar-toggler-icon {
  width: 24px;
  height: 24px;
}
.header .navbar-nav {
  --bs-navbar-color: #3B4148;
  --bs-navbar-hover-color: #E85514;
  margin-top: 36px;
}
.header .navbar-nav .nav-link {
  --bs-navbar-nav-link-padding-x: 1rem;
  --bs-navbar-nav-link-padding-y: 1rem;
  position: relative;
  font-size: 1.125rem;
}
.header .navbar-nav .nav-link:hover:before {
  content: "";
  position: absolute;
  bottom: 0.5rem;
  left: 1rem;
  z-index: -1;
  display: block;
  width: calc(100% - 2rem);
  height: 8px;
  background-color: #fff7e6;
}
.header .btn-wrap {
  gap: 20px;
  padding: 20px;
}
.header .btn-wrap > * {
  display: block;
  width: 50px;
  height: 50px;
}
.header .btn-wrap svg {
  width: 20px;
}
.header .btn-wrap .icon-location {
  width: 19px;
}
.header .btn-wrap .icon-fb {
  width: auto;
  height: 24px;
}

.page-banner {
  width: 100%;
  height: 80px;
}
.page-banner img {
  object-position: right;
}

.top-heading-section {
  position: relative;
  height: 120px;
  margin-top: -30px;
  background: url(../img/m-page-heading.png) no-repeat left center;
  background-size: 200px;
}
.top-heading-section .page-heading {
  width: 200px;
  font-size: 24px;
  font-weight: 400;
  line-height: 56px;
}
.top-heading-section .breadcrumb {
  --bs-breadcrumb-item-active-color: #3B4148;
  --bs-breadcrumb-divider-color: #838383;
}
.top-heading-section .breadcrumb a {
  color: #838383;
}
.top-heading-section .breadcrumb a:hover {
  color: #FFAD17;
}
.top-heading-section .breadcrumb .breadcrumb-item.active {
  font-weight: 700;
}
.top-heading-section .breadcrumb .breadcrumb-item + .breadcrumb-item.active::before {
  font-weight: 400;
}

.section-heading {
  margin-bottom: 12px;
}
.section-heading h3 {
  --cap-left: 30px;
  --cap-right: 60px;
  --h: 29px;
  width: fit-content;
  min-width: 250px;
  padding: 0 calc(var(--cap-right) + 10px) 14px var(--cap-left);
  text-align: center;
  letter-spacing: 1px;
  font-size: 24px;
  font-weight: 700;
  background-image: url("../img/m-heading-deco-left.svg"), url("../img/m-heading-deco-right.svg"), url("../img/m-heading-deco-middle.svg");
  background-repeat: no-repeat;
  background-position: left bottom, right bottom, var(--cap-left) bottom;
  background-size: var(--cap-left) var(--h), var(--cap-right) var(--h), calc(100% - (var(--cap-left) + var(--cap-right))) var(--h);
  background-origin: padding-box;
  background-clip: padding-box;
}
.section-heading.deco-left {
  background-image: url(../img/heading-bg-deco-left.png);
}

.panel {
  padding: 28px 24px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 22px rgba(0, 0, 0, 0.25);
}

.panel-heading {
  font-size: 1.25rem;
}

.panel-top-row .btns-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.panel-top-row .btns-wrap a {
  color: #0065FD;
}

aside .sub-nav-section .toggle-btn {
  padding: 0.5rem 1.125rem;
  color: #4a4a4a;
  font-size: 1.125rem;
  border-color: #c0c0c0;
  border-radius: 0.25rem;
}
aside .sub-nav-section .sub-nav {
  --bs-dropdown-min-width: 100%;
  --bs-dropdown-font-size: 1.125rem;
  --bs-dropdown-border-radius: 0.25rem;
  --bs-dropdown-padding-y: 0;
  --bs-dropdown-item-padding-y: 12px;
  --bs-dropdown-item-padding-x: 8px;
  --bs-dropdown-link-hover-color: #E85514;
  --bs-dropdown-link-hover-bg: #fff;
  text-align: center;
  border: 0;
  box-shadow: 0 4px 22px rgba(0, 0, 0, 0.25);
}
aside .sub-nav-section .sub-nav > li + li {
  border-top: 1px solid #c0c0c0;
}
aside .sub-nav-section .sub-nav .logout {
  color: #ff4545;
}

.footer {
  margin-top: 60px;
  color: rgba(255, 255, 255, 0.6);
}
.footer h6 {
  width: fit-content;
  padding: 0.5rem 1rem;
  font-weight: 400;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 1.5rem;
}
.footer a {
  color: #fff;
}

@media (min-width: 992px) {
  .page-bg {
    background-position: center top;
    background-size: 100%;
  }
  .header {
    height: 90px;
  }
  .header .navbar {
    --bs-navbar-padding-x: 20px;
    --bs-navbar-padding-y: 10px;
  }
  .header .navbar-brand {
    height: 70px;
  }
  .header .navbar-nav .nav-link {
    --bs-navbar-nav-link-padding-y: 0.5rem;
  }
  .header .btn-wrap {
    gap: 0.75rem;
  }
  .header .btn-wrap > * {
    display: block;
    width: 40px;
    height: 40px;
    padding: 0;
    line-height: 2.2;
  }
  .header .btn-wrap svg {
    width: 16px;
  }
  .header .btn-wrap .icon-fb {
    height: 16px;
  }
  .page-banner {
    height: 200px;
  }
  .top-heading-section {
    height: 186px;
    margin-top: -46px;
    background-image: url(../img/page-heading.png);
    background-size: 520px;
  }
  .top-heading-section .page-heading {
    width: 520px;
    font-size: 48px;
    text-align: center;
    line-height: 92px;
  }
  .top-heading-section .breadcrumb {
    padding-top: 56px !important;
    padding-right: 40px;
  }
  .section-heading {
    margin-bottom: 38px;
  }
  .section-heading h3 {
    --cap: 60px;
    min-width: 275px;
    padding: 0 calc(var(--cap) + 30px) 4px var(--cap);
    font-size: 36px;
    background-image: url("../img/heading-deco-left.svg"), url("../img/heading-deco-right.svg"), url("../img/heading-deco-middle.svg");
    background-position: left bottom, right bottom, var(--cap) bottom;
    background-size: var(--cap) var(--h), var(--cap) var(--h), calc(100% - var(--cap) * 2) var(--h);
  }
  .lg-wrap {
    padding: 28px 25px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 22px rgba(0, 0, 0, 0.25);
  }
  .lg-panel-none {
    padding: 0;
    box-shadow: none;
  }
  .panel-heading {
    font-size: 1.5rem;
  }
  .panel-top-row .btns-wrap {
    gap: 18px;
  }
  aside .sub-nav-section {
    padding: 42px 16px 11px;
  }
  aside .sub-nav-section .user-name {
    font-size: 1.125rem;
  }
  aside .sub-nav-section .sub-nav {
    --bs-dropdown-border-radius: 0;
    --bs-dropdown-padding-y: 4px;
    --bs-dropdown-item-padding-y: 14px;
    --bs-dropdown-item-padding-x: 14px;
    --bs-dropdown-link-hover-color: #FFAD17;
    --bs-dropdown-link-active-color: #FFAD17;
    --bs-dropdown-link-active-bg: #fff;
    position: relative;
    text-align: left;
    border-top: 2px solid #c0c0c0;
    box-shadow: none;
  }
  aside .sub-nav-section .sub-nav li + li {
    border: 0;
  }
  aside .sub-nav-section .sub-nav .dropdown-item {
    border-left: 4px solid transparent;
    white-space: initial;
  }
  aside .sub-nav-section .sub-nav .dropdown-item:hover, aside .sub-nav-section .sub-nav .dropdown-item.active {
    border-color: #FFAD17;
  }
  aside .sub-nav-section .sub-nav .dropdown-item.active {
    font-weight: 700;
  }

  .footer {
    margin-top: 200px !important;
  }
  .footer .linear-deco {
    top: -200px;
    left: 0;
    width: 100%;
    height: 200px;
    background: url(../img/footer-linear.png) no-repeat center bottom;
    background-size: 100%;
  }
  .footer h6 {
    padding-top: 36px;
    padding-bottom: 36px;
  }
  .footer hr {
    max-width: 1120px;
  }
}
.paragraph-mix-card {
  --bs-card-spacer-x: 0;
  --bs-card-spacer-y: 0;
  --bs-border-width: 0;
  --bs-card-bg: transparent;
}
.paragraph-mix-card .card-img-top {
  object-fit: cover;
}
.paragraph-mix-card .card-body {
  flex-direction: column;
  gap: 38px;
}
.paragraph-mix-card .card-title {
  font-size: 1.25rem;
  font-weight: 700;
}
.paragraph-mix-card .card-text {
  color: #727272;
  font-size: 1.125rem;
}
.paragraph-mix-card .text-section {
  line-height: 2;
}
.paragraph-mix-card.img-right .card-body {
  flex-direction: column-reverse;
}
.paragraph-mix-card.single-card {
  --bs-card-spacer-x: 1.25rem;
  --bs-card-spacer-y: 1.5rem;
  --bs-card-bg: #fff;
  --bs-border-width: 1px;
}
.paragraph-mix-card.single-card .card-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 指定行數，超過會有刪節號 */
  overflow: hidden;
}
.paragraph-mix-card.single-card .card-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; /* 指定行數，超過會有刪節號 */
  overflow: hidden;
}
.paragraph-mix-card.single-card:hover .card-title {
  color: #E85514;
}
.paragraph-mix-card.single-card:hover .card-text {
  font-weight: 700;
}

.table-list {
  --bs-table-bg: #f8f8f8;
  --bs-table-striped-bg: #ffefcb;
  margin: 0;
  table-layout: auto;
}
.table-list > tbody > tr > * {
  border-bottom: 1px solid #8e8e8e;
}
.table-list .label {
  padding-left: 66px;
}
.table-list .link {
  width: 200px;
  padding-right: 66px;
}
.table-list .link a {
  display: block;
  width: 37px;
  height: 43px;
  background: center no-repeat;
  background-size: 100%;
}
.table-list .link a.link-doc {
  background-image: url(../img/icons/doc.png);
}
.table-list .link a.link-pdf {
  background-image: url(../img/icons/pdf.png);
}

.btn-list .btn {
  --bs-btn-hover-bg: #6984a9;
  --bs-btn-hover-border-color: #6984a9;
}
.btn-list .btn-lg {
  --bs-btn-border-radius: 0.875rem;
  width: 100%;
  padding: 30px 24px;
}

.news-card {
  --bs-card-spacer-x: 0;
  --bs-card-cap-padding-x: 0;
  --bs-card-cap-padding-y: 0;
  --bs-card-border-width: 0;
  --bs-card-border-radius: 0;
  --bs-card-bg: transparent;
  --bs-card-cap-bg: transparent;
}
.news-card:hover .more-arrow-btn .icon-arrow-right-long {
  display: inline-block;
}
.news-card:hover .more-arrow-btn .icon-arrow-right {
  display: none;
}
.news-card .card-img {
  border-radius: 0;
}
.news-card .more-arrow-btn {
  width: 100px;
  height: 65px;
  line-height: 65px;
  overflow: hidden;
}
.news-card .more-arrow-btn svg {
  margin-left: -1px;
}
.news-card .more-arrow-btn .icon-arrow-right-long {
  display: none;
}
.news-card + .news-card {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px dashed #567094;
}
.news-card:last-child {
  padding-bottom: 1.5rem;
  border-bottom: 1px dashed #567094;
}

.video-card {
  --bs-card-spacer-x: 0.5rem;
  --bs-card-spacer-y: 2rem;
  --bs-card-border-width: 0;
  --bs-border-radius: 1.5rem;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

.rwd-list-panel .rwd-list-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 9px;
  border: 1px solid #bababa;
}
.rwd-list-panel .rwd-list-item .col {
  display: flex;
}
.student-list {
    min-width: min-content;
}
.student-list .col {
    flex: unset;
}
    .student-list .student-header .col.text-center:last-child {
        flex: 1;
    }
.student-list .student-item .col:first-child,
.student-list .student-header .col.text-center:first-child {
    width: 75px;
}

.student-list .student-item .col:nth-child(2),
.student-list .student-header .col.text-center:nth-child(2) {
    width: 150px;
}

.student-list .student-item .col:nth-child(3),
.student-list .student-header .col.text-center:nth-child(3) {
    width: 120px;
}

.student-list .student-item .col:nth-child(4),
.student-list .student-header .col.text-center:nth-child(4) {
    width: 150px;
}

.table-scroll {
    overflow-x: auto;
}

@media(max-width:992px) {
    .student-list .student-item .col:first-child, .student-list .student-header .col.text-center:first-child, .student-list .student-item .col:nth-child(2), .student-list .student-header .col.text-center:nth-child(2), .student-list .student-item .col:nth-child(3), .student-list .student-header .col.text-center:nth-child(3), .student-list .student-item .col:nth-child(4), .student-list .student-header .col.text-center:nth-child(4) {
        width: unset;
    }
}
.rwd-list-panel .rwd-list-item .col .label {
    flex-shrink: 0;
    width: 76px;
    padding: 11px 5px;
    color: #fff;
    background-color: #567094;
    border-right: 1px solid #bababa;
}
.rwd-list-panel .rwd-list-item .col .content {
  padding: 11px 14px;
}
.rwd-list-panel .rwd-list-item .col + .col {
  border-top: 1px solid #bababa;
}
.rwd-list-panel a:not(.nav-link, .page-link, .btn) {
  color: #0065FD;
  text-decoration: underline;
}
.rwd-list-panel .img-preview {
    position: relative;
    display: inline-block;
    width: 100px;
    height: 70px;
    list-style: none;
    margin-left: -1em;
}
.file-upload-container .preview-img li {
    list-style: none;
    margin-left: -1em;
}
.rwd-list-panel .img-preview > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rwd-list-panel .img-preview:after {
  content: "";
  position: absolute;
  right: 4px;
  bottom: 4px;
  display: block;
  width: 16px;
  height: 16px;
  background: url(../img/icons/eye.svg);
}

.nav-tabs {
  flex-wrap: nowrap;
  margin-bottom: 26px;
}
.nav-tabs .nav-item {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
}
.nav-tabs .nav-link {
  padding: 12px 8px;
  color: #3B4148;
  line-height: 1;
    white-space: normal;
  overflow-wrap: anywhere;
  font-size: clamp(16px, 3.2vw, 18px);
  font-weight: 700;
  border-width: 0 0 4px;
}

.form-wrap {
  gap: 20px;
  font-size: 0.875rem;
}
/*file/img list*/
.fileList, .imgList {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .fileList .btn-delete {
        margin-right: 0.5rem;
        font-size: 20px;
        color: var(--cy-gray-500)
    }

        .fileList .btn-delete:hover {
            color: var(--cy-danger)
        }

    .fileList li {
        display: flex;
        align-items: center;
        margin-bottom: .5rem;
    }

    .imgList li {
        position: relative;
        object-fit: contain;
        display: inline-block;
        margin: 0 1rem 1rem 0;
    }

    .imgList .btn-delete {
        position: absolute;
        border-radius: 50%;
        background: rgba(0,0,0,.6);
        color: #fff;
        width: 30px;
        height: 30px;
        right: .4rem;
        top: .4rem
    }

        .imgList .btn-delete:hover {
            background: rgba(0,0,0,1);
        }

    .imgList img {
        max-width: 250px;
        max-height: 250px;
        border: 1px solid #ddd;
        min-width: 100px;
    }
.file-upload-container .preview-img {
  position: relative;
  display: block;
  width: 130px;
  height: 70px;
}
.file-upload-container .preview-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
/*.file-upload-container .preview-img:after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: block;
  width: 16px;
  height: 16px;
  background: url(../img/icons/eye.svg);
}*/
.file-upload-container .btn {
  font-size: 0.875rem;
}
.file-upload-container .remove-btn {
  --bs-btn-padding-x: 0;
  --bs-btn-padding-y: 0;
  position: absolute;
  right: 14px;
  top: 14px;
  line-height: 1;
  border: 0;
}
.file-upload-container .file-name {
  color: #0065FD;
  border-bottom: 1px solid #0065FD;
}

.file-upload-container .btn-delete {
    margin-right: 0.5rem;
    font-size: 20px;
    color: var(--bs-gray-500);
    width: .6875em;
}

    .file-upload-container .btn-delete:hover {
        color: var(--bs-danger)
    }

.file-upload-container .preview-img .btn-delete {
    position: absolute;
    border-radius: 50%;
    background: rgba(0,0,0,.6);
    color: #fff;
    width: 30px;
    height: 30px;
    right: .4rem;
    top: .4rem
}

.file-upload-container .preview-img .btn-delete:hover {
    background: rgba(0,0,0,1);
}


.pagination {
  margin-top: 65px;
}
.pagination .page-link {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
}

.swiper-button-prev,
.swiper-button-next {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  padding: 0;
  border-radius: 50%;
  border: 1px solid #f2ba2f;
}
.swiper-button-prev:after,
.swiper-button-next:after {
  display: none;
}
.swiper-button-prev svg,
.swiper-button-next svg {
  width: 9px;
  height: 17px;
}

.swiper-pagination-bullet-active {
  --swiper-pagination-color: #f2ba2f;
}

.swiper-scrollbar {
  display: none;
}

@media (max-width: 991.99px) {
  .rwd-list-panel .actions-btn-wrap {
    flex-wrap: wrap;
  }
}
@media (min-width: 992px) {
  .paragraph-mix-card .card-body {
    flex-direction: row;
  }
  .paragraph-mix-card .image-section {
    width: 380px;
  }
  .paragraph-mix-card.img-right .card-body {
    flex-direction: row-reverse;
  }
  .paragraph-mix-card.img-top .card-body {
    flex-direction: column;
  }
  .paragraph-mix-card.img-top .image-section {
    width: 100%;
  }
  .news-card .card-img {
    width: 280px;
    border-radius: 1.5rem;
  }
  .rwd-list-panel .rwd-list-header {
    align-items: center;
    height: 55px;
  }
  .rwd-list-panel .rwd-list-item {
    flex-direction: row;
    align-items: center;
    margin-bottom: 0;
    padding: 8px 0;
    border-width: 0 0 1px;
  }
  .rwd-list-panel .rwd-list-item .col .content {
    width: 100%;
    padding: 0;
    font-size: clamp(0.875rem, 1.1vw, 1rem);
  }
  .rwd-list-panel .rwd-list-item .col + .col {
    border: 0;
  }
  .rwd-list-panel .col:not(.col-auto) {
    padding: 0 1rem;
  }
  .rwd-list-panel .col.actions {
    flex: 0 0 160px;
  }
    .rwd-list-panel .actions-btn-wrap {
    flex-wrap: wrap;
  }
  .rwd-list-panel .actions-btn-wrap .btn {
    padding: 8px 16px;
    font-size: clamp(0.875rem, 1.1vw, 1rem);
  }
  .rwd-list-panel .col-extra {
    flex: 0 0 210px;
  }
  .rwd-list-panel .col-auto {
    min-width: 100px;
  }
  .rwd-list-panel .col-custom-2 {
    flex: 0 0 124px;
  }
  .rwd-list-panel .col-custom-3 {
    flex: 0 0 25%;
  }
  .rwd-list-panel.narrow-columns .col:not(.col-auto) {
    padding: 0 0.25rem;
  }
  .rwd-list-panel .sub-list .rwd-list-item {
    border: 0;
  }
    .nav-tabs .nav-item {
    flex: unset;
  }
  .form-wrap {
    font-size: 1rem;
  }
  .file-upload-container .preview-img {
    width: 213px;
    height: 115px;
  }
  .file-upload-container .btn {
    font-size: 1rem;
  }
  .pagination {
    margin-top: 150px;
  }
  .swiper-button-prev,
  .swiper-button-next {
    width: 46px;
    height: 46px;
  }
  .swiper-button-prev svg,
  .swiper-button-next svg {
    width: 12px;
    height: 22px;
  }
}
.quicklink-wrap > .btn {
  --bs-btn-bg: #fff;
  --bs-btn-border-width: 2px;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.875rem;
  width: 140px;
  height: 140px;
  font-size: 1.125rem;
  font-weight: 700;
}
.quicklink-wrap > .btn svg {
  width: 40px;
  height: 40px;
}
.quicklink-wrap > .btn:hover svg path {
  fill: #fff;
}

.btn-quicklink-orange {
  --bs-btn-color: #E85514;
  --bs-btn-border-color: #E85514;
  --bs-btn-hover-border-color: #E85514;
  --bs-btn-hover-bg: #E85514;
  --bs-btn-active-color: #E85514;
  --bs-btn-active-border-color: #E85514;
}
.btn-quicklink-orange svg path {
  fill: #E85514;
}

.btn-quicklink-green {
  --bs-btn-color: #169498;
  --bs-btn-border-color: #169498;
  --bs-btn-hover-border-color: #169498;
  --bs-btn-hover-bg: #169498;
  --bs-btn-active-color: #169498;
  --bs-btn-active-border-color: #169498;
}
.btn-quicklink-green svg path {
  fill: #169498;
}

.news-section .section-heading {
  margin-bottom: 20px;
  background: url(../img/m-heading-bg.png) no-repeat center bottom;
  background-size: 322px;
}
.news-section .section-heading h3 {
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 45px;
  font-size: 2rem;
  background: none;
}
.news-section .news-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 指定行數，超過會有刪節號 */
  overflow: hidden;
  line-height: 1.6;
}

.media-section .section-heading {
  height: 50px;
  margin-bottom: 32px;
  background: url(../img/heading-bg.png) no-repeat center;
  background-size: 322px;
}
.media-section .section-heading h3 {
  line-height: 50px;
  font-size: 1.75rem;
  background: none;
}

.home-event-section {
  margin-bottom: 60px;
}
.home-event-section .swiper-button-row {
  margin-top: -150px;
  margin-bottom: 220px;
  opacity: 0.8;
  z-index: 100;
}
.home-event-section .swiper-button-row .swiper-button-prev {
  left: -6px;
  background-color: #fff;
}
.home-event-section .swiper-button-row .swiper-button-next {
  right: -6px;
  background-color: #fff;
}
.home-event-section .heading-container {
  width: 100%;
  height: 284px;
  padding-top: 52px;
  background: url(../img/m-home-event-heading-bg.jpg) no-repeat center;
  background-size: 100%;
}
.home-event-section .heading-container h3 {
  font-size: 2rem;
}
.home-event-section .events-container a:not(.btn):hover {
  color: #E85514;
}
.home-event-section .event-card-mobile {
  --bs-card-bg: #fff;
  --bs-card-border-width: 0;
  --bs-border-radius: 1.5rem;
  margin-top: -150px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}
.home-event-section .event-card-mobile .card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-org-section .section-heading {
  height: 50px;
  background: url(../img/m-heading-bg.png) no-repeat center bottom;
  background-size: 322px;
}
.home-org-section .section-heading h3 {
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 45px;
  font-size: 2rem;
  background: none;
}
.home-org-section .org-container a {
  padding: 15px 0;
  color: #3B4148;
  border: 1px solid #fff;
}
.home-org-section .org-container a:hover {
  color: #3B4148;
  border-color: #FFAD17;
}
.home-org-section .org-container a svg {
  width: 32px;
  height: 32px;
}

.feature-slider-section {
  margin-bottom: 18px;
  background: url(../img/m-feature-slider-bg.png) no-repeat left 8px bottom 4px/100%;
}
.feature-slider-section .feature-swiper {
  mask: url(../img/m-feature-banner-mask-fixed.png) no-repeat left bottom/cover;
}
.feature-slider-section .swiper-slide > .text-box {
  width: 100%;
  height: 160px;
  background: url(../img/m-feature-heading-bg.png) #fff no-repeat center bottom/100%;
}
.feature-slider-section .swiper-slide > .text-box:before, .feature-slider-section .swiper-slide > .text-box:after {
  content: "";
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 24px;
  z-index: 2;
}
.feature-slider-section .swiper-slide > .text-box:before {
  bottom: 0;
  background: linear-gradient(to bottom, transparent, #fff);
}
.feature-slider-section .swiper-slide > .text-box:after {
  bottom: -24px;
  background: linear-gradient(to bottom, #fff, transparent);
}
.feature-slider-section .feature-item {
  width: 100%;
  height: 290px;
}
.feature-slider-section .feature-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}
.feature-slider-section .feature-heading {
  position: relative;
  font-size: 2rem;
  width: 100%;
  text-align: center;
}
.feature-slider-section .feature-heading:after {
  content: "";
  position: absolute;
  left: 35%;
  bottom: -16px;
  display: block;
  width: 30%;
  height: 5px;
  background-color: #E85514;
}
.feature-slider-section .feature-text {
  position: relative;
  z-index: 3;
  width: 100%;
  padding: 0 10%;
  line-height: 1.4;
  color: #6f6f6f;
  font-size: 1.25rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; /* 指定行數，超過會有刪節號 */
  overflow: hidden;
}
.feature-slider-section .swiper-button-prev,
.feature-slider-section .swiper-button-next {
  margin-top: 40px;
  background-color: rgba(255, 255, 255, 0.5);
}

.news-swiper .card {
  --bs-card-spacer-x: 1.5rem;
  --bs-card-spacer-y: 1.5rem;
  --bs-card-border-width: 0;
  --bs-card-border-radius: 1.5rem;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

.media-swiper .swiper-button-prev,
.media-swiper .swiper-button-next {
  background-color: #fff;
  opacity: 0.8;
}

.event-swiper {
  margin-top: -150px;
}
.event-swiper .event-card-item {
  width: 100%;
  height: 100%;
  padding: 1rem;
  background-color: #fff;
  border-radius: 1.5rem;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}
.event-swiper .event-card-item .event-img {
  aspect-ratio: 16/9;
  border-radius: 20px;
  overflow: hidden;
}

@media (min-width: 992px) {
  .feature-slider-section {
    margin-bottom: 85px;
    background: url(../img/feature-slider-bg.png) no-repeat left 24px bottom 12px/100%;
  }
  .feature-slider-section .feature-swiper {
    mask: url("../img/feature-banner-mask.png") no-repeat left bottom/cover;
  }
  .feature-slider-section .feature-item {
    height: 600px;
  }
  .feature-slider-section .text-box {
    right: 10vw;
    top: 10vw;
    width: fit-content;
    height: 100%;
    background: none;
  }
  .feature-slider-section .feature-heading {
    font-size: 56px;
  }
  .feature-slider-section .feature-heading:after {
    bottom: -24px;
  }
  .feature-slider-section .feature-text {
    /*width: 360px;*/
    max-height: 150px;
    overflow: hidden;
    font-size: 2rem;
    padding: 2rem 10%;
  }
  .feature-slider-section .swiper-button-prev,
  .feature-slider-section .swiper-button-next {
    margin: 0;
  }
  .news-section .section-heading {
    margin-bottom: 60px;
    background: none;
  }
  .news-section .section-heading h3 {
    width: 340px;
    padding: 0 36px 12px 0;
    font-size: 3rem;
    background: url(../img/heading-bg-deco-right.png) no-repeat center bottom;
    background-size: 340px;
  }
  .quicklink-wrap > .btn {
    width: 220px;
    height: 220px;
    font-size: 1.25rem;
  }
  .quicklink-wrap > .btn svg {
    width: 80px;
    height: 80px;
  }
  .media-section {
    background: url(../img/home-media-section.png) no-repeat center;
    background-size: 100%;
  }
  .media-section .section-heading {
    height: 88px;
    margin-bottom: 70px;
    background-size: 716px;
  }
  .media-section .section-heading h3 {
    font-size: 3rem;
    line-height: 88px;
  }
  .media-section .row {
    --bs-gutter-x: 2.5rem;
  }
  .home-event-section {
    margin: 0;
    padding: 160px 0 120px;
    background: url(../img/home-events-section-bg.png) no-repeat right -40px;
    background-size: 60%;
  }
  .home-event-section .event-swiper {
    width: 54.6vw;
    height: 29.2vw;
    max-width: 786px;
    max-height: 420px;
    margin: 0;
    padding-top: 1rem;
  }
  .home-event-section .event-swiper .swiper-wrapper {
    width: calc(100% + 1px);
  }
  .home-event-section .swiper-button-row {
    display: none;
    margin: 0;
    opacity: 1;
  }
  .home-event-section .swiper-button-row .swiper-button-prev {
    background: none;
  }
  .home-event-section .swiper-button-row .swiper-button-next {
    background: none;
  }
  .home-event-section .inner {
    height: 410px;
  }
  .home-event-section .heading-container {
    width: 380px;
    height: 325px;
    padding: 0;
    background: none;
  }
  .home-event-section .heading-container h3 {
    margin-top: 84px;
    font-size: 3rem;
  }
  .home-event-section .heading-container .btn {
    width: 192px;
  }
  .home-event-section .heading-container:before {
    content: "";
    position: absolute;
    left: 0;
    display: block;
    width: 31vw;
    height: 22.53vw;
    max-width: 447px;
    max-height: 325px;
    aspect-ratio: 447/325;
    background: url(../img/home-event-heading-bg.png) no-repeat center;
    background-size: 100%;
  }
  .home-event-section .event-card-item {
    position: relative;
    width: 95%;
    height: 92.9%;
    max-width: 770px;
    max-height: 390px;
    padding: 0;
    background: none;
    box-shadow: none;
  }
  .home-event-section .event-card-item > * {
    position: absolute;
  }
  .home-event-section .event-card-item .event-img {
    left: 0;
    top: 8.1%;
    z-index: 2;
    width: 60.4%;
    height: 73.8%;
    max-width: 465px;
    max-height: 310px;
    border-radius: 1.5rem;
    overflow: hidden;
  }
  .home-event-section .event-card-item .event-content {
    right: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 79.2%;
    height: 94.9%;
    max-width: 610px;
    max-height: 370px;
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  }
  .home-event-section .event-card-item a {
    width: 33.2%;
    max-width: 256px;
    color: #3B4148;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4; /* 指定行數，超過會有刪節號 */
    overflow: hidden;
  }
  .home-event-section .event-card-item a:hover {
    color: #E85514;
  }
  .home-event-section .event-deco {
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 999;
    width: 80px;
    height: 80px;
    background: url(../img/home-events-section-deco.png) no-repeat center;
    background-size: contain;
  }
  .home-org-section {
    aspect-ratio: 1440/708;
    background: url(../img/home-org-section-bg.png) no-repeat center;
    background-size: 100%;
  }
  .home-org-section .section-heading {
    height: 81px;
    padding-top: 40px;
    background: none;
  }
  .home-org-section .section-heading h3 {
    width: 354px;
    margin-left: 150px;
    padding: 0 0 36px 56px;
    background: url(../img/heading-bg-deco-left.png) no-repeat left center;
    background-size: 353px;
    font-size: 3rem;
  }
  .home-org-section .org-container {
    --bs-gutter-x: 12px;
    width: 35vw;
    margin: 9.6vw 0 0 7.64vw;
  }
  [data-module=home] main {
    background: url(../img/home-news-section-bg.png) no-repeat right 0 top 300px/600px;
  }
  [data-module=home] .footer {
    margin-top: 0 !important;
  }
  [data-module=home] .footer .linear-deco {
    display: none !important;
  }
}
@media (min-width: 1280px) {
  .home-event-section .swiper-button-row {
    display: block;
  }
  .home-event-section .swiper-button-row > * {
    top: -200px;
  }
  .home-event-section .swiper-button-row .swiper-button-prev {
    left: 30%;
  }
  .home-event-section .swiper-button-row .swiper-button-next {
    right: -3%;
  }
}
@media (min-width: 1440px) {
  .home-event-section .swiper-button-row .swiper-button-prev {
    left: 30.8%;
  }
  .home-event-section .swiper-button-row .swiper-button-next {
    right: -7.33%;
  }
  .home-event-section .event-deco {
    bottom: 0;
    right: 0;
  }
}
@media (min-width: 1500px) {
  .home-event-section .heading-container:before {
    width: 35vw;
    height: auto;
    max-width:894px;
    max-height:650px;
    top:20%;
  }
  .home-org-section .section-heading h3 {
    margin-left: 0;
  }
  .home-org-section .org-container {
    margin: 220px 0 0 0;
  }
}
.org-container .row {
  --bs-gutter-x: 1rem;
}
.org-container a {
  color: #3B4148;
}

.org-item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 76px;
  line-height: 1.2;
  font-size: 0.875rem;
  background-color: #fff;
  border: 1px solid #DBDBDB;
  border-radius: 14px;
}
.org-item > img {
  max-width: 100%;
  max-height: 42px;
}
.org-item:hover {
  border-color: #FFAD17;
}
@media (min-width: 2000px) {
    .home-event-section .heading-container:before {
        top: 10%;
        transform: scale(1.15);
    }
}

    @media (min-width: 992px) {
        .org-item {
            font-size: 1rem;
        }
    }

    .course-section {
        margin-bottom: 40px;
    }

        .course-section h3 {
            margin-bottom: 1.125rem;
            font-size: 1.5rem;
            font-weight: 700;
        }

        .course-section .table thead th:first-child, .course-section .table thead th:last-child {
            width: 25%;
        }

        .course-section .table > tbody > tr:last-child > * {
            border-bottom-width: 2px;
        }

    @media (min-width: 992px) {
        .course-section {
            margin-bottom: 90px;
        }

            .course-section h3 {
                font-size: 2rem;
            }

            .course-section .table thead th:first-child, .course-section .table thead th:last-child {
                width: auto;
            }
    }

    .news-show-section a {
        text-decoration: underline;
    }

    .event-show-section .figure-caption {
        color: #3B4148;
        font-size: 1.125rem;
    }

    .login-card,
    .register-card {
        --bs-card-spacer-y: 35px;
        --bs-card-spacer-x: 35px;
        --bs-card-cap-padding-x: 0;
        --bs-card-cap-padding-y: 0;
        --bs-card-cap-bg: transparent;
        --bs-card-border-width: 0;
        --bs-card-border-radius: 20px;
        max-width: 820px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
    }

        .login-card .card-header .btn,
        .register-card .card-header .btn {
            --bs-btn-padding-y: 24px;
            --bs-btn-color: #3B4148;
            --bs-btn-bg: rgba(47, 161, 242, 0.15);
            --bs-btn-border-color: rgba(47, 161, 242, 0.15);
            --bs-btn-border-radius: 20px;
            --bs-btn-active-bg: #2fa1f2;
            --bs-btn-active-border-color: #2fa1f2;
            border-bottom-left-radius: 0 !important;
            border-bottom-right-radius: 0 !important;
        }

        .login-card .card-body,
        .register-card .card-body {
            font-size: 0.875rem;
        }

            .login-card .card-body .vstack,
            .register-card .card-body .vstack {
                gap: 29px;
            }

            .login-card .card-body .form-group .hstack,
            .register-card .card-body .form-group .hstack {
                gap: 6px;
            }

            .login-card .card-body .btn,
            .register-card .card-body .btn {
                --bs-btn-padding-x: 20px;
                --bs-btn-padding-y: 12px;
                --bs-btn-bg: #2fa1f2;
                --bs-btn-border-color: #2fa1f2;
                --bs-btn-border-radius: 0.5rem;
                line-height: 24px;
            }

            .login-card .card-body a:not(.btn),
            .register-card .card-body a:not(.btn) {
                /*color: #696b6c;*/
                color: rgb(47, 161, 242);
            }

        .login-card .form-control,
        .register-card .form-control {
            padding: 12px 16px;
            border-radius: 0.5rem;
        }

        .login-card .verification-code,
        .register-card .verification-code {
            height: 50px;
        }

            .login-card .verification-code img,
            .register-card .verification-code img {
                width: auto;
                height: 100%;
                object-fit: contain;
            }

.eye-icon {
    position: absolute;
    right: 16px;
    top: 45px;
}

    .eye-close-icon::after {
        content: " ";
        width: 100%;
        height: 4px;
        display: block;
        background: black;
        transform: rotate(-45deg);
        border: 1px solid white;
        position: absolute;
        top: 50%;
    }

    .modal .eye-icon {
        right: 20px;
        top: 8px;
    }

    @media (min-width: 992px) {
        .login-card .card-header .btn, .register-card .card-header .btn {
            --bs-btn-padding-y: 18px;
            font-size: 1.5rem;
        }

        .login-card .card-body,
        .register-card .card-body {
            padding: 44px 168px;
            font-size: 1rem;
        }

        .custom-tooltip {
            --bs-tooltip-max-width: 400px;
        }
    }

    .register-card {
        --bs-card-cap-bg: #2fa1f2;
    }

        .register-card .card-header {
            padding: 24px 0;
            color: #fff;
        }

            .register-card .card-header h2 {
                font-size: 1.5rem;
                letter-spacing: 2px;
                line-height: 1.2;
            }

    .register-panel {
        max-width: 1198px;
    }

        .register-panel ol {
            line-height: 2;
        }

        .register-panel .form-check-agree {
            margin: 20px 0;
        }

        .register-panel .head-img {
            width: 131px;
            height: 197px;
        }

.eye-close-icon::after {
    top: 48%;
}
    @media (min-width: 992px) {
        .register-card .card-body {
            padding-bottom: 74px;
        }

        .register-panel {
            padding: 37px 78px;
        }

            .register-panel .form-check-agree {
                margin: 30px 0;
            }
    }

    .leave-status-card {
        display: block;
        padding: 14px 8px;
        color: #3B4148;
        font-size: 0.875rem;
        border: 1px solid #fff;
        border-radius: 10px;
        box-shadow: 0 0 7px rgba(0, 0, 0, 0.08);
    }

        .leave-status-card svg {
            width: 32px;
            height: auto;
        }

        .leave-status-card .count {
            line-height: 1;
        }

            .leave-status-card .count em {
                margin-left: 7px;
                font-style: normal;
                font-size: 1.25rem;
            }

        .leave-status-card:hover {
            border-color: #FFAD17;
        }

    .attendance-panel .rwd-list-item .col .label,
    .certificate-panel .rwd-list-item .col .label {
        width: 100px;
    }

    @media (min-width: 992px) {
        .leave-status-card {
            height: 100%;
            font-size: 1rem;
        }

            .leave-status-card > * {
                height: 100%;
            }

            .leave-status-card .count em {
                font-size: 1.5rem;
            }
    }

    .attendance-tabs {
        gap: 100px;
    }

    .attendance-panel .panel-top-row + .panel-top-row {
        margin-top: 53px;
    }

    .attendance-search-row .input-set {
        width: 100%;
        margin-bottom: 29px;
    }

    .rwd-list-panel .evaluation-item .col .label,
    .rwd-list-panel .report-item .col .label {
        width: 112px;
    }

    .modal .rwd-list-panel .expense-item .col .label {
        width: 112px;
    }

.withdrawal-panel .withdrawal-header .col,
.withdrawal-panel .withdrawal-item .col {
    text-align: center;
}
    .withdrawal-panel .withdrawal-header .col:first-child,
    .withdrawal-panel .withdrawal-header .col:nth-child(3),
    .withdrawal-panel .withdrawal-header .col:nth-child(4),
    .withdrawal-panel .withdrawal-item .col:first-child,
    .withdrawal-panel .withdrawal-item .col:nth-child(3),
    .withdrawal-panel .withdrawal-item .col:nth-child(4) {
        width: 70px;
    }

.withdrawal-list{
    min-width: min-content;
}
@media (max-width: 992px){
    .withdrawal-panel .withdrawal-header .col:first-child,
    .withdrawal-panel .withdrawal-header .col:nth-child(3),
    .withdrawal-panel .withdrawal-header .col:nth-child(4),
    .withdrawal-panel .withdrawal-item .col:first-child,
    .withdrawal-panel .withdrawal-item .col:nth-child(3),
    .withdrawal-panel .withdrawal-item .col:nth-child(4),
    .withdrawal-panel .withdrawal-header .col:nth-child(2),
    .withdrawal-panel .withdrawal-item .col:nth-child(2) {
        width: unset;
    }
}
@media (min-width: 992px) {
    .attendance-panel .panel-top-row + .panel-top-row {
            margin-top: 26px;
        }

        .attendance-search-row .input-set {
            width: auto;
            margin: 0;
        }

            .attendance-search-row .input-set .form-control {
                width: 230px;
            }

        .withdrawal-panel .col:not(.col-auto) {
            padding: 0 0.5rem;
        }

        .student-list-panel .leave-status-card {
            padding: 2rem;
        }

            .student-list-panel .leave-status-card svg {
                width: 57px;
                max-height: 57px;
            }

            .student-list-panel .leave-status-card .count em {
                font-size: 2rem;
            }

        .student-list-panel .student-tabs {
            gap: 100px;
        }

        .student-overtime-list .col.actions {
            flex: 0 0 120px;
        }

        .evaluation-list .col-s,
        .check-in-list .col-s,
        .leave-request-list .col-s,
        .report-list .col-s {
            flex: 0 0 48px;
        }

        .evaluation-list .col-m,
        .check-in-list .col-m,
        .leave-request-list .col-m,
        .report-list .col-m {
            flex: 0 0 64px;
        }

        .report-list .col.actions {
            flex: 0 0 280px;
        }

        .certificate-list .col-s {
            flex: 0 0 36px;
        }

        .certificate-list .col-m {
            flex: 0 0 80px;
        }

        .certificate-list .col-l {
            flex: 0 0 144px;
        }

        .expense-item-list .col-s {
            flex: 0 0 48px;
        }

        .expense-item-list .col-m {
            flex: 0 0 72px;
        }

        .expense-item-list .col-l {
            flex: 0 0 140px;
        }
    }

    .profile-panel .panel-top-row {
        display: flex;
        flex-direction: column;
    }

    .form-checklist {
        list-style-image: url(../img/icons/check.svg);
        line-height: 2;
    }

    .profile-photo {
        width: 138px;
        height: 115px;
    }

    @media (min-width: 992px) {
        .profile-panel {
            padding: 36px 97px;
        }

            .profile-panel .panel-top-row {
                flex-direction: row;
            }

        .rwd-list-panel .col-checkbox {
            flex: 0 0 20px;
        }

        .job-download-list .col.actions,
        .resume-list .col.actions {
            flex: 0 0 208px;
        }

        .resume-detail-list .col.actions {
            flex: 0 0 120px;
        }

        .recruitment-record-list .col.actions {
            flex: 0 0 74px;
            min-width: auto;
        }
    }

    /*loader*/
    .loaderWrapper {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999999;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100vw;
        height: 100vh;
        background: rgba(0,0,0,.5);
        flex-direction: column;
    }

    .loaderContaner {
        width: 200px;
        height: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        border-radius: 10px;
    }

    .loaderWrapper span {
        color: #fff;
        margin-top: 2rem;
        font-size: 1.5rem;
        font-weight: 800;
    }

    .loader {
        color: #ffffff;
        font-size: 45px;
        text-indent: -9999em;
        overflow: hidden;
        width: 1em;
        height: 1em;
        border-radius: 50%;
        position: relative;
        transform: translateZ(0);
        animation: mltShdSpin 1.7s infinite ease, round 1.7s infinite ease;
    }

    @keyframes mltShdSpin {
        0% {
            box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        }

        5%, 95% {
            box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        }

        10%, 59% {
            box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
        }

        20% {
            box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
        }

        38% {
            box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
        }

        100% {
            box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
        }
    }

    @keyframes round {
        0% {
            transform: rotate(0deg)
        }

        100% {
            transform: rotate(360deg)
        }
    }

    /*# sourceMappingURL=site.css.map */