:root {
    --corp-color-primary: #df6d1b;
    --corp-color-secondary: #1c3e70;
    --scale-factor: 1.6;
}

/* 2025-09-23 미래에셋자산운용 리뉴얼 */
#globalBackdrop {
    position: fixed;
    z-index: 1100;
    inset: 0;
    display: none;
    background-color: rgba(43, 43, 43, 0.6);

    &.temp {
        z-index: 1000;
    }
}

#sticky-notice {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    transform: translateY(-100%);
    /* 위로 빼두기 */
    opacity: 0;
    pointer-events: none;
    /* 클릭 막기 */
    transition: transform .25s ease, opacity .25s ease;
    background-color: #000;
}

.admin #sticky-notice {
    position: relative;
}

#main.hasStickyBanner #sticky-notice,
.admin #sticky-notice {
    /* transform: translateY(0); */
    opacity: 1;
    pointer-events: auto;
    transition-delay: 0.1s;
}

#main:not(.hasStickyBanner) #sticky-notice {
    transition-delay: 0s;
}

#main.hasStickyBanner #site-switch {
    top: 49px;
    z-index: 1091;
}

#main.hasStickyBanner #app-header {
    top: 109px;
}

#main.hasStickyBanner #dBody[data-ui-corporate="v1.0"] {
    padding-top: 279px;
}

#main.hasStickyBanner #SearchEmbeded,
#main.hasStickyBanner #MMMMenu {
    top: 229px;
}

/* 헤더/스위치 공통 전환 */
#app-header,
#site-switch {
    transition: transform .35s ease, opacity .35s ease;
    will-change: transform;
}

.layerPopArea {
    z-index: 1011;
}

/* 헤더/스위치 공통 전환 */
#app-header {
    transition: transform 0.35s ease-out, opacity 0.35s ease-out;
    will-change: transform;
}

#site-switch {
    transition: transform 0.35s ease-out, opacity 0.35s ease-out;
    will-change: transform;
    position: relative;
    z-index: 1090;
    border-bottom: 1px solid #ececec;

    &:not(.main) {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
    }
}

/* 내려갈 때 숨김 */
html[data-scrolldir="down"] {
    & .hasStickyBanner #sticky-notice {
        transform: translateY(-100%);
        pointer-events: none;
    }

    & #app-header {
        transform: translateY(-220%);
        pointer-events: none;
    }

    & #site-switch {
        transform: translateY(-210%);
        pointer-events: none;
    }
}

/* 올라갈 때 노출(기본값) */
html[data-scrolldir="up"] {
    & .hasStickyBanner #sticky-notice {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }

    & #app-header {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }

    & #site-switch {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }
}

[data-component="SiteToggle"] {
    &.c-section {
        background-color: #fff;
    }

    & .c-sheet {
        display: flex;
        justify-content: flex-end;
        gap: 0 20px;
        box-sizing: border-box;
        max-width: 1522px;
        margin: 0 auto;
        padding: 0 16px;

        & *,
        & *::before,
        & *::after {
            box-sizing: inherit;
        }

        &>.c-card:only-child {
            flex: 1 0 0;
        }
    }


    .nav {
        display: flex;
        justify-content: flex-end;
        padding: 6px 0 3px;

        &>.each {
            position: relative;
            padding: 0 10px;
        }

        &>.each:not(:first-child) {
            margin-left: 1px;
        }

        &>.each:not(:first-child)::before {
            position: absolute;
            top: 50%;
            left: -1px;
            height: 16px;
            margin-top: -8px;
            border-left: 1px solid #d9d9d9;
            content: '';
        }

        & a {
            font-size: 16px;
            position: relative;
            display: block;
            padding: 13px 24px 13px 52px;
            font-weight: 500;
        }

        & a::before {
            position: absolute;
            top: 50%;
            margin-top: -11px;
            left: 24px;
            width: 22px;
            height: 22px;
            background: no-repeat center;
            background-size: 100% auto;
            content: '';
        }

        & a:link,
        & a:visited {
            color: #474747;
        }

        & a:hover,
        & a:active {
            color: #474747;
        }

        & .tiger-etf a::before {
            background-image: url('/magi/assets/images/icon/site_tiger-etf_default.svg');
        }

        & .tiger-etf.active a::before {
            background-image: url('/magi/assets/images/icon/site_tiger-etf_active.svg');
        }

        & .fund a::before {
            background-image: url('/magi/assets/images/icon/site_fund_default.svg');
        }

        & .fund.active a::before {
            background-image: url('/magi/assets/images/icon/site_fund_active.svg');
        }

        & .active {
            &::after {
                position: absolute;
                right: 10px;
                bottom: -3px;
                left: 10px;
                border-bottom: 4px solid #f58220;
                content: '';
            }

            & a {
                font-weight: 700;
            }

            & a:link,
            & a:visited {
                color: #000;
            }

            & a:hover,
            & a:active {
                color: #000;
            }
        }
    }
}

[data-component="TigerEtfStaticHeader"] {
    & .gnb-list {
        display: flex;
        align-items: flex-start;
        height: 100%;
        align-items: stretch;

        & .gnb-list-cell {
            position: relative;
            z-index: 0;
            font-size: 18px;
            display: flex;
            align-items: center;
            justify-content: center;

            &.actived>.btn-gnb-one-item,
            &.hover>.btn-gnb-one-item,
            &.focus>.btn-gnb-one-item {
                color: #F58220;
            }

            &.hover,
            &.focus {
                z-index: 2;
            }

            &.hover>.snb-wrap,
            &.focus>.snb-wrap {
                opacity: 1;
                transform: translate(0px, 0px);
                visibility: visible;
                transition-delay: 0s;
            }
        }

        & .btn-gnb-one-item {
            display: block;
            padding: 0 30px;
            font-size: 18px;
            color: #043B72;
            font-weight: 700;
            white-space: nowrap;
            transition: color 0.25s ease;

            & span {
                font-size: inherit;
                line-height: inherit;
                display: block;
            }
        }
    }

    /* .snb-wrap {position:absolute; top:100%; left:0; padding-top:10px; margin-left:-10px; display:block;} */
    & .snb-wrap {
        position: absolute;
        top: 100%;
        left: 0;
        margin-left: -10px;
        display: block;
        visibility: hidden;
        transform: translate(0px, 20px);
        opacity: 0;
        transition: opacity 0.25s 0s cubic-bezier(0.250, 0.460, 0.450, 0.940), transform 0.25s 0s cubic-bezier(0.250, 0.460, 0.450, 0.940), visibility 0s 0.25s ease;
    }

    & .snb-list {
        min-width: 246px;
        padding: 29px 30px;
        background-color: #fff;
        box-sizing: border-box;
        box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);

        & li {
            position: relative;

            &.has-3depth {
                &::after {
                    content: "";
                    width: 16px;
                    height: 16px;
                    background: url('/magi/assets/images/common/3depth-ico.svg') no-repeat;
                    display: block;
                    position: absolute;
                    top: 3px;
                    right: 0;
                    transition: all 0.25s ease;
                }

                &:hover::after {
                    content: "";
                    background: url('/magi/assets/images/common/3depth-ico-on.svg') no-repeat;
                }
            }

            &+li {
                margin-top: 16px;
            }

            & a {
                display: block;
                font-size: 16px;
                line-height: 24px;
                color: #001B3C;
                font-weight: 500;
                transition: color 0.25s ease;
            }

            &.actived>a,
            & a:hover {
                color: #e37500;
            }

            & ul {
                position: absolute;
                background: #FFFFFF;
                box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
                width: 240px;
                padding: 30px;
                right: -245px;
                top: -20px;
                box-sizing: border-box;
                display: block;
                visibility: hidden;
                transform: translate(0px, 20px);
                opacity: 0;
                transition: opacity 0.25s 0s cubic-bezier(0.250, 0.460, 0.450, 0.940), transform 0.25s 0s cubic-bezier(0.250, 0.460, 0.450, 0.940), visibility 0s 0.25s ease;
            }

            &.hover>ul,
            &.focus>ul {
                opacity: 1;
                transform: translate(0px, 0);
                visibility: visible;
                transition-delay: 0s;
            }

            &.focus>ul {
                z-index: 2;
            }
        }

        &>li>ul>li+li {
            margin-top: 10px;
        }

        &>li>ul>li>a {
            position: relative;
            display: inline-block;
            padding-left: 12px;
            font-size: 16px;
            line-height: 24px;
            color: #8e8e8e;
            font-weight: 500;
            font-size: 15px;
            color: #001B3C;
            line-height: 22px;
            transition: color 0.25s ease;
        }

        &>li>ul>li>a:hover {
            color: #e37500;
        }
    }

    &.c-section {
        position: relative;
        border-bottom: 1px solid transparent;

        &:not(.main) {
            border-bottom-color: #ececec;
        }
    }

    & .c-sheet {
        display: flex;
        justify-content: space-between;
        align-items: center;
        box-sizing: border-box;
        max-width: 1522px;
        height: 120px;
        margin: 0 auto;
        padding: 27px 16px 20px;

        & h1 a {
            position: relative;
            display: block;
            width: 210px;
            height: 75px;
            transform: translateY(-9px);
        }

        & h1 a::before {
            position: absolute;
            top: 0;
            left: 0;
            display: block;
            width: 100%;
            height: 100%;
            background: url('/magi/assets/images/common/logo_color.svg') center center no-repeat;
            opacity: 1;
            transition: opacity 0.35s ease;
            background-size: contain;
            content: '';
        }

        & h1 a .val {
            position: absolute;
            width: 1px;
            height: 1px;
            margin: -1px;
            clip: rect(0 0 0 0);
            overflow: hidden;
        }

        & .c-sheet *,
        & .c-sheet *::before,
        & .c-sheet *::after {
            box-sizing: inherit;
        }
    }


    & .methods {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: 1fr;
        gap: max(24px, .625vw);

        & .each {
            position: relative;
            width: 28px;
            height: 28px;
            display: block;

            &::before {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: no-repeat center;
                background-size: 100% auto;
                content: '';
            }

            &>.val {
                position: absolute;
                width: 1px;
                height: 1px;
                margin: -1px;
                clip: rect(0 0 0 0);
                overflow: hidden;
            }
        }

        & .profile-wrap {
            position: relative;

            &:hover .profile-bubble {
                opacity: 1;
                visibility: visible;
                transform: translateY(0px);
            }

            & .profile-bubble {
                opacity: 0;
                visibility: hidden;
                position: absolute;
                top: 100%;
                right: -32px;
                padding-top: 9px;
                transform: translateY(10px);
                transition: opacity 0.35s ease, visibility 0.35s ease, transform 0.35s ease;

                & .profile-bubble-inner {
                    display: flex;
                    flex-direction: column;
                    gap: 5px;
                    font-size: 18px;
                    line-height: normal;
                    color: #fff;
                    background: #F58220;
                    padding: 12px 30px;
                    border-radius: 60px;
                    border-bottom: 2px solid #fff;
                    position: relative;

                    &::before {
                        width: 0;
                        height: 0;
                        border-bottom: 8px solid #F58220;
                        border-left: 6px solid transparent;
                        border-right: 6px solid transparent;
                        content: '';
                        position: absolute;
                        bottom: calc(100% - 1px);
                        right: 40px;
                    }

                    & p {
                        white-space: nowrap;
                    }

                    & .btn-logout {
                        display: flex;
                        gap: 5px;
                        align-items: center;
                        font-size: 14px;
                        line-height: normal;
                        font-weight: 400;
                        color: #fff;

                        &::after {
                            content: '';
                            display: block;
                            width: 12px;
                            height: 12px;
                            background: url('/magi/assets/images/icon/icon_arrow_logout.svg') no-repeat center center;
                        }
                    }
                }
            }
        }

        & .profile::before {
            background-image: url('/magi/assets/images/common/header_methods_profile.svg');
        }

        & .search::before {
            background-image: url('/magi/assets/images/common/header_methods_search.svg');
        }

        & .search.active::before {
            background-image: url('/magi/assets/images/common/header_methods_search_active.svg');
        }

        & .menu::before {
            background-image: url('/magi/assets/images/common/header_methods_menu.svg');
        }

        & .close::before {
            background-image: url('/magi/assets/images/common/header_methods_close.svg');
        }
    }

    & .gnb-list .btn-gnb-one-item {
        font-weight: 700;
    }

    & .gnb-list {
        margin-bottom: -1px;
    }

    & .snb-list {
        position: relative;
    }
}

