@media(max-width: 1680px) {
    main #categorias ul {
        grid-auto-columns: calc(16.7vw - 50px);
    }
}
@media (max-width: 1470px) {
    main #categorias ul {
      grid-auto-columns: calc(16.7vw - 44px);
      column-gap: 30px;
    }
    main #banner_inicial ul li {
        height: 500px;
    }
    main #banner_inicial article h2 {
        font-size: 70px;
        letter-spacing: 14.2px;
    }
    header .faixa_cinza {
        padding-top: 7px;
        padding-bottom: 6px;
    }
    header .faixa_cinza h4 {
        font-size: 12px;
    }
    header .bottom .condicoes {
        margin-top: 22px;
    }
    header .bottom .navegacao {
        margin-top: 20px;
    }
    .centro,
    main.quem_somos .center2 {
        max-width: 1000px !important;
    }
    main #blocos_categorias ul a {
        padding-right: 35px;
        padding-top: 90px;
        padding-bottom: 50px;
    }
    .listagem_produtos {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }
    main.quem_somos #top .esquerda div.mask_img {
        max-width: 480px;
        height: 500px;
    }
    main.quem_somos #top .direita .carrossel ul {
        width: calc(100% + 170px);
        height: 750px;
        margin-left: -85px;
    }
    main.quem_somos #top .esquerda p {
        max-width: 440px;
    }
    header .logos {
        column-gap: 30px;
    }
    header h2.logo_ms {
        width: 75px;
        height: 25px;
    }
    header h2.logo_junior {
        width: 75px;
        height: 33px;
    }
    header h1 {
        width: 75px;
        height: 17px;
    }
    main #produto .colunas {
        grid-template-columns: 50% 1fr;
    }
    main #produto .colunas .direita .infos-frete {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 1000px) {
    header .bottom .condicoes {
        flex-direction: column;
        row-gap: 20px;
    }
    main #banner_inicial article h2 {
        font-size: 38px;
        line-height: 46px;
        text-align: center;
        letter-spacing: 12px;
    }
    footer .centro {
        flex-direction: column;
        row-gap: 25px;
    }
    footer h2 {
        margin-bottom: 8px;
    }
    footer form {
        align-items: flex-start;
    }
    footer .desenvolvido .centro {
        row-gap: 10px;
        align-items: center;
    }
    main #banner_inicial .passador span.esquerda {
        left: 20px;
    }
    main #banner_inicial .passador span.direita {
        right: 20px;
    }
    header .bottom .navegacao nav a {
        font-size: 12px;
    }
    main #blocos_categorias ul h2 {
        font-size: 28px;
        line-height: 28px;
        text-align: right;
    }
    main #blocos_categorias ul h3 {
        font-size: 15px;
        line-height: 15px;
    }
    main #blocos_categorias ul a {
        padding-right: 20px;
        padding-top: 70px;
        padding-bottom: 40px;
        padding-left: 10px;
    }
    main #blocos_categorias ul {
        column-gap: 20px;
    }
    main #produtos {
        margin-top: 20px;
    }
    .listagem_produtos {
        column-gap: 20px;
        row-gap: 25px;
    }
    main #categorias ul {
        grid-auto-flow: unset;
        grid-auto-columns: unset;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        padding: 0 20px;
    }
    main #listagem .colunas {
        grid-template-columns: 200px 1fr;
    }
    main #listagem .esquerda .listagem_colecoes h2 {
        font-size: 26px;
    }
    main #listagem .esquerda .listagem_colecoes li {
        height: 250px;
    }
    main #produto .colunas {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }
    main #listagem .listagem_produtos {
        grid-template-columns: repeat(2, 1fr);
    }
    main #produto .colunas .direita {
        padding-left: 0;
    }
    main #produto .colunas .direita article {
        max-width: unset;
    }
    header .bottom .navegacao {
        padding-left: 20px;
        padding-right: 20px;
    }
    header .bottom .navegacao nav {
        column-gap: 25px;
    }
    main.quem_somos .center2 {
        padding-top: 20px !important;
    }
    header .bottom .condicoes ul,
    header .top {
        display: none;
    }
}
@media (max-width: 600px) {
    header .top ul:first-child {
        display: none;
    }
    header .bottom .condicoes ul {
        grid-template-columns: 1fr;
        row-gap: 15px;
        width: fit-content;
    }
    header .bottom .condicoes ul.desativa {
        display: none;
    }
    header .bottom .navegacao nav {
        display: none;
    }
    header .bottom .navegacao ul {
        width: 100%;
    }
    header .bottom .navegacao ul form {
        width: 100%;
    }
    /*header .bottom .navegacao ul form {
        min-width: calc(100vw - 125px);
    }*/
    header .bottom .navegacao ul li:first-child {
        width: 100%;
    }
    main #blocos_categorias ul {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }
    .listagem_produtos {
        grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    }
    #texto_politicas {
        padding-left: 0;
        padding-bottom: 30px;
        padding-top: 30px;
    }
    main #listagem #banner_loja {
        grid-column: span 1;
    }
    main #listagem .colunas {
        grid-template-columns: 1fr;
    }
    main #listagem .esquerda .listagem_colecoes {
        display: none;
    }
    .breadcrumbs a:not(:first-child) {
        background: url(../imagens/seta_verde.png) top 6px left no-repeat;
    }
    main #produto .colunas .esquerda .mask_img {
        height: 400px;
    }
    main #produto .colunas .esquerda .mask_img .galeria {
        max-height: 400px;
        overflow-y: scroll;
    }
    header .top ul {
        width: 100%;
        justify-content: space-between;
    }
    .bt_flutuante_atendimento {
        right: 20px !important;
        bottom: 30px !important;
        z-index: 999 !important;
    }
    main #categorias ul h3 {
        font-size: 14px;
        margin-top: 8px;
    }
    main #listagem .menu_navegacao {
        display: none;
    }
}
@media (max-width: 400px) {
    .listagem_produtos {
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    }
    main #produto .colunas .esquerda .mask_img {
        height: 320px;
    }
    main #produto .colunas .esquerda .mask_img .galeria {
        max-height: 320px;
    }
}