/* === My page === */
.mypage div.account__form div.cosmosfarm-members-form {
  max-width: 600px;
  background-color: var(--color-bg-background-gray);
  padding: 0 40px 0;
  border-radius: 24px;
}
.mypage div.account__form div.profile-header {
  margin-bottom: clamp(40px, calc(40px + 40 * ((100vw - 320px) / 1120)), 80px);
}
.mypage div.account__form div.profile-header .avatar-img .change-avatar-message {
  margin-top: 12px;
}
.mypage div.account__form ul.members-link {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  border: none;
  background-color: transparent;
  overflow: visible;
}
.mypage div.account__form ul.members-link li {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px;
  font-size: clamp(14px, calc(14px + 2 * ((100vw - 320px) / 1080)), 16px);
  border-radius: 8px;
  border: 1px solid var(--color-border-gray);
  background-color: var(--color-white);
  transition: 0.3s;
}
.mypage div.account__form ul.members-link li a {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  text-decoration: none;
  border: none;
  color: var(--color-gray-dark);
  transition: 0.3s;
}

@media (hover: hover) {
  .mypage div.account__form ul.members-link li:hover {
    border: 1px solid var(--color-primary-soft-rose);
    background-color: var(--color-primary-soft-rose);
    transform: translateY(-4px);
    box-shadow: 0 8px 24px 0 rgba(255, 181, 181, 0.35);
  }
  .mypage div.account__form ul.members-link li:hover a {
    color: var(--color-white);
  }
  .mypage div.account__form ul.members-link li a:hover {
    border-bottom: none;
    text-decoration: none;
  }
}

@media (max-width: 767px) {
  .mypage div.account__form div.cosmosfarm-members-form {
    padding: 20px 20px 40px;
  }
}

/* === Register === */
.register div.policy_content h3{
    font-size: clamp(16px, calc(16px + 8 * ((100vw - 320px) / 1080)), 24px);
}
.register div.policy_content h4{
    font-size: clamp(14px, calc(14px + 4 * ((100vw - 320px) / 1080)), 18px);
}
.register div.policy_content p{
    font-size: clamp(12px, calc(14px + 4 * ((100vw - 320px) / 1080)), 16px);
}
.register .register__form .cosmosfarm-members-form .div_checkbox .policy_content {
  font-size: clamp(12px, calc(12px + 2 * ((100vw - 320px) / 1080)), 14px);
  line-height: 1.4;
  margin-bottom: 12px;
  border-radius: 8px;
  border: 1px solid var(--color-border-gray);
  color: var(--color-gray-medium);
  background-color: var(--color-bg-light-background);
}

.register .register__form .cosmosfarm-members-form .div_text .add-buttons {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
}
.register .register__form .cosmosfarm-members-form .div_text .add-buttons div.add-buttons-wrap {
  position: static;
}
.register .register__form .cosmosfarm-members-form .div_text .add-buttons div.add-buttons-wrap button {
  height: 100%;
  background-color: var(--color-primary-soft-rose) !important;
  border-radius: 0 8px 8px 0;
}

.register .register__form .cosmosfarm-members-form input[type='text']#username {
  border-radius: 8px 0 0 8px;
  border-right-width: 0px;
}
