@media (max-width: 1440px){

    .wrapper{
        max-width: 1280px;
    }
    .top-bar{
        padding: 0 1em;
    }
    .section-header{
        margin-bottom: 3.2em;
    }
    .footer-nav-1 .wrapper{
        box-sizing: border-box;
    }

    .footer-nav-2 .wrapper{
        height: 420px;
    }

    .btn-box{
        margin-top: 55px;
    }

    .footer-nav-link{
        margin-right: 20px;
    }

    .footer-nav{
        padding-right: 4.5em;
    }
    .footer-nav-link-list{
        padding-right: 45px;
    }

}

@media (max-width: 1280px){
    body{
        font-size: 14px;
    }

    .wrapper{
        max-width: 960px;
    }

    .footer-nav-2 .wrapper{
        height: 400px;
    }

    .btn-box{
        margin-top: 50px;
    }

    .scrolled .top-menu{
        left: 160px;
    }

    .scrolled .top-menu-link{
        padding: 0;
    }

    .scrolled .top-menu-link span{
        padding: 0 .5em;
    }

    .footer-nav-link{
    }
    .footer-nav-link-list{
        padding-right: 20px;
    }

    .footer-nav:last-of-type{
        margin-bottom: 0;
    }

    .footer-nav:nth-last-of-type(2){
        padding-right: 0;
    }
}

@keyframes menuShow {
    from{
        transform: translateX(100%);
    }
    to{
        transform: none;
    }
}

@media (max-width: 960px){
    .wrapper{
        width: 100%;
    }

    .btn-box{
        margin-top: 40px;
    }

    .pns-menu-item{
        display: flex;
        flex-direction: column;
    }

    .pns-menu-ctn{
        left: 0;
        top: 0;
        position: relative;
        display: none;
        width: 100%;
    }
    .pns-type-list{
        font-size: calc(1em + 2px);
    }

    .pns-menu-ctn.show{
        display: block;
    }
    .scrolled .pns-menu-ctn{
        top: 0;
    }

    .pns-type-content{
        padding-top: 1.8em;
        padding-bottom: 2em;
    }

    .pns-type-list{
        justify-content: flex-start;
    }

    .pns-type{
        padding: 0 1em;
    }

    .pns-cate-list{
        flex-wrap: wrap;
        justify-content: flex-start;
        margin-right: -15px;
        padding-left: 15px;
        padding-right: 15px;
    }

    .pns-cate-name{
        margin-bottom: .6em;
    }

    .pns-cate-link{
        margin-bottom: .3em;
    }

    .pns-cate{
        flex: 0 0 calc(50% - 15px);
        margin-right: 15px;
        margin-bottom: 1.2em;
    }

    .footer-nav-2 .wrapper{
        flex-direction: row;
        height: auto;
    }

    .footer-nav-2 .footer-nav-link{
        margin-right: 15px;
    }

    .footer-nav-2 .wrapper>*{
        flex: 0 0 50%;
        height: auto;
        padding-right: 0;
    }

    .mobile-menu-toggle{
        display: flex;
        margin-right: -1em;
    }

    .top-bar .right-links, .top-menu{
        transform: translateX(100%);
        display: none;
        transition: 0s;
    }

    .top-bar .right-links.show{
        position: absolute;
    }

    .scrolled .top-menu-link{
        padding: .5em;
    }

    .scrolled .top-menu-link span{
        padding: 0 1em .05em;
    }

    .page-header.scrolled .top-menu { background: #111; }
    .page-header.scrolled .top-menu-link span { color: white; }

    .top-menu.show, .top-bar .right-links.show{
        display: flex;
        visibility: visible;
        min-width: 300px;
        width: 40vw;
        right: 0;
        left: unset;
        animation: menuShow .35s .18s cubic-bezier(.8, 0, 0, .8) forwards;
    }

    .top-bar .right-links{
        top: 100%;
        background-color: #111;
        height: 100%;
        border-bottom: 1px solid #333;
        justify-content: center;
    }

    .top-bar .right-links>*{
        margin: 0 1em;
    }

    .top-menu{
        flex-direction: column;
        background-color: #111;
        top: 200%;
        height: calc(100vh - 200%);
        padding: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .top-bar .right-links > *{
        color: white;
    }

    .top-menu-link{
        justify-content: flex-start;
        padding: .5em;
    }

    .top-menu-item{
        border-bottom: 1px solid rgba(255, 255, 255, .1);
    }

    .scrolled .top-menu{
        top: 200%;
    }

    .mobile-mask.show{
        display: block;
        animation: menuShow .4s cubic-bezier(.8, 0, 0, .8) forwards;
    }

    .top-menu-link:hover span, .top-menu-link.active span{
        border: 1px solid transparent;
    }

    .top-menu-item.active{
        flex-direction: column;
    }

    .submenu-ctn{
        position: relative;
        flex-direction: column;
        top: 0;
        width: 100%;
    }

    .top-menu-item:hover .submenu-ctn{
        display: none;
    }

    .top-menu-item.active{
        color: #e5071e;
    }

    .top-menu-item.active .submenu-ctn{
        display: flex;
        position: relative;
    }

    .submenu-nav-item.active .submenu-content{
        display: flex;
        position: relative;
    }

    .submenu-nav{
        display: flex;
        flex-direction: column;
    }

    .submenu-nav-item{
        flex: 0;
        padding: 0;
        flex-direction: column;
        position: relative;
    }

    .submenu-nav-item-link{
        width: 100%;
        height: 100%;
        padding: .75em;
    }

    .top-menu-item.has-submenu:hover .top-menu-link::after{
        display: none;
    }

    .top-menu-link{
        position: relative;
        flex: auto;
    }

    .top-menu-item.has-submenu.active .top-menu-link::after{
        display: block;
        bottom: 0;
    }

    .submenu-content{
        width: 100%;
        left: 0;
        padding: .7em;
    }

    .submenu-nav-item::after{
        position: absolute;
        right: .75em;
        top: 0.97625em;
    }

    .submenu-2-nav{
        padding-right: .7em;
        margin-right: .7em;
        flex: 20;
    }

    .submenu-2-nav-item::after{
        margin-right: 0;
    }

}

@media (max-width: 800px) {
    h1 {
        font-size: 2em;
    }

    h2{
        font-size: 1.75em;
    }

    .footer-nav:last-of-type{
        margin-bottom: 3em;
    }

    .footer-nav-link-list{
        padding-right: 0;
    }
}

@media (max-width: 640px){
    .wrapper{
        align-items: center;
    }

    .wrapper h1{
        text-align: center;
    }

    .footer-nav-2 .wrapper>*{
        flex: 0 0 100%;
        height: auto;
        padding-right: 0;
    }

    .footer-nav-1 .wrapper{
        height: auto;
        padding: 2em 1em;
        flex-wrap: wrap;
    }

    .footer-nav-1 .wrapper>*{
        justify-content: flex-start;
        margin: .8em 0;
    }
    .top-menu.show, .top-bar .right-links.show {
        width: 50vw;
    }

    .btn-box{
        margin-top: 35px;
    }

    .swiper-button-next, .swiper-button-prev{
        transform: scale(.8);
    }
    .swiper-button-next{
        transform-origin: right center;
    }
    .swiper-button-prev{
        transform-origin: left center;
    }
}

@media (max-width: 480px){
    .top-menu.show, .top-bar .right-links.show{
        width: 100vw;
        left: 0;
    }

    .top-menu-link{
        padding-left: 2em;
    }

    .btn-box{
        margin-top: 30px;
    }

    .footer-logo { width: 150px; }
    .footer-logo img { max-width: 100%; }


}
