/*!
* PT. IMAJIKU CIPTA MEDIA
* Copyright 2019-2024 IMAJIKU.
*/

/* = GENERAL
-------------------------------------------------------------*/
/*general*/
p,
ol li,
ul li {
    font-family: var(--font-family-2);
    color: var(--color-text-2);
    font-weight: 400;
    line-height: 1.6;
    font-size: 16px;
}

[data-aspect-ratio] {
    background-color: transparent;
}

/*btn*/
.btn-mjk {
    padding: 10px 15px 12px;
}

.btn-outline {
    border: 1px solid var(--grey-400) !important;
    background-color: var(--white) !important;
    color: var(--color-button-2) !important;
}

.card-product .btn-mjk i {
    font-size: 10px;
    color: #006cb4 !important;
    background-color: var(--white);
    width: 18px;
    height: 18px;
    border-radius: 50%;
    padding: 5px 2px;
}

.btn-mjk:hover i {
    color: var(--white) !important;
}

/*breadcrumb*/
.breadcrumb .breadcrumb-item {
    max-width: 350px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*banner reset*/
.banner-top-content {
    padding: 20px 40px 20px;
}

.banner-top-box {
    height: 550px;
}

.banner-top-box:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    background: linear-gradient(90deg, rgb(29 41 57 / 95%), rgb(255 255 255 / 10%));
}

.banner-top-caption h4 {
    color: var(--white);
    font-size: 16px;
    border: 1px solid var(--white);
    padding: 15px 20px;
    border-radius: 30px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 15px;
    font-family: var(--font-family-2);
}

/*heading*/
.card-heading-box {
    position: relative;
    text-align: center;
    margin-bottom: 15px;
}

.card-heading-box .card-subtitle {
    display: inline-block;
}

.card-heading-box .card-subtitle h4 {
    color: #FAA719;
    font-size: 16px;
    border: 1px solid #FAA719;
    padding: 15px 20px;
    border-radius: 30px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 20px;
    font-family: var(--font-family-2);
}

.card-heading-box .card-title h2 {
    font-size: 40px;
    font-weight: 900;
    color: var(--color-text-1);
    margin-bottom: 10px;
}

.card-heading-box .card-title h3 {
    font-size: 30px;
    font-weight: 900;
    color: var(--color-text-1);
}

.card-heading-box .card-caption p {
    font-size: 18px;
    font-weight: 500;
    color: var(--color-text-1);
}

/*article*/
.article h3 {
    font-size: 24px;
    font-weight: 900;
    color: var(--color-text-1);
}

.article ol li,
.article ul li {
    font-family: var(--font-family-2);
    color: var(--color-text-2);
    font-weight: 400;
    line-height: 1.6;
}

/*sitemap*/
.sitemap-mjk-box {
    margin-bottom: 20px;
}

.sitemap-mjk h3 {
    font-size: 24px;
    font-weight: 900;
    color: var(--color-text-1);
    text-decoration: unset;
}

.sitemap-mjk-item li a {
    color: var(--color-text-1);
    font-family: var(--font-family-2);
    font-size: 16px;
}

.sitemap-mjk-item li a:hover {
    color: #FAA61A;
    text-decoration: unset;
}

/*filter vertical*/
.filter-vertical-box {
    border: 1px solid var(--grey-300);
    padding: 20px;
    border-radius: 24px;
}

.filter-vertical-head {
    padding: 10px 3px 15px;
    background-color: transparent;
}

.filter-vertical-head h3 {
    font-weight: 900;
    font-size: 24px;
}

.filter-vertical-list {
    padding: 0;
}

.filter-vertical-list-item {
    border: 1px solid var(--grey-300);
    padding: 0px 15px 0px;
    border-radius: 12px;
    margin-bottom: 15px;
}

.filter-vertical-list .collapse-mjk-item {}

.filter-vertical-list .collapse-mjk-link.nav-variant-1[aria-expanded="false"]::after,
.filter-vertical-list .collapse-mjk-link.nav-variant-1[aria-expanded="true"]::after {
    background-color: #98A2B3;
    color: var(--white);
    font-size: 11px;
    width: 24px;
    height: 24px;
    top: 15px;
}

.filter-vertical-list .input-group-mjk ul li {
    margin-bottom: 10px;
}

.filter-vertical-input .input-group-mjk ul li {
    margin-top: 10px;
}

.filter-vertical-list .input-group-mjk ul li label {
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
    font-family: var(--font-family-2);
    font-weight: 400;
    width: 85%;
}

