/* Bootstrap override */
:root {
  --app-primary-color: #22396d;
  --app-primary-color-hover: #06173d;
  --app-secondary-color: #993366;
  --app-secondary-color-hover: #6d0032;
  --app-bg-hover: #e9ecef;
  --app-text-gray: #666;
  --app-accordion-expand-bg-color: #ebebeb;
  --app-bg-gray: #e9ecef;
  --app-bg-divider: rgb(0 0 0 / 10%);
}
body {
  font-family: 'Montserrat', sans-serif;
}
/* BACKGROUND */
.bg-primary {
  background-color: var(--app-primary-color) !important;
}
.bg-gray {
  background-color: var(--app-bg-gray) !important;
}
.bg-overlay {
  background-color: rgba(0, 0, 0, 0.1);
}
.bg-overlay.hover:hover {
  background-color: rgba(0, 0, 0, 0.8);
  transition: all 0.1s linear;
}
/* TEXT */
.fs-7 {
  font-size: 0.8rem;
}
.text-primary {
  color: var(--app-primary-color) !important;
}
.text-gray {
  color: var(--app-text-gray) !important;
}
.text-secondary {
  color: var(--app-secondary-color) !important;
}
.app-white-text-hover:hover {
  color: #dfdfdf !important;
  transition: all 0.05s linear;
}
.text-primary:hover {
  color: var(--app-primary-color-hover) !important;
  transition: all 0.05s linear;
}
/* BUTTON */
.btn.default {
  background-color: var(--app-bg-hover);
}
.btn:hover {
  background-color: var(--app-bg-hover);
}
.btn:focus {
  box-shadow: none;
}
.btn:active:focus {
  box-shadow: none !important;
}
.btn.btn-danger:hover {
  background-color: #bb2d3b !important;
}
.btn-secondary {
  background-color: var(--app-secondary-color) !important;
}
.btn-secondary:hover {
  background-color: var(--app-secondary-color-hover) !important;
}
.btn-secondary:focus {
  background-color: var(--app-secondary-color-hover) !important;
}
.btn-primary {
  background-color: var(--app-primary-color) !important;
  border-color: transparent;
}
.btn-primary:hover {
  background-color: var(--app-primary-color-hover) !important;
  border-color: transparent;
  transition: all 0.1s linear;
}
.btn-primary:focus {
  background-color: var(--app-primary-color-hover) !important;
  border-color: transparent;
}
.btn-primary:disabled {
  border-color: transparent !important;
}
/* DROPDOWN */
.dropdown-item:active {
  background-color: var(--app-bg-hover) !important;
}
.dropdown[data-trigger-event='hover']:hover .dropdown-menu {
  display: block;
  margin-top: -1px;
}
/* ACCORDION */
.accordion-button {
  color: var(--app-text-gray) !important;
}
.accordion-button:not(.collapsed) {
  background-color: transparent;
}
.accordion-button:focus {
  box-shadow: none;
}
.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23YOUR_HEX_CODE'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
/* DRAWER */
.app-mobile-drawer-item {
  padding: 1rem 1.25rem;
}
/* APP FONT WEIGHT */
.text-bold-300 {
  font-weight: 300;
}
.text-bold-400 {
  font-weight: 400;
}
.text-bold-500 {
  font-weight: 500;
}
.text-bold-600 {
  font-weight: 600;
}
.text-bold-700 {
  font-weight: 700;
}
/* IMAGE */
.app-post-image-wrapper {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  position: relative;
}
.app-post-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
/* OVERLAY */
.app-image-overlay-wrapper {
  width: 100%;
  height: 0;
  padding-bottom: 74%;
  position: relative;
}
.app-image-overlay-wrapper img:not(.card-img) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

