/*
 * logo
 */
@media (max-width: 414px) {
    .logo {
        position: absolute;
        top: 20px;
        left: 15px;
    }
}
/*
 * menu
 */
@media (max-width: 1290px) {
    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu {
        padding-top: 130px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.menu-item {
        margin-bottom: 35px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.small-font-menu {
        margin-bottom: 16px;
        padding-bottom: 0px;
        font-size: 14px;
    }
}

@media (max-width: 1024px) {
    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu {
        padding-top: 156px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.menu-item {
        margin-bottom: 40px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.small-font-menu {
        margin-bottom: 16px;
    }
}

@media (max-width: 768px) {
    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu {
        height: 100%;
        padding-left: 89px;
        padding-top: 156px;
        list-style: none;
        position: relative;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.menu-item {
        margin: 0px 0 40px 0;
        font-size: 20px;
        color: #fff;
        list-style: none;
        font-weight: bold;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.small-font-menu {
        padding-bottom: 0px;
        font-size: 14px;
    }

    #offcanvas-menu .menu-header {
        background: url(../img/bg-sp/image-menu-sp.png) bottom;
        background-size: cover;
    }

    #offcanvas-menu + .hamburger {
        top: 14px;
        right: 15px;
    }

    #offcanvas-menu + .hamburger .icon-close {
        top: 20px;
        right: 20px;
    }
}

@media (max-width: 414px) {
    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu {
        padding-left: 72px;
        padding-top: 127px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.menu-item {
        margin: 0px 0 29px 0;
        font-size: 20px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.small-font-menu {
        margin: 24px 17px 0 0;
        font-size: 13px;
        font-weight: normal;
        display: inline-block;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.allright-reserve {
        width: 100%;
        margin: 0;
        font-size: 12px;
        text-align: center;
        font-weight: normal;
        right: auto;
        left: 0;
    }
}

@media (max-width: 375px) {
    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.menu-item {
        margin: 0px 0 22px 0;
        font-size: 20px;
    }
}

@media (max-width: 330px) {
    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu {
        padding-left: 40px;
    }

    #offcanvas-menu .menu-header .nav-menus ul.offcanvas-menu li.menu-item {
        margin: 0px 0 24px 0;
        font-size: 20px;
    }
}

 /*
 * footer
 */
@media (max-width: 1199px) {
    .footer .footer-container {
        width: 956px;
        margin: 0 auto;
        padding: 0;
    }
    .footer ul.top-menu li.cus-width {
        width: 34%;
    }
}

@media (max-width: 1076px) {
    .footer .footer-container {
        width: 100%;
        padding: 0 52px;
    }

    .footer .footer-left {
        width: 24%;
    }

    .footer .footer-center {
        width: 58%;
        padding-top: 3px;
    }

    .footer .footer-right {
        width: 18%;
    }

    .footer ul.top-menu li.cus-width {
        width: 32%;
    }
}

@media (max-width: 1034px) {
    .footer ul.top-menu li.cus-width {
        width: 34%;
    }
}

@media (max-width: 768px) {
    .footer {
        padding-right: 0px;
    }

    .footer .footer-container {
        width: 100%;
        padding: 0 36px;
    }

    .footer .footer-image-style {
        margin: auto;
    }

    .footer .footer-left {
        width: 32%;
        margin-right: 3%;
    }

    .footer .footer-center {
        width: 65%;
        padding-top: 20px;
    }

    .footer .text-icon-left {
        margin: 0px;
        padding-left: 0px;
        list-style: none;
        text-align: center;
    }

    .footer ul.top-menu {
        width: 100%;
        margin-top: 42px;
        margin-bottom: 23px;
        text-align: left;
    }

    .footer ul.top-menu li.list-inline-item {
        width: auto;
        padding: 0px 26px;
    }

    .footer ul.top-menu li.cus-width {
        width: auto;
    }

    .footer .footer-right {
        width: 86%;
        margin: auto;
    }

    .footer .footer-right .right .list-style-inline {
        margin-left: 0;
        display: inline-block;
    }

    .footer .list-inline.right li {
        margin-left: 0;
        line-height: 23px;
        font-size: 14px;
        text-align: center;
    }

    .footer .copyright {
        padding-bottom: 9px;
        margin-top: 0px;
    }

    .footer .header-buttom {
        bottom: 16px;
        right: 15px;
    }

    .footer .header-buttom ul.text-right {
        margin-bottom: 4px;
    }

    .footer ul.list-inline.right {
        width: 81%;
        margin: auto;
        margin-top: 8px !important;
        text-align: center;
    }

    .footer ul.list-inline.right {
        width: 81%;
        margin: auto;
        margin-top: 17px !important;
        margin-bottom: 48px;
        text-align: center;
    }
}

@media (max-width: 688px) {
    .footer .footer-left {
        width: 36%;
    }

    .footer .footer-center {
        width: 61%;
    }

    .footer ul.top-menu {
        width: 100%;
        margin-top: 42px;
        margin-bottom: 23px;
        text-align: left;
    }

    .footer ul.top-menu li.list-inline-item {
        width: auto;
        padding: 0px 15px;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .footer .footer-left {
        width: 43%;
        margin: auto;
    }

    .footer .footer-center {
        width: 100%;
    }

    .footer ul.top-menu {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 414px) {
    .footer {
        padding-right: 0px;
    }

    .footer .footer-container {
        width: 100%;
        padding: 0;
    }

    .footer .footer-left {
        width: 53%;
        margin: auto;
    }

    .footer .text-icon-left {
        margin: 0px;
        padding-left: 0px;
        text-align: center;
        list-style: none;
    }


    .footer ul.top-menu {
        width: 100%;
        text-align: center;
        margin-top: 42px;
        margin-bottom: 23px;
    }

    .footer ul.top-menu li.list-inline-item {
        width: auto;
        padding: 0 20px;
    }

    .footer .footer-right {
        width: 100%;
        margin: auto;
    }

    .footer .footer-right .right .list-style-inline {
        margin-left: 0;
        display: inline-block;
    }

    .footer .list-inline.right li {
        margin-left: 0;
        line-height: 23px;
        font-size: 14px;
        text-align: center;
    }

    .footer .copyright {
        margin-top: 0px;
        padding-bottom: 9px;
    }

    .footer .header-buttom {
        bottom: 16px;
        right: 15px;
    }

    .footer .header-buttom ul.text-right {
        margin-bottom: 4px;
    }

    .footer ul.top-menu li.cus-width {
        margin-left: 0px;
        margin-right: 0px;
    }
}

@media (max-width: 400px) {
    .footer .footer-center {
        margin: 0;
        padding: 0;
    }
}

@media (max-width: 393px) {
    .footer .footer-left {
        width: 56%;
    }
}

@media (max-width: 384px) {
    .footer .footer-center {
        margin: 0;
        padding: 0;
    }
}

@media (max-width: 375px) {
    .footer .footer-left {
        width: 58%;
    }
}

@media (max-width: 360px) {
    .footer .footer-left {
        width: 60%;
    }

    .footer ul.top-menu li.list-inline-item {
        width: auto;
        padding: 0 9px;
        font-size: 15px;
    }
}

@media (max-width: 330px) {
    .footer .footer-left {
        width: 66%;
    }

    .footer ul.list-inline.right {
        width: 100%;
    }

    .footer ul.top-menu li.list-inline-item {
        width: auto;
        padding: 0 8px;
    }
}

@media (max-width: 320px) {
    .footer .footer-left {
        width: 68%;
    }

    .footer ul.top-menu li.list-inline-item {
        width: auto;
        padding: 0 6px;
    }
}