@media (max-width: 640px) {
  #body-wrap .content .sign-in-wrap, #body-wrap .content .register-wrap, #body-wrap .content .new-password-wrap {
    width: 100%;
    border: none;
    animation: show 0.5s ease 0s 1 backwards; } }

.content .sign-in-wrap, .content .register-wrap, .content .new-password-wrap {
  width: 70%;
  max-width: 450px;
  min-width: 320px;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  padding: 20px;
  margin: 0 auto;
  position: relative;
  top: 10%;
  box-sizing: border-box; }
  .content .sign-in-wrap h1, .content .register-wrap h1, .content .new-password-wrap h1 {
    margin-bottom: 20px; }
  .content .sign-in-wrap .form-register, .content .register-wrap .form-register, .content .new-password-wrap .form-register {
    display: flex;
    flex-flow: column nowrap;
    align-items: center; }
    .content .sign-in-wrap .form-register input, .content .register-wrap .form-register input, .content .new-password-wrap .form-register input {
      width: 100%; }
    .content .sign-in-wrap .form-register .btn, .content .register-wrap .form-register .btn, .content .new-password-wrap .form-register .btn {
      margin-top: 20px;
      width: 150px; }
    .content .sign-in-wrap .form-register .links, .content .register-wrap .form-register .links, .content .new-password-wrap .form-register .links {
      margin: 0 auto; }
  .content .sign-in-wrap .toggle-btn, .content .register-wrap .toggle-btn, .content .new-password-wrap .toggle-btn {
    background: transparent;
    color: #4b4b4b;
    margin: 50px auto;
    width: 200px;
    display: block;
    text-decoration: underline; }