.filter-vertical-list .input-group-mjk ul li label:hover {
    color: #006EB7;
    cursor: pointer;
}

.filter-vertical-list .input-group-mjk .custom-radio {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    flex-wrap: wrap;
}

.filter-vertical-list .input-group-mjk .custom-radio input {
    width: 15px;
    height: 15px;
    margin-top: 5px;
    margin-right: 4px;
}

.filter-vertical-list input[type="radio"]:checked+label {
    font-weight: 500;
    color: #006EB7;
}

.filter-vertical-list .list-menu {
    padding-left: 2px;
    margin-bottom: 5px;
}

.filter-vertical-list .see-all {
    font-family: var(--font-family-2);
    font-weight: 400;
    font-size: 14px;
    color: #006EB7;
}

.filter-vertical-list .input-group {
    width: 100%;
    flex-direction: column;
}

/*sublevel radio*/
.filter-vertical-list .input-group .sub-one {
    display: none;
}

.filter-vertical-list .input-group :checked~.sub-one {
    display: block;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;
}

/*filter horizontal*/
.filter-horizontal-label h3 {
    font-weight: 900;
    font-size: 16px;
    margin-bottom: 15px;
}

.filter-horizontal .filter-mjk-group {
    justify-content: flex-end;
}

.filter-horizontal .select-mjk-group label {
    color: var(--color-text-2);
    font-family: var(--font-family-2);
    font-weight: 500;
}

.select-mjk-box {
    border: 1px solid #F2F4F7;
    box-shadow: 0 0 0 1px #F2F4F7 inset;
    background-color: #F9FAFB;
}

.select2-container--open .select2-dropdown--below {
    border: 1px solid #F2F4F7;
    box-shadow: 0 0 0 1px #F2F4F7 inset;
    background-color: #F9FAFB;
}

.select-mjk-box .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-family: var(--font-family-2);
    font-weight: 500;
}

.select2-results__option[aria-selected],
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: var(--color-text-1);
    font-family: var(--font-family-2);
    font-weight: 500;
}

/*product list*/
.card-product .btn-mjk:hover i {
    margin-left: 15px !important;
    color: #006cb4 !important;
}

.card-product {
    border: 1px solid var(--grey-300);
    padding: 15px;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.card-product-box .card-product:hover {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .10);
    -webkit-box-shadow: 0 .5rem 1rem rgb(0 0 0 / 10%);
    -moz-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .10);
}

.card-product .card-media figure {
    background-color: transparent;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
}

.card-product .card-heading-box {
    text-align: left;
    margin: 15px 0;
}

.related-product-slider-box .card-product .card-heading-box {
    min-height: 90px;
}

