.resume_wrap {
  background: #fafafa;
}

.resume{
  padding: 50px 0;
}

.checkbox label {
  font-size: 18px;
  cursor: pointer;
  font-weight: 500;
  letter-spacing: -0.54px;
  color: #3a3a3a;
}

.custom-select {
  background: #fff;
}

.custom-select .selected {
  cursor: pointer;
}
.custom-select .selected input{
  cursor: pointer;
}

.x_img {
  filter: brightness(0);
  width: 12px;
}

.career_wrap .add_wrap,
.certificate_wrap .add_wrap{ display: none;}

/* 최근 임시저장한 이력서 */
.resume_temp_wrap {
  border: 1px solid #66affe;
  border-radius: 10px;
  background: #f2f7fc;
  padding: 35px 44px;
  margin-bottom: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.resume_temp_wrap.on {

}
.resume_temp_wrap .left {
  display: flex;
  align-items: center;
  gap: 30px;
  cursor:
}

.resume_temp_wrap .left .tit {
  font-size: 30px;
  font-weight: 600;
  color: var(--brandColor);
  letter-spacing: -0.9px;
}

.resume_temp_wrap .left .date {
  color: #878787;
  font-size: 20px;
  letter-spacing: -0.6px;
}

.resume_temp_wrap .btn_load_temp {
  border-radius: 5px;
  background: #878787;
  color: #fff;
  padding: 15px 20px;
  font-size: 18px;
  letter-spacing: -0.54px;
  transition: all .2s;
}
.resume_temp_wrap .btn_load_temp:hover{
  background-color: #3a3a3a;
}

/* form 내부 wrap 정렬 */
.resume_content_wrap {
  display: flex;
  align-items: flex-start;
  gap: 22px;
}

.resume_form_wrap {
  width: calc(100% - 200px);
}

/* form 공동 스타일 */
.required_mark {
  font-size: inherit;
  font-weight: inherit;
  color: #df222c;
}

.form_group {
  margin-bottom: 60px;
}

.form_group:last-child {
  margin-bottom: 0;
}

.form_group .section_title_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.form_group .section_title_wrap h2{
  font-size: 30px;
  font-weight: 700;
  display: flex;
  gap: 3px;
  letter-spacing: -0.9px;
}

.form_group .contents_wrap {
  border: 1px solid #d5d5d5;
  border-radius: 10px;
  background: #fff;
  padding: 40px 44px;
}

.form_group .contents_wrap .form_row {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.form_group .contents_wrap .form_row:nth-last-child(1) {
  margin-bottom: 0;
}

.form_group .contents_wrap .form_row .sub_title {
  width: 150px;
  font-weight: 600;
  display: flex;
  gap: 3px;
  font-size: 20px;
  flex-shrink: 0;
  letter-spacing: -0.6px;
}

.form_group input {
  border: 1px solid #d5d5d5;
  border-radius: 5px;
  padding: 16px 20px;
  width: 100%;
  font-size: 18px;
}

.title_wrap .contents_wrap {
  padding: 34px 44px;
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
}

.title_wrap input[type=text] { 
  width: 100%;
}

.title_wrap .contents_wrap span{
  flex-shrink: 0;
  width: 70px;
  font-size: 18px;
  color: #878787;
  letter-spacing: -0.54px;
  text-align: right;
}
.title_wrap .contents_wrap span b{
  color: var(--brandColor);
}

.btn_add {
  border-radius: 8px;
  border: 1px dashed #878787;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 15px;
  width: 100%;
  font-size: 18px;
}

.btn_add img {
  width: 18px;
}

.noti_wrap {
  line-height: 1.5;
  margin-top: 30px;
  letter-spacing: -0.64px;
  color: #3a3a3a;
}

.section_title_wrap .blue {
  font-size: 24px;
  color: var(--brandColor);
  font-weight: 600;
}

/* 기본정보 */
.basic_wrap .contents_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.basic_wrap .contents_wrap .row{
  display: flex;
  gap:60px;
  width: 100%;
}
.basic_wrap .contents_wrap .left {
  flex: 1;
}

.basic_wrap .user_info_wrap {
  display: flex;
  gap: 20px;
  align-items: center;
  width: 100%;
  margin-bottom: 24px;
}

.basic_wrap .user_info_wrap .user_name { 
  font-size: 22px;
  font-weight: 700;
}

.basic_wrap .user_info_wrap .user_meta {
  color: #909090;
  font-size: 18px;
}

.basic_wrap .user_info_wrap .user_birth {
  color: #909090;
  position: relative;
}

.basic_wrap .user_info_wrap .user_birth:before {
  content: '';
  width: 1px;
  height: 12px;
  background: #e2e2e2;
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
}

.basic_wrap .address_wrap {
  display: flex;
  gap: 26px;
  width: 100%;

}
.basic_wrap .address_wrap input{
  flex: 1;
}

.basic_wrap .photo_wrap {
  flex-shrink: 0;
  width: 160px;
}
.basic_wrap .photo_wrap .photo_upload_ui {
  border: 1px dashed #878787;
  border-radius: 8px;
  background: #f2f7fc;
  height: 100%;
  width:100%;
  max-height: 200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  overflow: hidden;
}

.basic_wrap .photo_wrap .photo_upload_ui .photo_text {
  text-align: center;
  margin-top: 10px;
  line-height: 1.3;
  font-size: 20px;
  color: #3a3a3a;
  letter-spacing: -0.6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.basic_wrap .photo_wrap .photo_upload_ui .photo_text img {
  margin: auto;
  margin-bottom: 16px;
}
.basic_wrap .photo_wrap .photo_upload_ui .photo_text span {
  display: block;
  font-size: 18px;
  color: #878787;
  line-height: inherit;
  letter-spacing: -0.54px;
  margin-top: 2px;
}
.basic_wrap .photo_wrap .photo_upload_ui #preview_image {
  aspect-ratio: 150/220;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: none;
}
.basic_wrap .contents_wrap #profile_photo {
  display: none;
}

/* 희망 근무조건 */
.hope_wrap .salary_option_wrap { 
  width: 100%;
  display: flex;
  gap: 15px;
  align-items: center;
  position: relative;
}
.hope_wrap .salary_option_wrap .input_wrap { 
  border: 1px solid #d5d5d5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  border-radius: 5px;
  width: 170px;
  font-size: 18px;
  letter-spacing: -0.54px;
  color: #3a3a3a;
}
.hope_wrap .salary_option_wrap .input_wrap input {
  border: none;
  padding: 0;
  width: 70%;
  font-size: inherit;
  text-align: right;
  
}

.hope_wrap .salary_option_wrap .input_wrap span {
  font-size: inherit;
}

/* 학력사항 */
.education_wrap .form_row.final {
  margin-bottom: 30px;
}

.education_wrap .form_row .select_wrap {
  display: flex;
  gap: 15px;
}

.education_wrap .form_row .list_wrap {
  display: flex;
  gap: 15px;
  margin-bottom: 15px;
}

.education_wrap .form_row.detail {
  align-items: flex-start;
  display: none;
}
.education_wrap .form_row.detail.on {
  display: flex;
}
.education_wrap .form_row.detail > .sub_title {
  padding-top: 5px;
}

.education_wrap .form_row.detail .right {
  width: calc(100% - 150px);
}

.education_wrap .form_row.detail .right .edu_item_wrap { 
  background: #fafafa;
  padding: 30px 20px;
  margin-bottom: 20px;
  border-radius: 10px; 
}

.education_wrap .form_row.detail .right .edu_item_wrap .tit {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.education_wrap .form_row.detail .right .edu_item_wrap .add_wrap{
  margin-bottom: 30px;
}
.education_wrap .form_row.detail .right .edu_item_wrap .add_wrap:nth-child(n + 2){
 border-top: 1px solid #d5d5d5;
 padding-top: 30px;
}

.education_wrap .form_row.detail .right .edu_item_wrap .tit p {
  font-weight: 600;
  font-size: 18px;
}

.education_wrap .form_row.detail .right .edu_item_wrap label {
  width: 100px;
  display: flex;
  gap: 3px;
  font-size: 18px;
}

.education_wrap .form_row.detail .right .edu_item_wrap .period_wrap {
  display: flex;
  gap: 30px;
  width: 100%;
}

.education_wrap .form_row.detail .right .edu_item_wrap.university .period_wrap .custom-select {
  width: 33.3333%;
  position: relative;
}

.education_wrap .form_row.detail .right .edu_item_wrap.university .period_wrap .custom-select:nth-child(1):after {
  content: '~';
  position: absolute;
  right: -19px;
  top: 50%;
  transform: translateY(-50%);
}

.education_wrap .form_row.detail .right .edu_item_wrap.high .period_wrap .custom-select:nth-child(1) {
  width: 60%;
}

.education_wrap .form_row.detail .right .edu_item_wrap.high .period_wrap .custom-select:nth-child(2) {
  width: 40%;
}

.custom-select.mh_slct .options{
  max-height: 214px;
  overflow: auto;
  padding-right: 0;
}

.education_wrap .form_row.detail .right .edu_item_wrap .period_wrap .custom-select .options::-webkit-scrollbar-thumb {
  background: var(--brandColor);      /* 핸들 색상 */
  border-radius: 10px;
  border: 2px solid #f0f0f0;  /* 안쪽 공간 느낌 */
}
.education_wrap .form_row.detail .right .edu_item_wrap .period_wrap .custom-select .options::-webkit-scrollbar-track {
  background: transparent;
}

.education_wrap .form_row.detail .right .edu_item_wrap .period_wrap .custom-select .selected input {
  width: 100%;
}


/* 경력사항 */
.career_wrap .contents_wrap > .form_row {
  align-items: flex-start;
}

.career_wrap .contents_wrap > .form_row > .sub_title {
  padding-top: 5px;
  flex-direction: column;
  gap: 5px;
}

.career_wrap .contents_wrap > .form_row > .sub_title span {
  color: #898989;
  font-size: 16px;
  font-weight: 400;
}

.career_wrap .form_row .right {
  width: calc(100% - 150px);
}

.career_wrap .form_row .career_item_wrap {
  background: #fafafa;
  padding: 30px 20px;
  margin-bottom: 20px;
  border-radius: 10px;
  position: relative;
}

.career_wrap .form_row .career_item_wrap .btn_delete {
  position: absolute;
  right: 20px;
  top: 30px;
} 

.career_wrap .form_row .career_item_wrap label {
  width: 100px;
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 18px;
}

.career_wrap .form_row .career_item_wrap .option_wrap {
  width: calc(100% - 100px);
  display: flex;
  gap: 30px;
  align-items: center;
}

.career_wrap .form_row .career_item_wrap .option_wrap .career_name {
  width: calc(50% - 15px);
}

.career_wrap .form_row .career_item_wrap .period_wrap{
  width: calc(100% - 100px);
  display: flex;
  gap: 30px;
}

.career_wrap .form_row .career_item_wrap .period_wrap > div {
  display: flex;
  gap: 5px;
  position: relative;
}

.career_wrap .form_row .career_item_wrap .period_wrap > div:nth-child(1):after {
  content: '~';
  position: absolute;
  right: -19px;
  top: 50%;
  transform: translateY(-50%);
}

.career_wrap .form_row .career_item_wrap .period_wrap > div .custom-select {
  width: 50%;
}

.career_wrap .form_row .career_item_wrap .career_work {
  width: calc(100% - 100px );
}


/* 보유 자격증 */
.certificate_wrap .contents_wrap > .form_row {
  align-items: flex-start;
}

.certificate_wrap .contents_wrap > .form_row > .sub_title {
  padding-top: 5px;
  flex-direction: column;
  gap: 5px;
}

.certificate_wrap .contents_wrap > .form_row > .sub_title span {
  color: #898989;
  font-size: 16px;
  font-weight: 400;
}

.certificate_wrap .form_row .right {
  width: calc(100% - 150px);
}

.certificate_wrap .form_row .certificate_item_wrap {
  background: #fafafa;
  padding: 30px 20px;
  margin-bottom: 20px;
  border-radius: 10px;
  position: relative;
}

.certificate_wrap .form_row .certificate_item_wrap .btn_delete {
  position: absolute;
  right: 20px;
  top: 30px;
}

.certificate_wrap .form_row .certificate_item_wrap label {
  width: 100px;
  display: flex;
  gap: 3px;
  font-size: 18px;
}

.certificate_wrap .form_row .certificate_item_wrap input[type=text] {
  width: 82%;
}

.certificate_wrap .form_row .certificate_item_wrap .option_wrap {
  width: calc(100% - 100px);
  display: flex;
  gap: 30px;
  align-items: center;
}

.certificate_wrap .form_row .certificate_item_wrap .option_wrap .career_name {
  width: calc(50% - 15px);
}

.certificate_wrap .form_row .certificate_item_wrap .period_wrap {
  width: 82%;
  display: flex;
  gap: 30px;
}

.certificate_wrap .form_row .certificate_item_wrap .period_wrap .custom-select {
  width: 50%;
}

.certificate_wrap .form_row .certificate_item_wrap .period_wrap .custom-select input[type=text] {
  width: 100%;
}

.certificate_wrap .form_row .certificate_item_wrap .career_work {
  width: calc(100% - 100px );
}

/* aside */
.resume_guide_wrap {
  width: 220px;
  border: 1px solid #d5d5d5;
  border-radius: 10px;
  background: #fff;
  padding: 25px 20px;
  position: sticky;
  top: 100px;
  flex-shrink: 0;
}

.resume_guide_wrap .guide_wrap {
  margin-bottom: 30px;
}

.resume_guide_wrap .guide_wrap h3 {
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 20px;
  letter-spacing: -0.6px;
}

.resume_guide_wrap .guide_wrap .check_list li {
  margin-bottom: 15px;
  position: relative;
  font-size: 16px;
  letter-spacing: -0.48px;
  color: #3a3a3a;
  font-weight: 500;
  transition: all .2s;
}

.resume_guide_wrap .guide_wrap .check_list li.checked {
  color:#0072ff;
}

.resume_guide_wrap .guide_wrap .check_list li:after { 
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  background: url(/img/mypage/check_off.png) no-repeat center / contain;
}

.resume_guide_wrap .guide_wrap .check_list li.checked:after {
  background: url(/img/mypage/check_on.png) no-repeat center / contain;
}

.resume_guide_wrap .button_group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.resume_guide_wrap .button_group .btn_temp_save {
  border: 1px solid var(--brandColor);
  border-radius: 5px;
  color: var(--brandColor);
  font-weight: 600;
  font-size: 20px;
  padding: 15px;
  letter-spacing: -0.6px;
}

.resume_guide_wrap .button_group .btn_register {
  border: 1px solid var(--brandColor);
  border-radius: 5px;
  background: var(--brandColor);
  color: #fff;
  font-weight: 600;
  font-size: 20px;
  padding: 15px;
  letter-spacing: -0.6px;
}

.form_feedback_wrap {
  position: fixed;
  bottom: 50px;
  left: calc(50% - 5.5vw);
  transform: translateX(-50%);
  background: #000000b0;
  color: #fff;
  padding: 25px;
  border-radius: 10px;
  max-width: 900px;
  text-align: center;
  width: 40%;
  z-index: 9999;
  display: none;
}

.form_feedback_wrap p {
  font-size: 22px;
}
/* 유효성검사 */
.form_group input.focus {
  border: solid 1px var(--brandColor);
}
.focus {
  border: solid 1px var(--brandColor) !important;
}
.count_input .count{
  opacity: 0;
}

.count_input:has(input:focus) .count,
.count_input:has(input:not(:placeholder-shown)) .count {
  opacity: 1;
}
.form_group .input_wrap.disabled {
  background-color: #fafafa;           
    border: 1px solid #d5d5d5 !important;
  
}
.form_group .input_wrap.disabled input {
  background-color: #fafafa;    
}
.basic_wrap input[readonly] {
    background-color: #fafafa;
}

.error {
  border: 1px solid #df222c !important;
}
.error_text {
    color: #df222c;
    letter-spacing: -0.48px;
    font-size: 16px;
    font-weight: 500;
    position: absolute;
    bottom: -25px;
    left: 0;
    display: none;
}

.education_wrap .contents_wrap.disabled input,
.education_wrap .contents_wrap.disabled button {
  pointer-events: none;
  background-color: #fafafa;
}
.education_wrap .contents_wrap.disabled .custom-select {
  pointer-events: none;
  background-color: #fafafa;
  opacity: 0.6;
}

.disabled-option {
  pointer-events: none;
  color: #ccc !important;
}