body {
  display: flex;
  /* 자식 요소들을 유연하게 배치할 수 있는 Flex 레이아웃 적용 */
  /* display 값의 기본값은 block OR inline */
  flex-direction: column;
  /* 자식 요소들을 세로 방향으로 중앙 정렬 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  padding-top: 64px;
  /* 고정 헤더(64px) 높이만큼 본문 상단 여백 확보 */
}

.required {
  color: #ee6a7b;
  /* 텍스트 컬러 #ee6a7b로 지정 (마켓 컬리와 동일) */
}

#title {
  font-size: 28px;
  /* 폰트 사이즈 28px */
  font-weight: 500;
  /* 폰트 두께 500 (Regular) */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 (반복되는 HEX 컬러의 경우 3자리만 적어도 문제 없음) (마켓 컬리와 동일) */

  margin-bottom: 50px;
  /* 바깥으로 하단 여백 50px */
  margin-top: 50px;
  /* 바깥으로 상단 여백 50px */
}

#form {
  width: 640px;
  /* 너비 640px 고정 */
  margin: 0px auto;
  /* 바깥으로 상하 여백 0px, 좌우 여백 auto */
  /* auto는 상위 요소의 중앙으로 정렬됨 */
}

#signup-form {
  width: 640px;
  margin: 0 auto;
}

#form-info {
  padding-bottom: 10px;
  /* 안쪽으로 하단 여백 10px */
  text-align: right;
  /* 텍스트 우측 정렬 */
  font-size: 12px;
  /* 폰트 사이즈 12px */
  color: #666;
  /* 텍스트 컬러 #666으로 지정 (마켓 컬리와 동일) */

  border-bottom: 2px solid #333;
  /* 하단 테두리를 #333 색상으로 2px 실선 */
}


#option-rows {
  padding: 0px;
  /* 안쪽으로 여백 0px */
}

.option-row {
  display: inline-flex;
  /* Inline Flex 레이아웃 적용 */
  /* Inline Flex 레이아웃은 자식 요소들을 인라인 요소처럼 배치 */
  flex-wrap: wrap;
  /* 에러 메시지가 다음 줄로 내려갈 수 있도록 줄바꿈 허용 */
  width: 100%;
  /* 너비 100% */
  padding: 10px 20px;
  /* 안쪽으로 상하 여백 10px, 좌우 여백 20px */
  box-sizing: border-box;
  /* 테두리와 패딩을 너비에 포함 */
  /* box-sizing 값의 기본값은 content-box */
}

.field-error {
  width: 100%;
  min-height: 18px;
  margin: 4px 0 0;
  padding-left: 139px;
  box-sizing: border-box;
  font-size: 12px;
  color: #ee6a7b;
  line-height: 1.4;
}

#email-container .field-error,
#address-container .field-error {
  padding-left: 0;
}

.option-row-input-field.invalid,
#email-input.invalid,
#birthday-container.invalid {
  border-color: #ee6a7b;
}

#address-search-button.invalid {
  border-color: #ee6a7b;
  color: #ee6a7b;
}

#address-selected-text {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  color: #333;
}

#verify-button:not(:disabled) {
  color: #E85D4A;
  border-color: #E85D4A;
  cursor: pointer;
}

#signup-agreement-error {
  padding-left: 159px;
  margin-top: 0;
  padding-right: 20px;
  box-sizing: border-box;
}

.option-row-name {
  width: 139px;
  /* 너비 139px 고정 */
  padding-top: 12px;
  /* 안쪽으로 상단 여백 12px */
}

.option-row-name-label {
  font-weight: 500;
  /* 폰트 두께 500 (Regular) */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
}

