@charset "utf-8";

#footer {display: none;}

#header[data-now-page="contact"] .header__contact-link {
    display: none;
}

.contact__slide-wrap {
    position: relative;
    width: 100vw;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
}

.contact__slide-wrap label {
    display: block;
}

.contact__slide-wrap textarea {
    resize: none;
    width: 100%;
    border: 0.1rem solid var(--ir-color-dark-gray);
    border-radius: 1rem;
    padding: 1.8rem;
}

.contact__slide-wrap .error-title textarea {
    border: 0.1rem solid var(--ir-color-red);
}

.contact__slide-wrap input[type="text"] {
    border-bottom: 0.1rem solid var(--ir-color-dark-gray);
    padding: min(1.50rem, 0.78vw) 0;
}

.contact__slide-wrap .contact__progress-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1rem;
    background-color: var(--ir-color-light-gray);
    z-index: 100;
}

.contact__slide-wrap .contact__progress-bar.off {
    visibility: hidden;
}

.contact__slide-wrap .contact__slide {
    position: relative;
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;

    user-select: none;
    -webkit-user-select: none;
}

.contact__slide .contact__inner {
    display: flex;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    flex-direction: column;
    justify-content: space-between;
}

.contact__slide:not(.contact__intro, .contact__step-outro) .contact__inner {
    height: auto;
    flex-direction: row;
    justify-content: space-between;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}


.contact__intro-header {
    padding-top: min(22.80rem, 11.88vw);
}

.contact__intro-header .red-dot {
    width: var(--dot-size-22);
    margin-left: var(--dot-margin-8);
}

.contact__header-title {
    margin-bottom: min(1.90rem, 0.99vw);
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-150);
    line-height: var(--lh-100);
    letter-spacing: var(--ls-tight);
}

.contact__header-desc {
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-48);
    line-height: var(--lh-120);
}

.contact__intro-footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: min(15.00rem, 7.81vw);
}

.contact__company {
    width: 100%;
}

.contact__address {
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-24);
    line-height: var(--lh-140);
    letter-spacing: var(--ls-normal);
}

.contact__intro-footer .contact__point {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;

    user-select: text;
    -webkit-user-select: text;
}

.contact__intro-footer .contact__point-item {
    display: inline-block;
}

.contact__intro-footer .contact__point-title {
    margin-bottom: min(1.00rem, 0.52vw);
    color: var(--ir-color-dark-gray);
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-16);
    line-height: var(--lh-120);
}

.contact__intro-footer .contact__point-value {
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-20);
    line-height: var(--lh-120);
}

.contact__point-item.address .contact__point-value {
    font-family: var(--lang-ko);
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
}

.contact__intro-footer .contact__point-value .bt-line-motion::after {
    background-color: var(--ir-color-black);
}

.contact__start-btn {
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-120);
    background-color: var(--ir-color-red);
    color: var(--ir-color-white);
    margin-top: min(4.40rem, 2.29vw);
    /* border: 0.1rem solid var(--ir-color-red); */
    box-shadow: 0 0 0 0.1rem var(--ir-color-red) inset;
    padding: min(1.56vw, 3rem) min(3.13vw, 6rem);
}

.contact__start-btn:hover .hover-motion-text2 {
    background-color: var(--ir-color-red);
}

.contact__question-header {
    margin-bottom: min(3.40rem, 1.77vw);
}

.contact__question-header .red-dot {
    width: var(--dot-size-11);
    margin-left: var(--dot-margin-4);
}

.contact__question-num {
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-120);
}

.contact__question-title {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-60);
    line-height: var(--lh-120);
}

.contact__step-intro .contact__answer {
    width: 100%;
    max-width: 57.4rem;
}

.contact__step-intro .contact__input {
    display: inline-block;
    width: min(57.40rem, 29.90vw);
    height: fit-content;
}

.contact__step-intro .contact__input + .contact__input {
    margin-top: min(5.00rem, 2.60vw);
}

.contact__step-intro .contact__input-btn {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);
}