.card-product .card-heading-box .card-title h3 {
    display: box;
    display: -moz-box;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-box-orient: vertical;
    overflow: hidden;
    width: 100%;
    font-weight: 900;
    font-size: 18px;
    color: var(--color-text-1);
    line-height: 1.4;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.card-product:hover .card-heading-box .card-title h3 {
    color: #FAA719;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.card-product .card-subtitle h5 {
    font-family: var(--font-family-2);
    color: var(--color-text-2);
    font-weight: 600;
    font-size: 14px;
}

.card-product-box .card-product:hover {
    cursor: default;
}

/*product download*/
.card-product-download .card-media {
    width: 50px;
    height: 50px;
}

.card-product-download .card-product .card-subtitle h5 {
    font-size: 14px;
    color: var(--color-text-1);
    line-height: 1.4;
    margin-bottom: 5px;
    font-family: var(--font-family-2);
    font-weight: 600;
}

.card-product-download .card-product .card-heading-box .card-title h3 {
    font-size: 24px;
}

.card-product-download .card-list-label ul {
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    row-gap: 15px;
    column-gap: 15px;
}

.card-product-download .card-list-label ul li {
    font-size: 14px;
    color: var(--color-text-1);
    line-height: 1.4;
    margin-bottom: 5px;
    font-family: var(--font-family-2);
    font-weight: 600;
    background-color: var(--grey-100);
    padding: 10px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}

.card-product-download .card-product .btn-mjk i {
    width: 19px;
    height: 19px;
    border-radius: 5px;
    padding: 4px 2px;
    top: -2px;
    position: relative
}

.card-product-download .card-product .btn-mjk:hover i {
    margin-right: 15px !important;
    margin-left: 0 !important;
}

/*pagination*/
.pagination-mjk-box {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    row-gap: 15px;
    column-gap: 15px;
    justify-content: space-between;
}

.pagination-label h5 {
    font-family: var(--font-family-2);
    color: var(--color-text-2);
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 0;
}

.pagination .page-link {
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    background-color: transparent;
    border: 2px solid var(--grey-300);
    color: #006EB7;
    font-weight: 600;
    width: 35px;
    height: 35px;
}

.pagination .page-link:hover {
    border: 2px solid #006EB7;
}

.pagination .page-item.active .page-link {
    background-color: transparent;
    border: 2px solid #006EB7;
    color: #006EB7 !important;
}

.page-item:first-child .page-link,
.page-item:last-child .page-link {
    width: 30px;
    height: 30px;
    background-color: #006EB7;
    border-radius: 8px !important;
    -moz-border-radius: 8px !important;
    -webkit-border-radius: 8px !important;
}

.page-item:first-child .page-link i,
.page-item:last-child .page-link i {
    color: var(--white);
}

.page-item.disabled .page-link {
    opacity: 0.5;
}

/*product detail*/
.productset-logo {
    position: relative;
    display: inline-block;
}

.productset-logo img {
    max-height: 50px;
}

.productset-title h1,
.productset-title h2,
.productset-title h3 {
    color: var(--color-text-1);
    font-size: 35px;
    font-weight: 900;
    line-height: 1.4;
    margin-bottom: 10px;
}

.productset-title h4 {
    font-family: var(--font-family-2);
    color: var(--color-text-2);
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 0;
}

.productset-title h4 span {
    color: var(--color-text-1);
    font-weight: 500;
}

.productset-info-title h3 {
    color: var(--color-text-1);
    font-size: 24px;
    font-weight: 900;
    line-height: 1.4;
}

.productset-action-label p {
    font-size: 14px;
    color: var(--color-text-1);
}

.productset-info-list {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 20px;
    flex-direction: row;
}

.productset-info-list-item {
    flex: 1;
    background-color: var(--grey-100);
    padding: 15px;
    border-radius: 12px;
}

.productset-info-list-title h5 {
    color: var(--color-text-1);
    font-weight: 600;
    font-family: var(--font-family-2);
    font-size: 16px;
}

.productset-info-list-title h5 i {
    color: var(--grey-500);
}

.productset-info-list-caption {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    flex-direction: row;
    margin-top: 15px;
}

.productset-info-content p {
    color: var(--color-text-1);
    font-weight: 600;
    font-family: var(--font-family-2);
    font-size: 14px;
}

/*product detail show all/less*/
.productset-info-caption {
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

.productset-info-caption.collapsed {
    max-height: 305px;
    position: relative;
}

.productset-info-caption.collapsed:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: -15px;
    width: 100%;
    height: 35px;
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%);
    filter: blur(5px);
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    z-index: 10;
}

.card-career-desc {
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

.card-career-desc.collapsed {
    max-height: 120px;
    position: relative;
}

.card-career-desc.collapsed:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    height: 35px;
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%);
    filter: blur(5px);
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    z-index: 10;
}

#productset-show-more,
.career-show-more {
    font-family: var(--font-family-2);
    font-weight: 500;
    font-size: 14px;
    color: #006EB7;
}

#productset-show-more:hover,
.career-show-more:hover {
    color: #FAA61A;
}

.productset-action .btn-outline.btn-mjk i {
    font-size: 14px;
    color: #006cb4 !important;
    background-color: transparent;
}

.productset-action .btn-outline.btn-mjk:hover i {
    margin-left: 0px !important;
    color: var(--white) !important;
    background-color: transparent;
}

.productset-section-media .xsp-img {
    position: relative;
}

/*product detail form inquiry*/
.modal-header {
    border-radius: 20px 20px 0 0;
    margin-bottom: -1px;
}

.modal-body {
    border-radius: 0 0 20px 20px;
}

.modal-dialog .close {
    background-color: #006EB7;
}

.modal-dialog .close i {
    color: var(--white);
}

.modal-dialog .close:hover {
    background-color: #004d80;
}

.modal-dialog .close:hover i {
    color: var(--white);
}

.modal-body .form-group-mjk label {
    font-size: 14px;
    font-family: var(--font-family-1);
    font-weight: 600;
    margin-bottom: 5px;
    color: var(--color-text-1);
}

.modal-body .form-group-mjk label.error {
    margin-top: 5px;
    font-size: 12px;
}

.modal-body-form .btn-mjk {
    padding: 5px 10px 7px;
}

/*related product*/
.related-product-slider-box .card-product-box {
    margin: 10px;
}

/*swiper button*/
.swiper-button-prev,
.swiper-button-next {
    position: absolute;
    top: 0;
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    cursor: pointer;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    width: 60px;
    opacity: 0.6;
}

