@charset "Shift_JIS";
/* login **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
body{ background:#f7f7f7; color:#333; }
.header { padding-top:70px; }
.header p{ font-size:24px; font-weight:bold; padding-top:30px; }
.contents { max-width: 670px; margin: 0 auto; }
.login{ padding:80px; }
.login .frm{ width:450px; margin:0 auto; }
.login .frm dt , .login .frm dd{ padding:10px 0; }
.login .frm dt{ width:140px; font-weight:bold; padding:17px 0 0 38px; }
.login .frm dd{ width:calc(100% - 150px); width:-webkit-calc(100% - 140px); }
.login .frm dd input{ width:450px; height:60px; font-size: 18px; }

.login .frm dl:nth-child(1) dt{ background:url("../images/icon_id.svg") 1px 15px / 20px no-repeat; }
.login .frm dl:nth-child(2) dt{ background:url("../images/icon_password.svg") 3px 15px / 18px 23px no-repeat; }

.login .cmt{ text-align:center; margin-top:40px; }
.login .cmt p{ display:inline-block; text-align:left; }

.login .error{ width:450px; background:#f7f7f7; padding:15px 25px; margin:40px auto 0; color:#920638; }

.login .btn{ margin-top:40px; }


/* ������ �^�u���b�g ������������������������������������������������������ */
@media only screen and (max-width: 768px){
/* login **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.header { text-align:center; }
.login{ padding:20px 30px 40px; }
.login .frm{ width:100%; }
.login .frm dt , .login .frm dd{ float:none; padding:5px 0; }
.login .frm dt{ width:100%; padding:17px 0 0 38px; }
.login .frm dd{ width:100%; }
.login .frm dd input{width:100%;}
.login .cmt{ margin-top:20px; }
.login .error{ width:100%; margin-top:20px; }
.login .btn{ margin-top:30px; }

}


/* ������ �X�}�z ���������������������������������������������������������� */
@media only screen and (max-width: 414px){ /* iPhone6Plus */
.login .btn { width:100%; }
.header { padding-top:inherit; margin-bottom:inherit; }
.header p { padding-top:10px; }
}