@charset "UTF-8";

/*
 * =============================================================
 * INFORMATION
 * -------------------------------------------------------------
 * Author :mooyeon
  * -------------------------------------------------------------
 * Create Date :2019.02
 * -------------------------------------------------------------
 * Modified Date :2024.05
 * =============================================================
 */

/* reset */
* {
    margin:0;
    padding:0;
    -moz-box-sizing:border-box !important;
    -webkit-box-sizing:border-box !important;
    box-sizing:border-box !important;
    border:none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin:0;
    padding:0;
    -moz-box-sizing:border-box !important;
    -webkit-box-sizing:border-box !important;
    box-sizing:border-box !important;
    font-size:100%;
    border:0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, address {
    display:block;
    margin:0;
    padding:0;
    border:0;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content:'';
    content:none;
}
i, em, address, h1, h2, h3, h4, h5, h6 {
    font-style:normal;
}
body {
    line-height:1.2;
}
ol, ul, li {
    margin:0;
    padding:0;
    list-style-type:none;
}
a {
    display:inline-block;
    color:var(--color-basic);
    text-decoration:none;
    transition:all 0.3s;
}
a:link, a:visited, a:hover, a:active, a:focus {
    text-decoration:none;
}
a:hover {
    color:var(--color-blue);
}
a.underline {
    text-decoration:underline;
}
img {
    margin:0;
    padding:0;
    border:none;
    vertical-align:middle;
}
table {
    margin:0;
    padding:0;
    border-collapse:collapse;
    border-spacing:0;
}
table th, table td {
    padding:2px 3px;
    text-align:center;
    vertical-align:middle;
}
select, input {
    margin:0;
    padding:2px;
    vertical-align:middle;
}
select:focus, input:focus, textarea:focus {
    outline:0;
}
button {
    border:none;
    cursor:pointer;
    vertical-align:middle;
}
input[type="search"], input[type="text"], input[type="password"] {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}
input[type="checkbox"] {
    margin:-3px 5px 0 0;
    padding:0;
    width:15px;
    height:15px;
    background-color:#fff;
    border:1px solid #cbd5e1;
    border-radius:4px;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}
*,::after,::before {
    box-sizing:border-box
}
label {
    cursor:pointer;
}

/* 공통 레이아웃 */
:root {
    --color_green:#4CA73A;
    --color_green_hover:#3b8e2b;
    --color_emerald_dark:#059669;
    --color_blue:#1D2088;
    --color_dark_blue:#0A0D3A;
    --color_dark_blue_light:rgba(10, 13, 58, 0.8);
    --color_light_bg:#F3F6FA;
    --color_border:#E2E8F0;
    --color_border_light:#f3f4f6;
    --color_text_main:#1f2937;
    --color_text_muted:#6b7280;
    --color_text_light:#94a3b8;
    --color_card_border:rgba(255, 255, 255, 0.1);
    
    --font_family:'Inter', 'Noto Sans KR', sans-serif;
    --max_width:1400px; 
    --transition_normal:all 0.3s ease;
    --transition_fast:all 0.2s ease;
}

html {
    font-size:10px;
}
*, *::before, *::after {
    margin:0;
    padding:0;
    box-sizing:border-box;
}
body {
    font-family:var(--font_family);
    font-size:1.6rem;
    line-height:1.5;
    color:var(--color_text_main);
    -webkit-font-smoothing:antialiased;
    background-color:#fff;
    overflow-y:auto;
}
a {
    color:inherit;
    text-decoration:none;
}
button {
    font-family:inherit;
    background:none;
    border:none;
    cursor:pointer;
}
img {
    display:block;
    max-width:100%;
    height:auto;
}
ul, ol {
    list-style:none;
}

::-webkit-scrollbar {
    width:8px;
    height:8px;
}
::-webkit-scrollbar-track {
    background-color:#f1f1f1;
}
::-webkit-scrollbar-thumb {
    background-color:#cbd5e1;
    border-radius:4px;
}
::-webkit-scrollbar-thumb:hover {
    background-color:#94a3b8;
}

.container {
    width:100%;
    max-width:var(--max_width);
    margin-right:auto;
    margin-left:auto;
    padding-right:32px;
    padding-left:32px;
}

.btn_secondary {
    padding:8px 14px;
    color:var(--color_text_muted);
    font-weight:600;
    background-color:var(--color_light_bg);
}
.btn_secondary:hover {
    color:var(--color_text_main);
    background-color:#e2e8f0;
}

.global_search_section {
    padding:24px 0;
    background:linear-gradient(135deg, var(--color_blue), var(--color_dark_blue));
}
.global_search_wrapper {
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:16px;
}
.global_search_section .search_input_group {
    display:flex;
    flex-grow:1;
    position:relative;
    width:100%;
    max-width:800px;
}
.global_search_input {
    width:100%;
    padding:14px 56px 14px 24px;
    font-size:1.6rem;
    color:var(--color_text_main);
    background-color:#fff;
    border:2px solid transparent;
    border-radius:48px;
    box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1);
    outline:none;
    transition:var(--transition_fast);
}
.global_search_input:focus {
    border-color:var(--color_green);
    box-shadow:0 0 0 4px rgba(76, 167, 58, 0.2);
}
.global_search_btn {
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    top:50%;
    right:8px;
    width:40px;
    height:40px;
    font-size:1.6rem;
    color:#fff;
    background-color:var(--color_green);
    border-radius:50%;
    transform:translateY(-50%);
    transition:var(--transition_fast);
}
.global_search_btn:hover {
    background-color:var(--color_green_hover);
}
.btn_advanced_search_global {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:14px 24px;
    font-size:1.4rem;
    font-weight:600;
    color:#fff;
    white-space:nowrap;
    background-color:rgba(255, 255, 255, 0.1);
    border:1px solid rgba(255, 255, 255, 0.2);
    border-radius:48px;
    transition:var(--transition_fast);
}
.btn_advanced_search_global:hover {
    background-color:rgba(255, 255, 255, 0.2);
    border-color:#fff;
}