.contact__input-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: auto 574/150;
    border: 0.1rem solid var(--ir-color-dark-gray);
    border-radius: 50rem;
    cursor: pointer;
}

input[name="type"]:checked ~ .contact__input-btn,
input[name="cost_type"]:checked ~ .contact__input-btn,
input[name="project_type"]:checked ~ .contact__input-btn {
    background-color: var(--ir-color-black);
    color: var(--ir-color-white);
}

.contact__slide-wrap .contact__answer {
    width: fit-content;
    text-align: right;
}

input[type="checkbox"]:checked ~ div .contact__input-check {
    background-color: var(--ir-color-black);
}

.contact__input-check {
    position: relative;
    display: inline-block;
    width: min(2.40rem, 1.25vw);
    aspect-ratio: auto 1/1;
    border-radius: 50%;
    border: 0.1rem solid var(--ir-color-dark-gray);
    background-color: var(--ir-color-white);
    vertical-align: text-bottom;
    margin-right: min(1.00rem, 0.52vw);
}

.contact__input-check::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url('../../image/icon/icon_input_check-b.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: min(1.10rem, 0.57vw);
    max-width: min(1.10rem, 0.57vw);
    aspect-ratio: auto 12 / 10;
}

.contact__check-link {
    text-decoration: underline; 
    text-underline-offset: 0.2vw;
    text-decoration-color: var(--ir-color-dark-gray);
    text-decoration-thickness: 0.1rem;
    transition: text-decoration-color 0.3s ease, color 0.3s ease;
}

.contact__check-link:hover {
    text-decoration-color: var(--ir-color-black);
    color: var(--ir-color-black);
}

/* 채용 */
.contact__step-recruit1 .contact__answer {
    width: min(58.00rem, 30.21vw);
}

.contact__step-recruit1 .contact__input + .contact__input {
    margin-top: min(2.00rem, 1.04vw);
    text-align: left;
}

.contact__step-recruit1 .contact__input-text {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);
    padding: min(2.90rem, 1.51vw) 0 min(1.50rem, 0.78vw) !important;
}

.contact__step-recruit1 .contact__input:first-child .contact__input-text {
    padding-top: 0 !important;
}

.contact__step-recruit1 .contact__check-wrap {
    margin-top: 2rem;
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
    display: inline-block;
    cursor: pointer;
    color: var(--ir-color-dark-gray);
    width: 100%;
}

.contact__step-recruit2 .contact__answer {
    width: 37.60vw;
    max-width: 72.2rem;
    text-align: left;
}

.contact__step-recruit2 .contact__answer-title {
    position: relative;
    margin-bottom: 1rem;
    color: var(--ir-color-dark-gray);
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
}

.contact__step-recruit2 .contact__answer-title.error-title {
    color: var(--ir-color-red);
}

.contact__step-recruit2 .contact__answer-value {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);
}

/* TODO */
.contact__type-view {
    display: none !important;
}

.contact__type-view.show {
    display: block !important;
}

/* 프로젝트 */
.contact__step-project1 .contact__question-desc {
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
    color: var(--ir-color-dark-gray);
    margin-top: min(1.00rem, 0.52vw);
}

.contact__step-project1 .contact__answer {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: min(3.00rem, 1.56vw) min(5.00rem, 2.60vw);
}

.contact__step-project1 .contact__answer label {
    width: min(30.00rem, 15.63vw);
}

.contact__step-project1 .contact__input-btn {
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-24);
    line-height: var(--lh-140);
    letter-spacing: var(--ls-normal);
}

.contact__step-project2 .contact__answer {
    /* width: min(5.80rem, 3.02vw); */
    text-align: left;
}

.contact__step-project2 .contact__input + .contact__input {
    margin-top: min(5.50rem, 2.86vw);
}

.contact__step-project2 .contact__answer-title {
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
    color: var(--ir-color-dark-gray);
}

.contact__step-project2 .contact__input-date {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-48);
    line-height: var(--lh-120);
}