.option-row-input {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
  /* flex-grow: 1; flex-shrink: 1; flex-basis: 0%; */

  /* flex-grow는 요소 내부에서 할당 가능한 공간의 정도를 지정. 1은 균등하게 차지 */
  /* flex-shrink 값이 1이면 축소 방지 */
  /* flex-basis는 flex 아이템의 초기 크기 지정 */
  position: relative;
  /* 상대 위치 지정 */
  /* position 값의 기본값은 static */
  height: 48px;
  /* 높이 48px 고정 */
}

.option-row-input-field {
  width: 100%;
  /* 너비 100% */
  height: 46px;
  /* 높이 46px 고정 */
  padding: 0px 11px 1px 15px;
  /* 안쪽으로 상단 0px, 우측 11px, 하단 1px, 좌측 15px 여백 */
  border-radius: 4px;
  /* 테두리 둥글기 4px */
  border: 1px solid #ddd;
  /* 테두리 #ddd 색상으로 1px 실선 */
  font-weight: 400;
  /* 폰트 두께 400 (Light) */
  font-size: 16px;
  /* 폰트 사이즈 16px */
  line-height: 1.5;
  /* 줄 높이 1.5배 */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  outline: none;
  /* 포커스 외곽선 제거 */
  /* input 태그의 기본 스타일 제거 */
  box-sizing: border-box;
  /* 테두리와 패딩을 너비에 포함 */
}

.option-row-input-button {
  width: 120px;
  /* 너비 120px 고정 */
  margin-left: 8px;
  /* 바깥으로 좌측 여백 8px */
}

#email-container {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
}

#email-input {
  position: relative;
  /* 상대 위치 지정 */
  height: 48px;
  /* 높이 48px 고정 */
  border-radius: 4px;
  /* 테두리 둥글기 4px */
  border: 1px solid #ddd;
  /* 테두리 #ddd 색상으로 1px 실선 */
  display: flex;
  /* Flex 레이아웃 적용 */
  -webkit-box-align: center;
  /* WebKit 브라우저 호환을 위한 정렬 속성 (Safari) */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
}

#email-input-field {
  width: 100%;
  /* 너비 100% */
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
  height: 46px;
  /* 높이 46px 고정 */
  padding: 0px 0px 1px 15px;
  /* 안쪽으로 상단 0px, 우측 0px, 하단 1px, 좌측 15px 여백 */
  font-weight: 400;
  /* 폰트 두께 400 (Light) */
  font-size: 16px;
  /* 폰트 사이즈 16px */
  line-height: 1.5;
  /* 줄 높이 1.5배 */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  outline: none;
  /* 포커스 외곽선 제거 */
  box-sizing: border-box;
  /* 테두리와 패딩을 너비에 포함 */
  border: 0px;
  /* 테두리 제거 */
}

#email-service-container {
  width: 143px;
  /* 너비 143px 고정 */
  height: 100%;
  /* 높이 100% (부모 요소에 맞춤) */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  position: relative;
  /* 상대 위치 지정 */
}

#email-service-select-button {
  text-align: left;
  /* 텍스트 좌측 정렬 */
  font-weight: 400;
  /* 폰트 두께 400 (Light) */
  font-size: 16px;
  /* 폰트 사이즈 16px */
  line-height: 1.5;
  /* 줄 높이 1.5배 */
  color: #999;
  /* 텍스트 컬러 #999로 지정 */
  flex: 1 1 auto;
  /* 남은 공간을 콘텐츠 크기 기준으로 차지 */
  border: none;
  /* 테두리 제거 */
  background-color: transparent;
  /* 배경색 투명 */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */
  white-space: nowrap;
  /* 텍스트 줄바꿈 방지 */
  overflow: hidden;
  /* 넘치는 콘텐츠 숨김 */
  text-overflow: ellipsis;
  /* 넘치는 텍스트를 말줄임(...)으로 표시 */
}

#email-service-direct-input-button {
  width: 48px;
  /* 너비 48px 고정 */
  height: 100%;
  /* 높이 100% (부모 요소에 맞춤) */
  border: none;
  /* 테두리 제거 */
  background-color: transparent;
  /* 배경색 투명 */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */
  flex-shrink: 0;
  /* Flex 아이템 축소 방지 */
}