[data-component="SitemapEmbeded"] {
    position: fixed;
    z-index: 1090;
    top: 180px;
    left: 0;
    width: 100%;
    display: none;
    background-color: #fff;

    /* &.c-section {
        position: relative;
    } */

    & .c-sheet {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 0 20px;
        box-sizing: border-box;
        max-width: 1522px;
        margin: 0 auto;
        padding: 0 16px;

        & h1 {
            display: none;
            flex: 0 0 100%;
        }

        &>.c-card:only-child {
            flex: 1 0 0;
        }

        & .c-sheet *,
        & .c-sheet *::before,
        & .c-sheet *::after {
            box-sizing: inherit;
        }
    }

    & .sitemap {
        flex: 1 0 0;
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        grid-template-rows: 1fr;
        gap: 0 34px;
        padding: 60px 30px 67px;

        & h2 {
            margin-bottom: 18px;
            padding: 9px 0 10px;
            border-bottom: 1px solid #ececec;
            color: #000;
            font-weight: 700;
            font-size: 20px;
            line-height: 1.4;
        }
    }

    & .nav {
        &>li {
            &:not(:first-child) {
                margin-top: 14px;
            }

            &>a {
                width: 100%;
                display: flex;
                align-items: center;
                color: #000;
                font-size: 18px;
                line-height: 1.38889;

                &:hover {
                    color: #E37500;
                    text-decoration: underline;
                    text-underline-offset: 4px;
                }
            }

            &.has-child {
                &>a::after {
                    flex: none;
                    width: 18px;
                    height: 18px;
                    margin-left: 6px;
                    background: no-repeat center;
                    background-size: 100% auto;
                    content: '';
                }

                &.collapsed>a::after {
                    background-image: url('/magi/assets/images/common/sitemap_has-child_collapsed.svg');
                }

                &.expanded>a::after {
                    background-image: url('/magi/assets/images/common/sitemap_has-child_expanded.svg');
                }

                &.collapsed>ul {
                    display: none;
                }

                &.expanded>ul {
                    display: block;
                }
            }
        }

        & li.has-3depth.has-child {
            &>a {
                display: flex;
                align-items: center;
                gap: 6px;

                &::after {
                    width: 18px;
                    height: 18px;
                    background-size: 100% auto;
                    background-repeat: no-repeat;
                    background-position: center center;
                    content: '';
                    display: block;
                    flex: none;
                }
            }

            &.collapsed>a::after {
                background: url('/magi/assets/images/common/sitemap_has-3depth-child_collapsed.svg') no-repeat center center;
            }

            &.expanded>a::after {
                background: url('/magi/assets/images/common/sitemap_has-3depth-child_expanded.svg') no-repeat center center;
            }

            &>ul {
                border-top: 1px solid #ECECEC;
                padding: 10px;
                gap: 8px;
                flex-direction: column;

                & li {
                    & a {
                        font-size: 14px;
                        line-height: 1.4;
                    }
                }
            }

            &.collapsed>ul {
                display: none;
            }

            &.expanded>ul {
                display: flex;
            }
        }

        & li {
            line-height: 1.4;
        }

        & ul>li>a {
            display: block;
            color: #757575;
            font-size: 15px;
            line-height: inherit;

            &:hover {
                color: #E37500;
                text-decoration: underline;
                text-underline-offset: 4px;
            }
        }


        & ul {
            margin-top: 12px;

            &>li:not(:first-child) {
                margin-top: 8px;
            }
        }

    }


    & .shortcuts {
        &>.each {
            position: relative;
            display: block;

            &:not(:first-child) {
                margin-top: 18px;
            }
        }


        & .pension {

            & figure {

                & img {
                    width: 100%;
                    height: auto;
                }
            }


            & .val {
                display: block;
                padding: 9px 10px;
                background-color: #043b72;
                color: #fff;
                font-weight: 700;
                font-size: 20px;
                line-height: 1.4;
                text-align: center;
            }
        }


        & .personal {
            width: 270px;
            height: 518px;
            border-radius: 20px;
            background: #FAFAFA;
            padding: 30px;

            & .user-name {
                font-size: 28px;
                font-weight: 400;
                line-height: 140%;
                border-bottom: 1px solid #ECECEC;
                padding-bottom: 20px;

                & strong {
                    font-size: inherit;
                    vertical-align: baseline;
                }

                & span {
                    font-weight: 700;
                }
            }

            & .user-action-list {
                padding: 20px 0 0;
                font-size: 18px;
                font-weight: 700;
                line-height: 140%;

                & em {
                    color: #E37500;
                    margin-left: 6px;
                    vertical-align: baseline;
                }
            }

            & .user-btns {
                display: flex;
                flex-direction: column;
                gap: 10px;
                margin: 30px 0;

                & .btns-cell a {
                    line-height: normal;
                    padding: 12px 0;
                    display: flex;
                    width: 210px;
                    height: 46px;
                    border: 1px solid #e0e0e0;
                    border-radius: 10px;
                    background: #fff;
                    color: #757575;
                    text-align: center;
                    align-items: center;
                    justify-content: center;

                    & .icon {
                        margin-right: 6px;

                        & img {
                            display: block;
                        }
                    }
                }
            }


            & .user-log-info {
                font-size: 12px;
                color: #ABABAB;
                font-weight: 400;
                line-height: 20px;
                margin-top: 20px;
            }

            &.login {

                & .user-name {
                    border-bottom: none;
                    padding-bottom: 0;
                }

                & .title {
                    border-bottom: 1px solid #ECECEC;
                    padding-bottom: 20px
                }

                & .user-action-list {
                    display: flex;
                    flex-direction: column;
                    gap: 20px;
                    justify-content: space-between;
                }
            }

            & .user-certific-info {

                & .btn-user-certific {
                    font-size: 12px;
                    color: #757575;
                    font-weight: 400;
                    line-height: 20px;
                    margin-top: 10px;
                    background: url('/magi/assets/images/icon/icon_info_orange.svg') no-repeat left center;
                    height: 20px;
                    padding-left: 20px;
                }
            }
        }

        & .shortcuts-banner {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 18px;

            & img {
                max-width: 100%;
            }

            & .btns-cell {

                & a {
                    display: flex;
                    color: #5E5E5E;
                    align-items: center;
                    justify-content: center;
                    height: 46px;
                    background-color: #FAFAFA;
                    border: 1px solid #EEEEEE;
                    font-size: 16px;
                    font-weight: 300 !important;
                    line-height: 1.4;
                    gap: 6px;

                    & .icon {
                        width: 26px;
                        height: 26px;
                        display: flex;
                        align-items: center;
                        justify-content: center;

                        & img {
                            display: block;
                        }
                    }
                }
            }
        }
    }
}

