@charset "UTF-8";
/* ログイン (index) ページ用。しろくまさん製 */
/* ---------------------------------
 width <= 1280px
 --------------------------------- */
@media screen and (min-width:1px) and (max-width:1280px) {
    header {
        width: 100%;
        padding:1rem 1.6rem;
    }
}
/* ---------------------------------
 width <= 800px
 --------------------------------- */
@media screen and (min-width:1px) and (max-width:800px) {
}
/* ---------------------------------
 width <= 640px
 --------------------------------- */
@media screen and (min-width:1px) and (max-width:640px) {
    header {
        display: block;
        text-align: center;
        margin-bottom:10px;
    }
    nav {
        display: flex;
        justify-content: center;
        margin-bottom:10px;
    }
    nav ul li {
        padding-left: 0px;
    }
    nav ul li a {
        padding: 0 15px;
    }
    section {
        width: 100%;
        padding: 23px 40px;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        position:static;
        margin:30px auto 50px;
    }
    #outer-section {
        margin:0 auto;
        width: 90%;
    }
    form {
        margin-top: 24px;
    }
}
/* ---------------------------------
 width <= 480px
 ---------------------------------*/
@media screen and (min-width:1px) and (max-width:480px) {
}
/* ---------------------------------
 width <= 400px
 ---------------------------------*/
@media screen and (min-width:1px) and (max-width:400px) {
    form ul {
        display: block;
    }
    input {
        margin-bottom: 10px;
    }
}
/* ---------------------------------
 width <= 360px
 ---------------------------------*/
@media screen and (min-width:1px) and (max-width:360px) {
    section {
        padding: 23px 20px
    }
}
/* ---------------------------------
 width <= 320px
 ---------------------------------*/
@media screen and (min-width:1px) and (max-width:320px) {
}
/* End of responsive.css */
