@charset "utf-8";
/*--京user/login.css--*/
html{
    width: 100%;
    height: 100%;
}

#container{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.login_box{
    margin-top: 10rem;
}

    .login_box > .box_header{
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 2rem;
    }

        .login_box > .box_header p{
            font-size: 1.2rem;
            margin: 0 0 0.5em 0;
            font-weight: 500;
        }

        .login_box > .box_header h1{
            margin: 0;
            font-size: 1.6rem;
        }

    .login_box > .box_inner{
        background: #fff;
        border-radius: 0.5rem;
        padding: 2rem 3rem;
        box-shadow: 0 0 5px 1px rgba(0,0,0,0.05);
        margin-bottom: 3rem;
    }

        .login_box > .box_inner .msg{}

            .login_box > .box_inner .msg p{
                margin: 0 0 1.5em 0;
                padding: 0.5em 1em;
                color: #c40026;
                background: rgba(196,0,38,0.05);
                border-radius: 0.5em;
                font-weight: 500;
            }

        .login_box > .box_inner .input_box{
            margin-bottom: 1.5em;
        }

            .login_box > .box_inner .input_box dl{
                display: flex;
                align-items: center;
                margin: 0 0 1em 0;
            }

            .login_box > .box_inner .input_box dl:last-child{
                margin-bottom: 0;
            }

                .login_box > .box_inner .input_box dl dt{
                    width: 8em;
                }

                .login_box > .box_inner .input_box dl dd{}

                    .login_box > .box_inner .input_box dl dd input[type="text"],
                    .login_box > .box_inner .input_box dl dd input[type="password"]{
                        box-sizing: border-box;
                        border: 1px solid #aaa;
                        width: 20em;
                        padding: 0.2em;
                        font-size: 1.1em;
                    }

        .login_box > .box_inner .submit_box{
            display: flex;
            justify-content: center;
        }

            .login_box > .box_inner .submit_box input[type="submit"]{
                background: #137967;
                color: #fff;
                font-size: 1.1em;
                padding: 0.3em 1.5em 0.4em;
                border-radius: 0.25rem;
                font-weight: 500;
                transition: .3s all ease;
            }

            .login_box > .box_inner .submit_box input[type="submit"]:hover{
                filter: brightness(1.1);
            }

    .login_box > .box_footer{}

        .login_box > .box_footer .goto_register{}

            .login_box > .box_footer .goto_register dl{
                display: flex;
                flex-direction: column;
                align-items: center;
                margin-bottom: 0;
            }

                .login_box > .box_footer .goto_register dl dt{
                    font-size: 1.3em;
                    margin-bottom: 1.5em;
                    position: relative;
                }

                    .login_box > .box_footer .goto_register dl dt:before{
                        font-family: FontAwesome;
                        content:"\f078";
                        font-weight: normal;
                        display: inline-flex;
                        justify-content: center;
                        align-items: center;
                        line-height: 1;
                        height: 1em;
                        width: 1em;
                        position: absolute;
                        bottom: -1em;
                        left: calc(50% - 0.5em);
                        color: #137967;
                    }

                .login_box > .box_footer .goto_register dl dd{
                    width: 100%;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                }

                    .login_box > .box_footer .goto_register dl dd p{
                        margin-bottom: 1.3em;
                    }

                    .login_box > .box_footer .goto_register dl dd ul{
                        margin: 0;
                        padding: 0;
                        list-style: none;
                        display: flex;
                        width: 100%;
                    }

                        .login_box > .box_footer .goto_register dl dd ul li{
                            width: calc((100% - 2rem) / 3);
                            margin-right: 1rem;
                        }

                            .login_box > .box_footer .goto_register dl dd ul li a{
                                box-sizing: border-box;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                width: 100%;
                                height: 3rem;
                                background: #fff;
                                border-radius: 0.25rem;
                                border: 1px solid #137967;
                                color: #222;
                                font-weight: 500;
                                text-decoration: none;
                                font-size: 1.05em;
                                padding-bottom: 0.1em;
                                box-shadow: 2px 2px 0 0 rgba(0,0,0,0.15);
                                transition: .3s all ease;
                            }

                            .login_box > .box_footer .goto_register dl dd ul li a:hover{
                                background: #137967;
                                color: #fff;
                            }


/*1200px以下*/
@media screen and (min-width:1px) and (max-width:1200px){}

/*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) {}

/* ##########印刷用########## */
@media print{}