.contact__step-project3 .contact__answer {
    width: min(57.40rem, 29.90vw);
}

.contact__step-project3 .contact__input + .contact__input {
    margin-top: min(2.00rem, 1.04vw);
}

.contact__step-project3 .contact__input-btn {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);
}

.contact__step-project4 .contact__answer {
    width: min(72.20rem, 37.60vw);
    text-align: left;
}

.contact__step-project4 .contact__answer .contact__input:first-child {
    margin-bottom: min(5.00rem, 2.60vw);
}

.contact__step-project4 .contact__answer-title {
    margin-bottom: min(1.00rem, 0.52vw);
    color: var(--ir-color-dark-gray);
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
}

.contact__step-project4 .contact__answer-value {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);
}

.contact__step-project5 .contact__answer {
    width: min(58.00rem, 30.21vw);
    text-align: left;
}

.contact__step-project5 .contact__input-text {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);

    padding-top: min(2.90rem, 1.51vw) !important;
    padding-bottom: min(1.50rem, 0.78vw) !important;
}

.contact__step-project5 .contact__input:first-child .contact__input-text {
    padding-top: 0 !important;
}

.contact__step-project5 .contact__check-wrap {
    margin-top: min(2.00rem, 1.04vw);
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
    display: inline-block;
    cursor: pointer;
    color: var(--ir-color-dark-gray);
}

.contact__step-project6 {
    background-color: var(--ir-color-black);
    color: var(--ir-color-white);
}

.contact__step-project6 .contact__question-desc {
    color: var(--ir-color-dark-gray);
    margin-top: min(1.30rem, 0.68vw);
    font-variation-settings: 'wght' var(--weight-400);
    font-size: var(--font-size-20);
    line-height: var(--lh-135);
    letter-spacing: var(--ls-normal);
}

.contact__step-project6 .contact__answer {
    width: min(72.00rem, 37.50vw);
    aspect-ratio: auto 720/530;
    overflow: hidden;
    background-color: var(--ir-color-white);
    color: var(--ir-color-black);
    padding: min(4.00rem, 2.08vw) min(2.00rem, 1.04vw) min(4.00rem, 2.08vw) min(4.00rem, 2.08vw);
    border-radius: 0.5rem;
    text-align: left;
}

.contact__step-project6 .contact__answer .contact__summary-inner {
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.contact__step-project6 .contact__answer .contact__summary-inner::-webkit-scrollbar {
    display: block !important;
    width: 0.5rem !important;
}

.contact__step-project6 .contact__answer .contact__summary-inner::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    border-radius: 0.25rem !important;
}

.contact__step-project6 .contact__answer .contact__summary-inner::-webkit-scrollbar-thumb {
    background-color: var(--ir-color-medium-gray);
    border-radius: 0.25rem !important;
}

.contact__step-project6 .contact__summary-item {
    cursor: pointer;
}
.contact__step-project6 .contact__summary-item + .contact__summary-item {
    margin-top: min(3.00rem, 1.56vw);
}

.contact__step-project6 .contact__summary-title {
    font-variation-settings: 'wght' var(--weight-700);
    font-size: var(--font-size-24);
    line-height: var(--lh-140);
    letter-spacing: var(--ls-normal);
}

.contact__step-project6 .contact__summary-answer {
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-24);
    line-height: var(--lh-140);
    letter-spacing: var(--ls-normal);
}

.contact__step-project6 .contact__summary-answer.project_start_day,
.contact__step-project6 .contact__summary-answer.project_live_day,
.contact__step-project6 .contact__summary-answer.company,
.contact__step-project6 .contact__summary-answer.user_name {
    display: inline-block;
}

.contact__step-project6 .contact__summary-answer.project_start_day,
.contact__step-project6 .contact__summary-answer.project_live_day {
    margin-right: 0.5rem;
}