#email-domain-field {
  flex: 1 1 auto;
  /* 남은 공간을 콘텐츠 크기 기준으로 차지 */
  height: 100%;
  /* 높이 100% (부모 요소에 맞춤) */
  border: none;
  /* 테두리 제거 */
  outline: none;
  /* 포커스 외곽선 제거 */
  font-size: 16px;
  /* 폰트 사이즈 16px */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  background: transparent;
  /* 배경 투명 */
  min-width: 0;
  /* 최소 너비 0 */
  display: none;
  /* 요소 숨김 */
}

#email-service-dropdown {
  display: none;
  /* 요소 숨김 */
  position: absolute;
  /* 절대 위치 지정 */
  top: calc(100% + 4px);
  /* 상단 위치: 부모 높이 + 4px */

  /* calc()를 쓰면 CSS 내에서 수학 연산을 할 수 있음 */
  left: -28px;
  /* 좌측 위치 -28px */
  width: 170px;
  /* 너비 170px 고정 */
  background: #fff;
  /* 배경색 흰색 */
  border: 1px solid #ddd;
  /* 테두리 #ddd 색상으로 1px 실선 */
  border-radius: 4px;
  /* 테두리 둥글기 4px */
  margin: 0;
  /* 바깥으로 여백 0 */
  padding: 4px 0;
  /* 안쪽으로 상하 여백 4px, 좌우 여백 0 */
  list-style: none;
  /* 리스트 기호 제거 */
  z-index: 100;
  /* 쌓임 순서 100 (다른 요소 위에 표시) */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  /* 그림자 효과 적용 */
}

#email-service-dropdown.open {
  display: block;
  /* 블록 레이아웃으로 표시 */
}

#email-service-dropdown li {
  padding: 10px 16px;
  /* 안쪽으로 상하 여백 10px, 좌우 여백 16px */
  font-size: 14px;
  /* 폰트 사이즈 14px */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */
}

#email-service-dropdown li:hover {
  background-color: #f7f7f7;
  /* 호버 시 배경색 #f7f7f7로 변경 */
}

#email-service-dropdown li.direct {
  color: #E85D4A;
  /* 텍스트 컬러 #E85D4A으로 지정 */
  border-top: 1px solid #eee;
  /* 상단 테두리를 #eee 색상으로 1px 실선 */
  margin-top: 4px;
  /* 바깥으로 상단 여백 4px */
}

#verify-button {
  width: 100%;
  /* 너비 100% */
  color: #ddd;
  /* 텍스트 컬러 #ddd로 지정 */
  height: 44px;
  /* 높이 44px 고정 */
  border-radius: 3px;
  /* 테두리 둥글기 3px */
  background-color: transparent;
  /* 배경색 투명 */
  outline: none;
  /* 포커스 외곽선 제거 */
  border: 1px solid #ddd;
  /* 테두리 #ddd 색상으로 1px 실선 */
}

#address-container {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
}

#address-search-button {
  display: block;
  /* 블록 레이아웃 적용 */
  padding: 0px 10px;
  /* 안쪽으로 상하 여백 0px, 좌우 여백 10px */
  text-align: center;
  /* 텍스트 중앙 정렬 */
  overflow: hidden;
  /* 넘치는 콘텐츠 숨김 */
  width: 100%;
  /* 너비 100% */
  height: 44px;
  /* 높이 44px 고정 */
  border-radius: 4px;
  /* 테두리 둥글기 4px */
  color: #E85D4A;
  /* 텍스트 컬러 #E85D4A으로 지정 */
  background-color: #fff;
  /* 배경색 흰색 */
  border: 1px solid #E85D4A;
  /* 테두리 #E85D4A 색상으로 1px 실선 */
}