.swiper-button-prev {
    left: 0;
}

.swiper-button-next {
    right: 0;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    opacity: 1;
}

.swiper-button-prev .nav-circle-box,
.swiper-button-next .nav-circle-box {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    width: 40px;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    background-color: var(--white);
    text-align: center;
    border: 1px solid var(--white);
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    -webkit-box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    -moz-box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
}

.swiper-button-prev {
    justify-content: flex-start;
}

.swiper-button-next {
    justify-content: flex-end;
}

.swiper-button-prev i,
.swiper-button-next i {
    font-size: 20px;
    color: var(--white);
    background-color: #006eb7;
    width: 30px;
    height: 30px;
    padding: 5px;
    border-radius: 6px;
}

.slick-dotted.slick-slider {
    margin-bottom: 0;
}

/*hidden swipper button default*/
.swiper-button-next:after,
.swiper-button-prev:after {
    display: none;
}

.swiper-pagination {
    display: none;
}

.swiper-button-lock {
    display: none !important;
}


/*swiper detail product slider*/
.productset-section-media {
    position: relative;
    padding: 20px;
    overflow: hidden;
}

.productset-section-media .swiper-container {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
}

.productset-section-media .swiper-slider-thumbnail {
    width: 100%;
    height: 100%;
    padding: 0;
}

.productset-section-media .swiper-slider-thumbnail .swiper-wrapper .swiper-slide {
    opacity: 0.5;
    overflow: hidden;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    cursor: pointer;
}

.productset-section-media .swiper-slider-thumbnail .swiper-wrapper .swiper-slide:hover {
    opacity: 1;
    border: 2px solid #006eb7;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.productset-section-media .swiper-slider-thumbnail .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
    opacity: 1;
    border: 2px solid #006eb7;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.productset-section-media .lightbox-images figure,
.productset-section-media .lightbox-video figure {
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.swiper-slider-thumbnail .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
}

.productset-section-media .swiper-button-prev {
    justify-content: flex-start;
    align-items: flex-end;
    top: auto;
    top: auto;
    bottom: -73px;
    left: -15px;
}

.productset-section-media .swiper-button-next {
    justify-content: flex-end;
    align-items: flex-end;
    top: auto;
    bottom: -73px;
    left: auto;
    right: -15px;
}

.productset-section-media .swiper-button-prev .nav-circle-box,
.productset-section-media .swiper-button-next .nav-circle-box {
    height: 30px;
    width: 30px;
}

.productset-section-media .swiper-button-prev i,
.productset-section-media .swiper-button-next i {
    font-size: 14px;
    width: 20px;
    height: 20px;
    padding: 3px;
}

.productset-section-media .swiper-slider-thumbnail {
    width: 50%;
    overflow: hidden;
    margin: 0 auto;
}

.productset-section-media .swiper-button-prev {
    left: 100px;
}

.productset-section-media .swiper-button-next {
    right: 100px;
}

/*.productset-section-media .swiper-free-mode>.swiper-wrapper {
    justify-content: center;
    overflow: hidden;
}

.productset-section-media .swiper-slider-thumbnail .swiper-wrapper .swiper-slide {
    width: 100px !important; 
    height: 100px;
}

.swiper-slider-thumbnail .swiper-slide img {
    width: 100px;
    height: 100px;
    object-fit: contain;
}*/

/*icon preview glightbox*/
.lightbox-images,
.lightbox-video {
    position: relative;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.glightbox-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 60px;
    width: 60px;
    border: 2px solid var(--white);
    background-color: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(4px);
    -moz-backdrop-filter: blur(4px);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    z-index: 10;
}

.glightbox-icon i {
    font-size: 20px;
    color: var(--white);
}

.lightbox-images img,
.lightbox-video img {
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
}

.lightbox-images:hover img,
.lightbox-video:hover img {
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    filter: brightness(80%);
    -webkit-filter: brightness(80%);
    -moz-filter: brightness(80%);
    object-fit: cover;
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
}

.lightbox-video:hover .glightbox-icon {
    background-color: #006eb7;
    border-color: #006eb7;
}

/*small version for thumbnail slider*/
.glightbox-icon.small {
    width: 30px;
    height: 30px;
}

.glightbox-icon.small i {
    font-size: 10px;
}

/*product detail extra description*/
.productset-desc-extra-title {
    position: relative;
    display: inline-block;
    background-color: var(--grey-100);
    margin-bottom: 15px;
    border-radius: 16px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    padding: 10px 20px 10px;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    -webkit-box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    -moz-box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    border: 1px solid #E4E7EC;
    box-shadow: 0 0 0 1px #E4E7EC inset;
}

.productset-desc-extra-title h2 {
    font-family: var(--font-family-2);
    color: var(--color-text-1);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 0;
}

.productset-desc-extra-content {
    position: relative;
    background-color: var(--grey-100);
    padding: 15px 15px 10px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    margin-bottom: 15px;
}

.productset-desc-extra {
    position: relative;
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 15px;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--grey-200);
    padding: 10px 0 15px;
}

