body {
    margin: 0;
    font-family: "Noto Sans JP", sans-serif;
    background: linear-gradient(#f7f7f7, #ededed);
    color: #333;
}

.login-wrapper {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.login-card {
    background: #ffffff;
    padding: 36px;
    width: 380px;
    border-radius: 14px;
    border: 1px solid #dddddd;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1);
}

.title {
    margin: 0;
    font-size: 24px;
    color: #333;
}

.underline {
    width: 36px;
    height: 3px;
    background: #c00028;
    border-radius: 999px;
    margin: 10px 0 20px;
}

.label {
    font-size: 13px;
    margin-bottom: 6px;
    display: block;
    color: #333;
    float: left;
}

.inputBox {
    width: 100%;
    padding: 10px 12px;
    margin-bottom: 18px;
    border-radius: 10px;
    border: 1px solid #cccccc;
    background: #f7f7f7;
    color: #333;
    font-size: 14px;
}

.inputBox:focus {
  border-color: #c00028;
  outline: none;
}
.checkbox-inline label {
    display: inline-block;
}
.login-btn {
    width: 100%;
    padding: 12px 0;
    background: #c00028;
    border: none;
    border-radius: 12px;
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
}

.login-btn:hover {
        background: #1976d2;
        /*padding-right: 28px;*/
}

.accent {
   color: #c00028;
}

.accent:hover {
   text-decoration: underline;
}

.login {
    width: 280px; /*padding分減らす(left,right)*/
    height: 240px;
    padding: 10px;
    border: solid 1px #e0ffff;
    border-radius: 30px; /* CSS3草案 */
    -webkit-border-radius: 10px; /* Safari,Google Chrome用 */
    -moz-border-radius: 10px; /* Firefox用 */
    background-color: #f5f5f5;
}

.loginTitle {
    display: block;
    width: 200px;
    color: #696969;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
}