.page_header_section {
    padding:48px 0 64px 0;
    background-color:#fff;
    border-bottom:1px solid var(--color_border);
}
.breadcrumb_section {
    padding-top:48px;
    padding-bottom:16px;
    background-color:#fff;
}
.breadcrumb_section .breadcrumb {
    margin-bottom:0;
}
.breadcrumb_section + .page_header_section {
    padding-top:0;
}
.breadcrumb {
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:16px;
    font-size:1.4rem;
    color:var(--color_text_light);
}
.breadcrumb a {
    transition:var(--transition_fast);
}
.breadcrumb a:hover {
    color:var(--color_green);
}
.breadcrumb ul {
    display:flex;
    align-items:center;
    gap:8px;
    margin:0;
    padding:0;
    list-style:none;
}
.breadcrumb li:not(:last-child) {
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.breadcrumb li::after {
    display:inline-block;
    margin:0 4px;
    font-family:"Font Awesome 6 Free";
    font-size:1.0rem;
    font-weight:900;
    line-height:1;
    color:var(--color_text_light);
    content:"\f054";
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

.breadcrumb li:last-child::after {
    content:none;
}
.breadcrumb li:last-child {
    font-weight:600;
    color:#111827;
}
.page_title {
    margin-bottom:24px;
    font-size:4.2rem;
    font-weight:800;
    color:#111827;
    letter-spacing:-0.02em;
}

.modal_backdrop {
    display:none;
    align-items:center;
    justify-content:center;
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    padding:16px;
    background-color:rgba(0, 0, 0, 0.5);
    backdrop-filter:blur(4px);
    z-index:1010;
}
.adv_search_modal {
    display:flex;
    flex-direction:column;
    position:relative;
    width:100%;
    max-width:680px;
    max-height:855px;
    padding:40px;
    background-color:#fff;
    border:1px solid var(--color_border);
    border-top:4px solid var(--color_green);
    border-radius:16px;
    box-shadow:0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
.modal_close_btn {
    position:absolute;
    top:16px;
    right:16px;
    font-size:2.0rem;
    color:#9ca3af;
    transition:var(--transition_fast);
}
.modal_close_btn:hover {
    color:#4b5563;
}
.adv_header_actions {
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-shrink:0;
    margin-bottom:24px;
}
.adv_search_title {
    font-size:2.8rem;
    font-weight:800;
    color:#111827;
}
.adv_action_btns {
    display:flex;
    gap:4px;
}
.adv_btn_icon {
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    font-size:1.6rem;
    color:var(--color_text_muted);
    background-color:#fff;
    border:1px solid var(--color_border);
    border-radius:8px;
    transition:var(--transition_fast);
}
.adv_btn_icon:hover {
    color:var(--color_green);
    background-color:#f0fdf4;
    border-color:var(--color_green);
}
.adv_search_row {
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
}
.adv_search_row:last-child {
    margin-bottom:0;
}
.adv_select, .adv_input, .adv_select_logic {
    padding:10px 16px;
    font-size:1.6rem;
    color:var(--color_text_main);
    border:2px solid var(--color_border);
    border-radius:8px;
    outline:none;
    transition:var(--transition_fast);
}
.adv_select {
    width:120px;
    background-color:#f8fafc;
}
.adv_input {
    flex-grow:1;
    background-color:#f8fafc;
}
.adv_select_logic {
    display:none;
    width:100px;
    background-color:#fff;
}
.adv_select:focus, .adv_input:focus, .adv_select_logic:focus {
    border-color:var(--color_green);
    box-shadow:0 0 0 4px rgba(76, 167, 58, 0.1);
}
.adv_select:focus, .adv_input:focus {
    background-color:#fff;
}

.adv_rows_container {
    flex-grow:1;
    padding-right:8px;
    overflow-y:auto;
}
.adv_rows_container::-webkit-scrollbar {
    width:8px;
    height:8px;
}
.adv_rows_container::-webkit-scrollbar-track {
    background-color:#f1f1f1;
    border-radius:4px;
}
.adv_rows_container::-webkit-scrollbar-thumb {
    background-color:#cbd5e1;
    border-radius:4px;
}
.adv_rows_container::-webkit-scrollbar-thumb:hover {
    background-color:#94a3b8;
}
.adv_footer_actions {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    gap:16px;
    margin-top:32px;
    padding-top:32px;
    border-top:1px dashed var(--color_border);
}
.adv_btn_search {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px 32px;
    font-size:1.6rem;
    font-weight:700;
    color:#fff;
    background:linear-gradient(to right, var(--color_emerald_dark), var(--color_green));
    border-radius:8px;
    box-shadow:0 4px 6px -1px rgba(16, 185, 129, 0.1);
    transition:var(--transition_fast);
}
.adv_btn_search:hover {
    box-shadow:0 10px 15px -3px rgba(16, 185, 129, 0.2);
    transform:translateY(-1px);
}
.adv_btn_reset {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px 24px;
    font-size:1.6rem;
    font-weight:600;
    color:var(--color_text_muted);
    background-color:var(--color_light_bg);
    border-radius:8px;
    transition:var(--transition_fast);
}
.adv_btn_reset:hover {
    color:var(--color_text_main);
    background-color:#e2e8f0;
}

/* ==================== Responsive (Desktop First) ==================== */

@media (max-width:1023px) {

    .container {
        padding-right:24px;
        padding-left:24px;
    }

}

@media (max-width:767px) {

    .global_search_wrapper {
        display:flex;
        flex-direction:column;
        align-items:normal;
        justify-content:normal;
        gap:16px;
    }

}

@media (max-width:639px) {

    .container {
        padding-right:16px;
        padding-left:16px;
    }

}