.productset-desc-extra:last-child {
    border: none;
}

.productset-desc-extra-item {
    position: relative;
    width: calc((100% - 45px) / 4);
}

.productset-desc-label p {
    font-weight: 500;
    margin-bottom: 5px;
}

.productset-desc-caption p {
    font-family: var(--font-family-2);
    color: var(--color-text-1);
    font-weight: 500;
    line-height: 1.6;
    font-size: 16px;
    margin-bottom: 5px;
}

.productset-desc-extra th,
.productset-desc-extra td {
    font-size: 16px;
    font-family: var(--font-family-2);
}

/*share button big*/
.share-button-big-box {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 15px;
    flex-wrap: wrap;
    background-color: #E5F5FF;
    padding: 15px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    margin-bottom: 15px;
}

.share-button-big-item {
    position: relative;
    width: calc((100% - 50px) / 2);
}

.share-button-big-item .share-network ul {
    row-gap: 10px;
    column-gap: 10px;
}

.share-button-big-item .share-network ul li .btn {
    width: 40px;
    height: 40px;
}

.share-button-big-item .share-network ul li .btn i {
    font-size: 16px;
}

.share-button-big-item .card-heading-box {
    margin-bottom: 0;
}

.share-button-big-item .card-title h5 {
    color: var(--color-text-1);
    font-weight: 600;
    line-height: 1.6;
    font-size: 20px;
    margin-bottom: 0;
}

.share-network {
    justify-content: center;
}

/*banner CTA small*/
.banner-cta {
    position: relative;
    height: 100%;
    z-index: 1;
}

.banner-cta .img-banner {
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

.banner-cta .banner-caption-box {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    gap: 15px;
    padding: 40px 30px;
    min-height: 165px;
}

.banner-caption {
    text-align: left;
    padding: 0;
    margin: 0;
    align-items: flex-start;
    background-color: transparent;
    backdrop-filter: unset;
    -webkit-backdrop-filter: unset;
    -moz-backdrop-filter: unset;
}

.banner-caption h1,
.banner-caption h2,
.banner-caption h3 {
    font-weight: 900;
}

.banner-bg-box {
    display: block;
}

.banner-bg-box img {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    object-fit: cover;
    object-position: center;
}

.banner-bg-box:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgb(183 183 183 / 0%);
    z-index: -1;
}

/*banner CTA big*/
.banner-cta-big .banner-caption-box {
    flex-direction: column;
    justify-content: flex-start;
    min-height: 600px;
}

.banner-cta-big .banner-caption {
    align-items: center;
    width: 100%;
    margin-bottom: 15px;
}

.banner-cta-big .banner-caption p {
    text-align: center;
    line-height: 1.5;
}

.banner-cta-big .banner-caption h1,
.banner-cta-big .banner-caption h2,
.banner-cta-big .banner-caption h3 {
    font-size: 40px;
    margin-bottom: 15px;
}

.btn-outline.btn-mjk i {
    font-size: 10px;
    color: var(--white) !important;
    background-color: #006cb4;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    padding: 5px 2px;
}

.btn-outline.btn-mjk:hover i {
    margin-left: 15px !important;
    background-color: var(--white);
    color: #006cb4 !important;
}

/*about*/
.card-about-box {
    position: relative;
    margin-bottom: 15px;
}

.card-about-box .card-heading-box {
    text-align: left;
    margin-bottom: 20px;
}

.card-about-box .card-subtitle h5 {
    font-family: var(--font-family-2);
    color: var(--color-text-1);
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}

.card-about-box .card-heading-box .card-title h3 {
    font-size: 34px;
    margin-bottom: 10px;
}

.card-about-box .card-media img {
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.card-about-box .card-heading-box .card-caption p {
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-2);
}

/*tv channel*/
.card-product-channel .card-product:hover {
    cursor: pointer;
}

.card-product-channel .card-product {
    padding: 0;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
}

