﻿@charset "utf-8";

body {
    font-family: 'メイリオ','ヒラギノ角ゴ Pro W3','Lucida Grande','Hiragino Kaku Gothic Pro',Osaka,Verdana,'ＭＳ Ｐゴシック',sans-serif;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
    min-width: 1280px;
}

/* **********************************************************
    login__info
********************************************************** */
.login__info {
    margin: 0 150px 30px 150px;
    padding-top: 30px;
}

    .login__info dl {
        background-color: #ffffff;
        display: table;
        width: 100%;
    }

    .login__info dt {
        background-color: #d21e1e;
        color: #ffffff;
        display: table-cell;
        font-weight: bold;
        text-align: center;
        vertical-align: middle;
        width: 5em;
    }

    .login__info dd {
        display: table-cell;
        vertical-align: middle;
        padding: 15px 10px;
    }

/* **********************************************************
    login__form
********************************************************** */
.login__form {
    padding: 40px 0;
}

    .login__form button {
        box-shadow: 0px 0 10px 0px rgba(0,0,0,0.1);
        -webkit-box-shadow: 0px 0 10px 0px rgba(0,0,0,0.1);
        -webkit-appearance: none;
        border-radius: 0;
        box-sizing: border-box;
        background-color: #0d47a1;
        border: none;
        cursor: pointer;
        outline: none;
        color: #ffffff;
        display: block;
        font-size: 1.6rem;
        font-weight: bold;
        padding: 10px 15px;
        appearance: none;
        white-space: nowrap;
    }

        .login__form button:hover {
            background-color: #fecb2f;
            color: #000000;
        }

        .login__form button span {
            background: url(/Content/images/arw_login.png) right center no-repeat;
            display: block;
            padding: 0 20px;
        }

        .login__form button:hover span {
            background: url(/Content/images/arw_login_hover.png) right center no-repeat;
        }

        .login__form button.pageback {
            padding: 10px 25px;
        }

            .login__form button.pageback span {
                background: url(/Content/images/arw_back.png) left center no-repeat;
                padding: 0 0 0 20px;
            }

            .login__form button.pageback:hover span {
                background: url(/Content/images/arw_back_hover.png) left center no-repeat;
            }

        .login__form button:disabled {
            background-color: #cccccc;
            color: #ffffff;
        }

            .login__form button:disabled span {
                background: url(/Content/images/arw_login.png) right center no-repeat;
            }

    .login__form input[type="text"] {
        box-shadow: 0px 0 10px 0px rgba(0,0,0,0.1);
        -webkit-box-shadow: 0px 0 10px 0px rgba(0,0,0,0.1);
        background-color: #ffffff;
        -webkit-appearance: none;
        border-radius: 0;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        border: 0px;
        padding: 5px 10px;
        width: 100%;
    }

    .login__form input[type="checkbox"] {
        margin-right: 5px;
    }

    .login__form p {
        margin-bottom: 20px;
        padding: 0 310px;
    }

    .login__form dt {
        text-align: center;
        margin-bottom: 20px;
    }

        .login__form dt label {
            display: inline-block;
        }

    .login__form dd {
        text-align: center;
    }

        .login__form dd > div {
            display: flex;
            justify-content: center;
        }

            .login__form dd > div > button {
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
                font-size: 1.6rem;
                text-align: left;
                margin: 0 10px;
                padding: 10px 20px 10px 0;
                width: 310px;
            }

                .login__form dd > div > button em {
                    display: block;
                    font-size: 1.4rem;
                    font-weight: bold;
                }

                .login__form dd > div > button small {
                    display: block;
                    font-size: 1.2rem;
                    font-weight: bold;
                }

        .login__form dd p {
            border-top: 1px solid #cccccc;
            text-align: center;
            margin: 40px 40px 0 40px;
            padding-top: 15px;
        }

            .login__form dd p button {
                box-shadow: none;
                -webkit-box-shadow: none;
                -webkit-appearance: none;
                border-radius: 0;
                box-sizing: border-box;
                background-color: transparent;
                border: none;
                cursor: pointer;
                outline: none;
                color: #000000;
                display: inline-block;
                font-size: 1.6rem;
                font-weight: bold;
                padding: 0;
                appearance: none;
                white-space: nowrap;
            }

                .login__form dd p button:hover {
                    background-color: transparent;
                    color: #000000;
                    text-decoration: underline;
                }

                .login__form dd p button span {
                    background: url(/Content/images/arw_back_hover.png) left center no-repeat;
                    display: block;
                    padding: 0 0 0 20px;
                }

                .login__form dd p button:hover span {
                    background: url(/Content/images/arw_back_hover.png) left center no-repeat;
                }

/* **********************************************************
    login__contents
********************************************************** */
.login__contents {
    background-color: #fcf7e3;
    border: 10px solid #383838;
    margin: 0 150px;
}

    .login__contents h2 {
        background-color: #383838;
        text-align: center;
        padding: 25px 200px;
    }

        .login__contents h2 span {
            display: block;
            position: relative;
        }

            .login__contents h2 span:after {
                border-top: 1px solid #9b8233;
                content: "";
                position: absolute;
                top: 50%;
                left: 0px;
                width: 100%;
            }

        .login__contents h2 em {
            background-color: #383838;
            color: #fecb2f;
            display: inline-block;
            font-size: 2.4rem;
            font-weight: bold;
            line-height: 1.2;
            padding: 0 10px;
            position: relative;
            z-index: 2;
        }

    .login__contents .contents__agree {
        background-color: #ffffff;
        overflow-y: scroll;
        height: 280px;
    }

        .login__contents .contents__agree .agree__inner {
            padding: 15px 20px;
        }


/* **********************************************************
    login__contents
********************************************************** */
.info__contents {
    background-color: #ffffff;
}

    .info__contents .contents__agree {
        background-color: #ffffff;
        overflow-y: scroll;
        height: 110px;
    }


.blink {
    -webkit-animation: blink 1.5s ease infinite;
    animation: blink 1.5s ease infinite;
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.marquee_area {
    width: 792px;
    overflow: hidden;
}

.marquee {
    width: 792px;
    padding-left: 800px;
    white-space: nowrap;
    animation-name: marquee;
    animation-duration: 20s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@keyframes marquee {
    from {
        transform: translate(0%);
    }

    100%,to {
        transform: translate(-200%);
    }
}