/*---------------------------------------------------------------------------------

 Theme Name:   Divi Child
 Theme URI:    http://gaffee.noida.co.kr/divi-child
 Description:  Divi Child Theme
 Author:       Noida
 Author URI:   https://noida.co.kr
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/
@font-face {
    font-family: 'PyeongChang-Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/PyeongChang-Bold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

#apply-form {
  --border: #cecece;
  --point: #ff91a2;
  --noti-bg: #f8f8f8;
  --input-place-text: #aaa;
  --input-bg: #f2f2f2;
  --textarea-bg: #fafafa;
  --color-gray: #999;
  --input-padding: 16px 24px;
  --black: #000;
  --radius: 10px;
  --font-15: 15px;
  --font-16: 16px;
  --font-18: 18px;
  --font-20: 20px;
  --font-22: 22px;
}
@media (max-width: 980px) {
  #apply-form {
    --input-padding: 16px 24px;
    --font-15: 14px;
    --font-16: 15px;
    --font-18: 16px;
    --font-20: 18px;
    --font-22: 20px;
  }
}
#apply-form .step-wrap {
  margin-bottom: 40px;
}
#apply-form .wpcf7-form label {
  /* padding: 0 !important; */
  line-height: 1;
  font-size: var(--font-18);
}
#apply-form .wpcf7-form .wpcf7-list-item {
  margin: 0;
  display: block;
}
#apply-form .step-wrap .mob-title {
  font-size: var(--font-20);
  display: none;
  padding-top: 10px;
  border-bottom: 1px solid var(--black);
  margin-bottom: 20px;
}
#apply-form .wpcf7-not-valid-tip {
  font-size: var(--font-15);
  margin-top: 4px;
}
/* 안내문구 */
#apply-form .step-wrap .noti-box {
  display: flex;
  align-items: center;
  flex-direction: column;
  background-color: var(--noti-bg);
  border: 1px solid var(--black);
  border-radius: var(--radius);
  padding: 30px 5%;
  margin-bottom: 40px;
  text-align: center;
}
#apply-form .step-wrap .noti-box ul.list {
  list-style: none;
  padding: 0;
  text-align: left;
}
#apply-form .step-wrap .noti-box ul.list li {
  display: flex;
  white-space: nowrap;
  margin-bottom: 16px;
}
#apply-form .step-wrap .noti-box ul.list li strong {
  display: flex;
  flex-basis: 80px;
  flex-shrink: 0;
}
#apply-form .step-wrap .noti-box ul.list li strong::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  background: no-repeat center/contain;
}
#apply-form .step-wrap .noti-box ul.list li:nth-child(1) strong::before {
  background-image: url(https://jobfair-gri.kr/wp-content/uploads/2024/05/apply-form-icon-01.png);
}
#apply-form .step-wrap .noti-box ul.list li:nth-child(2) strong::before {
  background-image: url(https://jobfair-gri.kr/wp-content/uploads/2024/05/apply-form-icon-02.png);
}
#apply-form .step-wrap .noti-box .alert-box {
  width: 100%;
  background-color: rgba(0, 0, 0, 0.06);
  border-radius: var(--radius);
  padding: 12px;
  font-size: var(--font-16);
}
#apply-form .step-wrap .noti-box .alert-box::before {
  content: "i";
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 1px solid var(--color-gray);
  border-radius: 50%;
  margin-right: 10px;
  font-size: 18px;
  line-height: 20px;
  color: var(--color-gray);
}
#apply-form .step-wrap .noti-box em {
  display: block;
  margin-top: 10px;
  font-style: normal;
  color: var(--color-gray);
  font-size: var(--font-16);
}
#apply-form .step-wrap .noti-box em::before {
  content: "*";
}
@media (max-width: 980px) {
  #apply-form .step-wrap .mob-title {
    display: block;
  }
  #apply-form .step-wrap .noti-box {
    padding: 24px 10px;
  }
  #apply-form .step-wrap .noti-box ul.list li {
    display: block;
    font-size: var(--font-16);
  }
  #apply-form .step-wrap .noti-box ul.list li strong {
    display: flex;
  }
  #apply-form .step-wrap .noti-box ul.list li strong::before {
    width: 20px;
    height: 20px;
  }
}
/* 콘텐츠 공통 */
#apply-form .step-wrap .content {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 50px;
}
#apply-form .step-wrap .content > div {
  display: flex;
  align-items: center;
  max-width: 800px;
  margin: 0 auto;
  border-bottom: 1px dotted var(--border);
  padding: 12px 24px;
}
#apply-form .step-wrap .content > div:last-child {
  border-bottom: none;
}
#apply-form .step-wrap .content .input-label {
  flex-basis: 264px;
  font-size: var(--font-18);
}
#apply-form .step-wrap .content .input-label.req::after {
  content: "*";
  display: inline-block;
  margin-left: 4px;
}
#apply-form .step-wrap .content .input-box {
  flex-basis: 500px;
}
@media (max-width: 980px) {
  #apply-form .step-wrap .content {
    padding: 40px 24px;
  }
  #apply-form .step-wrap .content > div {
    display: block;

    padding: 12px 0;
  }
}
/* 인풋 */
#apply-form input {
  width: 100%;
  background-color: var(--input-bg);
  padding: var(--input-padding);
  border: none;
}
/* 체크박스 */
#apply-form input[type="checkbox"] {
  display: none;
}
#apply-form input[type="checkbox"] + .wpcf7-list-item-label {
  display: block;
  position: relative;
  padding-left: 36px;
  cursor: pointer;
}
#apply-form input[type="checkbox"] + .wpcf7-list-item-label::before {
  content: "";
  width: 20px;
  height: 20px;
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: #fff;
  position: absolute;
  left: 0;
  top: calc(50% - 11px);
}
#apply-form input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
  border-color: var(--black);
  background-color: var(--point);
}
#apply-form input[type="checkbox"] + .wpcf7-list-item-label::after {
  content: "";
  width: 12px;
  height: 6px;
  border-left: 2px solid var(--black);
  border-bottom: 2px solid var(--black);
  transform: rotate(-45deg);
  position: absolute;
  left: 4px;
  top: calc(50% - 7px);
  display: none;
}
#apply-form input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
  display: block;
}
@media (max-width: 980px) {
  #apply-form input[type="checkbox"] + .wpcf7-list-item-label {
    padding-left: 26px;
  }
  #apply-form input[type="checkbox"] + .wpcf7-list-item-label::before {
    width: 16px;
    height: 16px;
    top: calc(50% - 7px);
  }
  #apply-form input[type="checkbox"] + .wpcf7-list-item-label::after {
    width: 8px;
    height: 4px;
    top: calc(50% - 3px);
  }
}
/* 라디오 */
#apply-form .wpcf7-radio {
  display: flex;
  gap: 32px;
}
#apply-form input[type="radio"] {
  display: none;
}
#apply-form input[type="radio"] + .wpcf7-list-item-label {
  position: relative;
  padding-left: 36px;
  cursor: pointer;
}
#apply-form input[type="radio"] + .wpcf7-list-item-label::before {
  content: "";
  width: 16px;
  height: 16px;
  border: 1px solid var(--point);
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: calc(50% - 9px);
}
#apply-form input[type="radio"] + .wpcf7-list-item-label::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--point);
  position: absolute;
  left: 4px;
  top: calc(50% - 5px);
  display: none;
}
#apply-form input[type="radio"]:checked + .wpcf7-list-item-label::after {
  display: block;
}
@media (max-width: 980px) {
  #apply-form input[type="radio"] + .wpcf7-list-item-label {
    padding-left: 26px;
  }
  #apply-form input[type="radio"] + .wpcf7-list-item-label::before {
    width: 12px;
    height: 12px;
    top: calc(50% - 6px);
  }
  #apply-form input[type="radio"] + .wpcf7-list-item-label::after {
    width: 8px;
    height: 8px;
    left: 3px;
    top: calc(50% - 3px);
  }
}
/* 선택박스 */
#apply-form .wpcf7-select {
  display: block;
  width: 100%;
  padding: var(--input-padding);
  border: none;
  background-color: var(--input-bg);
}
/* 개인정보처리방침 */
#apply-form .step01 .content h5 {
  max-width: 920px;
  margin: 0 auto;
  padding-bottom: 16px;
  border-bottom: 2px solid var(--black);
  margin-bottom: 16px;
}
#apply-form .step01 .content > div {
  max-width: 920px;
  border-bottom: 0;
  padding: 0;
}
#apply-form .step01 .content > .certi-box {
  display: block;
  height: 220px;
  overflow-y: auto;
  font-size: var(--font-16);
}
#apply-form .step01 .content .flex-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 24px;
  font-size: var(--font-16);
}
#apply-form .step01 .content .flex-box a {
  color: var(--point);
  font-weight: 500;
  text-decoration: underline;
  font-size: 0.9em;
}
@media (max-width: 980px) {
  #apply-form .step01 .content h5 {
    padding-bottom: 12px;
    margin-bottom: 12px;
  }
  #apply-form .step01 .content label {
    line-height: 1.4;
  }
}
/* 졸업 연도 */
#apply-form .step03 .content .input-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
/* 경력 */
#apply-form .step04 .content > .wpcf7-field-groups {
  display: block;
  border-top: 1px solid var(--black);
  border-bottom: 1px solid var(--black) !important;
  padding: 0;
}
#apply-form .step04 .wpcf7-field-group {
  width: 100%;
  padding: 16px 0;
}
#apply-form .step04 .wpcf7-field-group::after {
  content: "";
  display: block;
  clear: both;
}
#apply-form .step04 .wpcf7-field-group ~ .wpcf7-field-group {
  border-top: 1px solid var(--black);
}
#apply-form .step04 .wpcf7-field-group > div {
  display: flex;
  align-items: center;
  max-width: 800px;
  margin: 0 auto;
  border-bottom: 1px dotted var(--border);
  padding: 12px 24px;
}
#apply-form .step04 .wpcf7-field-group > div:nth-child(3) {
  border-bottom: 0;
}
#apply-form .step04 .wpcf7-field-group > div:nth-child(3) .input-box {
  display: flex;
  align-items: center;
  gap: 10px;
}
#apply-form .step04 .wpcf7-field-group > div:nth-child(3) .input-box .wpcf7-form-control-wrap {
  flex-grow: 1;
}
#apply-form .step04 .wpcf7-field-group-remove,
#apply-form .step04 .wpcf7-field-group-add {
  width: 36px;
  height: 36px;
  background-color: var(--point);
  border-radius: 4px;
  border: none;
  font-size: 28px;
  color: #fff;
  margin-left: 10px;
  float: right;
}
#apply-form .step04 .wpcf7-field-group-remove {
  background-color: #cecece;
}
/* 상담분야 */
#apply-form .step05 .content .wpcf7-checkbox {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 860px;
  margin: 0 auto;
  gap: 40px 10px;
}
@media (max-width: 980px) {
  #apply-form .step05 .content .wpcf7-checkbox {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px 10px;
  }
}
@media (max-width: 620px) {
  #apply-form .step05 .content .wpcf7-checkbox {
    grid-template-columns: repeat(1, 1fr);
    gap: 16px 10px;
  }
}
/* 취업희망분야 */
#apply-form .step06 .content h5 {
  font-size: var(--font-20);
  padding-bottom: 16px;
  border-bottom:1px solid var(--black);
  margin-bottom:16px;
}
#apply-form .step06 .content .content-grid {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 0 auto;
  gap: 24px 10px;
}
#apply-form .step06 .content h5 + .content-grid {
	margin-bottom:32px;
}
@media (max-width: 1200px) {
  #apply-form .step06 .content .content-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 980px) {
  #apply-form .step06 .content .content-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px 10px;
  }
}
@media (max-width: 620px) {
  #apply-form .step06 .content .content-grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 16px 10px;
  }
}
/* 사전질의 */
#apply-form .step07.step-wrap .content > div {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  padding: 0;
  border-bottom: 1px dotted var(--border);
}
#apply-form .step07.step-wrap .content > div ~ div {
  padding: 0;
  padding-top: 50px;
}
#apply-form .step07.step-wrap .content > div:last-child {
  border-bottom: 0;
}
#apply-form .step07 .content-q {
  width: 100%;
}
#apply-form .step07 .content-q__title {
  font-size: var(--font-22);
  margin-bottom: 18px;
}
#apply-form .step07 .content-q__title::before {
  content: "·";
  display: inline-block;
  margin-right: 6px;
}
#apply-form .step07 .content-q .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  background-color: var(--textarea-bg);
  border: 1px solid var(--border);
  padding-bottom: 36px;
}
#apply-form .step07 .content-q .wpcf7-form-control-wrap textarea {
  padding: var(--input-padding);
  display: block;
  width: 100%;
  resize: vertical;
  min-height: 180px;
  border: none;
  background-color: transparent;
}
#apply-form .step07 .content-q__extra p {
  font-size: var(--font-15);
  font-weight: 300;
  line-height: 1;
  padding: 14px 24px;
  color: var(--color-gray);
}
#apply-form .step07 .content-q__extra p:first-child {
  position: absolute;
  right: 0;
  bottom: 44px;
}
/* 설문 */
#apply-form .step-survey-info h5,
#apply-form .step-survey h5 {
	max-width:940px;
	padding:16px 0;
	font-size:var(--font-22);
	margin:0 auto;
}
#apply-form .step-survey-info h5 {
	border-bottom:2px solid #000;
}
#apply-form .step-survey-info .content .input-label {
	flex-basis:120px;
}
#apply-form .step-survey-info .content .input-box {
	flex-basis:700px;
}
#apply-form .step-survey-info .content .input-box.flex {
	display:flex;
	flex-wrap:wrap;
	gap:16px;
}
#apply-form .step-survey-info .content > div {
	max-width:940px;
}
#apply-form .step-survey .content > div {
	display:block;
	max-width:940px;
	border-bottom:none;
	border-top:2px solid #000;
	margin-bottom:60px;
	padding:0;
}
#apply-form .step-survey .content .input-label {
  font-size: var(--font-18);
  padding:20px 0;
	border-bottom:1px dotted var(--border);
	font-weight:600;
}
#apply-form .step-survey .content .q-sub-text {
	padding:24px 0 16px;
  font-size: var(--font-18);
}
#apply-form .step-survey .content .wpcf7-list-item {
	margin-top:10px;
}
#apply-form .step-survey-info .wpcf7-radio,
#apply-form .step-survey .wpcf7-radio {
	padding-left:0;
	gap:16px;
}
#apply-form .step-survey .wpcf7-radio {
	display:block;
}
/* 스탭 */
#apply-form .uacf7-steps {
  margin-bottom: 50px;
}