[data-component="SearchEmbeded"] {
    position: absolute;
    z-index: 1089;
    top: 180px;
    left: 0;
    width: 100%;

    & .c-sheet {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 0 20px;
        box-sizing: border-box;
        max-width: 1522px;
        margin: 0 auto;
        padding: 0 16px;

        & h1 {
            display: none;
            flex: 0 0 100%;
        }

        &>.c-card:only-child {
            flex: 1 0 0;
        }

        & *,
        & *::before,
        & *::after {
            box-sizing: inherit;
        }

        & input[type=text] {

            &::-webkit-input-placeholder {
                color: #fff;
            }

            &::placeholder {
                color: #fff !important;
            }
        }
    }

    & .c-card {
        & .title {
            color: #fff;
            font-size: 32px;
            font-weight: 700;
            line-height: 1.4;
            letter-spacing: -2px;
        }
    }

    & .form {
        position: relative;
        display: flex;
        align-items: center;

        & .lead {
            position: absolute;
            top: 50%;
            left: 20px;
            width: 42px;
            height: 42px;
            margin-top: -21px;

            &::before {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: url('/magi/assets/images/icon/search-embeded_lead.svg') no-repeat center;
                background-size: 100% auto;
                content: '';
            }

            &::after {
                position: absolute;
                top: -11px;
                left: 7px;
                width: 100%;
                height: 100%;
                background: url('/magi/assets/images/icon/search-embeded_deco.svg') no-repeat center;
                background-size: 100% auto;
                content: '';
            }
        }

        & .guide {
            position: absolute;
            filter: blur(1.5px);
            color: rgba(255, 255, 255, 0.13);
            font-size: 20px;
            font-weight: 400;
            line-height: 1.4;
            user-select: none;
        }

        & input {
            padding-left: 10px;
            appearance: none;
            display: inline-block;
            width: 100%;
            height: 70px;
            padding: 0;
            font-family: 'SpoqaHanSansNeo', sans-serif;
            color: #000;
            font-weight: normal;
            font-size: 18px;
            border: none;
            background-color: transparent;
            outline: none;
            box-sizing: border-box;
            vertical-align: middle;
            border-radius: 0;
        }

        & #typingPlaceholder {
            color: #fff;
            font-family: 'SpoqaHanSansNeo', sans-serif;
            font-size: 24px;
            font-weight: 700;
            line-height: 30px;
            letter-spacing: normal;
            position: absolute;
            top: 50%;
            left: 0;
            z-index: -1;
            transform: translateY(-50%);
        }

        & .btn-header-search-go {
            width: 0;
            height: 0;
            position: absolute;
            overflow: hidden;
        }
    }

    & .hashtags {
        display: flex;
        flex-wrap: wrap;
        gap: 20px 16px;

        &>.each {
            padding: 10px 25px;
            border-radius: 30px;
            border: 2px solid #fff;
            color: #fff;
            font-size: 18px;
            font-weight: 700;
            line-height: 1.4;
        }
    }

    & .guided {
        display: flex;
        align-items: center;
        margin-bottom: 43px;

        & .help {
            position: relative;
            margin-left: 8px;
        }

        & .icon {
            position: relative;
            width: 28px;
            height: 28px;

            &::before {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: url('<c:url value='/assets/images/icon/search-embeded_help.svg' />') no-repeat center;
                background-size: 100% auto;
                content: '';
            }

            & .val {
                position: absolute;
                width: 1px;
                height: 1px;
                margin: -1px;
                clip: rect(0 0 0 0);
                overflow: hidden;
            }
        }

        & .content {
            position: absolute;
            top: 50%;
            left: 100%;
            padding: 13px 19px 11px;
            border-radius: 12px;
            background: #fff;
            box-shadow: 8px 8px 4px 0px rgba(0, 0, 0, 0.05);

            & p {
                color: #e37500;
                font-size: 13px;
                font-weight: 700;
                line-height: 1.4;
                white-space: nowrap;
            }
        }
    }

    & .tabs {
        display: flex;
        align-items: center;
        margin-bottom: 42px;
        border-bottom: 1px solid #e0e0e0;

        & li {
            width: 150px;
            padding-bottom: 26px;
            text-align: center;

            &:not(:first-child) {
                margin-left: 30px;
            }

            &.active {
                margin-bottom: -2px;
                padding-bottom: 24px;
                border-bottom: 6px solid #f58220;
                font-weight: 700;
                font-size: 24px;

                & a {
                    color: #f58220;
                }
            }

            & a {
                color: #000;
                font-size: 24px;
            }
        }
    }

    & .products {
        display: flex;
        gap: max(20px, .625vw);

        &>.each {
            width: 270px;
            height: 396px;
            padding: 38px 22px 40px;
            border: 1px solid #c9c9c9;
            border-radius: 16px;

            & .header {
                display: flex;
                justify-content: space-between;
            }
        }

        & .rank {
            color: #000;
            font-weight: 700;
            font-size: 18px;
            line-height: 1.4;
        }

        & .title {
            margin: 20px 0 4px;
            color: #043b72;
            font-weight: 700;
            font-size: 24px;
            line-height: 1.4;
            text-overflow: ellipsis;
            overflow: hidden;
            word-break: break-word;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        & .code {
            color: #043b72;
            font-size: 11px;
            line-height: 1.4;
        }

        & .type {
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            margin-bottom: 28px;
            margin-left: -10px;

            & span {
                position: relative;
                margin: 0 10px;
                color: #949494;
                font-size: 14px;
                line-height: 1.4;

                &:not(:first-child) {
                    margin-left: 11px;

                    &::before {
                        position: absolute;
                        top: 50%;
                        left: -11px;
                        height: 12px;
                        margin-top: -6px;
                        border-left: 1px solid #c9c9c9;
                        content: '';
                    }
                }
            }
        }

        & .graph {
            margin: 7px 0 20px;
        }
    }

    & .calculation {

        & .this-label {
            color: #949494;
            font-size: 10px;
            line-height: 1.4;
        }

        & .val {
            &.increased span {
                color: #d93b3b;
            }

            &.decreased span {
                color: #245dab;
            }

            & .number {
                font-weight: 500;
                font-size: 28px;
                line-height: 1.4;
            }

            & .unit {
                font-weight: 700;
                font-size: 18px;
            }
        }
    }

    & .prices {
        display: flex;
        margin-top: 22px;

        &>div {
            flex: 0 0 50%;
        }

        & .this-label {
            display: block;
            color: #949494;
            font-size: 11px;
            line-height: 1.4;
        }

        & .val {
            color: #000;
            font-size: 11px;
            line-height: 1.4;
        }
    }

    & .bookmark {
        position: relative;
        width: 32px;
        height: 32px;

        &::before {
            position: absolute;
            top: 0;
            left: 0;
            width: 17px;
            height: 22px;
            background: url('/magi/assets/images/icon/bookmark_default.svg') no-repeat center;
            background-size: 100% auto;
            content: '';
        }

        &.active::before {
            background-image: url('/magi/assets/images/icon/bookmark_active.svg');
        }

        & .val {
            position: absolute;
            width: 1px;
            height: 1px;
            margin: -1px;
            clip: rect(0 0 0 0);
            overflow: hidden;
        }
    }

    & .contents {
        display: flex;
        gap: 0 20px;

        &>.each {
            width: 360px;
            height: 380px;

            & a {
                display: block;
                height: 100%;
                padding: 10px 10px 26px;
                border-radius: 16px;
                border: 1px solid #eee;
                background-color: #fff;
                box-shadow: 8px 8px 8px 0px rgba(194, 194, 194, 0.10);
            }
        }


        & figure {
            position: relative;
            padding-bottom: 55.88235%;

            & div {
                position: absolute;
                inset: 0;
                border-radius: 20px;
                overflow: hidden;
            }

            & img {
                width: 100%;
                height: auto;
                /* object-fit: contain; */
            }
        }

        & .channel {
            position: relative;
            margin: 11px 0 0 21px;
            padding: 0 0 0 34px;
            color: #000;
            font-weight: 700;
            font-size: 20px;
            line-height: 2;
            letter-spacing: -0.72px;

            &::before {
                position: absolute;
                top: 50%;
                left: 0;
                width: 34px;
                height: 34px;
                margin-top: -17px;
                background: no-repeat center;
                background-size: 100% auto;
                content: '';
            }

            &.youtube::before {
                width: 28px;
                background-image: url('/magi/assets/images/common/search-embeded_icon_temp_youtube.png')
            }

            &.instagram::before {
                width: 22px;
                background-image: url('/magi/assets/images/common/search-embeded_icon_temp_instagram.png')
            }
        }

        & .title {
            margin: 0 10px 0 21px;
            color: #000;
            font-weight: 500;
            font-size: 20px;
            line-height: 1.5;
            letter-spacing: -0.4px;
            text-overflow: ellipsis;
            overflow: hidden;
            word-break: break-word;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        & .date {
            margin: 0 10px 0 21px;
            color: #949494;
            font-size: 20px;
            line-height: 2;
        }
    }
}

.layerPopArea {
    position: fixed;
    z-index: 1110;
    top: 50%;
    left: 50%;
    width: 500px;
    /*min-height: 600px;*/
    /* margin: -300px 0 0 -250px; */
    transform: translate(-50%, -50%);
    background-color: #fff;
    color: #000;
    --swiper-pagination-bullet-horizontal-gap: 5px;
    --swiper-pagination-bottom: 0;
    &#subPopWrap{
        min-height:550px;
    }
    .mySwiper {
        /* position: absolute; */
        inset: 0;
        box-sizing: border-box;

        & *,
        & *::before,
        & *::after {
            box-sizing: inherit;
        }
    }

    #mainPop {
        position: relative;

        & .layer-pop-parent {
            /* position: absolute; */
        }
    }


    & .swiper-slide img {
        max-width: 100%;
    }

    & .swiper-pagination {
        position: relative;
        display: flex;
        justify-content: center;
        margin: 20px 0;
        bottom: auto;
    }

    & .swiper-pagination-bullet {
        position: relative;
        width: 8px;
        height: 8px;
        background-color: #cfcfcf;
        border-width: 0;
        border-radius: 4px;
        opacity: 0.5;
        overflow: hidden;
        transition: all 0.35s ease;
        margin: 0 4px;

        & .val {
            width: 8px;
            height: 8px;
        }

        &.swiper-pagination-bullet-active {
            width: calc(max(1rem, 0.8334vw) * (48 / 16));
            opacity: 1;

            & .val {
                content: "";
                position: absolute;
                top: 0;
                left: -4px;
                width: 100%;
                height: 100%;
                background-color: #e37500;
                transform-origin: left;
                transform: translateX(calc(-100% + var(--per, 0)));
                transition: transform 0.1s linear;

                &::before {
                    position: absolute;
                    top: 0;
                    right: -4px;
                    width: 6px;
                    height: 100%;
                    border-top-right-radius: 4px;
                    border-bottom-right-radius: 4px;
                    background-color: #e37500;
                    content: '';
                }
            }
        }
    }

    & #mainPop.pop-up .main-pop-data {
        border-radius: 0;

        & .btn-pop-close {
            position: relative;
        }

        & .swiper-pagination {
            position: relative;
            display: flex;
            justify-content: center;
            margin: 20px 0;
        }

        & .swiper-slide>a {
            height: 100%;
        }
    }

    & .footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 20px;

        & input[type=checkbox] {
            width: 24px;
            height: 24px;
            border: 1px solid #E0E0E0;
            border-radius: 4px;
            appearance: checkbox;
            accent-color: #E37500;

            &:checked {
                background-color: #E37500;
                border-color: #E37500;
            }
        }


        & .close {
            position: relative;
            width: 28px;
            height: 28px;
            vertical-align: top;

            &::before {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: url('/magi/assets/images/main/popup_acu-temp-close.svg') no-repeat center;
                background-size: 100% auto;
                content: '';
            }
        }
    }

    & .btn-pop-close {
        top: auto;
        right: auto;
        background: none;
        font-size: 0;

        & span {
            font-size: 0;
        }
    }

    & .swiper-pagination .swiper-pagination-bullet+.swiper-pagination-bullet {
        margin-left: 0;
    }
}

/* // 2025-09-23 미래에셋자산운용 리뉴얼 */

#app-header {
    position: relative;
    z-index: 1091;
    background-color: #fff;
}

#app-header:not(.main) {
    position: fixed;
    top: 60px;
    right: 0;
    left: 0;
}

#dBody[data-ui-corporate="v1.0"] {
    padding-top: 210px;
    padding-bottom: 3.75rem;
    background-color: #fff;
}

#container {
    padding-bottom: 140px;
    margin: 0 auto;
}

#contents[data-ui-corporate="v1.0"] .board-list-wrap .btn-page-wrap {
    margin-top: 3.75rem;
}

#contents.view[data-ui-corporate="v1.0"] {
    padding-bottom: 3.75rem;
}

.gnb-list .gnb-list-cell.actived>.btn-gnb-one-item {
    color: #043b72;
}

/* Overriding: Main */
.sec3 .tit li .cust-select div.on {
    height: auto;
}

/* // Overriding: Main */

[data-component="Footer"] .footer-wrap {
    padding-bottom: 30px;
    border-top-width: 0;
    background-color: transparent;
}

[data-component="Footer"] .footer-info-date {
    padding-bottom: 0;
    border-bottom-width: 0;
    color: #757575;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.625rem;
}

[data-component="Footer"] .footer-menu {
    margin-top: 60px;
}

[data-component="Footer"] .footer-menu .each a {
    color: #2e2e2e;
    font-weight: 500;
}

[data-component="Footer"] .footer-menu .privacy-policy a:link,
[data-component="Footer"] .footer-menu .privacy-policy a:visited {
    color: #000;
    font-weight: 700;
}

[data-component="Footer"] .footer-menu-list>li:nth-of-type(2)>a {
    color: #2e2e2e;
    font-weight: 500;
}

[data-component="Footer"] .footer-family-site {
    position: relative;
    right: auto;
    bottom: auto;
    width: 247px;
    height: 52px;
    margin: 4px 0;
    border: 1px solid #c9c9c9;
}

[data-component="Footer"] .footer-family-site>a {
    display: block;
    height: 100%;
    padding: 12px 47px 12px 20px;
}

[data-component="Footer"] .footer-family-site>a::after {
    top: 50%;
    right: 20px;
    margin-top: -8px;
}

[data-component="Footer"] .footer-family-site div {
    bottom: 52px;
    width: 246px;
    padding: 30px 21px;
}

[data-component="Footer"].c-section {
    position: relative;
    background-color: #fafafa;
}

[data-component="Footer"] .c-sheet {
    box-sizing: border-box;
    max-width: 1522px;
    margin: 0 auto;
    padding: 0 16px;
}

[data-component="Footer"] .c-sheet *,
[data-component="Footer"] .c-sheet *::before,
[data-component="Footer"] .c-sheet *::after {
    box-sizing: inherit;
}

[data-component="Footer"] .c-sheet>.c-card:only-child {
    flex: 1 0 0;
}

[data-component="Footer"] .footer-address {
    display: flex;
    gap: 0 0.75em;
    margin-top: 0;
    color: #757575;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.57143;
}

[data-component="Footer"] .footer-global {
    position: static;
}

[data-component="Footer"] .related-channel {
    display: flex;
    align-items: center;
    gap: 0 30px;
    padding: 0 30px;
}

[data-component="Footer"] .related-channel .each {
    width: 24px;
    height: 24px;
}

[data-component="Footer"] .related-channel .each a {
    position: relative;
    display: block;
    height: 100%;
}

[data-component="Footer"] .related-channel .each a::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center;
    background-size: 100% auto;
    content: "";
}

[data-component="Footer"] .related-channel .each .val {
    position: absolute;
    overflow: hidden;
    display: block;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

[data-component="Footer"] .related-channel .facebook a::before {
    background-image: url("../images/common/footer_related-channel_facebook.svg");
}

[data-component="Footer"] .related-channel .instagram a::before {
    background-image: url("../images/common/footer_related-channel_instagram.svg");
}

[data-component="Footer"] .related-channel .blog a::before {
    background-image: url("../images/common/footer_related-channel_blog.svg");
}

[data-component="Footer"] .related-channel .youtube a::before {
    background-image: url("../images/common/footer_related-channel_youtube.svg");
}

[data-component="Footer"] .select-language {
    position: relative;
    margin-left: 1px;
    padding: 0 30px;
}

[data-component="Footer"] .select-language::before {
    position: absolute;
    top: 50%;
    left: -1px;
    display: block;
    height: 20px;
    margin-top: -10px;
    border-left: 1px solid #c9c9c9;
    content: "";
}

[data-component="Footer"] .select-language a {
    position: relative;
    display: block;
    width: 27px;
    height: 28px;
}

[data-component="Footer"] .select-language a::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/common/footer_select-language.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

[data-component="Footer"] .select-language a .val {
    position: absolute;
    overflow: hidden;
    display: block;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

#sticky-notice {
    position: relative;
    z-index: 1095;
    background-color: #000;
}

#sticky-notice:not(.main) {
    position: fixed;
    top: 0;
}

