@charset "UTF-8";

/* =========================================================
   Global reset/util
   ========================================================= */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
button { cursor: pointer; }

/* Focus visibility for keyboard users */
a:focus-visible,
button:focus-visible,
.form_btn:focus-visible,
.top_basic:focus-visible {
    outline: 2px solid #00a1df;
    outline-offset: 2px;
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
}

/* Disabled states */
.com_input:disabled,
.com_select:disabled,
.form_btn:disabled,
.top_basic:disabled {
    background: #eee;
    color: #999;
    cursor: not-allowed;
    border-color: #ddd;
    opacity: .8;
}
.form_btn:hover:disabled,
.top_basic:hover:disabled { color: #999; border-color: #ddd; }

/* =========================================================
   공통 스탭
   ========================================================= */
#step_box { text-align: center; font-size: 0px; }
#step_box li { position: relative; display: inline-block; margin-right: 100px; }
#step_box li:last-child { margin-right: 0px; }
#step_box li:after { content: ""; width: 50px; height: 1px; background: #ddd; position: absolute; top: 68.5px; right: -75px; }
#step_box li:last-child:after { content: none; }
#step_box li .ico_box { border-radius: 100%; border: 3px solid #f3f3f3; background: #f3f3f3; overflow: hidden; margin: 0 auto 20px; }
#step_box li .ico_box img { display: block; }
#step_box li span { display: block; font-size: 16px; line-height: 100%; margin-bottom: 5px; }
#step_box li strong { display: block; font-size: 18px; line-height: 140%; }
#step_box li.on .ico_box { border-color: #00a1df }
#step_box li.on span { color: #00a1df; }
#step_box li.on strong { color: #00a1df; text-decoration: underline; }

/* =========================================================
   공통 체크/라디오
   ========================================================= */
.com_ck01 { display: inline-block; position: relative; overflow: hidden; }
.com_ck01 input { position: absolute; top: -30px; left: -30px; width: 0; height: 0; overflow: hidden; opacity: 0; }
.com_ck01 input + label { display: block; position: relative; font-size: 16px; line-height: 140%; padding: 3px 0 3px 35px; cursor: pointer; }
.com_ck01 input + label:after {
    content: ""; position: absolute; top: 0; left: 0; width: 25px; height: 25px; background-color: #ddd;
    background-image: url('../img/com_ck01_ck.png'); background-position: center; background-repeat: no-repeat;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.com_ck01 input:checked + label:after { background-color: #333; }
.com_ck01 input:focus + label:after { border: 1px solid #333; }

.com_ck02 { display: inline-block; position: relative; overflow: hidden; }
.com_ck02 input { position: absolute; top: -30px; left: -30px; width: 0; height: 0; overflow: hidden; opacity: 0; }
.com_ck02 input + label { display: block; position: relative; padding: 5px 0 5px 35px; font-size: 18px; line-height: 140%; cursor: pointer; }
.com_ck02 input + label span { font-size: 14px; }
.com_ck02 input + label:after,
.com_ck02 input + label:before { content: ""; position: absolute; border-radius: 100%; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; }
.com_ck02 input + label:after { top: 5px; left: 0px; width: 24px; height: 24px; border: 1px solid #ddd; background: #fff; }
.com_ck02 input + label:before { opacity: 0; z-index: 1; top: 13px; left: 8px; width: 10px; height: 10px; background: #00a1df; }
.com_ck02 input:checked + label:before { opacity: 1; }
.com_ck02 input:focus + label:after { border-color: #00a1df; }

.com_ck03 { display: inline-block; position: relative; overflow: hidden; font-size: 0px; line-height: 100%; vertical-align: middle; }
.com_ck03 input { position: absolute; top: -30px; left: -30px; width: 0; height: 0; overflow: hidden; opacity: 0; }
.com_ck03 input + label { display: inline-block; font-size: 0px; }
.com_ck03 input + label:after {
    content: ""; display: block; width: 20px; height: 20px; background-color: #fff; border: 1px solid #ddd; cursor: pointer;
    background-image: url('../img/com_ck03_ck.png'); background-position: center; background-repeat: no-repeat;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.com_ck03 input:checked + label:after { background-image: url('../img/com_ck01_ck_on.png'); }
.com_ck03 input:focus + label:after { border-color: #333; }

/* =========================================================
   공통 입력/영역/셀렉트
   ========================================================= */
.com_input { border: 1px solid #ddd; width: 100%; height: 50px; padding: 0 20px; font-size: 16px; max-width: 450px; background-repeat: no-repeat; }
.com_input2 { border: 1px solid #ddd; width: 100%; height: 50px; padding: 0 20px; font-size: 16px; max-width: 450px; background-repeat: no-repeat; background-color: #ddd }
.calender_input { background-image: url('../img/form/calender_input.png'); background-position: right 20px center; padding-right: 70px; }

.com_area { border: 1px solid #ddd; height: 150px; overflow-y: auto; padding: 20px; font-size: 16px; line-height: 160%; width: 100%; resize: none; }

.com_select {
    -webkit-appearance: none; -moz-appearance: none; appearance: none;
    height: 50px; line-height: 50px; border: 1px solid #ddd; padding: 0 60px 0 20px; font-size: 16px;
    background: #fff url('../img/path_arrow.png') no-repeat right 20px center;
}
.com_select::-ms-expand { display: none; }

/* =========================================================
   공통 버튼
   ========================================================= */
.form_btn {
    display: block; width: 200px; height: 50px; line-height: 50px; border: 1.5px solid #333; text-align: center; font-weight: 700; font-size: 16px;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.form_btn:focus,
.form_btn:hover { border-color: #00a1df !important; color: #00a1df; }

.top_add {
    display: inline-block; max-width: 180px; padding: 20px 60px 20px 20px; background-color: #333; font-size: 16px; color: #fff;
    background-image: url('../img/add_ico.png'); background-position: right 20px center; background-repeat: no-repeat;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.top_add:hover,
.top_add:focus { color: #fff; background-color: #00a1df; }

/* 공통 서브밋 버튼 */
.submit_btn_box { display: flex; flex-wrap: wrap; text-align: center; justify-content: center; }
.submit_btn_box.grid1 .submit_btn { width: 100%; }
.submit_btn_box.grid2 .submit_btn { width: calc(50% - 5px); }
.submit_btn_box.grid3 .submit_btn { width: calc(33.33% - 6.666666666666667px); }
.submit_btn_box .submit_btn {
    display: inline-block; height: 60px; line-height: 60px; max-width: 220px; border: 1px solid #333; font-size: 18px; font-weight: 700; margin-right: 10px;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.submit_btn_box .submit_btn:last-child { margin-right: 0px; }
.submit_btn_box .submit_btn.white { background: #fff; color: #333; }
.submit_btn_box .submit_btn.black { background: #333; color: #fff; }
.submit_btn_box .submit_btn.white:focus,
.submit_btn_box .submit_btn.white:hover { color: #00a1df; border-color: #00a1df; background: #fff; }
.submit_btn_box .submit_btn.black:focus,
.submit_btn_box .submit_btn.black:hover { background: #00a1df; border-color: #00a1df; }

.form_desc { font-size: 16px; line-height: 160%; color: #777; margin-top: 10px; }

/* =========================================================
   공통 신청폼
   ========================================================= */
.form_container > .item_box { border-top: 3px solid #333; border-bottom: 1px solid #333; padding: 20px 0; }
.form_container .item { display: flex; flex-wrap: wrap; padding: 10px 0; }
.form_container .item .txt_box { width: 220px; padding: 15px 15px 0 0; font-size: 18px; line-height: 140%; font-weight: 700; }
.form_container .item .txt_box * { font-size: 18px; line-height: 140%; font-weight: 700; }
.form_container .item .content_box { width: calc(100% - 220px); }
.form_container .item .com_ck02 { margin-right: 30px; }
.form_container .item .com_ck02:last-child { margin-right: 0px; }
.form_container .item .com_input { margin-top: 10px; display: block; }
.form_container .item .com_input:first-child { margin-top: 0px; }
.form_container .item .com_select { width: 100%; max-width: 450px; }
.form_container .tit_box { position: relative; }
.form_container .tit_box .top_box { position: absolute; bottom: 0; right: 0; }
.form_container .tit_box .top_box .desc { display: inline-block; font-size: 16px; color: #777; vertical-align: bottom; margin-right: 15px; }
.form_container .tit_box .top_box .desc b { color: #333; text-decoration: underline; }

.form_container .item .txt_box2 { width: 350px; padding: 15px 15px 0 0; font-size: 16px; line-height: 140%; font-weight: 700; }
.form_container .item .txt_box2 * { font-size: 18px; line-height: 140%; font-weight: 700; }
.form_container .item .content_box2 { width: calc(100% - 350px); }

/* 신청폼 버튼 박스 */
.form_container .btn_box { display: flex; flex-wrap: wrap; }
.form_container .btn_box .com_input { width: calc(100% - 200px); }

/* =========================================================
   신청폼 파일 - 공통(통일본, 한 줄 정렬)
   - overlay 제거, label[for] + 숨김 input 패턴
   ========================================================= */
.form_container .file_box {
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: nowrap; /* 한 줄 유지 */
}
.form_container .file_box .file_inner {
    display: inline-flex;
    align-items: center;
    width: 100%;
    gap: 0;
    padding: 0;
    border: none;
}
.form_container .file_box .com_input {
    height: 50px;
    line-height: 50px;
    padding: 0 12px;
    /* 버튼 2개(각 100px) 제외 */
    width: calc(100% - 200px);
    box-sizing: border-box;
}
.form_container .file_box .form_btn {
    width: 100px;
    height: 50px;
    line-height: 50px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.form_container .file_box .file_input {
    position: absolute !important;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

/* =========================================================
   개인정보처리방침 영역
   ========================================================= */
#agree_con .tit_box { position: relative; border-bottom: 1px solid #ddd; }
#agree_con .tit_box button {
    position: absolute; bottom: 30px; right: 0px; font-size: 16px; line-height: 100%; padding-right: 35px; line-height: 140%;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
    background-image: url('../img/top_arrow_b.png'); background-position: right center; background-repeat: no-repeat;
}
#agree_con .tit_box button.on { background-image: url('../img/bottom_arrow_b.png'); }
#agree_con .agree_box { border: 1px solid #ddd; border-top: none; height: 280px; overflow: hidden; padding: 30px; overflow-y: auto; font-size: 16px; line-height: 160%; }
#agree_con .agree_box * { font-size: 16px; line-height: 160%; }
#agree_con .com_ck01 { display: block; margin-top: 15px; }

/* =========================================================
   반응형 (<=1024px)
   ========================================================= */
@media all and (max-width:1024px) {
    /* 공통 스탭 */
    #step_box li { margin-right: 50px; }
    #step_box li:after { width: 20px; top: 45px; right: -35px; }
    #step_box li .ico_box { margin: 0 auto 15px; width: 90px; }
    #step_box li .ico_box img { width: 100%; }
    #step_box li span { font-size: 14px; }
    #step_box li strong { font-size: 16px; }

    /* 체크/라디오 */
    .com_ck01 input + label { font-size: 14px; padding: 3px 0 3px 30px; }
    .com_ck01 input + label:after { top: 3px; left: 0; width: 20px; height: 20px; background-color: #ddd; }
    .com_ck02 input + label { padding: 5px 0 5px 25px; font-size: 16px; }
    .com_ck02 input + label span { font-size: 13px; }
    .com_ck02 input + label:after { top: 5px; left: 0px; width: 19px; height: 19px; }
    .com_ck02 input + label:before { top: 13px; left: 8px; width: 5px; height: 5px; }

    /* 입력/셀렉트 */
    .com_input { height: 40px; padding: 0 15px; font-size: 14px; }
    .com_select { height: 40px; line-height: 40px; padding: 0 60px 0 15px; font-size: 14px; }

    /* 버튼 */
    .form_btn { width: 180px; height: 40px; line-height: 40px; border: 1.5px solid #333; text-align: center; font-weight: 700; font-size: 14px; }
    .top_add { padding: 15px 45px 15px 15px; font-size: 14px; background-position: right 15px center; background-size: 16px; }

    /* 제출 버튼 */
    .submit_btn_box .submit_btn { height: 50px; line-height: 50px; max-width: 200px; font-size: 16px; }
    .form_desc { font-size: 14px; }

    /* 신청폼 레이아웃 */
    .form_container > .item_box { padding: 15px 0; }
    .form_container .item { padding: 5px 0; }
    .form_container .item .txt_box { width: 150px; padding: 10px 10px 0 0; font-size: 16px; }
    .form_container .item .txt_box * { font-size: 16px; }
    .form_container .item .content_box { width: calc(100% - 150px); }
    .form_container .item .content_box2 { width: calc(100% - 250px); }
    .form_container .item .com_ck02 { margin-right: 15px; }

    .form_container .tit_box .top_box { position: static; margin-bottom: 15px; text-align: right; }
    .form_container .tit_box .top_box .desc { font-size: 14px; margin-bottom: 5px; margin-right: 0px; }

    /* 신청폼 버튼 박스 */
    .form_container .btn_box .com_input { width: calc(100% - 180px); }

    /* 파일 업로드(공통) 스케일 다운 */
    .form_container .file_box .com_input {
        height: 40px; line-height: 40px; width: calc(100% - 180px);
    }
    .form_container .file_box .form_btn {
        width: 90px; height: 40px; line-height: 40px;
    }
}

/* =========================================================
   반응형 (<=768px)
   ========================================================= */
@media all and (max-width:768px) {
    /* 스탭 */
    #step_box li { margin-right: 10px; }
    #step_box li:after { content: none; }
    #step_box li .ico_box { margin: 0 auto 10px; width: 70px; }
    #step_box li span { font-size: 12px; }
    #step_box li strong { font-size: 13px; letter-spacing: -0.5px; }

    /* 체크/라디오 */
    .com_ck02 input + label { font-size: 14px; }
    .com_ck02 input + label span { font-size: 12px; }

    /* 입력/셀렉트/버튼 */
    .com_input { height: 35px; max-width: 100% }
    .com_select { height: 35px; line-height: 35px; }
    .form_btn { width: 100%; height: 35px; line-height: 35px; }
    .top_add { padding: 10px 45px 10px 15px; font-size: 13px; background-size: 14px; }

    /* 제출 버튼 */
    .submit_btn_box .submit_btn { height: 40px; line-height: 40px; max-width: 160px; font-size: 14px; }
    .form_desc { font-size: 13px; }

    /* 신청폼 */
    .form_container .item .txt_box { width: 100%; padding: 10px 10px 0 0; font-size: 14px; margin-bottom: 10px; }
    .form_container .item .txt_box * { font-size: 14px; }
    .form_container .item .content_box { width: 100%; }
    .form_container .item .com_ck02 { margin-right: 10px; }
    .form_container .item .com_select { max-width: 100%; }
    .form_container .tit_box .top_box { text-align: left; }

    /* 버튼 박스 */
    .form_container .btn_box .com_input { width: 100%; }

    /* 파일 업로드(공통) - 줄바꿈 허용 + 여백 조정 */
    .form_container .file_box { flex-wrap: wrap; }
    .form_container .file_box .com_input {
        width: 100%;
        margin-bottom: 8px;
        height: 35px; line-height: 35px;
    }
    .form_container .file_box .form_btn {
        width: 100%;
        height: 35px; line-height: 35px;
    }
}

/* =========================================================
   극소 화면(<=380px)
   ========================================================= */
@media all and (max-width:380px) {
    .submit_btn_box.grid3 .submit_btn { width: calc(50% - 5px); }
    .submit_btn_box.grid3 .submit_btn:nth-child(2) { margin-right: 0px; }
    .submit_btn_box.grid3 .submit_btn:nth-child(3) { width: 100%; margin-top: 10px; max-width: 100%; }
}

/*** 폼 end *****************************************************************************************/

/* =========================================================
   테이블 모달/공통 링크/상단/테이블/버튼/모달
   ========================================================= */
.table_modal_dummy { display: none; z-index: 99999; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); cursor: pointer; }

.top_down {
    display: inline-block; max-width: 180px; padding: 20px 60px 20px 20px; background-color: #333; font-size: 16px; color: #fff; line-height: 140%;
    background-image: url('../img/download_ico02.png'); background-position: right 20px center; background-repeat: no-repeat;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.top_down:hover,
.top_down:focus { color: #fff; background-color: #00a1df; }

.top_view {
    display: inline-block; max-width: 230px; padding: 20px 20px 20px 60px; background-color: #333; font-size: 16px; color: #fff; line-height: 140%;
    background-image: url('../img/view_ico01.png'); background-position: left 20px center; background-repeat: no-repeat;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.top_view:hover,
.top_view:focus { color: #fff; background-color: #00a1df; }

.top_basic {
    display: inline-block; border: 2px solid #333; line-height: 140%; min-width: 140px; padding: 10px 30px; font-size: 16px; font-weight: 700;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.top_basic:hover,
.top_basic:focus { color: #00a1df; border-color: #00a1df; }

.form_table_container .tit_box { position: relative; }
.form_table_container .top_box { position: absolute; bottom: 0; right: 0; font-size: 0px; }
.form_table_container .top_box .desc { display: inline-block; font-size: 16px; color: #777; vertical-align: bottom; margin-right: 15px; }
.form_table_container .top_box .top_view,
.form_table_container .top_box .top_basic { margin-right: 5px; }
.form_table_container .top_box .top_basic:last-child { margin-right: 0px; }

.form_table_box { border-top: 2px solid #333; overflow-x: auto; }
.form_table_box table { min-width: 1200px; width: 100%; }
.form_table_box th { border-bottom: 1px solid #ddd; padding: 10px 10px; text-align: center; color: #333; border-right: 1px solid #ddd; font-size: 14px; line-height: 140%; word-break: keep-all; }
.form_table_box td { border-bottom: 1px solid #ddd; padding: 5px 10px; text-align: center; color: #333; border-right: 1px solid #ddd; font-size: 14px; line-height: 140%; word-break: keep-all; }
.form_table_box td { font-weight: 500; }
.form_table_box tr th:last-child,
.form_table_box tr td:last-child { border-right: 0px; }
.form_table_box tr th.blue,
.form_table_box tr td.blue { color: #00a1df; }
.form_table_box tr th.gray,
.form_table_box tr td.gray { color: #777; }
.form_table_box tr td.bold { font-weight: 700; }
.form_table_box tr td .desc { font-size: 12px; color: #999; line-height: 140%; margin-top: 5px; }
.form_table_box2 table { min-width: 500px; }

.table_down {
    display: block; border: 1px solid #333; padding: 5px 35px 5px 10px; margin-top: 5px; line-height: 140%; color: #333; text-align: left; font-size: 14px;
    background-image: url('../img/download_ico01.png'); background-position: right 10px center; background-size: 13px; background-repeat: no-repeat;
}
.table_btn { display: block; width: 100%; border: 1px solid #333; padding: 5px 0; line-height: 140%; margin: 0px 0; color: #333; font-size: 14px; }
.table_btn.blue { color: #fff; background: #00a1df; border-color: #00a1df; }
.table_btn.black { color: #fff; background: #333; border-color: #333; }
.table_btn_box { font-size: 0px; }
.table_btn_box .table_btn { display: inline-block; width: auto; margin-right: 5px; padding-left: 20px; padding-right: 20px; }
.table_btn_box .table_btn:last-child { margin-right: 0px; }

.table_modal {
    display: none; z-index: 9999999; position: fixed; top: 50%; left: 50%; width: 95%; max-width: 880px; max-height: 80%; overflow-y: auto; background: #fff; padding: 40px; border-radius: 20px;
    transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%);
}
.table_modal > img { display: block; margin: 0 auto; }
.table_modal > strong { display: block; font-size: 26px; line-height: 140%; margin: 10px 0; text-align: center; }
.table_modal > p { font-size: 16px; line-height: 160%; margin-bottom: 20px; text-align: center; }
.table_modal > p b { text-decoration: underline; }
.table_modal > p b.blue { text-decoration: none; color: #00a1df; }
.table_modal .form_container > .item_box { padding: 0px; border: none; }
.table_modal #modal_close { position: absolute; top: 20px; right: 20px; width: 50px; height: 50px; font-size: 0px; }
.table_modal #modal_close .bar {
    position: absolute; top: 50%; left: 50%; width: 100%; height: 3px; background: #333;
    transform: translate(-50%,-50%) rotate(45deg); -webkit-transform: translate(-50%,-50%) rotate(45deg); -moz-transform: translate(-50%,-50%) rotate(45deg);
}
.table_modal #modal_close .bar2 { transform: translate(-50%,-50%) rotate(-45deg); -webkit-transform: translate(-50%,-50%) rotate(-45deg); -moz-transform: translate(-50%,-50%) rotate(-45deg); }

/* 파일/결제/배송 모달 내부 폼 폭 */
#pay_modal form,
#file_modal form,
#deliver_modal form { max-width: 550px; margin: 0 auto; }
#pay_modal .form_container .item .content_box,
#deliver_modal .form_container .item .content_box,
#file_modal .form_container .item .content_box { width: 100%; }

#cancel_modal form { max-width: 700px; margin: 0 auto; }
#cancel_modal .form_container .item .txt_box { width: 100px; }
#cancel_modal .form_container .item .content_box { width: calc(100% - 100px); }
#cancel_modal .form_container .item .content_box > .com_input { max-width: 100%; }

#drone_modal .a_box { text-align: center; }
#drone_modal .a_box .a_link { width: calc(33% - 10px); padding: 0 40px; margin-right: 15px; }
#drone_modal .a_box .a_link:last-child { margin-right: 0px; }

#model_modal .sub_tit3 { display: block; }
#model_modal .search_box { position: relative; width: 100%; max-width: 500px; margin: 0 auto 30px; }
#model_modal .search_box input { border: 1px solid #333; padding: 0 140px 0 20px; font-size: 16px; height: 60px; max-width: 100%; width: 100%; }
#model_modal .search_box button { position: absolute; top: 0; right: 0; width: 120px; height: 60px; background: #333; color: #fff; text-align: center; line-height: 60px; font-size: 16px; }

/* 추가 모달들(유사 검색 박스 스타일) */
#canopy_modal .sub_tit3,
#harness_modal .sub_tit3,
#emergency_modal .sub_tit3 { display: block; }
#canopy_modal .search_box,
#harness_modal .search_box,
#emergency_modal .search_box { position: relative; width: 100%; max-width: 500px; margin: 0 auto 30px; }
#canopy_modal .search_box input,
#harness_modal .search_box input,
#emergency_modal .search_box input { border: 1px solid #333; padding: 0 140px 0 20px; font-size: 16px; height: 60px; max-width: 100%; width: 100%; }
#canopy_modal .search_box button,
#harness_modal .search_box button,
#emergency_modal .search_box button { position: absolute; top: 0; right: 0; width: 120px; height: 60px; background: #333; color: #fff; text-align: center; line-height: 60px; font-size: 16px; }

#reserve_modal .sub_tit3 { display: block; }
#reserve_modal .search_box { position: relative; width: 100%; max-width: 500px; margin: 0 auto 30px; }
#reserve_modal .search_box input { border: 1px solid #333; padding: 0 140px 0 20px; font-size: 16px; height: 60px; max-width: 100%; width: 100%; }
#reserve_modal .search_box button { position: absolute; top: 0; right: 0; width: 120px; height: 60px; background: #333; color: #fff; text-align: center; line-height: 60px; font-size: 16px; }

#etc_modal form { max-width: 700px; margin: 0 auto; }
#etc_modal .form_container .item .txt_box { width: 100px; }
#etc_modal .form_container .item .content_box { width: calc(100% - 100px); }

/* 테이블 검색 */
.form_table_search { display: flex; flex-wrap: wrap; font-size: 0px; margin-bottom: 30px; }
.form_table_search .com_select { margin-right: 5px; }
.form_table_search .search_form { margin-left: auto; }
.form_table_search .search_form .com_select { border: 1px solid #333; }
.form_table_search .search_form div { position: relative; display: inline-block; vertical-align: top; }
.form_table_search .search_form input { width: 340px; height: 50px; font-size: 16px; padding: 0 110px 0 20px; border: 1px solid #333; border-radius: 0px; }
.form_table_search .search_form button {
    position: absolute; bottom: 0; right: 0; width: 80px; height: 50px; background: #000; color: #fff; line-height: 45px; font-size: 16px;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.form_table_search .search_form button:hover,
.form_table_search .search_form button:focus { background: #00a1df; }

/* 반응형: 테이블/모달/검색 (<=1024px) */
@media all and (max-width:1024px) {
    .top_down { padding: 10px 50px 10px 15px; font-size: 14px; background-position: right 15px center; background-size: 15px; }
    .top_view { max-width: 200px; padding: 10px 15px 10px 45px; font-size: 14px; background-position: left 15px center; background-size: 15px; }
    .top_basic { padding: 10px 20px; font-size: 14px; }

    .form_table_container .top_box { position: static; text-align: right; margin-bottom: 20px; }
    .form_table_container .top_box .desc { font-size: 14px; margin-right: 10px; }

    .form_table_box th,
    .form_table_box td { padding: 10px; font-size: 13px; }

    .table_btn { font-size: 13px; }

    .table_modal { padding: 30px; border-radius: 15px; }
    .table_modal > img { width: 45px; }
    .table_modal > strong { font-size: 20px; }
    .table_modal > p { font-size: 14px; margin-bottom: 15px; }
    .table_modal #modal_close { width: 40px; height: 40px; }

    #drone_modal .a_box .a_link { display: inline-block; width: calc(33% - 6.666666666666667px); padding: 0 20px; margin-right: 10px; margin-bottom: 0px; }

    .form_table_search { margin-bottom: 20px; }
    .form_table_search .com_select { margin-bottom: 5px; }
    .form_table_search .search_form { display: block; width: 100%; }
    .form_table_search .search_form input { width: 250px; height: 40px; font-size: 14px; padding: 0 90px 0 15px; }
    .form_table_search .search_form button { width: 60px; height: 40px; line-height: 40px; font-size: 14px; }
}

/* 반응형: 테이블/모달/검색 (<=768px) */
@media all and (max-width:768px) {
    .top_view { margin-bottom: 5px; }
    .top_basic { padding: 5px 20px; }

    .form_table_container .top_box { position: static; text-align: left; margin-bottom: 10px; }
    .form_table_container .top_box .desc { display: block; margin-right: 0px; margin-bottom: 10px; }

    .table_modal > img { width: 40px; }
    .table_modal > strong { font-size: 18px; }
    .table_modal #modal_close { width: 35px; height: 35px; }

    #cancel_modal .form_container .item .txt_box,
    #cancel_modal .form_container .item .content_box,
    #etc_modal .form_container .item .txt_box,
    #etc_modal .form_container .item .content_box { width: 100%; }

    #drone_modal .a_box .a_link { display: block; width: 100%; margin: 0 auto 10px; }
    #drone_modal .a_box .a_link:last-child { margin: 0 auto; }

    .form_table_search { margin-bottom: 15px; }
    .form_table_search .search_form .com_select { display: block; margin-right: 0px; margin-bottom: 5px; }
    .form_table_search .search_form input { width: 250px; height: 35px; padding: 0 60px 0 15px; }
    .form_table_search .search_form button { width: 50px; height: 35px; line-height: 35px; }
}

/* 극소 화면: 테이블 검색 */
@media all and (max-width:380px) {
    .top_basic { max-width: 100%; width: 100%; }
    .form_table_container .top_box .top_basic { margin-right: 0px; }
    .form_table_container .top_box .top_basic:last-child { margin-top: 5px; }

    .form_table_search .com_select,
    .form_table_search .search_form .com_select { width: 100%; margin-right: 0px; }
    .form_table_search .search_form div { width: 100%; }
    .form_table_search .search_form input { width: 100%; }
}

/*** 공통 테이블 end ********************************************************************************/

/* =========================================================
   폼 컨테이너 2 (박스형 상세)
   ========================================================= */
.form_container2 .item_box2 { border-top: 3px solid #333; }
.form_container2 .item2 { display: flex; flex-wrap: wrap; border-bottom: 1px solid #999; }
.form_container2 .item2 .txt_box,
.form_container2 .item2 .content_box { padding: 20px; }
.form_container2 .item2 .txt_box { width: 200px; background: #f4f4f4; }
.form_container2 .item2 .txt_box label,
.form_container2 .item2 .txt_box strong { display: inline-block; font-size: 15px; font-weight: 700; line-height: 140%; }
.form_container2 .item2 .txt_box small { display: block; font-size: 13px; color: #999; line-height: 140%; margin-top: 5px; }
.form_container2 .item2 .txt_box > button {
    display: inline-block; background: #333; color: #fff; font-size: 14px; padding: 5px 10px; margin-top: 10px;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;
}
.form_container2 .item2 .txt_box > button:hover,
.form_container2 .item2 .txt_box > button:focus { background: #00a1df; }
.form_container2 .item2 .content_box { width: calc(100% - 200px); }
.form_container2 .item2 .content_box.w400 { width: calc(100% - 400px); }
.form_container2 .item2 .com_ck02 { margin-right: 30px; }
.form_container2 .item2 .com_ck02:last-child { margin-right: 0px; }
.form_container2 .item2 .com_ck02 input + label { font-weight: 700; }
.form_container2 .item2 .com_ck02 input + label span { font-weight: 500; }

.form_container2 .item2 .txt_box2 { margin-bottom: 10px; }
.form_container2 .item2 .txt_box2 label,
.form_container2 .item2 .txt_box2 strong { display: inline-block; font-size: 15px; font-weight: 700; line-height: 140%; margin-right: 5px; }
.form_container2 .item2 .txt_box2 small { display: inline-block; font-size: 13px; color: #999; line-height: 140%; }

.form_container2 .item2 .box_inner { display: flex; flex-wrap: wrap; }
.form_container2 .item2 .content_box.grid3 .inner_item { width: calc(33.33% - 20px); margin-right: 30px; margin-top: 15px; }
.form_container2 .item2 .content_box.grid3 .inner_item:nth-child(3n+3) { margin-right: 0px; }
.form_container2 .item2 .content_box.grid3 .inner_item:nth-child(-n+3) { margin-top: 0px; }
.form_container2 .item2 .content_box.grid2 .inner_item { width: calc(50% - 15px); margin-right: 30px; margin-top: 15px; }
.form_container2 .item2 .content_box.grid2 .inner_item:nth-child(2n+2) { margin-right: 0px; }
.form_container2 .item2 .content_box.grid2 .inner_item:nth-child(-n+2) { margin-top: 0px; }

.form_container2 .item2 .box_inner.grid2 .inner_item { display: flex; flex-wrap: wrap; }
.form_container2 .item2 .box_inner.grid2 .txt_box3 { width: 40px; padding-top: 10px; }
.form_container2 .item2 .box_inner.grid2 .txt_box3 label,
.form_container2 .item2 .box_inner.grid2 .txt_box3 strong { font-size: 14px; line-height: 140%; font-weight: 700; }
.form_container2 .item2 .box_inner.grid2 .txt_box3 small { display: block; font-size: 12px; color: #999; margin-top: 3px; line-height: 140%; }
.form_container2 .item2 .box_inner.grid2 .content_box2 { width: 100%; }

/* 반응형: 폼 컨테이너 2 */
@media all and (max-width:1230px) {
    .question_box div { left: 50%; top: calc(100% + 10px); margin-left: 0px; transform: translateX(-50%); max-width: 250px; }
}
@media all and (max-width:1024px) {
    .form_container2 .item2 .txt_box,
    .form_container2 .item2 .content_box { padding: 15px; }
    .form_container2 .item2 .txt_box { width: 180px; }
    .form_container2 .item2 .txt_box label,
    .form_container2 .item2 .txt_box strong { font-size: 14px; }
    .form_container2 .item2 .txt_box small { font-size: 12px; margin-top: 3px; }
    .form_container2 .item2 .txt_box > button { font-size: 13px; padding: 5px 5px; }
    .form_container2 .item2 .content_box { width: calc(100% - 180px); }
    .form_container2 .item2 .com_ck02 { margin-right: 20px; }

    .form_container2 .item2 .txt_box2 { margin-bottom: 5px; }
    .form_container2 .item2 .txt_box2 label,
    .form_container2 .item2 .txt_box2 strong { font-size: 14px; margin-right: 0px; }
    .form_container2 .item2 .txt_box2 small { display: block; font-size: 12px; margin-top: 1px; }

    .form_container2 .item2 .content_box.grid3 .inner_item { width: calc(33.33% - 10px); margin-right: 15px; margin-top: 10px; }
    .form_container2 .item2 .content_box.grid2 .inner_item { width: calc(50% - 7.5px); margin-right: 15px; margin-top: 10px; }

    .form_container2 .item2 .box_inner.grid2 .txt_box3 { width: 100%; padding-top: 0px; margin-bottom: 5px; }
    .form_container2 .item2 .box_inner.grid2 .txt_box3 label,
    .form_container2 .item2 .box_inner.grid2 .txt_box3 strong { font-size: 14px; }
    .form_container2 .item2 .box_inner.grid2 .txt_box3 small { display: block; font-size: 12px; margin-top: 1px; }
    .form_container2 .item2 .box_inner.grid2 .content_box2 { width: 100%; }

    .question_box div { font-size: 12px; padding: 10px; }
}
@media all and (max-width:768px) {
    .form_container2 .item2 .txt_box { width: 100%; border-bottom: 1px solid #ddd; }
    .form_container2 .item2 .content_box { width: 100%; }
    .form_container2 .item2 .com_ck02 { margin-right: 10px; }

    .form_container2 .item2 .content_box.grid3 .inner_item,
    .form_container2 .item2 .content_box.grid2 .inner_item { width: 100%; margin-right: 0px; margin-top: 10px; }
    .form_container2 .item2 .content_box.grid3 .inner_item:nth-child(-n+3),
    .form_container2 .item2 .content_box.grid2 .inner_item:nth-child(-n+2) { margin-top: 10px; }
    .form_container2 .item2 .content_box.grid3 .inner_item:nth-child(-n+1) { margin-top: 0px; }

    .form_container2 .item2 .box_inner.grid2 .txt_box3 { width: 100%; padding-top: 0px; margin-bottom: 5px; }
    .form_container2 .item2 .box_inner.grid2 .txt_box3 label,
    .form_container2 .item2 .box_inner.grid2 .txt_box3 strong { font-size: 14px; }
    .form_container2 .item2 .box_inner.grid2 .txt_box3 small { display: block; font-size: 12px; margin-top: 1px; }
    .form_container2 .item2 .box_inner.grid2 .content_box2 { width: 100%; }
}

/* =========================================================
   질문 툴팁
   ========================================================= */
.question_box { display: inline-block; position: relative; font-size: 0px; vertical-align: middle; }
.question_box button {
    display: inline-block; font-size: 0px; width: 18px; height: 18px; border-radius: 100%; border: 1px solid #ddd;
    background-image: url('../img/form/question_ico.png'); background-position: center; background-repeat: no-repeat;
}
.question_box div {
    display: none; position: absolute; top: 0; left: 100%; margin-left: 10px; width: 200px; padding: 15px; border: 2px solid #00a1df; border-radius: 10px; font-weight: 500; line-height: 160%; font-size: 14px; background: #fff;
}

/* =========================================================
   안전성인증 신청/현황
   ========================================================= */
#safety_certification_intro01 { background: #f4f4f4; padding: 60px 20px; text-align: center; }
#safety_certification_intro01 .tit_box { margin: 10px 0 30px; }
#safety_certification_intro01 .tit_box strong { display: block; font-size: 24px; line-height: 140%; margin-bottom: 10px; }
#safety_certification_intro01 .tit_box p { font-size: 16px; line-height: 160%; }
#safety_certification_intro01 .tit_box p b { text-decoration: underline; }
#safety_certification_intro01 .search_box { position: relative; width: 100%; max-width: 500px; margin: 0 auto; }
#safety_certification_intro01 .search_box input { width: 100%; border: 1px solid #333; padding: 0 140px 0 20px; font-size: 16px; height: 60px; }
#safety_certification_intro01 .search_box button { position: absolute; top: 0; right: 0; width: 120px; height: 60px; background: #333; color: #fff; text-align: center; line-height: 60px; font-size: 16px; }
#safety_certification_intro01 .a_box .a_link { width: calc(50% - 7.5px); background: #fff; max-width: 200px; margin-right: 15px; }
#safety_certification_intro01 .a_box .a_link:last-child { margin-right: 0px; }

#safety_certification_intro03 { background: #f4f4f4; padding: 60px 0px; }
#safety_certification_intro03 .form_table_container .tit_box .sub_tit3 { display: inline-block; }
#safety_certification_intro03 .form_table_container .tit_box P { display: inline-block; font-size: 16px; color: #777; margin-left: 15px; line-height: 160%; }
#safety_certification_intro03 .form_table_container .tit_box P b { color: #333; text-decoration: underline; }
#safety_certification_intro03 .form_table_box { background: #fff; }

#safety_certification_board01_2 { background: #f4f4f4; padding: 100px 0px 60px; }
#safety_certification_board01_2 .form_table_box { background: #fff; }

/* 1) 읽기 전용처럼 보이게(편의 유틸) */
.is-readonly { background: #f9f9f9 !important; cursor: pointer; }

/* 2) 입력/선택 잠금 상태 표시(페이지에서 사용 중) */
.locked { pointer-events: none; background: #f9f9f9; color: #555; }

/* 3) 파일 링크 리스트(수정요청 첨부목록 등 재사용) */
.file_link_list { display: flex; flex-direction: column; gap: 0; }
.file_link_list .file_row { display: flex; align-items: center; height: 40px; min-height: 40px; }
.file_link_list .file_row a,
.file_link_list .file_row .empty-file-msg {
    display: inline-block; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.file_link_list .file_row a { line-height: 40px; color: #2962FF; text-decoration: underline; }

/* 4) 파일 항목 라벨/내용 정렬(“첨부파일” 라인) */
.form_container .item.is-file { align-items: center; }
.form_container .item.is-file .txt_box { padding: 0 15px 0 0; }

/* 5) 읽기 전용 멀티라인 텍스트(자동 줄바꿈/높이) */
.readonly_multiline {
    display: block; width: 100%; min-height: 50px;
    padding: 10px 14px; line-height: 1.6;
    white-space: pre-wrap; word-break: break-word; overflow: hidden; resize: none;
    background: #f9f9f9; cursor: default;
}

/* 반응형: 안전성 영역 */
@media all and (max-width:1024px) {
    #safety_certification_intro01 img { width: 45px; }
    #safety_certification_intro01 { padding: 40px 20px; }
    #safety_certification_intro01 .tit_box { margin: 10px 0 20px; }
    #safety_certification_intro01 .tit_box strong { font-size: 20px; margin-bottom: 10px; }
    #safety_certification_intro01 .tit_box p { font-size: 14px; }
    #safety_certification_intro01 .search_box input { padding: 0 120px 0 15px; font-size: 14px; height: 50px; }
    #safety_certification_intro01 .search_box button { width: 100px; height: 50px; line-height: 50px; font-size: 14px; }
    #safety_certification_intro01 .a_box .a_link { display: inline-block; width: calc(50% - 5px); margin-right: 10px; }
    #safety_certification_intro03 .form_table_container .tit_box P { display: block; margin-left: 0; margin-bottom: 20px; margin-top: -10px; font-size: 14px; }
}
@media all and (max-width:768px) {
    #safety_certification_intro01 img { width: 40px; }
    #safety_certification_intro01 { padding: 30px 15px; }
    #safety_certification_intro01 .tit_box { margin: 10px 0 15px; }
    #safety_certification_intro01 .tit_box strong { font-size: 18px; }
    #safety_certification_intro01 .tit_box p br { display: none; }
    #safety_certification_intro01 .search_box input { padding: 0 80px 0 15px; height: 45px; }
    #safety_certification_intro01 .search_box button { width: 60px; height: 45px; line-height: 45px; }
    #safety_certification_intro01 .a_box .a_link { display: inline-block; width: calc(50% - 5px); margin-right: 10px; }
}

/* 기타 유틸 */
.padding0 { padding: 0px !important; }

/* 필수 마크(별) */
.star {
    position: relative;
    display: inline-block;
    padding-right: 16px;
}
.star::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    background: url('../img/star.png') no-repeat center center;
    background-size: contain;
}

/* content_box2 반응형 */
@media (max-width: 1024px) {
    .form_container .item .content_box2 { width: calc(100% - 250px); }
}
@media (max-width: 768px) {
    .form_container .item .content_box2 { width: 100%; }
}

.force-show { display: block !important; }

/* 검색 인풋과 동일한 스타일로 오른쪽 액션 버튼 정렬/스타일 */
.form_table_search > .search_form1:last-child {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0; /* 버튼들을 붙여 보이게 */
}

/* 버튼 높이/테두리/패딩을 검색 인풋과 동일하게(1px, 50px) */
.form_table_search > .search_form1:last-child .top_basic {
    height: 50px;
    line-height: 50px;
    border: 1px solid #333;   /* ← 기존 2px → 1px */
    border-radius: 0;         /* 인풋과 같은 각진 모양 */
    padding: 0 24px;          /* 인풋 버튼 대비 여백 */
    font-size: 16px;
    background: #fff;
    color: #333;
}

/* 이웃한 버튼들 사이 경계선이 두껍게 보이지 않도록 겹침 처리 */
.form_table_search > .search_form1:last-child .top_basic + .top_basic {
    margin-left: -1px;        /* 테두리 1px만 보이도록 겹치기 */
}

/* 호버/포커스 상태도 검색 컨트롤과 통일감 */
.form_table_search > .search_form1:last-child .top_basic:hover,
.form_table_search > .search_form1:last-child .top_basic:focus {
    border-color: #00a1df;
    color: #00a1df;
}

/* 반응형(<=1024px, <=768px)에서 기존 인풋 높이에 맞춤 */
@media (max-width:1024px) {
    .form_table_search > .search_form1:last-child .top_basic {
        height: 40px; line-height: 40px; font-size: 14px; padding: 0 18px;
    }
}
@media (max-width:768px) {
    .form_table_search > .search_form1:last-child {
        flex-wrap: wrap; gap: 6px;
    }
    .form_table_search > .search_form1:last-child .top_basic {
        width: auto;
        height: 35px; line-height: 35px; font-size: 14px; padding: 0 14px;
    }
}
