body {
    margin: 0;
    padding: 0;
    font-family: Noto Sans JP, sans-serif;
}

h1 {
    margin: 0;
    padding: 0;
    line-height: 62px;
}

header {
    box-shadow: 0 2px 8px #333;
    z-index: 1;
    position: fixed;
    min-width: 700px;
    width: 100%;
    background-color: #000;
    height: 62px;
    padding-top: 10px;
    padding-left: 20px;
}

nav {
    position: absolute;
    right: 0;
    bottom: 20px;
    padding-right: 20px;
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

nav ul li a {
    font-size: 14px;
    text-decoration: none;
    color: #fff;
    padding: 0 20px;
    font-family: "Noto Sans JP", system-ui;
}

nav ul li a:hover {
    opacity: 0.6;
}

#visual {
    position: relative;
    height: 547px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/mainvisual.jpg);
    background-color: #000;
}

#visual h2 {
    text-align: center;
    text-shadow: 0 0 5px #000;
    margin: 0;
    padding-top: 80px;
    font-size: 2.2rem;
    color: #fff;
    font-family: Shippori Mincho;
}

#kodawari_menu .inner {
    padding-left: 60px;
    padding-top: 60px;
    box-sizing: border-box;
    height: 460px;
    width: 1200px;
    margin: 0 auto;
    background-size: 50%;
    background-position: right center;
    background-repeat: no-repeat;
    background-image: url(../images/ogaki_wakimizu.jpg);
    background-color: #fff;
}

#kodawari_menu h2 {
    margin: 0;
    padding: 0;
    font-family: Shippori Mincho;
    font-size: 2.2rem;
}

footer {
    background-color: #a00707;
    height: 150px;
}

footer .inner {
    text-align: center;
    width: 1200px;
    margin: 0 auto;
    padding-top: 20px;
}

footer ul {
    margin: 10px;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
}

footer ul li a {
    margin: 0 20px;
    color: #fff;
    text-decoration: none;
}

footer ul li a:hover {
    opacity: 0.6;
}

@media (max-width:786px) {
    header {
        min-width: auto;
    }

    nav {
        display: none;
    }

    h1 {
        text-align: center;
    }

    #visual h2 {
        font-size: 25px;
        padding-top: 130px;
    }

    #kodawari_menu .inner {
        width: auto;
    }

    footer {
        height: auto;
    }

    footer .inner {
        width: auto;
    }

    #visual {
        height: 360px;
        background-size: cover;
        background-size: 110%;
    }

    #kodawari_menu .inner {
        height: 600px;
        background-size: 70%;
        background-position: center bottom;
        background-repeat: no-repeat;
        padding-left: 0;
        padding-top: 50px;
    }

    #kodawari_menu h2 {
        text-align: center;
        font-size: 25px;
    }

    #kodawari_menu p {
        font-size: 15px;
        text-align: center;
    }

    footer ul {
        flex-direction: column;
        line-height: 2.3em;
    }

    footer ul li {
        border-bottom: 1px dotted #fff;
    }

    footer .inner {
        padding-top: 0;
    }

    footer p {
        padding-top: 1em;
        padding-bottom: 1em;
    }
}