/* APP BUTTON */
.app-play-video-btn {
  width: 60px;
  height: 60px;
  border: 2px solid white;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: transparent;
  transition: all 0.1s linear;
}
.app-play-video-btn > i {
  font-size: 36px;
  color: white;
}
.app-play-video-btn:hover {
  background-color: var(--app-primary-color);
  border-color: var(--app-primary-color);
}
.app-loading-btn {
  display: flex;
  align-items: center;
}
/* APP CAROUSEL */
.carousel-bg-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 480px;
}
/* LOADING */
.app-loading-overlay {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.3);
}
.app-loading-overlay .spinner-border {
  width: 5rem;
  height: 5rem;
  font-weight: 700;
}
.spinner-border.sm {
  font-weight: 300;
  width: 1.2rem;
  height: 1.2rem;
}
.spinner-border.md {
  width: 1.4rem;
  height: 1.4rem;
}
.btn.loading {
  display: flex;
  align-items: center;
}
.app-btn-loading-icon {
  display: none;
}
.btn.loading .app-btn-loading-icon {
  display: block;
}
/* PAGINATION */
.page-item.active .page-link {
  background-color: var(--app-primary-color);
  border-color: var(--app-primary-color);
}
.page-link:focus {
  box-shadow: none;
}
.page-link,
.page-link:hover {
  color: var(--app-primary-color);
}
/* INPUT */
input:focus, textarea:focus, select:focus {
  box-shadow: none !important;
}
/* APP */
.app-logo {
  max-height: 50px;
}
.app-nav-item {
  color: var(--app-primary-color) !important;
  font-weight: 700;
  font-size: 0.8rem;
}
.app-cursor-pointer:hover {
  cursor: pointer;
}
.app-training-wrapper {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 75%);
  z-index: 2;
}
.app-training-item-link {
  position: absolute;
  bottom: 2%;
  color: white;
  left: 50%;
  font-size: 1rem;
  transform: translateX(-50%);
}
.app-training-item-link:hover {
  color: white;
}
.app-training {
  margin-bottom: 50%;
}
#home_partner_carousel-mobile {
  margin-top: 60% !important;
}
#home_partner_carousel {
  margin-top: 10% !important;
}
.app__footer-license {
  background-color: #111c36;
}
.app-mobile-nav {
  position: fixed;
  height: 65px;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: white;
  box-shadow: 2px 1px 9px #dedede;
  border-top: 1px solid #eaeaea;
  z-index: 1000;
}
.app-mobile-nav-item {
  width: 35px;
}
.app-footer {
  margin-bottom: 65px;
}
.app-empty-data {
  width: 100%;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.app-pc-contact {
  position: fixed;
  bottom: 24px;
  left: 24px;
}
/* APP POST */
.app__post-content-wrapper > h1,
.app__post-content-wrapper > h2,
.app__post-content-wrapper > h3,
.app__post-content-wrapper > h4,
.app__post-content-wrapper > h5,
.app__post-content-wrapper > h6 {
  font-weight: 700;
  margin: 1rem 0;
}

.app__post-content-wrapper p,
.app__post-content-wrapper li {
  color: var(--app-primary-color);
  line-height: 1.6;
}

.app__post-content-wrapper strong {
  color: var(--app-primary-color);
}
/* APP FILE ICON */
.app-file-background {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100px;
}
.app-file-background[data-file-extension='.mp3'] {
  background-image: url('/images/audio.png');
}
.app-file-background[data-file-extension='.mp4'] {
  background-image: url('/images/video.png');
}
.app-file-background-wrapper:hover .bg-overlay {
  display: flex !important;
}
.app-file-background.document {
  background-image: url('/images/file.png');
}
.app-file-background.document[data-file-extension='.doc'],
.app-file-background.document[data-file-extension='.docx'] {
  background-image: url('/images/word.png');
}
.app-file-background.document[data-file-extension='.xls'],
.app-file-background.document[data-file-extension='.xlsx'] {
  background-image: url('/images/excel.png');
}
.app-file-background.document[data-file-extension='.csv'] {
  background-image: url('/images/csv.png');
}
.app-file-background.document[data-file-extension='.pdf'] {
  background-image: url('/images/pdf.png');
}
.app-file-background.document[data-file-extension='.txt'] {
  background-image: url('/images/txt.png');
}

/* UTITLITY */
.app__highlight-title {
  position: relative;
}
.app__highlight-title {
  line-height: 36px;
}
.app__highlight-title::after {
  position: absolute;
  content: '';
  background-color: #88003e;
  height: 5px;
  width: 50px;
  bottom: -4px;
  left: 50%;
  transform: translateX(-50%);
}
.app__post-list-title {
  position: relative;
}
.app__post-list-title {
  line-height: 36px;
}
.app__post-list-title::after {
  position: absolute;
  content: '';
  background-color: var(--app-bg-divider);
  height: 3px;
  width: 50px;
  left: 0;
  bottom: -4px;
}
.app__post-list-title.center::after {
  left: 50%;
  transform: translateX(-50%);
}
.app__carousel-title {
  position: absolute;
  top: 20px;
  z-index: 1000;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}
.app-text-truncate {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-text-truncate-1 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.app-translate-x-50 {
  transform: translateX(50%);
}

.app-translate-y-50 {
  transform: translateY(50%);
}

.app-translate-50 {
  transform: translate(50%, 50%);
}
.app-training-page-wrapper > h1,
.app-training-page-wrapper > h2,
.app-training-page-wrapper > h3,
.app-training-page-wrapper > h4,
.app-training-page-wrapper > h5,
.app-training-page-wrapper > h6 {
  color: var(--app-primary-color);
  font-weight: 700;
}
.app-training-page-wrapper p,
.app-training-page-wrapper li {
  color: var(--app-primary-color);
  line-height: 1.6;
}
.app-search-wrapper.loading .bi-search {
  display: none;
}
.app-search-wrapper.loading .loading-icon {
  display: block !important;
}
.app-search-result-wrapper {
  max-height: 490px;
  overflow-y: auto;
}
.app-search-result-item + .app-search-result-item {
  border-top: none;
}
/*APP POST*/
.app-post-description figure > img {
  width: 100%;
  height: auto;
}

.app-table-description {
  max-height: 60vh;
  overflow-y: auto;
}
.app-table-description * {
  background-color: transparent !important;
}
/* RESPONSIVE */
/* Small devices (landscape phones, 576px and up) */
html {
  font-size: 14px;
}
@media (min-width: 576px) {
  .app-dialog-iframe {
    max-width: 60vw;
  }
  .container {
    max-width: 752px;
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  html {
    font-size: 15px;
  }
  .app-image-overlay-wrapper {
    padding-bottom: 40%;
  }
  .container {
    max-width: 976px;
  }
  .app-training-wrapper {
    transform: translate(-50%, 50%);
  }
  .app-training {
    margin-bottom: 8%;
  }
  .app-footer {
    margin-bottom: 0;
  }
  .border-start-md {
    border-left: 1px solid #dee2e6 !important;
  }
  .fs-md-5 {
    font-size: 1.25rem !important;
  }
  .fs-md-6 {
    font-size: 1rem !important;
  }
  .app-logo {
    max-height: 80px;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .app-image-overlay-wrapper {
    padding-bottom: 30%;
  }
  .container {
    max-width: 1140px;
  }
  html {
    font-size: 16px;
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
  .container {
    max-width: 1320px;
  }
}