@charset "UTF-8";

/* Media Query */

@media(max-width:1024px) {
    /* Swiper */
    /* Navigation */
    .navigation__logo {
        zoom: 0.75;
    }
    .navigation.was-scrolled .navigation__logo {
        zoom: 0.5;
    }
    .search--toggle {
        border: none;
        padding: 0;
    }
    /* Footer */
    body:has(.toolbar-custom) #footer-primary {
        padding-bottom: 53px;
    }
    /* E Commercial */
    .e-commercial {
        bottom: 8rem;
        left: 1rem;
    }
    /* Button Plugin */
    .cart-fixed {
        right: 1rem;
        bottom: 140px;
    }
    .scroll-to-top {
        right: 1rem;
    }
}

@media (min-width:851px) and (max-width:1024px) {}

@media(max-width:850px) {
    /* List Page */
    .product .product__list.flex-container,
    .video .video__list.flex-container,
    .album .album__list.flex-container,
    .news .news__list.flex-container {
        --columns: 3;
        --space-x: 0.5rem;
    }
    /* Footer */
    .footer__article-item {
        width: 100% !important;
    }
    .footer__copyright,
    .footer__statistic {
        text-align: center;
    }
}

@media(max-width:767px) {}

@media(max-width:576px) {
    /* List Page */
    .product .product__list.flex-container,
    .video .video__list.flex-container,
    .album .album__list.flex-container,
    .news .news__list.flex-container {
        --columns: 2;
        --space-x: 0.5rem;
    }
    /* Intro */
    .intro__info {
        padding: 1rem;
    }
    .intro__info-bottom {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        row-gap: 0.25rem;
    }
    /* Different */
    .different__title>span:nth-child(2) {
        margin-top: 0;
    }
}

@media(max-width:320px) {
    /* List Page */
    .product .product__list.flex-container,
    .video .video__list.flex-container,
    .album .album__list.flex-container,
    .news .news__list.flex-container {
        --columns: 1;
        --space-x: 0rem;
        --space-y: 1rem;
    }
    /* Cart */
    .cart-pro-detail a {
        width: 100%;
    }
    .cart-pro-detail a:first-child {
        margin: 0 0 0.5rem 0;
    }
    .cart-pro-detail a i {
        display: none;
    }
}

@media (max-width:1024px) {
    /* General */
    .body-container {
        overflow: hidden;
    }
    article[class*='--template'] {
        padding: 30px 0px;
    }
    /* Home */
    .pd\:40-0,
    .pd\:50-0 {
        padding: 30px 0;
    }
    .pd\:60-0,
    .pd\:70-0,
    .pd\:80-0 {
        padding: 40px 0;
    }
    .mb\:80 {
        margin-bottom: 40px;
    }
    .mg\:40-0,
    .mg\:50-0 {
        margin: 30px 0px;
    }
    .mg\:60-0,
    .mg\:70-0,
    .mg\:80-0 {
        margin: 40px 0px;
    }
    /* Spacing */
    .mg-b\:1\.5rem {
        margin-bottom: 1rem;
    }
    .mg-b\:2rem,
    .mg-b\:2\.5rem {
        margin-bottom: 1.25rem;
    }
    /* CKEditor Reset */
    .ck-editor {
        overflow-x: auto;
    }
    .ck-editor:after {
        content: '';
        clear: both;
        display: block;
    }
    .ck-editor *:not(iframe) {
        max-width: 100% !important;
        height: auto !important;
    }
    .ck-editor iframe {
        max-width: 100% !important;
    }
    /* Quick Responsive */
    .rps-xl--visible[class*='rps-xl'][class*='--visible'] {
        display: block;
    }
    .rps-xl--hidden[class*='rps-xl'][class*='--hidden'] {
        display: none;
    }
    .rps-xl--w-fit[class*='rps-xl'][class*='--w-fit'] {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }
    .rps-xl--w-100[class*='rps-xl'][class*='--w-100'] {
        width: 100%;
    }
    .rps-xl--flex-100[class*='rps-xl'][class*='--flex-100'] {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-box-flex: 0;
        flex: 0 1 100%;
    }
}

@media (max-width:850px) {
    /* Quick Responsive */
    .rps-lg--visible[class*='rps-lg'][class*='--visible'] {
        display: block;
    }
    .rps-lg--hidden[class*='rps-lg'][class*='--hidden'] {
        display: none;
    }
    .rps-lg--w-fit[class*='rps-lg'][class*='--w-fit'] {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }
    .rps-lg--w-100[class*='rps-lg'][class*='--w-100'] {
        width: 100%;
    }
    .rps-lg--flex-100[class*='rps-lg'][class*='--flex-100'] {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-box-flex: 0;
        flex: 0 1 100%;
    }
}

@media (max-width:576px) {
    /* Quick Responsive */
    .rps-md--visible[class*='rps-md'][class*='--visible'] {
        display: block;
    }
    .rps-md--hidden[class*='rps-md'][class*='--hidden'] {
        display: none;
    }
    .rps-md--w-fit[class*='rps-md'][class*='--w-fit'] {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }
    .rps-md--w-100[class*='rps-md'][class*='--w-100'] {
        width: 100%;
    }
    .rps-md--flex-100[class*='rps-md'][class*='--flex-100'] {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-box-flex: 0;
        flex: 0 1 100%;
    }
}

@media (max-width:320px) {
    /* Quick Responsive */
    .rps-sm--visible[class*='rps-sm'][class*='--visible'] {
        display: block;
    }
    .rps-sm--hidden[class*='rps-sm'][class*='--hidden'] {
        display: none;
    }
    .rps-sm--w-fit[class*='rps-sm'][class*='--w-fit'] {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }
    .rps-sm--w-100[class*='rps-sm'][class*='--w-100'] {
        width: 100%;
    }
    .rps-sm--flex-100[class*='rps-sm'][class*='--flex-100'] {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-box-flex: 0;
        flex: 0 1 100%;
    }
}