.contact__step-outro {
    position: relative;
    background-color: var(--ir-color-black);
    color: var(--ir-color-white);
}
.contact__step-outro .contact__confetti {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.contact__step-outro .contact__inner {
    position: relative;
    z-index: 1;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.contact__step-outro .contact__completed {
    margin-bottom: 7rem;
    font-family: var(--lang-en);
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-150);
    line-height: var(--lh-100);
    letter-spacing: var(--ls-tight);
}

.contact__step-outro .contact__completed-desc {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-140);
}

.contact__arrow-wrap {
    position: absolute;
    /* bottom: 4.69vw; */
    bottom: min(9.00rem, 4.69vw);
    left: 0;
    width: 100%;
    z-index: 100;
    padding: 0 4.17vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.contact__arrow-btn .contact__arrow-icon {
    width: min(7.20rem, 3.75vw);
    aspect-ratio: auto 1/1;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
}

.contact__arrow-btn.prev-btn .contact__arrow-icon {
    background-image: url('../../image/icon/btn_e_arrow_left-g.svg?v=2');
}
.contact__arrow-btn.next-btn .contact__arrow-icon {
    background-image: url('../../image/icon/btn_e_arrow_right-g.svg?v=2');
}

@media all and (min-width: 641px) {
    .contact__arrow-btn.prev-btn .contact__arrow-icon {
        transition: background-image 0.5s ease;
    }
    .contact__arrow-btn.next-btn .contact__arrow-icon {
        transition: background-image 0.5s ease;
    }
    .contact__arrow-btn.prev-btn:hover .contact__arrow-icon {
        background-image: url('../../image/icon/btn_f_arrow_left-r.svg?v=2');
    }
    .contact__arrow-btn.next-btn:hover .contact__arrow-icon {
        background-image: url('../../image/icon/btn_f_arrow_right-r.svg?v=2');
    }
}

.contact__arrow-btn.next-btn .contact__arrow-icon.ok {
    background-image: url('../../image/icon/btn_f_arrow_right-r.svg');
}

.contact__submit-btn {
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-24);
    line-height: var(--lh-140);
    padding: min(1.25vw, 2.4rem) min(2.08vw, 4rem);
    border-radius: 5.1rem;
}

.contact__submit-btn.submit-project {
    color: var(--ir-color-white);
    border: 0.1rem solid var(--ir-color-dark-gray);
    transition: background-color 0.3s ease, color 0.3s ease;
}

.contact__submit-btn.submit-recruit {
    border: 0.1rem solid var(--ir-color-medium-gray);
}

.contact__submit-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(2.00rem, 1.04vw);
    aspect-ratio: auto 1/1;
    margin-left: min(1.20rem, 0.63vw);
    vertical-align: middle;
    overflow: hidden;
}
.contact__submit-icon svg {
    max-width: 100%;
    animation: submit-motion 1.5s infinite;
}

@keyframes submit-motion {
    0% {
      transform: translateX(0);
      opacity: 1;
    }
    50% {
      transform: translateX(120%);
      opacity: 0;
    }
    51% {
      transform: translateX(-120%);
      opacity: 0;
    }
    100% {
      transform: translateX(0);
      opacity: 1;
    }
  }

.contact__input {
    position: relative;
}

.contact__input.error-title .contact__answer-title {
    position: relative;
    color: var(--ir-color-red);
    padding-left: min(2.20rem, 1.15vw);
}

.contact__input.error-title .contact__answer-title::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    width: min(1.70rem, 0.89vw);
    aspect-ratio: auto 1/1;
    background-image: url('../../image/icon/icon_bang_mark.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.contact__input.error-title .contact__input-date {
    border-color: var(--ir-color-red);
}

.contact__input .error-text {
    color: var(--ir-color-red);
    display: none;
}

.contact__input.error-title .error-text {
    display: block;
}

.contact__input.error-title .error-text {
    position: absolute;
    bottom: min(6.00rem, 3.13vw);
    left: 0;
    padding-left: min(2.20rem, 1.15vw);
    color: var(--ir-color-red);
    font-variation-settings: 'wght' var(--weight-400);
    line-height: var(--lh-135);
    font-size: var(--font-size-20);
}

