/* ==== reset.css ==== */
.seoulex-root,:where(.seoulex-root) nav,:where(.seoulex-root) p{
    padding: 0;
    margin: 0;
}

:where(.seoulex-root) button{
    padding: 0;
    cursor: pointer;
}

:where(.seoulex-root) ul{
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}

:where(.seoulex-root) h1,:where(.seoulex-root) h2{
    margin: 0;
}

.seoulex-root{
    font-family: "Spoqa Han Sans Neo", sans-serif;
}

:where(.seoulex-root) a{
    text-decoration: none;
    color: inherit;
}

:where(.seoulex-root) div,:where(.seoulex-root) section,:where(.seoulex-root) h1,:where(.seoulex-root) h2,:where(.seoulex-root) h3,:where(.seoulex-root) h4,:where(.seoulex-root) h5,:where(.seoulex-root) h6{
    overflow: hidden;
}




.seoulex-root,.seoulex-root{
    font-weight: normal;
    font-size: 100%;
}

.seoulex-root,.seoulex-root,:where(.seoulex-root) object,:where(.seoulex-root) iframe,:where(.seoulex-root) blockquote,:where(.seoulex-root) pre,:where(.seoulex-root) abbr,:where(.seoulex-root) address,:where(.seoulex-root) cite,:where(.seoulex-root) code,:where(.seoulex-root) del,:where(.seoulex-root) dfn,:where(.seoulex-root) img,:where(.seoulex-root) ins,:where(.seoulex-root) kbd,:where(.seoulex-root) q,:where(.seoulex-root) samp,:where(.seoulex-root) small,:where(.seoulex-root) sub,:where(.seoulex-root) sup,:where(.seoulex-root) var,:where(.seoulex-root) dl,:where(.seoulex-root) dt,:where(.seoulex-root) dd,:where(.seoulex-root) ol,:where(.seoulex-root) ul,:where(.seoulex-root) li,:where(.seoulex-root) fieldset,:where(.seoulex-root) form,:where(.seoulex-root) label,:where(.seoulex-root) legend,:where(.seoulex-root) article,:where(.seoulex-root) aside,:where(.seoulex-root) canvas,:where(.seoulex-root) details,:where(.seoulex-root) figcaption,:where(.seoulex-root) figure,:where(.seoulex-root) footer,:where(.seoulex-root) header,:where(.seoulex-root) hgroup,:where(.seoulex-root) menu,:where(.seoulex-root) nav,:where(.seoulex-root) section,:where(.seoulex-root) summary,:where(.seoulex-root) time,:where(.seoulex-root) mark,:where(.seoulex-root) audio,:where(.seoulex-root) video,:where(.seoulex-root) div,:where(.seoulex-root) h1,:where(.seoulex-root) h2,:where(.seoulex-root) h3,:where(.seoulex-root) h4,:where(.seoulex-root) h5,:where(.seoulex-root) h6,:where(.seoulex-root) b,:where(.seoulex-root) i{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

:where(.seoulex-root) h1,:where(.seoulex-root) h2,:where(.seoulex-root) h3,:where(.seoulex-root) h4,:where(.seoulex-root) h5,:where(.seoulex-root) h6,:where(.seoulex-root) b,:where(.seoulex-root) i,:where(.seoulex-root) th{
    font-size: inherit;
    font-weight: inherit;
}

:where(.seoulex-root) p,:where(.seoulex-root) span{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}

:where(.seoulex-root) article,:where(.seoulex-root) aside,:where(.seoulex-root) details,:where(.seoulex-root) figcaption,:where(.seoulex-root) figure,:where(.seoulex-root) footer,:where(.seoulex-root) header,:where(.seoulex-root) hgroup,:where(.seoulex-root) menu,:where(.seoulex-root) nav,:where(.seoulex-root) section{
    display: block;
}

:where(.seoulex-root) nav ul{
    list-style: none;
}

:where(.seoulex-root) ul{
    list-style-type: none;
}

:where(.seoulex-root) blockquote,:where(.seoulex-root) q{
    quotes: none;
}

:where(.seoulex-root) blockquote:before,:where(.seoulex-root) blockquote:after,:where(.seoulex-root) q:before,:where(.seoulex-root) q:after{
    content: "";
    content: none;
}

:where(.seoulex-root) a{
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
}


:where(.seoulex-root) ins{
    background-color: #ff9;
    color: #000;
    text-decoration: none;
}


:where(.seoulex-root) mark{
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold;
}

:where(.seoulex-root) del{
    text-decoration: line-through;
}

:where(.seoulex-root) abbr[title],:where(.seoulex-root) dfn[title]{
    border-bottom: 1px dotted;
    cursor: help;
}

:where(.seoulex-root) table{
    border-collapse: collapse;
    border-spacing: 0;
}


:where(.seoulex-root) hr{
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
}

:where(.seoulex-root) input{
    padding: 0;
    margin: 0;
}

:where(.seoulex-root) input,:where(.seoulex-root) select{
    vertical-align: middle;
    border-style: none;
}

:where(.seoulex-root) input[type="submit"],:where(.seoulex-root) input[type="button"],:where(.seoulex-root) input[type="reset"]{
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.seoulex-root{
    line-height: 1.5;
    -webkit-text-size-adjust: none;
    
}


@-webkit-keyframes fontfix {
    from {
        opacity: 1;
    }
    to {
        opacity: 1;
    }
}

:where(.seoulex-root) a,:where(.seoulex-root) button,:where(.seoulex-root) input,:where(.seoulex-root) tr{
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

:where(.seoulex-root) select{
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("/static/mobile/images/ic-down.svg");
    background-position: top 50% right 0px;
    background-repeat: no-repeat;
    outline: none;
}


.seoulex-root{
    --color-grayscale-grey100: #333333;
    --color-grayscale-grey-090: #595959;
    --color-grayscale-grey-080: #7e7e7e;
    --color-grayscale-grey-070: #9f9f9f;
    --color-grayscale-grey-060: #bbbbbb;
    --color-grayscale-grey-050: #d0d0d0;
    --color-grayscale-grey-040: #e1e1e1;
    --color-grayscale-grey-030: #ededed;
    --color-grayscale-grey-020: #f6f6f6;
    --color-grayscale-grey-010: #fcfcfc;
    --color-grayscale-grey-005: #fdfdfd;
    --color-pure-wht: #ffffff;
    --color-pure-blk: #000000;
    --color-system-error: #ea1b1a;
    --color-system-info: #3680ff;
    --color-system-success: #4caf50;
    --color-system-warn: #f9a825;
    --color-transaction-buy-active: #b71530;
    --color-transaction-buy-hover: #e73654;
    --color-transaction-buy-default: #d51939;
    --color-transaction-sell-active: #2454a8;
    --color-transaction-sell-default: #2b66cc;
    --color-transaction-sell-hover: #467bd8;
    --color-profit-red: #d51939;
    --color-profit-blue: #2b66cc;
    --color-shinhan-blue: #0065b2;
}

/* ==== normalize-desktop.css ==== */
:where(.seoulex-root) .page-content{
    min-height: 1075px;
}
/* ==== swiper-bundle.min.css ==== */


@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}.seoulex-root{--swiper-theme-color:#007aff}:where(.seoulex-root) .swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}:where(.seoulex-root) .swiper-vertical>.swiper-wrapper{flex-direction:column}:where(.seoulex-root) .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}:where(.seoulex-root) .swiper-android .swiper-slide,:where(.seoulex-root) .swiper-wrapper{transform:translate3d(0px,0,0)}:where(.seoulex-root) .swiper-pointer-events{touch-action:pan-y}:where(.seoulex-root) .swiper-pointer-events.swiper-vertical{touch-action:pan-x}:where(.seoulex-root) .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}:where(.seoulex-root) .swiper-slide-invisible-blank{visibility:hidden}:where(.seoulex-root) .swiper-autoheight,:where(.seoulex-root) .swiper-autoheight .swiper-slide{height:auto}:where(.seoulex-root) .swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}:where(.seoulex-root) .swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}:where(.seoulex-root) .swiper-3d,:where(.seoulex-root) .swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}:where(.seoulex-root) .swiper-3d .swiper-cube-shadow,:where(.seoulex-root) .swiper-3d .swiper-slide,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-right,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-top,:where(.seoulex-root) .swiper-3d .swiper-wrapper{transform-style:preserve-3d}:where(.seoulex-root) .swiper-3d .swiper-slide-shadow,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-right,:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}:where(.seoulex-root) .swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}:where(.seoulex-root) .swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}:where(.seoulex-root) .swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}:where(.seoulex-root) .swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}:where(.seoulex-root) .swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}:where(.seoulex-root) .swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}:where(.seoulex-root) .swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}:where(.seoulex-root) .swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}:where(.seoulex-root) .swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}:where(.seoulex-root) .swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}:where(.seoulex-root) .swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}:where(.seoulex-root) .swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}:where(.seoulex-root) .swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}:where(.seoulex-root) .swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}:where(.seoulex-root) .swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}:where(.seoulex-root) .swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}:where(.seoulex-root) .swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}.seoulex-root{--swiper-navigation-size:44px}:where(.seoulex-root) .swiper-button-next,:where(.seoulex-root) .swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}:where(.seoulex-root) .swiper-button-next.swiper-button-disabled,:where(.seoulex-root) .swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}:where(.seoulex-root) .swiper-button-next.swiper-button-hidden,:where(.seoulex-root) .swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}:where(.seoulex-root) .swiper-navigation-disabled .swiper-button-next,:where(.seoulex-root) .swiper-navigation-disabled .swiper-button-prev{display:none!important}:where(.seoulex-root) .swiper-button-next:after,:where(.seoulex-root) .swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}:where(.seoulex-root) .swiper-button-prev,:where(.seoulex-root) .swiper-rtl .swiper-button-next{left:10px;right:auto}:where(.seoulex-root) .swiper-button-prev:after,:where(.seoulex-root) .swiper-rtl .swiper-button-next:after{content:'prev'}:where(.seoulex-root) .swiper-button-next,:where(.seoulex-root) .swiper-rtl .swiper-button-prev{right:10px;left:auto}:where(.seoulex-root) .swiper-button-next:after,:where(.seoulex-root) .swiper-rtl .swiper-button-prev:after{content:'next'}:where(.seoulex-root) .swiper-button-lock{display:none}:where(.seoulex-root) .swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}:where(.seoulex-root) .swiper-pagination.swiper-pagination-hidden{opacity:0}:where(.seoulex-root) .swiper-pagination-disabled>.swiper-pagination,:where(.seoulex-root) .swiper-pagination.swiper-pagination-disabled{display:none!important}:where(.seoulex-root) .swiper-horizontal>.swiper-pagination-bullets,:where(.seoulex-root) .swiper-pagination-bullets.swiper-pagination-horizontal,:where(.seoulex-root) .swiper-pagination-custom,:where(.seoulex-root) .swiper-pagination-fraction{bottom:10px;left:0;width:100%}:where(.seoulex-root) .swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}:where(.seoulex-root) .swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:50%;background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}:where(.seoulex-root) button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}:where(.seoulex-root) .swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}:where(.seoulex-root) .swiper-pagination-bullet:only-child{display:none!important}:where(.seoulex-root) .swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}:where(.seoulex-root) .swiper-pagination-vertical.swiper-pagination-bullets,:where(.seoulex-root) .swiper-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}:where(.seoulex-root) .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,:where(.seoulex-root) .swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}:where(.seoulex-root) .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,:where(.seoulex-root) .swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}:where(.seoulex-root) .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,:where(.seoulex-root) .swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}:where(.seoulex-root) .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,:where(.seoulex-root) .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}:where(.seoulex-root) .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,:where(.seoulex-root) .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}:where(.seoulex-root) .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,:where(.seoulex-root) .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}:where(.seoulex-root) .swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}:where(.seoulex-root) .swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}:where(.seoulex-root) .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}:where(.seoulex-root) .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}:where(.seoulex-root) .swiper-horizontal>.swiper-pagination-progressbar,:where(.seoulex-root) .swiper-pagination-progressbar.swiper-pagination-horizontal,:where(.seoulex-root) .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,:where(.seoulex-root) .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}:where(.seoulex-root) .swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,:where(.seoulex-root) .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,:where(.seoulex-root) .swiper-pagination-progressbar.swiper-pagination-vertical,:where(.seoulex-root) .swiper-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}:where(.seoulex-root) .swiper-pagination-lock{display:none}:where(.seoulex-root) .swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}:where(.seoulex-root) .swiper-scrollbar-disabled>.swiper-scrollbar,:where(.seoulex-root) .swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}:where(.seoulex-root) .swiper-horizontal>.swiper-scrollbar,:where(.seoulex-root) .swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}:where(.seoulex-root) .swiper-scrollbar.swiper-scrollbar-vertical,:where(.seoulex-root) .swiper-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}:where(.seoulex-root) .swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}:where(.seoulex-root) .swiper-scrollbar-cursor-drag{cursor:move}:where(.seoulex-root) .swiper-scrollbar-lock{display:none}:where(.seoulex-root) .swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}:where(.seoulex-root) .swiper-zoom-container>canvas,:where(.seoulex-root) .swiper-zoom-container>img,:where(.seoulex-root) .swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}:where(.seoulex-root) .swiper-slide-zoomed{cursor:move}:where(.seoulex-root) .swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}:where(.seoulex-root) .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,:where(.seoulex-root) .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}:where(.seoulex-root) .swiper-lazy-preloader-white{--swiper-preloader-color:#fff}:where(.seoulex-root) .swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:where(.seoulex-root) .swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}:where(.seoulex-root) .swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}:where(.seoulex-root) .swiper-grid>.swiper-wrapper{flex-wrap:wrap}:where(.seoulex-root) .swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}:where(.seoulex-root) .swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}:where(.seoulex-root) .swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}:where(.seoulex-root) .swiper-fade .swiper-slide .swiper-slide{pointer-events:none}:where(.seoulex-root) .swiper-fade .swiper-slide-active,:where(.seoulex-root) .swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}:where(.seoulex-root) .swiper-cube{overflow:visible}:where(.seoulex-root) .swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}:where(.seoulex-root) .swiper-cube .swiper-slide .swiper-slide{pointer-events:none}:where(.seoulex-root) .swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}:where(.seoulex-root) .swiper-cube .swiper-slide-active,:where(.seoulex-root) .swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}:where(.seoulex-root) .swiper-cube .swiper-slide-active,:where(.seoulex-root) .swiper-cube .swiper-slide-next,:where(.seoulex-root) .swiper-cube .swiper-slide-next+.swiper-slide,:where(.seoulex-root) .swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}:where(.seoulex-root) .swiper-cube .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-cube .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-cube .swiper-slide-shadow-right,:where(.seoulex-root) .swiper-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}:where(.seoulex-root) .swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}:where(.seoulex-root) .swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}:where(.seoulex-root) .swiper-flip{overflow:visible}:where(.seoulex-root) .swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}:where(.seoulex-root) .swiper-flip .swiper-slide .swiper-slide{pointer-events:none}:where(.seoulex-root) .swiper-flip .swiper-slide-active,:where(.seoulex-root) .swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}:where(.seoulex-root) .swiper-flip .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-flip .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-flip .swiper-slide-shadow-right,:where(.seoulex-root) .swiper-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}:where(.seoulex-root) .swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}:where(.seoulex-root) .swiper-cards{overflow:visible}:where(.seoulex-root) .swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
/* ==== header-desktop.css ==== */
:where(.seoulex-root) .main-header{
    border-bottom: 1px solid var(--color-grayscale-grey-030);
    overflow: visible;
    min-width: 1200px;
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
}

:where(.seoulex-root) .header-wrapper{
    padding: 8px 120px;
    display: flex;
    box-sizing: border-box;
    justify-content: space-between;
    align-items: center;
    overflow: visible;
    max-width: 1440px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

:where(.seoulex-root) .logo-search-wrapper{
    flex-grow: 1;
    overflow: visible;
    position: relative;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .sx-logo{
    height: 24px;
    margin-right: 37px;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .hiring-link{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
}


:where(.seoulex-root) .header-wrapper > .logo-search-wrapper > .search-bar{
    margin-right: 20px;
    padding-left: 40px;
    padding-right: 12px;
    max-width: 600px;
    height: 40px;
    flex-grow: 1;
    box-sizing: border-box;
    position: relative;
    border: 1.5px solid transparent;
    background-color: var(--color-grayscale-grey-020);
    border-radius: 10px;
    background-image: url("/static/images/ic_home_search.svg");
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position: 13px 50%;
    font-size: 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    outline: none;
}

:where(.seoulex-root) .search-bar::placeholder{
    font-size: 13px;
    color: var(--color-grayscale-grey-070);
    letter-spacing: -0.01em;
}

:where(.seoulex-root) .header-wrapper > .logo-search-wrapper > .search-bar:hover{
    border-color: var(--color-grayscale-grey-040);
    background-color: var(--color-grayscale-grey-010);
}

:where(.seoulex-root) .header-wrapper > .logo-search-wrapper > .search-bar:focus{
    border-color: var(--color-grayscale-grey-090);
    box-shadow: 0 0 0 3px rgba(51, 51, 51, 0.06);
    background-color: var(--color-pure-wht);
}



:where(.seoulex-root) .gnb-wrapper{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

:where(.seoulex-root) .balance,:where(.seoulex-root) .transaction,:where(.seoulex-root) .user-login,:where(.seoulex-root) .total-stocks,:where(.seoulex-root) .ipo-schedule-list,:where(.seoulex-root) .my-info-button,:where(.seoulex-root) .company-intro{
    font-size: 14px;
    text-align: center;
    font-weight: 500;
    border-radius: 8px;
}

:where(.seoulex-root) .download-button{
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    border-radius: 8px;
}

:where(.seoulex-root) .balance:hover,:where(.seoulex-root) .transaction:hover,:where(.seoulex-root) .total-stocks:hover,:where(.seoulex-root) .ipo-schedule-list:hover,:where(.seoulex-root) .my-info-button:hover,:where(.seoulex-root) .alarm-open-button:hover,:where(.seoulex-root) .company-intro:hover,:where(.seoulex-root) .hamburger-menu:hover,:where(.seoulex-root) .hamburger-menu:hover > .menu-button{
    background-color: var(--color-grayscale-grey-030);
}

:where(.seoulex-root) .balance:active,:where(.seoulex-root) .transaction:active,:where(.seoulex-root) .total-stocks:active,:where(.seoulex-root) .ipo-schedule-list:active,:where(.seoulex-root) .company-intro:active,:where(.seoulex-root) .my-info-button > div.open,:where(.seoulex-root) .alarm-open-button.alarm,:where(.seoulex-root) .hamburger-menu > .menu-button.open{
    background-color: var(--color-grayscale-grey-020);
}

:where(.seoulex-root) .balance > a,:where(.seoulex-root) .transaction > a,:where(.seoulex-root) .total-stocks > a,:where(.seoulex-root) .ipo-schedule-list > a,:where(.seoulex-root) .company-intro > a,:where(.seoulex-root) .my-info-button > div,:where(.seoulex-root) .user-login > a{
    display: block;
    padding: 15px 16px 12px;
    border-radius: 8px;
}

:where(.seoulex-root) .download-button{
    border: none;
    display: block;
    border-radius: 8px;
    padding: 15px 19px 14px 19px;
}

:where(.seoulex-root) .balance{
    min-width: 26px;
}

:where(.seoulex-root) .transaction{
    min-width: 41px;
}

:where(.seoulex-root) .total-stocks{
    min-width: 51px;
}

:where(.seoulex-root) .ipo-schedule-list{
    min-width: 55px;
}

:where(.seoulex-root) .user-login{
    background-color: #E02B35;
    border-radius: 8px;
    color: var(--color-pure-wht);
    margin: 0 20px;
}

:where(.seoulex-root) .user-login:hover,:where(.seoulex-root) .download-button:hover{
    background-color: #E02B35;
}

:where(.seoulex-root) .user-login:active,:where(.seoulex-root) .download-button:active{
    background-color: #E02B35;
}

:where(.seoulex-root) .my-info-button{
    min-width: 41px;
    display: flex;
    align-items: center;
    cursor: pointer;
    position: relative;
}

:where(.seoulex-root) .my-info-button > span{
    margin-right: 10px;
}

:where(.seoulex-root) .my-info-button > img{
    position: relative;
    bottom: 2px;
}

:where(.seoulex-root) .my-info-button > .open > img{
    position: relative;
    top: 1px;
    transform: rotate(180deg);
}

:where(.seoulex-root) .my-user-profile{
    padding: 4px 0;
    margin-right: 16px;
}

:where(.seoulex-root) .my-user-profile a{
    display: flex;
}

:where(.seoulex-root) .my-user-profile img{
    padding-right: 8px;
}

:where(.seoulex-root) .user-nickname{
    font-size: 16px;
    height: 16px;
    padding-top: 8px;
}

:where(.seoulex-root) .hamburger-menu{
    position: relative;
    border-radius: 8px;
}

:where(.seoulex-root) .menu-button{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-pure-wht);
    border: 0;
    border-radius: 8px;
}

:where(.seoulex-root) .menu-button:focus{
    outline: 0;
}

:where(.seoulex-root) .dropdown-menu{
    border: 1px solid var(--color-grayscale-grey-030);
    width: fit-content;
    position: absolute;
    background: var(--color-pure-wht);
    transition: max-height 0.2s ease-out;
    z-index: 500;
    display: none;
    border-radius: 8px;
    padding: 8px;
}

:where(.seoulex-root) .my-info__dropdown{
    top: 56px;
    right: 0;
    width: 164px;
}

:where(.seoulex-root) .menu__dropdown{
    width: 145px;
    top: 54px;
    right: 0;
}

:where(.seoulex-root) .dropdown-menu.open{
    display: block;
}

:where(.seoulex-root) .snb-list-item{
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    padding-left: 8px;
    font-size: 14px;
    box-sizing: border-box;
    border-radius: 8px;
    position: relative;
}

:where(.seoulex-root) .snb-list-item > a > .corporate-beta__img{
    position: relative;
    top: -4px;
    right: -2px;
}

:where(.seoulex-root) .snb-list-item:hover{
    background-color: var(--color-grayscale-grey-030);
}

:where(.seoulex-root) .snb-list-item:active{
    background-color: var(--color-grayscale-grey-030);
}

:where(.seoulex-root) .snb-list-item > a{
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
}

:where(.seoulex-root) .logout-btn{
    border: none;
    background-color: transparent;
    width: 100%;
    height: 100%;
    text-align: left;
}

:where(.seoulex-root) .snb-logout > form{
    width: 100%;
    height: 100%;
}


:where(.seoulex-root) .search-iframe{
    z-index: 500;
    position: absolute;
    top: 50px;
    left: 191px;
    right: 20px;
    max-height: 420px;
    overflow: hidden;
    border: 1px solid var(--color-grayscale-grey-030);
    background-color: var(--color-pure-wht);
    box-sizing: border-box;
    border-radius: 12px;
    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.05),
        0 10px 22px -4px rgba(0, 0, 0, 0.08),
        0 0 0 1px rgba(0, 0, 0, 0.03);
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0s;
}

:where(.seoulex-root) .search-iframe.none{
    display: block !important;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
    visibility: hidden;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s linear 0.15s;
}

:where(.seoulex-root) .stock-list{
    padding: 6px 0;
    margin: 0;
    list-style-type: none;
    max-height: 408px;
    overflow-y: auto;
    overflow-x: hidden;
}


:where(.seoulex-root) .stock-list::-webkit-scrollbar{
    width: 6px;
}

:where(.seoulex-root) .stock-list::-webkit-scrollbar-track{
    background: transparent;
    margin: 6px 0;
}

:where(.seoulex-root) .stock-list::-webkit-scrollbar-thumb{
    background-color: var(--color-grayscale-grey-040);
    border-radius: 3px;
}

:where(.seoulex-root) .stock-list::-webkit-scrollbar-thumb:hover{
    background-color: var(--color-grayscale-grey-060);
}

:where(.seoulex-root) .stock-list .stock-loading-bar{
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

:where(.seoulex-root) .stock-list li{
    padding: 0 6px;
    position: relative;
}

:where(.seoulex-root) .stock-list li.active{
    background-color: transparent;
}

:where(.seoulex-root) .stock-list li.active > a{
    background-color: var(--color-grayscale-grey-020);
}

:where(.seoulex-root) .stock-list li a{
    display: flex;
    align-items: center;
    height: 52px;
    padding: 0 14px;
    border-radius: 8px;
    border-bottom: none;
    text-decoration: none;
    transition: background-color 0.12s ease;
}

:where(.seoulex-root) .stock-list li a:hover{
    background-color: var(--color-grayscale-grey-020);
}

:where(.seoulex-root) .stock-list:last-child li:last-child a{
    border-bottom: none;
}

:where(.seoulex-root) .company-wrapper{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    overflow: visible;
    width: 100%;
    gap: 12px;
}

:where(.seoulex-root) .stock-list li a span:first-child{
    font-size: 14px;
    font-weight: 500;
    color: var(--color-grayscale-grey100);
    letter-spacing: -0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

:where(.seoulex-root) .stock-list li a span:nth-child(2){
    margin-top: 0;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-grayscale-grey-060);
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}


:where(.seoulex-root) .stock-list li.create-search-result-none{
    padding: 0;
}

:where(.seoulex-root) .stock-list li.create-search-result-none a{
    height: 80px;
    justify-content: center;
    cursor: default;
    background-color: transparent;
}

:where(.seoulex-root) .stock-list li.create-search-result-none a:hover{
    background-color: transparent;
}

:where(.seoulex-root) .stock-list li.create-search-result-none .company-wrapper{
    justify-content: center;
}

:where(.seoulex-root) .stock-list li.create-search-result-none span:first-child{
    font-size: 13px;
    font-weight: 400;
    color: var(--color-grayscale-grey-070);
    text-align: center;
    flex: none;
}

:where(.seoulex-root) .company-search::placeholoder{
    color: var(--color-grayscale-grey-060);
}

:where(.seoulex-root) .company-icon{
    width: 40px;
    height: 40px;
}

:where(.seoulex-root) .company-wrapper span{
    display: block;
}

:where(.seoulex-root) .star-icon{
    width: 24px;
    height: 24px;
    position: absolute;
    right: 0;
    top: 24px;
    border: none;
    background-image: url("/static/mobile/images/ic-star.svg");
    background-color: transparent;
}

:where(.seoulex-root) .star-icon.active{
    background-image: url("/static/mobile/images/ic-star-activated.svg");
}

:where(.seoulex-root) .remove-btn{
    width: 40px;
    height: 40px;
    position: absolute;
    top: 8px;
    right: 4px;
    background-color: transparent;
    background-image: url("/static/mobile/images/ic-remove.svg");
    background-size: contain;
    border: none;
    cursor: pointer;
    z-index: 100;
}

:where(.seoulex-root) .none{
    display: none;
}

:where(.seoulex-root) .alarm-card-wrapper a{
    display: block;
}

:where(.seoulex-root) .alarm-button{
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .alarm-open-button{
    padding: 12px;
    border-radius: 8px;
}

:where(.seoulex-root) .chat-count-dot{
    top: 6px;
    left: 21px;
    position: absolute;
    font-size: 10px;
    text-align: center;
    color: var(--color-pure-wht);
    padding: 1px 4px;
    border-radius: 9px;
    background-color: var(--color-system-error);
}

:where(.seoulex-root) .chat-count-dot > span{
    font-size: 10px;
    position: relative;
    top: 1px;
}

:where(.seoulex-root) .alarm-list-section{
    padding: 20px 0 0;
    position: absolute;
    top: 56px;
    right: 0px;
    width: 320px;
    max-height: 360px;
    border: solid 1px var(--color-grayscale-grey-030);
    background-color: var(--color-pure-wht);
    z-index: 2000;
    border-radius: 10px;
}

:where(.seoulex-root) .close-button{
    height: 10px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    cursor: pointer;
}

:where(.seoulex-root) .alarm-card-wrapper{
    overflow: auto;
    max-height: 340px;
}

:where(.seoulex-root) .alarm-card{
    padding: 12px 20px;
}

:where(.seoulex-root) .alarm-card:hover{
    background-color: var(--color-grayscale-grey-020);
}

:where(.seoulex-root) .alarm-card-wrapper > a:last-child > .alarm-card{
    border-bottom: 0px;
}

:where(.seoulex-root) .alarm-card h2{
    font-size: 14px;
    font-weight: 500;
    color: var(--color-grayscale-grey100);
    margin-bottom: 6px;
    max-width: 254px;
}

:where(.seoulex-root) .alarm-card p{
    font-size: 12px;
    line-height: 1.5;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .alarm-card span{
    margin-top: 12px;
    font-size: 12px;
    color: var(--color-grayscale-grey-050);
}

:where(.seoulex-root) .alarm-menu{
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 20px;
    margin-bottom: 12px;
}

:where(.seoulex-root) .alarm-menu span{
    font-size: 14px;
    color: var(--color-grayscale-grey-060);
}

:where(.seoulex-root) .alarm-menu span:hover{
    text-decoration: underline;
    color: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .no-alarm{
    height: 77px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .view-all,:where(.seoulex-root) .read-all{
    cursor: pointer;
}

:where(.seoulex-root) .unread-dot-wrapper{
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .unread-dot{
    display: none;
    position: relative;
    top: 4px;
    width: 6px;
    height: 6px;
    background-color: var(--color-system-info);
    border-radius: 6px;
}

:where(.seoulex-root) .unread-message .unread-dot{
    display: block;
}

:where(.seoulex-root) .desktop-app-download-dim{
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(27, 27, 27, 0.8);
    z-index: 100000;
}

:where(.seoulex-root) .desktop-app-download-modal{
    opacity: 1;
    width: 570px;
    height: 390px;
    background-color: white;
}

:where(.seoulex-root) .desktop-app-download-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    color: #ffffff;
    background-color: #eb3640;
}

:where(.seoulex-root) .desktop-app-download-title > img{
    width: 20px;
    height: 20px;
    fill: white;
    cursor: pointer;
}

:where(.seoulex-root) .desktop-app-download-content{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 40px 30px;
    box-sizing: border-box;
}

:where(.seoulex-root) .qr{
    width: 243px;
    height: 243px;
    box-sizing: border-box;
}

:where(.seoulex-root) .qr > img{
    width: 100%;
    height: 100%;
    padding: 20px;
    border: 1px solid #e3e3e3;
    box-sizing: border-box;
}

:where(.seoulex-root) .modal-title{
    font-family: "Spoqa Han Sans Neo";
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    color: #272727;
}

:where(.seoulex-root) .modal-title > .red{
    font-size: 24px;
    line-height: 30px;
    color: #e02b35;
}

:where(.seoulex-root) .modal-description{
    margin-top: 12px;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #272727;
}

:where(.seoulex-root) .qr-description{
    font-size: 13px;
    line-height: 17px;
    text-align: left;
    color: #1f2e45;
}

:where(.seoulex-root) .qr-description > .bold{
    font-weight: bold;
}

:where(.seoulex-root) .store-image-wrapper{
    margin: 40px 0 12px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

:where(.seoulex-root) .none{
    display: none;
}

/* ==== footer-desktop.css ==== */
:where(.seoulex-root) .footer-wrapper{
    overflow: visible;
    padding: 40px 12px;
    width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

:where(.seoulex-root) .footer-wrapper > img{
    width: 344px;
    height: 32px;
    margin-bottom: 24px;
}

:where(.seoulex-root) .footer-notice{
    display: flex;
    flex-wrap: wrap;
}

:where(.seoulex-root) .index-footer{
    background-color: #595959;
    background-color: var(--color-grayscale-grey-030);
    color: var(--color-grayscale-grey-080);
}

:where(.seoulex-root) .footer-notice{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

:where(.seoulex-root) .footer-notice li{
    margin-right: 16px;
    margin-bottom: 16px;
    font-size: 14px;
    color: var(--color-grayscale-grey-090);
}

:where(.seoulex-root) .cs-title{
    display: block;
    margin-bottom: 12px;
    font-size: 16px;
    color: var(--color-grayscale-grey100);
    font-weight: bold;
}

:where(.seoulex-root) .cs-list{
    margin-bottom: 24px;
}

:where(.seoulex-root) .cs-list li{
    display: flex;
    flex-direction: row;
}

:where(.seoulex-root) .cs-list li span{
    color: var(--color-grayscale-grey-080);
    font-size: 14px;
}

:where(.seoulex-root) .cs-list li span:first-child{
    margin-right: 16px;
    margin-bottom: 4px;
}

:where(.seoulex-root) .psx-info{
    margin-top: 8px;
}

:where(.seoulex-root) .psx-info,:where(.seoulex-root) .copyright{
    font-size: 14px;
    line-height: 1.57;
    font-weight: normal;
}

:where(.seoulex-root) .copyright{
    margin-bottom: 80px;
    font-size: 14px;
    line-height: 1.57;
    font-weight: normal;
}

:where(.seoulex-root) .pc-only-copyright-wrapper{
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .footer-notice-wrapper{
    margin-left: 300px;
    display: flex;
}

/* ==== index-desktop.css ==== */


@font-face {
    font-family: "swiper-icons";
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA")
        format("woff");
    font-weight: 400;
    font-style: normal;
}
.seoulex-root{
    --swiper-theme-color: #007aff;
}
:where(.seoulex-root) .swiper-container{
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    
    z-index: 1;
}
:where(.seoulex-root) .swiper-container-vertical > .swiper-wrapper{
    flex-direction: column;
}
:where(.seoulex-root) .swiper-wrapper{
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}
:where(.seoulex-root) .swiper-container-android .swiper-slide,:where(.seoulex-root) .swiper-wrapper{
    transform: translate3d(0px, 0, 0);
}
:where(.seoulex-root) .swiper-container-multirow > .swiper-wrapper{
    flex-wrap: wrap;
}
:where(.seoulex-root) .swiper-container-multirow-column > .swiper-wrapper{
    flex-wrap: wrap;
    flex-direction: column;
}
:where(.seoulex-root) .swiper-container-free-mode > .swiper-wrapper{
    transition-timing-function: ease-out;
    margin: 0 auto;
}
:where(.seoulex-root) .swiper-container-pointer-events{
    touch-action: pan-y;
}
:where(.seoulex-root) .swiper-container-pointer-events.swiper-container-vertical{
    touch-action: pan-x;
}
:where(.seoulex-root) .swiper-slide{
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}
:where(.seoulex-root) .swiper-slide-invisible-blank{
    visibility: hidden;
}

:where(.seoulex-root) .swiper-container-autoheight,:where(.seoulex-root) .swiper-container-autoheight .swiper-slide{
    height: auto;
}
:where(.seoulex-root) .swiper-container-autoheight .swiper-wrapper{
    align-items: flex-start;
    transition-property: transform, height;
}

:where(.seoulex-root) .swiper-container-3d{
    perspective: 1200px;
}
:where(.seoulex-root) .swiper-container-3d .swiper-wrapper,:where(.seoulex-root) .swiper-container-3d .swiper-slide,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-right,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-top,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-container-3d .swiper-cube-shadow{
    transform-style: preserve-3d;
}
:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-right,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-top,:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-bottom{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
}
:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-left{
    background-image: linear-gradient(
        to left,
        rgba(0, 0, 0, 0.5),
        rgba(0, 0, 0, 0)
    );
}
:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-right{
    background-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.5),
        rgba(0, 0, 0, 0)
    );
}
:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-top{
    background-image: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.5),
        rgba(0, 0, 0, 0)
    );
}
:where(.seoulex-root) .swiper-container-3d .swiper-slide-shadow-bottom{
    background-image: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.5),
        rgba(0, 0, 0, 0)
    );
}

:where(.seoulex-root) .swiper-container-css-mode > .swiper-wrapper{
    overflow: auto;
    scrollbar-width: none;
    
    -ms-overflow-style: none;
    
}
:where(.seoulex-root) .swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar{
    display: none;
}
:where(.seoulex-root) .swiper-container-css-mode > .swiper-wrapper > .swiper-slide{
    scroll-snap-align: start start;
}
:where(.seoulex-root) .swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper{
    scroll-snap-type: x mandatory;
}
:where(.seoulex-root) .swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper{
    scroll-snap-type: y mandatory;
}
.seoulex-root{
    --swiper-navigation-size: 44px;
    
}
:where(.seoulex-root) .swiper-button-prev,:where(.seoulex-root) .swiper-button-next{
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
:where(.seoulex-root) .swiper-button-prev.swiper-button-disabled,:where(.seoulex-root) .swiper-button-next.swiper-button-disabled{
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
}
:where(.seoulex-root) .swiper-button-prev:after,:where(.seoulex-root) .swiper-button-next:after{
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
    line-height: 1;
}
:where(.seoulex-root) .swiper-button-prev,:where(.seoulex-root) .swiper-container-rtl .swiper-button-next{
    left: 10px;
    right: auto;
}
:where(.seoulex-root) .swiper-button-prev:after,:where(.seoulex-root) .swiper-container-rtl .swiper-button-next:after{
    content: "prev";
}
:where(.seoulex-root) .swiper-button-next,:where(.seoulex-root) .swiper-container-rtl .swiper-button-prev{
    right: 10px;
    left: auto;
}
:where(.seoulex-root) .swiper-button-next:after,:where(.seoulex-root) .swiper-container-rtl .swiper-button-prev:after{
    content: "next";
}
:where(.seoulex-root) .swiper-button-prev.swiper-button-white,:where(.seoulex-root) .swiper-button-next.swiper-button-white{
    --swiper-navigation-color: #ffffff;
}
:where(.seoulex-root) .swiper-button-prev.swiper-button-black,:where(.seoulex-root) .swiper-button-next.swiper-button-black{
    --swiper-navigation-color: #000000;
}
:where(.seoulex-root) .swiper-button-lock{
    display: none;
}
.seoulex-root{
    
}
:where(.seoulex-root) .swiper-pagination{
    position: absolute;
    text-align: center;
    transition: 300ms opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
}
:where(.seoulex-root) .swiper-pagination.swiper-pagination-hidden{
    opacity: 0;
}

:where(.seoulex-root) .swiper-pagination-fraction,:where(.seoulex-root) .swiper-pagination-custom,:where(.seoulex-root) .swiper-container-horizontal > .swiper-pagination-bullets{
    bottom: 10px;
    left: 0;
    width: 100%;
}

:where(.seoulex-root) .swiper-pagination-bullets-dynamic{
    overflow: hidden;
    font-size: 0;
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{
    transform: scale(0.33);
    position: relative;
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{
    transform: scale(1);
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{
    transform: scale(1);
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{
    transform: scale(0.66);
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{
    transform: scale(0.33);
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{
    transform: scale(0.66);
}
:where(.seoulex-root) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{
    transform: scale(0.33);
}
:where(.seoulex-root) .swiper-pagination-bullet{
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: #000;
    opacity: 0.2;
}
:where(.seoulex-root) button.swiper-pagination-bullet{
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
}
:where(.seoulex-root) .swiper-pagination-clickable .swiper-pagination-bullet{
    cursor: pointer;
}
:where(.seoulex-root) .swiper-pagination-bullet-active{
    opacity: 1;
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
:where(.seoulex-root) .swiper-container-vertical > .swiper-pagination-bullets{
    right: 10px;
    top: 50%;
    transform: translate3d(0px, -50%, 0);
}
:where(.seoulex-root) .swiper-container-vertical
    > .swiper-pagination-bullets
    .swiper-pagination-bullet{
    margin: 6px 0;
    display: block;
}
:where(.seoulex-root) .swiper-container-vertical
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic{
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
}
:where(.seoulex-root) .swiper-container-vertical
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet{
    display: inline-block;
    transition: 200ms transform, 200ms top;
}
:where(.seoulex-root) .swiper-container-horizontal
    > .swiper-pagination-bullets
    .swiper-pagination-bullet{
    margin: 0 4px;
}
:where(.seoulex-root) .swiper-container-horizontal
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic{
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}
:where(.seoulex-root) .swiper-container-horizontal
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet{
    transition: 200ms transform, 200ms left;
}
:where(.seoulex-root) .swiper-container-horizontal.swiper-container-rtl
    > .swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet{
    transition: 200ms transform, 200ms right;
}

:where(.seoulex-root) .swiper-pagination-progressbar{
    background: rgba(0, 0, 0, 0.25);
    position: absolute;
}
:where(.seoulex-root) .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top;
}
:where(.seoulex-root) .swiper-container-rtl
    .swiper-pagination-progressbar
    .swiper-pagination-progressbar-fill{
    transform-origin: right top;
}
:where(.seoulex-root) .swiper-container-horizontal > .swiper-pagination-progressbar,:where(.seoulex-root) .swiper-container-vertical
    > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
}
:where(.seoulex-root) .swiper-container-vertical > .swiper-pagination-progressbar,:where(.seoulex-root) .swiper-container-horizontal
    > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{
    width: 4px;
    height: 100%;
    left: 0;
    top: 0;
}
:where(.seoulex-root) .swiper-pagination-white{
    --swiper-pagination-color: #ffffff;
}
:where(.seoulex-root) .swiper-pagination-black{
    --swiper-pagination-color: #000000;
}
:where(.seoulex-root) .swiper-pagination-lock{
    display: none;
}

:where(.seoulex-root) .swiper-scrollbar{
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, 0.1);
}
:where(.seoulex-root) .swiper-container-horizontal > .swiper-scrollbar{
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%;
}
:where(.seoulex-root) .swiper-container-vertical > .swiper-scrollbar{
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%;
}
:where(.seoulex-root) .swiper-scrollbar-drag{
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    left: 0;
    top: 0;
}
:where(.seoulex-root) .swiper-scrollbar-cursor-drag{
    cursor: move;
}
:where(.seoulex-root) .swiper-scrollbar-lock{
    display: none;
}
:where(.seoulex-root) .swiper-zoom-container{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
:where(.seoulex-root) .swiper-zoom-container > img,:where(.seoulex-root) .swiper-zoom-container > svg,:where(.seoulex-root) .swiper-zoom-container > canvas{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
:where(.seoulex-root) .swiper-slide-zoomed{
    cursor: move;
}

.seoulex-root{
    
}
:where(.seoulex-root) .swiper-lazy-preloader{
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s infinite linear;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent;
}
:where(.seoulex-root) .swiper-lazy-preloader-white{
    --swiper-preloader-color: #fff;
}
:where(.seoulex-root) .swiper-lazy-preloader-black{
    --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
    100% {
        transform: rotate(360deg);
    }
}

:where(.seoulex-root) .swiper-container .swiper-notification{
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
}
:where(.seoulex-root) .swiper-container-fade.swiper-container-free-mode .swiper-slide{
    transition-timing-function: ease-out;
}
:where(.seoulex-root) .swiper-container-fade .swiper-slide{
    pointer-events: none;
    transition-property: opacity;
}
:where(.seoulex-root) .swiper-container-fade .swiper-slide .swiper-slide{
    pointer-events: none;
}
:where(.seoulex-root) .swiper-container-fade .swiper-slide-active,:where(.seoulex-root) .swiper-container-fade .swiper-slide-active .swiper-slide-active{
    pointer-events: auto;
}
:where(.seoulex-root) .swiper-container-cube{
    overflow: visible;
}
:where(.seoulex-root) .swiper-container-cube .swiper-slide{
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%;
}
:where(.seoulex-root) .swiper-container-cube .swiper-slide .swiper-slide{
    pointer-events: none;
}
:where(.seoulex-root) .swiper-container-cube.swiper-container-rtl .swiper-slide{
    transform-origin: 100% 0;
}
:where(.seoulex-root) .swiper-container-cube .swiper-slide-active,:where(.seoulex-root) .swiper-container-cube .swiper-slide-active .swiper-slide-active{
    pointer-events: auto;
}
:where(.seoulex-root) .swiper-container-cube .swiper-slide-active,:where(.seoulex-root) .swiper-container-cube .swiper-slide-next,:where(.seoulex-root) .swiper-container-cube .swiper-slide-prev,:where(.seoulex-root) .swiper-container-cube .swiper-slide-next + .swiper-slide{
    pointer-events: auto;
    visibility: visible;
}
:where(.seoulex-root) .swiper-container-cube .swiper-slide-shadow-top,:where(.seoulex-root) .swiper-container-cube .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-container-cube .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-container-cube .swiper-slide-shadow-right{
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
:where(.seoulex-root) .swiper-container-cube .swiper-cube-shadow{
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 0;
}
:where(.seoulex-root) .swiper-container-cube .swiper-cube-shadow:before{
    content: "";
    background: #000;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    filter: blur(50px);
}
:where(.seoulex-root) .swiper-container-flip{
    overflow: visible;
}
:where(.seoulex-root) .swiper-container-flip .swiper-slide{
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
}
:where(.seoulex-root) .swiper-container-flip .swiper-slide .swiper-slide{
    pointer-events: none;
}
:where(.seoulex-root) .swiper-container-flip .swiper-slide-active,:where(.seoulex-root) .swiper-container-flip .swiper-slide-active .swiper-slide-active{
    pointer-events: auto;
}
:where(.seoulex-root) .swiper-container-flip .swiper-slide-shadow-top,:where(.seoulex-root) .swiper-container-flip .swiper-slide-shadow-bottom,:where(.seoulex-root) .swiper-container-flip .swiper-slide-shadow-left,:where(.seoulex-root) .swiper-container-flip .swiper-slide-shadow-right{
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

:where(.seoulex-root) .footer-wrapper{
    overflow: visible;
    padding: 40px 12px;
    width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

:where(.seoulex-root) .footer-wrapper > img{
    margin-bottom: 24px;
}

:where(.seoulex-root) .footer-notice{
    display: flex;
    flex-wrap: wrap;
}

:where(.seoulex-root) .index-footer{
    min-width: 1120px;
    background-color: #595959;
    background-color: var(--color-grayscale-grey-030);
    color: var(--color-grayscale-grey-080);
}

:where(.seoulex-root) .footer-notice{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

:where(.seoulex-root) .footer-notice__item--bold{
    font-weight: bold;
}

:where(.seoulex-root) .footer-notice li{
    margin-right: 16px;
    margin-bottom: 16px;
    font-size: 14px;
    color: var(--color-grayscale-grey-090);
}

:where(.seoulex-root) .cs-title{
    display: block;
    margin-bottom: 12px;
    font-size: 16px;
    color: var(--color-grayscale-grey100);
    font-weight: bold;
}

:where(.seoulex-root) .cs-list{
    margin-bottom: 24px;
}

:where(.seoulex-root) .cs-list li{
    display: flex;
    flex-direction: row;
}

:where(.seoulex-root) .cs-list li span{
    color: var(--color-grayscale-grey-080);
    font-size: 14px;
}

:where(.seoulex-root) .cs-list li span:first-child{
    margin-right: 16px;
    margin-bottom: 4px;
}

:where(.seoulex-root) .psx-info{
    margin-top: 8px;
}

:where(.seoulex-root) .psx-info,:where(.seoulex-root) .copyright{
    font-size: 14px;
    line-height: 1.57;
    font-weight: normal;
}

:where(.seoulex-root) .copyright{
    margin-bottom: 80px;
    font-size: 14px;
    line-height: 1.57;
    font-weight: normal;
}

:where(.seoulex-root) .pc-only-copyright-wrapper{
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .footer-notice-wrapper{
    margin-left: 380px;
    display: flex;
}

:where(.seoulex-root) .footer-notice-wrapper .footer-notice:last-child li{
    margin-right: 0px;
}

:where(.seoulex-root) .page-header{
    min-width: 1120px;
}

:where(.seoulex-root) .page-content{
    min-width: 1120px;
    padding: 0;
    margin: 0 auto;
}

:where(.seoulex-root) .swiper-container{
    width: 1080px;
    border-radius: 8px;
    box-sizing: border-box;
    height: 240px;
    margin: 56px auto 0;
}

:where(.seoulex-root) .swiper-wrapper{
    overflow: visible;
}

:where(.seoulex-root) .swiper-pagination{
    position: relative;
    top: 11px;
    left: unset;
    width: 100%;
    margin: 0 auto;
}

:where(.seoulex-root) .pagination-box{
    width: 100%;
    position: absolute;
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
    box-sizing: border-box;
}

:where(.seoulex-root) .swiper-pagination-bullet{
    background: var(--color-grayscale-grey-040);
    opacity: 1;
    margin-right: 8px;
}

:where(.seoulex-root) .swiper-pagination-bullet-active{
    background: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .prev-btn{
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    z-index: 1;
    width: 32px;
    height: 32px;
    background-image: url("/static/images/ic_banner_prev.svg");
    background-size: 100%;
    font-size: 16px;
    background-color: transparent;
    border: none;
}

:where(.seoulex-root) .next-btn{
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    z-index: 1;
    width: 32px;
    height: 32px;
    background-image: url("/static/images/ic_banner_next.svg");
    font-size: 16px;
    background-size: 100%;
    background-color: transparent;
    border: none;
}

:where(.seoulex-root) .page-wrapper{
    width: 44px;
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .swiper-pagination-progressbar{
    z-index: 100;
    background-color: rgba(187, 187, 187, 0.3);
    --swiper-theme-color: var(--color-pure-wht);
}

:where(.seoulex-root) .header-wrapper{
    padding: 8px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: visible;
    width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

:where(.seoulex-root) .popular-stock__title,:where(.seoulex-root) .favorite-stock__title{
    margin-top: 80px;
    font-size: 18px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

:where(.seoulex-root) .popular-stock__title{
    margin-top: 0;
    margin-bottom: 0;
}

:where(.seoulex-root) .stock-tab-header{
    margin-top: 48px;
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

:where(.seoulex-root) .stock-tabs{
    display: flex;
    gap: 8px;
}

:where(.seoulex-root) .stock-tab{
    padding: 6px 16px;
    border: 1px solid #d6d6d6;
    border-radius: 20px;
    background: #fff;
    font-size: 14px;
    color: var(--color-grayscale-grey-070, #999);
    cursor: pointer;
    transition: all 0.2s;
    outline: none;
}

:where(.seoulex-root) .stock-tab:hover{
    border-color: var(--color-grayscale-grey100, #272727);
    color: var(--color-grayscale-grey100, #272727);
}

:where(.seoulex-root) .stock-tab.active{
    background: var(--color-grayscale-grey100, #272727);
    border-color: var(--color-grayscale-grey100, #272727);
    color: #fff;
    font-weight: 600;
}

:where(.seoulex-root) .sx-stock-table{
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

:where(.seoulex-root) .sx-stock-table thead th{
    padding: 10px 12px;
    font-size: 13px;
    font-weight: normal;
    color: #9f9f9f;
    border-bottom: 1px solid #ededed;
    text-align: right;
}

:where(.seoulex-root) .sx-stock-table thead th.col-name{
    text-align: left;
    width: 224px;
}

:where(.seoulex-root) .sx-stock-table tbody tr{
    height: 58px;
    border-bottom: 1px solid #f5f5f5;
    cursor: pointer;
}

:where(.seoulex-root) .sx-stock-table tbody tr:hover{
    background: #fafafa;
}

:where(.seoulex-root) .sx-stock-table tbody td{
    padding: 0 12px;
    font-size: 15px;
    font-weight: bold;
    color: var(--color-grayscale-grey100, #272727);
    text-align: right;
    vertical-align: middle;
}

:where(.seoulex-root) .sx-stock-table tbody td.col-name{
    text-align: left;
}

:where(.seoulex-root) .sx-stock-table tbody td.col-name a{
    color: inherit;
    text-decoration: none;
}

:where(.seoulex-root) .sx-stock-table .name-cell{
    display: flex;
    align-items: center;
    gap: 8px;
}

:where(.seoulex-root) .sx-stock-table .name-cell img{
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    object-fit: cover;
    flex-shrink: 0;
}

:where(.seoulex-root) .sx-stock-table .name-cell span{
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:where(.seoulex-root) .sx-stock-table .no-price{
    color: #ababab;
    font-weight: normal;
}

:where(.seoulex-root) .sx-stock-table .sx-up{ color: #e74c3c; }
:where(.seoulex-root) .sx-stock-table .sx-down{ color: rgb(47, 121, 250); }

:where(.seoulex-root) .popular-stock__title > a,:where(.seoulex-root) .favorite-stock__title > a{
    font-weight: normal;
    font-size: 14px;
    color: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .none-favorite-stock-area + .popular-stock__title,:where(.seoulex-root) .none-favorite-stock-area + .favorite-stock__title{
    margin-top: 64px;
}


:where(.seoulex-root) .notify-msg{
    background-color: var(--color-grayscale-grey100);
    color: var(--color-pure-wht);
    padding: 16px;
    text-align: center;
    min-width: 1120px;
    box-sizing: border-box;
}

:where(.seoulex-root) .notify-msg__text{
    margin-left: auto;
    margin-right: auto;
}

:where(.seoulex-root) .sort-menu{
    display: flex;
    padding: 0 20px;
}

:where(.seoulex-root) .sort-menu li{
    height: 48px;
    padding: 16px;
    box-sizing: border-box;
    text-align: center;
    font-size: 16px;
    color: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .sort-menu .selected{
    color: var(--color-grayscale-grey100);
    border-bottom: 1px solid var(--color-grayscale-grey100);
}

:where(.seoulex-root) .popular-stock{
    margin: 0 auto;
    width: 1080px;
    padding: 0 20px;
}

:where(.seoulex-root) .stock-title-wrapper{
    border-top: 1px solid #ededed;
    border-bottom: 1px solid #ededed;
}

:where(.seoulex-root) .stock-item-wrapper{
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .stock-item-table,:where(.seoulex-root) .stock-title-table{
    width: 100%;
    font-size: 14px;
}

:where(.seoulex-root) .stock-item-table > tbody tr{
    display: flex;
    align-items: center;
    cursor: pointer;
    border-bottom: 1px solid var(--color-grayscale-grey-040);
}

:where(.seoulex-root) .stock-title-table tr{
    display: flex;
    height: 32px;
    align-items: center;
}

:where(.seoulex-root) .stock-title-table th{
    font-size: 12px;
    color: var(--color-grayscale-grey-070);
    padding: 9px 0;
}

:where(.seoulex-root) .stock-item-table td,:where(.seoulex-root) .stock-title-table th{
    flex-grow: 1;
    flex-basis: 0;
    text-align: right;
}

:where(.seoulex-root) .stock-item-table td:first-child,:where(.seoulex-root) .stock-title-table th:first-child{
    text-align: left;
}

:where(.seoulex-root) .stock-item-table td{
    padding: 27px 0;
    height: 72px;
    box-sizing: border-box;
    font-size: 16px;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .stock-item-table td:last-child{
    padding: 16px 0;
}

:where(.seoulex-root) .stock-item-table td:first-child{
    font-weight: bold;
}

:where(.seoulex-root) .text-red{
    color: #d51939;
}

:where(.seoulex-root) .text-red > img{
    width: 14px;
    height: 14px;
    position: relative;
    top: 1px;
}

:where(.seoulex-root) .text-blue{
    color: #2b66cc;
}

:where(.seoulex-root) .text-blue > img{
    width: 14px;
    height: 14px;
    position: relative;
    top: 1px;
}

:where(.seoulex-root) .invest-info{
    width: 1080px;
    padding: 0 20px;
    margin: 0 auto;
}

:where(.seoulex-root) .invest-info__title{
    margin-top: 64px;
    font-size: 18px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
    margin-bottom: 16px;
}

:where(.seoulex-root) .invest-info-content{
    margin-top: 17px;
    font-size: 14px;
    color: #595959;
}

:where(.seoulex-root) .info-list{
    display: flex;
    overflow: auto;
}

:where(.seoulex-root) .info-list li{
    border: 1px solid var(--color-grayscale-grey-040);
    border-radius: 4px;
    margin-right: 13px;
}

:where(.seoulex-root) .info-list li:last-child{
    margin-right: 0;
}

:where(.seoulex-root) .info-list li a{
    display: block;
    width: 258px;
    height: 265px;
}

:where(.seoulex-root) .news__img{
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 134px;
}

:where(.seoulex-root) .info-list h2{
    font-size: 16px;
    font-weight: 500;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .news-wrapper{
    display: flex;
}

:where(.seoulex-root) .article-info{
    padding: 16px;
    padding-top: 12px;
    box-sizing: border-box;
}

:where(.seoulex-root) .article-info__detail{
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .article-info__detail span{
    font-size: 12px;
    color: var(--color-grayscale-grey-080);
    position: relative;
    top: 1px;
    margin-top: 1px;
}


:where(.seoulex-root) .banner-image-wrapper{
    width: 100%;
    height: 100%;
}

:where(.seoulex-root) .banner-image{
    display: block;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

:where(.seoulex-root) .logo-wrapper{
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

:where(.seoulex-root) .logo-wrapper a{
    padding: 9px 16px;
    border-radius: 2px;
    background-color: #3690ff;
    font-size: 14px;
    color: var(--color-pure-wht);
}

:where(.seoulex-root) .search-wrapper{
    padding: 10px 16px;
    border-bottom: 1px solid var(--color-grayscale-grey-040);
}

:where(.seoulex-root) .search-wrapper input{
    font-size: 16px;
    width: 100%;
    height: 48px;
    background-color: #f6f6f6;
    border-radius: 2px;
    border: solid 1px #d6d6d6;
    box-sizing: border-box;
    text-align: center;
    text-indent: 24px;
    background-image: url("/static/mobile/images/ic-search-placeholder.svg");
    background-repeat: no-repeat;
    background-position: 21% 50%;
}

:where(.seoulex-root) .search-wrapper input::placeholder{
    color: #bbb;
}

:where(.seoulex-root) .search-wrapper input:focus{
    text-indent: 0;
    background-image: none;
}

:where(.seoulex-root) .search-wrapper input:not(:placeholder-shown){
    text-indent: 0;
    background-image: none;
}

:where(.seoulex-root) .search-wrapper input:focus::placeholder{
    color: transparent;
}

:where(.seoulex-root) .grid-wrapper{
    width: 1080px;
    padding: 80px 20px;
    margin: 0 auto;
    display: grid;
    grid-template-areas: "dictionary post";
    grid-template-columns: 600px 400px;
    column-gap: 80px;
    row-gap: 64px;
}

:where(.seoulex-root) .content-grid{
    width: 1080px;
    padding: 80px 20px 80px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 600px 400px;
    grid-template-areas:
        "news-list qna"
        "post dictionary";
    column-gap: 68px;
    row-gap: 56px;
}

:where(.seoulex-root) .invest-info{
    grid-area: companyInfo;
}

:where(.seoulex-root) .qna-section{
    grid-area: qna;
}

:where(.seoulex-root) .qna-section .qna-section__title{
    display: flex;
    margin-top: 0px;
    margin-bottom: 16px;
    font-size: 18px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
    justify-content: space-between;
    align-items: center;
}

:where(.seoulex-root) .qna-section > .qna-section__title > a{
    font-size: 13px;
    color: var(--color-grayscale-grey-070);
    font-weight: 500;
    transition: color 0.2s ease;
}

:where(.seoulex-root) .qna-section > .qna-section__title > a:hover{
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .qna-section ul li{
    height: auto;
    margin-top: 0;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: var(--color-grayscale-grey100);
    border-bottom: 1px solid #E9E9E9;
}

:where(.seoulex-root) .qna-section ul li:last-child{
    border-bottom: none;
}

:where(.seoulex-root) .qna-section ul li:hover{
    background-color: #fafafa;
}

:where(.seoulex-root) .qna-section ul li a{
    padding: 24px 0;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .qna-section ul li a span{
    position: relative;
    top: 1px;
    line-height: 1.45;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 400;
}

:where(.seoulex-root) .page-wrapper{
    width: 44px;
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .bookmark-none{
    display: block;
    margin: 0 auto;
    margin-top: 80px;
    margin-bottom: 24px;
}

:where(.seoulex-root) .none-favorite-stock-area{
    width: 100%;
    background-color: var(--color-grayscale-grey-020);
    border-radius: 4px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

:where(.seoulex-root) .none-favorite-stock-area > img{
    width: 48px;
    height: 48px;
    margin-top: 18px;
    margin-bottom: 16px;
}

:where(.seoulex-root) .none-favorite-stock-area > p{
    font-size: 14px;
    margin-bottom: 18px;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .seoulex-notice{
    padding: 0;
    box-sizing: border-box;
}

:where(.seoulex-root) .seoulex-notice__title{
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

:where(.seoulex-root) .seoulex-notice__title > h1{
    font-size: 18px;
    font-weight: bold;
}

:where(.seoulex-root) .seoulex-notice__title > a{
    font-size: 14px;
    color: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .seoulex-notice-list > li > a{
    padding: 16px 0;
    border-top: 1px solid var(--color-grayscale-grey-030);
    display: block;
}

:where(.seoulex-root) .seoulex-notice-list > li:last-child > a{
    border-bottom: 1px solid var(--color-grayscale-grey-030);
}

:where(.seoulex-root) .seoulex-notice-list > li > a > h2{
    font-size: 16px;
    color: var(--color-grayscale-grey100);
    margin-bottom: 8px;
    word-break: keep-all;
}

:where(.seoulex-root) .seoulex-notice-list > li > a > p{
    font-size: 12px;
    color: var(--color-grayscale-grey-080);
    margin-bottom: 6px;
    word-break: keep-all;
}

:where(.seoulex-root) .seoulex-notice-list > li > a > span{
    font-size: 12px;
    color: var(--color-grayscale-grey-070);
}

:where(.seoulex-root) .dictionary-banner{
    display: block;
    padding: 0 20px;
    margin: 64px auto 0;
    width: 1080px;
    height: 112px;
}

:where(.seoulex-root) .stock-item-table .chart-wrapper{
    position: relative;
    line-height: 36px;
}

:where(.seoulex-root) .dictionary-banner-wrapper{
    display: block;
}

:where(.seoulex-root) .bottom-banner{
    display: block;
    margin: 0 auto;
    width: 1080px;
    height: 112px;
    padding: 0 20px;
    margin-bottom: 64px;
}

:where(.seoulex-root) .bottom-banner-wrapper{
    display: block;
}

:where(.seoulex-root) .seoulex-dictionary{
    grid-area: dictionary;
}

:where(.seoulex-root) .seoulex-dictionary > h1{
    font-size: 18px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .seoulex-dictionary > .dictionary-list{
    margin-top: 16px;
    display: grid;
    row-gap: 10px;
    column-gap: 10px;
    grid-template-columns: 1fr 1fr;
}

:where(.seoulex-root) .seoulex-dictionary > .dictionary-list > .dictionary-list__item--last{
    grid-column: 1 / -1;
}

:where(.seoulex-root) .seoulex-dictionary
    > .dictionary-list
    > .dictionary-list__item.dictionary-list__item--last
    > a{
    position: relative;
    background-color: #f9f9f9;
    border: 1px solid #ebebeb;
    align-items: center;
    padding: 14px 24px;
    height: 76px;
    box-sizing: border-box;
    border-radius: 16px;
    transition: background-color 0.2s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

:where(.seoulex-root) .seoulex-dictionary
    > .dictionary-list
    > .dictionary-list__item.dictionary-list__item--last
    > a:hover{
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
}

:where(.seoulex-root) .seoulex-dictionary > .dictionary-list > .dictionary-list__item > a > h2{
    font-size: 15px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .dictionary-list
    > .dictionary-list__item.dictionary-list__item--last
    > a
    > .dictionary-more{
    position: absolute;
    width: 35px;
    height: 20px;
    right: 20px;
    bottom: 18px;
}

:where(.seoulex-root) .post-section{
    grid-area: post;
}

:where(.seoulex-root) .post-section > .post-section__title > h1{
    font-size: 18px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .post-section__title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

:where(.seoulex-root) .post-section__title > a{
    font-size: 13px;
    color: var(--color-grayscale-grey-070);
    font-weight: 500;
    transition: color 0.2s ease;
}

:where(.seoulex-root) .post-section__title > a:hover{
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .sx-post-item{
    position: relative;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    padding: 24px;
    border-radius: 16px;
    border: solid 1px #ebebeb;
    background-color: #ffffff;
    width: 600px;
    height: 220px;
    box-sizing: border-box;
    overflow: hidden;
    transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.2s ease;
}

:where(.seoulex-root) .sx-post-item:hover{
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.07);
    transform: translateY(-3px);
    border-color: transparent;
}

:where(.seoulex-root) .sx-post-item > img{
    width: 220px;
    height: 170px;
    border-radius: 14px;
    object-fit: cover;
}

:where(.seoulex-root) .sx-post-item > .post-item__title > h2{
    margin-top: 4px;
    font-size: 16px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .sx-post-item > .post-item__title > p{
    margin-top: 12px;
    font-size: 15px;
    color: var(--color-grayscale-grey-080);
    line-height: 1.5;
}

:where(.seoulex-root) .sx-post-item > .post-item__title > span{
    cursor: pointer;
    position: absolute;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 116px;
    height: 40px;
    border-radius: 8px;
    border: none;
    background-color: rgba(36, 88, 255, 0.08);
    font-size: 13px;
    font-weight: 600;
    color: var(--color-system-info);
    transition: background-color 0.2s ease, transform 0.15s ease;
}

:where(.seoulex-root) .sx-post-item:hover > .post-item__title > span{
    background-color: rgba(36, 88, 255, 0.14);
    border-color: transparent;
    color: var(--color-system-info);
}

:where(.seoulex-root) .sx-post-item:active > .post-item__title > span{
    background-color: var(--color-system-info);
    color: var(--color-pure-wht);
    transform: scale(0.97);
}

:where(.seoulex-root) .article-info__company-name{
    margin-top: 12px;
    padding: 5px 8px;
    height: 24px;
    background-color: var(--color-grayscale-grey-040);
    display: inline-block;
    box-sizing: border-box;
    border-radius: 4px;
    height: 24px;
    font-size: 12px;
    color: var(--color-grayscale-grey-070);
}


:where(.seoulex-root) .popular-stock__whole-btn{
    width: 328px;
    margin: 16px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    border-radius: 8px;
    background-color: rgba(36, 88, 255, 0.1);
    color: var(--color-system-info);
    font-size: 16px;
    font-weight: bold;
}

:where(.seoulex-root) .popular-stock__whole-btn > span{
    position: relative;
    top: 2px;
}



:where(.seoulex-root) .recent-stock{
    width: 1080px;
    margin: 0 auto;
}

:where(.seoulex-root) .recent-stock__title{
    font-size: 18px;
    font-weight: bold;
    margin-top: 64px;
    margin-bottom: 16px;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .recent-stock__list{
    display: flex;
}

:where(.seoulex-root) .dictionary-list__item > a{
    width: 100%;
    height: 76px;
    padding: 14px 18px;
    border-radius: 16px;
    border: solid 1px #ebebeb;
    background-color: #ffffff;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: background-color 0.2s ease, box-shadow 0.25s ease, transform 0.25s ease;
    transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.2s ease;
}

:where(.seoulex-root) .dictionary-list__item > a:hover{
    background-color: #f9fafb;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
    border-color: transparent;
}

:where(.seoulex-root) .dictionary-list__item > a > .company-logo{
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: solid 1px var(--color-grayscale-grey-030);
    flex-shrink: 0;
    transition: border-color 0.2s ease;
}

:where(.seoulex-root) .dictionary-list__item > a:hover > .company-logo{
    border-color: transparent;
}

:where(.seoulex-root) .dictionary-list__item > a > .dictionary-title-wrapper{
    margin-left: 12px;
}

:where(.seoulex-root) .dictionary-list__item > a > .dictionary-title-wrapper > .dictionary-title{
    font-size: 16px;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .dictionary-list__item
    > a
    > .dictionary-title-wrapper
    > .dictionary-tag-wrapper
    > div{
    display: inline-block;
    box-sizing: border-box;
    height: 20px;
    margin-top: 4px;
    margin-right: 4px;
    padding: 1px 8px;
    border-radius: 4px;
    font-size: 12px;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .dictionary-tag-wrapper > div > span{
    position: relative;
    top: 1px;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .bio{
    background-color: #d1f6ee;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .semiconductor{
    background-color: #f6d1d1;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .game{
    background-color: #f6e6d1;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .ai{
    background-color: #d1e8f6;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .sw{
    background-color: #d1d4f6;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .platform{
    background-color: #e5d1f6;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .fintech{
    background-color: #f6d1f1;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .ecommerce{
    background-color: #edf6d1;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .manufacturing{
    background-color: #d1e6f6;
}

:where(.seoulex-root) .dictionary-tag-wrapper > .etc{
    background-color: #d9d9d9;
}

:where(.seoulex-root) .recent-item{
    display: block;
    width: 258px;
    height: 104px;
    padding: 12px;
    box-sizing: border-box;
    border: 1px solid var(--color-grayscale-grey-030);
    border-radius: 8px;
    margin-right: 16px;
}

:where(.seoulex-root) .recent-item__title{
    font-size: 16px;
    font-weight: 500;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .recent-item__price{
    font-size: 16px;
    font-weight: 500;
    color: var(--color-grayscale-grey100);
    margin-bottom: 10px;
}

:where(.seoulex-root) .recent-item__tag{
    display: inline-block;
    padding: 3px 8px;
    height: 20px;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--color-grayscale-grey100);
    border-radius: 4px;
}

:where(.seoulex-root) .recent-item__tag > span{
    position: relative;
    bottom: 1px;
}

:where(.seoulex-root) .bio{
    background-color: rgba(209, 246, 238, 0.2);
}

:where(.seoulex-root) .bio .recent-item__tag{
    background-color: #d1f6ee;
}

:where(.seoulex-root) .semiconductor{
    background-color: rgba(246, 209, 209, 0.2);
}

:where(.seoulex-root) .semiconductor .recent-item__tag{
    background-color: #f6d1d1;
}

:where(.seoulex-root) .game{
    background-color: rgba(246, 230, 209, 0.2);
}

:where(.seoulex-root) .game .recent-item__tag{
    background-color: #f6e6d1;
}

:where(.seoulex-root) .ai{
    background-color: rgba(209, 232, 246, 0.2);
}

:where(.seoulex-root) .ai .recent-item__tag{
    background-color: #d1e8f6;
}

:where(.seoulex-root) .sw{
    background-color: rgba(209, 212, 246, 0.2);
}

:where(.seoulex-root) .sw .recent-item__tag{
    background-color: #d1d4f6;
}

:where(.seoulex-root) .platform{
    background-color: rgba(229, 209, 246, 0.2);
}

:where(.seoulex-root) .platform .recent-item__tag{
    background-color: #e5d1f6;
}

:where(.seoulex-root) .fintech{
    background-color: rgba(246, 209, 241, 0.2);
}

:where(.seoulex-root) .fintech .recent-item__tag{
    background-color: #f6d1f1;
}

:where(.seoulex-root) .ecommerce{
    background-color: rgba(237, 246, 209, 0.2);
}

:where(.seoulex-root) .ecommerce .recent-item__tag{
    background-color: #edf6d1;
}

:where(.seoulex-root) .manufacturing{
    background-color: rgba(209, 230, 246, 0.2);
}

:where(.seoulex-root) .manufacturing .recent-item__tag{
    background-color: #d1e6f6;
}

:where(.seoulex-root) .etc{
    background-color: rgba(217, 217, 217, 0.2);
}

:where(.seoulex-root) .etc .recent-item__tag{
    background-color: #d9d9d9;
}

:where(.seoulex-root) .chart-wrapper{
    position: relative;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

:where(.seoulex-root) div.loading::before{
    content: "";
    background: url("/static/images/ic_graph_loading.svg");
    width: 20px;
    height: 20px;
    display: inline-block;
    position: absolute;
    z-index: 100;
    top: 28px;
    right: 30px;
    animation-duration: 1s;
    animation-name: rotate;
    animation-iteration-count: infinite;
}

:where(.seoulex-root) .whole-stock-title{
    padding-right: 17px;
    margin-bottom: 16px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

:where(.seoulex-root) .whole-stock-title > .title{
    display: flex;
    align-items: flex-end;
}

:where(.seoulex-root) .whole-stock-title > .title > h2{
    margin-right: 8px;
    font-weight: 700;
    font-size: 18px;
    line-height: 27px;
    color: #272727;
}

:where(.seoulex-root) .whole-stock-title > .title > span,:where(.seoulex-root) .whole-stock-title > .count{
    display: block;
    margin-bottom: 3px;
    font-size: 13px;
    line-height: 16px;
    color: #808080;
}

:where(.seoulex-root) .tui-grid-cell-header:first-child,:where(.seoulex-root) .tui-grid-cell:first-child{
    padding-left: 11px;
}

:where(.seoulex-root) .tui-grid-cell:last-child{
    padding-right: 11px;
}

:where(.seoulex-root) .tui-grid-cell-header:nth-child(5){
    padding-right: 20px;
}

:where(.seoulex-root) .more-button{
    width: 328px;
    margin: 16px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    border-radius: 8px;
    background-color: rgba(36, 88, 255, 0.1);
    color: var(--color-system-info);
    font-size: 16px;
    font-weight: bold;
}

:where(.seoulex-root) #grid{
    width: 100%;
    margin: 0 auto;
}


:where(.seoulex-root) .tui-grid-container,:where(.seoulex-root) .tui-grid-container p{
    font-family: "Spoqa Han Sans Neo", sans-serif;
    font-size: 16px;
}

:where(.seoulex-root) .tui-grid-scrollbar-y-inner-border{
    display: none;
}

:where(.seoulex-root) .page-content .tui-grid-header-area{
    background-color: #fff;
}

:where(.seoulex-root) .tui-grid-header-area tr:first-child{
    font-size: 12px;
}

:where(.seoulex-root) .tui-grid-btn-filter{
    display: none;
}

:where(.seoulex-root) div.tui-grid-scrollbar-right-top{
    display: none;
}

:where(.seoulex-root) .tui-grid-btn-sorting + span{
    display: none;
}

:where(.seoulex-root) .tui-grid-body-container{
    margin: 0;
    padding: 0;
    font-size: 16px;
}

:where(.seoulex-root) .tui-grid-body-container tr{
    cursor: pointer;
    border-bottom: 1px solid var(--color-grayscale-grey-030);
}

:where(.seoulex-root) .tui-grid-body-container td:first-child > div{
    font-weight: bold;
    color: var(--color-grayscale-grey100);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:where(.seoulex-root) .sort-wrapper{
    position: absolute;
    left: 0;
    top: 279px;
    z-index: 100;
}

:where(.seoulex-root) .tui-grid-btn-sorting{
    width: 14px;
    height: 14px;
    background-image: url("/static/images/ic_sort_default.svg");
    background-repeat: no-repeat;
    background-position: 0 0;
    border: none;
    background-color: transparent;
    position: absolute;
    bottom: 9px;
    right: -15px;
    z-index: 100;
}

:where(.seoulex-root) th:nth-child(5) .tui-grid-btn-sorting{
    right: 0;
}

:where(.seoulex-root) .tui-grid-btn-sorting-up{
    background-image: url("/static/images/ic_sort_up.svg");
}

:where(.seoulex-root) .tui-grid-btn-sorting-down{
    background-image: url("/static/images/ic_sort_down.svg");
}

:where(.seoulex-root) .price-up,:where(.seoulex-root) .ratio-up{
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    color: #fa372a;
}

:where(.seoulex-root) .price-down,:where(.seoulex-root) .ratio-down{
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    color: #2f79fa;
}

:where(.seoulex-root) .price-freeze,:where(.seoulex-root) .ratio-freeze{
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    color: #a8a8a8;
}

:where(.seoulex-root) .price-up::before,:where(.seoulex-root) .ratio-up::before{
    content: "+";
}

:where(.seoulex-root) .price-down::before,:where(.seoulex-root) .ratio-down::before{
    content: "-";
}

:where(.seoulex-root) .tui-grid-no-scroll-x .tui-grid-border-line-bottom{
    border-bottom: none;
}

:where(.seoulex-root) .tui-grid-layer-focus > .tui-grid-layer-focus-border{
    display: none;
}

:where(.seoulex-root) .tui-grid-cell-header{
    position: relative;
    overflow: visible;
    cursor: pointer;
}

:where(.seoulex-root) [data-column-name="display_name"] .tui-grid-btn-sorting{
    left: 22px;
}


@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

:where(.seoulex-root) .tui-grid-layer-state p{
    position: relative;
    top: 0;
    margin-top: 50px;
}

:where(.seoulex-root) .tui-grid-container ::-webkit-scrollbar{
    display: none;
}

:where(.seoulex-root) .tui-grid-rside-area .tui-grid-header-area .tui-grid-table{
    margin-right: 0;
}

:where(.seoulex-root) .tui-grid-layer-state-loading{
    width: 20px;
    height: 20px;
    display: inline-block;
    margin: 50px 0 0 0;
    background: url("/static/images/ic_grid_loading.svg");
}

:where(.seoulex-root) .tui-grid-border-line-top{
    display: none;
}


:where(.seoulex-root) .issue-grid-wrapper{
    width: 1080px;
    padding: 80px 20px 0px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 600px 400px;
    grid-template-areas: "news-list qna";
    column-gap: 68px;
    overflow: visible;
}

:where(.seoulex-root) .news-list-section{
    grid-area: news-list;
}

:where(.seoulex-root) .news-list-section__title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

:where(.seoulex-root) .news-list-section__title > span:first-child{
    font-size: 18px;
    font-weight: bold;
    color: var(--color-grayscale-grey100);
}

:where(.seoulex-root) .today-date-text{
    color: var(--color-grayscale-grey-070, #999);
    font-size: 13px;
    font-weight: 400;
}

:where(.seoulex-root) .sx-news-item  > a{
    display: flex;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid #E9E9E9;
}

:where(.seoulex-root) .sx-news-item > a > .sx-stock-name{
    display: block;
    overflow: hidden;
    color: #272727;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: 700;
    min-width: 120px;
    width: 120px;
    white-space: nowrap;
}

:where(.seoulex-root) .sx-news-item > a > .sx-news-title{
    display: block;
    padding-left: 8px;
    overflow: hidden;
    color: #272727;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 400;
}

:where(.seoulex-root) .weekly-issue-section{
    grid-area: weekly-issue;
    overflow: visible;
}

:where(.seoulex-root) .weekly-issue-section-title{
    display: block;
    padding: 8px 0 16px;
    color: #272727;
    font-size: 15px;
    font-weight: 700;
    border-bottom: 1px solid #272727;
}

:where(.seoulex-root) .weekly-issue{
    padding: 20px 0;
    border-top: 1px solid #e9e9e9;
    position: relative;
    overflow: visible;
}

:where(.seoulex-root) .issue-title{
    display: flex;
    align-items: flex-end;
}

:where(.seoulex-root) .issue-title > .stock-logo{
    width: 30px;
    height: 30px;
    border-radius: 4px;
    border: 1px solid rgba(39, 39, 39, 0.1);
    box-sizing: border-box;
}

:where(.seoulex-root) .issue-title > .sx-stock-name{
    display: block;
    margin-bottom: 2px;
    padding-left: 8px;
    color: #272727;
    font-size: 16px;
    font-weight: 700;
}

:where(.seoulex-root) .issue-title > .date{
    margin: 0px 0px 2px auto;
    color: #A8A8A8;
    text-align: right;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .issue-description{
    margin-top: 12px;
    color: #272727;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    display: -webkit-box;
    overflow: hidden;
    height: 88px;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

:where(.seoulex-root) .issue-tooltip{
    display: none;
    z-index: 100;
    top: 65px;
    left: 0;
    position: absolute;
    width: 400px;
    padding: 20px 20px 24px 20px;
    box-sizing: border-box;
    color: #272727;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    border-radius: 2px;
    border: 1px solid #E9E9E9;
    background: #FFF;
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.10);
}

:where(.seoulex-root) .issue-description:hover + .issue-tooltip,:where(.seoulex-root) .issue-tooltip:hover{
    display: block;
}

:where(.seoulex-root) .issue-tooltip > ol,:where(.seoulex-root) .issue-tooltip > ul{
    padding-left: 16px;
}

:where(.seoulex-root) .bold{
    font-weight: 700;
}
/* ==== stock-list-desktop.css ==== */


:where(.seoulex-root) .whole-stocks{
    margin: 40px auto 80px;
    width: 1080px;
    padding: 0 20px;
}

:where(.seoulex-root) .whole-stocks__title{
    font-size: 24px;
    font-weight: 700;
    color: var(--color-grayscale-grey100, #272727);
    margin: 0 0 24px;
}


:where(.seoulex-root) .input-element{
    display: flex;
    align-items: center;
    border: 1px solid #ececec;
    border-radius: 12px;
    padding: 0 16px;
    margin-bottom: 24px;
    transition: border-color 0.15s;
}

:where(.seoulex-root) .input-element:focus-within{
    border-color: #272727;
}

:where(.seoulex-root) .input-element > div{
    width: 100%;
    box-sizing: border-box;
    padding: 13px 0;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .grid-input{
    width: 100%;
    margin-left: 8px;
    font-size: 15px;
    border: none;
    outline: none;
    background: transparent;
}

:where(.seoulex-root) #search-delete{
    cursor: pointer;
}

:where(.seoulex-root) #search-delete.none{
    display: none;
}


:where(.seoulex-root) #grid-wrapper{
    min-height: 200px;
    max-height: calc(100vh - 180px);
    overflow-y: auto;
    border-bottom: 1px solid #ededed;
}

:where(.seoulex-root) #grid-wrapper::-webkit-scrollbar{
    width: 8px;
}

:where(.seoulex-root) #grid-wrapper::-webkit-scrollbar-thumb{
    background: #d6d6d6;
    border-radius: 4px;
}

:where(.seoulex-root) #grid-wrapper::-webkit-scrollbar-track{
    background: transparent;
}

:where(.seoulex-root) .stock-loading,:where(.seoulex-root) .stock-empty{
    text-align: center;
    color: #999;
    padding: 60px 0;
    font-size: 14px;
}

:where(.seoulex-root) .sx-stock-table{
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

:where(.seoulex-root) .sx-stock-table thead th{
    padding: 12px;
    font-size: 13px;
    font-weight: normal;
    color: #9f9f9f;
    border-bottom: 1px solid #ededed;
    text-align: right;
    white-space: nowrap;
    user-select: none;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 2;
}

:where(.seoulex-root) .sx-stock-table thead th.col-name{
    text-align: left;
    width: 280px;
}

:where(.seoulex-root) .sx-stock-table thead th.sortable{
    cursor: pointer;
    transition: color 0.15s;
}

:where(.seoulex-root) .sx-stock-table thead th.sortable:hover{
    color: #272727;
}

:where(.seoulex-root) .sx-stock-table thead th.sorted{
    color: #272727;
    font-weight: 600;
}

:where(.seoulex-root) .sx-stock-table .sx-sort-arrow{
    display: inline-block;
    margin-left: 4px;
    font-size: 10px;
    vertical-align: middle;
}

:where(.seoulex-root) .sx-stock-table tbody tr{
    height: 64px;
    border-bottom: 1px solid #f5f5f5;
    cursor: pointer;
    transition: background-color 0.15s;
}

:where(.seoulex-root) .sx-stock-table tbody tr:hover{
    background: #fafafa;
}

:where(.seoulex-root) .sx-stock-table tbody td{
    padding: 0 12px;
    font-size: 15px;
    font-weight: bold;
    color: var(--color-grayscale-grey100, #272727);
    text-align: right;
    vertical-align: middle;
}

:where(.seoulex-root) .sx-stock-table tbody td.col-name{
    text-align: left;
}

:where(.seoulex-root) .sx-stock-table tbody td.col-name a{
    color: inherit;
    text-decoration: none;
    display: block;
}

:where(.seoulex-root) .sx-stock-table .name-cell{
    display: flex;
    align-items: center;
    gap: 10px;
}

:where(.seoulex-root) .sx-stock-table .name-cell img{
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    object-fit: cover;
    flex-shrink: 0;
    background: #fff;
}

:where(.seoulex-root) .sx-stock-table .name-cell span{
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:where(.seoulex-root) .sx-stock-table .no-price{
    color: #ababab;
    font-weight: normal;
}

:where(.seoulex-root) .sx-stock-table .sx-up{ color: #fa372a; }
:where(.seoulex-root) .sx-stock-table .sx-down{ color: #2f79fa; }

:where(.seoulex-root) .sx-stock-table td.col-adp.sx-up::before,:where(.seoulex-root) .sx-stock-table td.col-pct.sx-up::before{ content: "+"; }

:where(.seoulex-root) .sx-stock-table td.col-adp.sx-down::before,:where(.seoulex-root) .sx-stock-table td.col-pct.sx-down::before{ content: "-"; }

/* ==== stock-ipo-schedule-desktop.css ==== */



:where(.seoulex-root) .ipo-schedule-banner{
    width: 1200px;
    height: 300px;
    margin-bottom: 60px;
    border-radius: 12px;
    overflow: hidden;
}

:where(.seoulex-root) .ipo-schedule-banner > a{
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}

:where(.seoulex-root) .ipo-schedule-banner > a > img{
    height: 100%;
    object-fit: cover;
}


:where(.seoulex-root) .ipo-title-wrapper{
    min-width: 1440px;
    background-color: #1f2e45;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

:where(.seoulex-root) .ipo-title{
    display: block;
    width: 1200px;
    font-weight: 700;
    color: #fff;
    font-size: 24px;
}


:where(.seoulex-root) .ipo-calender{
    margin: 95px auto 0;
    width: 1200px;
    overflow: visible;
}

:where(.seoulex-root) .ipo-calender-title-wrapper{
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    overflow: visible;
}

:where(.seoulex-root) .ipo-popup-title-wrapper{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

:where(.seoulex-root) .ipo-popup-title-wrapper > img{
    width: 15px;
    height: 15px;
    cursor: pointer;
}

:where(.seoulex-root) .ipo-calender-title{
    color: #272727;
    font-size: 24px;
    font-weight: 700;
}


:where(.seoulex-root) .ipo-popup-button-wrapper{
    position: relative;
    overflow: visible;
}

:where(.seoulex-root) .ipo-popup-button{
    line-height: 1;
    display: flex;
    padding: 8px 16px;
    align-items: center;
    border-radius: 50px;
    background: #f4f4f4;
    border: none;
    margin-left: 16px;
    color: #272727;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.2s;
}

:where(.seoulex-root) .ipo-popup-button:hover{
    background-color: #eaeaea;
}

:where(.seoulex-root) .ipo-popup-button > img{
    margin-left: 8px;
}


:where(.seoulex-root) .ipo-popup{
    position: absolute;
    left: 16px;
    top: 40px;
    z-index: 100;
    display: flex;
    width: 360px;
    padding: 20px 20px 24px 20px;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 12px;
    border: 1px solid #e9e9e9;
    background: #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    word-break: keep-all;
}

:where(.seoulex-root) .ipo-popup-title{
    margin-bottom: 8px;
    color: #272727;
    font-size: 14px;
    font-weight: 700;
}

:where(.seoulex-root) .ipo-popup > ol > li:last-child > p{
    margin-bottom: 0;
}

:where(.seoulex-root) .ipo-popup-description{
    margin: 4px 0 12px;
    color: #272727;
    font-size: 14px;
    line-height: 22px;
}

:where(.seoulex-root) .ipo-popup-divider{
    margin-bottom: 12px;
    width: 100%;
    height: 1px;
    background: #ececec;
}

:where(.seoulex-root) .ipo-popup > ol{
    list-style: none;
}

:where(.seoulex-root) .ipo-popup-content-list{
    margin-bottom: 8px;
    padding: 8px 12px 8px 30px;
    list-style-type: disc;
    border-radius: 8px;
    background: #f4f4f4;
    font-size: 12px;
    line-height: 20px;
}

:where(.seoulex-root) .ipo-popup-content-list > li::marker{
    font-size: 10px;
}


:where(.seoulex-root) .divider{
    width: 100%;
    height: 2px;
    background-color: #272727;
}

:where(.seoulex-root) .thin{
    height: 1px;
}

:where(.seoulex-root) .grey{
    background-color: #ececec;
}


:where(.seoulex-root) .ipo-calender > h3{
    margin-top: 40px;
    margin-bottom: 16px;
    color: #272727;
    font-size: 18px;
    font-weight: 700;
}


:where(.seoulex-root) .ipo-item-list{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

:where(.seoulex-root) .ipo-item-list.empty{
    display: block;
}

:where(.seoulex-root) .ipo-item{
    margin-bottom: 16px;
    width: 592px;
    padding: 28px;
    box-sizing: border-box;
    border: 1px solid #ececec;
    border-radius: 12px;
    background: #fff;
    transition: box-shadow 0.2s, border-color 0.2s;
}

:where(.seoulex-root) .ipo-item:hover{
    border-color: #d8d8d8;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

:where(.seoulex-root) .ipo-item:nth-child(2n -1){
    margin-right: 16px;
}

:where(.seoulex-root) .ipo-item h4{
    margin-bottom: 16px;
    color: #272727;
    font-size: 18px;
    font-weight: 700;
}

:where(.seoulex-root) .stock-detail-link span:first-child{
    text-decoration: underline;
}

:where(.seoulex-root) .dday{
    margin-left: 2px;
    color: #e02b35;
    font-size: 14px;
    font-weight: 700;
}

:where(.seoulex-root) .ipo-item > ul{
    margin-top: 16px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

:where(.seoulex-root) .ipo-item > ul > li{
    color: #272727;
    font-size: 14px;
}

:where(.seoulex-root) .ipo-item > ul > li > span:first-child{
    color: #808080;
}


:where(.seoulex-root) .more-button{
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 4px;
    width: 196px;
    height: 44px;
    border-radius: 12px;
    border: 1px solid #e6e6e6;
    background: #fff;
    color: #808080;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

:where(.seoulex-root) .more-button:hover{
    background-color: #fafafa;
    border-color: #d0d0d0;
}


:where(.seoulex-root) .empty-subscription-plan,:where(.seoulex-root) .empty-listing-plan{
    position: relative;
    width: 100%;
    display: flex;
    height: 164px;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    font-size: 14px;
    border-radius: 12px;
    background: #fafafa;
}



:where(.seoulex-root) .ipo-schedule{
    margin: 80px auto 200px;
    width: 1200px;
    overflow: visible;
}

:where(.seoulex-root) .ipo-schedule-title{
    color: #272727;
    font-size: 24px;
    font-weight: 700;
}


:where(.seoulex-root) .ipo-schedule-menu{
    border-top: none;
    border-bottom: none;
    margin-top: 16px;
    display: flex;
    overflow: visible;
    background-color: #f4f4f4;
    border-radius: 12px;
    padding: 4px;
    box-sizing: border-box;
}

:where(.seoulex-root) .ipo-schedule-menu > li{
    display: flex;
    align-items: center;
    position: relative;
    overflow: visible;
}

:where(.seoulex-root) .ipo-schedule-menu .menu-item{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    padding: 9px 10px 8px 10px;
    height: 48px;
    box-sizing: border-box;
    flex: 1 0 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    border-radius: 10px;
    transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
}

:where(.seoulex-root) .menu-item:hover{
    color: #555;
}

:where(.seoulex-root) .menu-item > img{
    margin-left: 4px;
    filter: invert(68%) sepia(4%) saturate(8%) hue-rotate(358deg)
        brightness(101%) contrast(81%);
}


:where(.seoulex-root) .ipo-semi-popup{
    word-break: keep-all;
    position: absolute;
    top: 50px;
    left: 62px;
    width: 360px;
    padding: 20px 20px 24px 20px;
    border-radius: 12px;
    border: 1px solid #e9e9e9;
    background: #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    z-index: 999;
}

:where(.seoulex-root) .ipo-semi-popup-content-list{
    padding-left: 10px;
    list-style: disc;
    color: #272727;
    font-size: 12px;
    line-height: 20px;
}

:where(.seoulex-root) .ipo-semi-popup-content-list > li::marker{
    font-size: 10px;
}


:where(.seoulex-root) .next-icon{
    padding: 0 4px;
    color: #c0c0c0;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
}


:where(.seoulex-root) .ipo-schedule-menu .menu-item.selected{
    background: #1f2e45;
    color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

:where(.seoulex-root) .selected > img{
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg)
        brightness(200%) contrast(100%);
}


:where(.seoulex-root) .ipo-schedule-table-title{
    margin: 40px 0 16px;
    color: #272727;
    font-size: 18px;
    font-weight: 700;
}


:where(.seoulex-root) .ipo-table{
    width: 100%;
    color: #272727;
    border: 1px solid #ececec;
    border-radius: 12px;
    overflow: hidden;
    word-break: keep-all;
}

:where(.seoulex-root) .ipo-table-header{
    font-size: 12px;
    height: 40px;
    background-color: #f7f8fa;
    border-bottom: 1px solid #ececec;
}

:where(.seoulex-root) .ipo-table-row{
    color: #272727;
    font-size: 14px;
    font-weight: 700;
    min-height: 60px;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.15s;
}

:where(.seoulex-root) .ipo-table-row:last-child{
    border-bottom: none;
}

:where(.seoulex-root) .ipo-table-row:hover{
    background-color: #fafbfc;
}

:where(.seoulex-root) .ipo-table-header,:where(.seoulex-root) .ipo-table-row{
    display: flex;
    align-items: center;
    padding-right: 16px;
    box-sizing: border-box;
}

:where(.seoulex-root) .ipo-table-row > td{
    word-break: break-all;
    font-size: 14px;
    line-height: 20px;
    color: #272727;
    padding: 12px 0;
}

:where(.seoulex-root) .ipo-table-header > th:first-child,:where(.seoulex-root) .ipo-table-row > td:first-child{
    flex: 100 0 0;
    padding-left: 28px;
    text-align: left;
}

:where(.seoulex-root) .ipo-table-row > td:first-child{
    font-size: 16px;
}

:where(.seoulex-root) .ipo-table-header > th:nth-child(2),:where(.seoulex-root) .ipo-table-row > td:nth-child(2){
    text-align: left;
    flex: 55 0 0;
}

:where(.seoulex-root) .ipo-table-header > th:nth-child(3),:where(.seoulex-root) .ipo-table-row > td:nth-child(3){
    text-align: left;
    flex: 55 0 0;
}

:where(.seoulex-root) .ipo-table-header > th:nth-child(4),:where(.seoulex-root) .ipo-table-row > td:nth-child(4){
    text-align: left;
    flex: 47 0 0;
}

:where(.seoulex-root) .ipo-table-header > th:nth-child(5),:where(.seoulex-root) .ipo-table-row > td:nth-child(5){
    text-align: left;
    flex: 43 0 0;
}


:where(.seoulex-root) .request-company-row > td:nth-child(4),:where(.seoulex-root) .request-company-row > td:nth-child(5){
    font-weight: normal;
}

:where(.seoulex-root) .approval-company-row > td:nth-child(4),:where(.seoulex-root) .approval-company-row > td:nth-child(5){
    font-weight: normal;
}

:where(.seoulex-root) .registration-statement-row > td:nth-child(2),:where(.seoulex-root) .registration-statement-row-header > th:nth-child(2){
    font-weight: normal;
}

:where(.seoulex-root) .registration-statement-row > td:nth-child(5){
    font-weight: normal;
}

:where(.seoulex-root) .demand-forecast-row > td:nth-child(2),:where(.seoulex-root) .demand-forecast-row-header > th:nth-child(2){
    font-weight: normal;
}

:where(.seoulex-root) .demand-forecast-row > td:nth-child(5){
    font-weight: normal;
}

:where(.seoulex-root) .public-offering-row > td:nth-child(5){
    font-weight: normal;
}

:where(.seoulex-root) .listing-row > td:nth-child(4),:where(.seoulex-root) .listing-row > td:nth-child(5){
    font-weight: normal;
}



:where(.seoulex-root) .invisible{
    width: 0px;
    height: 0px;
    padding: 0;
    margin: 0;
    border: none;
    box-sizing: border-box;
    overflow: hidden;
    visibility: hidden;
}

:where(.seoulex-root) .ipo-hidden{
    display: none;
}

:where(.seoulex-root) .ipo-more-button{
    display: block;
    margin: 20px auto;
    padding: 10px 28px;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 12px;
    font-size: 13px;
    color: #808080;
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

:where(.seoulex-root) .ipo-more-button:hover{
    background-color: #fafafa;
    border-color: #d0d0d0;
}

:where(.seoulex-root) .none{
    display: none;
}




:where(.seoulex-root) .ipo-top-layout{
    display: flex;
    gap: 24px;
    margin: 30px 0 50px;
    align-items: flex-start;
}

:where(.seoulex-root) .ipo-calendar-view{
    width: 55%;
    flex-shrink: 0;
    border: 1px solid #ececec;
    border-radius: 12px;
    padding: 24px;
    box-sizing: border-box;
    background: #fff;
}

:where(.seoulex-root) .calendar-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

:where(.seoulex-root) .calendar-month-title{
    font-size: 18px;
    font-weight: 700;
    color: #272727;
}

:where(.seoulex-root) .calendar-prev,:where(.seoulex-root) .calendar-next{
    border: none;
    background: transparent;
    font-size: 18px;
    cursor: pointer;
    padding: 8px 16px;
    border-radius: 8px;
    color: #272727;
    transition: background-color 0.15s;
}

:where(.seoulex-root) .calendar-prev:hover,:where(.seoulex-root) .calendar-next:hover{
    background: #f4f4f4;
}

:where(.seoulex-root) .calendar-weekdays{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    text-align: center;
    color: #808080;
    font-size: 13px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ececec;
}

:where(.seoulex-root) .calendar-grid{
    overflow: hidden;
}


:where(.seoulex-root) .calendar-week{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: auto;
    min-height: 70px;
    border-bottom: 1px solid #f5f5f5;
}


:where(.seoulex-root) .calendar-day-num{
    padding: 6px 8px 2px;
    font-size: 13px;
    font-weight: 500;
    color: #272727;
    z-index: 1;
}

:where(.seoulex-root) .calendar-day-num.other-month{
    opacity: 0.3;
}

:where(.seoulex-root) .calendar-day-num.today{
    font-weight: 700;
    color: #e02b35;
}


:where(.seoulex-root) .calendar-today-col{
    grid-row: 1 / -1;
    background: #fff8f0;
    border-radius: 8px;
    pointer-events: none;
    z-index: 0;
}



:where(.seoulex-root) .calendar-day-num .calendar-badges{
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 2px;
    overflow: hidden;
}

:where(.seoulex-root) .calendar-badge{
    padding: 2px 4px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

:where(.seoulex-root) .calendar-badge-subscription{ background-color: #f8d0d3; color: #b71c2a; }
:where(.seoulex-root) .calendar-badge-forecast{ background-color: #d4e4fd; color: #1a5cc8; }
:where(.seoulex-root) .calendar-badge-listing{ background-color: #d0f0da; color: #0a8a2e; }
:where(.seoulex-root) .calendar-badge-request{ background-color: #fde8c8; color: #b37a12; }
:where(.seoulex-root) .calendar-badge-approval{ background-color: #e8ddf8; color: #6b3fbd; }
:where(.seoulex-root) .calendar-badge-report{ background-color: #e5e5e5; color: #555; }
:where(.seoulex-root) .calendar-badge-offering{ background-color: #f8d0d3; color: #b71c2a; }


:where(.seoulex-root) .calendar-event-rows{
    grid-column: 1 / -1;
    min-height: 4px;
    padding: 2px 0 4px;
}


:where(.seoulex-root) .calendar-bar{
    height: 18px;
    border-radius: 4px;
    padding: 0 5px;
    font-size: 10px;
    font-weight: 500;
    line-height: 18px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    transition: opacity 0.15s;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
}

:where(.seoulex-root) .calendar-bar:hover{
    opacity: 0.85;
}

:where(.seoulex-root) .calendar-bar.continues-left{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

:where(.seoulex-root) .calendar-bar.continues-right{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

:where(.seoulex-root) .calendar-bar-subscription{ background-color: #f8d0d3; color: #b71c2a; }
:where(.seoulex-root) .calendar-bar-forecast{ background-color: #d4e4fd; color: #1a5cc8; }
:where(.seoulex-root) .calendar-bar-listing{ background-color: #d0f0da; color: #0a8a2e; }
:where(.seoulex-root) .calendar-bar-request{ background-color: #fde8c8; color: #b37a12; }
:where(.seoulex-root) .calendar-bar-approval{ background-color: #e8ddf8; color: #6b3fbd; }
:where(.seoulex-root) .calendar-bar-report{ background-color: #e5e5e5; color: #555; }
:where(.seoulex-root) .calendar-bar-offering{ background-color: #f8d0d3; color: #b71c2a; }


:where(.seoulex-root) .ipo-sidebar{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

:where(.seoulex-root) .ipo-sidebar-section{
    padding: 0;
    background: #fff;
}

:where(.seoulex-root) .ipo-sidebar-section > h3{
    margin: 0 0 16px;
    color: #272727;
    font-size: 16px;
    font-weight: 700;
}

:where(.seoulex-root) .ipo-sidebar .ipo-item{
    width: 100%;
    padding: 12px;
    font-size: 12px;
    margin-bottom: 8px;
}

:where(.seoulex-root) .ipo-sidebar .ipo-item h4{
    font-size: 13px;
    margin-bottom: 8px;
}

:where(.seoulex-root) .ipo-sidebar .ipo-item > ul{
    grid-template-columns: 1fr;
    gap: 6px;
}

:where(.seoulex-root) .ipo-sidebar .ipo-item > ul > li{
    font-size: 13px;
}

:where(.seoulex-root) .ipo-sidebar .empty-subscription-plan,:where(.seoulex-root) .ipo-sidebar .empty-listing-plan{
    height: 100px;
    font-size: 13px;
}

:where(.seoulex-root) .ipo-sidebar .ipo-item.invisible{
    display: none;
}

:where(.seoulex-root) .ipo-sidebar .more-button{
    margin-top: 4px;
    width: 100%;
    height: 36px;
    font-size: 12px;
}


:where(.seoulex-root) .calendar-legend{
    display: flex;
    justify-content: flex-end;
    margin-bottom: 12px;
}

:where(.seoulex-root) .legend-item{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 16px;
    font-size: 12px;
    color: #808080;
    cursor: pointer;
    user-select: none;
    transition: color 0.15s;
}

:where(.seoulex-root) .legend-item:hover{
    color: #272727;
}

:where(.seoulex-root) .legend-item.selected{
    color: #272727;
    font-weight: 700;
}

:where(.seoulex-root) .legend-dot{
    width: 20px;
    height: 10px;
    border-radius: 3px;
    display: inline-block;
    transition: opacity 0.15s, transform 0.15s;
}

:where(.seoulex-root) .legend-item.selected .legend-dot{
    transform: scale(1.1);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}

:where(.seoulex-root) .legend-subscription{ background-color: #f8d0d3; }
:where(.seoulex-root) .legend-forecast{ background-color: #d4e4fd; }
:where(.seoulex-root) .legend-listing{ background-color: #d0f0da; }
:where(.seoulex-root) .legend-request{ background-color: #fde8c8; }
:where(.seoulex-root) .legend-approval{ background-color: #e8ddf8; }


:where(.seoulex-root) .ipo-calendar-view[data-active-filter] .calendar-bar,:where(.seoulex-root) .ipo-calendar-view[data-active-filter] .calendar-badge{
    opacity: 0.2;
    transition: opacity 0.2s;
}

:where(.seoulex-root) .ipo-calendar-view[data-active-filter="subscription"] .calendar-bar-subscription,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="subscription"] .calendar-badge-subscription,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="forecast"] .calendar-bar-forecast,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="forecast"] .calendar-badge-forecast,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="listing"] .calendar-bar-listing,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="listing"] .calendar-badge-listing,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="request"] .calendar-bar-request,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="request"] .calendar-badge-request,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="approval"] .calendar-bar-approval,:where(.seoulex-root) .ipo-calendar-view[data-active-filter="approval"] .calendar-badge-approval{
    opacity: 1;
}

:where(.seoulex-root) .ipo-calendar-view[data-active-filter] .legend-item:not(.selected) .legend-dot{
    opacity: 0.35;
}


:where(.seoulex-root) .calendar-tooltip{
    display: none;
    position: fixed;
    z-index: 9999;
    padding: 4px 10px;
    border-radius: 6px;
    background: #272727;
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    transform: translateX(-50%);
    pointer-events: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}


:where(.seoulex-root) .calendar-bar.past-event,:where(.seoulex-root) .calendar-badge.past-event{
    background-color: #e5e5e5 !important;
    color: #aaa !important;
}


:where(.seoulex-root) .ongoing-section > h3{
    color: #272727;
}

:where(.seoulex-root) .ongoing-item{
    border-color: #ececec !important;
    background: #fff !important;
}

:where(.seoulex-root) .ongoing-item.ongoing-subscription{
    border-color: #f8d0d3 !important;
    background: #fffafa !important;
}

:where(.seoulex-root) .ongoing-item.ongoing-forecast{
    border-color: #d4e4fd !important;
    background: #f8fbff !important;
}

:where(.seoulex-root) .ongoing-item h4{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

:where(.seoulex-root) .ongoing-badge{
    display: inline-block;
    margin-left: auto;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    vertical-align: middle;
}

:where(.seoulex-root) .ongoing-badge.badge-subscription{
    background-color: #b71c2a;
}

:where(.seoulex-root) .ongoing-badge.badge-forecast{
    background-color: #1a5cc8;
}

:where(.seoulex-root) .empty-ongoing{
    display: flex;
    height: 100px;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    font-size: 13px;
    border-radius: 12px;
    background: #fafafa;
}

/* ==== faq-base-desktop.css ==== */




:where(.seoulex-root) .actual-body{
    width: 1440px;
    padding: 0px 180px;
    box-sizing: border-box;
}

:where(.seoulex-root) .title{
    margin-bottom: 16px;
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    color: #272727;
}

:where(.seoulex-root) .faq-section{
    display: flex;
    align-items: center;
    padding: 20px 0;
    border-top: 1px solid #272727;
    border-bottom: 1px solid #272727;
}

:where(.seoulex-root) .faq-section > li{
    margin-right: 4px;
    border: 1px solid #e9e9e9;
    border-radius: 100px;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    font-weight: 400;
    color: #a8a8a8;
}

:where(.seoulex-root) .faq-section > li.selected{
    background: #f2f4f7;
    border: 1px solid #e9e9e9;
    font-weight: 700;
    color: #272727;
}

:where(.seoulex-root) .faq-section > li > a{
    display: block;
    padding: 12px 16px;
}

/* ==== faq-list-desktop.css ==== */
:where(.seoulex-root) .faq{
    border-bottom: 1px solid #e9e9e9;
}

:where(.seoulex-root) .faq > a{
    font-weight: 700;
    font-size: 18px;
    line-height: 23px;
    color: #272727;
    padding: 24px 0;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .faq > a > img{
    width: 32px;
    height: 32px;
    margin-right: 12px;
}

/* ==== stock-price-info-modal-base.css ==== */
:where(.seoulex-root) .left-section{
    position: relative;
}

:where(.seoulex-root) .price-info-button{
    margin-left: 4px;
    position: relative;
    top: 1px;
    cursor: pointer;
}

:where(.seoulex-root) .price-info-modal{
    right: 0;
    position: absolute;
    width: 328px;
    box-sizing: border-box;
    padding: 20px;
    border-radius: 2px;
    border: 1px solid #E9E9E9;
    background: #FFF;
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.10);
    z-index: 10000;
}

:where(.seoulex-root) .price-info-modal-close-button{
    position: absolute;
    top: 16px;
    right: 16px;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

:where(.seoulex-root) .tooltip-title{
    margin-bottom: 12px;
    color: #272727;
    font-size: 14px;
    font-weight: 700;
}

:where(.seoulex-root) .tooltip-content{
    margin-bottom: 20px;
    color: #272727;
    font-size: 14px;
    line-height: 22px; 
}

:where(.seoulex-root) li:last-child > .tooltip-content{
    margin-bottom: 0px;
}
/* ==== stock-detail-desktop.css ==== */
:where(.seoulex-root) .stock-detail-wrapper{
    display: flex;
    justify-content: space-between;
    width: 1200px;
    margin: 0 auto;
    padding: 120px;
}

:where(.seoulex-root) .left-section{
    width: 710px;
}

:where(.seoulex-root) .base-info-title-wrapper{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
}

:where(.seoulex-root) .base-info-title{
    color: #272727;
    font-size: 24px;
    font-weight: 700;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .stock-ipo-status{
    margin-left: 8px;
    display: inline-flex;
    padding: 6px 12px;
    align-items: center;
    color: #272727;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    border-radius: 20px;
    background: #f4f4f4;
}

:where(.seoulex-root) .stock-ipo-status.registration{
    color: #0db83c;
    background-color: #f2fff6;
}

:where(.seoulex-root) .stock-ipo-status.public-offering{
    color: #e02b35;
    background-color: #fff3f2;
}

:where(.seoulex-root) .stock-ipo-status > span{
    margin-left: 4px;
    font-weight: 400;
}

:where(.seoulex-root) .price-wrapper > .decline{
    margin-right: 12px;
    color: #a8a8a8;
    text-align: right;
    font-size: 12px;
    font-weight: 700;
}

:where(.seoulex-root) .price-wrapper.sx-up > .decline{
    color: #fa372a;
}

:where(.seoulex-root) .price-wrapper.sx-down > .decline{
    color: #2f79fa;
}

:where(.seoulex-root) .price-wrapper > .sx-price{
    color: #272727;
    text-align: right;
    font-size: 18px;
    font-weight: 700;
}

:where(.seoulex-root) .price-wrapper > .sx-price.pause-trade{
    font-weight: 400;
}

:where(.seoulex-root) .price-wrapper > .sx-price.non-aggregation,:where(.seoulex-root) .price-wrapper > .sx-price.list-other-market{
    color: #A8A8A8;
    font-weight: 400;
}

:where(.seoulex-root) .company-state-wrapper{
    font-size: 12px;
    padding: 16px;
    border: 1px solid #e9e9e9;
    background-color: #f4f4f4;
    border-radius: 12px;
}

:where(.seoulex-root) .company-state-wrapper.caution{
    border: 1px solid #ffe5e3;
    background-color: #FFFFFF;
}

:where(.seoulex-root) .company-state-wrapper.caution span,:where(.seoulex-root) .company-state-wrapper.caution p{
    color: #F40029;
}

:where(.seoulex-root) .company-state-title-wrapper{
    display: flex;
}

:where(.seoulex-root) .company-state-title{
    font-weight: 700;
}

:where(.seoulex-root) .company-state-wrapper.caution > .company-state-title-wrapper > .company-state-title{
    margin-left: 4px;
}

:where(.seoulex-root) .company-state-caution-img{
    width: 15px;
    height: 15px;
    background-image: url("/static/images/ic-warning-red.svg");
    background-repeat: no-repeat;
}

:where(.seoulex-root) .company-state-description{
    margin-top: 8px;
}

:where(.seoulex-root) .base-info-description{
    margin: 28px 0;
    color: #272727;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
}

:where(.seoulex-root) .base-info-list{
    padding: 24px 20px;
    display: grid;
    grid-template-columns: 50% 50%;
    background-color: #f9f9f9;
    border-radius: 12px;
    gap: 9px;
}

:where(.seoulex-root) .base-info{
    display: flex;
    overflow: hidden;
}

:where(.seoulex-root) .base-info > span:first-child{
    margin-right: 12px;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    white-space: nowrap;
}

:where(.seoulex-root) .base-info > span:nth-child(2){
    color: #272727;
    font-size: 14px;
    font-weight: 400;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:where(.seoulex-root) .base-info > a:nth-child(2){
    color: #272727;
    font-size: 14px;
    font-weight: 400;
    text-decoration: underline;
}

:where(.seoulex-root) .left-section-title{
    margin-top: 80px;
    padding: 16px 0;
    color: #272727;
    font-size: 18px;
    font-weight: 700;
}

:where(.seoulex-root) .invest-info-list{
    padding: 0 20px;
    background-color: #f9f9f9;
    border-radius: 12px;
}

:where(.seoulex-root) .invest-info{
    display: flex;
}

:where(.seoulex-root) .invest-info:last-child{
    margin-bottom: 0px;
}

:where(.seoulex-root) .invest-info:first-child > span:first-child,:where(.seoulex-root) .invest-info:first-child > span:last-child{
    padding-top: 20px;
}

:where(.seoulex-root) .invest-info:last-child > span:first-child,:where(.seoulex-root) .invest-info:last-child > span:last-child{
    padding-bottom: 20px;
}

:where(.seoulex-root) .invest-info > span:first-child{
    padding-bottom: 12px;
    display: block;
    width: 135px;
    text-align: left;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
}

:where(.seoulex-root) .invest-info > span:last-child{
    margin-left: 30px;
    font-size: 14px;
}

:where(.seoulex-root) .invest-company-list{
    flex: 1 0 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding-bottom: 20px;
    margin-left: 30px;
    box-sizing: border-box;
    font-size: 14px;
}

:where(.seoulex-root) .no-news-item{
    display: flex;
    width: 710px;
    height: 280px;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    font-size: 14px;
    font-weight: 400;
}

:where(.seoulex-root) .sx-news-item > a{
    padding: 24px 0;
    height: 75px;
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .sx-news-item + .sx-news-item > a{
    border-top: 1px solid #f0f0f0;
}

:where(.seoulex-root) .news-item-title-wrapper{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

:where(.seoulex-root) .sx-news-title{
    overflow: hidden;
    color: #272727;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
}

:where(.seoulex-root) .publish{
    color: #a8a8a8;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .publis-divider{
    margin: 0 8px;
    color: #d3d3d3;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .news-thumbnail{
    width: 133px;
    height: 75px;
    background-size: 100%;
    border-radius: 8px;
}

:where(.seoulex-root) .more-button{
    margin: 20px auto 0;
    width: 196px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    border: 1px solid #e6e6e6;
    background: #fff;
    color: #808080;
    font-size: 13px;
    font-weight: 400;
}

:where(.seoulex-root) .no-public-notice-item{
    display: flex;
    width: 710px;
    height: 280px;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    font-size: 14px;
    font-weight: 400;
}

:where(.seoulex-root) .public-notice-item > a{
    padding: 24px 0;
    height: 53px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

:where(.seoulex-root) .public-notice-item + .public-notice-item > a{
    border-top: 1px solid #f0f0f0;
}

:where(.seoulex-root) .company-info-list{
    padding: 0 20px;
    background-color: #f9f9f9;
    border-radius: 12px;
}

:where(.seoulex-root) .company-info{
    display: flex;
}

:where(.seoulex-root) .company-info:last-child{
    margin-bottom: 0;
}

:where(.seoulex-root) .company-info:first-child > span:first-child,:where(.seoulex-root) .company-info:first-child > span:last-child{
    padding-top: 20px;
}

:where(.seoulex-root) .company-info:last-child > span:first-child,:where(.seoulex-root) .company-info:last-child > span:last-child{
    padding-bottom: 20px;
}

:where(.seoulex-root) .company-info > span:first-child{
    padding-bottom: 12px;
    display: block;
    width: 136px;
    min-width: 136px;
    text-align: left;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
}

:where(.seoulex-root) .company-info > span:last-child{
    margin-left: 30px;
    padding-bottom: 12px;
    font-size: 14px;
    word-break: keep-all;
}

:where(.seoulex-root) .company-info > a:last-child{
    text-decoration: underline;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-left: 30px;
    padding-bottom: 12px;
    word-break: keep-all;
    font-size: 14px;
}

:where(.seoulex-root) .finance-info-section .left-section-title{
    border-bottom: none;
}

:where(.seoulex-root) .finance-info-title-wrapper{
    position: relative;
}

:where(.seoulex-root) .finance-info-button-wrapper{
    position: absolute;
    top: 96px;
    right: 0px;
    width: 90px;
    display: flex;
    align-items: center;
    border: 1px solid #e9e9e9;
    border-radius: 8px;
    overflow: hidden;
}

:where(.seoulex-root) .finance-info-button-wrapper.individual-only{
    width: 45px;
}

:where(.seoulex-root) .finance-info-button-wrapper > button{
    flex: 1 0 0;
    border: none;
    height: 23px;
    color: #a8a8a8;
    text-align: center;
    font-size: 9px;
    font-weight: 400;
    background-color: white;
}

:where(.seoulex-root) .finance-info-button-wrapper > button.selected{
    border-right: 1px solid #e9e9e9;
    background-color: #f2f4f7;
    font-weight: 700;
    color: #272727;
}

:where(.seoulex-root) .table-title-wrapper{
    margin-top: 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0 16px;
    color: #a8a8a8;
    font-size: 12px;
    font-weight: 400;
    border-bottom: 1px solid #e9e9e9;
}

:where(.seoulex-root) .table-title-wrapper:first-child{
    margin-top: 0px;
}

:where(.seoulex-root) .table-title-wrapper > h3{
    color: #272727;
    font-size: 16px;
    font-weight: 700;
}

:where(.seoulex-root) .finance-table{
    width: 100%;
    text-align: center;
    border-radius: 12px;
    overflow: hidden;
}

:where(.seoulex-root) .finance-table > thead > tr > th,:where(.seoulex-root) .finance-table > tbody > tr > td{
    width: 190px;
    border: 1px solid #e9e9e9;
}

:where(.seoulex-root) .finance-table > thead > tr > th:first-child,:where(.seoulex-root) .finance-table > tbody > tr > td:first-child{
    border-left: none;
    width: 138px;
    padding: 20px;
    box-sizing: border-box;
}

:where(.seoulex-root) .finance-table > thead > tr > th:last-child,:where(.seoulex-root) .finance-table > tbody > tr > td:last-child{
    border-right: none;
}

:where(.seoulex-root) .finance-table > thead{
    background-color: #f2f4f7;
}

:where(.seoulex-root) .finance-table > tbody > tr:last-child > td{
    border-bottom: none;
}

:where(.seoulex-root) .finance-info-source{
    display: block;
    margin: 16px 0 12px;
    color: #a8a8a8;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .finance-info-source-description{
    color: #a8a8a8;
    word-break: keep-all;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
}

:where(.seoulex-root) .discussion-wrapper{
    padding: 28px 0;
    position: relative;
    display: flex;
    flex-direction: column;
}

:where(.seoulex-root) .discussion-wrapper + .discussion-wrapper{
    border-top: 1px solid #f0f0f0;
}

:where(.seoulex-root) .discussion-title-wrapper{
    margin-bottom: 12px;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .discussion-title-wrapper > div{
    padding: 3px 5px;
    border-radius: 2px;
    background: #e02b35;
    color: white;
    font-size: 7px;
    line-height: 1;
    margin-right: 8px;
}


:where(.seoulex-root) .discussion-title-wrapper > span{
    color: #272727;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .discussion-title-wrapper > span:last-child{
    position: absolute;
    top: 28px;
    right: 0;
    color: #a8a8a8;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .discussion-content-wrapper{
    display: flex;
    justify-content: space-between;

}

:where(.seoulex-root) .discussion-title{
    display: block;
    color: #272727;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 8px;
}

:where(.seoulex-root) .discussion-content{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #808080;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    max-height: 40px;
}

:where(.seoulex-root) .uploaded-image{
    display: block;
    width: 68px;
    height: 68px;
    border-radius: 4px;
}

:where(.seoulex-root) .deleted-normal-article{
    padding: 24px 0px;
    font-size: 14px;
    color: #a8a8a8;
}

:where(.seoulex-root) .deleted-normal-article + .deleted-normal-article{
    border-top: 1px solid #f0f0f0;
}

:where(.seoulex-root) .like-btn-wrapper{
    margin-top: 20px;
    display: flex;
    align-items: center;
    color: #808080;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .like-btn-wrapper img{
    margin-right: 4px;
    line-height: 1.5;
}

:where(.seoulex-root) .like-btn{
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .like-btn-img{
    margin-right: 4px;
    width: 16px;
    height: 16px;
    background-image: url("/static/images/ic_recommend_disabled.svg");
}

:where(.seoulex-root) .comment-count{
    margin-left: 28px;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .comment-count-img{
    margin-right: 4px;
    width: 16px;
    height: 16px;
    background-image: url("/static/images/ic_comment.svg");
}

:where(.seoulex-root) #loading{
    position: relative;
    padding: 60px 0;
}

:where(.seoulex-root) .empty-opinion-text{
    display: flex;
    width: 710px;
    height: 280px;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    font-size: 14px;
    font-weight: 400;
}

:where(.seoulex-root) .right-section{
    width: 430px;
}

:where(.seoulex-root) .right-section-title{
    margin-top: 60px;
    padding: 16px 0;
    color: #272727;
    font-weight: 700;
}

:where(.seoulex-root) .chart-section .right-section-title{
    margin-top: 0px;
}

:where(.seoulex-root) .chart-title-wrapper{
    position: relative;
}

:where(.seoulex-root) .chart-title{
    margin: 60px 0 16px;
    color: #272727;
    font-size: 16px;
    font-weight: 700;
}

:where(.seoulex-root) h2.right-section-title{
    font-size: 18px;
}

:where(.seoulex-root) h3.right-section-title{
    font-size: 16px;
}

:where(.seoulex-root) .app-button{
    cursor: pointer;
    position: absolute;
    top: 16px;
    right: 0px;
    color: #272727;
    font-size: 9px;
    font-weight: 700;
    padding: 0 8px 0 0;
    height: 25px;
    box-sizing: border-box;
    border: 1px solid #e9e9e9;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

:where(.seoulex-root) .app-button > img{
    margin-right: 8px;
}

:where(.seoulex-root) .chart-view{
    position: relative;
    border: 1px solid #e9e9e9;
    border-radius: 12px;
    padding: 20px 16px;
    height: 304px;
    box-sizing: border-box;
    overflow: hidden;
}

:where(.seoulex-root) .no-price-history{
    top: 0px;
    left: 0;
    width: 100%;
    position: absolute;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    background-color: white;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

:where(.seoulex-root) .non-uniformed-stock-chart-text{
    height: 264px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #d3d3d3;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

:where(.seoulex-root) .date-button-list{
    margin-bottom: 20px;
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    padding: 4px;
    border-radius: 12px;
    background-color: #f4f4f4;
}

:where(.seoulex-root) .date-button-list > li{
    width: 100%;
    padding: 8px 0;
    box-sizing: border-box;
    text-align: center;
    border-radius: 8px;
    color: #808080;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

:where(.seoulex-root) .date-button-list > li.selected{
    background-color: white;
    color: #272727;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

:where(.seoulex-root) .current-selected-tick-info{
    display: flex;
    padding: 8px 0px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #f4f4f4;
}

:where(.seoulex-root) .current-selected-tick-info > .bold{
    margin-left: 6px;
    font-weight: bold;
}

:where(.seoulex-root) #chart-date{
    color: #808080;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) #chart-price{
    color: #272727;
    font-size: 12px;
    font-weight: 700;
}

:where(.seoulex-root) .order-list{
    height: 440px;
    overflow: auto;
    border-radius: 12px;
    border: 1px solid #f0f0f0;
    position: relative;
}

:where(.seoulex-root) .order-list > li{
    display: flex;
    align-items: center;
    padding: 24px 20px;
}

:where(.seoulex-root) .order-list > li + li{
    border-top: 1px solid #f0f0f0;
}

:where(.seoulex-root) #middle-divider{
    padding: 0;
    border: none;
}

:where(.seoulex-root) .order-section .order-list .no-order-item{
    position: absolute;
    border-bottom: none;
    border-top: none;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    color: #d3d3d3;
    padding: 0;
    white-space: nowrap;
}

:where(.seoulex-root) .order-section .order-list .no-order-item > span{
    font-size: 14px;
    color: #d3d3d3;
}

:where(.seoulex-root) .order-list > li{
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .order-type-badge{
    margin-right: 32px;
    width: 40px;
    height: 18px;
    font-size: 10px;
    font-weight: 700;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

:where(.seoulex-root) .order-type-badge.sell{
    background-color: #e3edff;
    color: #2f79fa;
}

:where(.seoulex-root) .order-type-badge.sell.best{
    background-color: #2f79fa;
    color: white;
}

:where(.seoulex-root) .order-type-badge.buy{
    color: #fa372a;
    background-color: #ffe7e5;
}

:where(.seoulex-root) .order-type-badge.buy.best{
    background-color: #fa372a;
    color: white;
}

:where(.seoulex-root) .order-info{
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .order-info span.order-price{
    display: inline-flex;
    align-items: center;
    margin-right: 8px;
    color: #272727;
    font-size: 16px;
    font-weight: 700;
}

:where(.seoulex-root) .order-info span.order-decline,:where(.seoulex-root) .order-info span.order-amount{
    margin-left: 8px;
    display: inline-flex;
    align-items: center;
    color: #808080;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .order-info span.order-price.sell{
    color: #2f79fa;
}


:where(.seoulex-root) .order-info span.order-price.buy{
    color: #fa372a;
}

:where(.seoulex-root) .order-info span:nth-child(2) > span{
    margin-left: 8px;
    color: #808080;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .order-trade-button,:where(.seoulex-root) .non-uniformed-stock-trade-button{
    margin-left: auto;
    width: 65px;
    box-sizing: border-box;
    padding: 9px 8px 7px;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    color: #272727;
    font-size: 12px;
    font-weight: 700;
    background-color: #f4f4f4;
}

:where(.seoulex-root) .trade-button-list{
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

:where(.seoulex-root) .trade-button-list > button{
    flex: 1 0 0;
    height: 50px;
    border-radius: 12px;
    border: none;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
}

:where(.seoulex-root) .trade-button-list > .sell-button{
    background-color: #2F79FA;
}

:where(.seoulex-root) .trade-button-list > .buy-button{
    background-color: #FA372A;
}

:where(.seoulex-root) .non-uniformed-stock-order-button{
    margin-top: 12px;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 12px;
    background: #E02B35;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
}

:where(.seoulex-root) .more-order-item{
    justify-content: center;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    text-decoration-line: underline;
    cursor: pointer;
}

:where(.seoulex-root) .transaction-history-table-wrapper{
    position: relative;
    min-height: 300px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #f0f0f0;
}

:where(.seoulex-root) .more-transaction-history-item{
    justify-content: center;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    text-decoration-line: underline;
    cursor: pointer;
}


:where(.seoulex-root) .transaction-history-table{
    width: 100%;
    color: #272727;
    font-size: 12px;
    font-weight: 400;
}

:where(.seoulex-root) .transaction-history-table > thead{
    background-color: #f2f4f7;
}

:where(.seoulex-root) .transaction-history-table > thead > tr > th,:where(.seoulex-root) .transaction-history-table > tbody > tr > td{
    text-align: right;
    padding: 16px;
}

:where(.seoulex-root) .transaction-history-table > thead > tr > th{
    padding: 16px 13px;
}

:where(.seoulex-root) .transaction-history-table > thead > tr > th:first-child,:where(.seoulex-root) .transaction-history-table > tbody > tr > td:first-child{
    text-align: left;
}

:where(.seoulex-root) .transaction-history-table > tbody > tr > td.no-history{
    position: absolute;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
    color: #d3d3d3;
    white-space: nowrap;
}

:where(.seoulex-root) .section-loading{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
}

:where(.seoulex-root) .animation-wrapper{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 12px;
    display: flex;
    justify-content: space-between;
}

:where(.seoulex-root) .animation-wrapper div{
    width: 20%;
    height: 100%;
    background-color: #cacaca;
    animation-name: blink;
    animation-duration: 0.9s;
    animation-direction: alternate-reverse;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

:where(.seoulex-root) .animation-wrapper div:first-child{
    animation-delay: 0.3s;
}

:where(.seoulex-root) .animation-wrapper div:nth-child(2){
    animation-delay: 0.6s;
}

:where(.seoulex-root) .animation-wrapper div:nth-child(3){
    animation-delay: 0.9s;
}

@keyframes blink {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

:where(.seoulex-root) .none{
    display: none;
}

:where(.seoulex-root) .visually-hidden{
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
}

/* ==== login.css ==== */




:where(.seoulex-root) .login-section{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
    position: absolute;
}

:where(.seoulex-root) #login-form{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 480px;
    height: 413px;
    background-color: #FFFFFF;
}

:where(.seoulex-root) .kakao-login-btn{
    margin-top: 32px;
    width: 300px;
    height: 48px;
    background-image: url("/static/images/ic-kakao-login-btn.svg");
    background-repeat: no-repeat;
    background-size: 300px 48px;
}

:where(.seoulex-root) .apple-login-btn{
    margin-top: 12px;
    width: 300px;
    height: 48px;
    background-image: url("/static/images/ic-apple-login-btn.svg");
    background-repeat: no-repeat;
    background-size: 300px 48px;
}

:where(.seoulex-root) .input-clear-button{
    width: 16px;
    height: 16px;
    background-image: url("/static/images/ic-input-clear-button.svg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
    position: absolute;
    right: 16px;

    cursor: pointer;
    display: none;
}

:where(.seoulex-root) .logo-img{
    margin-top: 60px;
    margin-bottom: 32px;
}

:where(.seoulex-root) .login-form-separator{
    background-color: #e9e9e9;
    width: 300px;
    height: 1px;
    margin-top: 20px;
}

:where(.seoulex-root) .email-login-wrapper{
    margin-top: 20px;
    display: flex;
    align-items: center;
    width: 300px;
    flex-wrap: wrap;
}

:where(.seoulex-root) .input-wrapper{
    box-sizing: border-box;
    display: flex;
    align-items: center;
    flex-direction: column;
    position: relative;
}

:where(.seoulex-root) .input-wrapper > div{
    position: relative;
    display: flex;
    align-items: center;
}

:where(.seoulex-root) .input-wrapper input{
    padding: 12px 16px;
    border: 1px solid #e9e9e9;
    width: 220px;
    height: 42px;
    font-size: 14px;
    box-sizing: border-box;
}

:where(.seoulex-root) #input_username{
    border-bottom-color: #FFFFFF;
    border-radius: 4px 4px 0 0;
}

:where(.seoulex-root) #input_password{
    border-radius: 0 0 4px 4px;
}

:where(.seoulex-root) .input-wrapper > label{
    margin-right: 12px;
    width: 60px;
    text-align: right;
}

:where(.seoulex-root) .form-error-message{
    color: #e02b35;
    font-size: 12px;
    margin-top: 8px;
    margin-left: 39px;
}

:where(.seoulex-root) #login-button{
    color: #272727;
    background-color: #f4f4f4;
    border-width: 0;
    border-radius: 4px;
    width: 68px;
    height: 84px;
    cursor: pointer;
    margin-left: 12px;
    font-weight: 700;
}

:where(.seoulex-root) .error-wrapper{
    display: flex;
    flex-direction: column;
    width: 480px;
    height: 356px;
}

:where(.seoulex-root) .seoulex-info-wrapper{
    display: flex;
    flex-direction: column;
    align-items: center;
}

:where(.seoulex-root) .copy-right{
    display: flex;
    align-items: center;
    margin-top: 100px;
    font-size: 14px;
}

:where(.seoulex-root) .copy-right-text{
    height: 18px;
    margin-left: 10px;
}

:where(.seoulex-root) .email-link-wrapper{
    font-size: 14px;
    color: #808080;
}

:where(.seoulex-root) .email-link{
    color: #808080;
}

:where(.seoulex-root) #permission-error-popup{
    position: fixed;
    width: 320px;
    height: 112px;
    background-color: #FFFFFF;
    border: 1px solid #e9e9e9;
    border-radius: 4px;
    box-shadow: 0 8px 20px 0 #00000040;
}

:where(.seoulex-root) .popup-content{
    margin: 24px 16px;
}

:where(.seoulex-root) .popup-text-wrapper{
    font-size: 14px;
}

:where(.seoulex-root) .popup-button-wrapper{
    display: flex;
    flex-direction: row-reverse;
}

:where(.seoulex-root) .confirm-button{
    background-color: #f4f4f4;
    border-radius: 4px;
    padding: 0;
    color: #272727;
    width: 80px;
    height: 32px;
    border-width: 0;
    font-weight: bold;
    font-size: 13px;
    cursor: pointer;
}
.seoulex-root .sx-search-item-logo{width:28px;height:28px;border-radius:50%;border:1px solid #ededed;object-fit:cover;margin-right:10px;flex-shrink:0;}
.seoulex-root .sx-logo-img{display:block;}
.seoulex-root .calendar-day-text{font-size:13px;font-weight:500;color:var(--color-grayscale-grey100);}
.seoulex-root .calendar-day-num.today .calendar-day-text{color:#E02B35;font-weight:bold;}
.seoulex-root .calendar-week{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid #f5f5f5;min-height:72px;}
.seoulex-root .calendar-day-num{padding:6px 4px;min-height:72px;border-left:1px solid #f5f5f5;overflow:hidden;}
.seoulex-root .faq-answer{padding:16px 18px 20px 52px;font-size:14px;line-height:1.7;color:var(--color-grayscale-grey-090);white-space:pre-line;}
.seoulex-root .faq.open > a{background-color:var(--color-grayscale-grey-020);}
.seoulex-root .app-button{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--color-grayscale-grey-070);cursor:pointer;}
.seoulex-root .actual-body{margin-top:120px;margin-bottom:80px;}
.seoulex-root .login-root{min-height:100vh;background-color:#f4f4f4;}
.seoulex-root .login-section input[type=text],
.seoulex-root .login-section input[type=password]{border:1px solid #e9e9e9;}
.seoulex-root .login-section input[type=text]:focus,
.seoulex-root .login-section input[type=password]:focus,
.seoulex-root .login-section input[type=text]:active,
.seoulex-root .login-section input[type=password]:active{outline:none;border-color:#272727;}
.seoulex-root #login-form{height:auto;padding-bottom:40px;}
.seoulex-root .signup-link{display:block;margin-top:16px;font-size:13px;color:var(--color-grayscale-grey-070);text-decoration:underline;}
.seoulex-root .auth-form-seoulex{display:flex;flex-direction:column;gap:10px;width:300px;}
.seoulex-root .auth-form-seoulex input,
.seoulex-root .auth-form-seoulex select{padding:12px 16px;border:1px solid #e9e9e9;border-radius:4px;font-size:14px;height:44px;box-sizing:border-box;background:#fff;font-family:inherit;}
.seoulex-root .auth-form-seoulex input:focus,
.seoulex-root .auth-form-seoulex select:focus{outline:none;border-color:#272727;}
.seoulex-root .auth-submit-seoulex{margin-top:10px;background-color:#E02B35;color:#fff;border:0;border-radius:4px;height:48px;font-size:15px;font-weight:700;cursor:pointer;}
.seoulex-root .auth-submit-seoulex:disabled{opacity:.6;cursor:not-allowed;}
.seoulex-root .auth-title-seoulex{width:300px;text-align:left;font-size:20px;font-weight:700;color:#272727;margin-bottom:4px;}
.seoulex-root .mp-page{min-height:auto;background:transparent;}
.seoulex-root .acc-shell{min-height:auto;background:#fff;}
.seoulex-root .sx-stock-table tbody tr{cursor:default;}
.seoulex-root .stock-detail-link{cursor:default;}
.seoulex-root .user-nickname{height:auto;padding:0;font-size:14px;font-weight:500;color:var(--color-grayscale-grey100);line-height:1;}
.seoulex-root .actual-body{margin:120px auto 80px;}

/* ==== 모바일 반응형 (<=1024px) ==== */
@media (max-width: 1024px){
  .seoulex-root .main-header,.seoulex-root .header-wrapper,.seoulex-root .page-content,.seoulex-root .page-header,
  .seoulex-root .index-footer,.seoulex-root .footer-wrapper,.seoulex-root .notify-msg,.seoulex-root .ipo-title-wrapper,
  .seoulex-root .swiper-container,.seoulex-root .popular-stock,.seoulex-root .content-grid,.seoulex-root .whole-stocks,
  .seoulex-root .actual-body,.seoulex-root .stock-detail-wrapper,.seoulex-root .grid-wrapper,.seoulex-root .ipo-schedule,
  .seoulex-root .ipo-top-layout,.seoulex-root .ipo-calendar-view,.seoulex-root .ipo-sidebar,.seoulex-root .ipo-calender,
  .seoulex-root .stock-table,.seoulex-root .news-list-section,.seoulex-root .qna-section,.seoulex-root .seoulex-dictionary,
  .seoulex-root .post-section,.seoulex-root .pc-only-copyright-wrapper{min-width:0 !important;width:auto !important;max-width:100% !important;}

  /* 헤더 */
  .seoulex-root .main-header{position:sticky;}
  .seoulex-root .header-wrapper{flex-wrap:wrap;row-gap:8px;padding:8px 16px;}
  .seoulex-root .logo-search-wrapper{flex:1 1 calc(100% - 180px);flex-wrap:wrap;row-gap:8px;}
  .seoulex-root .sx-logo{order:1;margin-right:0;}
  .seoulex-root .sx-logo-img{width:130px;height:auto;}
  .seoulex-root .header-wrapper .search-bar{order:3;flex:1 1 100%;max-width:none;}
  .seoulex-root .search-iframe{left:16px;right:16px;}
  .seoulex-root .gnb-wrapper{gap:0;justify-content:flex-end;}
  .seoulex-root .gnb-wrapper > li.total-stocks,
  .seoulex-root .gnb-wrapper > li.ipo-schedule-list,
  .seoulex-root .gnb-wrapper > li.company-intro{display:none;}
  .seoulex-root .gnb-wrapper > li.page-nav-item{display:flex;align-items:center;gap:2px;}
  .seoulex-root .gnb-wrapper > li.hamburger-menu{display:block;}
  .seoulex-root .gnb-wrapper .user-login{margin:0 4px;padding:10px 14px 9px !important;}
  .seoulex-root .dropdown-menu.menu__dropdown{max-width:calc(100vw - 32px);}

  /* 배너 */
  .seoulex-root .swiper-container{margin:0 !important;}
  .seoulex-root .banner-image-wrapper{height:170px !important;}
  .seoulex-root .banner-image{height:170px !important;max-width:100%;background-size:cover !important;}

  /* 종목 탭 */
  .seoulex-root .popular-stock{padding:24px 16px 40px;}
  .seoulex-root .stock-tab-header{flex-wrap:wrap;gap:10px;}
  .seoulex-root .stock-tabs{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;}
  .seoulex-root .stock-tab{white-space:nowrap;}
  .seoulex-root #grid-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .seoulex-root .sx-stock-table{min-width:620px;}
  .seoulex-root .sx-stock-table td{white-space:nowrap;}
  .seoulex-root .more-button{margin:16px auto 0;display:block;max-width:calc(100% - 32px);}

  /* 홈 콘텐츠 그리드 */
  .seoulex-root .content-grid{padding:0 16px 40px;display:block;}
  .seoulex-root .news-list-section,.seoulex-root .qna-section,.seoulex-root .seoulex-dictionary,.seoulex-root .post-section{margin-bottom:40px;}
  .seoulex-root .sx-news-item > a{flex-wrap:wrap;gap:4px;}
  .seoulex-root .sx-news-item > a > .sx-news-title{width:100%;}
  .seoulex-root .dictionary-list{grid-template-columns:repeat(2,1fr) !important;gap:10px !important;}
  .seoulex-root .post-section .sx-post-item img{width:100px !important;height:100px !important;}

  /* 전체종목 */
  .seoulex-root .whole-stocks{padding:24px 16px 40px;margin:0;}
  .seoulex-root .input-element{width:100%;max-width:100%;margin-bottom:16px;}
  .seoulex-root .input-element > div{width:100%;}
  .seoulex-root .input-element .grid-input{width:100%;max-width:none;}

  /* IPO 일정 */
  .seoulex-root .ipo-title-wrapper{padding:0 16px;}
  .seoulex-root .ipo-title{width:auto !important;}
  .seoulex-root .ipo-calender{padding:0 16px;}
  .seoulex-root .ipo-top-layout{flex-direction:column;gap:24px;}
  .seoulex-root .ipo-calendar-view{padding:0;}
  .seoulex-root .calendar-week{min-height:56px;}
  .seoulex-root .calendar-badge{font-size:9px;padding:1px 3px;}
  .seoulex-root .calendar-bar{font-size:9px;}
  .seoulex-root .ipo-sidebar{margin-top:8px;}
  .seoulex-root .ipo-schedule{padding:0 16px 40px;}
  .seoulex-root .ipo-schedule-menu{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .seoulex-root .ipo-schedule-menu > li{flex-shrink:0;}
  .seoulex-root .ipo-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .seoulex-root .ipo-table{min-width:680px;}
  .seoulex-root .ipo-popup{width:calc(100vw - 32px) !important;max-width:480px;}

  /* 종목 상세 */
  .seoulex-root .stock-detail-wrapper{flex-direction:column;padding:16px;gap:24px;}
  .seoulex-root .left-section,.seoulex-root .right-section{width:auto !important;}
  .seoulex-root .base-info-list{flex-wrap:wrap;gap:8px 16px;}
  .seoulex-root .trade-button-list{flex-direction:column;gap:8px;}

  /* FAQ */
  .seoulex-root .actual-body{padding:0 16px !important;margin:60px auto 60px;}

  /* 로그인/회원가입 */
  .seoulex-root .login-section{position:static;height:auto;min-height:100vh;padding:48px 16px;box-sizing:border-box;}
  .seoulex-root #login-form{width:100%;max-width:480px;box-sizing:border-box;padding:32px 20px 40px;}
  .seoulex-root .email-login-wrapper{width:100%;max-width:340px;margin-left:auto;margin-right:auto;flex-direction:column;align-items:stretch;}
  .seoulex-root .input-wrapper{width:100%;}
  .seoulex-root .input-wrapper > div{width:100%;}
  .seoulex-root .input-wrapper input{width:100% !important;}
  .seoulex-root #login-button{width:100% !important;height:48px !important;margin:12px 0 0;}
  .seoulex-root .auth-form-seoulex{width:100%;max-width:340px;margin-left:auto;margin-right:auto;}
  .seoulex-root .auth-title-seoulex{width:100%;max-width:340px;margin-left:auto;margin-right:auto;}
  .seoulex-root .auth-submit-seoulex{width:100% !important;max-width:340px;display:block;margin:10px auto 0;}
  .seoulex-root .form-error-message{max-width:340px;margin-left:auto !important;margin-right:auto;}
  .seoulex-root .signup-link{display:block;text-align:center;}

  /* 마이페이지 */
  .seoulex-root .mp-main{width:auto;max-width:none;padding:24px 16px 60px;}
  .seoulex-root .mp-card{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .seoulex-root .mp-table{min-width:720px;}
  .seoulex-root .mp-summary-row{flex-wrap:wrap;gap:12px;}

  /* 내 계좌 */
  .seoulex-root .acc-shell{flex-direction:column;}
  .seoulex-root .acc-sidebar{width:100% !important;position:static !important;height:auto !important;border-right:0 !important;border-bottom:1px solid var(--border-light);padding:10px 16px;}
  .seoulex-root .acc-menu{flex-direction:row;flex-wrap:wrap;gap:4px;}
  .seoulex-root .acc-menu-item{padding:8px 10px;}
  .seoulex-root .acc-collapse-toggle{display:none;}
  .seoulex-root .acc-side-bottom{flex-direction:row;flex-wrap:wrap;gap:8px;margin-top:8px;}
  .seoulex-root .acc-content{padding:16px;}
  .seoulex-root .acc-card{overflow-x:auto;}
  .seoulex-root .acc-card table{min-width:640px;}

  /* 푸터 */
  .seoulex-root .index-footer{padding:24px 0;}
  .seoulex-root .footer-wrapper{padding:0 16px;flex-direction:column;gap:20px;align-items:flex-start;}
  .seoulex-root .pc-only-copyright-wrapper{flex-direction:column;gap:16px;}
  .seoulex-root .footer-notice{flex-wrap:wrap;row-gap:6px;}
}