.card-product-channel .card-product .card-media figure {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-top-left-radius: 12px;
    -webkit-border-top-left-radius: 12px;
    -moz-border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    -webkit-border-top-right-radius: 12px;
    -moz-border-top-right-radius: 12px;
}

.card-product-channel .card-product .card-heading-box {
    margin: 15px 10px;
}

.card-product-channel .glightbox-icon {
    height: 40px;
    width: 40px;
}

.card-product-channel .glightbox-icon i {
    font-size: 16px;
}

.card-media {
    position: relative;
}

/*tracking number*/

.emptypage {
    width: 450px;
}

.emptypage-tracking-box .emptypage-img img {
    width: 100%;
    height: 100%;
    margin-bottom: 20px;
}

.orderitemset {
    background-color: #F9FAFB;
    border: 1px solid var(--grey-200);
}

.orderitemset-action {
    padding: 15px 0 15px;
    justify-content: space-between;
    border-bottom: 1px solid var(--grey-200);
    border-top: unset;
}

.orderitemset-action h3 {
    font-weight: 900;
    font-size: 24px;
    margin-bottom: 0;
}

.orderitemset-head {
    padding: 15px 0 15px;
    border-bottom: unset;
}

.orderitemset.variant-2 .orderitemset-head-date h3 {
    font-weight: 900;
    font-size: 30px;
    margin-bottom: 10px;
}

.orderitemset.variant-2 .orderitemset-head-date p {
    color: var(--color-text-2);
}

.orderitemset.variant-2 .orderitemset-product-item-list li {
    padding: 0;
    border: unset;
}

.card-product-simple .caps-desc h3 {
    font-size: 24px;
    font-weight: bold;
}

.card-product-simple .caps-desc a h3:hover {
    color: #FAA719;
}

.orderitemset-product .card-product-simple .caps-desc p {
    font-size: 14px;
}

.orderitemset-product .card-product-simple .productset-desc-extra-item {
    min-width: 100px;
    width: auto;
}

.orderitemset-shipping {
    position: relative;
    width: 100%;
}

.orderitemset-shipping .productset-desc-label p {
    font-size: 14px;
}

.orderitemset-shipping .productset-desc-caption p {
    font-size: 14px;
}

.orderitemset-shipping .productset-desc-extra-item {
    width: calc((100% - 30px) / 3);
}

.ohi-detail-delivery-tracking {
    position: relative;
    width: 100%;
}

.wiztrack-item .wiztrack-item-desc {
    width: 100%;
    justify-content: space-between;
}

.wiztrack-item .statusbox {
    background-color: var(--white);
}

.wiztrack-item .wiztrack-item-desc {
    padding-left: 10px;
}

.wiztrack-item .wiztrack-item-point .wizp-circle {
    top: 4px;
    left: 0px;
    background-color: #FAA719;
    border: 4px solid #FEECCD;
    width: 17px;
    height: 17px;
}

.wiztrack-item .wiztrack-item-desc::before {
    background-color: #FAA719;
}

.wiztrack-item .wiztrack-item-desc .wiztrack-item-desc-note h4 {
    font-size: 20px;
    font-weight: 600;
    color: var(--color-text-1);
}

.wiztrack-item .wiztrack-item-desc .wiztrack-item-desc-date p {
    font-size: 14px;
    margin: 0px 0 5px;
    color: var(--color-text-2);
}

.wiztrack-item .wiztrack-item-desc .wiztrack-item-desc-note p {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 20px 0;
    color: var(--color-text-1);
}

.statusbox-item p {
    font-family: var(--font-family-2);
    color: var(--color-text-1);
    font-weight: 600;
}

.statusbox {
    padding: 10px 10px 10px;
}

/*contact*/
.section-bg-blue {
    background-color: #E5F5FF;
    position: relative;
}

.section-bg-blue .card-heading-box .card-subtitle h4 {
    color: #006EB7;
    border: 1px solid #006EB7;
}

.contact-map-box iframe {
    width: 100%;
    height: 450px;
}

.contact-address h4 {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
}

.contact-address .list-mjk-icon-item-img i {
    font-size: 20px;
    margin-top: 5px;
    color: #98A2B3;
}

.contactset-desc-extra-box {
    position: relative;
    height: 50%;
}

.contactset-desc-extra {
    position: relative;
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 15px;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--grey-200);
    padding: 10px 0 15px;
    height: 100%;
    align-content: center;
}

.contactset-desc-extra:last-child {
    border: none;
}

.contactset-desc-extra-item {
    position: relative;
    width: calc((100% - 35px) / 2);
}

.contactset-desc-label p {
    font-family: var(--font-family-2);
    font-weight: bold;
    margin-bottom: 5px;
    font-size: 16px;
    color: var(--color-text-1);
}