#address-search-info {
  display: block;
  /* 블록 레이아웃 적용 */
  margin-top: 10px;
  /* 바깥으로 상단 여백 10px */
  font-size: 12px;
  /* 폰트 사이즈 12px */
  line-height: 18px;
  /* 줄 높이 18px */
  color: #666;
  /* 텍스트 컬러 #666으로 지정 */
}

#gender-container {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
  display: flex;
  /* Flex 레이아웃 적용 */
  justify-content: space-between;
  /* 자식 요소들을 양 끝으로 균등 배치 */
  flex-direction: row;
  /* 자식 요소들을 가로 방향으로 배치 */
}

.gender-option-label {
  position: relative;
  /* 상대 위치 지정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  padding: 12px 0px 9px;
  /* 안쪽으로 상단 12px, 좌우 0px, 하단 9px 여백 */
}

.gender-option-label-text {
  font-size: 14px;
  /* 폰트 사이즈 14px */
  margin-left: 12px;
  /* 바깥으로 좌측 여백 12px */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
}

.radio-input {
  appearance: none;
  /* 브라우저 기본 스타일 제거 */
  -webkit-appearance: none;
  /* WebKit 브라우저 기본 스타일 제거 (Safari) */
  width: 24px;
  /* 너비 24px 고정 */
  height: 24px;
  /* 높이 24px 고정 */
  border: 1px solid #ccc;
  /* 테두리 #ccc 색상으로 1px 실선 */
  border-radius: 50%;
  /* 테두리 둥글기 50% (원형) */
  background-color: #fff;
  /* 배경색 흰색 */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */
  flex-shrink: 0;
  /* Flex 아이템 축소 방지 */
}

.radio-input:checked {
  border: 7px solid #E85D4A;
  /* 선택 시 테두리 #E85D4A 색상으로 7px 실선 */
}

#birthday-container {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
  height: 44px;
  /* 높이 44px 고정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  border: 1px solid rgb(204, 204, 204);
  /* 테두리 rgb(204, 204, 204) 색상으로 1px 실선 */
  border-radius: 3px;
  /* 테두리 둥글기 3px */
  padding: 0px 15px;
  /* 안쪽으로 상하 여백 0px, 좌우 여백 15px */
  box-sizing: border-box;
  /* 테두리와 패딩을 너비에 포함 */
}

.birthday-input {
  position: relative;
  /* 상대 위치 지정 */
  height: 40px;
  /* 높이 40px 고정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
}

.birthday-input-field {
  text-align: center;
  /* 텍스트 중앙 정렬 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
  border: none;
  /* 테두리 제거 */
  width: 100%;
  /* 너비 100% */
}

.birthday-input-separator {
  color: #ccc;
  /* 텍스트 컬러 #ccc로 지정 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
}

.additional-option-row {
  display: none;
  /* 요소 숨김 */
}

.additional-option-label-text {
  font-size: 14px;
  /* 폰트 사이즈 14px */
  margin-left: 12px;
  /* 바깥으로 좌측 여백 12px */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
}

#spacer {
  width: 640px;
  /* 너비 640px 고정 */
  padding: 10px 0px;
  /* 안쪽으로 상하 여백 10px, 좌우 여백 0px */
  border-bottom: 1px solid #333;
  /* 하단 테두리를 #333 색상으로 1px 실선 */
}


#agreement-rows {
  width: 640px;
  /* 너비 640px 고정 */
  margin: 0px auto;
  /* 바깥으로 상하 여백 0px, 좌우 여백 auto */
  padding: 0px;
  /* 안쪽으로 여백 0px */
}

#agreement-container {
  display: inline-flex;
  /* Inline Flex 레이아웃 적용 */
  width: 100%;
  /* 너비 100% */
  padding: 10px 0px 10px 20px;
  /* 안쪽으로 상단 10px, 우측 0px, 하단 10px, 좌측 20px 여백 */
}