/* #sticky-notice .c-sheet { display: flex; justify-content: space-between; align-items: center; max-width:1490px; margin:0 auto; padding: 6px 16px;height:49px; }
#sticky-notice .content { flex: 1 0 0; display: flex; justify-content: flex-start; align-items: center; gap: 0 10px;  color: #fff; }
#sticky-notice .title { color: #fff; font-weight: 700; font-size: 18px; line-height: 24px; vertical-align:middle;}
#sticky-notice .registered { color: #fff; font-size: 16px; line-height: 24px; opacity: 0.5; }
#sticky-notice .close { position: relative; width: 24px; height: 24px; color: #fff; }
#sticky-notice .close::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/sticky-banner_close_temp.svg') no-repeat center; background-size: 100% auto; content: ''; }
#sticky-notice .close .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } */
#sticky-notice+#dHead h1 {
    top: 142px;
}

#sticky-notice+#dHead #gnb {
    top: 65px;
}

.read-table[data-ui-corporate="v1.0"] table>thead {
    border-color: #193d71;
}

.read-table[data-ui-corporate="v1.0"] table>tbody {
    border-color: #d5d8e1;
}

.read-table[data-ui-corporate="v1.0"] table>tbody>tr {
    border-color: #d5d8e1;
}

#contents {
    max-width: 1490px;
}

.wide-container,
#contents.small-container {
    max-width: 1490px;
    margin: 0 auto;
}

.shortcut-to-dps {
    width: 120px;
    padding: 6px 6px;
    text-align: center;
    background-color: #f58220;
    font-size: 15px;
    border-radius: 2px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -0.6px;
}

.shortcut-to-dps:link,
.shortcut-to-dps:visited {
    color: #fff;
}

.shortcut-to-dps:hover,
.shortcut-to-dps:active {
    color: #fff;
}

.page-title {
    color: var(--corp-color-secondary);
    font-weight: 700;
    font-size: 3.375rem;
    line-height: 1.203704;
}

.board-search-wrap:not(.ggg) {
    position: relative;
    width: auto;
    margin: 5rem 0 0;
}

.board-search-wrap:not(.ggg) input {
    height: 56px;
    font-size: 18px;
    font-weight: 400;
    padding: 0 10px;
}

.board-search-wrap:not(.ggg) .form-input-item {
    border-bottom-width: 0;
}

.board-search-wrap:not(.ggg) .form-input-item::after {
    width: 100%;
    height: 4px;
    content: none;
}

.board-search-wrap:not(.ggg) {
    display: flex;
}

.board-search-wrap:not(.ggg) .form-input-item {
    flex: 1 0 0;
    height: 3.75rem;
    border-radius: 2.1875rem;
    background: #1c3e70;
    transition: all 0.5s ease;
}

.board-search-wrap:not(.ggg) .btnDel {
    display: none;
    width: 20px;
    height: 20px;
    font-size: 0;
    line-height: 0;
    text-indent: -99999em;
    background: url(../images/icon/search-local_delete-value.png) no-repeat center center / 15px 15px;
}

.board-search-wrap:not(.ggg) .methods {
    flex: 0 0 3.75rem;
    margin-left: 0.625rem;
    width: 3.75rem;
    height: 3.75rem;
    background: url(../images/icon/search-local_filter_open.png) no-repeat center center;
}

.board-search-wrap:not(.ggg) .form-input-item .form-input {
    width: calc(100% - 130px);
    height: 100%;
    margin: 0 0 0 1.875rem;
    padding: 0 1.5rem 0 0;
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 1.25rem;
    line-height: 2rem;
    outline: 0;
}

.board-search-wrap:not(.ggg) .form-input-item .form-input::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
    font-weight: 500;
}

.board-search-wrap:not(.ggg) .btn-form {
    background-image: url(../images/icon/search-local_submit.png);
}

.board-search-wrap:not(.ggg) .icon-category-orange-36 {
    width: 3.75rem;
    height: 3.75rem;
    background-image: none;
}

.board-list-total .font-color-orange {
    color: inherit;
}

.ui_tabs1 .page-tab {
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-bottom-width: 0;
}

.ui_tabs1 .page-tab li {
    flex: 1 0 50%;
}

.ui_tabs1 .page-tab[data-length="3"] li {
    flex-basis: 33%;
}

.ui_tabs1 .page-tab[data-length="4"] li {
    flex-basis: 25%;
}

.ui_tabs1 .page-tab[data-length="5"] li {
    flex-basis: 20%;
}

.ui_tabs1 .page-tab .tab {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 11rem;
    width: 202px;
    height: 60px;
    margin: 0 0 0 -0.1rem;
    background-color: #edeff3;
    border: 1px solid #c3cad6;
    color: #7e8693;
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
}

.ui_tabs1 .page-tab .tab.actived {
    background: #fff;
    border: 2px solid #1c3e70;
    border-bottom: 2px solid #df6d1b;
    color: #193d71;
    font-weight: 700;
    font-size: 22px;
}

.ui_tabs1 .page-tab .tab {
    width: auto;
    min-width: 0;
}

.ui_tabs1 .page-tab>li+li {
    margin-left: 0;
}

.page-tab>li>a {
    box-sizing: border-box;
}

.page-tab>li>a.actived {
    z-index: 1;
}

.page-tab>li>a.actived:after {
    content: none;
}

[class*="ui_tabs"] li:first-child .tab {
    border-top-left-radius: 6px;
}

[class*="ui_tabs"] li:last-child .tab {
    border-top-right-radius: 6px;
}

.theme-wrap .for-grid {
    grid-template-columns: repeat(5, 1fr);
}

.data-grid-handler {
    display: flex;
    justify-content: space-between;
}

.data-grid-handler .toast-data-group {
    margin-top: 0;
}

.data-grid-handler.sort-left {
    flex: 1 0 0;
}

.data-grid-handler select,
.board-list-total .board-list-sort select {
    z-index: 1;
    position: relative;
    height: 32px;
    padding: 0 20px 0 10px;
    border-bottom-width: 0;
    color: #2b2f36;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    /* background: transparent url(/assets/images/common/select.png) no-repeat 100% center; */
}

.board-list-data[data-ui-corporate="v1.0"] {
    border-top: 1px solid #193d71;
    border-bottom: 1px solid #d5d8e1;
}

.board-list-data[data-ui-corporate="v1.0"] .btn-board-item {
    padding: 3.75rem 1.25rem;
}

.board-list-data[data-ui-corporate="v1.0"] .board-list>li {
    border-color: #d5d8e1;
}

.board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-subject {
    padding-left: 0;
}

.board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-date {
    text-align: right;
}

.board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-subject,
.board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-date {
    color: #000;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.38889;
}

.data-view-sort .data-grid-handler .sort-value::before {
    content: none;
}

.data-grid-handler select:focus-visible,
.data-view-sort .sort-value>select:focus-visible,
.board-list-total .board-list-sort select:focus-visible {
    outline: 2px dashed #245dab;
    outline-offset: 2px;
}

.allotment-wrap .c-data-handler .toast-data-group {
    position: relative;
}

.allotment-wrap .c-data-handler .toast-data-group .toast-pop-data,
.reference-etf-wrap .c-data-handler .toast-data-group .toast-pop-data {
    top: 100%;
    right: 0;
    left: auto;
}

.c-doc-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.c-doc-header .c-form[data-type="query-local"] {
    width: 330px;
}

.c-form[data-type="query-local"] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0 10px;
    padding-bottom: 0.6875rem;
    border-bottom: 2px solid #1c3e70;
}

.c-form[data-type="query-local"] .form-input-item {
    flex: 1 0 0;
    border-bottom-width: 0;
}

.c-form[data-type="query-local"] .form-input-item::after {
    content: none;
}

.c-form[data-type="query-local"] input {
    width: 100%;
    height: 2.625rem;
    color: #1c3e70;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: normal;
}

.c-form[data-type="query-local"] input::placeholder {
    color: #193d71;
}

.c-form[data-type="query-local"] .delete {
    position: absolute;
    top: 50%;
    right: 0;
    display: none;
    width: 24px;
    height: 24px;
    margin-top: -12px;
}

.c-form[data-type="query-local"] .delete::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/icon/search-local_delete-value.png") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.c-form[data-type="query-local"] .submit {
    flex: 0 0 2.125rem;
    position: relative;
    flex: 0 0 34px;
    padding: 0 0 34px;
}

.c-form[data-type="query-local"] .submit::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/icon/search-local_compact_submit.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.c-form[data-type="query-local"] .delete .val,
.c-form[data-type="query-local"] .submit .val {
    position: absolute;
    overflow: hidden;
    display: block;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.c-data-handler {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 30px 0;
}

.c-data-handler .tit+.data-view-sort {
    margin-top: 0;
}

.c-data-handler .board-list-sort.down {
    position: static;
    margin-left: 10px;
}

.c-data-handler .basic-date {
    color: #2b2f36;
    font-size: 14px;
    line-height: 1.4285714;
    letter-spacing: -0.28px;
}

.c-data-handler .btn-question {
    position: relative;
    width: 16px;
    height: 16px;
    margin-left: 5px;
}

.c-data-handler .btn-question::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/icon/datargid_help_default_temp.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.c-data-handler .btn-question.active::before {
    background-image: url("../images/icon/datargid_help_active_temp.svg");
}

.c-data-handler .toast-data-detail {
    position: relative;
}

.c-data-handler .toast-pop-inner {
    z-index: 1;
    position: absolute;
    top: 1.0625rem;
    right: -2rem;
    width: 270px;
    padding: 22px 20px 30px;
    background: #fff;
    border: 1px solid #1c3e70;
    border-radius: 0.1875rem;
}

.c-data-handler .toast-pop-inner .pop-body {
    padding: 0;
}

.c-data-handler .toast-pop-inner .pop-header {
    margin-bottom: 10px;
    padding: 0;
}

.c-data-handler .toast-pop-inner .btn-toast-close {
    top: 0.6875rem;
    right: 0.6875rem;
    width: 14px;
    height: 14px;
    background: none;
}

.c-data-handler .toast-pop-inner .btn-toast-close::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/icon/tooltip_close_14x14_temp.png") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.c-data-handler .toast-pop-inner::after {
    position: absolute;
    top: -0.625rem;
    right: 2.125rem;
    display: block;
    width: 10px;
    height: 10px;
    background: url("../images/icon/bullet_tooltip_pointer.svg") no-repeat center center;
    content: "";
}

.c-data-handler .board-list-total {
    margin-bottom: 0;
}

.c-data-handler .btn-data-inquiry {
    padding: 5px 15px;
    border-width: 0;
    color: #193d71;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.625;
}

.c-data-handler .data-view-sort .sort-value::before {
    content: none;
}

.c-data-handler .data-view-sort .sort-value>select {
    padding: 0 20px 0 10px;
}

.c-data-handler .data-view-sort .sort-value>select:focus-visible {
    border-radius: 0;
}

.c-data-handler button.btn-outline-whitegray:hover,
.c-data-handler button.btn-outline-whitegray.mousedown {
    background-color: transparent;
}

.c-data-handler .form-input-item {
    border-bottom-width: 0;
}

.c-data-handler .basic-select,
.c-data-handler input.datepicker {
    background-image: url("../images/icon/form-select_caret_down.svg");
}

.c-data-attachments {
    margin: 3.75rem 0 4rem;
}

.c-data-attachments .title {
    margin-bottom: 1.875rem;
    color: #000;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: normal;
}

.c-data-attachments ul>.each:not(:first-child) {
    margin-top: 1rem;
}