.contactset-desc-caption p {
    color: var(--color-text-2);
    font-weight: 400;
    line-height: 1.6;
    font-size: 16px;
    margin-bottom: 5px;
}

.form-contact-box {
    position: relative;
    background-color: var(--white);
    padding: 30px;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.form-contact-box .title-primary {
    margin-bottom: 20px;
}

.form-contact-box .title-primary h3 {
    font-size: 30px;
    font-weight: bold;
}

.form-contact-box .select-mjk-box {
    background-color: var(--white);
    border-color: #ced4da;
    color: var(--color-text-1);
    border-radius: var(--bs-border-radius);
}

.form-contact-box .form-group-mjk .form-control {
    height: 40px;
}

.form-contact-box .form-group-mjk textarea.form-control {
    height: auto;
}

.select-mjk-box .error {
    margin-bottom: 15px;
}

/*logo partner*/
.partner-logo-list.variant-grid {
    row-gap: 10px;
    column-gap: 10px;
}

.partner-logo-list.variant-grid {
    grid-template-columns: repeat(5, 1fr);
}

.partner-logo-list.variant-grid .partner-logo-item {
    box-shadow: none;
    border: none;
}

.partner-logo-list.variant-grid .partner-logo-item-img {
    height: 50px;
}

/*nav pills*/
.tab-nav-pills {
    position: relative;
    text-align: center;
}

.tab-nav-pills .nav-pills-menu {
    position: relative;
    display: inline-block;
    margin: 0 auto;
}

.tab-nav-pills .nav-pills {
    justify-content: center;
    margin-bottom: 30px;
    padding: 6px;
    background-color: #F2F4F7;
    border-radius: 16px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border: 1px solid #E4E7EC;
}

.nav-pills .nav-link {
    color: var(--color-text-1);
    font-size: 16px;
    font-weight: 600;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
}

.tab-nav-pills .nav-pills .nav-link.active,
.tab-nav-pills .nav-pills .show>.nav-link {
    color: var(--color-text-1);
    background-color: var(--white);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .10);
    -webkit-box-shadow: 0 .5rem 1rem rgb(0 0 0 / 10%);
    -moz-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .10);
}

.tab-nav-pills .tab-content .fade {
    transition: opacity .3s linear;
}

/*about home*/
.card-shadow-box {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .10);
    -webkit-box-shadow: 0 .5rem 1rem rgb(0 0 0 / 10%);
    -moz-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .10);
    padding: 30px;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.card-about-home .card-media img {
    max-width: 80px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    margin-bottom: 10px;
}

.card-about-home .card-heading-box .card-title h3 {
    font-size: 24px;
}

/*promotion-slider-box*/
.promotion-slider-box {
    position: relative;
}