#apply-form .steps-row {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding-bottom: 32px;
}
#apply-form .steps-row::before {
  background-color: var(--black);
  top: 24px;
}
/* 단계 circle */
#apply-form .uacf7-steps .steps-step {
  display: block;
}
#apply-form .btn-circle,
#apply-form .btn-circle:hover {
  width: 24px;
  height: 24px;
  font-size: 0;
  background-color: #fff !important;
  border: 1px solid var(--black) !important;
  box-shadow: none;
}
/* 단계 circle 활성화 */
#apply-form .btn-circle.uacf7-btn-active {
  border: none;
  background-color: var(--point) !important;
  width: 38px;
  height: 38px;
  box-shadow: none;
  position: relative;
}
#apply-form .btn-circle.uacf7-btn-active::before {
  content: "";
  display: block;
  width: 16px;
  height: 8px;
  border-left: 2px solid var(--black);
  border-bottom: 2px solid var(--black);
  transform: rotate(-45deg);
  position: absolute;
  top: 10px;
  left: 9px;
}
/* 단계 circle title 안보임 */
#apply-form .steps-row .steps-step p {
  color: transparent;
  position: relative;
}
/* 단계 circle title 보임 */
#apply-form .btn-circle.uacf7-btn-active + p {
  color: #000;
  font-size: var(--font-22);
  font-weight: 700;
}
#apply-form .steps-row .steps-step p:after,
#apply-form .btn-circle:hover + p:after {
  display: block;
  text-align: center;
  font-size: var(--font-18);
  font-weight: 400;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  top: 0;
}
#apply-form .btn-circle:hover + p:after {
  color: var(--black);
}
#apply-form .btn-circle.uacf7-btn-active + p:after {
  color: var(--black);
  top: 100%;
}
#apply-form .steps-step:nth-child(1) .btn-circle + p:after {
  content: "개인정보처리방침";
}
#apply-form .steps-step:nth-child(2) .btn-circle + p:after {
  content: "개인정보 입력";
}
#apply-form .steps-step:nth-child(3) .btn-circle + p:after {
  content: "졸업(예정) 연도";
}
#apply-form .steps-step:nth-child(4) .btn-circle + p:after {
  content: "연구 경력";
}
#apply-form .steps-step:nth-child(5) .btn-circle + p:after {
  content: "상담 분야";
}
#apply-form .steps-step:nth-child(6) .btn-circle + p:after {
  content: "취업희망 연구기관";
}
#apply-form .steps-step:nth-child(7) .btn-circle + p:after {
  content: "사전 질의";
}
@media (max-width: 980px) {
  #apply-form .uacf7-steps {
    margin-bottom: 32px;
  }
  #apply-form .steps-row {
    padding-bottom: 24px;
  }
  #apply-form .steps-row::before {
    top: 24px;
  }
  /* 단계 circle */
  #apply-form .uacf7-steps .steps-step {
    display: block;
  }
  #apply-form .btn-circle,
  #apply-form .btn-circle:hover {
    width: 20px;
    height: 20px;
    margin: 14px 0;
    position: relative;
  }
  /* 단계 circle 활성화 */
  #apply-form .btn-circle.uacf7-btn-active {
    width: 32px;
    height: 32px;
    margin: 0;
  }
  #apply-form .btn-circle.uacf7-btn-active::before {
    width: 14px;
    height: 6px;
    top: 8px;
    left: 7px;
  }
  #apply-form .btn-circle + p {
    display: none;
  }
  #apply-form .btn-circle::after {
    font-weight: 700;
    font-size: var(--font-20);
    color: var(--black);
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
  }
  #apply-form .btn-circle:hover::after,
  #apply-form .btn-circle.uacf7-btn-active::after {
    opacity: 1;
  }
  #apply-form .steps-step:nth-child(1) .btn-circle:after {
    content: "01";
  }
  #apply-form .steps-step:nth-child(2) .btn-circle:after {
    content: "02";
  }
  #apply-form .steps-step:nth-child(3) .btn-circle:after {
    content: "03";
  }
  #apply-form .steps-step:nth-child(4) .btn-circle:after {
    content: "04";
  }
  #apply-form .steps-step:nth-child(5) .btn-circle:after {
    content: "05";
  }
  #apply-form .steps-step:nth-child(6) .btn-circle:after {
    content: "06";
  }
  #apply-form .steps-step:nth-child(7) .btn-circle:after {
    content: "07";
  }
}
/* 버튼 */
#apply-form button.uacf7-prev,
#apply-form button.uacf7-next,
#apply-form .wpcf7-submit {
  border-radius: var(--radius);
  background-color: var(--point);
  font-weight: 700;
  color: var(--black);
  border: 1px solid var(--black);
  padding: 16px;
  min-width: 136px;
  margin: 0;
  cursor: pointer;
  font-size: 0;
}
#apply-form button.uacf7-prev::before {
  content: "이전";
  font-size: var(--font-18);
}
#apply-form button.uacf7-next::before {
  content: "다음";
  font-size: var(--font-18);
}
#apply-form .uacf7-prev {
  order: 1;
  float: left !important;
}
#apply-form .uacf7-next {
  order: 3;
  float: right !important;
}
#apply-form .submit-btn {
	float:right;
}
#apply-form .wpcf7-submit {
	width:136px;
  font-size: var(--font-18);
}
#apply-form .wpcf7-submit:disabled {
  background-color: var(--border);
}
@media (max-width: 768px) {
  #apply-form button.uacf7-prev,
  #apply-form button.uacf7-next,
  #apply-form .wpcf7-submit {
    padding: 12px;
    min-width: 110px;
  }
}