@charset "UTF-8";

* {
  padding: 0;
  margin: 0;
  line-height: 1.8;
  font-family: "メイリオ", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック体", "Yu Gothic", YuGothic, "Meiryo", "sans-serif";
}

header {
  padding: 5rem auto;
}

/*ログイン情報入力*/
    .up{
        width:600px;
        margin:0 auto;
        border:solid 2px #4a3bfd ;
        margin-top: 10px;
    }

    .user_name{
        width:80%;
    }

    .pass_word{
        width:80%;
    }
    /*ユーザー情報入力様式指定①_表題*/
        dt {
            padding-left: 1rem;
        }
        /*ユーザー情報入力様式指定②_テキストボックス*/
            dd {
                text-align : center ;
                width:50%;
            }
        /*ログインボタンの様式指定*/
            #ap {
                width:80%;
                margin: 0 auto;
            }
        /*システム自動ログアウトの注意喚起メッセージ様式指定*/
            p {
                text-align: center;
            }

/*ロゴデータ画像*/
    #photo {
        width: 600px;
        height: 140px;
        margin: 0 auto;
        text-align: center;
        overflow: hidden;
        position: relative;
        margin-top: 10px;
    }

    #photo img {
        top: 0;
        left: 0;
        position: absolute;
    }

/*コンテナ*/
    .container {
        width: 600px;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .container.box {
        display:block;
        position:absolute;
        height:100px;
        top:0;
        bottom:0;
        right:0;
        left:0;
        margin:auto;
    }

/*フッター*/
    footer {
        background-color: #0000cd;
        color: azure;
        margin-top: 10px;
        width:100%;
        margin: 0 auto;
        margin-top: 10px;
    }

    footer p {
      text-align: center;
    }

.container_mobile {
        width: 60%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center; 
}
.up_mobile{
        width:80%;
        margin:0 auto;
        border:solid 2px #4a3bfd ;
        margin-top: 10px;
    }