#agreement-title {
  width: 139px;
  /* 너비 139px 고정 */
  padding-top: 12px;
  /* 안쪽으로 상단 여백 12px */
}

#agreement-content {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
}


#agreement-item-main {
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: flex-start;
  /* 자식 요소들을 가로 방향으로 상단 정렬 */
  flex-direction: column;
  /* 자식 요소들을 세로 방향으로 배치 */
  padding-top: 12px;
  /* 안쪽으로 상단 여백 12px */
}

.agreement-item {
  display: flex;
  /* Flex 레이아웃 적용 */
  padding: 8px 0px;
  /* 안쪽으로 상하 여백 8px, 좌우 여백 0px */
  justify-content: space-between;
  /* 자식 요소들을 양 끝으로 균등 배치 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
}

#agreement-item-main-label {
  position: relative;
  /* 상대 위치 지정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  vertical-align: top;
  /* 인라인 요소 상단 정렬 */
  line-height: normal;
  /* 줄 높이 기본값 */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  padding: 0px;
  /* 안쪽으로 여백 0px */
  font-weight: 500;
  /* 폰트 두께 500 (Regular) */
  font-size: 18px;
  /* 폰트 사이즈 18px */
}

/* 체크박스 SVG는 마켓컬리 사이트 내 SVG 아이콘을 사용했습니다. */
.checkbox-input {
  margin-right: 12px;
  /* 바깥으로 우측 여백 12px */
  width: 24px;
  /* 너비 24px 고정 */
  height: 24px;
  /* 높이 24px 고정 */
  appearance: none;
  /* 브라우저 기본 스타일 제거 */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.5 12C23.5 18.3513 18.3513 23.5 12 23.5C5.64873 23.5 0.5 18.3513 0.5 12C0.5 5.64873 5.64873 0.5 12 0.5C18.3513 0.5 23.5 5.64873 23.5 12Z' stroke='%23ddd' fill='%23fff'/%3E%3Cpath d='M7 12.6667L10.3846 16L18 8.5' stroke='%23ddd' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  /* 비선택 상태의 체크박스 SVG 배경 이미지 */
  /* 마켓 컬리에서 추출 */
  background-size: cover;
  /* 배경 이미지를 요소 크기에 맞게 채움 */
}

.checkbox-input:checked {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23E85D4A'/%3E%3Cpath d='M7 12.6667L10.3846 16L18 8.5' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  /* 선택 상태의 체크박스 SVG 배경 이미지 (보라색) */
  /* 마켓 컬리에서 추출 */
}


#agreement-item-main-description {
  font-size: 12px;
  /* 폰트 사이즈 12px */
  color: #666;
  /* 텍스트 컬러 #666으로 지정 */
  padding-left: 40px;
  /* 안쪽으로 좌측 여백 40px */
  margin-top: -2px;
  /* 바깥으로 상단 여백 -2px */
}

.agreement-item-content {
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
}

.agreement-item-content-label {
  position: relative;
  /* 상대 위치 지정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  vertical-align: top;
  /* 인라인 요소 상단 정렬 */
  line-height: normal;
  /* 줄 높이 기본값 */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  padding: 0px;
  /* 안쪽으로 여백 0px */
  font-size: 14px;
  /* 폰트 사이즈 14px */
}

.agreement-item-content-required {
  padding-left: 5px;
  /* 안쪽으로 좌측 여백 5px */
  color: #999;
  /* 텍스트 컬러 #999로 지정 */
  word-break: keep-all;
  /* 단어 단위로 줄바꿈 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
}

.agreement-item-content-link {
  padding-right: 22px;
  /* 안쪽으로 우측 여백 22px */
  color: #E85D4A;
  /* 텍스트 컬러 #E85D4A으로 지정 */
  letter-spacing: 0px;
  /* 글자 간격 0px */
  text-decoration: none;
  /* 텍스트 밑줄 등 장식 제거 */
  /* a 태그의 기본 스타일 제거 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
}

#agreement-item-additional {
  display: flex;
  /* Flex 레이아웃 적용 */
  padding: 8px 0px;
  /* 안쪽으로 상하 여백 8px, 좌우 여백 0px */
  flex-direction: column;
  /* 자식 요소들을 세로 방향으로 배치 */
}

