@charset "UTF-8";

#contents {background-color: var(--white);}
.request {padding: 280px 80px;}

.request_title {
    margin-bottom: 7rem;
    font-weight: 700; font-size: 1.5rem; line-height: 1.3;
}
.request_desc {
    margin-bottom: 7.5rem;
    line-height: 1.4;
}
.request_desc p {
    margin-bottom: 1.125rem;
    font-weight: 700; font-size: 3rem; 
}
.request_desc span {
    display: block; 
    font-size: 1.125rem; color: var(--red);
}


.request_form {margin-bottom: 10rem;}
.request_form_box + .request_form_box {margin-top: 6.25rem;}
.request_form_box p {font-weight: 700; font-size: 2rem; line-height: 1.5;}
.request_form_box p span {color: var(--red);}
.request_form_box p + * {margin-top: 2.5rem;}
.request_form_box .input_box {display: flex; align-items: center;}
.request_form_box .input_box + .input_box {margin-top: 2rem;}
.request_form_box .input_box label {
    width: 18%;
    font-weight: 700; font-size: 1.125rem; line-height: 1.5;
}
.request_form_box .input_box input {
    width: 82%; height: 4rem;
    font: 400 1.125rem/1.5 'Noto Sans Kr'; color: var(--black);
    border-bottom: 1px solid var(--border);
    background-color: var(--white);
}
.request_form_box .input_box input::placeholder {color: var(--placeholder);}
.request_form_box .input_box input:-webkit-autofill,
.request_form_box .input_box input:-webkit-autofill:hover,
.request_form_box .input_box input:-webkit-autofill:focus,
.request_form_box .input_box input:-webkit-autofill:active {
    -webkit-text-fill-color: var(--black) !important;
    box-shadow: 0 0 0px 1000px white inset !important;
    transition: background-color 5000s ease-in-out 0s;
}
.request_form_box textarea {
    width: 100%; min-height: 25rem;
    padding: 1.5rem;
    border: 1px solid var(--border);
    font: 1.125rem/1.5 'Noto Sans Kr'; color: var(--black);
    resize: none;
}
.request_form_box textarea::placeholder {color: var(--placeholder);}

.request_form_box + .check_box {margin-top: 2.5rem;}
.request .check_box {display: flex; align-items: center;}
.request .check_box input {
    width: 1.75rem; height: 1.75rem;
    margin-right: 1rem;
    border: 1px solid var(--border);
    border-radius: 4px;
    cursor: pointer;
}
.request .check_box input:checked {
    border-color: var(--point);
    background: var(--point) url(../assets/img/ico_checkbox.svg) no-repeat center / 0.75rem;
}
.request .check_box label {
    font-weight: 500; font-size: 1.25rem;
    cursor: pointer;
}
.request .check_box label span {color: var(--red);}

.request .btn {cursor: pointer;}





/* Media Query */
@media (max-width: 1600px) {
    .request {padding: 16rem 5vw;}
}

@media (max-width: 1280px) {
    .request {padding-left: 4vw; padding-right: 4vw;}
}

@media (max-width: 1024px) {
    .request_title {
        margin-bottom: 75px;
        font-size: 17px;
    }
    .request_desc {margin-bottom: 60px;}
    .request_desc p {
        margin-bottom: 0.75rem;
        font-size: 2.5rem; 
    }
    .request_desc span {font-size: 1.125rem;}

    .request_form {margin-bottom: 8rem;}
    .request_form_box + .request_form_box {margin-top: 50px;}
    .request_form_box p {font-size: 22px;}
    .request_form_box p + * {margin-top: 20px;}
    .request_form_box .input_box + .input_box {margin-top: 20px;}
    .request_form_box .input_box label {font-weight: 600;}
    .request_form_box .input_box input {font-size: 1.1875rem;}
    .request_form_box textarea {font-size: 1.1875rem;}
    .request_form_box + .check_box {margin-top: 20px;}
}


@media (max-width: 768px) {
    .request {padding-left: 30px; padding-right: 30px;}
}

@media (max-width: 640px) {
    .request {padding: 140px 20px;}
    .request_title {
        margin-bottom: 40px;
        font-size: 15px;
    }
    .request_desc {margin-bottom: 50px;}
    .request_desc p {
        margin-bottom: 10px;
        font-size: 28px;
    }
    .request_desc span {font-size: 13px;}
    .request_form {margin-bottom: 40px;}
    .request_form_box p {display: none;}
    .request_form_box p.forMobile {
        display: block;
        font-size: 15px;
    }

    .request_form_box .input_box {flex-direction: column;}
    .request_form_box .input_box + .input_box {margin-top: 30px;}
    .request_form_box .input_box label {
        width: 100%;
        font-size: 15px;
        position: relative;
    }
    .request_form_box .input_box label::before {
        content: "* ";
        color: var(--red);
    }
    .request_form_box .input_box input {
        width: 100%; height: 52px;
        padding-left: 4px;
        font-size: 14px;
    }
    .request_form_box + .request_form_box {margin-top: 30px;}

    .request_form_box textarea {
        padding: 16px 4px;
        border-left: none; border-right: none;
        font-size: 14px;
    }
    .request_form_box textarea::-webkit-scrollbar {width: 4px;}
    .request_form_box textarea::-webkit-scrollbar-thumb {background-color: var(--border);}
    .request_form_box textarea::-webkit-scrollbar-track {margin: 20px 0;}

    .request_form_box + .check_box {margin-top: 30px;}
    .request .check_box input {width: 20px; height: 20px;}
    .request .check_box input:checked {background-size: 10px;}
    .request .check_box label {font-size: 14px;}

    .request .btn {
        display: none; align-items: center; justify-content: center;
        width: 100%; height: 60px;
        padding-right: 50px;
        border-radius: 0;
        font: 15px/1.6 'Noto Sans KR'; color: var(--white);
        background-color: var(--point);
        position: fixed; left: 0; bottom: 0; z-index: 1000;
    }
    .request .btn.on {display: flex;}
    .request .btn::before {
        width: 17px; height: 17px;
        background-image: url(../assets/img/ico_arrow_white.svg);
        right: calc(50% - 80px);
    }
}