@media (min-width: 1200px) and (max-width: 1399px){

    .header0 .inner,
    .header3 .inner,
    .container .inner,
    .panel .inner,
    .footer1 .inner,
    .footer2 .inner{
        width: calc(100% - 60px);
    }

    .header1 .inner{
        width: 100%;
        padding: 0;
    }

    .header0 .inner .logo{
        left: 0;
    }

    .header0 .inner .left{
        margin-left: 160px;
    }

    .header1 .inner .menu{
        margin-left: 190px;
    }

    .header1 .inner .menu .item .text{
        font-size: calc(18px / 1.05);
    }

    .header1 .inner .cart{
        border-right: none;
    }

    .header3 .inner .menu{
        margin-left: 160px;
    }

    .header3 .inner .menu .item .text{
        font-size: calc(18px / 1.05);
    }

    .mainpage{
        padding-top: calc((100% / 16) * 8.5);
    }

    .mainpage .content .box{
        width: calc(100% - 200px);
    }

    .mainpage .content .box h1{
        width: calc(100% - 150px);
        max-width: 75%;
        font-size: calc(50px / 1.05);
    }

    .mainpage .content .box p{
        width: calc(100% - 200px);
        max-width: 70%;
        font-size: calc(25px / 1.05);
    }

    .mainpage .content .box .categories{
        width: calc(100% - 200px);
        max-width: 70%;
    }

    .mainpage .content .box .categories .item{
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 10px;
        padding-bottom: 8px;
    }

    .mainpage .content .box .categories .item .text{
        font-size: calc(18px / 1.1);
    }

}


@media (min-width: 1200px) and (max-width: 1349px){

}


@media (min-width: 1050px) and (max-width: 1199px){

}


@media (min-width: 900px) and (max-width: 1049px){

}


@media (min-width: 750px) and (max-width: 899px){

}


@media (min-width: 600px) and (max-width: 749px){


}

@media (min-width: 450px) and (max-width: 599px){


}


@media (min-width: 320px) and (max-width: 449px){


}