#sajuForm {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.form_wrapper {
  width: 100%;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  justify-items: center;
  border-radius: var(--border-radius-l);
  background-color: var(--color-boxGray);
}
.form_wrapper.doubleForm {
  gap: 16px;
}
.formTitle {
  width: 100%;
  text-align: center;
  font-size: var(--size-base);
  font-weight: var(--weight-large);
}

.form_wrapper.nonBg {
  width: 100%;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  justify-items: center;
  background-color: white;
}

.form_section {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
}
.form_section.doubleForm {
  flex-direction: row;
  gap: 4px;
}
.solar_lunar_select_container {
  overflow: hidden;
}

.form_label {
  font-size: var(--size-sm);
  font-weight: var(--weight-medium);
  color: var(--color-black);
  min-width: 70px;
  align-content: center;
}

.form_label span {
  font-size: var(--size-xs);
  font-weight: var(--weight-medium);
  color: var(--color-gray3);
}
.form_label p {
  display: inline-block;
}
.form_label {
  display: inline-block;
}

.form_label .name {
  font-size: var(--size-sm);
  font-weight: var(--weight-medium);
  color: var(--color-black);
}
.form_label .required {
  color: var(--color-purple);
  margin-left: 2px;
  font-size: var(--size-sm);
  font-weight: var(--weight-large);
}
.form_section input,
.form_section select,
.form_section button {
  width: 100%;
  height: 44px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  border-radius: var(--border-radius-xs);
  padding: 0 10px;
  font-size: var(--size-sm);
  font-weight: var(--weight-medium);
  color: var(--color-black2);
}
.form_section input:focus-visible,
.form_section select:focus-visible,
.form_section button:focus-visible {
  outline: none;
  border: 1px solid var(--color-purple);
}
.form_section select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url('/img/icons/arrow_down_black.svg');
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 24px;
  /* padding-right: 32px; */
}
.form_section > div {
  width: 100%;
  display: flex;
  gap: 8px;
}

.form_section button {
  border: 1px solid #ddd;
  background: #fff;
  cursor: pointer;
  word-break: keep-all;
  overflow: hidden;
}

.form_section button.active {
  border: 2px solid var(--color-purple);
  box-sizing: border-box;
  color: var(--color-purple);
}
.form_section button.form_submit_button {
  border: none;
  background-color: var(--color-purple);
  color: white;
  font-size: var(--size-base);
  margin-top: 16px;
}
.info_desc_box {
  width: 100%;
  padding: 16px 0;
  border-radius: var(--border-radius-xs);
  font-size: var(--size-sm);
  font-weight: var(--weight-regular);
  color: var(--color-gray3);
}
.info_desc_box b {
  color: var(--color-purple);
}
.form_section .term_checkbox {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.form_section textarea {
  resize: none;
  overflow: hidden;
  width: 100%;
  min-height: 200px;
  padding: 10px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  border-radius: var(--border-radius-xs);
  font-size: var(--size-sm);
}
.form_section textarea:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--color-purple);
}
.term {
  width: 100%;
  display: flex;
  flex: row;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  font-size: var(--size-sm);
  font-weight: var(--weight-medium);
  padding: 0 16px;
}
.term.allcheck {
  padding: 16px;
  border-radius: var(--border-radius-xs);
  background-color: var(--color-boxGray);
  margin-bottom: 8px;
}
.term input {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.term span {
  color: var(--color-purple);
  margin-left: 2px;
}
.term p {
  display: inline-block;
}
.term a {
  text-decoration: underline;
  display: inline-block;
}

.term_checkbox input[type='checkbox'] {
  accent-color: #9558f8;
}
#city_results {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: white;
  border: 1px solid var(--color-borderGray);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 999;
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 200px;
  overflow-y: auto;
  font-size: var(--size-sm);
  font-weight: var(--weight-medium);
  color: var(--color-black2);
}

#city_results li:hover {
  background-color: #f8f9fa;
  color: #007bff;
}

.withdrawal_terms_section {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
}

.withdrawal_terms_title {
  font-size: var(--size-lg);
  font-weight: var(--weight-large);
}
.withdrawal_terms_container {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid var(--color-border-gray);
  padding: 10px 20px;
  border-radius: var(--border-radius-xs);
}
.withdrawal_terms_subTitle {
  font-size: var(--size-lg);
  font-weight: var(--weight-large);
}
.withdrawal_terms_list {
  display: flex;
  flex-direction: column;
  list-style-type: disc;
}
.withdrawal_terms_list li {
  font-size: var(--size-sm);
  margin: 5px 0 5px 20px;
}

.sr-only {
  /* 1. 요소를 흐름에서 완전히 빼서 크기를 0에 가깝게 만듭니다. */
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;

  /* 2. 눈에 보이는 부분을 사각형으로 잘라내어 숨깁니다. */
  clip: rect(0, 0, 0, 0) !important; /* 구형 브라우저용 */
  clip-path: inset(50%) !important; /* 최신 브라우저용 (모바일 포함) */

  /* 3. 줄바꿈 방지 및 테두리 제거 */
  white-space: nowrap !important;
  border: 0 !important;
}
