/* reset */
body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, form, input { margin: 0; padding: 0; }
body { font-size: 14px; -webkit-font-smoothing: antialiased; }
a { text-decoration: none; }

/* ui */
.ui-input { position: relative; padding: 15px 0; border-bottom: 1px solid #dfe6e5; font-size: 0; }
.ui-input input { width: 100%; height: 30px; border: 0; font-size: 14px; outline: none; }

.ui-button { height: 40px; border: 0; font-size: 14px; outline: none; cursor: pointer; }
.ui-button--primary { color: #fff; background-color: #a6aaad; }
.ui-button--success { color: #fff; background-color: #22d18e; }

/* page */
.form { width: 460px; margin: 0 auto; padding-top: 70px; }
.form .captcha { height: 30px; vertical-align: top; cursor: pointer; }
.form a { color: #7b7f81; }
.form a:hover { color: #666; }

.form-head { padding: 20px 0; text-align: center; }
.form-head h2 { font-size: 24px; font-weight: 400; }
.form-head p { margin-top: 12px; color: #7b7f81; }
.form-head p a { text-decoration: underline; }

.form-body { padding: 20px 40px; color: #222; }
.form-body .err-msg { text-align: center; color: #fc5c5c; }

.forget-password { margin-top: 10px; text-align: right; }
.form .narrow-input input { width: 290px; margin-right: 10px; }
.form .warn-msg { margin-bottom: 20px; }
.form .err-msg + .warn-msg { margin-top: 12px; }
.form .sms-button { display: inline-block; width: 80px; font-size: 14px; text-align: right; color: #22d18e; }
.form .sms-button:hover { color: #56e9b2; }
.form .form-notice { color: #22d18e; }
.form .ui-input.focus { border-bottom-color: #22d18e; }
.form .ui-button { width: 100%; margin: 40px 0; }