@layer base {


    :root {
        --dyami-content-padding: 0;
    }

    .section-block {
        padding: 6rem 0
    }

    @media (max-width: 991px) {
        .section-block {
            padding: 4rem 1rem
        }
    }

    /* ----------------------------------------------------------------
     * Ä÷¯
     -----------------------------------------------------------------*/
    :root {
        --dyami-section-bg: var(--bs-body-bg);
        --dyami-themecolor: #128dff;
        --dyami-themecolor-rgb: 18, 141, 255;
        --dyami-subcolor: #eee;
        --dyami-subcolor-rgb: 238, 238, 238;
        --dyami-link-color: var(--bs-body-color);
        --dyami-link-hover-color: var(--dyami-themecolor);
        --dyami-form-search-border: 1px solid var(--bs-border-color);
    }

    .table input, .table select, table textarea {
        --dyami-form-bg: var(--bs-light);
        --dyami-form-border-color: var(--bs-light);
        --dyami-form-color: var(--bs-dark);
        --dyami-form-focus-bg: var(--bs-body-bg);
        --dyami-form-focus-border-color: var(--dyami-themecolor);
    }

    .accordion {
        --bs-accordion-bg: transparent;
        --bs-accordion-border-color: var(--bs-border-color);
        --bs-accordion-active-bg: var(--dyami-subcolor);
    }


    /* ----------------------------------------------------------------
     * ÆùÆ®
     * À¥ÆùÆ®  ¼Ò½º´Â [¸ðµâ > TOP > ½ºÅ¸ÀϽÃÆ®] ¿¡¼­ È®ÀÎ °¡´ÉÇÕ´Ï´Ù.
     -----------------------------------------------------------------*/
    :root {
        --dyami-body-font: 'Pretendard', 'Open Sans', 'Noto Sans KR', -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif !important;
        --dyami-primary-font: var(--dyami-body-font);
        --bs-body-font-size: 18px;
        --bs-body-font-weight: 400;
        --bs-body-line-height: 1.5;
        --dyami-font-size-h1: 3rem;
        --dyami-font-size-h2: 2.75rem;
        --dyami-font-size-h3: 2.5rem;
        --dyami-font-size-h4: 2rem;
        --dyami-font-size-h5: 1.5rem;
        --dyami-font-size-h6: 1.25rem;
        --dyami-font-size-small: calc(var(--dyami-font-size-body) * 0.875);
        --dyami-headings-font-weight: 400;
    }

    @media (max-width: 1199px) {
        :root {
            --dyami-font-size-h1: 52px;
            --dyami-font-size-h2: 44px;
            --dyami-font-size-h3: 32px;
            --dyami-font-size-h6: 1rem;
        }
    }
    @media (max-width: 991px) {
        :root {
            --bs-body-font-size: 16px;
            --dyami-font-size-h1: 40px;
            --dyami-font-size-h2: 34px;
            --dyami-font-size-h3: 30px;
            --dyami-font-size-h4: 24px;
        }
    }
    @media (max-width: 575px) {
        :root {
            --dyami-font-size-h1: 32px;
            --dyami-font-size-h2: 28px;
            --dyami-font-size-h3: 25px;
            --dyami-font-size-h4: 22px;
            --dyami-font-size-h5: 18px;
        }
    }

    .display-1 {
        font-size: calc(1.575rem + 4.5vw);
    }

    .display-2 {
        font-size: calc(1.575rem + 3.9vw);
    }

    .display-3 {
        font-size: calc(1.475rem + 3.3vw);
    }

    .display-4 {
        font-size: calc(1.475rem + 1.8vw);
    }

    .display-5 {
        font-size: calc(1.375rem + 1.8vw);
    }

    @media (min-width: 1200px) {
        .display-1 {
            font-size: 4.25rem;
        }

        .display-2 {
            font-size: 4rem;
        }

        .display-3 {
            font-size: 3.75rem;
        }

        .display-4 {
            font-size: 3.5rem;
        }

        .display-5 {
            font-size: 3.25rem;
        }
    }

    @media (max-width: 991px) {
        h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
            margin-bottom: 1.2rem
        }
    }

    /* ----------------------------------------------------------------
     * ¸Þ´º¹Ù
     -----------------------------------------------------------------*/
    #header {
        --dyami-header-height: 60px;
        --dyami-header-bg: #fff;
        --dyami-header-border-color: #fff;
        --dyami-primary-menu-hover-bg: var(--bs-light);
        --dyami-primary-menu-active-color: var(--dyami-themecolor);
        --dyami-primary-menu-color: var(--bs-dark);
        --dyami-primary-menu-hover-color: var(--dyami-themecolor);
        --dyami-primary-menu-hover-bg: transparent;
        --dyami-primary-menu-font: var(--dyami-body-font);
        --dyami-primary-menu-font-weight: 500;
        --dyami-primary-menu-font-size: 18px;
        --dyami-primary-menu-submenu-bg: var(--dyami-themecolor);
        --dyami-primary-menu-submenu-font-size: 16px;
        --dyami-primary-menu-submenu-font-weight: 400;
        --dyami-primary-menu-submenu-color: var(--bs-dark);
        --dyami-primary-menu-submenu-hover-color: var(--dyami-themecolor);
    }

    @media (min-width: 1200px) {
        #header {
            --dyami-header-height: 80px;
            --dyami-header-height-shrink: 80px;
        }
    }


    /* ----------------------------------------------------------------
     * ¼­ºêÆäÀÌÁö ŸÀÌƲ
     -----------------------------------------------------------------*/
    .page-title {
        --dyami-page-title-padding: 6rem;
        --dyami-page-title-font-size: calc(1.4rem + 1.3vw);
        --dyami-page-title-font-weight: 500;
        --dyami-page-title-color: var(--bs-light);
    }

    .page-title .bg-overlay-bg {
        background-color: rgba(var(--dyami-themecolor-rgb), 0.8);
    }

    .page-title-content h1,
    .page-title-content .h1 {
        font-family: var(--dyami-body-font);
    }

    @media (min-width: 1200px) {
        .page-title {
            --dyami-page-title-padding: 5rem;
        }
    }
}