.promotion-slider-box .card-media figure {
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.promotion-slider-box .card-media img {
    max-height: 500;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.promotion-slider-box .swiper-slide,
.promotion-slider-box .swiper-wrapper,
.promotion-slider-box .swiper {
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    padding-bottom: 15px;
}

.promotion-slider-box .swiper-button-prev,
.promotion-slider-box .swiper-button-next {
    display: none;
}

.promotion-slider-box .swiper-pagination {
    display: block;
}

.slider-column .swiper-pagination-bullet-active {
    width: 20px;
    border-radius: 5px;
}

/*hero intro*/
.hero-intro-box {
    position: relative;
}

.card-hero-box {
    position: relative;
}

.card-hero-box .card-hero {
    position: relative;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 15px;
    background-color: #006EB7;
}

.card-hero-box .card-hero:after {
    display: block;
    content: '';
    background-image: url(../images/content/img-bg-hero.png);
    background-position: center left;
    background-size: contain;
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    z-index: 1;
}

.card-hero-box .card-hero .card-media-box {
    flex: 1.5;
    z-index: 2;
}

.card-hero-box .card-hero .card-media-box img {
    width: 100%;
}

.card-hero-box .card-heading-box {
    flex: 1;
}

.card-hero-box .card-title {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 80%;
    margin: 0 auto;
}

.card-hero-box .card-title h1 {
    font-size: 65px;
    font-weight: 900;
    text-align: left;
    color: var(--white);
}

.banner-cta-hero-box {
    position: relative;
}

.banner-cta-hero .banner-caption-box {
    flex-direction: column;
    justify-content: flex-start;
    min-height: 200px;
    max-width: 80%;
    margin: 0 auto;
}

.banner-cta-hero .banner-caption {
    align-items: center;
    width: 100%;
    margin-bottom: 15px;
}

.banner-cta-hero .banner-caption p {
    text-align: center;
    line-height: 1.4;
    font-size: 24px;
    font-weight: 500;
}

.banner-cta-hero .banner-caption h1,
.banner-cta-hero .banner-caption h2,
.banner-cta-hero .banner-caption h3 {
    font-size: 40px;
    margin-bottom: 15px;
}

.banner-cta-hero .img-banner {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}

/*career*/
.card-career {
    border: 1px solid var(--grey-300);
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    padding: 20px 15px 15px;
}

.card-career-info-box {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    width: 100%;
    gap: 15px;
}

.card-career-action {
    width: 10%;
    border-top: unset;
    padding: 0;
}

.card-career-info ul li {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 15%;
    margin-bottom: 10px;
    flex-wrap: wrap;
    list-style: none;
    padding-left: 0;
    gap: 15px;
}

.card-career-info {
    position: relative;
    flex: 1;
}

.card-career-info-icon i {
    color: #98A2B3;
    font-size: 16px;
}

.card-career-info-label p {
    font-weight: 600;
    line-height: 1.6;
    font-size: 14px;
    margin-bottom: 5px;
    color: var(--color-text-2);
}

.card-career-info-caption p {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 14px;
    color: var(--color-text-1);
}

.card-career-desc-accordion {
    position: relative;
    width: 100%;
}

.collapse-mjk-item.variant-career {
    border: none;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--grey-300);
    border-radius: 0;
}

.collapse-mjk-item.variant-career .collapse-mjk-link {
    padding: 0;
    border: none;
}

.collapse-mjk-item.variant-career .collapse-mjk-link.nav-variant-2[aria-expanded="false"]::after,
.collapse-mjk-item.variant-career .collapse-mjk-link.nav-variant-2[aria-expanded="true"]::after {
    height: 18px;
    font-size: 24px;
    color: #006EB7;
}

.collapse-mjk-item.variant-career .collapse-mjk-item.variant-career:hover {
    box-shadow: unset;
}

.collapse-mjk-item.variant-career:hover {
    box-shadow: unset;
}

.career-link-title h4 {
    font-size: 16px;
    color: #006EB7;
    font-weight: 600;
}

.collapse-mjk-item.variant-career .collapse-mjk-body {
    padding: 0;
    border: none;
}

.card-career-desc p {
    margin-bottom: 5px;
}

.card-career-desc ul,
.card-career-desc ol {
    margin-bottom: 5px;
}

.card-career-title h3 {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 0;
}

.card-career-title-sub h4 {
    font-weight: bold;
    font-size: 18px;
}

.card-career-label h5 {
    color: var(--color-text-2);
    font-weight: 600;
    font-size: 16px;
}

.card-career-info ul {
    margin-bottom: 0;
}

/*career detail*/
.form-career-box {
    position: relative;
    border: 1px solid var(--grey-300);
    background-color: var(--white);
    padding: 30px;
    border-radius: 24px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
}

.form-career-box .select-mjk-box {
    background-color: var(--white);
    border-color: #ced4da;
    color: var(--color-text-1);
    border-radius: var(--bs-border-radius);
}

.custom-file-button input[type="file"] {
    margin-left: -2px !important;
}

.custom-file-button input[type="file"]::-webkit-file-upload-button {
    display: none;
}

.custom-file-button input[type="file"]::file-selector-button {
    display: none;
}

.custom-file-button:hover label {
    cursor: pointer;
}

.custom-file-button .form-control {
    font-size: 14px;
    color: var(--color-text-1) !important;
    align-content: center;
}

.form-text {
    font-size: 12px;
    color: #919191;
}

.form-group label {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-1);
    margin-bottom: 5px;
    font-family: var(--font-family-2);
}

.form-group .custom-file-button .input-group-text {
    color: #006EB7;
    margin-bottom: 0px;
}

.form-group .error {
    font-size: 12px;
    font-weight: 400;
}

/*search*/
.card-searching {
    align-items: center;
}

.card-searching-action {
    padding: 0 30px;
}

.card-searching-action .btn-mjk {
    padding: 7px 15px 8px;
    border-radius: 10px;
}

.card-searching-action .btn-mjk i {
    font-size: 10px;
    color: #006cb4 !important;
    background-color: var(--white);
    width: 18px;
    height: 18px;
    border-radius: 50%;
    padding: 5px 2px;
}

.card-searching-action .btn-mjk:hover i {
    margin-left: 15px !important;
    color: #006cb4 !important;
}