.theme-item-img {
    position: relative;
    background-color: var(--white);
}

.theme-item-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.theme-index-category .theme-item-img:first-of-type {
    grid-column: span 2;
    grid-row: span 2;
}

.theme-index-category .theme-item-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 1.5rem 1rem;
}

.theme-index-category .theme-item-mask .theme-item-mask-text {
    color: var(--white);
}

.theme-index-category .theme-item-img:first-of-type .theme-item-mask .theme-item-mask-text {
    font-size: 1.5rem;
}

/* List Products */

.grid-list-products {
    margin-bottom: 5rem;
}

.grid-list-products .grid-item-product {
    padding: 1.5rem;
}

.grid-list-products .grid-item-product:hover {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    transition: box-shadow 0.3s ease;
}

.grid-list-products .grid-item-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.grid-list-products .grid-item-icon .icon-more {
    display: block;
    width: 10rem;
    height: 10rem;
    -webkit-mask-image: url('../images/icon-more.png');
    mask-image: url('../images/icon-more.png');
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--font-color);
    margin-bottom: 1.25rem;
}

.grid-list-products .grid-item-icon .title {
    font-size: 1.25rem;
}

/* Show product */
.grid-show-product {
    position: relative;
    align-items: flex-start;
}

.grid-show-product-thumbs {
    position: sticky;
    top: 0;
}

.scroll-gallery-swiper .item-show-thumb,
.scroll-thumbs-swiper .item-show-thumb {
    background: var(--white);
    cursor: pointer;
}

.scroll-gallery-swiper .item-show-thumb img,
.scroll-thumbs-swiper .item-show-thumb img {
    display: block;
    width: 100%;
    border-radius: .3125rem;
    aspect-ratio: 1 / 1;
}

.scroll-thumbs-swiper .item-show-thumb svg{
    display: block;
    fill: var(--white);
    width: 100% ;
    height: 100% ;
    border-radius: .3125rem;
}

.scroll-gallery-swiper {
    margin-bottom: 1.875rem;
}

.scroll-thumbs-swiper .swiper-slide-thumb-active .item-show-thumb {
    border: 1px solid var(--font-color);
    border-radius: .3125rem;
}

.grid-show-product-info {
    background-color: var(--white);
    padding: 1.875rem 3.125rem;
    border-radius: .3125rem;
}

.grid-show-product-info .category-title {
    font-size: 1.25rem;
    margin-bottom: .625rem;
}