.c-data-attachments ul>.each a {
    position: relative;
    display: block;
    padding: 1.9375rem 1.25rem;
    border-radius: 10px;
    background: #fafafa;
}

.c-data-attachments ul>.each a::before {
    position: absolute;
    display: block;
    top: 50%;
    right: 1.25rem;
    width: 2.5rem;
    height: 2.5rem;
    margin-top: -1.25rem;
    background: url("../images/icon/board_attachment_download.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.c-data-attachments a {
    color: #2b2f36;
    font-weight: 400;
    font-size: 1.125rem;
    line-height: normal;
}

.allotment-wrap .c-data-handler .board-search-wrap .form-input-item::after,
.theme-wrap .c-data-handler .board-search-wrap .form-input-item::after {
    content: none;
}

.read-table table>thead {
    border-top-color: #707070;
}

.read-table table>tbody {
    border-top-color: #c2c9d5;
}

.read-table table>tbody>tr {
    border-bottom-color: #c2c9d5;
}

.c-data-handler .total-value {
    color: #2b2f36;
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.6;
}

.c-data-handler .total-value .total {
    font-weight: 700;
}

.btn-list-more.btn-round {
    width: 142px;
    height: 69px;
    padding: 0;
    border-width: 0;
    border-radius: 0;
}

.btn-list-more.btn-round:hover {
    background-color: transparent;
}

.btn-list-more.btn-round>span {
    padding: 0 0 44px;
    color: #1c3e70;
    font-size: 20px;
    font-weight: 500;
    line-height: normal;
}

.btn-list-more.btn-round>span em {
    font-weight: inherit;
}

.btn-list-more>span::after {
    top: auto;
    right: auto;
    bottom: 0;
    left: 50%;
    width: 48px;
    height: 24px;
    margin-left: -24px;
    border-width: 0;
    transform: none;
    background: url("../images/icon/datagrid_load-more_caret_down.svg") no-repeat center;
    background-size: 100% auto;
}

.btn-list-more.btn-outline-whitegray.mousedown {
    background-color: transparent;
}

/* CMS Overriding */
.education-define-content {
    border-color: #c9c9c9;
}

/* // CMS Overriding */

/* theme-etf-list */
.theme-etf-list {
    padding-top: calc(3.375rem * var(--scale-factor));
    padding-bottom: 9.6875rem;
    background: #193c70;
}

.theme-etf-list .title-group {
    margin-bottom: 5rem;
}

.theme-etf-list .page-title {
    color: #fff;
    font-size: calc(3.375rem * var(--scale-factor));
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -1.08px;
}

.theme-etf-list .list-theme {
    /* min-width: calc(min(80rem, 56.7376vw)); */
    width: 100%;
    max-width: 1490px;
}

.theme-etf-list .list-theme .flex {
    max-width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.theme-etf-list .list-theme .flex>a {
    display: flex;
    flex-direction: column;
    gap: calc(1.25rem * var(--scale-factor));
    align-items: center;
    justify-content: center;
    position: relative;
    aspect-ratio: 1 / 1;
    background: #fff;
    background-size: 0;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: calc(1.25rem * var(--scale-factor));
    text-align: center;
    transition: all 0.2s ease;
}

.theme-etf-list .list-theme .flex>a:nth-child(2),
.theme-etf-list .list-theme .flex>a:nth-child(4),
.theme-etf-list .list-theme .flex>a:nth-child(5),
.theme-etf-list .list-theme .flex>a:nth-child(7),
.theme-etf-list .list-theme .flex>a:nth-child(10),
.theme-etf-list .list-theme .flex>a:nth-child(12),
.theme-etf-list .list-theme .flex>a:nth-child(13),
.theme-etf-list .list-theme .flex>a:nth-child(15),
.theme-etf-list .list-theme .flex>a:nth-child(18),
.theme-etf-list .list-theme .flex>a:nth-child(20) {
    background-color: #ecf1f9;
}

.theme-etf-list .list-theme .flex>a:nth-child(odd):hover {
    transform: translateY(-10px);
    background-size: 100% 100%;
    background-color: transparent;
    background: linear-gradient(to bottom right, #245a8f, #193d71);
}

.theme-etf-list .list-theme .flex>a:nth-child(even):hover {
    transform: translateY(-10px);
    background-size: 100% 100%;
    background-color: transparent;
    background: linear-gradient(to bottom right, #22678a, #193d71);
}

.theme-etf-list .list-theme .flex>a::after {
    content: "";
    display: none;
    clear: both;
    position: absolute;
    top: 10rem;
    left: 50%;
    transform: translateX(-50%);
    width: 8.4rem;
    height: 8.4rem;
    background-position: center center;
    background-repeat: no-repeat;
}

.theme-etf-list .list-theme .flex>a>i {
    content: "";
    display: block;
    clear: both;
    width: 84px;
    height: 84px;
    background-position: center 0;
    background-repeat: no-repeat;
    /* background-size: 100% 336px; */
    background-size: cover;
}

.theme-etf-list .list-theme .flex>a p {
    width: 100%;
    color: #000;
    text-align: center;
    font-size: calc(1.5rem * var(--scale-factor));
    font-weight: 700;
    line-height: 1.4;
}

.theme-etf-list .list-theme .flex>a:hover * {
    color: #fff;
}

.theme-etf-list .list-theme .flex>a:hover>i {
    /* background-position: center -84px; */
    filter: invert(1);
}

#dBody:has(.theme-etf-list) {
    background: #193c70;
}

/* theme-etf view */
.title-group.visual-topbox {
    border-radius: calc(0.625rem * var(--scale-factor)) calc(0.625rem * var(--scale-factor)) calc(5rem * var(--scale-factor)) calc(0.625rem * var(--scale-factor));
    padding: calc(8.75rem * var(--scale-factor)) calc(5rem * var(--scale-factor));
    display: flex;
    flex-direction: column;
    gap: calc(1.25rem * var(--scale-factor));
    margin-bottom: calc(3.75rem * var(--scale-factor));
}

.title-group.visual-topbox.grd-style-1 {
    background: linear-gradient(95deg, #245a8f 1.01%, #193d71 97.67%);
}

.title-group.visual-topbox h1 {
    color: #b4fcff;
    font-size: calc(1.25rem * var(--scale-factor));
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    /* 28px */
}

.title-group.visual-topbox h2 {
    color: #fff;
    font-size: calc(3.125rem * var(--scale-factor));
    font-weight: 700;
    line-height: 1.6;
}

.theme-etf {}

.theme-etf-slider-wrap {}

.theme-etf-slider {
    padding-inline: calc(3.75rem * var(--scale-factor));
    margin-bottom: calc(5rem * var(--scale-factor));
}

.theme-etf-slider .swiper-button-prev,
.theme-etf-slider .swiper-button-next {
    width: calc(2.5rem * var(--scale-factor));
    height: calc(46px * var(--scale-factor));
    color: rgba(28, 62, 112, 1);
}

.theme-etf-slider .swiper-button-prev {
    left: 0;
}

.theme-etf-slider .swiper-button-next {
    right: 0;
}

.theme-etf-slider .swiper-button-prev::after,
.theme-etf-slider .swiper-button-next::after {
    color: inherit;
}

.theme-etf-slider .swiper-button-disabled,
.theme-etf-slider .swiper-button-lock {
    color: rgba(28, 62, 112, 0.3);
    display: block;
    opacity: 1;
}

.theme-etf-slider .swiper-slide {
    width: calc(10rem * var(--scale-factor));
    height: calc(10rem * var(--scale-factor));
    border: 1px solid transparent;
    border-radius: 10px;
}

.theme-etf-slider .swiper-slide:hover,
.theme-etf-slider .swiper-slide.active {
    border: 1px solid #f58220;
}

.theme-etf-slider .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.theme-etf-slider .swiper-slide a .theme-etf-slider-item {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(1.5625rem * var(--scale-factor));
}

.theme-etf-slider .swiper-slide a img {
    width: calc(3.75rem * var(--scale-factor));
    height: calc(3.75rem * var(--scale-factor));
}

.theme-etf-slider .swiper-slide a p {
    text-align: center;
    color: #193d71;
    font-size: calc(0.875rem * var(--scale-factor));
    font-weight: 500;
}

.theme-etf .active-etf-wrap {}

/* 테마 ETF 상단 검색 */
.theme-etf .board-search-wrap {
    margin-top: 0;
    margin-bottom: calc(3.75rem * var(--scale-factor));
    display: flex;
    gap: calc(1.25rem * var(--scale-factor));
}

.theme-etf .sort-group {
    display: flex;
    align-items: center;
    gap: calc(1.25rem * var(--scale-factor));
}

.theme-etf .sort-group .sort-label {
    color: #2b2f36;
    font-size: calc(0.875rem * var(--scale-factor));
    font-weight: 400;
    line-height: normal;
}

.theme-etf .sort-group .sort-value {
    display: flex;
    gap: calc(1.5rem * var(--scale-factor));
    align-items: center;
}

.theme-etf .sort-group .sort-value::before {
    display: none;
}

.theme-etf .sort-group .sort-value .sort-value-label {
    flex: none;
    color: #2b2f36;
    font-size: calc(1rem * var(--scale-factor));
    font-weight: 500;
    line-height: 1.40387;
}

.theme-etf .sort-group .sort-value select {
    color: #2b2f36;
    font-size: calc(1rem * var(--scale-factor));
    font-weight: 500;
    line-height: normal;
    padding-right: calc(1.6875rem * var(--scale-factor));
    background-image: url(../images/icon/icon_select_arrow_down.svg);
    background-repeat: no-repeat;
    background-position: right center;
    height: auto;
}

.theme-etf .board-search-wrap .search-form {
    display: flex;
    gap: calc(1.25rem * var(--scale-factor));
    flex: 1;
}

.theme-etf .board-search-wrap .search-form .search-form-input {
    display: flex;
    align-items: center;
    flex: 1;
    border-bottom: 2px solid #1c3e70;
    height: calc(3.125rem * var(--scale-factor));
}

.theme-etf .board-search-wrap .search-form .search-form-input input {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    color: #1c3e70;
    font-size: calc(1.25rem * var(--scale-factor));
    font-weight: 400;
    line-height: normal;
}

.theme-etf .board-search-wrap .search-form .search-form-input input::placeholder {
    color: #1c3e70 !important;
}

.theme-etf .board-search-wrap .search-form .search-form-input .btn-search {
    width: calc(2.125rem * var(--scale-factor));
    height: calc(2.125rem * var(--scale-factor));
    background-image: url(../images/icon/icon_board_top_search.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

.theme-etf .board-search-wrap .search-form .search-form-input .btn-search span {
    font-size: 0;
    line-height: 0;
    display: block;
    overflow: hidden;
    margin: -1px;
}

.theme-etf .board-search-wrap .search-form .btn-form-search,
.theme-etf .sort-group .btn_list_srch {
    display: flex;
    padding: calc(0.3125rem * var(--scale-factor)) calc(0.9375rem * var(--scale-factor));
    justify-content: center;
    align-items: center;
    gap: calc(0.625rem * var(--scale-factor));
    align-self: stretch;
    color: #193d71;
    text-align: center;
    font-size: calc(1rem * var(--scale-factor));
    font-weight: 500;
    line-height: 1.625;
}

.theme-etf .board-search-wrap .btn-item {
    margin-left: calc(6.25rem * var(--scale-factor));
    display: flex;
    gap: calc(0.625rem * var(--scale-factor));
    align-items: center;
}

.theme-etf .board-search-wrap .btn-item a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #193d71;
    font-size: calc(0.875rem * var(--scale-factor));
    font-weight: 500;
    line-height: normal;
    border-radius: calc(0.375rem * var(--scale-factor));
    border: 1px solid #c3cad6;
    height: calc(2.25rem * var(--scale-factor));
    padding-inline: calc(0.9375rem * var(--scale-factor));
    gap: calc(0.375rem * var(--scale-factor));
}

.theme-etf .board-search-wrap .btn-item a i.icon-download {
    width: 18px;
    height: 18px;
    background-image: url(../images/icon/icon_download_orange_18.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

/* 테마 ETF 상품 목록 */
.theme-etf .data-view-sort {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(1.875rem * var(--scale-factor));
    margin-bottom: calc(2.5rem * var(--scale-factor));
}

.theme-etf .data-view-sort .sort-top {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(0.75rem * var(--scale-factor));
}

.theme-etf .data-view-sort .total-count {
    color: #2b2f36;
    font-size: calc(1.25rem * var(--scale-factor));
    font-weight: 700;
    line-height: normal;
}

.theme-etf .data-view-sort .toast-data-detail .basic-date {
    color: #2b2f36;
    font-size: calc(0.875rem * var(--scale-factor));
    font-weight: 400;
    line-height: normal;
    align-items: center;
}

.theme-etf .data-view-sort .btn-question {
    background-image: url(../images/icon/icon_help.svg);
    width: calc(1rem * var(--scale-factor));
    height: calc(1rem * var(--scale-factor));
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

.theme-etf .cal-txt {
    display: flex;
    flex-direction: column;
    gap: calc(0.625rem * var(--scale-factor));
    color: #6a7180;
    font-size: calc(0.875rem * var(--scale-factor));
    font-weight: 400;
    line-height: normal;
    margin: 0;
    padding: 0;
    list-style: none;
}

.theme-etf .c-data .c-data-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: calc(5rem * var(--scale-factor));
    padding-inline: calc(1.875rem * var(--scale-factor));
    border-top: 1px solid #193d71;
    border-bottom: 1px solid #d5d8e1;
}

.theme-etf .c-data .c-data-header::before {
    content: none;
    display: none;
}

.theme-etf .c-data .c-data-header .c-data-header-title {
    color: #193d71;
    font-size: calc(1rem * var(--scale-factor));
    font-weight: 500;
    line-height: normal;
    text-align: center;
    flex: 0 1 calc(37.5rem * var(--scale-factor));
}

.theme-etf .c-data .c-data-header .sort-item {
    flex: none;
    display: flex;
    gap: calc(1.875rem * var(--scale-factor));
    align-items: center;
}

.theme-etf .c-data .c-data-header .sort-item button {
    display: flex;
    gap: calc(0.25rem * var(--scale-factor));
    align-items: center;
    color: #7e8693;
    font-size: calc(1rem * var(--scale-factor));
    font-weight: 500;
    line-height: normal;
}

.theme-etf .c-data .c-data-header .sort-item button.actived,
.theme-etf .c-data .c-data-header .sort-item button:hover {
    color: #193d71;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
}

.theme-etf .c-data .c-data-header .sort-item button i.icon-arrow {
    display: block;
    width: calc(1.3125rem * var(--scale-factor));
    height: calc(1.3125rem * var(--scale-factor));
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.5;
    background-image: url(../images/icon/icon-table-sort-default.svg);
}

.theme-etf .c-data .c-data-header .sort-item button.actived i.icon-arrow {
    background-image: url(../images/icon/icon-table-sort-actived.svg);
}

.theme-etf .c-data .c-data-header .sort-item button i.icon-arrow.up {
    transform: rotate(0deg);
}

.theme-etf .c-data .c-data-header .sort-item button i.icon-arrow.down {
    transform: rotate(180deg);
}

.theme-etf .c-data .c-data-header .c-data-header-item {
    flex: 1;
}

.theme-etf .c-data .c-data-header .c-data-header-sort {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: calc(3.75rem * var(--scale-factor));
}

.theme-etf .c-data .c-data-header .sort-toggle {
    display: flex;
    align-items: center;
    gap: calc(1.25rem * var(--scale-factor));
}

.theme-etf .c-data .c-data-header .sort-toggle .sort-label {
    color: #7e8693;
    font-size: calc(0.875rem * var(--scale-factor));
    font-weight: 500;
    line-height: normal;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap {
    display: inline-flex;
    align-items: center;
    height: 30px;
    font-size: 0px;
    border: 1px solid #d2d3d1;
    border-radius: 15px;
    background-color: #fff;
    box-sizing: border-box;
}

.theme-etf .c-data .c-data-header hr {
    display: block;
    width: 1px;
    height: 24px;
    background-color: #c3c9d5;
    border: 0;
    margin: 0;
    flex: none;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle {
    position: relative;
    display: inline-block;
    line-height: 28px;
    vertical-align: top;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(1) {
    padding: 0 12px 0 18px;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(2) {
    padding: 0 18px 0 12px;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle.actived {
    position: relative;
    padding: 0 18px;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle.actived:before {
    content: "";
    position: absolute;
    top: -1px;
    width: 100%;
    height: 30px;
    border-radius: 15px;
    background-color: #e37500;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(1).actived:before {
    left: -1px;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(2).actived:before {
    right: -1px;
}

.theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle.actived span {
    color: #fff;
}

.theme-etf .c-data .c-data-body {}

.theme-etf .c-data .c-data-body .form-circle-box.black .form-check-icon:after {
    background-image: url(../images/icon/icon_form_circle_check_orange_on_24.svg);
}

.theme-etf .c-data .c-data-body .c-data-row {
    display: flex;
    align-items: center;
    gap: calc(2.25rem * var(--scale-factor));
    padding-inline: calc(2.5rem * var(--scale-factor));
    padding-block: calc(3.125rem * var(--scale-factor)) calc(3.75rem * var(--scale-factor));
    border-bottom: 1px solid #d5d8e1;
}

.theme-etf .c-data .c-data-body .c-data-row .c-data-cell {}

.theme-etf .c-data .c-data-cell.methods {
    padding: 0;
    flex: none;
}

.theme-etf .c-data .c-data-cell.rich {
    display: flex;
    flex: 1;
}

.theme-etf .c-data .c-data-cell.year-results {
    flex: 0 0 calc(34.0625rem * var(--scale-factor));
    display: flex;
}

.theme-etf .c-data .c-data-cell .product-summary {}

.theme-etf .c-data .c-data-cell .product-summary {
    flex: 1 0 0;
}

.theme-etf .c-data .product-summary .lead {
    position: relative;
    left: -9px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.theme-etf .c-data .product-summary .category {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-left: -4px;
    gap: 0 1px;
}

.theme-etf .c-data .product-summary .category .each {
    position: relative;
    padding: 0 10px;
    color: #595e6b;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: normal;
}

.theme-etf .c-data .product-summary .category .each:not(:first-child)::before {
    position: absolute;
    top: 50%;
    left: -1px;
    height: 12px;
    margin-top: -6px;
    border-left: 1px solid #d5d8e1;
    content: "";
}

.theme-etf .c-data .product-summary .title {
    margin: 21px 0 10px;
    color: #2b2f36;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: normal;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.theme-etf .c-data .product-summary .code {
    color: #2b2f36;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: normal;
}

.theme-etf .c-data .bookmark {
    position: relative;
    width: 34px;
    height: 34px;
    vertical-align: top;
}

.theme-etf .c-data .bookmark::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_default.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.theme-etf .c-data .bookmark.active::before {
    background-image: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg");
}

.theme-etf .c-data .bookmark .val {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    clip: rect(0 0 0 0);
    overflow: hidden;
}

.theme-etf .c-data .c-pair-group {
    display: flex;
    align-items: center;
    gap: 0 42px;
    margin-top: 60px;
}

.theme-etf .c-data .c-pair {
    display: flex;
    flex-direction: column;
    gap: 9px 0;
}

.theme-etf .c-data .c-pair .key {
    color: #2b2f36;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: normal;
}

.theme-etf .c-data .c-pair .value {
    color: #2b2f36;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: normal;
    display: flex;
    align-items: center;
    height: calc(1.875rem * var(--scale-factor));
}

.theme-etf .c-data .btn-link {
    display: flex;
    align-items: center;
    gap: calc(0.375rem * var(--scale-factor));
    color: #fff;
    font-size: calc(0.8125rem * var(--scale-factor));
    font-weight: 500;
    line-height: normal;
    background-color: #e37500;
    height: calc(1.875rem * var(--scale-factor));
    padding: 0 calc(1rem * var(--scale-factor));
    border-radius: calc(0.375rem * var(--scale-factor));
}

.theme-etf .c-data .btn-link i.icon-link {
    display: block;
    width: calc(1rem * var(--scale-factor));
    height: calc(1rem * var(--scale-factor));
    background-image: url(../images/icon/icon_link_white.svg);
}

.theme-etf .c-data .variations {
    display: flex;
    flex-direction: column;
    gap: calc(2.625rem * var(--scale-factor)) 0;
    width: 100%;
}

.theme-etf .c-data .variations .each {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0 58px;
}

.theme-etf .c-data .variations .each .year {
    color: #2b2f36;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: normal;
}

.theme-etf .c-data .variations .each .group {
    flex: 0 0 185px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.theme-etf .c-data .variations .each .lead {
    color: #2b2f36;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: normal;
}

.theme-etf .c-data .variations .each .variance {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0 2px;
}

.theme-etf .c-data .variations .each .val {
    min-width: calc(3.5rem * var(--scale-factor));
    font-size: 1.25rem;
    text-align: center;
}

.theme-etf .c-data .variations .each .unit {
    font-size: 1rem;
}

.theme-etf .c-data .variance[data-state="increased"] {
    color: #d73e3e;
}

.theme-etf .c-data .variance[data-state="decreased"] {
    color: #145bb3;
}

.theme-etf .c-data .btn-page-wrap .btn-list-more {
    display: flex;
    align-items: center;
    width: auto;
    margin: 0 auto;
}

.theme-etf .c-data-table {
    width: 100%;
    border-top: 1px solid #193d71;
    border-bottom: 1px solid #d5d8e1;
}

.theme-etf .c-data-table th,
.theme-etf .c-data-table td {
    text-align: center;
    vertical-align: middle;
}

.theme-etf .c-data-table th {
    height: 60px;
    font-size: 1rem;
    color: #193d71;
    font-weight: 500;
}

.theme-etf .c-data-table td {
    border-top: 1px solid #d5d8e1;
    font-size: 20px;
    font-weight: 400;
    color: #2b2f36;
    /* padding-inline:15px; */
}

.theme-etf .c-data-table .product-summary {
    text-align: left;
    width: 100%;
    min-width: 460px;
    padding: 30px;
}

.theme-etf .c-data-table .product-summary .c-pair-group {
    display: flex;
    flex-direction: row;
    margin-top: 24px;
}

.theme-etf .c-data-table .product-summary .c-pair-group .c-pair {
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
}

.theme-etf .c-data-table .product-summary .c-pair-group .c-pair .btn-link {
    margin-left: 60px;
}

.theme-etf .c-data-table .btn-sort {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 0;
    width: 100%;
    justify-content: center;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.theme-etf .c-data-table .group-start {
    padding-left: 15px;
}

.theme-etf .c-data-table .group-end {
    padding-right: 15px;
}

.theme-etf .c-data-table .btn-sort:hover,
.theme-etf .c-data-table .btn-sort.actived {
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
}

.theme-etf .c-data-table .icon-arrow {
    display: block;
    width: 21px;
    height: 21px;
    background-image: url(../images/icon/icon-table-sort-default.svg);
}

.theme-etf .c-data-table .btn-sort.actived .icon-arrow {
    background-image: url(../images/icon/icon-table-sort-actived.svg);
}

.theme-etf .c-data-table .icon-arrow.up {
    transform: rotate(0deg);
}

.theme-etf .c-data-table .icon-arrow.down {
    transform: rotate(180deg);
}

.PMEFaqView .c-section {
    position: relative;
    margin-top: 60px;
}

.PMEFaqView .c-sheet {
    box-sizing: border-box;
    max-width: 1522px;
    margin: 0 auto;
    padding: 0 16px;
}

.PMEFaqView .c-sheet *,
.PMEFaqView .c-sheet *::before,
.PMEFaqView .c-sheet *::after {
    box-sizing: inherit;
}

.PMEFaqView .board-view-wrap[data-ui-corporate="v1.0"] .board-view-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 0;
    border-top: 1px solid #1c3e70;
    border-bottom-color: #e0e0e0;
}

.PMEFaqView .board-view-data[data-ui-corporate="v1.0"] {
    color: #000;
    font-size: 1rem;
}

.PMEFaqView .btn-page-wrap[data-ui-corporate="v1.0"] {
    display: flex;
    justify-content: space-between;
    min-height: auto;
}

.PMEFaqView .btn-page-wrap[data-ui-corporate="v1.0"] .c-button:only-child {
    margin-left: auto;
}

.PMEFaqView .c-button.for.page-nav {
    min-width: 6.125rem;
    padding: 0.8125rem;
    border: 1px solid #c3cad6;
    border-radius: 0.3125rem;
    color: #595e6b;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.285714;
    text-align: center;
}

.IMCIntrcnList .c-section {
    position: relative;
    margin-top: 60px;
}

.IMCIntrcnList .c-sheet {
    box-sizing: border-box;
    max-width: 1522px;
    margin: 0 auto;
    padding: 0 16px;
}

.IMCIntrcnList .c-sheet *,
.IMCIntrcnList .c-sheet *::before,
.IMCIntrcnList .c-sheet *::after {
    box-sizing: inherit;
}

.IMCIntrcnList #contents .c-sheet {
    margin: 0 -16px;
}

.IMCIntrcnList .c-card[data-type="article"] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 2.5625rem;
    border: 1px solid #c9c9c9;
    border-radius: 0.3125rem;
}

.IMCIntrcnList .c-card[data-type="article"]:hover {
    border-color: #f58220;
    background-color: #f58220;
}

.IMCIntrcnList .c-card[data-type="article"]:hover .title,
.IMCIntrcnList .c-card[data-type="article"]:hover .channel,
.IMCIntrcnList .c-card[data-type="article"]:hover .registered {
    color: #fff;
}

.IMCIntrcnList .c-card[data-type="article"]:hover .bookmark::before {
    background: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_hover.svg");
}

.IMCIntrcnList .c-card[data-type="article"] .title {
    display: -webkit-box;
    height: 6.1875rem;
    max-height: 6.1875rem;
    font-size: 1.5rem;
    line-height: 2.0625rem;
    font-weight: 500;
    color: #000;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.IMCIntrcnList .c-card[data-type="article"] .c-card-prefix {
    order: -3;
    flex: 1 0 auto;
}

.IMCIntrcnList .c-card[data-type="article"] .c-card-header {
    flex: 0 0 100%;
    margin: 2.5rem 0 1.25rem;
}

.IMCIntrcnList .c-card[data-type="article"] .c-card-content {
    flex: 1 0 auto;
}

.IMCIntrcnList .c-card[data-type="article"] .c-card-methods {
    position: relative;
    right: -1.1875rem;
    order: -1;
    flex: 0 0 34px;
}

.IMCIntrcnList .c-card[data-type="article"] .hashtags {
    display: flex;
    gap: 6px;
    min-height: 2.125rem;
}

.IMCIntrcnList .c-card[data-type="article"] .hashtags>.each {
    padding: 0.3125rem 0.6875rem;
    border: 1px solid #ffb380;
    border-radius: 0.625rem;
    background-color: #fffbf7;
    color: #f58220;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.375;
}

.IMCIntrcnList .c-card[data-type="article"] .channel {
    color: #f58220;
    font-weight: 700;
    font-size: 1.25rem;
}

.IMCIntrcnList .c-card[data-type="article"] .registered {
    margin: 2.5rem 0 -1.25rem;
    padding: 1.9375rem 0 1.875rem;
    border-top: 1px solid #e0e0e0;
    color: #949494;
    font-weight: 500;
    font-size: 1.25rem;
}

.IMCIntrcnList .bookmark {
    position: relative;
    width: 34px;
    height: 34px;
    vertical-align: top;
}

.IMCIntrcnList .bookmark::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_default.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.IMCIntrcnList .bookmark.active::before {
    background-image: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg");
}

.IMCIntrcnList .bookmark .val {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    clip: rect(0 0 0 0);
    overflow: hidden;
}

.IMBRptList .c-section {
    position: relative;
    margin-top: 60px;
}

.IMBRptList .c-sheet {
    box-sizing: border-box;
    max-width: 1522px;
    margin: 0 auto;
    padding: 0 16px;
}

.IMBRptList .c-sheet *,
.IMBRptList .c-sheet *::before,
.IMBRptList .c-sheet *::after {
    box-sizing: inherit;
}

.IMBRptList #contents .c-sheet {
    margin: 0 -16px;
}

.IMBRptList .c-card[data-type="book"] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.IMBRptList .c-card[data-type="book"] .title {
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 500;
    color: #000;
    text-overflow: ellipsis;
    overflow: hidden;
}

.IMBRptList .c-card[data-type="book"] .c-card-prefix {
    flex: 0 0 100%;
    margin-bottom: 0.375rem;
}

.IMBRptList .c-card[data-type="book"] .c-card-header {
    flex: 0 0 100%;
    margin-bottom: 1rem;
}

.IMBRptList .c-card[data-type="book"] .c-card-content {
    flex: 1 0 auto;
    display: flex;
    gap: 0 6px;
}

.IMBRptList .c-card[data-type="book"] .c-card-methods {
    flex: 0 0 34px;
}

.IMBRptList .c-card[data-type="book"] .figure {
    margin-bottom: 1.25rem;
}

.IMBRptList .c-card[data-type="book"] .figure>div {
    position: relative;
    padding-bottom: 491px;
    border-radius: 0.75rem;
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.IMBRptList .c-card[data-type="book"] .figure img {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
}

.IMBRptList .c-card[data-type="book"] .hashtags {
    display: flex;
    gap: 0 5px;
    color: #6f7685;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.375;
    text-overflow: ellipsis;
    overflow: hidden;
}

.IMBRptList .c-card[data-type="book"] .hashtags span {
    white-space: nowrap;
}

.IMBRptList .c-card[data-type="book"] .registered {
    color: #949494;
    font-weight: 500;
    font-size: 0.875rem;
}

.IMBRptList .bookmark {
    position: relative;
    width: 34px;
    height: 34px;
    vertical-align: top;
}

.IMBRptList .bookmark::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_default.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
}

.IMBRptList .bookmark.active::before {
    background-image: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg");
}

.IMBRptList .bookmark .val {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    clip: rect(0 0 0 0);
    overflow: hidden;
}

.education-academy-wrap {
    border-top: 1px solid #193d71;
}

.education-academy-wrap .accordion-list .accordion-cell {
    border-bottom-color: #d5d8e1;
}

.education-academy-wrap .accordion-list .accordion-content {
    border-top-color: #193d71;
}

/* footer */
[data-component="Footer"] #dFoot {
    position: relative;
}

/* #dFoot {position:relative; z-index:5;} */
[data-component="Footer"] .footer-wrap {
    padding: 40px 0 30px;
    font-size: 14px;
    line-height: 22px;
    font-weight: 500;
}

[data-component="Footer"] .footer-logo {
    position: relative;
    width: 170px;
    height: 60px;
}

[data-component="Footer"] .footer-logo>a {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    font-size: 0;
    background: url(../images/common/footer_logo.png) left top no-repeat;
}

[data-component="Footer"] .footer-menu {
    margin-top: 80px;
}

[data-component="Footer"] .footer-menu-list {
    display: flex;
}

[data-component="Footer"] .footer-menu-list>li {
    position: relative;
    padding: 0 20px;
}

[data-component="Footer"] .footer-menu-list>li:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 1px;
    height: 16px;
    margin-top: -8px;
    background-color: #d6d6d6;
}

[data-component="Footer"] .footer-menu-list>li:first-child {
    padding-left: 0;
}

[data-component="Footer"] .footer-menu-list>li:first-child:before {
    display: none;
}

[data-component="Footer"] .footer-menu-list>li>a {
    font-size: 16px;
    font-weight: 500;
    color: #757575;
}

/* [data-component="Footer"] .footer-menu-list > li:nth-of-type(2) > a {font-weight:700; color: #000;} */
[data-component="Footer"] .footer-address {
    line-height: 22px;
    font-size: 14px;
    line-height: 22px;
}

[data-component="Footer"] .footer-info {
    margin-top: 40px;
}

[data-component="Footer"] .footer-info>ul>li {
    position: relative;
    color: #757575;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
}

/* .footer-info > ul > li + li {margin-top:7px;} */
/* .footer-info > ul > li:before {content:'·'; position:absolute; top:0; left:0;} */
[data-component="Footer"] .footer-info-date {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.625;
    padding-bottom: 0;
    font-weight: 400;
}

[data-component="Footer"] .footer-global {
    top: 12px;
    right: 0;
    display: flex;
    align-items: center;
    z-index: 1;
}

[data-component="Footer"] .footer-global .btn-family-toggle {
    display: inline-block;
    font-size: 16px;
    line-height: 26px;
    background: #eeeeee;
    border-radius: 2px;
    padding: 11px 24px;
    font-weight: 500;
    margin-left: 40px;
    border: 1px solid #595959;
}

/* 2024-10-18 */
/* .footer-global .btn-family-toggle {display:inline-block; height:48px; margin-left:40px; width:212px; padding:0; text-align:center; font-size:14px; line-height:46px; color:#3d3935; font-weight:300; background-color:#fff; border-radius:24px; border:1px solid #e5e6e5;} */
[data-component="Footer"] .footer-global .btn-en-view {
    position: absolute;
    top: 48px;
    right: 0;
    display: inline-block;
    width: 212px;
    height: 48px;
    margin-top: 10px;
    padding: 0;
    text-align: center;
    font-size: 14px;
    line-height: 46px;
    color: #3d3935;
    font-weight: 300;
    background-color: #fff;
    border-radius: 24px;
    border: 1px solid #e5e6e5;
}

[data-component="Footer"] .footer-sns-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

[data-component="Footer"] .footer-sns-menu>li>a {
    display: block;
    font-size: 0;
    line-height: 1;
    background-repeat: no-repeat;
    background-position: center center;
}

[data-component="Footer"] .footer-sns-menu>li+li {
    margin-left: 24px;
}

[data-component="Footer"] .footer-sns-menu .btn-footer-sns-wia {
    width: 42px;
    height: 32px;
    background-image: url(../images/icon/icon_footer_sns_wia.png);
}

[data-component="Footer"] .footer-sns-menu .btn-footer-sns-privacy {
    width: 32px;
    height: 32px;
    background-image: url(../images/icon/icon_footer_sns_privacy.png);
}

[data-component="Footer"] .footer-sns-menu .btn-footer-sns-facebook {
    width: 32px;
    height: 32px;
    background-image: url(../images/icon/icon_footer_sns_facebook.png);
}

[data-component="Footer"] .footer-sns-menu .btn-footer-sns-instagram {
    width: 32px;
    height: 32px;
    background: url(../images/icon/icon_footer_sns_instagram.png) no-repeat 50% 60%;
    background-size: 21px;
}

/* 2022-08-29 추가 */
[data-component="Footer"] .footer-sns-menu .btn-footer-sns-naverblog {
    width: 32px;
    height: 32px;
    background-image: url(../images/icon/icon_footer_sns_naverblog.png);
}

[data-component="Footer"] .footer-sns-menu .btn-footer-sns-youtube {
    width: 32px;
    height: 32px;
    background-image: url(../images/icon/icon_footer_sns_youtube.png);
}

[data-component="Footer"] .footer-family-site {
    position: absolute;
    right: 0;
    top: 0;
}

[data-component="Footer"] .footer-family-site>a {
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    padding-right: 22px;
    position: relative;
    transition: color 0.25s ease;
}

[data-component="Footer"] .footer-family-site.on>a {
    color: #e37500;
}

[data-component="Footer"] .footer-family-site>a::after {
    content: "";
    width: 16px;
    height: 16px;
    background: url("../images/icon/footer-arrow-ico.png") no-repeat;
    background-size: contain;
    display: inline-block;
    position: absolute;
    transition: all 0.25s;
}

[data-component="Footer"] .footer-family-site.on>a::after {
    background: url("../images/icon/footer-arrow-ico-on.png") no-repeat;
    background-size: contain;
}

/* [data-component="Footer"] .footer-family-site.on > a::after{transform:rotate(180deg);} */
[data-component="Footer"] .footer-family-site div {
    background: pink;
    width: calc(100% + 2px);
    padding: 30px 20px;
    background: #fff;
    border: 1px solid #c9c9c9;
    position: absolute;
    bottom: 50px;
    right: -1px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s;
    z-index: 11;
}

[data-component="Footer"] .footer-family-site.on div {
    opacity: 1;
    bottom: 50px;
    visibility: visible;
}

[data-component="Footer"] .footer-family-site div a {
    display: block;
    font-weight: 500;
    font-size: 15px;
    line-height: 38px;
    color: #000;
    font-weight: 400;
}

[data-component="Footer"] .footer-family-site div a+a {
    transition: color 0.25s ease;
}

[data-component="Footer"] .footer-family-site div a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
    font-weight: 700;
}

/* 플로팅 버튼 */
[data-component="Footer"] .float {
    position: fixed;
    bottom: 40px;
    right: 70px;
    display: block;
}

[data-component="Footer"] .float.stop-fixed {
    position: absolute !important;
    bottom: unset;
    top: -104px;
}

[data-component="Footer"] .float .go-top {
    width: 60px;
    height: 60px;
    background: url("../images/common/top-ico.svg") no-repeat;
    display: block;
    box-shadow: 0px 16px 16px rgba(0, 0, 0, 0.1);
    border-radius: 100%;
    margin-bottom: 10px;
    opacity: 0;
    transition: all 0.3s;
}

[data-component="Footer"] .float .fab {
    width: 60px;
    height: 60px;
    background: url("../images/common/fab-ico.svg") no-repeat;
    display: block;
    box-shadow: 0px 16px 16px rgba(0, 0, 0, 0.1);
    border-radius: 100%;
}

/* 최근검색/즐겨찾기 레이어팝업 */
[data-component="Footer"] .circle {
    border-radius: 50% 50% 27px 50%;
    width: 0px;
    height: 0px;
    background: #eeeeee;
    position: fixed;
    right: 40px;
    bottom: 40px;
    opacity: 1;
    z-index: 9999999;
}

[data-component="Footer"] .circle.expend {
    width: 130vw;
    height: 130vh;
    border-radius: 0px 0px 27px 0px;
    transition: all 0.5s cubic-bezier(0, 0.995, 0.99, 1);
}

[data-component="Footer"] .fab-bg {
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    display: none;
}

/* .circle.shrink {bottom: unset; right: unset; top: 0; left: -120vw;} */

.fab-layer {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
    display: none;
}

/* .fab-layer {width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.4); position: fixed; top: 0; left: 0; z-index: 9999999;} */
.fab-layer .con-area {
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    border-radius: 0px 0px 27px 0px;
    padding: 100px 0 30px 0;
    box-sizing: border-box;
    display: none;
    position: relative;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    background: #fafafa;
    transition: 1s;
}

/* 2024 웹접근성 */
.fab-layer .con-area::after {
    content: "";
    display: block;
    background: linear-gradient(180deg,
            rgba(250, 250, 250, 0) 0%,
            #fafafa 40.14%);
    width: calc(100% - 420px);
    height: 65px;
    position: absolute;
    bottom: 102px;
    left: 350px;
}

.fab-layer .con-area.on {
    display: flex;
    visibility: visible;
    opacity: 1;
}

/* 2024 웹접근성 */
.fab-layer.on {
    display: block;
}

/* .fab-layer.on .con-area {opacity: 1;} */
.fab-layer .left {
    width: 340px;
    padding-left: 60px;
    box-sizing: border-box;
}

.fab-layer .left .tab {
    opacity: 0;
    transform: translateY(-50px) scale(0.98);
}

.fab-layer .left .tab a {
    display: block;
    color: #001b3c;
    opacity: 0.5;
    font-weight: 500;
}

.fab-layer .left .tab a span:first-of-type {
    font-size: 32px;
    line-height: 45px;
    letter-spacing: -0.006em;
}

.fab-layer .left .tab a span:last-of-type {
    font-size: 15px;
    line-height: 24px;
    transform: translateY(-7px);
    display: inline-block;
}

.fab-layer .left::after {
    content: "";
    background: #e0e0e0;
    display: block;
    width: 1px;
    height: 100vh;
    position: absolute;
    top: 0;
    left: 340px;
}

.fab-layer .left .tab a.on {
    color: #e37500;
    opacity: 1;
    font-weight: 700;
}

.fab-layer .left .tab a+a {
    margin-top: 35px;
}

.fab-layer .right {
    padding-left: 60px;
    width: calc(100% - 340px);
    box-sizing: border-box;
    opacity: 0;
    transform: translateY(-50px) scale(0.98);
}

.fab-layer .right .scrl {
    width: 100%;
    overflow-y: auto;
    height: calc(100% - 100px);
}

.fab-layer .right .scrl ul li {
    display: none;
}

.fab-layer .right .scrl ul li.on {
    display: block;
}

.fab-layer .right .scrl::-webkit-scrollbar {
    width: 8px;
}

.fab-layer .right .scrl::-webkit-scrollbar-track {
    background: #e0e0e0;
    border-radius: 50px;
}

.fab-layer .right .scrl::-webkit-scrollbar-thumb {
    background: #ababab;
    border-radius: 50px;
}

.fab-layer .right .result {
    position: relative;
}

.fab-layer .right .result .own-date {
    position: absolute;
    top: 0;
    right: 120px;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: #000;
    opacity: 0.5;
}

.fab-layer .right .result>div>div {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
    width: calc(100% - 120px);
    padding-bottom: 55px;
}

.fab-layer .right .result>div+div {
    margin-top: 80px;
}

.fab-layer .right .result div>p {
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    color: #1e1e1e;
    margin-bottom: 20px;
}

.fab-layer .right .result div .items {
    position: relative;
    width: 440px;
}

.fab-layer .right .result div .items a {
    background: #ffffff;
    border-radius: 16px;
    width: 100%;
    height: 100%;
    display: block;
    box-sizing: border-box;
    padding: 30px 64px;
    position: relative;
    border: 1px solid #eeeeee;
}

.fab-layer .right .result div .items a .key {
    margin-bottom: 6px;
}

.fab-layer .right .result div .items a .key span {
    display: inline-flex;
    padding: 0 6px;
    border-radius: 4px;
    background: #ffede4;
    font-weight: 400;
    font-size: 12px;
    color: #1a1a1a;
    box-sizing: border-box;
    height: 24px;
    align-items: center;
}

.fab-layer .right .re sult div .items a .key span+span {
    margin-left: 2px;
}

.fab-layer .right .result div .items a .key span.org-bor {
    background: 0;
    border: 1px solid #e37500;
    color: #e37500;
}

.fab-layer .right .result div .items a .key span.red-bor {
    background: 0;
    border: 1px solid #d93b3b;
    color: #d93b3b;
}

.fab-layer .right .result div .items a .tit {
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 28px;
    max-width: calc(100% - 60px);
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.fab-layer .right .result div .items a .per {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.01em;
    color: #d93b3b;
    font-weight: 500;
}

.fab-layer .right .result div .items a .per span {
    margin-left: 2px;
    font-size: 16px;
    line-height: 24px;
    vertical-align: baseline;
}

.fab-layer .right .result div .items a .per.blue {
    color: #145bb3;
}

.fab-layer .right .result div .items a .graph {
    position: absolute;
    right: 20px;
    bottom: 30px;
    width: 160px;
    height: 32px;
}

.fab-layer .right .result div .items a .graph img {
    width: 100%;
}

.fab-layer .right .result div .items a .form-circle-box {
    position: absolute;
    top: 30px;
    left: 20px;
}

.fab-layer .right .result div:nth-of-type(2) .items a {
    padding: 30px;
}

.fab-layer .right .result div .items a .date {
    font-weight: 400;
    font-size: 15px;
    color: #949494;
    line-height: 22px;
    margin-top: 10px;
}

.fab-layer .right .result div .items.thumb .tit {
    width: 184px;
}

.fab-layer .right .result div .items.thumb img {
    position: absolute;
    top: 30px;
    right: 118px;
    width: 78px;
    height: 44px;
    border-radius: 4px;
}

.fab-layer .right .result div .items .util {
    position: absolute;
    right: 20px;
    top: 30px;
}

.fab-layer .right .result div .items .util .heart {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url("../images/main/heart-de.png") no-repeat;
    transition: all 0.2s;
    margin-left: 10px;
    background-size: contain;
}

.fab-layer .right .result div .items .util .heart.on {
    background: url("../images/main/heart-on.png") no-repeat;
    background-size: contain;
}

.fab-layer .right .result div .items .util .btn-item-like {
    vertical-align: inherit;
    margin-left: 8px;
}

.fab-layer .right .result div .items .util .del {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url("../images/icon/ico-24-delete.svg") no-repeat;
    background-size: contain;
}

/* 2024-11-18 */
.fab-layer .right .result div .items .form-circle-box {
    position: absolute;
    top: 30px;
    left: 20px;
}

.fab-layer .xbt {
    display: inline-block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 30px;
    right: 70px;
    opacity: 0;
    transform: scale(0.2);
}

.fab-layer .xbt span {
    width: 28px;
    height: 1.5px;
    background: #000;
    display: block;
    position: absolute;
    top: 50%;
    left: -2px;
    transform: translateY(-50%);
}

.fab-layer .xbt span:nth-of-type(1) {
    transform: rotate(-45deg);
}

.fab-layer .xbt span:nth-of-type(2) {
    transform: rotate(45deg);
}

.fab-layer .noti {
    font-size: 15px;
    line-height: 22px;
    color: #000;
    position: absolute;
    bottom: 30px;
    padding-left: 22px;
    background: #eeeeee;
    padding: 10px 30px 10px 60px;
    width: calc(100% - 275px);
    border-radius: 8px;
    z-index: 2;
}

.fab-layer .noti::before {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../images/icon/icon_note_orange_24.svg) no-repeat center center;
    display: inline-block;
    position: absolute;
    left: 30px;
}

.fab-layer .right .result div .board-list-none {
    width: 100%;
    display: block;
    padding: 50px 0;
}

.fab-layer .go-login {
    text-align: center;
}

.fab-layer .go-login p {
    background: url("../images/icon/ico-login.png") no-repeat top center;
    padding-top: 87px;
    margin-top: 20vh;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}

/* location */
.location-wrap {
    margin-bottom: 30px;
}

.location-list {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 24px;
}

.location-list>li {
    position: relative;
    padding-left: 28px;
    font-size: 15px;
    line-height: 18px;
    color: #757575;
    font-weight: 500;
}

.location-list>li.dark {
    color: #fff;
}

.location-list>li i {}

.location-list>li .icon-home-gray-18 {
    width: 18px;
    height: 18px;
    background-image: url(../images/icon/icon_home_gray_18.svg);
    font-size: 0;
}

.location-list>li.dark .icon-home-gray-18 {
    width: 18px;
    height: 18px;
    background-image: url(../images/icon/icon_home_white_18.svg);
    font-size: 0;
}

.location-list>li:first-child:before {
    display: none;
}

.location-list>li:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    display: block;
    width: 9px;
    height: 14px;
    transform: translateY(-50%);
    background: url(../images/icon/icon_arrow_gray.svg) no-repeat;
}

.location-list>li a {
    display: block;
}

/* .location-list > li:before {content:''; position:absolute; top:50%; left:6px; display:block; width:18px; height:18px; margin-top:-9px; background:url(../images/icon/icon_arrow_gray_18.png) left top no-repeat;} */