/* 폼 */
:root {
    --input_h: 55px;
}

#sect_visual .visual_right {
    min-width: 400px;
    flex-shrink: 0;
}

/* 체크박스를 제외한 텍스트 입력창과 셀렉트 박스만 지정 */
.Myform input:not([type="checkbox"]),
.Myform select {
    width: 100%;
    outline: none;
    color: var(--gray_8);
    height: var(--input_h);
    border-radius: var(--br_5);
    border: 1px solid var(--sub_light);
    padding: 0 15px;
}

/* 공통 */
.Myform .form_group {
    align-items: stretch;
}

.Myform .form_group > * {
    min-width: 0;
}

.Myform .form_inner {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* 체크박스는 원래 크기 유지 */
.Myform input[type="checkbox"].custom_chk {
    width: 16px !important;
    height: 16px !important;
    min-height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background-image: none !important;
}

/* 버튼 공통 */
.Myform .form_inner button[type="submit"],
.Myform .form_inner button[type="button"] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: var(--input_h) !important;
    min-height: var(--input_h) !important;
    border: none;
    border-radius: var(--br_5) !important;
    cursor: pointer;
    padding: 0 !important;
    line-height: 1 !important;
}

/* =========================
   메인 전용
   세로형 / 체크박스 위 / 버튼 아래
   ========================= */
#sect_visual .Myform .form_group {
    flex-direction: column !important;
}

#sect_visual .Myform .form_inner .agree_check {
    order: 1;
    margin-top: 5px;
}

#sect_visual .Myform .form_inner button[type="submit"],
#sect_visual .Myform .form_inner button[type="button"] {
    order: 2;
    margin-top: 10px !important;
}


/* =========================
   서브 기본형
   가로 1|1|1|1 / 버튼 위 / 체크박스 아래
   ========================= */
#footer_form .Myform .form_group {
    flex-direction: row !important;
}

#footer_form .Myform .form_group > input,
#footer_form .Myform .form_group > select,
#footer_form .Myform .form_group > .form_inner {
    flex: 1 1 0;
}

#footer_form .Myform .form_inner .agree_check {
    order: 2;
    margin-top: 10px;
}

#footer_form .Myform .form_inner button[type="submit"],
#footer_form .Myform .form_inner button[type="button"] {
    order: 1;
    margin-top: 0 !important;
}

/* =========================
   태블릿
   서브도 자연스럽게 줄바꿈
   ========================= */
@media (max-width: 991px) {
    #footer_form .Myform .form_group {
        flex-wrap: wrap;
    }

    #footer_form .Myform .form_group > input,
    #footer_form .Myform .form_group > select,
    #footer_form .Myform .form_group > .form_inner {
        flex: 1 1 calc(50% - 5px);
    }
}

/* =========================
   모바일
   서브 1 / 1 / 1 / 1
   메인도 그대로 세로
   체크박스는 둘 다 위
   ========================= */
@media (max-width: 767px) {
    :root {
        --input_h: 45px;
    }

    #sect_visual .visual_right {
        min-width: 100%;
    }

    #footer_form .Myform {
        max-width: 100%;
        margin: 0 auto;
    }

    #footer_form .Myform .form_group {
        flex-direction: column !important;
        flex-wrap: nowrap;
    }

    #footer_form .Myform .form_group > input,
    #footer_form .Myform .form_group > select,
    #footer_form .Myform .form_group > .form_inner {
        flex: none;
        width: 100%;
    }

    #footer_form .Myform .form_inner .agree_check {
        order: 1;
        margin-top: 5px;
    }

    #footer_form .Myform .form_inner button[type="submit"],
    #footer_form .Myform .form_inner button[type="button"] {
        order: 2;
        margin-top: 10px !important;
    }
}