@charset "utf-8";

/* SpoqaHanSansNeo */
@font-face {
    font-family: 'Spoqa Han Sans Neo';
    src: url('fonts/SpoqaHanSansNeo-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Spoqa Han Sans Neo';
    src: url('fonts/SpoqaHanSansNeo-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Spoqa Han Sans Neo';
    src: url('fonts/SpoqaHanSansNeo-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, input, textarea, button, select, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video,
::after, ::before {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: middle;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block}
body {line-height: 1}
ol, ul, li {list-style: none}
blockquote,q {quotes: none}
table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}
th, td {vertical-align: middle;}
label, input {cursor: pointer;}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none;}
[type="text"], [type="number"] {
    height: 4.2rem;
    padding: 0 1.4rem;
    border-radius: 0.3rem;
    border: 1px solid #d2d7e1;
}
select {
    z-index: 1;
    position: relative;
    height: 32px;
    padding: 0 10px 0 20px;
    background-color: transparent;
    cursor: pointer;
    -webkit-appearance: auto;
    appearance: auto;
}
select:selected {font-weight: 700;}
select, option {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
}
option:nth-child(even) {background-color: #F8F8F8;}
option:selected {color: red;}
button {
    background: transparent;
    border: none;
    cursor: pointer;
}
a {
    display: inline-block;
    color: inherit;
    text-decoration: none;
}
em {font-style: normal;}
html {
    font-weight: 400;
    font-size: 62.5%;
    font-family: 'Spoqa Han Sans Neo', sans-serif;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    color: #2B2F36;
    word-break: keep-all;
    word-wrap: break-word;
}
html, body {width: 100%; height: 100%;font-size: 10px;
    line-height: 24px;font-family: 'Spoqa Han Sans Neo', sans-serif;-webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: subpixel-antialiased;letter-spacing: normal;}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    
}

/* common button */
.flex-btn-center {padding-top: 4rem; text-align: center; padding-bottom: 3rem;}
/* .btn02_basisH44,
.btn-close,
.btn-identi,
.btn-cancel,
.btn-confir {
    min-width: 9.8rem;
    height: 4.4rem;
    margin: 0 auto;
    padding: 0 18px;
    background: #193D71;
    border-radius: 0.6rem;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
}
.btn-cancel:focus-visible,
.btn-confir:focus-visible{outline:2px dashed red;outline-offset:3px;} */
/* body .btn-identi,
body .ui_btn-basis2 {
    display: block;
    overflow: hidden;
    position: relative;
    width: 300px;
    height: 64px;
    background-color: #193D71;
}
body .btn-cancel {
    background-color: #fff;
    color:#193D71;
    border:1px solid #193D71;
} */


body .btn-identi {min-width: 9.8rem; width: auto; height: 4.4rem;}
body .btn-identi span {font-size: 14px; letter-spacing: 0;}
body a.btn-identi,
body a.ui_btn-basis2 {display: flex; justify-content: center; align-items: center;}

/* 버튼 : 공유&관심  */
.view-social {display: flex; position: absolute; top: 0; right: 0;}
.view-product .view-social {top: -16rem;}
.view-social .btnBookmark {margin-left: 1.2rem;}

.btnBookmark:hover,
.btnBookmark.on {background-image: url('/magi/assets//images/common/icon_favorit_on.png');}

.btnShare,
.btnBookmark {
    width: 3.6rem;
    height: 3.6rem;
    background-repeat: no-repeat;
    background-position: center center;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}

.btnBookmark {background-image: url('/magi/assets//images/common/icon_favorit.png');}

[class*="comm_items"] .item {display: flex;}
[class*="comm_items"] .item > li {
    position: relative;
    width: 330px !important;
    max-width: calc(100% / 4);
    height: auto !important;
    background: #fff;
    border-radius: 24px;
    transition: box-shadow 0.4s ease;
}
[class*="comm_items"] .item > li:hover {
    box-shadow: 0 30px 30px rgba(112, 137, 173, 0.3);
}
[class*="comm_items"] .item > li > a {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
    height: 100%;
    padding: 20px 30px 39px;
}
[class*="comm_items"] .item > li:nth-child(4n) {margin-right: 0;}

[class*="comm_items"] .item > li .lb {display: flex; margin-top: 2rem;}

[class*="comm_items"] .item > li .lb > span {
    position: relative;
    padding: 0 9px 0 9px;
    color: #595E6B;
    font-weight: 400;
    font-size: 1.2rem;
    line-height: 20px;
}
[class*="comm_items"] .item > li .lb > span::after {
    content: '';
    display: block;
    clear: both;
    position: absolute;
    top: 0.6rem; left: 0;
    width: 0.1rem;
    height: 1rem;
    background: #A2AAB8;
}
[class*="comm_items"] .item > li .lb > span:first-child {padding-left: 0;}
[class*="comm_items"] .item > li .lb > span:first-child:after {display: none;}

[class*="comm_items"] .item > li .tit {
    margin: 1.4rem 0 0;
    color: #2B2F36;
    font-weight: 500;
    font-size: 2.0rem;
    line-height: 2.8rem;
}
[class*="comm_items"] .item > li .txt {
    margin: 0.5rem 0 0;
    color: #6F7685;
    font-weight: 500;
    font-size: 1.2rem;
    line-height: 1.8rem;
}
[class*="comm_items"] .item .chart {position: relative; margin: 30px auto 25px;}

[class*="comm_items"] .info {
    display: flex;
    justify-content: right;
    -webkit-justify-content: right;
    flex-wrap: wrap;
    width: 100%;
    margin-top: auto;
}
[class*="comm_items"] .info > li {width: 50%;}
[class*="comm_items"] .info > li em,
[class*="comm_items"] .info > li span {display: block; font-weight: 500;}
[class*="comm_items"] .info > li.rate {width: 100%;}
[class*="comm_items"] .info > li.rate em {
    color: #595E6B;
    font-size: 1.2rem;
    line-height: 20px;
    letter-spacing: 0;
}
[class*="comm_items"] .info > li.rate span {
    font-weight: 700;
    font-size: 4.2rem;
    line-height: 4.8rem;
    white-space: nowrap;
}
[class*="comm_items"] .info > li.rate span.up {color: #D73E3E;}
[class*="comm_items"] .info > li.rate span.down {color: #245DAB;}
[class*="comm_items"] .info > li.rate span.nodata {color: #595E6B; font-weight: 300; font-size: 2.0rem;}
[class*="comm_items"] .info > li.price {padding: 2.3rem 0 0;}
[class*="comm_items"] .info > li.price em {
    color: #757575;
    font-size: 1.3rem;
    line-height: 20px;
    font-weight: 400;
    letter-spacing: 0;
}
[class*="comm_items"] .info > li.price span {
    display: flex;
    align-items: baseline;
    color: #2B2F36;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
}
[class*="comm_items"] .info > li.price span .won {margin-left: 2px; color: #2B2F36; font-size: 14px; letter-spacing: 0;}

caption, .visible, legend {
    position: absolute ;
    overflow: hidden;
    height: 0px;
    width: 0px;
    clip: rect(1px, 1px, 1px, 1px);
    display: block;
}


[class*="ui_tabs"] .tabpanel {margin-top: 5.5rem;}
[class*="ui_tabs"],
[class*="comm_tabs"] {width: 100%; max-width: 1410px; margin: 0 auto;}
[class*="ui_tabs"] .flex {display: flex;}
[class*="comm_tabs"] {position: relative;}
[class*="ui_tabs"] .tab.on,
[class*="comm_tabs"] .tab.on {z-index: 1;}
[class*="ui_tabs"] .tabpanel,
[class*="comm_tabs"] .tabpanel {display: none;}
[class*="ui_tabs"] .tabpanel.on,
[class*="comm_tabs"] .tabpanel.on {display: block;}
[class*="ui_tabs"] .tab:first-child {border-top-left-radius: 6px;}
[class*="ui_tabs"] .tab:last-child {border-top-right-radius: 6px;}

/* modal popup */
/* .modal-popup {
    z-index: 100;
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
}
.modal-popup.on {display: flex;}
.pop-content {
    position: relative;
    width: 90rem;
    max-width: 1410px;
    margin: 0 auto;
    min-height: 800px;
    height: auto;
    max-height: calc(100vh - 100px);
    padding: 32px 40px 60px 40px;
    background: #fff;
    border-radius: 36px;
}

.pop-content .pHead {position: relative;}
.pop-content .pHead::before,
.pop-content .pHead h1::after {
    content: '';
    display: block;
    clear: both;
    position: absolute;
    bottom: 0; left: 0;
    width: 100%;
    height: 0.2rem;
}
.pop-content .pHead::before {background: #193D71;}
.pop-content .pHead h1 {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 0 0 1.8rem;
    color: #1C3E70;
    font-weight: 700;
    font-size: 20px;
    line-height: 32px;
}
.pop-content .pHead h1::after {background: #F58220;}

.pop-content .popupClose {
    position: absolute;
    top: 3rem; right: 3rem;
    width: 3rem;
    height: 3rem;
    background: url('/magi/assets//images/common/btn_close_30x30.png') no-repeat center center;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}

.alert .pop-content {min-width: 450px; width: auto; max-width: 600px; min-height: 200px; padding: 32px 40px 40px 40px; border-radius: 36px;position:relative; box-shadow: 0 30px 30px rgba(0, 0, 0, 0.3);}
.modal-popup .comm-alert {padding: 60px 0 0; text-align: center;}
.modal-popup .comm-alert * {line-height: 30px;} */

/* PICK 인사이트 상세 : Shorts 영상 */
.view-popup {width: 100%; height: 100%; background-color: #F4F6F8;}
.view-popup .popup {
    display: flex;
    justify-content: center;
    position: relative;
    width: 100%;
    max-width: 1490px;
    margin: 0 auto;
    height:100%;
}
.view-popup .box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 2rem; left: 0;
    width: 100%;
}
.view-popup .data {
    margin-right: 3.6rem;
    color: #6F7685;
    font-weight: 500;
    font-size: 18px;
    line-height: 32px;
}
.view-popup .view-social {position: relative; z-index: 10;}
.view-popup .conts {
    overflow: hidden;
    width: 100%;
    margin: 100px auto 0;
    text-align: center;
}
.view-popup .popupClose {
    position: fixed;
    top: 5.3rem; right: 6.3rem;
    width: 4.8rem;
    height: 4.8rem;
    background: url('/magi/assets//images/common/btn_close_48x48.png') no-repeat center center;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}
.pick-view-move {margin: 50px auto 0; text-align: center;}
.pick-view-move a {
    display: inline-block;
    padding: 0 42px 0 0;
    background: url('/magi/assets//images/common/bullt_move.png') no-repeat right center;
    color: #1C3E70;
    font-weight: 500;
    line-height: 28px;
}

.dim {
    position: fixed;
    top: 0; left: 0;
    width:100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
}

/* Fallback loading */
[class*="fall-back-loading-wrap-"] {
    width: 100%;
    height: 20vh;

    display: flex;
    align-items: center;
    justify-content: center;
}

.fallback-dot-loader-container {
    width: 100vw;
    height: 100%;

    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;
}

.fallback-dot-loader-container .dot {
    width: 8px;
    height: 8px;
    background-color: #1C3E70;

    border-radius: 50%;
    margin: 0 5px;
    animation: moveUpDown 1s infinite;
}

.fallback-dot-loader-container .dot:nth-child(2) {
    animation-delay: 0.2s;
}

.fallback-dot-loader-container .dot:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes moveUpDown {
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(10px);
    }
}
.list-pick .grid .grid-item .area .btn.on {
    background: url('/magi/assets//images/common/btn_interest_on.png') no-repeat center center;
}

.channel-box .boxs {
    margin-top: 40px;
    padding: 50px 0 50px;
    background-color: #F4F6F8;
    border-radius: 24px;
    text-align: center;
}
.channel-box .tit-txt {font-size: 36px; line-height: 46px;}
.channel-box .tit-txt strong {
    border-bottom: 1px solid #193D71;
    color: #193D71;
    font-size: 36px;
    line-height: 46px;
    vertical-align: top;
}
.channel-box .txt {margin-top: 20px; font-size: 18px; line-height: 28px;}
.channel-box .tit {margin-top: 60px; font-size: 20px; line-height: 30px; text-align: center;}
.channel-box .list {display: flex; padding-top: 25px;}
.channel-box .list li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(100% / 3);
    height: 50px;
    margin-left: -1px;
    border: 1px solid #D2D7E1;
}
.channel-box .list li span {position: relative; padding-left: 25px;}
.channel-box .list li span::after {
    position: absolute;
    top: 5px;
    left: 0;
    content: "";
    width: 15px;
    height: 6px;
    border-left: 2px solid;
    border-bottom: 2px solid;
    border-color: #f58220;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.channel-box .desc {
    margin: 20px 0 0 14px;
    color: #8C94A3;
    font-size: 14px;
    line-height: 20px;
    text-indent: -14px;
}
.whistle-box {text-align: center;}
.whistle-box h2 {margin: 50px 0 20px; font-size: 20px; line-height: 28px;}
.whistle-box p + p {margin-top: 25px;}
.whistle-box .imgs {margin-top: 40px;}
.channel-box .btn-identi,
.whistle-box .btn-identi {width: 300px;}

.channel-box .btn-identi:focus,
.channel-box .btn-identi:focus-visible,
.whistle-box .btn-identi:focus,
.whistle-box .btn-identi:focus-visible{outline:2px dashed red;outline-offset:3px;}

.legal-wrap {width: 1410px; margin: 0 auto;}
.legal-wrap .sub-tit {padding: 56px 0 30px; font-size: 42px; line-height: 52px;}
.legal-wrap p {font-size: 18px; line-height: 28px;}
.legal-wrap p + p {margin-top: 25px;}

.legal-wrap ol,
.legal-wrap ul {margin-top: 56px;}
.legal-wrap li {margin: 5px 0 0 20px; font-size: 18px; line-height: 28px; text-indent: -20px;}
.legal-wrap li ol,
.legal-wrap li ul {margin: 0; padding: 20px 0;}
.legal-wrap .info > li {position: relative; padding-left: 35px;}
.legal-wrap .info > li::after {
    content: '';
    display: block;
    clear: both;
    position: absolute;
    top: 10px;
    left: 0;
    width: 5px;
    height: 5px;
    background-color: #2B2F36;
    border-radius: 50%;
}
.legal-wrap li a {margin: 0; text-indent: 0;}
.legal-wrap .tbl-wrap {margin-left: -20px; padding: 20px 0 30px;}
.legal-wrap .tbl-wrap table {border-top: 1px solid #193D71; border-bottom: 1px solid #D2D7E1;}
.legal-wrap .tbl-wrap table th,
.legal-wrap .tbl-wrap table td {border-right: 1px solid #D2D7E1; text-align: center;}
.legal-wrap .tbl-wrap table th {height: 60px; font-size: 14px; line-height: 20px; letter-spacing: 0;}
.legal-wrap .tbl-wrap table td {padding: 10px 10px; border-top: 1px solid #D2D7E1; font-size: 18px; line-height: 28px;}
.legal-wrap .tbl-wrap table td * {font-size: 18px; line-height: 28px;}

/* 미디어쿼리 : 푸터 메뉴 START */
@media screen and (max-width: 1024px) {

    #container.util .inContents {padding-top: 60px;}
    .util .comm_txt {width: 100%; padding: 0 21px;}
    .util .comm_txt .tit_sub {font-size: 30px; line-height: 40px;}
    .util .comm_txt .list-bullt > li {padding-left: 15px; text-indent: 0;}
    .util .comm_txt .comm_txt li > ol, .comm_txt li > ul {margin-left: 0;}
    .util .comm_txt .btnBasic {min-height: 36px; height: auto; font-size: 14px; line-height: 20px;}
    .util .comm_txt .title-box .btnBasic {margin: 0; padding-bottom: 8px;}
    .util .comm_txt .link-box .btnBasic {
        width: 100%;
        margin-right: 0;
    }

}
/* 미디어쿼리 : 푸터 메뉴 END */


@media screen and (max-width: 1920px) and (max-height: 1080px) {

    .flex-fee .items {height: auto; padding: 0 0 40px;}

}
footer .buttonTop {
    opacity: 0;
    z-index: 1;
    position: fixed;
    bottom: 30px; right: 30px;
    width: 60px;
    height: 60px;
    background: url('/magi/assets//images/common/btn_top_60x60.png') no-repeat center center;
    font-size: 0;
    line-height: 0;
    text-indent: -99999em;
}
footer .buttonTop.on {opacity: 1;}
#footer.active footer .buttonTop {bottom: 440px;}

/* 이벤트 팝업 */
.popup_event {z-index: 3; position: fixed; top: 50%; right: 2%; transform: translateY(-50%);}
.popup_event .btnView,
.popup_event .btnClose {position: absolute; font-size: 0; line-height: 0; text-indent: -99999em;z-index: 2;}
.popup_event .btnView {top: 0;left: 0;width: 100%;height: 500px;}
.popup_event .btnClose {bottom: 14px;right: 20px;width: 50px;height: 50px;background: url(/magi/assets//images/common/btn_close_40x40.png) no-repeat center center;}
.popup_event .imgs{width:500px;}
.popup_event .imgs img{width:100%;}
.popup_event .popup-cont a:focus-visible{outline-offset:-13px;}
.popup_checked {background:#2B2F36;padding:25px 35px;}
.popup_checked .click {
    color:#fff;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-indent: 0;
    letter-spacing: 0;
}
.popup_checked input {
    width: 20px;
    height: 20px;
    margin-right: 5px;
    background: transparent;
    border: 1px solid #fff;
    border-radius:3px;
}
.popup_checked input:checked {
    /*background: url('/magi/assets//images/common/input_checked_on.png') no-repeat 0 center;*/
    appearance:auto;accent-color: blue;
}

.list-pick {max-width: 100% !important; margin: 0 auto;}
.list-pick a {cursor:pointer}
.list-pick .grid {display: flex; flex-wrap: wrap; margin-top: 100px; background-color: #F4F6F8;}
.list-pick .grid-item {float: left; width: 360px; padding: 15px;}
.list-pick .grid-item > a {display: block !important;}
.list-pick .grid-item img {width: 100%; border-radius: 24px; margin-bottom: 20px;}
.list-pick .grid .grid-item .name {
    color: #2B2F36;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.list-pick .grid .grid-item .area {display: flex; align-items: center; padding-top: 8px;}
.list-pick .grid .grid-item .area .names,
.list-pick .grid .grid-item .area .data {
    margin-right: 12px;
    color: #6F7685;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
}
.list-pick .grid .grid-item .area .btn {
    width: 34px;
    height: 34px;
    margin-left: auto;
    background: url('/magi/assets//images/common/btn_interest.png') no-repeat center center;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}
.list-pick .news {
    display: block;
    position: relative;
    height: 100%;
    padding: 39px 30px 50px;
    background: #fff;
    border-radius: 24px;
}
.list-pick .news::after {
    content: '';
    display: block;
    clear: both;
    position: absolute;
    bottom: 30px; right: 30px;
    width: 22px;
    height: 22px;
    background: url('/magi/assets//images/common/ico_link_22x22.png') no-repeat center center;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}
.list-pick .news > * {width: 100%;}
.list-pick .news .date {
    top: 40px;
    color: #1C3E70;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
}
.list-pick .news .subtit {
    margin-top: 56px;
    color: rgba(28, 62, 112, .3);
    font-weight: 500;
    font-size: 30px;
    line-height: 42px;
}
.list-pick .news .subtxt {
    width: auto;
    height: 108px;
    margin-top: 19px;
    color: #1C3E70;
    font-size: 24px;
    line-height: 36px;
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

#main {overflow-x: hidden; padding-bottom: 0 !important;}
section {position: relative;}
/* .ix-content {position: relative; z-index: 2;} */
/* 메인공통 : 더보기 */
#investment .flex .btn-more,
.notices .flex .btn-more,
.theme-keyword .flex .btn-more {
padding: 0 40px 0 0;
background: url('/magi/assets//images/common/bullt_move.png') no-repeat 100% center;
color: #1C3E70;
font-size: 16px;
line-height: 28px;
}
.theme-keyword .flex .btn-more {margin-left: auto;}
#main section,
#main .ix-content {overflow: visible; }
#main .ix-content {margin-top: 100vh;}

/* section : visual */
#visual .visual {position: fixed; top: 0; left: 0; width: 100%; height: 100vh;}
#overview-dna {
position: absolute;
top: 0; left: 50%;
transform: translateX(-50%);
width: 100%;
height: 100vh;
}
#overview-dna .tabs {display: flex; position: absolute; bottom: 60px; right: 40px; width: 330px;}
#overview-dna .tabs .tab {
width: 160px;
height: 44px;
margin-left: 10px;
background-color: #193D71;
border-radius: 22px;
color: #fff;
font-weight: 700;
letter-spacing: 0;
border:1px solid #16335C;
}
#overview-dna .tabs .tab.on {background-color: #DF6D1B;border-color:#844212;font-size:20px;}
#overview-dna .tabpanel {overflow: hidden; width: 100%; height: 100%; margin: 0;}
#overview-dna .txt_imgs {margin-top: 168px; font-size: 0; line-height: 0; vertical-align: top;}

#overview-dna .txt_imgs .txt,
#overview-dna .txt_imgs .txts {
display: block;
color: #fff;
font-weight: 100;
font-size: 94px;
line-height: 108px;
white-space: nowrap;
    text-shadow: 0 0 8px #00000085;
}
#overview-dna .txt_imgs .txt + .txt {margin: 0 0 0 233px;}
#overview-dna .txt_imgs .txts {margin: 0 0 0 320px; font-weight: 700;}
#overview-dna .txt_imgs .txts + .txts {margin: 0 0 0 233px; color: #F58220;text-shadow: 0 0 8px #00000085;}
#overview-dna .tabpanel.two .txts {margin: 0;}
#overview-dna .flex {display: flex; margin: 35px 0 0 233px;}
#overview-dna .txt_sub {margin-top: 25px; color: #fff; font-weight: 500; font-size: 24px; line-height: 38px; white-space: nowrap;text-shadow: 0 0 8px #00000085;}
#overview-dna .flex .txt_sub {margin-top: 0;}
#overview-dna .flex .btn {margin: 0 0 0 105px;}
#overview-dna .flex .btn span {
display: block;
margin-top: 7px;
color: #fff;
font-weight: 500;
font-size: 14px;
line-height: 24px;
letter-spacing: 1px;
    text-shadow: 0 0 8px #00000085;
}
#overview-dna .btn-go {
margin: 50px 0 0 233px;
padding-right: 45px;
background: url('/magi/assets//images/common/btn_go.png') no-repeat 100% center;
color: #fff;
font-weight: 700;
line-height: 28px;
letter-spacing: 0;
    text-shadow: 0 0 8px #00000085;
}
#overview-dna .tabpanel.two .btn-go {display: flex; justify-content: end; margin: 40px auto 0 0; text-align: right;}
.outcome_box {
position: relative;
width: 100%;
height: 272px;
margin-top: 50px;
background-color: rgba(24, 26, 31, 0.42);
border-radius: 30px;
}
.outcome_box ul {display: flex; padding: 42px 0 60px;}
.outcome_box li {
width: calc(100% / 3);
height: 152px;
border-left: 1px solid rgba(255, 255, 255, 0.3);
text-align: center;
}
.outcome_box > li:first-child {border: 0;}
.outcome_box .divis em {
display: inline-block;
color: #F58220;
font-weight: 700;
font-size: 84px;
line-height: 110px;
}
.outcome_box .divis span {
display: inline-block;
margin: 5px 0 0 5px;
font-weight: 700;
color: #fff;
font-size: 36px;
line-height: 52px;
vertical-align: text-top;
}
.outcome_box .txt {
margin-top: 8px;
color: #fff;
font-weight: 500;
line-height: 22px;
text-align: center;
}
.outcome_box .time {
position: absolute;
bottom: 19px; right: 40px;
color: rgba(255, 255, 255, 0.8);
font-size: 12px;
line-height: 30px;
letter-spacing: 0;
}
.visual .scroll_down {
position: absolute;
bottom: 60px; right: 20px;
width: 19px;
height: 99px;
background: url('/magi/assets//images/common/ico_scroll_down.png') no-repeat center center;
font: 0;
text-indent: -99999em;
}

/* section : FOCUS ISSUE */
.focus-issue {overflow: visible;}
.focus-issue h2,
.focus-issue h2 span {
display: flex;
font-size: 102px;
line-height: 1.5;
letter-spacing: -2px;
}
.focus-issue h2 {width: 100%; max-width: 1410px; margin: 0 auto 0; padding-top: 197px; color: #1C3E70;}
.focus-issue h2 span {margin: 0 0 0 10px; color: #DF6D1B;}
.focus-issue .text {
width: 100%;
max-width: 1410px;
margin: 0 auto;
font-weight: 500;
font-size: 24px;
line-height: 40px;
}
.focus-issue .list {position: relative; margin-top: 124px; padding: 0 0 0; min-height: 600px;}
.focus-issue .list ul {overflow: hidden; margin: 0 auto; padding: 0;}
.focus-issue .list ul li {width: 100%; border-bottom: 1px solid #C3C9D5; font-size: 0; line-height: 0;}
.focus-issue .list ul li:first-child {border-top: 1px solid #C3C9D5;}
.focus-issue .list ul li .flex {
display: flex;
align-items: center;
width: 100%;
max-width: 1410px;
padding: 32px 0 35px;
margin: 0 auto 0;
transition: all 0.5s ease;
}
.focus-issue .list ul li .tit {color: #1C3E70; font-size: 36px; line-height: 46px; width: 800px;}
.focus-issue .list ul li.on .tit {font-size: 48px; line-height: 48px;}
.focus-issue .list ul li .txt {
display: none;
opacity: 0;
margin-top: 16px;
color: #1C3E70;
font-size: 18px;
line-height: 28px;
transition: all 0.3s ease;
width: 800px;
}
.focus-issue .list ul li .btn {
display: none;
opacity: 0;
margin-top: 38px;
padding: 0 40px 0 0;
background: url('/magi/assets//images/common/bullt_move.png') no-repeat 100% center;
color: #1C3E70;
font-size: 16px;
line-height: 28px;
transition: all 0.3s ease;
}
.focus-issue .list ul li .imgs {
display:none;
position: absolute;
top: -64px; right: calc(50% - 705px);
width: 570px;
height: 810px;
transition: all 1s ease;
}
.focus-issue .list ul li .imgs > img {width: 100%; height: 100%; border-radius: 24px;}
.focus-issue .list ul li.on .flex {display: block; margin-top: 54px; padding: 0 0 70px;}
.focus-issue .list ul li.on .txt {opacity: 1; display: block;}
.focus-issue .list ul li.on .btn {opacity: 1; display: inline-block;}
.focus-issue .list ul li.on .imgs {z-index: 2; animation: focusIssue 0.4s ease-out; display: block;}
@keyframes focusIssue {
    from {
        opacity: 0;
        transform: scale(0);
    }
    to {
        z-index: 2;
        opacity: 1;
        transform: scale(1);
    }
}


/* section : THEME & KEYWORD */
section {animation: fade-in-up 800ms 50ms ease both;}
section:nth-child(3).active .ranking {
animation: activeRank 0.5s linear;
}
@keyframes activeRank {
from {
  opacity: 0;
  transform: translateX(-50%);
}
to {
  opacity: 1;
  transform: translateX(0);
}
}
section:nth-child(3).active .chart > li {                  
  animation: activeChart 1s cubic-bezier(0.335, 0.005, 1.000, 0.420) forwards;
  animation-timing-function: linear;
  transform: translateX(-50%);
}
section:nth-child(3).active .chart li:nth-child(1) {animation-delay: 0.2s;}
section:nth-child(3).active .chart li:nth-child(2) {animation-delay: 0.4s;}
section:nth-child(3).active .chart li:nth-child(3) {animation-delay: 0.6s;}

@keyframes activeChart {
  from {
    opacity: 0;
    transform: translateX(-50%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.theme-keyword {padding-top: 250px;}
.theme-keyword .search {
position: relative;
width: 100%;
max-width: 1410px;
margin: 0 auto;
}
.theme-keyword .search .input {
display: flex;
align-items: center;
position: relative;
width: 100%;
height: 100px;
background-color: #1C3E70;
border-radius: 50px;
}
.theme-keyword .search .txtInput {
width: calc(100% - 150px);
height: 100%;
margin: 0 0 0 60px;
padding: 0 24px 0 0;
background: transparent;
border: 0;
color: #fff;
font-size: 36px;
line-height: 42px;
outline: 0;
}
.theme-keyword .search .txtInput::placeholder {color: #fff;}
.theme-keyword .search .buttonDelete {
display: none;
width: 32px;
height: 32px;
background: url('/magi/assets//images/common/btn_delete.png') no-repeat center center / 100% 100%;
color: #fff;
font-size: 0;
text-indent: -9999em;
line-height: 0;
}
.theme-keyword .search .btnSearch {
width: 36px;
height: 36px;
margin: 0 60px 0 10px;
background: url('/magi/assets//images/common/btn_search04.png') no-repeat center center;
font-size: 0;
text-indent: -99999em;
line-height: 0;
}
.theme-keyword .search .keyword {
display: flex;
margin: 20px 0 0 60px;
}
.theme-keyword .search .keyword a, .theme-keyword .search .keyword span {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    margin: 0 10px 0 0;
    padding: 0 30px;
    background-color: #fff;
    border-radius: 20px;
    color: #DF6D1B;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    cursor:pointer;
    border:1px solid #DFE3EB;
}
.layer_autoCmp {
z-index: 2;
position: absolute;
top: 100px; left: 0;
width: 100%;
background-color: #fff;
border-radius: 30px;
}
.layer_autoCmp ul {
padding: 52px 60px;
}
.layer_autoCmp ul > li {
display: flex;
align-items: center;
padding: 8px 0;
color: #707070;
font-size: 18px;
line-height: 24px;
}
.layer_autoCmp ul > li em {
color: #F58220;
font-weight: 700;
font-size: 18px;
line-height: 24px;
}
.theme-keyword .ui_tabs {
width: 100%;
height: 100%;
margin: 110px auto 0;
padding-bottom: 60px;
}
.theme-keyword .ui_tabs .tabs {
display: flex;
justify-content: left;
position: relative;
width: 100%;
column-gap:115px;
}
.theme-keyword .tabs:after {
content: '';
display: block;
clear: both;
position: absolute;
bottom: 0; left: 0;
width: 100%;
border-bottom: 2px solid #1C3E70;
}
.theme-keyword .ui_tabs .tabs .tab {
display: flex;
align-items: end;
background: transparent;
border-bottom: 2px solid transparent;
height: 108px;
padding: 0 0 17px;
}
.theme-keyword .ui_tabs .tabs .tab span {
display: block;
color: #1C3E70;
font-weight: 500;
font-size: 36px;
line-height: 52px;
letter-spacing: -2px;
transition: transform 0.3s ease, font-size 0.3s ease;

}
.theme-keyword .ui_tabs .tabs .tab:hover,
.theme-keyword .ui_tabs .tabs .tab.on {border-bottom: 2px solid #DF6D1B;}
.theme-keyword .ui_tabs .tabs .tab.on {padding: 0 0 15px;}
.theme-keyword .ui_tabs .tabs .tab:hover span {color: #DF6D1B;}
.theme-keyword .ui_tabs .tabs .tab.on span {
color: #DF6D1B;
font-weight: 700;
font-size: 72px;
line-height: 86px;
letter-spacing: -3px;
white-space: nowrap;

}
.theme-keyword .ui_tabs .tabpanel {
display: none;
width: 100%;
margin-top: 0;
opacity: 0;
/*animation: themeTabs 1s cubic-bezier(0.335, 0.005, 1.000, 0.420) forwards;*/
/*animation-timing-function: linear;*/
}
@keyframes themeTabs {
from {
    opacity: 0;
    transform: translateX(-50%);
}
to {
    opacity: 1;
    transform: translateX(0);
}
}
.theme-keyword .ui_tabs .tabpanel.on {
display: block;
opacity: 1;
}
.theme-keyword .ui_tabs .tabpanel .imgs {
padding: 50px 0;
}
.theme-keyword .ui_tabs .tabpanel .imgs img {
width: 950px;
}
.theme-keyword .stit {
color: #1C3E70;
font-weight: 700;
font-size: 7.8rem;
line-height: 8.5rem;
}
.theme-keyword .stxt {
margin-top: 76px;
color: #41464F;
font-size: 30px;
line-height: 42px;
}
.theme-keyword .flex {
justify-content: space-between;
align-items: center;
margin-bottom: 3rem;
}
.stock {
display: flex;
justify-content: space-between;
}
.stock .ranking {margin-top: 100px;}
.stock .ranking > li {
display: flex;
align-items: center;
font-size: 0;
line-height: 0;
}
.stock .ranking > li > a {
display: flex;
align-items: center;
width: 210px;
height: 51px;
margin-right: 150px;
border-top: 1px solid #DFE2EA;
color: #595E6B;
font-weight: 500;
font-size: 16px;
line-height: 40px;
transition: all 0.4s;
}
.stock .ranking > li:first-child > a {border-top: 0;}
.stock .ranking > li > a:hover,
.stock .ranking > li > a.on {
width: 25rem;
margin: 0 130px 0 -20px;
padding: 0 20px;
border-radius: 30px;
border-color: transparent;
background: #DF6D1B;
color: #fff;
}
.stock .ranking > li:hover + li > a {border-color: transparent;}
.theme-keyword .selcted {
display: flex;
justify-content: end;
margin: 0 30px 0 0;
}
.theme-keyword .selcted select {
min-width: 120px;
height: 40px;
padding: 0 50px 0 20px;
background: url('/magi/assets//images/common/bullt_arrow_13x8.png') no-repeat calc(100% - 30px) center;
border-radius: 30px;
border: 1px solid #A2AAB8;
appearance: none;
-webkit-appearance: none;
}
/*.theme-keyword .stock .flex {padding: 0 30px 0 0;}*/
.theme-keyword [class*="comm_items"] {margin-top: 30px; width: 100%;}
.theme-keyword .stock [class*="comm_items"] .item > li {max-width: calc(100% / 3);}
[class*="comm_items"] .item .chart {height: 116px;}

[class*="comm_items"] ul.item {margin-top:3rem; gap: 3rem;}
.theme-keyword .selcted select:focus-visible{outline:2px dashed red;outline-offset:3px;}

    /* section : 투자생활 PICK */
#investment {height: 100%; padding-top: 190px;}
#investment .flex {display: flex; width: 100%; max-width: 1410px; margin: 0 auto;}
#investment .stit {
width: 100%;
max-width: 1410px;
margin: 0 auto;
padding: 0 0 22px;
color: #1C3E70;
font-weight: 700;
font-size: 72px;
line-height: 86px;
}
#investment .stxt {
margin-right: auto;
color: #41464F;
font-weight: 500;
font-size: 24px;
line-height: 32px;
}


/* section : 공시&공지 */
.notices {overflow: hidden;}
.notices .flex {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
width: 100%;
max-width: 1410px;
margin: 150px auto 0;
}
.notices .flex::after {
content: '';
display: block;
clear: both;
position: absolute;
bottom: 0; left: 0;
width: 100vw;
border-bottom: 2px solid #1C3E70;
}
.notices .stit {
padding: 0 0 22px;
color: #1C3E70;
font-weight: 700;
font-size: 72px;
line-height: 86px;
}
.board_notice {
overflow: visible;
width: 100%;
max-width: 1410px;
margin: 0 auto;
}
.board_notice table {
table-layout: fixed;
width: 100%;
}
.board_notice td {
padding: 26px 0 30px;
font-size: 14px;
line-height: 18px;
}
.board_notice td.days {
padding-right: 30px;
text-align: right;
letter-spacing: 0;
}
.board_notice td.title {position: relative;}
.board_notice td.title::after {
content: '';
display: block;
clear: both;
position: absolute;
bottom: 0; left: 0;
width: 100vw;
border-bottom: 1px solid #C3C9D5;
}
.board_notice td.title > a {
display: block;
overflow: hidden;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 30px;
line-height: 42px;
}

.visual {
    background-color: #1b3d70;
}
#main .list-pick .grid {margin: 100px auto 0;}

@media screen and (max-width: 1024px) {

    #overview-dna .txt_imgs .txt, #overview-dna .txt_imgs .txts {font-size: 70px; line-height: 80px;}
    #overview-dna .txt_imgs .txts {margin-left: 239px;}
    #overview-dna .txt_imgs .txts + .txts,
    #overview-dna .txt_imgs .txt + .txt {margin-left: 156px;}
    #overview-dna .flex {flex-direction: column; margin-left: 156px;}
    #overview-dna .btn-go {margin-left: 156px;}
    #overview-dna .flex .btn {margin: 30px 0 0 0;}
  
    .focus-issue .list ul li .tit,
    .focus-issue .list ul li .txt {width: 50%;}
    .focus-issue .list ul li .tit {font-size: 38px; line-height: 48px;}
    .focus-issue .list ul li .flex {padding: 15px 0 20px;}
    .focus-issue .list ul li.on .flex {margin-top: 34px; padding-bottom: 45px;}
    .focus-issue .list ul li .imgs {right: 0; width: 350px; height: auto;}
    #main [class*="comm_items"] ul.item {gap: 0;}
    #main [class*="comm_items"] .item > li {
      width: calc(25% - 10px) !important;
      margin-right: 10px;
    }
    #main [class*="comm_items"] .item > li:last-child {width: 25% !important; margin-right: 0 !important;}
    #main [class*="comm_items"] .item > li > a {padding: 20px 20px 39px;}
    
}
/*
@media screen and (max-width: 800px) {
    #overview-dna .txt_imgs .txt, #overview-dna .txt_imgs .txts {font-size: 50px; line-height: 60px;}
    #overview-dna .txt_imgs .txts + .txts, #overview-dna .txt_imgs .txt + .txt {margin-left: 100px;}
    #overview-dna .txt_imgs .txts {margin-left: 150px;}
    #overview-dna .flex {margin-left: 100px;}
    #overview-dna .txt_sub {font-size: 22px;}
}
*/
@media screen and (max-height: 1024px) {

  /* 해상도 H : 1080 */
  #overview-dna .txt_imgs .txt, 
  #overview-dna .txt_imgs .txts {font-size: 76px; line-height: 82px;}
  #overview-dna .txt_imgs .txt + .txt {margin-left: 244px;}
  #overview-dna .txt_imgs .txts {margin: 0 0 0 355px;}
  #overview-dna .txt_imgs .txts + .txts {margin: 0 0 0 244px;}
  #overview-dna .tabpanel.two .txts + .txts {margin: 0;}
  #overview-dna .txt_sub {margin-top: 25px; font-size: 20px; line-height: 34px;}
  #overview-dna .flex {margin: 30px 0 0 244px;}
  .outcome_box .divis em {font-size: 72px; line-height: 82px;}
  .outcome_box .divis span {font-size: 30px; line-height: 40px;}
  .outcome_box {height: 230px;}
  .focus-issue h2, .focus-issue h2 span {font-size: 90px;}
  .focus-issue h2 {margin-top: 138px;}
  .focus-issue .list {margin-top: 80px;}
  .focus-issue .list ul li .tit {font-size: 42px; line-height: 52px;}
  .focus-issue .list ul li .flex {padding: 26px 0 29px;}
  .focus-issue .list ul li.on .flex {padding: 0 0 60px;}
  .focus-issue .list ul li .imgs {top: -30px; width: 450px; height: 639px;}
  .focus-issue .list ul li .btn {margin-top: 29px;}
  .theme-keyword .search .input {height: 90px;}
  .theme-keyword .search .txtInput {font-size: 30px; line-height: 40;}
  .theme-keyword .ui_tabs .tabs .tab.on span {font-size: 60px; line-height: 70px;}
  .theme-keyword .ui_tabs .tabs .tab span {font-size: 36px; line-height: 46px;}
  .theme-keyword .ui_tabs {margin-top: 40px;}
  .theme-keyword [class*="comm_items"] {position: relative; z-index: 1;}
  .theme-keyword .stxt {margin-top: 37px; font-size: 24px; line-height: 34px;}
  #investment {padding-top: 200px;}
  #investment .stit {font-size: 60px; line-height: 70px;}
  #investment .stxt {font-size: 20px; line-height: 30px;}
  #main .list-pick .grid {margin-top: 60px;}
  .notices .stit {font-size: 60px; line-height: 70px;}
  .notices .board_notice + .flex {margin-top: 90px;}
  .board_notice td.title > a {font-size: 26px; line-height: 36px;}
  .board_notice td {padding: 15px 0 19px;}
}
@media screen and (max-height: 900px) {
    #overview-dna .txt_imgs {margin-top: 150px;}
    #overview-dna .txt_imgs .txt, #overview-dna .txt_imgs .txts {font-size: 60px; line-height: 70px;}
    #overview-dna .txt_sub {font-size: 16px; line-height: 30px;}
    #overview-dna .btn-go {margin: 40px 0 0 244px; }
    #overview-dna .tabs {bottom: 30px;}
}
@media screen and (min-height: 1400px) {
    #overview-dna .tabs {bottom: 300px;}
}

#footer {padding-top: 180px;}
#footer footer {margin: 0;}

.video-caption .conts{
    display:none;
    padding:30px 40px;
    background:#fff;
    border-radius:0 0 12px 12px;
}
.video-caption .tit-wrap{
    font-size:22px;
    padding:30px 40px;
    width:100%;
    background:#EDEFF3;
    color:#2B2F36;
    border-radius:12px;
    cursor: pointer;
    position:relative;
    font-weight:500;
}
.video-caption .tit-wrap .tooltip-layer .btn-click{
    width: 2rem;
    height: 2.2rem;
    margin-left:10px;
}
.video-caption .tit-wrap::after{
    content: '';
    display: block;
    clear: both;
    position: absolute;
    font-size: 0;
    line-height: 0;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: url(../../../magi/assets//mobile/images/common/bullt_plus_40x40.png) no-repeat center center / 120%;
}
.video-caption.on .tit-wrap{
    color:#E27625;
    background-color:#fff;
    border-radius:12px 12px 0 0;
}
.video-caption.on .tit-wrap .tit::after{
    content:'';
    position:absolute;
    bottom:0;
    left: 40px;
    width: 1333px;
    height:1px;
    background:#EDEFF3;
}
.video-caption.on .conts{
    display:block;
}
#short-pop .conts{
    width:fit-content;
    overflow:visible;
    z-index: 11;
}
#short-pop .conts iframe{
    box-shadow:0 40px 30px rgb(112 137 173 / 20%) !important;
}
.video-caption.on > .tit-wrap::after{
    background: url(../../../magi/assets//mobile/images/common/bullt_minus_40x40.png) no-repeat center center;
}
.video-caption + .modal-popup .layer-popup .conts .title{
    margin-top:0;
    font-size:20px;
    line-height:40px;
    font-weight:500;
}
.modal-popup .layer-popup .conts .list-bullet{
    margin-top:20px;
}
.btn-flex{
    display:flex;
    justify-content: center;
    align-items: flex-start;
    max-height:calc(100vh - 100px);
    max-width: 500px;
    margin: 90px 0 0 8px;
    gap: 23rem;
}
.btn-flex .pick-view-move{
    margin:0;
}
.btn-flex .pick-view-caption{
    font-size:16px;
    color:#1C3E70;
}
.btn-flex .tooltip-layer .btn-click{
    width: 1.6rem;
    height: 1.6rem;
    margin: 0 0 0 12px;
    background: url(/magi/assets//images/common/ico_tooltip.png) no-repeat center center;
    font-size: 0;
    text-indent: -999rem;
    line-height: 0;
}
.btn-flex .tooltip-layer.on .btn-click{
    background-image:url(/magi/assets//images/common/ico_tooltip_on.png);
}
.pick-view-caption .video-caption i{
    background:url(../../../magi/assets//images/common/ico_cap.png) no-repeat center center;
    display: inline-block;
    width: 25px;
    height: 25px;
    margin: 0 7px 5px 0;
}
.pick-view-caption .tooltip-layer{
    position:absolute;
}
.pick-view-caption .tooltip-layer .layer{
    display: none;
    z-index: 1;
    position: absolute;
    top: 3.5rem;
    right: -3rem;
    width: 270px;
    padding: 30px 20px 20px;
    background: #fff;
    border: 1px solid #1C3E70;
    border-radius: 0.3rem;
}
.pick-view-caption .tooltip-layer .layer.on{display: block;}

.flex-wrapper{
    display:flex;
    align-items: flex-start;
}
.pop-content.short-caption{
    display:none;
    margin-top:100px;
    border-radius: 0 36px 36px 0;
    max-width:100%;
}
.pop-content.short-caption.on{
    display:block;
    z-index: 10;
    min-height:initial;
}
.pop-content.short-caption.on::before{
    content: '';
    position: absolute;
    width: 50px;
    height: 100%;
    background: #fff;
    top: 0;
    left: -50px;
}
.pop-content .cap-content{
    padding: 40px 0;
    overflow-y:auto;
}
.pop-content.short-caption .popupcls{
    position: absolute;
    top: 0.8rem;
    right: 0;
    width: 2rem;
    height: 2rem;
    background: url(/magi/assets//images/common/btn_close_48x48.png) no-repeat center center / 100%;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}
.tooltip-layer .layer.on .btn-close{
    position: absolute;
    top: 1.1rem;
    right: 1.1rem;
    min-width: 0;
    width: 14px;
    height: 14px;
    margin: 0;
    padding: 0;
    background: url(/magi/assets//images/common/btn_close_14x14.png) no-repeat center center;
    border: 0;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
}
/* 본문 바로가기 */
.skipNav a{z-index:100000; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; overflow:hidden;}
.skipNav a:focus, .skipNav a:active{width:100%;padding:10px 0; height:45px; color:#fff; font-size:1.25em; font-weight:bold; text-align:center; line-height:1.25em;background:#101c3bb3;outline:2px dashed red;outline-offset:2px;}
/* 메인 팝업 슬라이드 */
.slide-popup{
    display:none;
    width:500px;
    height:auto;
    border-radius:35px;
    overflow:hidden;
}
.slide-popup div[class^='swiper-button']{background:url('/magi/assets//images/common/popup_arrow.png') no-repeat center center;width:50px;height:60px;}
.slide-popup .swiper-button-prev{left:0;}
.slide-popup .swiper-button-next{right:0;transform: rotate(180deg);}
.slide-popup div[class^='swiper-button']::after,
.slide-popup div[class^='swiper-button']::before{display:none;}
.slide-popup .swiper-pagination{left: 50%;transform: translateX(-50%);bottom: 90px;}
.slide-popup .swiper-pagination-bullet{margin:0 3px;}
.slide-popup .swiper-pagination-bullet-active{background:#000;opacity:0.8;}