@charset "utf-8";
/*login.css*/
html{
    height: 100%;
}

#container{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.login_box{
    background: #fff;
    box-shadow: 0 0 1rem 0 rgba(0,0,0,0.1);
    padding: 2.5rem 5rem;
    border-radius: 0.5rem;
}

    .login_box > .box_header{
        margin-bottom: 1.5em;
    }

        .sys_name{
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1rem;
        }

            .sys_name .figs{
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 0.5rem;
            }

                .sys_name .figs .fig_logo{
                    width: 5rem;
                }

                .sys_name .figs .fig_org{
                    width: calc(5rem / 156 * 360);
                }

            .sys_name .lbl{
                font-size: 1.2rem;
                font-weight: 500;
            }


    .login_box > .box_inner{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .login_box > .box_inner .err_msg{
            margin-bottom: 1em;
            color: #c40026;
            font-weight: 500;
        }

        .login_box > .box_inner h2{
            font-size: 1.15em;
            font-weight: 500;
            color: #29275e;
            border-bottom: 2px solid #29275e;
            margin-bottom: 1em;
        }

        .login_box > .box_inner .input_box{
            display: flex;
            flex-direction: column;
            gap: 1em;
            margin-bottom: 1.5em;
        }

        .login_box > .box_inner .input_box dl{
            display: flex;
            flex-direction: column;
            align-items: center;
        }

            .login_box > .box_inner .input_box dl dt{
                margin-bottom: 0.2em;
            }

            .login_box > .box_inner .input_box input[type="text"],
            .login_box > .box_inner .input_box input[type="password"]{
                width: 25em;
            }

        .login_box > .box_inner .submit_box{
            display: flex;
            justify-content: center;
        }

            .login_box > .box_inner .submit_box button{
                box-sizing: border-box;
                border: 1px solid #29275e;
                background: #29275e;
                color: #fff;
                font-size: 1.1em;
                padding: 0 1.5em;
                border-radius: 0.25rem;
                height: 2.2em;
                cursor: pointer;
                transition: .3s all ease;
            }

                .login_box > .box_inner .submit_box button::after{
                    font-family: FontAwesome;
                    content:"\f090";
                    font-size: 1.2em;
                    font-weight: normal;
                    margin-left: 0.3em;
                }

            .login_box > .box_inner .submit_box button:hover{
                background: #fff;
                color: #29275e;
                box-shadow: 3px 3px 0 0 rgba(0,0,0,0.1);
            }

/*ipad*/
@media screen and (min-width:1px) and (max-width:1024px){
}

/* ##########SP横向き########## */
@media screen and (min-width:1px) and (max-width:768px) {
}

/* ##########SP########## */
@media screen and (min-width:1px) and (max-width:479px) {
    .login_box{
        box-sizing: border-box;
        width: 90vw;
        padding: 2.5rem;
    }

    .sys_name .figs .fig_logo{
        width: 4rem;
    }

    .sys_name .figs .fig_org {
        width: calc(4rem / 156 * 360);
    }

    .login_box > .box_inner form{
        width: 100%;
    }

        .login_box > .box_inner .input_box dd{
            width: 100%;
        }

        .login_box > .box_inner .input_box input[type="text"],
        .login_box > .box_inner .input_box input[type="password"]{
            width: 100%;
        }


}

/* ##########印刷用########## */
@media print{
}