.grid-show-product-info .product-title {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.grid-show-product-info .product-no {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.grid-show-product-info .product-tips {
    background-color: #efefef;
    padding: 1rem 1.875rem;
    border-radius: var(--border-radius-size);
    margin-bottom: 1rem;
}

.grid-show-product-info .product-tips .product-tips-title {
    background: url(../images/icon-circle-tik.png) no-repeat left center/1.25rem;
    font-size: 1.5rem;
    padding-left: 1.875rem;
}

.grid-show-product-info .product-tips .product-tips-content {
    font-size: 1.125rem;
    padding: 0 1.875rem;
}

.product-filter-condition .product-filter-condition-item {
    display: flex;
    flex-direction: column;
}

.product-filter-condition .product-filter-condition-item:not(:last-child) {
    margin-bottom: 1.5rem;
}

.product-filter-condition .product-filter-condition-item input[type="text"] {
    padding: .5rem 1rem;
}

.product-filter-condition .product-filter-condition-item .product-filter-item-title {
    font-size: 1.25rem;
    margin-bottom: 1.25rem;
}

.product-filter-condition .product-filter-condition-item-row {
    flex-direction: row;
    justify-content: space-between;
    padding-top: 1.25rem;
}

.product-filter-item-color {
    display: flex;
    flex-wrap: wrap;
}

.product-filter-item-color .item-color {
    cursor: pointer;
}

.product-filter-item-color .item-color:not(:last-child) {
    margin-right: 1rem;
}

.product-filter-item-color .item-color input[type="radio"] {
    display: none;
}

.product-filter-item-color .item-color input[type="radio"]+label {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2.5rem;
    height: 2.5rem;
    background-color: var(--filter-color);
    border-radius: 50%;
    border: 3px solid var(--filter-color);
}

.product-filter-item-color .item-color input[type="radio"]+label>span {
    display: block;
    width: 2.25rem;
    height: 2.25rem;
    background-color: var(--filter-color);
    border: 3px solid var(--filter-color);
    border-radius: 50%;
    flex-shrink: 0;
}

.product-filter-item-color .item-color input[type="radio"]:checked+label {
    border-color: var(--font-color);
}

.product-filter-item-color .item-color input[type="radio"]:checked+label>span {
    border-color: var(--white);
}

.product-filter-item-size,
.product-filter-item-text {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem 1rem;
}

.product-filter-item-size .item-size,
.product-filter-item-text .item-text {
    cursor: pointer;
}

.product-filter-item-size .item-size input[type="radio"],
.product-filter-item-text .item-text input[type="radio"] {
    display: none;
}

.product-filter-item-size .item-size input[type="radio"]+label,
.product-filter-item-text .item-text input[type="radio"]+label {
    display: block;
    background-color: #efefef;
    font-size: 1.125rem;
    border-radius: .3125rem;
    padding: .625rem 1rem;
}

.product-filter-item-size .item-size input[type="radio"]:checked+label,
.product-filter-item-text .item-text input[type="radio"]:checked+label {
    background-color: var(--font-color);
    color: var(--white);
}

.product-filter-item-conditions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.product-filter-item-conditions .item-condition {
    margin-right: 1rem;
    margin-bottom: 1rem;
}

.product-filter-item-conditions .item-condition input[type="checkbox"] {
    display: none;
}

.product-filter-item-conditions .item-condition input[type="checkbox"]+label {
    font-size: 1.125rem;
}

.product-filter-item-conditions .item-condition input[type="checkbox"]+label>span {
    display: flex;
    align-items: center;
    font-size: 1.25rem;
}

.product-filter-item-conditions .item-condition input[type="checkbox"]+label>span::before {
    content: "";
    display: block;
    background: var(--white);
    width: 1.25rem;
    height: 1.25rem;
    border: 1px solid #9a9a9a;
    border-radius: 3px;
    margin-right: .5rem;
}

.product-filter-item-conditions .item-condition input[type="checkbox"]:checked+label>span::before {
    background: var(--white) url(../images/icon-green-tik.png) no-repeat center center/1.25rem;
}

.product-filter-item-quantity {
    display: flex;
    align-items: center;
}

.product-filter-item-quantity .product-filter-item-title {
    margin-right: 1rem;
    margin-bottom: 0 !important;
}

.product-filter-item-quantity .product-filter-item-quantity-input {
    display: flex;
    align-items: content;
}

.product-filter-item-quantity .product-filter-item-quantity-input input,
.product-filter-item-quantity .product-filter-item-quantity-input button {
    outline: none;
}

.product-filter-item-quantity .product-filter-item-quantity-input button {
    background-color: var(--white);
    font-size: 1.25rem;
    color: var(--font-color);
    padding: .3125rem .625rem;
    border: 1px solid #efefef;
}

.product-filter-item-quantity .product-filter-item-quantity-input input {
    background-color: var(--white);
    width: 5rem;
    font-size: 1rem;
    color: var(--font-color);
    text-align: center;
    border: 1px solid #efefef;
    border-left: 0;
    border-right: 0;
    padding: .3125rem 0;
}

.product-filter-item-quantity .product-filter-item-quantity-input .minus {
    border-top-left-radius: .3125rem;
    border-bottom-left-radius: .3125rem;
}

.product-filter-item-quantity .product-filter-item-quantity-input .plus {
    border-top-right-radius: .3125rem;
    border-bottom-right-radius: .3125rem;
}

.product-filter-condition-item-row .theme-social-media .theme-social-media-item .theme-social-media-inner {
    width: 1.875rem;
    height: 1.875rem;
}

.product-filter-condition-item-btns {
    --column-gap: 1.25rem;
    --row-gap: 1.25rem;
    /* margin-top: 3.125rem; */
}

.product-filter-condition-item-btns .product-filter-default-btn {
    display: block;
    background-color: var(--white);
    font-size: 1.25rem;
    border-radius: .3125rem;
    border: 1px solid var(--font-color);
    padding: .3125rem 0;
    cursor: pointer;
}

.product-filter-condition-item-btns .product-filter-default-btn:hover {
    background-color: var(--font-color);
    color: var(--white);
    transition: background-color 0.3s ease;
}

.product-filter-condition-item-btns .product-filter-span-btn {
    background-color: var(--font-color);
    color: var(--white);
    grid-column: span 2;
}

.theme-section-left-title {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3.125rem;
}

.theme-section-left-title .title {
    padding-bottom: 0;
}

.theme-section-title-buttons {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.theme-section-title-buttons .swiper-button-prev,
.theme-section-title-buttons .swiper-button-next {
    position: initial;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    border: 2px solid var(--font-color)
}

.theme-section-title-buttons .swiper-button-prev::after,
.theme-section-title-buttons .swiper-button-next::after {
    font-size: 1.25rem;
    color: var(--font-color);
}

.scroll-recommended-products-swiper .grid-item-product,
.scroll-related-products-swiper .grid-item-product {
    height: inherit;
}

.theme-show-product-details {
    position: relative;
    background-color: var(--white);
    padding: 1rem 3.125rem 0;
    border-radius: var(--border-radius-size);
}

.theme-show-product-details .tab-title {
    display: flex;
    border-bottom: 2px solid #efefef;
}

.theme-show-product-details .tab-title-item {
    position: relative;
    font-size: 1.5rem;
    padding: .625rem 1.25rem;
    cursor: pointer;
}

.theme-show-product-details .tab-title-item.active::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    border-top: 2px solid var(--font-color);
}

.theme-show-product-details .tab-content-item {
    display: none;
    padding: 3.125rem 1.25rem;
}

.theme-show-product-details .tab-content-item.active {
    display: block;
}

.theme-show-product-details .tab-content-item img {
    display: block;
    max-width: 100%;
    margin: 0 auto ;
}

.theme-show-product-details .tab-content-item ol{
    padding-left: 1rem ;
}

.theme-show-product-details .tab-content-item ol li{
    list-style: inherit;
}

.theme-show-product-details .tab-content-item table{
    border-top: 1px solid #a1a1a1;
    border-left: 1px solid #a1a1a1;
}

.theme-show-product-details .tab-content-item td{
    border-bottom: 1px solid #a1a1a1;
    border-right: 1px solid #a1a1a1;
    padding: 0.5rem 1rem;
}

.tab-content-item-parameters {
    --row-gap: 1.25rem;
}

.tab-content-item-parameters .item-parameter {
    display: flex;
    justify-content: space-between;
    font-size: 1.25rem;
    padding: .625rem 0;
    border-bottom: 1px solid #efefef;
}

.tab-content-item-parameters .item-parameter span:nth-child(2) {
    text-align: right;
    max-width: 70%;
}

.tab-content-item-circle {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.tab-content-item-circle .item-circle {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tab-content-item-circle .item-circle .icon-circle-bg {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--font-color);
    width: 5rem;
    height: 5rem;
    margin-bottom: 1rem;
}

.tab-content-item-circle .item-circle .icon-circle-bg .icon-mask-inner {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    background-color: var(--white);
}

.tab-content-item-circle .item-circle .item-circle-content {
    text-align: center;
    max-width: 8rem;
}

.tab-content-item-circle .item-circle-line {
    display: block;
    width: calc((100% - 8rem * 5) / 4 - 1.25rem);
    border-top: 2px dashed var(--font-color);
    transform: translateY(2.5rem);
}

/* About */
.theme-about-thumbs {
    margin-bottom: 3rem;
}

.theme-about-thumbs .theme-about-thumbs-item {
    position: relative;

}

.theme-about-thumbs .theme-about-thumbs-item .theme-about-thumbs-img img {
    display: block;
    width: 100%;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.theme-about-thumbs .theme-about-thumbs-item .theme-about-thumbs-content {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
    padding: 1.5rem;
    color: var(--white);
}

.theme-about-thumbs .theme-about-thumbs-item .theme-about-thumbs-content .title {
    font-size: 1.5rem;
}

.theme-about-icons {
    margin-bottom: 3rem;
}

.theme-about-icons .theme-about-icons-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--white);
    padding: 3.125rem 2rem;
    border-radius: var(--border-radius-size);
}

.theme-about-icons .theme-about-icons-item:hover {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.theme-about-icons .theme-about-icons-item .about-items-icon {
    background-color: #f1f1f1;
    width: 6rem;
    height: 6rem;
    margin-bottom: 3rem;
}

.theme-about-icons .theme-about-icons-item .about-items-icon .icon-mask-inner {
    width: 2.25rem;
    height: 2.25rem;
}

.theme-about-icons .theme-about-icons-item .about-items-data {
    display: flex;
    align-items: flex-end;
}

.theme-about-icons .theme-about-icons-item .about-items-data .num {
    font-size: 2rem;
    line-height: 2rem;
}

.theme-about-icons .theme-about-icons-item .about-items-data .unit {
    font-size: 1rem;
}

.theme-about-icons .theme-about-icons-item .about-items-content {
    font-size: 1.25rem;
    text-align: center;
}

.theme-about-btn {
    display: flex;
    justify-content: center;
}

.theme-about-btn a {
    display: flex;
    align-items: center;
    background-color: var(--font-color);
    font-size: 1.25rem;
    color: var(--white);
    padding: 1rem 3rem;
    border-radius: var(--border-radius-size);
}

.theme-about-btn a .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.5rem;
    height: 1.25rem;
    -webkit-mask-image: url(../images/icon-arrow-right.png);
    mask-image: url(../images/icon-arrow-right.png);
    background-color: var(--white);
    margin-left: .625rem;
    transition: all 0.3s ease;
}

.theme-about-btn a:hover .icon {
    transform: translateX(.625rem);
}

.theme-service {
    background: url(../images/index-bg-service.jpg) no-repeat center center/cover;
}

.theme-service-content {
    padding-top: 1.25rem;
}

.theme-service-content .theme-service-item {
    display: flex;
    flex-direction: column;
    background-color: var(--white);
    padding: 2rem;
    border-radius: var(--border-radius-size);
    transition: all 0.3s ease;
}

.theme-service-content .theme-service-item:hover {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
    transform: translateY(-1.25rem);
}

.theme-service-content .theme-service-item .num {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    background-color: var(--font-color);
    font-size: 1.875rem;
    font-weight: bold;
    color: var(--white);
}

.theme-service-content .theme-service-item .title {
    font-size: 1.5rem;
    padding: 1rem 0;
}

.theme-service-content .theme-service-item .desc {
    font-size: 1.125rem;
    height: calc(1.25rem * 6);
    overflow: hidden;
    margin-bottom: 2rem;
}

.theme-service-content .theme-service-item .more-btn {
    width: 100%;
    color: var(--font-color);
    padding: .625rem 0;
    border: 1px solid var(--font-color);
    text-align: center;
}

.theme-service-content .theme-service-item .more-btn:hover {
    background-color: var(--font-color);
    color: var(--white);
}

.theme-contact-form {
    width: 60%;
    margin: 0 auto;
}

.form-elements .form-elements-row {
    display: flex;
    /*gap: 1.25rem;*/
}

.form-elements .form-elements-row:not(:last-child) {
    margin-bottom: 1.5rem;
}

.form-elements .form-elements-row input {
    display: block;
    width: 100%;
    background-color: var(--font-color);
    color: var(--white);
    padding: 1rem;
    border: 0;
    outline: none;
}

.form-elements .form-elements-row input::placeholder {
    color: var(--white);
}

.form-elements .form-elements-row input:not(:last-child) {
    margin-right: 1.25rem;
}

.form-elements .form-elements-row button {
    background-color: var(--font-color);
    color: var(--white);
    padding: 1rem 0;
    width: calc((100% - 1.25rem * 2) / 3);
    border: 0;
    outline: none;
}

.form-elements .form-elements-between {
    justify-content: space-between;
}

/* Product */
.theme-filter-condition {
    display: flex;
    flex-direction: column;
    background-color: var(--white);
    padding: 2rem;
    margin-bottom: 3rem;
    border-radius: var(--border-radius-size);
}

.theme-filter-condition .theme-filter-condition-item {
    display: flex;
    flex-direction: column;
}

.theme-filter-condition .theme-filter-condition-item .item-title {
    font-size: 1.5rem;
    color: var(--font-color);
    margin-bottom: 1rem;
}

.theme-filter-condition .theme-filter-condition-item .item-setter {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li {
    position: relative;
    display: flex;
    align-items: center;
    border: 1px solid var(--font-color);
    margin-right: 1rem;
    margin-bottom: .625rem;
    padding: 0 .625rem;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li.active,
.theme-filter-condition .theme-filter-condition-item .item-setter li:hover {
    background-color: var(--font-color);
}

.theme-filter-condition .theme-filter-condition-item .item-setter li a {
    display: block;
    color: var(--font-color);
    padding: .625rem 0;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li span.arrow {
    display: block;
    width: .45rem;
    height: .45rem;
    border: 1px solid var(--black);
    border-left: 0;
    border-bottom: 0;
    margin-left: 1rem;
    transform: rotate(135deg);
}

.theme-filter-condition .theme-filter-condition-item .item-setter li.active span.arrow,
.theme-filter-condition .theme-filter-condition-item .item-setter li:hover span.arrow {
    border-color: var(--white);
}

.theme-filter-condition .theme-filter-condition-item .item-setter li.active a,
.theme-filter-condition .theme-filter-condition-item .item-setter li:hover a {
    color: var(--white);
}

.theme-filter-condition .theme-filter-condition-item .item-setter li>ul.item-setter-ul {
    position: absolute;
    top: calc(100% + 1px);
    left: -1px;
    display: flex;
    background: var(--white);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    z-index: 9998;
    visibility: hidden;
    opacity: 0 ;
    transition: all .5s;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li:hover>ul.item-setter-ul {
    visibility: visible;
    opacity: 1;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li>ul.item-setter-ul>li {
    border: 0;
    margin: 0;
    padding: 0;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li>ul.item-setter-ul>li:hover {
    background-color: transparent;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li>ul.item-setter-ul>li>a {
    display: block;
    background-color: var(--white);
    color: var(--black);
    white-space: nowrap;
    min-width: 100%;
    padding: 1rem;
    cursor: pointer;
}

.theme-filter-condition .theme-filter-condition-item .item-setter li>ul.item-setter-ul>li>a:hover {
    text-decoration: underline;
}

.theme-filter-display {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background-color: var(--white);
    border-radius: var(--border-radius-size);
    margin-bottom: 3rem;
}

.filter-sort {
    display: block;
    border: 1px solid var(--font-color);
    border-radius: .3125rem;
    cursor: pointer;
}

.filter-sort .btn-sort {
    width: 1.875rem;
    height: 1.875rem;
    -webkit-mask-image: url(../images/icon-sort.png);
    mask-image: url(../images/icon-sort.png);
}

.filter-list {
    display: flex;
}

.filter-list .btn-default {
    border: 1px solid #9a9a9a;
    border-radius: .3125rem;
    cursor: pointer;
}

.filter-list .btn-default:not(:last-child) {
    margin-right: 1rem;
}

.filter-list .btn-active {
    border-color: var(--font-color);
}

.filter-list .btn-default .btn-grid,
.filter-list .btn-default .btn-list {
    width: 1.875rem;
    height: 1.875rem;
    background-color: #9a9a9a;
}

.filter-list .btn-active .btn-grid,
.filter-list .btn-active .btn-list {
    background-color: var(--font-color);
}

.filter-list .btn-grid {
    -webkit-mask-image: url(../images/icon-grid.png);
    mask-image: url(../images/icon-grid.png);
}

.filter-list .btn-list {
    -webkit-mask-image: url(../images/icon-list.png);
    mask-image: url(../images/icon-list.png);
}

.grid-list-products-row {
    --column-count: 2;
}

.grid-list-products-row .grid-item-product {
    flex-direction: row;
    align-items: center;
}

.grid-list-products-row .grid-item-icon .icon-more{
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    margin-bottom: 0;
}

/* Service */
.theme-service-1 {
    margin-bottom: 3.125rem;
}

.theme-service-1 .theme-service-item .theme-service-item-img {
    margin-bottom: 1.875rem;
}

.theme-service-1 .theme-service-item .theme-service-item-img img {
    display: block;
    width: 100%;
    border-radius: var(--border-radius-size);
}

.theme-service-1 .theme-service-item .theme-service-item-desc .title {
    font-size: 2rem;
    margin-bottom: 1rem;
}

.theme-service-1 .theme-service-item .theme-service-item-desc .desc {
    /*font-size: 1.125rem;*/
}

.theme-service-card .service-card-item {
    display: flex;
    flex-direction: column;
    background-color: var(--white);
    padding: 1.875rem;
    border-radius: var(--border-radius-size);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.theme-service-card .service-card-item .card-item-icon {
    display: flex;
    align-items: center;
    margin-bottom: 1.25rem;
}

.theme-service-card .service-card-item .card-item-icon .icon-circle-bg {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    background-color: var(--font-color);
    width: 4rem;
    height: 4rem;
    margin-right: 1.25rem;
}

.theme-service-card .service-card-item .card-item-icon .icon-circle-bg .icon-mask-image {
    background-color: var(--white);
    width: 2rem;
    height: 2rem;
}

.theme-service-card .service-card-item .card-item-icon .icon-title {
    font-size: 1.25rem;
    /*padding: 1rem 0;*/
}

.theme-service-card .service-card-item .card-item-ul>ul>li {
    background: url(../images/icon-circle-tik.png) no-repeat left center/1.25rem;
    padding-left: 1.875rem;
}

.theme-service-card .service-card-item .card-item-ul>ul>li:not(:last-child) {
    margin-bottom: .625rem;
}

.theme-service-card .service-card-item .card-item-content {
    font-size: 1.125rem;
    margin-bottom: 1.25rem;
}

.theme-service-card .service-card-item .card-item-rate {
    display: flex;
    background: url(../images/icon-skew-arrow.png) no-repeat left center/1.5rem;
    padding-left: 1.875rem;
    font-size: 1.125rem;
}

.injury-btn {
    display: flex;
    justify-content: center;
}

.injury-btn a {
    display: flex;
    background-color: var(--white);
    font-size: 1.5rem;
    color: var(--font-color);
    padding: .625rem 3rem;
    border-radius: var(--border-radius-size);
}

.injury-btn a:hover {
    background-color: var(--font-color);
    color: var(--white);
}

.theme-service-2 {
    padding: 2rem 0 5rem;
}

.theme-service-2 .grid-item-thumbnail {
    background-color: var(--white);
    padding: 2rem 1.875rem;
    border-radius: var(--border-radius-size);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.theme-service-2 .grid-item-thumbnail .item-thumbnail-title {
    display: flex;
    align-items: center;
    font-size: 1.5rem;
}

.theme-service-2 .grid-item-thumbnail .item-thumbnail-title img {
    display: block;
    max-width: 3rem;
    margin-right: .625rem;
}

.theme-service-2 .grid-item-thumbnail .item-thumnail-content {
    font-size: 1.125rem;
    padding: 1rem 0 1.25rem;
}

.theme-service-2 .grid-item-thumbnail .item-thumbnail-image {
    margin-bottom: 1rem;
}

.theme-service-2 .grid-item-thumbnail .item-thumbnail-image img {
    display: block;
    width: 100%;
    border-radius: var(--border-radius-size);
}

.theme-service-2 .grid-item-thumbnail .item-thumbnail-rate {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: url(../images/icon-green-tik.png) no-repeat left center/1.5rem;
    padding-left: 1.875rem;
}

.theme-service-2 .grid-item-thumbnail .item-thumbnail-rate span {
    font-size: 1.125rem;
}

.theme-service-rate-card {
    padding-top: 1.875rem;
}

.theme-service-rate-card .service-card-item .card-item-icon .icon-circle-bg {
    background-color: #efefef;
}

.theme-service-rate-card .service-card-item .card-item-icon .icon-circle-bg .icon-mask-image {
    background-color: var(--font-color);
}

.theme-service-data-card .service-card-item .card-item-icon .icon-title {
    padding: 0;
}

.theme-service-data-card .service-card-item .card-item-icon {
    margin-bottom: 0;
}

.theme-service-data-card .service-card-item .card-item-data {
    font-size: 2.25rem;
    padding: 10px 0;
}

.theme-service-data-card .service-card-item .card-item-content {
    margin-bottom: 0;
}

.theme-service-quality .service-quality-item {
    grid-column: span 2;
    border-radius: var(--border-radius-size);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.theme-service-quality .service-quality-item-odd {
    grid-column: span 6;
}

.theme-service-quality .service-quality-item-even {
    grid-column: span 3;
}



.theme-service-quality .service-quality-item .service-quality-item-img img {
    display: block;
    width: 100%;
    border-top-left-radius: var(--border-radius-size);
    border-top-right-radius: var(--border-radius-size);
}

.theme-service-quality .service-quality-item .service-quality-item-content {
    padding: 1.25rem 1.875rem 2rem;
}

.theme-service-quality .service-quality-item .service-quality-item-content .title {
    font-size: 1.5rem;
    margin-bottom: .625rem;
}

.theme-service-quality .service-quality-item .service-quality-item-content ol {
    padding-left: 1rem;
}

.theme-service-quality .service-quality-item .service-quality-item-content ol li {
    font-size: 1.125rem;
    list-style-type: decimal;
}

.theme-service-detail-card .service-card-item .card-item-icon .icon-circle-bg {
    background-color: #efefef;
}

.theme-service-detail-card .service-card-item .card-item-icon .icon-circle-bg .icon-mask-image {
    background-color: var(--font-color);
}

.theme-service-detail-card .service-card-item .card-item-content {
    margin-bottom: 0;
}

.theme-flex-container {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.theme-flex-container-reverse {
    flex-direction: row-reverse;
}

.theme-flex-container .theme-flex-item-thumb,
.theme-flex-container .theme-flex-item-content {
    width: 50%;
}

.theme-flex-container .theme-flex-item-thumb img {
    display: block;
    width: 100%;
    border-radius: var(--border-radius-size);
}

.scroll-about-thumbs .swiper-pagination-bullets .swiper-pagination-bullet {
    width: .75rem;
    height: .75rem;
    background-color: var(--white);
    opacity: 1;
    outline: none;
}

.scroll-about-thumbs .swiper-pagination-bullets .swiper-pagination-bullet-active {
    background-color: var(--font-color);
}

.theme-flex-container .theme-flex-item-content .title {
    font-size: 3.6rem;
}

.theme-flex-container .theme-flex-item-content .description {
    font-size: 1.5rem;
    padding: 2rem 0;
}


.theme-flex-container .theme-flex-item-content .ul-content li {
    font-size: 1.125rem;
    background: url(../images/icon-tik.png) no-repeat left center/1.25rem;
    padding-left: 1.875rem;
}

.theme-flex-container .theme-flex-item-content .ul-content li:not(:last-child) {
    margin-bottom: 1rem;
}

.theme-faq-container .theme-section-title .title {
    padding-bottom: 1.875rem;
}

.theme-faq-tab-title {
    display: flex;
    justify-content: center;
    gap: 1.875rem;
}

.theme-faq-tab-title {
    margin-bottom: 3.125rem;
}

.theme-faq-tab-title .theme-faq-tab-title-item {
    font-size: 1.5rem;
    padding: .3125rem 1.25rem;
    border-radius: .3125rem;
    cursor: pointer;
}

.theme-faq-tab-title .theme-faq-tab-title-item.active {
    background-color: #f7f7f7;
}

.theme-faq-tab-content {
    padding: 0 10rem;
}

.theme-faq-tab-content .theme-faq-tab-content-item {
    display: none;
}

.theme-faq-tab-content .theme-faq-tab-content-item.active {
    display: block;
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul {
    background-color: #f7f7f7;
    padding: 1.25rem 1.875rem;
    border-radius: var(--border-radius-size);
    cursor: pointer;
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul:not(:last-child) {
    margin-bottom: 1.25rem;
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul .faq-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.5rem;
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul .faq-title::after {
    content: "";
    display: block;
    width: 1.875rem;
    height: 1.875rem;
    background: url(../images/icon-faq-arrow.png) no-repeat center center/1.25rem;
    transform: rotate(180deg);
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul.open .faq-title::after {
    transform: rotate(0deg);
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul .faq-content {
    max-height: 0;
    overflow: hidden;
    transition: height .3s ease-in-out;
}

.theme-faq-tab-content .theme-faq-tab-content-item .faq-item-ul.open .faq-content {
    padding-top: .625rem;
    max-height: 62.5rem;
}

.theme-about-category {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 3rem;
}

.theme-about-category .theme-about-category-item {
    display: block;
    font-size: 1.5rem;
    color: var(--font-color);
    padding: .625rem 1.5rem;
    border-radius: var(--border-radius-size);
}

.theme-about-category .theme-about-category-item.active {
    background-color: var(--font-color);
    color: var(--white);
}

.theme-about-category .theme-about-category-item:not(:last-child) {
    margin-right: 1rem;
}

/* News */

.theme-news {
    padding-bottom: 5rem;
}

.theme-news .theme-news-item {
    display: flex;
    align-items: center;
    background-color: var(--white);
    border-radius: var(--border-radius-size);
}

.theme-news .theme-news-item:not(:last-child) {
    margin-bottom: 3rem;
}

.theme-news .theme-news-item:hover {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
}

.theme-news .theme-news-item .theme-news-item-img {
    width: 40%;
}

.theme-news .theme-news-item .theme-news-item-img img {
    display: block;
    width: 100%;
    border-top-left-radius: var(--border-radius-size);
    border-bottom-left-radius: var(--border-radius-size);
}

.theme-news .theme-news-item .theme-news-item-content {
    width: 60%;
    color: var(--font-color);
    padding: 1.875rem 3.125rem;
}

.theme-news .theme-news-item .theme-news-item-content .title,
.theme-news .theme-news-item .theme-news-item-content .description {
    margin-bottom: 1.5rem
}

.theme-news .theme-news-item .theme-news-item-content .title {
    font-size: 2rem;
}

.theme-news .theme-news-item .theme-news-item-content .description {
    /*font-size: 1.25rem;*/
}

.theme-news .theme-news-item .theme-news-item-content .date {
    display: flex;
    justify-content: space-between;
}

.theme-show-news {
    background-color: var(--white);
    padding: 3.125rem;
    border-radius: var(--border-radius-size);
    margin-bottom: 5rem;
}

.theme-show-news .title {
    font-size: 2.25rem;
    margin-bottom: 1.5rem;
}

.theme-show-news .icon-data {
    display: flex;
    gap: 1.875rem;
    margin-bottom: 1.5rem;
}

.theme-show-news .icon-data .date {
    background: url(../images/icon-news-date.png) no-repeat left center/1.25rem;
    padding-left: 1.875rem;
}

.theme-show-news .icon-data .views,
.theme-show-news .icon-data span[class^='dr_show_hits'] {
    background: url(../images/icon-news-views.png) no-repeat left center/1.25rem;
    padding-left: 1.875rem;
}

.theme-show-news .content {
    margin-bottom: 3rem;
}

.theme-show-news .content img {
    display: block;
    max-width: 100%;
}

.theme-show-news .related-links .related-links-item {
    display: flex;
    font-size: 1.5rem;
    color: var(--font-color);
}

.theme-show-news .related-links .related-links-item:not(:last-child) {
    margin-bottom: .625rem;
}

.theme-show-news .related-links .related-links-item a {
    display: block;
    color: var(--font-color);
}

.theme-show-news .related-links .related-links-item a:hover {
    text-decoration: underline;
}

/* About */
.theme-about-content,
.theme-about-page-icons {
    margin-bottom: 3.125rem;
}

.theme-about-content .theme-flex-item-content .title {
    /*margin-bottom: 1.25rem;*/
}

.theme-about-content .theme-flex-item-content .description {
    font-size: 1.125rem;
    line-height: 1.875rem;
    padding: 0;
}

.theme-about-page-icons .theme-about-icons-item {
    background-color: #f8f8f8;
}

.theme-about-page-icons .theme-about-icons-item .about-items-icon {
    background-color: var(--font-color);
}

.theme-about-page-icons .theme-about-icons-item .about-items-icon .icon-mask-inner {
    background-color: var(--white);
}

.theme-about-process {
    padding: 3.125rem;
}

.theme-about-process-list .theme-about-process-item .about-process-item-img {
    position: relative;
}

.theme-about-process-list .theme-about-process-item .about-process-item-img img {
    display: block;
    width: 100%;
}

.theme-about-process-list .theme-about-process-item .about-process-item-img .about-process-item-num {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    font-size: 1.5rem;
    color: var(--white);
    width: 2.5rem;
    height: 2.5rem;
    border-top-left-radius: var(--border-radius-size);
    border-bottom-right-radius: var(--border-radius-size);
}

.theme-about-process-list .theme-about-process-item .about-process-item-content {
    padding: .625rem;
}

.theme-about-process-list .theme-about-process-item .about-process-item-content .title {
    font-size: 1.25rem;
    margin-bottom: .625rem;
}

.theme-about-process-list .theme-about-process-item .about-process-item-content .description {
    font-size: 1.125rem;
}

.scroll-elements-display .swiper-pagination {
    position: initial;
}

.scroll-elements-display .swiper-pagination-bullets {
    display: flex;
    justify-content: center;
    margin-top: 1.875rem;
}

.scroll-elements-display .swiper-pagination-bullets .swiper-pagination-bullet {
    width: .75rem;
    height: .75rem;
    background-color: #c1c1c1;
}

.scroll-elements-display .swiper-pagination-bullets .swiper-pagination-bullet-active {
    background-color: var(--font-color);
}

.scroll-elements-display .swiper-slide-content .slide-content-img img {
    display: block;
    width: 100%;
}

.scroll-certificate-swiper {
    padding-bottom: 3.125rem;
}

.scroll-certificate-swiper .swiper-slide-content .slide-content-img {
    padding: 1rem;
    border: 1px solid #efefef;
    border-radius: var(--border-radius-size);
}

.scroll-certificate-swiper .swiper-slide-content .slide-content-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 0;
}

.scroll-certificate-swiper .swiper-slide-content .slide-content-inner span {
    font-size: 1.25rem;
}

.scroll-certificate-swiper .swiper-slide-content .slide-content-inner a {
    display: block;
}

.scroll-certificate-swiper .swiper-slide-content .slide-content-inner img {
    display: block;
    max-width: 1.875rem;
}

/* Contact */
.theme-contact-cards .theme-contact-cards-item {
    padding: 1.875rem;
    border-radius: var(--border-radius-size);
}

.theme-contact-cards .contact-cards-item-circle {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--white);
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    margin: 0 auto 1.25rem;
}

.theme-contact-cards .contact-cards-item-circle .icon-mask-inner {
    background-color: var(--font-color);
    width: 1.875rem;
    height: 1.875rem;
}

.contact-cards-item-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1.25rem;
}

/* Flexible Customization */
.theme-customization-cards {
    margin-bottom: 3.125rem;
}

.theme-customization-cards .customization-card-item {
    border-radius: var(--border-radius-size);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    padding: 2rem 3rem;
}

.theme-customization-cards .customization-card-item .customization-card-item-icon {
    display: flex;
    align-items: center;
    /*gap: 2rem;*/
    margin-bottom: 1.25rem;
}

.theme-customization-cards .customization-card-item .customization-card-item-icon .icon-circle-bg {
    flex-shrink: 0;
    background-color: var(--font-color);
    width: 3.75rem;
    height: 3.75rem;
}

.theme-customization-cards .customization-card-item .customization-card-item-icon .icon-mask-inner {
    background-color: var(--white);
    width: 1.875rem;
    height: 1.875rem;
}

.theme-customization-cards .customization-card-item .customization-card-item-icon .icon-title {
    font-size: 1.25rem;
    margin-left: 1rem;
}

.theme-customization-cards .customization-card-item .customization-card-item-content {
    padding-left: 1.25rem;
}

.theme-customization-cards .customization-card-item .customization-card-item-content>li {
    list-style: disc;
    font-size: 1.125rem;
}

.theme-customization-tab .customization-tab-title {
    margin-bottom: 3.125rem;
}

.theme-customization-tab .customization-tab-title .item {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #eeeeee;
    padding: .625rem 0;
    border-radius: .3125rem;
    cursor: pointer;
}

.theme-customization-tab .customization-tab-title .item.active,
.theme-customization-tab .customization-tab-title .item:hover {
    background-color: var(--font-color);
    border-color: var(--font-color);
}

.theme-customization-tab .customization-tab-title .item .icon-mask-image {
    width: 2.5rem;
    height: 2.5rem;
    margin-right: .625rem;
}

.theme-customization-tab .customization-tab-title .item.active .icon-mask-image,
.theme-customization-tab .customization-tab-title .item:hover .icon-mask-image {
    background-color: var(--white);
}

.theme-customization-tab .customization-tab-title .item .item-name {
    font-size: 1.25rem;
}

.theme-customization-tab .customization-tab-title .item.active .item-name,
.theme-customization-tab .customization-tab-title .item:hover .item-name {
    color: var(--white);
}

.theme-customization-tab .customization-tab-content .item {
    display: none;
    padding: 3.125rem;
    border-radius: var(--border-radius-size);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.theme-customization-tab .customization-tab-content .item.active {
    display: block;
}

.theme-customization-tab .customization-tab-content .item .item-inner-content {
    --column-gap: 3.75rem
}

.theme-customization-tab .customization-tab-content .item .item-inner-content .inner-content-item .thumb {
    border: 1px solid #eeeeee;
    border-radius: var(--border-radius-size);
}

.theme-customization-tab .customization-tab-content .item .item-inner-content .inner-content-item img {
    display: block;
    width: 100%;
    border-radius: var(--border-radius-size);
}

.theme-customization-tab .customization-tab-content .item .item-inner-content .inner-content-item .name {
    font-size: 1.25rem;
    padding: .625rem 0;
}

/* OEM/ODM */

.theme-oem-process {
    --column-gap: 1.25rem;
}

.theme-oem-process .grid-item-oem {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.theme-oem-process .grid-item-oem .circle-num {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3.125rem;
    height: 3.125rem;
    border-radius: 50%;
    font-size: 1.875rem;
    color: var(--white);
    background-color: var(--font-color);
    transform: translateY(1.5625rem);
}

.theme-oem-process .grid-item-oem .oem-content {
    width: 100%;
    height: calc(100% - 50px);
    border: 1px solid #efefef;
    border-radius: var(--border-radius-size);
    padding: 1.875rem 1rem;
}

.theme-oem-process .grid-item-oem .oem-content .oem-item-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding-top: 1rem;
    margin-bottom: 1rem;
}

.theme-oem-process .grid-item-oem .oem-content .oem-item-title .icon-mask-inner {
    flex-shrink: 0;
    background: var(--font-color);
    width: 3.125rem;
    height: 3.125rem;
}

.theme-oem-process .grid-item-oem .oem-content .oem-item-title .title {
    font-size: 1.25rem;
    text-align: center;
}

.theme-oem-process .grid-item-oem .oem-content .oem-item-thumb {
    margin-bottom: .5rem;
}

.theme-oem-process .grid-item-oem .oem-content .oem-item-thumb img {
    display: block;
    width: 100%;
}

.theme-oem-process .grid-item-oem .oem-content .oem-item-content {
    line-height: 1.5rem;
}

.scroll-case-swiper .oem-case-item {
    display: grid;
    grid-template-columns: 2fr 3fr;
    align-items: center;
    border: 1px solid #efefef;
    border-radius: var(--border-radius-size);
}

.scroll-case-swiper .oem-case-item .oem-case-item-img img {
    display: block;
    width: 100%;
}

.scroll-case-swiper .oem-case-item .oem-case-item-content {
    padding: 1.25rem 2rem;
}

.scroll-case-swiper .oem-case-item .oem-case-item-content .case-item-content-tags {
    display: flex;
    flex-wrap: wrap;
    /*gap: .625rem;*/
}

.scroll-case-swiper .oem-case-item .oem-case-item-content .case-item-content-tags span {
    --tag-bg-color: #efefef;
    --tag-font-color: #010101;
    display: block;
    background-color: var(--tag-bg-color);
    color: var(--tag-font-color);
    padding: .3125rem .625rem;
    border-radius: .3125rem;
    margin-right: .625rem;
    margin-bottom: .625rem;
}

.scroll-case-swiper .oem-case-item .oem-case-item-content .case-item-content-title {
    font-size: 1.875rem;
    padding: 1.25rem 0;
}

.scroll-case-swiper .oem-case-item .oem-case-item-content .case-item-content-inner {
    font-size: 1.125rem;
}

.scroll-case-swiper .swiper-pagination {
    margin-top: 3.125rem;
}

.theme-partner-brands {
    --column-gap: .625rem;
    --row-gap: .625rem;
}

.theme-partner-brands .grid-item-partner {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #efefef;
    border-radius: var(--border-radius-size);
}

.theme-partner-brands .grid-item-partner img {
    display: block;
    max-width: 100%;
    border-radius: var(--border-radius-size);
    filter: grayscale(100%);
    transition: all .3s ease-in-out;
}

.theme-partner-brands .grid-item-partner:hover img {
    filter: grayscale(0%);
}

/* New Arrival */
.theme-new-arriva {}

.theme-new-arrival .grid-new-arrival-item {
    position: relative;
    border-radius: var(--border-radius-size);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-img{
    padding: 3rem 0;
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-img img {
    display: block;
    width: 100%;
    border-radius: var(--border-radius-size);
    mix-blend-mode: multiply;
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-content {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    padding: 1.5rem;
    border-radius: var(--border-radius-size);
    visibility: hidden;
    opacity: 0;
    transition: all.3s ease-in-out;
}

.theme-new-arrival .grid-new-arrival-item:hover .new-arrival-content {
    visibility: visible;
    opacity: 1;
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-content .tags {
    display: flex;
    flex-wrap: wrap;
    /*gap: .625rem;*/

}

.theme-new-arrival .grid-new-arrival-item .new-arrival-content .tags span {
    background-color: var(--font-color);
    font-weight: bold;
    color: var(--white);
    padding: .3125rem .625rem;
    border-radius: .3125rem;
    margin-right: .625rem;
    margin-bottom: .625rem;
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-content .title {
    font-size: 1.25rem;
    color: var(--white);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-content .desc {
    color: var(--white);
    padding: 0 0 .625rem;
}

.theme-new-arrival .grid-new-arrival-item .new-arrival-content .new-arrival-btn span {
    display: inline-block;
    background-color: var(--white);
    padding: .3125rem .625rem;
    color: var(--font-color);
    border-radius: .3125rem;
}