.contact__input.error-title .error-text::before {
    content: '';
    display: inline-block;
    width: min(1.70rem, 0.89vw);
    aspect-ratio: auto 1/1;
    background-image: url('../../image/icon/icon_bang_mark.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}

.contact__slide-wrap .contact__input.error-title input[type="text"] {
    border-bottom: 0.1rem solid var(--ir-color-red);
}
.contact__check-line {
    display: inline-flex;
    align-items: center;
    flex-direction: row;
}
.contact__slide-wrap .contact__input.error-title .contact__check-line {
    position: relative;
}

.contact__slide-wrap .contact__input.error-title .contact__check-line::after {
    content: '';
    position: absolute;
    top: 47%;
    right: min(-2.20rem, -1.15vw);
    transform: translateY(-50%);
    width: min(2.00rem, 1.04vw);
    aspect-ratio: auto 1 / 1;
    background-image: url(../../image/icon/icon_bang_mark.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.contact__modal-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.3s ease;
}

.contact__modal-wrap.show {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s, opacity 0.3s ease;
}

.contact__modal-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(67.00rem, 34.90vw);
    /* max-height: min(53.00rem, 27.60vw); */
    background-color: var(--ir-color-white);
    border-radius: 0.5rem;
    padding: min(8.00rem, 4.17vw) min(5.00rem, 2.60vw);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.contact__modal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: min(2.20rem, 1.15vw);
}

.contact__modal-close {
    position: absolute;
    top: min(3.00rem, 1.56vw);
    right: min(3.00rem, 1.56vw);
    width: min(4.80rem, 2.50vw);
    aspect-ratio: auto 1/1;
    background-image: url('../../image/icon/icon_btn_close-b.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.contact__modal-body {
    max-height: calc(90vh - 10rem);
    overflow-y: auto;
    /* padding-right: 1rem;
    margin-right: -1rem; */
}

/* .contact__modal-body::-webkit-scrollbar {
    width: 0.5rem;
}

.contact__modal-body::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    border-radius: 0.25rem;
}

.contact__modal-body::-webkit-scrollbar-thumb {
    background-color: var(--ir-color-dark-gray);
    border-radius: 0.25rem;
} */


.contact__modal-title {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-32);
    line-height: var(--lh-120);
}

.contact__modal-desc {
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-14);
    line-height: var(--lh-120);
    margin-bottom: min(3.00rem, 1.56vw);
}

.contact__sub-title {
    font-variation-settings: 'wght' var(--weight-600);
    font-size: var(--font-size-16);
    line-height: var(--lh-120);
}

.contact__modal-list + .contact__modal-list {
    margin-top: min(2.50rem, 1.30vw);
}

.contact__list-inner {
    font-variation-settings: 'wght' var(--weight-500);
    font-size: var(--font-size-14);
    line-height: var(--lh-120);
    margin-top: min(0.70rem, 0.36vw);
}



/* 태블릿 뷰 */
@media (min-width: 641px) and (max-width: 1024px) {
    .contact__slide .contact__inner {
        justify-content: center;
    }
    .contact__intro-header {
        padding-top: 0;
        padding-bottom: min(22.10rem, 11.51vw);
    }
    .contact__intro-footer {
        padding-bottom: 0;
    }
    
}


/* 모바일 뷰 */
@media (max-width: 640px) {
    /* .contact__intro {
        background-color: red;
    } */

    .contact__slide-wrap .contact__slide {
        align-items: stretch;
    }

    .contact__slide .contact__inner {
        /* justify-content: center; */
        padding-top: max(13.70rem, 36.53vw);
        padding-bottom: max(6.00rem, 16.00vw);
        /* justify-content: flex-start; */
    }
    .contact__intro-header {
        padding-top: 0;
        /* padding-bottom: max(6.00rem, 16.00vw); */
    }
    .contact__header-title {
        font-variation-settings: 'wght' var(--weight-600);
        font-size: var(--font-size-48-m);
        margin-bottom: max(1.00rem, 2.67vw);
    }
    .contact__intro-header .red-dot {
        width: var(--dot-size-10-m);
        margin-left: var(--dot-margin-3-m);
    }
    .contact__header-desc {
        font-size: var(--font-size-16-m);
    }
    .contact__address {
        font-variation-settings: 'wght' var(--weight-600);
        font-size: var(--font-size-20-m);
    }
    .contact__intro-footer {
        flex-direction: column;
        align-items: flex-start;
        padding-bottom: 0;
    }
    .contact__intro-footer .contact__point {
        flex-direction: column;
        margin-top: 0;
    }
    .contact__intro-footer .contact__point-item {
        display: block;
    }
    .contact__intro-footer .contact__point-title {
        margin-bottom: max(0.30rem, 0.80vw);
    }
    .contact__intro-footer .contact__point-title,
    .contact__intro-footer .contact__point-value {
        font-size: var(--font-size-10-m);
    }
    .contact__intro-footer .contact__point-item + .contact__point-item {
        margin-left: 0;
        margin-top: max(1.50rem, 4.00vw);
    }
    .contact__point-item.address .contact__point-value {
        font-size: var(--font-size-10-m);
        font-weight: var(--weight-500);
        line-height: var(--lh-120);
    }
    .contact__point-tel {
        margin-top: max(0.50rem, 1.33vw);
    }
    .contact__start-btn {
        margin-top: max(2.50rem, 6.67vw);
        font-size: var(--font-size-14-m);
        padding: max(4.27vw, 1.6rem) max(8.53vw, 3.2rem);
        font-variation-settings: 'wght' var(--weight-500);
    }
    .contact__slide:not(.contact__intro, .contact__step-outro) .contact__inner {
        flex-direction: column;

        position: unset;
        /* padding-top: max(13.00rem, 34.67vw); */
        padding-top: max(8.00rem, 21.33vw);
        padding-bottom: max(6.20rem, 16.53vw);
        transform: unset;
    }
    .contact__input-btn {
        aspect-ratio: auto 327/76;
    }
    .contact__input-check {
        margin-right: max(0.60rem, 1.60vw);
    }
    .contact__input-check::after {
        width: 9vw;
        max-width: 1.1rem;
        aspect-ratio: auto 12 / 10;
    }
    .contact__check-link {
        text-underline-offset: 1.2vw;
    }

    /* 공통 */
    .contact__slide {
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100);
        /* opacity: 0; */
    }
    .contact__answer {
        width: 100% !important;
        max-width: 100% !important;

        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        /* padding-top: max(8.00rem, 21.33vw); */
        padding-top: max(3.00rem, 8.00vw);
    }
    .contact__question-header {
        margin-bottom: max(1.00rem, 2.67vw);
    }
    .contact__question-header .red-dot {
        width: var(--dot-size-6-m);
        margin-left: var(--dot-margin-2-m);
    }
    .contact__question-num {
        font-size: var(--font-size-20-m); 
    }
    .contact__question-title {
        font-size: var(--font-size-32-m);
    }
    .contact__question {
        /* margin-bottom: max(8.00rem, 21.33vw); */
    }
    .contact__input {
        width: 100% !important;
        max-width: 100% !important;
    }

    .contact__answer-title {
        font-variation-settings: 'wght' var(--weight-500) !important;
        font-size: var(--font-size-16-m) !important;
        margin-bottom: 1.6vw !important;
    }
    .contact__slide-wrap input[type="text"] {
        font-size: var(--font-size-24-m);
        padding: max(1.00rem, 2.67vw) 0;
    }
    

    /* ============== */

    .contact__step-intro .contact__input + .contact__input {
        margin-top: max(1.50rem, 4.00vw);
    }
    .contact__step-intro .contact__input-btn {
        font-variation-settings: 'wght' var(--weight-400);
        font-size: var(--font-size-20-m);
    }

    .contact__step-recruit1 .contact__input + .contact__input {
        /* margin-top: max(1.50rem, 4.00vw); */
        margin-top: 0;
    }
    .contact__step-recruit1 .contact__check-wrap {
        margin-top: max(1.50rem, 4.00vw) !important;
    }
    /* .contact__step-recruit1 .contact__input-text {
        font-size: var(--font-size-24-m);
    } */

    
    .contact__step-recruit2 .contact__answer-title {
        font-size: var(--font-size-16-m);
        font-variation-settings: 'wght' var(--weight-500);
    }
    .contact__step-recruit2 .contact__answer-value {
        font-size: var(--font-size-16-m);
        font-variation-settings: 'wght' var(--weight-700);
    }
    .contact__step-recruit1 .contact__input-text {
        font-size: var(--font-size-24-m);
        /* padding: max(2.70rem, 7.20vw) 0 max(1.00rem, 2.67vw) !important; */
        padding: max(2.50rem, 6.67vw) 0 max(1.00rem, 2.67vw) !important;
    }
    .contact__step-project1 .contact__question-desc {
        font-size: var(--font-size-16-m);
        margin-top: max(0.60rem, 1.60vw);
    }
    .contact__step-project1 .contact__input-btn {
        font-size: var(--font-size-14-m);
        aspect-ratio: auto 154/42;
    }
    .contact__step-project1 .contact__answer {
        gap: max(1.00rem, 2.67vw) max(1.90rem, 5.07vw);
    }

    .contact__step-project2 .contact__answer-title {
        margin-bottom: 0 !important;
    }
    .contact__step-project2 .contact__input-date {
        font-size: var(--font-size-24-m);
    }
    .contact__step-project2 .contact__input + .contact__input {
        margin-top: max(5.00rem, 13.33vw);
    }
    .contact__step-project3 .contact__input-btn {
        font-variation-settings: 'wght' var(--weight-500);
        font-size: var(--font-size-14-m);
        line-height: var(--lh-130);
        aspect-ratio: auto 327 / 42;
    }
    .contact__step-project3 .contact__input + .contact__input {
        margin-top: max(1.00rem, 2.67vw);
    }

    .contact__step-project4 .contact__answer-value {
        font-variation-settings: 'wght' var(--weight-700);
        font-size: var(--font-size-16-m);
    }
    .contact__step-project4 .contact__answer .contact__input:first-child {
        margin-bottom: 8vw;
    }
    .contact__step-project5 .contact__input:not(:nth-child(4), .contact__check-wrap) {
        /* margin-bottom: max(1.50rem, 4.00vw); */
        margin-bottom: 0;
    }
    .contact__step-project5 .contact__input-text {
        font-variation-settings: 'wght' var(--weight-600);
        font-size: var(--font-size-24-m);
        /* padding-top: max(2.70rem, 7.20vw) !important;
        padding-bottom: max(1.00rem, 2.67vw) !important; */
        padding-top: max(2.50rem, 6.67vw) !important;
        padding-bottom: max(1.00rem, 2.67vw) !important;
    }
    .contact__step-recruit1 .contact__check-wrap,
    .contact__step-project5 .contact__check-wrap {
        font-variation-settings: 'wght' var(--weight-300);
        font-size: var(--font-size-16-m);
        margin-top: max(1.50rem, 4.00vw);
    }
    .contact__step-project6 .contact__question-title {
        font-size: var(--font-size-24-m);
        line-height: var(--lh-135);
    }
    .contact__step-project6 .contact__question-desc {
        font-variation-settings: 'wght' var(--weight-300);
        font-size: var(--font-size-12-m);
        line-height: var(--lh-130);
        margin-top: max(0.40rem, 1.07vw);
    }
    .contact__step-project6 .contact__answer {
        padding: max(2.00rem, 5.33vw) max(2.00rem, 5.33vw) 0 max(2.00rem, 5.33vw);
        aspect-ratio: auto 327 / 340;
    }
    .contact__step-project6 .contact__answer .contact__summary-inner {
        padding-bottom: max(2.00rem, 5.33vw);
    }
    .contact__step-project6 .contact__summary-title {
        font-size: var(--font-size-16-m);
        line-height: var(--lh-145);
    }
    .contact__step-project6 .contact__summary-answer {
        font-variation-settings: 'wght' var(--weight-400);
        font-size: var(--font-size-16-m);
        line-height: var(--lh-145);
    }
    .contact__step-project6 .contact__summary-item + .contact__summary-item {
        margin-top: max(2.00rem, 5.33vw);
    }
    .contact__step-project6 .contact__question {
        margin-bottom: max(3.00rem, 8.00vw);
    }
    .contact__step-outro .contact__completed {
        font-variation-settings: 'wght' var(--weight-600);
        font-size: var(--font-size-48-m);
    }
    .contact__step-outro .contact__completed-desc {
        font-variation-settings: 'wght' var(--weight-400);
        font-size: var(--font-size-18-m);
    }
    .contact__input-check {
        font-size: var(--font-size-16-m);
        width: max(2.40rem, 6.40vw);
    }
    .contact__arrow-wrap {
        /* bottom: max(2.60rem, 6.93vw); */
        bottom: max(2.10rem, 5.60vw);
        padding: 0 max(2.40rem, 6.40vw);
    }
    .contact__arrow-btn .contact__arrow-icon,
    .contact__arrow-btn.next-btn .contact__arrow-icon.ok {
        width: max(3.60rem, 9.60vw);
    }
    .contact__step-project6 .prev-btn,
    .contact__step-recruit2 .prev-btn {
        display: none;
    }
    .contact__submit-btn {
        width: 100%;
        font-size: var(--font-size-14-m);
        padding: max(1.60rem, 4.27vw) 0;
        line-height: var(--lh-120);

        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .contact__submit-icon {
        width: max(1.50rem, 4.00vw);
        margin-left: max(0.50rem, 1.33vw);
    }

    
    .contact__modal-close {
        width: max(3.60rem, 9.60vw);
        top: max(1.50rem, 4.00vw);
        right: max(1.50rem, 4.00vw);
    }
    .contact__modal-inner {
        width: max(32.70rem, 87.20vw);
        max-height: 100%;
        padding: max(5.00rem, 13.33vw) max(3.00rem, 8.00vw);
    }

    .contact__modal-header {
        margin-bottom: max(0.50rem, 1.33vw);
    }
    .contact__modal-title {
        font-size: var(--font-size-20-m);
        line-height: var(--lh-140);
    }
    
    .contact__modal-desc {
        font-variation-settings: 'wght' var(--weight-300);
        font-size: var(--font-size-12-m);
        line-height: var(--lh-130);
        margin-bottom: max(1.50rem, 4.00vw);
    }
    
    .contact__sub-title {
        font-variation-settings: 'wght' var(--weight-500);
        font-size: var(--font-size-14-m);
    }
    
    .contact__modal-list + .contact__modal-list {
        margin-top: max(1.50rem, 4.00vw);
    }
    
    .contact__list-inner {
        font-variation-settings: 'wght' var(--weight-300);
        font-size: var(--font-size-12-m);
    }


    /* 오류 */
    .contact__input.error-title .contact__answer-title::before {
        width: max(1.70rem, 4.53vw);
    }
    .contact__input.error-title .error-text {
        font-variation-settings: 'wght' var(--weight-500);
        font-size: var(--font-size-14-m);
        padding-left: max(2.00rem, 5.33vw);
        /* bottom: max(5.20rem, 13.87vw); */
        bottom: max(4.70rem, 12.53vw);
        line-height: var(--lh-120);
    }
    .contact__input.error-title .contact__answer-title {
        padding-left: max(2.00rem, 5.33vw);
    }
    .contact__input.error-title .error-text::before {
        width: max(1.70rem, 4.53vw);
    }
    .contact__slide-wrap .contact__slide:not(.contact__step-project2) .contact__input.error-title:not(:first-child) input[type="text"] {
        padding: max(2.50rem, 9.67vw) 0 max(1.00rem, 2.67vw) !important;
    }
}