#agreement-item-additional-content {
  position: relative;
  /* 상대 위치 지정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  padding-left: 24px;
  /* 안쪽으로 좌측 여백 24px */
}

.additional-option-label {
  padding: 14px 60px 9px 0px;
  /* 안쪽으로 상단 14px, 우측 60px, 하단 9px, 좌측 0px 여백 */
  position: relative;
  /* 상대 위치 지정 */
  display: flex;
  /* Flex 레이아웃 적용 */
  align-items: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  vertical-align: top;
  /* 인라인 요소 상단 정렬 */
  line-height: normal;
  /* 줄 높이 기본값 */
  color: #333;
  /* 텍스트 컬러 #333으로 지정 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
}

#button-container {
  display: flex;
  /* Flex 레이아웃 적용 */
  width: 640px;
  /* 너비 640px 고정 */
  justify-content: center;
  /* 자식 요소들을 가로 방향으로 중앙 정렬 */
  border-top: 1px solid #f7f7f7;
  /* 상단 테두리를 #f7f7f7 색상으로 1px 실선 */
  padding: 40px 0px;
  /* 안쪽으로 상하 여백 40px, 좌우 여백 0px */
}

#submit-button {
  display: block;
  /* 블록 레이아웃 적용 */
  padding: 0px 10px;
  /* 안쪽으로 상하 여백 0px, 좌우 여백 10px */
  text-align: center;
  /* 텍스트 중앙 정렬 */
  overflow: hidden;
  /* 넘치는 콘텐츠 숨김 */
  width: 240px;
  /* 너비 240px 고정 */
  height: 56px;
  /* 높이 56px 고정 */
  border-radius: 3px;
  /* 테두리 둥글기 3px */
  color: #fff;
  /* 텍스트 컬러 #fff로 지정 */
  background-color: #E85D4A;
  /* 배경색 #E85D4A (마켓 컬리 보라색) */
  border: 0px none;
  /* 테두리 제거 */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */

  font-size: 16px;
  /* 폰트 사이즈 16px */
  font-weight: 500;
  /* 폰트 두께 500 (Regular) */
}

#additional-option-button {
  height: 44px;
  /* 높이 44px 고정 */
  border-radius: 3px;
  /* 테두리 둥글기 3px */
  background-color: transparent;
  /* 배경색 투명 */
  border: 1px solid #E85D4A;
  /* 테두리 #E85D4A 색상으로 1px 실선 */
  width: 100%;
  /* 너비 100% */
  outline: none;
  /* 포커스 외곽선 제거 */
  color: #E85D4A;
  /* 텍스트 컬러 #E85D4A으로 지정 */
  font-size: 14px;
  /* 폰트 사이즈 14px */
  font-weight: 500;
  /* 폰트 두께 500 (Regular) */
  cursor: pointer;
  /* 마우스 커서를 포인터(손가락)로 변경 */
}

#additional-option-description {
  flex: 1 1 0%;
  /* 남은 공간을 균등하게 차지 */
}

#additional-option-description-list {
  color: #666;
  /* 텍스트 컬러 #666으로 지정 */
  font-size: 12px;
  /* 폰트 사이즈 12px */
  font-weight: 400;
  /* 폰트 두께 400 (Light) */
  line-height: 18px;
  /* 줄 높이 18px */
  list-style: none;
  /* 리스트 기호 제거 */
  margin: 0px;
  /* 바깥으로 여백 0px */
  padding: 0px;
  /* 안쪽으로 여백 0px */
}
