.page-header {
  h1 {
    text-align: center;
  }
}

.memo {
  display: inline-block;
  margin-bottom: 20px;
}

.swpm-terms-row,
.swpm-pp-row {
  a {
    text-decoration: underline;
  }
}

.swpm-edit-profile-form,
.swpm-registration-form-section {
  display: flex;
  flex-direction: column;

  input[type='text'],
  input[type='password'] {
    padding: 4px;
    width: 100%;
  }

  .swpm-membership-level-row {
    display: none;
  }

  .swpm-username-row {
    order: 1;
  }

  .swpm-email-row {
    order: 2;
  }

  .swpm-password-row {
    order: 3;
  }

  .swpm-repass-row {
    order: 4;
  }

  .swpm-lastname-row {
    order: 5;
  }

  .swpm-firstname-row {
    order: 6;
  }

  .swpm-terms-row {
    order: 7;
    font-size: 14px;
  }

  .swpm-pp-row {
    order: 8;
    font-size: 14px;
  }

  .swpm-submit-section {
    order: 9;
  }
}

.swpm-edit-profile-form,
.swpm-registration-widget-form {
  .swpm-registration-submit-button:hover {
    background-color: #eee;
  }

  .swpm-edit-profile-submit-section,
  .swpm-registration-submit-button {
    width: 100%;
    border: 1px solid #3593df;
    background-color: #3593df;
    color: #fff;
    box-sizing: border-box;
  }

  .swpm-edit-profile-submit-section:hover,
  .swpm-registration-submit-button:hover {
    border: 1px solid #2b76b3;
    background-color: #2b76b3;
  }

  .swpm-edit-profile-submit-section {
    button {
      width: 100%;
      box-sizing: border-box;
    }
  }
}

/* ログインフォーム */
.swpm-validate-form,
.swpm-pw-reset-widget-form,
.swpm-login-widget-form {
  input[type='text'],
  input[type='password'] {
    padding: 4px;
    width: 100% !important;
  }

  .swpm-username-input,
  .swpm-password-input,
  .swpm-forgot-pass-link {
    margin-bottom: 16px;
  }

  .swpm-pw-reset-submit,
  .swpm-login-form-submit {
    width: 100%;
    border: 1px solid #3593df;
    background-color: #3593df;
    color: #fff;
  }

  .swpm-pw-reset-submit:hover,
  .swpm-login-form-submit:hover {
    border: 1px solid #2b76b3;
    background-color: #2b76b3;
  }

  .swpm-login-form-register-link {
    display: inline-block;
    padding: 8px 20px;
    background-color: #eee;
  }

  .swpm-login-form-register-link:hover {
    display: inline-block;
    padding: 8px 20px;
    background-color: #ccc;
  }
}

.membership-container {
  max-width: 560px;
  margin: 0 auto;
  /* border: 1px solid #121212; */
  padding: 40px;
  border-radius: 8px;
  background-color: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);

  @media (max-width: 600px) {
    max-width: 100%;
    padding: 40px 20px;
  }

  h1 {
    text-align: center;
    margin-bottom: 20px;
  }

  .btn-area {
    display: flex;
    gap: 8px 12px;

    @media (max-width: 600px) {
      flex-direction: column;
    }

    .btn-default {
      border-radius: 4px;
      display: inline-block;
      padding: 8px 20px;
      background-color: #eee;
    }

    .btn-default:hover {
      display: inline-block;
      padding: 8px 20px;
      background-color: #ccc;
    }
  }
}

input::placeholder {
  color: #ccc;
}