@charset "UTF-8";

/* RESET */
html,body {-webkit-text-size-adjust:none}
body,div,span,em,strong,select,section,article,nav,footer,header,address,caption,figure,figcaption,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p,textarea,input,button,tr,th,td,table {margin:0; padding:0}
body,button,input,select,option,textarea,table,th,td {color:#222; font-size:14px; line-height:1.45; font-family:'Apple SD Gothic Neo','Helvetica Neue','AppleGothic','Droid Sans fallback',sans-serif; /* word-break:keep-all; word-wrap:break-word */}
h1,h2,h3,h4,h5,h6 {font-size:inherit}
ol,ul,li {list-style:none}
blockquote,q {quotes:none}
blockquote:before,blockquote:after,q:after,q:before {content:'';content:none}
img,fieldset,iframe {border:0 none; vertical-align:top}
img,iframe {max-width:100%}
i,em,address,optgroup {font-style:normal}
hr {display:none}
input,button,select,textarea,label {vertical-align:middle}
input,textarea {-webkit-appearance:none; border-radius:0}
textarea {resize:none}
button {border:0 none; border-radius:0; background:transparent; cursor:pointer}
table {border-collapse:collapse; border-spacing:0}
caption {width:0; height:0; overflow:hidden; color:transparent; text-indent:-9999px}
legend, .blind, .skip-nav {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption {display:block}
a {color:#222; text-decoration:none}
.bold {font-weight:700}

.inp-txt::placeholder {color:#b0b0b0}
.inp-txt:-ms-input-placeholder {color:#b0b0b0}
.inp-txt::-ms-input-placeholder {color:#b0b0b0}

.btn-prevpage {position:fixed; right:65px; bottom:30px; z-index:10; width:40px; height:40px; border-radius:50%; background:rgba(136,136,136,.7); text-align:center}
.btn-prevpage::before {content:''; display:inline-block; position:absolute; top:50%; left:calc(50% + 2px); width:10px; height:10px; border-top:1px solid #fff; border-left:1px solid #fff; transform:rotate(-45deg) translate(-50%, -50%); transform-origin:left top}
.btn-top {position:fixed; right:15px; bottom:30px; z-index:10; width:40px; height:40px; border-radius:50%; background:rgba(136,136,136,.7)}
.btn-top::before {content:''; display:inline-block; position:absolute; top:calc(50% + 2px); left:50%; width:10px; height:10px; border-top:1px solid #fff; border-left:1px solid #fff; transform:rotate(45deg) translate(-50%, -50%); transform-origin:left top}

.btn-prevpage, .btn-top {animation: slide-up ease .5s}
@keyframes slide-up {
    0% {
        opacity:0;
        transform: translateY(130px);
    }
    100% {
        opacity:1;
        transform: translateY(0px);
    }
}
.btn-position.end .btn-prevpage, .btn-position.end .btn-top {bottom:60px}

/* IR */
.thumb-icon {
    background-image:url('https://hkstatic.hankyung.com/img/www/m/common/2020/spr-common.svg');
    background-repeat:no-repeat;
}
.header .btn-allmenu,
.contact-info > dl dt::before,
.utility .bg-ico,
.utility .bg-ico.share::before,
.article-share a,
.article-body .article-guide::before,
.figure-img .btn-img-big,
.author-wrap .author-email::before,
.notice-head .new-icon,
.notice-head .file-down,
.file-area .file-down::before,
.file-area .file-down span::before, 
.search-area .btn-search,
.step-list li .step-tit::before,
.ibaward-wrap .btn-img-big {
    background-image:url('https://hkstatic.hankyung.com/img/marketinsight/common/spr-icon.svg?v=20210818');
    background-repeat:no-repeat;
}

/* icon */
.thumb-icon {display:inline-block; overflow:hidden; color:transparent; white-space:nowrap; pointer-events:none}
.thumb-icon.thumb-vod {width:34px; height:35px; background-position:-21px -225px}
.thumb-icon.thumb-audio {width:34px; height:35px; background-position:-75px -225px}
.thumb-icon.thumb-graph {width:34px; height:35px; background-position:-129px -225px}
.thumb-icon.thumb-photo {width:33px; height:27px; background-position:-183px -225px}
.thumb-icon.thumb-slide {width:35px; height:29px; background-position:-235px -225px}

/* gnb */
.gnb {position:relative; height:35px; overflow:hidden; white-space:nowrap; background-color:#f7f7f7}
.gnb .inner-scroll {height:45px; padding-bottom:40px; overflow-x:scroll; overflow-y:hidden; box-sizing:border-box; -webkit-overflow-scrolling:touch}
.gnb ul {display:inline-flex; justify-content:space-between; min-width:100%}
.gnb li {flex:0 0 auto; padding:0 10px; font-size:16px}
.gnb li.active a {border-bottom:3px solid #000}
.gnb li a {display:inline-block; height:35px; margin:0 7px; line-height:34px; font-family:'Lato','Apple SD Gothic Neo','돋움',Dotum,'굴림',Gulim,Verdana,Arial,sans-serif; font-weight:700; box-sizing:border-box}
.gnb ul:first-of-type li:first-child {padding-left:15px}
.gnb ul:last-of-type li:last-child {padding-right:20px}
.gnb li.on a {border-bottom:3px solid #222; font-weight:bold}
.gnb .nav-expand a {color:#4c88b6}
.gnb .icon-premium {width:11px; height:13px; margin-left:4px}
.gnb .icon-new {margin-left:4px; vertical-align:-3px}
.gnb:before,
.gnb:after {content:''; display:block; position:absolute; top:0; width:15px; height:40px; z-index:1}
.gnb:before {left:0; background:-moz-linear-gradient(left, rgba(247,247,247,1) 0%, rgba(247,247,247,0.75) 51%, rgba(247,247,247,0) 100%); background:-webkit-linear-gradient(left, rgba(247,247,247,1) 0%, rgba(247,247,247,0.75) 51%, rgba(247,247,247,0) 100%); background:linear-gradient(to right, rgba(247,247,247,1) 0%, rgba(247,247,247,0.75) 51%, rgba(247,247,247,0) 100%)}
.gnb:after {right:0; width:25px; background:-moz-linear-gradient(left, rgba(247,247,247,0) 0%, rgba(247,247,247,0.75) 51%, rgba(247,247,247,1) 100%); background:-webkit-linear-gradient(left, rgba(247,247,247,0) 0%, rgba(247,247,247,0.75) 51%, rgba(247,247,247,1) 100%); background: linear-gradient(to right, rgba(247,247,247,0) 0%, rgba(247,247,247,0.75) 51%, rgba(247,247,247,1) 100%)}

.sub .gnb-wrap, .view .gnb-wrap {border-bottom:1px solid #000}
.sub .news-list-wrap .news-item {align-items:flex-start; /*padding:14px 0 5px*/}
.sub .main-top .txt-cont {padding:15px 0 10px}

/* LAYOUT */
#wrap {background:#ddd}
.wrap-inner {max-width:720px; margin:0 auto}
.inner-layout {padding:0 15px}
.cont-row {display:flex; margin:0 -7px}
.cont-row > .col {flex:0 0 auto; position:relative; width:50%; padding:0 7px; box-sizing:border-box}
.cont-row.col-line > .col {flex:1 0 auto}
.cont-row.col-line > .col::before {content:''; display:block; position:absolute; top:0; bottom:0; left:0; width:1px; background:#e8e8e8}
.cont-row.col-line > .col:first-child::before {display:none}
.bg-bottom {background-color:#222 !important}

/* badge */
.badge-new {width:5px; height:5px; border:2px solid #f7f7f7; border-radius:50%; overflow:hidden; background:#f51f2b; color:transparent; white-space:nowrap}

/* banner */
.banner-area, .ad-area {margin:5px 0}
.banner-area > a, .ad-area > a {display:bolck}

/* HEADER */
.header {position:-webkit-sticky; position:sticky; top:0; left:0; right:0; z-index:100; height:60px; padding-top:7px; border-bottom:1px solid #f7f7f7; box-sizing:border-box}
.header::before {content:''; display:block; position:absolute; top:0; left:0; right:0; bottom:0; background-color:#f7f7f7; -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px)}
.header .logo {display:flex; height:45px; align-items:center; justify-content:center}
.header .logo-market {z-index:1; display:inline-block; width:152px; height:35px; overflow:hidden; color:transparent; white-space:nowrap; background:url('https://hkstatic.hankyung.com/img/marketinsight/common/logo-market.svg') no-repeat 0 0/contain}
.header .btn-allmenu {display:block; width:22px; height:20px; position:absolute; top:52%; left:20px; transform:translateY(-50%); background-position:0 0}
.header .btn-allmenu .badge-new {position:absolute; top:-4px; right:-5px}
.header.sticky {border-bottom-color:#000}
.header.sticky .logo {height:45px}
.only-header, .sub .header, .view .header {border-bottom:1px solid #000}
.main .header {border-bottom:none}
.showMenu .main .header, .main .header.sticky {border-bottom:1px solid #000}

/* footer */
.footer-wrap {padding:0 15px; color:#888; font-size:12px; background:#222}
.foot-cont {padding:15px 0 100px}
.foot-cont .f-item-group + .f-item-group {margin-top:15px}
.foot-cont .f-item-group dt {margin-bottom:5px; font-weight:bold}
.foot-cont .f-item > a,
.foot-cont .f-item > span,
.foot-cont .f-item > address {display:inline-block; margin-right:10px; color:#888; vertical-align:middle}
.foot-cont .f-item a {color:#888}
.foot-cont .f-item > address {font-style:normal}
.foot-cont .f-item + .f-item {margin-top:15px}
.foot-cont .f-item:nth-child(3),
.foot-cont .f-item:nth-child(4) {display:inline}
.foot-cont .copyright {margin-top:15px}
.foot-wrap {margin-top:5px; padding:12px 0px; color:#888; font-size:12px;text-align:center; background:#222}

/* 전체메뉴 */
.dim {z-index:10; display:none; position:fixed; top:59px; left:0; right:0; bottom:0; background-color:rgba(0,0,0,.65)}
.layer-allmenu {z-index:10; display:none; position:absolute; top:60px; left:-315px; width:315px; min-height:100vh; padding:25px 15px; background-color:#f7f7f7; box-sizing:border-box;}
.layer-allmenu .allmenu-tit {margin-bottom:15px; padding-bottom:20px; border-bottom:1px solid #ddd; font-size:18px}
/* .layer-allmenu .menu-list {display:grid; grid-template-columns: repeat(2, 1fr); column-gap:20px; padding:0 0 15px}
.layer-allmenu .menu-list + .menu-list {border-top:1px solid #ddd}
.layer-allmenu .menu-list.main li {line-height:50px; font-weight:700; font-size:18px}
.layer-allmenu .menu-list.sub {padding:15px 0}
.layer-allmenu .menu-list.sub li {line-height:50px; font-size:16px} */

.layer-allmenu .menu-list {display:flex; flex-wrap:wrap; gap:20px; padding:0 0 15px}
.layer-allmenu .menu-list > li {flex:0 0 auto; width:calc(50% - 10px)}
.layer-allmenu .menu-list > li a {display:block; padding:5px 0}
.layer-allmenu .menu-list + .menu-list {border-top:1px solid #ddd}
.layer-allmenu .menu-list.main li {font-weight:700; font-size:18px}
.layer-allmenu .menu-list.sub {padding:15px 0}
.layer-allmenu .menu-list.sub li {font-size:16px}
.layer-allmenu .menu-list.sub li.wide {width:100%}

.layer-allmenu .btn-close {position:absolute; top:-43px; left:15px; width:25px; height:25px}
.layer-allmenu .btn-close::before,
.layer-allmenu .btn-close::after {content:''; position:absolute; left:50%; top:2px; width:2px; height:20px; background-color:#000}
.layer-allmenu .btn-close:before {transform:translate(-50%) rotate(45deg)}
.layer-allmenu .btn-close:after {transform:translate(-50%) rotate(-45deg)}

.showMenu .layer-allmenu {display:block; left:-1px}
.showMenu header {border-bottom-color:#000}
.showMenu .dim {display:block}
.showMenu .btn-allmenu {display:none}

/* 무료 메인 슬라이드 */
.main-slide {position:relative}
.main-slide .slick-track {height:100%}
.main-slide {position:relative; width:100%; height:307px; color:#fff; text-align:center}
.main-slide .main-slide-list {height:307px}
.main-slide .main-slide-list .slick-list {height:100%; box-sizing:border-box}
.main-slide .main-slide-list .item {position:relative; max-width:100%; height:100%; padding:105px 0 35px; font-size:24px; line-height:40px; box-sizing:border-box; background-repeat:no-repeat; background-position:50% 50%; background-size:100% 100%}

.main-slide .main-slide-list .item.item1 {background-image:url('https://hkstatic.hankyung.com/img/marketinsight/m/bg-slide01.jpg')}
.main-slide .main-slide-list .item.item2 {background-image:url('https://hkstatic.hankyung.com/img/marketinsight/m/bg-slide02.jpg')}
.main-slide .main-slide-list .item.item3 {background-image:url('https://hkstatic.hankyung.com/img/marketinsight/m/bg-slide03.jpg')}
.main-slide .main-slide-list .item.item4 {background-image:url('https://hkstatic.hankyung.com/img/marketinsight/m/bg-slide04.jpg')}
.main-slide .main-slide-list .item.item5 {background-image:url('https://hkstatic.hankyung.com/img/marketinsight/m/bg-slide05.jpg')}
.main-slide .slick-slide[aria-hidden="true"][tabindex="-1"] + .slick-active,
.main-slide .slick-slide[data-index="-1"] .slick-active {animation:3.5s linear 0s alternate zoomIn;}
.main-slide .main-slide-list .item strong {display:inline-block; font-size:32px; padding-bottom:26px; border-bottom:1px solid #909098}
.slide-num {display:inline-block; position:absolute; top:36px; left:50%; transform:translateX(-50%); width:30px; height:30px; border:1px solid #fff; line-height:30px; font-family:'Lato'; font-weight:700; font-size:14px; text-align:center; box-sizing:border-box}
.slide-num::before {content:""; display:block; position:absolute; bottom:-24px; left:50%; transform:translateX(-50%) rotate(135deg); width:14px; height:1px; background-color:#fff}
.main-slide .slide-cont {display:block; opacity:0;  letter-spacing:-0.025em}
.main-slide .slick-slide[aria-hidden="true"][tabindex="-1"] + .slick-active .slide-cont,
.main-slide .slick-slide[data-index="-1"] .slick-active .slide-cont {opacity:1; transform:translateY(0); animation:1s linear 0s alternate slideUp}
.slide-info {position:absolute; bottom:35px; left:50%; width:100%; transform:translateX(-50%)}
.slide-status {display:inline-block; margin-left:18px; vertical-align:middle}
.slide-status .btn-play {display:none; width:19px; height:20px; border:1px solid #fff; padding:4px 6px}
.slide-status .btn-play::before {content:''; display:block; width:0; height:0; border:5px solid transparent; border-right-width: 0; border-left-color: #fff}
.slide-status .btn-pause {display:block; position:relative; width:19px; height:20px; border:1px solid #fff; box-sizing:border-box}
.slide-status .btn-pause::before, .slide-status .btn-pause::after {content:''; display:inline-block; position:absolute; top:50%; transform:translateY(-50%); width:2px; height:9px; background-color:#fff}
.slide-status .btn-pause::before {left:5px}
.slide-status .btn-pause::after {right:5px}
.slide-status.active .btn-play {display:block}
.slide-status.active .btn-pause {display:none}
.slide-nav > span {display:inline-block; min-width:10px; font-weight:700; color:#fff; font-size:17px; text-align:center; vertical-align:middle}
.slide-nav {display:inline-block}
.slide-nav .slide-bar {overflow:hidden; position:relative; width:83px; height:2px; margin:0 15px; background-color:#ddd}
.slide-nav .pro-bar {position:absolute; bottom:0; left:0; width:100%; height:100%; background:#2675dd}

@keyframes zoomIn {
    from {
        background-size:130% 130%;
    }
    to {
        background-size:100% 100%;
    }
}
@keyframes slideUp {
    from {
        opacity:0;
        transform:translateY(35%);
    }
    to {
        opacity:1;
        transform:translateY(0);
    }
}

/* 검색어 입력 */
.search-area {position:relative; margin-bottom:5px; padding:17px 20px; background-color:#f7f7f7; box-sizing:border-box}
.search-area .inp-txt {outline:none; width:100%; border:0; padding:15px 40px 15px 0; border-bottom:2px solid #222; font-size:15px; background-color:#f7f7f7; box-sizing:border-box}
.search-area .btn-search {display:inline-block; position:absolute; top:15px; right:20px; width:40px; height:50px; background-position:-22px 14px}

/* 무료 메인 탭메뉴 */
.tab-menu-area {overflow:hidden; height:47px; padding-top:25px; padding-left:15px; background-color:#f7f7f7}
.tab-menu-area .inner-scroll {overflow-x:scroll; overflow-y:hidden; height:45px; padding-bottom:55px; box-sizing:border-box; -webkit-overflow-scrolling: touch}
.tab-menu-area + .main-component {margin-top:0}
.tab-menu {display:table; width:100%; padding-right:20px}
.tab-menu li {display:table-cell; min-width:72px; height:45px; border:1px solid #c4c4c4; text-align:center; background-color:#fff; box-sizing:border-box}
.tab-menu li + li {border-left:none}
.tab-menu li.on {border-color:#28528a; font-weight:700; background-color:#28528a}
.tab-menu li > a {display:block; width:100%; height:100%; padding:11px 23px; font-family: 'Lato'; font-size:16px; box-sizing:border-box}
.tab-menu li.on > a {color:#fff}

/* 지수 */
.stock-marquee {overflow:hidden; height:30px; background-color:#222}
.stock-marquee .marquee {overflow-x:scroll; overflow-y:hidden; height:40px; -webkit-overflow-scrolling:touch}
.stock-item-list {display:flex; justify-content: space-between; align-items:center; padding:0 10px}
.stock-item-list li {flex:0 0 auto; padding:9px 10px; line-height:12px; font-family:'Lato','Apple SD Gothic Neo',sans-serif; font-size:11px}
.stock-item-list .name, .stock-item-list .num {color:#fff}
.stock-item-list .num, .stock-item-list .status > span {display:inline-block; margin-left:8px}
.stock-item-list .status.up .rate {color:#ff5b5b}
.stock-item-list .status.down .rate {color:#4c88b6}

/* 뉴스 콘텐츠 공통 */
.main-component, .list-component {margin-top:5px; padding:0 15px; background-color:#f7f7f7}
.main-tit {border-bottom:1px solid #222; font-size:17px}
.main-tit > a,
.main-tit > span {display:block; min-height:45px; padding:13px 15px 10px 0; font-size:19px; box-sizing:border-box}
.main-tit.noline-center {border-bottom:none; text-align:center}
.main-tit.noline-center span {margin-bottom:15px; padding:0; min-height:auto; font-size:19px}
.main-tit > a {position:relative}
.main-tit > a::after,
.main-tit > .link-group::after {content:''; display:block; position:absolute; top:50%; right:5px; width:9px; height:9px; border-top:1px solid #222; border-right:1px solid #222; transform:translateY(-50%) rotate(45deg)}
.main-tit > .link-group {display:flex; align-items:stretch; position:relative; padding:0} 
.main-tit > .link-group > a {flex:0 0 auto; padding-top:12px}
.main-tit > .link-group > a:last-child {flex:1 0 auto; padding-right:15px}
.menu-tit + .list-component {margin-top:0}

.thumb {position:relative; overflow:hidden}
.thumb > a {display:block; width:100%; height:100%}
.thumb img {width:100%; height:100%; object-fit:cover; object-position:top}
.thumb .thumb-icon {position:absolute; right:15px; bottom:13px; transform-origin:right bottom}
.news-item .thumb .thumb-icon {right:5px; bottom:5px; transform:scale(0.6)}

.view-wrap .news-list-wrap .news-item > .thumb, .view-wrap .thumb {background-color:#f7f7f7}
.view-wrap .thumb {border:1px solid #e7e7e7}
.view-wrap .thumb > a {text-align:center}
.view-wrap .thumb img {width:auto; max-width:100%; height:100%}

@media all and (max-width:500px){
    .major-thumb-news .thumb .thumb-icon {right:10px; bottom:10px; transform:scale(0.8)}
}

.major-news .thumb,
.thumb-news-wrap .thumb,
.news-list-wrap .thumb {background:#2f2f3206 url('https://hkstatic.hankyung.com/img/www/w/common/thumb-blank-transparent.png') no-repeat center center; background-size:cover}

.iframe-youtube {position:relative; height:0; padding-bottom:56.25%; border-radius:10px; overflow:hidden; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -webkit-transform:translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0)}
.iframe-youtube iframe {position: absolute; top:0; left:0; width:100%; height:100%}
.news-subject {display:block; margin-bottom:7px}
.news-subject, .news-subject a {line-height:12px; font-weight:normal; color:#28528a}

.news-tit {overflow:hidden; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical}
.news-tit > a {display:block}

.thumb-news-wrap .thumb {position:relative; height:0; padding-bottom:62.5%; overflow:hidden}
.thumb-news-wrap .thumb > a {display:block; position:absolute; top:0; left:0; width:100%; height:100%}
.thumb-news-wrap .news-tit {margin-top:10px; font-weight:normal; font-size:1.2em; line-height:1.294em; word-break:break-all; -webkit-line-clamp:3}
.thumb-news-wrap .news-subject {margin-top:10px}

.news-item-top {padding-top:15px; padding-bottom:2px; border-top:1px solid #e4e4e4}
.news-item-top .thumb {position:relative; height:0; padding-bottom:56.25%; margin:0 -15px; overflow:hidden}
.news-item-top .thumb > a {position: absolute; top:0; left:0; width:100%; height:100%}
.news-item-top .news-tit {margin:13px 0; font-size:1.714em; line-height:1.286em; -webkit-line-clamp:2}
.news-item-top .news-subject {margin-top:15px}
.main-component .news-list-wrap:first-of-type .news-item-top,
.list-component .news-list-wrap:first-of-type .news-item-top {padding-top:0; border-top:none}
.news-item .news-tit {font-weight:normal; font-size:1.357em; line-height:1.316em; -webkit-line-clamp:2}

.news-list-wrap .news-item {display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:center; padding:14px 0; border-top:1px solid #e4e4e4}
.news-list-wrap .news-item:first-child {border:none}
.news-list-wrap .news-item > .thumb {flex:0 0 auto; width:80px; height:50px; margin-left:10px}
.news-list-wrap .news-item > .news-tit {flex:1 0 auto; width:calc(100% - 94px)}
.news-list-wrap .news-item.type-thumb-lt {flex-direction:row; justify-content:flex-start}
.news-list-wrap .news-item.type-thumb-lt > .thumb {width:105px; height:70px; margin:0 10px 0 0}
.news-list-wrap .news-item.type-thumb-lt > .txt-cont {width:calc(100% - 120px)}
.news-list-wrap .news-item.news-txt-item {display:block}
.news-list-wrap .news-thumb-item {padding-bottom:11px}
.news-list-wrap .news-item .txt-cont {flex:1 0 auto; width: calc(100% - 94px);}

/* top영역 외 모듈이 최상단 일 경우 */
#contents > :first-child:not(.main-top-wrap) {margin-top:0}

/* 헤드라인 */
.main-top-wrap {padding:0 15px; background-color:#f7f7f7}
.main-top-wrap .main-top .thumb {margin:0 -15px; overflow:hidden; height:0; padding-bottom:62.5%;}
.main-top-wrap .main-top .thumb > a {position:absolute; top:0; left:0}
.main-top-wrap .major-news .news-tit {font-weight:bold}
.main-top-wrap .major-news .col:only-child .news-tit {font-weight:normal}
.main-top .txt-cont {padding:15px 0; background-color:#f7f7f7}
.main-top .txt-cont > .news-tit {font-size:1.714em; line-height:1.286em}
.main-top .news-tit + .lead {margin-top:5px; font-size:1.143em}
.main-top-wrap + .ad-area {margin-top:0}
.main-top-wrap .news-date, .txt-cont .news-date {line-height:25px; color:#999; font-size:12px}

/* 주요뉴스 */
.major-news {padding:13px 0; border-top:1px solid #e4e4e4; background-color:#f7f7f7}
.major-news .cont-row + .cont-row {margin-top:13px; padding-top:13px; border-top:1px solid #e4e4e4}
.major-news .news-subject {display:block;  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.major-news .news-item .news-tit {font-weight:normal; font-size:1.357em; line-height:1.316em; word-break:break-all; -webkit-line-clamp:3}
.major-news .news-item {display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:flex-start}
.major-news .thumb {flex:0 0 auto; width:80px; height:50px; margin-top:21px; margin-left:10px}   
.major-news .txt-cont {flex:1 0 auto; width:calc(100% - 94px)}

.major-thumb-news {padding-bottom:11px}
.major-thumb-news .cont-row {flex-wrap:wrap}
.major-thumb-news .cont-row > .col {padding-top:15px}

/* 기사리스트 */
.content-box {padding:25px 15px 25px; background-color:#f7f7f7}
.free .menu-tit {padding:20px 15px 10px}
.free .menu-tit + .content-box, .free .menu-tit + .con-box  {padding-top:15px}
.menu-tit {padding:17px 15px 10px; line-height:1; font-family:'Lato','Apple SD Gothic Neo', sans-serif; font-size:20px; background-color:#f7f7f7; box-sizing:border-box}
.main .menu-tit {padding:30px 0 20px; font-size:21px}
.news-list-wrap + .btn-area {padding:18px 24px; border-top:1px solid #ddd}
.btn-more-item {display:block; width:100%; padding:14px 0; border:1px solid #ddd; box-sizing:border-box}
.btn-more-item span {display:inline-block; position:relative; padding-right:20px; font-weight:700; font-size:18px}
.btn-more-item span::before {content:""; display:block; position:absolute; top:5px; right:0; width:8px; height:8px; border-bottom:1px solid #222; border-left:1px solid #222; transform:rotate(-45deg)}

.btn-area {text-align:center; background-color:#f7f7f7}
.btn-line {display:inline-block; border:1px solid #222; padding:11px 26px 10px; font-weight:700; font-size:16px; text-align:center; background-color:#fff; box-sizing:border-box}

/* 태그리스트 */
.list-component.list-tag .menu-tit {padding:17px 0 5px}

/* 기사뷰 */
#container .view {background-color:#f7f7f7}
#container .view h1 {padding:25px 20px 0; font-size:26px; word-wrap:break-word; display:-webkit-box; -webkit-box-orient: vertical}
.view .utility {position:relative; padding:10px 20px 0px}
.utility .bg-ico {display:inline-block; width:35px; height:35px; margin-right:2px; border-radius:50px; border:1px solid #c6c6c6; background-color:#fafafa; vertical-align:middle; box-sizing:border-box}
.utility .bg-ico.scrap {background-position:11px -80px}
.utility .bg-ico.scrap.on {background-position:-335px -80px}
.utility .bg-ico.bigfont {background-position:-95px -80px}
.utility .bg-ico.smallfont {background-position:-60px -79px}
.utility .bg-ico.share {background-image:none}
.utility .bg-ico.share::before {content:''; display:block; width:35px; height:35px; background-position:-307px -82px; transform:scale(0.7)}
.article-share {z-index:1; display:none; position:absolute; bottom:-100px; left:20px; width:149px; height:97px; padding:12px 15px; box-shadow:0px 3px 4px 1px rgba(145,145,145,.3); border:1px solid #c6c6c6; background-color:#fafafa; box-sizing:border-box}
.article-share.active {display:block}
.article-share .share-box {display:flex; justify-content: space-between;}
.article-share .share-box + .share-box {margin-top:10px}
.article-share a {display:inline-block; width:30px; height:30px}
.article-share .share-url {background-position:0 -239px}
.article-share .share-msg {background-position:-32px -239px}
.article-share .share-facebook {background-position:-64px -239px}
.article-share .share-twitter {background-position:-96px -239px}
.article-share .share-twitter.twitter-x {background:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-twitter-cir-x.svg') no-repeat 50% 50%/28px 28px}
.article-share .share-naver {background-position:-129px -239px}
.article-share .share-band {background-position:-161px -239px}
.view.free .date_info {margin-left:20px}
.date_info {margin:0 15px; padding:15px 0 12px; border-bottom:1px solid #e7e7e7; color:#777; font-weight:700; font-size:13px}
.date_info > span + span:before {content:'|'; position:relative; margin:0 7px; color:#969696}
.date_info .num {margin-left:4px}
.article-body .articlebody .article-guide {margin-top:15px; margin-bottom:25px;  padding-left:39px; text-indent:-27px; color:#2d50af; line-height:27px; font-size:17px}
.article-body .article-guide::before {content:''; display:inline-block; width:20px; height:20px; background-position:-135px -86px; vertical-align:-5px; transform:scale(1.3)}
.article-body .article-guide > span {border-bottom:1px solid #d4dcf1}
.article-wrap .file-area {margin:0 15px}
.article-wrap .file-area .file-down {padding:10px 0 10px 8px; border:none; border-bottom:1px solid #e7e7e7; background-color:transparent}
.article-wrap .file-area .file-down + .file-down {margin-top:0}
.article-wrap .file-area .file-down::before {top:11px; right:0; transform: scale(1.3)}

/* 기사영역 */
.article-body {margin-top:27px}
.article-body .articlebody p, .article-body .articlebody #articletxt {padding:0 15px; font-size:20px}
.article-body .articlebody .summary {position:relative; margin-bottom:7px; padding-left:32px; font-weight:normal; line-height:33px; font-size:20px; word-break:keep-all}
.article-body .articlebody .summary:before {content:''; position:absolute; top:3px; left:15px; bottom:5px; width:3px; background-color:#ddd}
.article-body .articlebody p.copy,
.article-body .articlebody p.copy_press {margin-top:15px; padding:0 20px}

/* 기사뷰내 이미지 */
.article-body .articlebody .articleimage.al_c,
.article-body .articlebody .articleimage.al_r,
.article-body .articlebody .articleimage.al_l {float:none; margin:25px 0 25px}
.article-body .articlebody .articleimage .imageView {display:inline-block; position:relative; max-width:inherit}
.article-body .articlebody .articleimage img {width:auto}
.article-body .articlebody .articleimage .caption {max-width:100%; margin:7px auto 0; padding:0 !important; color:#999; font-size:13px !important; line-height:20px; text-align:left}
.article-body .articlebody .articleimage.al_r {text-align:right}
.article-body .articlebody table,
.article-body .articlebody table th,
.article-body .articlebody table td {border:1px solid #e5e5e5}
.article-body .articlebody table th,
.article-body .articlebody table td {padding:5px 8px}
.article-body .articlebody blockquote {position:relative; margin:30px 0; padding:25px 23px; border:2px solid #c3c3c3; background:#fff}
.article-body blockquote::before {content:''; display:block; width:30px; height:20px; margin-bottom:13px; background-color:#666; clip-path:path('M0,12.9C0,0.2,12.4,0,12.4,0C6.7,3.2,7.8,6.2,7.5,8.5c2.8,0.4,5,2.9,5,5.9c0,3.6-2.9,5.7-5.9,5.7 C3.2,20,0,17.4,0,12.9z M14.8,12.9C14.8,0.2,27.2,0,27.2,0c-5.7,3.2-4.6,6.2-4.8,8.5c2.8,0.4,5,2.9,5,5.9c0,3.6-2.9,5.7-5.9,5.7 C18,20,14.8,17.4,14.8,12.9z')}
.article-body .articlebody blockquote .svg-quote {fill:#666; display:block; width:27px; height:20px; margin-bottom:10px}
.article-body .articlebody em {font-style:italic}

/* 기사내 이미지 영역  */
.article-figure {margin:25px 0}
.figure-img {position:relative; text-align:center}
.figure-img img {max-width:100%; width:100%}
.figure-img .btn-img-big {position:absolute; right:0; bottom:0; width:39px; height:39px; background-position:-263px -85px}
.figure-caption {max-width:100%; margin:7px auto 0; padding:0 !important; color:#999; font-size:13px !important; line-height:18px; text-align:left}

/* 태그 */
.articletag {padding:10px 20px 0}
.articletag a {display:inline-block; margin-bottom:5px; padding:5px 10px; color:#222; font-size:12px; background-color:#f7f7f7; border-radius:3px}

/* 기사 링크 하이라이트 */
.marker {color:inherit; text-decoration:none !important; box-shadow:inset 0 -8px 0 #c0edff; overflow-wrap:break-word; word-wrap:break-word; word-break:break-word; -webkit-tap-highlight-color:rgba(0,0,0,0)}
.marker:hover {background:#c0edff}
.article-body .sm-point {text-decoration:none !important}
.article-body .sm-point > span {letter-spacing:0}
.article-body .sm-point.hold {color:#222; box-shadow:inset 0 -1px 0 #222}
.article-body .sm-point.up, .article-body .sm-point.max {color:#ff000a !important; box-shadow:inset 0 -1px 0 #ff585b}
.article-body .sm-point.down, .article-body .sm-point.min {color:#457fff !important; box-shadow:inset 0 -1px 0 #0070cf}

/* 기사 본문 */
.act-body .articlebody p.copy {padding:15px 15px}
.act-body .articlebody:after {content:''; display:block; clear:both}
.act-body .articlebody #articletxt p img {width:100%; height:inherit}

/* 소제목 */
.hk_sub_headline {display:block; margin:20px 0; padding:20px 0 18px; border-top:2px solid #c4c4c4; border-bottom:1px solid #ddd; font-style:normal; font-weight:bold; font-size:1.1em; line-height:1.7; word-wrap:break-word; display:-webkit-box; -webkit-box-orient: vertical}

/* 매거진 소제목, 기존 list */
.magazine_sub_headline {display:block; position:relative; margin:20px 0; padding:30px 13px; border-top:2px solid #222; border-bottom:2px solid #222; font-weight:bold; text-align:center}
.magazine_sub_headline::before,
.magazine_sub_headline::after {content:''; display:block; position:absolute; left:0; right:0; height:1px; background:#222}
.magazine_sub_headline::before {top:3px}
.magazine_sub_headline::after {bottom:3px}

#articletxt ol li, #articletxt ul li {margin-left:25px}
#articletxt ol, #articletxt ol ol, #articletxt ol li {list-style-type:decimal}
#articletxt ol ol ol, #articletxt ol ol li {list-style-type:upper-alpha}
#articletxt ol ol ol ol, #articletxt ol ol ol li {list-style-type:lower-alpha}
#articletxt ol ol ol ol ol, #articletxt ol ol ol ol li {list-style-type:decimal}
#articletxt ol ul ul, #articletxt ol ul li {list-style-type:disc}
#articletxt ol ul ul ul, #articletxt ol ul ul li {list-style-type:circle}
#articletxt ol ul ul ul ul, #articletxt ol ul ul ul li {list-style-type:square}
#articletxt ul, #articletxt ul ul, #articletxt ul li {list-style-type:disc}
#articletxt ul ul ul, #articletxt ul ul li {list-style-type:circle}
#articletxt ul ul ul ul, #articletxt ul ul ul li {list-style-type:square}
#articletxt ul ol ol, #articletxt ul ol li {list-style-type:decimal}
#articletxt ul ol ol ol, #articletxt ul ol ol li {list-style-type:upper-alpha}
#articletxt ul ol ol ol ol, #articletxt ul ol ol ol li {list-style-type:lower-alpha}
#articletxt ul ol ol ol ol ol, #articletxt ul ol ol ol ol li {list-style-type:decimal}
.article-video .iframe-youtube {border-radius:0}

/* 기자영역 */
.author-wrap {margin:30px 0 35px; padding:15px 16px 20px; background:#fff}
.author-wrap .author-top {display:flex}
.author-wrap .thumb {flex:0 0 auto; width:63px; height:63px; margin-right:15px; border-radius:50%; transform:scale(.92)}
.author-wrap .thumb::before {content:''; display:block; width:100%; height:100%; background-position:-169px -69px}
.author-wrap .thumb .author-photo {position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit:cover; object-position:left top}
.author-wrap .author-info {flex:1 0 auto; width:calc(100% - 63px); padding-top:3px}
.author-wrap .author-name {display:block; margin-right:15px; font-size:18px}
.author-wrap .author-email {display:block; margin-top:5px; font-size:16px}
.author-wrap .author-email::before {content:''; display:inline-block; width:18px; height:12px; margin-right:7px; background-position:-234px -88px; font-size:12px; vertical-align:-1px}
.author-wrap .author-desc {margin-top:20px; color:#666; font-size:16px; word-break:break-all}

/* 관련 태그 */
.article-module-wrap {padding:50px 15px 0}
.article-module {margin:20px 0}
.article-module-tit {position:relative; margin-bottom:20px}
.article-module-tit::before {content:''; position:absolute; top:50%; left:0; width:100%; height:1px; background:#ddd; transform:translateY(-50%)}
.article-module-tit > strong {position:relative; display:inline-block; padding-right:28px; background:#f7f7f7; font-size:17px}
.article-tag a {display:inline-block; height:34px; margin:0 5px 10px 0; padding:0 15px; border:1px solid #e5e5e5; background:#fff; font-weight:700; font-size:15px; line-height:33px; vertical-align:middle; box-sizing:border-box; white-space:nowrap}

/* 관련 기사 */
.article-module-rel {margin:20px 0 5px; padding-bottom:25px}
.article-module-rel ul {display:grid; grid-template-columns:49% 49%; column-gap:14px; row-gap:25px; justify-content:center}
.article-module-rel li .thumb {padding-bottom:62%}
.article-module-rel li .thumb > a {position:absolute; left:0; top:50%; transform:translateY(-50%); min-height:auto}
.article-module-rel li .news-tit {max-height:67px; margin-top:10px; font-size:17px; line-height:22px; -webkit-line-clamp:3; letter-spacing:-0.05em; font-weight:400}
.article-module-rel ul::after {content:''; display:block; clear:both}
.article-module-rel li.no-thumb .news-tit {max-height:75px; margin-top:0; font-size:20px; line-height:25px}
.article-module-rel li.no-thumb .lead {display:block; display:-webkit-box; max-height:160px; text-overflow:clip; overflow:hidden; word-break:keep-all; word-wrap:break-word; -webkit-box-orient:vertical; margin-top:5px; color:#666; font-size:15px; line-height:20px}

.article-module.article-rel-list {margin-bottom:0; padding-bottom:125px}
.article-module .news-list-wrap {border-bottom:1px solid #e4e4e4}
.article-rel-list .article-module-tit {margin-bottom:0}
.article-rel-list .news-list-wrap .news-item {padding:15px 0 10px; flex-direction:row; align-items:flex-start}
.article-rel-list .news-list-wrap .news-item > .thumb {flex:1 0 auto; width:100px; height:70px; margin-top:3px; margin-left:0; margin-right:10px}
.article-rel-list .news-item .news-tit {max-height:42px; margin-bottom:5px; line-height:21px; font-size:17px}
.article-rel-list .news-item .lead {max-height:43px; line-height:19px; color:#888; font-size:13px; overflow:hidden; text-overflow:ellipsis; display:-webkit-inline-box; -webkit-line-clamp:2; -webkit-box-orient: vertical}
.article-rel-list .news-list-wrap .news-item .txt-cont {width: calc(100% - 110px)}


/* 미디어 쿼리 */  
@media all and (min-width:720px){
    #container .inner {width:720px; margin:0 auto}
    .article-module-rel li.no-thumb .lead {max-height:200px}
}
@media all and (max-width:578px){
    .article-module-rel li.no-thumb .lead {-webkit-line-clamp:6}
}
@media all and (max-width:400px){
    .article-module-rel li.no-thumb .lead {-webkit-line-clamp:5}
}
/* ipone5/se 대응 */
@media all and (max-width:360px){
    .main-slide .main-slide-list .item {line-height:36px; font-size:22px}
    .main-slide .main-slide-list .item strong {font-size:29px}
    .date_info > span + span:before {margin:0 5px}
}
  
/* 마켓인사이트 Pick */
.list-component.pick-news {background-color:#ededed}
.list-component.pick-news .news-list-wrap .news-item {align-items:center; padding:14px 0}

/* 이슈 키워드 */
.main-component.issue {padding:20px 15px}
.main-component.issue .main-tit span {margin-bottom:10px}
.issue-list {text-align:center}
.issue-list > a {display:inline-block; margin:5px 1px; padding:7px 15px 5px; border-radius:25px; border:1px solid #ddd; line-height:24px; font-size:14px; box-sizing:border-box}

/* 컬럼 */
.column-wrap {margin-top:5px; padding:0 15px; background:#fff}
.column-item {display:flex; justify-content:space-between; align-items:center; padding:15px 0; border-top:1px solid #dcdbd7}
.column-item .thumb {flex:0 0 auto; width:60px; height:60px; margin-right:10px; border-radius:50%}
.column-item .txt-cont {flex:1 0 auto; width:calc(100% - 70px)}
.column-item .news-subject,
.column-item .news-subject a {color:#bb894b}
.column-item .news-tit {font-weight:normal; font-size:1.357em; line-height:1.316em; -webkit-line-clamp:2}

/* 지면보기 */
.surface-wrap {margin:5px 0; padding:15px 0; background:#ededed}
.surface .inner-layout {padding:0 15px}
.surface-list {height:200px; margin:0 -15px; overflow:hidden}
.surface-list .inner-scroll {height:200px; padding-bottom:230px; overflow-x:scroll; overflow-y:hidden; box-sizing:border-box; -webkit-overflow-scrolling:touch}
.surface-slide {display:inline-flex; justify-content:space-between;}
.surface-slide > .item {margin-right:15px}
.surface-slide > .item:first-child {margin-left:15px}
.surface-slide .thumb {display:block; width:120px; height:175px; border:1px solid #ddd; border-radius:0; box-sizing:border-box}
.surface-slide .page {display:block; height:25px; padding-top:7px; font-size:12px; text-align:center; box-sizing:border-box}

/* 연락처 */
.contact-info {display:table; width:100%; margin-top:5px; padding:20px 0; background-color:#2b2b2b}
.contact-info > dl {display:table-cell; width:50%; padding:0 15px; vertical-align:top; color:#fff; text-align:center; box-sizing:border-box;}
.contact-info > dl + dl {position:relative}
.contact-info > dl + dl::before {content:""; display:block; position:absolute; top:0; left:0; width:1px; height:100%; background-color:#4e4e4e}
.contact-info > dl dt {position:relative; margin-bottom:5px; padding-top:40px; line-height:24px; font-weight:700; font-size:17px}
.contact-info > dl dt::before {content:''; display:block; position:absolute; top:0; left:50%; transform:translateX(-50%); width:32px; height:32px; text-align:center}
.contact-info > dl.tel-info dt::before {background-position:0px -35px}
.contact-info > dl.email-info dt::before {background-position:-40px -35px}
.contact-info > dl a {color:#fff}
.contact-info > dl dd {line-height:18px; font-size:12px}
.contact-info > dl .day {display:inline-block; width:65px; text-align:left}

/* 공지사항 */
.basic-list.notice-list {margin-top:-15px}
.basic-list li {padding:10px 0; border-bottom:1px solid #ddd}
.basic-list .notice-tit, .notice-info > span, .notice-head .file-down, .notice-head .new-icon {display:inline-block; vertical-align:middle}
.basic-list .notice-tit {flex:1 0 auto; width:calc(100% - 30px); line-height:1.4em; max-height:3.2em; overflow:hidden; text-overflow:ellipsis; display:-webkit-inline-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; font-size:18px}
.basic-list.notice-list + .btn-area {margin-top:17px; padding:0 25px}
.notice-info > span {font-size:12px}
.notice-info .writer {color:#666}
.notice-info .date {position:relative; margin-left:7px; padding-left:7px; color:#999}
.notice-info .date::before {content:''; display:block; position:absolute; top:4px; left:0; width:1px; height:8px; background-color:#969696}
.notice-head {display:flex; align-items:center; justify-content:space-between}
.notice-head .new-icon {width:16px; height:16px; margin-right:3px; background-position:-178px 0px; transform:scale(1.4)}
.notice-head .file-down {flex:0 0 auto; width:23px; height:29px; margin-left:3px;  background-position:-27px -125px; transform:scale(0.8)}

/* 공지사항 뷰 */
.notice-view-top {margin-bottom:16px; padding:13px 15px 22px; border-top:1px solid #222; background-color:#fff; box-sizing:border-box}
.notice-view-top .notice-view-tit {display:block; margin-bottom:5px; line-height:32px; font-weight:700; font-size:22px}
.notice-view-top span {display:inline-block; color:#999; line-height:20px; font-size:13px}
.notice-view-top .desc {vertical-align:middle}
.notice-view-top .desc + .desc {position:relative; margin-left:10px; padding-left:18px}
.notice-view-top .desc + .desc::before {content:''; display:block; position:absolute; top:4px; left:0; width:1px; height:11px; background-color:#ddd}
.notice-view-top .desc span {margin-right:6px}
.notice-view-cont, .notice-view-cont p, .notice-view-cont ul li {line-height:30px; font-size:19px}
.notice-view-cont p + p {margin-top:3px;}
.notice-view-history {padding: 0 14px; background-color:#fff; box-sizing:border-box}
.notice-view-history li {display:flex; align-items:center; table-layout:fixed; width:100%; height:70px; padding:13px 0; font-size:17px; box-sizing:border-box}
.notice-view-history li + li {border-top:1px solid #ddd}
.notice-view-history li p {color:#888}
.notice-view-history .prev, .notice-view-history .next {flex:0 0 auto; position:relative; width:75px; font-weight:700; font-size:14px; vertical-align:middle; box-sizing:border-box}
.notice-view-history .prev:hover, .notice-view-history .next:hover {text-decoration:none}
.notice-view-history .prev::before, .notice-view-history .next::before {content:''; position:absolute; width:7px; height:7px}
.notice-view-history .prev::before {top:50%; right:25px; border-top:1px solid #000; border-left:1px solid #000; transform:rotate(45deg) translateY(-50%)}
.notice-view-history .next::before {top:4px; right:22px; border-bottom:1px solid #000; border-right:1px solid #000; transform:rotate(45deg)}
.notice-view-history + .btns-area {margin-top:58px}
.notice-view-history + .btns-area .btn-line {min-width:75px; font-weight:700}
.view-history-tit {flex:0 1 auto; max-height:44px; display:-webkit-inline-box; text-overflow:clip; overflow:hidden; word-break:keep-all; word-wrap:break-word; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:22px; vertical-align:middle}
.file-area .file-down {display:block; position:relative; padding:10px 33px 10px 15px; border:1px solid #ddd; line-height:20px; font-size:14px; background-color:#f2f2f2; box-sizing:border-box}
.file-area .file-down::before {content:''; display:block; position:absolute; top:50%; right:15px; width:18px; height:14px; background-position:-67px -124px; transform:scale(1.2) translateY(-50%)}
.file-area .file-down + .file-down {margin-top:8px}
.file-area .file-down span {display:inline-block; position:relative; padding-left:28px;}.file-area .file-down span::before {content:''; display:block; position:absolute; top:-4px; left:0; width:22px; height:27px; background-position:-27px -125px; transform:scale(0.8)}
.notice-view-cont {padding:25px 0 75px; box-sizing:border-box}
.notice-view-cont, .notice-view-cont p, .notice-view-cont ul li {line-height:30px; font-size:19px}
.notice-view-cont p + p, .notice-view-cont ul li + li {margin-top:35px}
.notice-view-history + .btn-area {margin-top:30px}

/* 검색 */
.sub-header {position:relative; height:50px}
.sub-header, .search-header {border-bottom:1px solid #ddd !important; background-color:#fff}
.header.sub-header::before, .header.search-header::before {display:none}
.sub-header .title, .search-header .title {display:flex; align-items:center; justify-content:center; height:38px; font-size:18px}
.sub-header .title {height:33px}
.search-wrap .txt-cont .news-date {line-height:24px}
.search-wrap {min-height:480px; background-color:#f7f7f7}
.search-wrap .search-area {margin-bottom:0; padding:15px 20px 20px}
.search-wrap .search-area .btn-search {top:12px}
.search-wrap .search-area .inp-txt, .search-wrap .result-tit {font-weight:700; font-size:18px}
.search-wrap .list-component {min-height:395px; margin-top:0; border-top:5px solid #ddd}
.search-wrap .search-result {display:flex; align-items:center; justify-content:space-between; margin:0 -15px; padding:15px; border-bottom:1px solid #ddd; box-sizing:border-box;}
.search-wrap .total {font-size:16px}
.search-wrap .result-tit .keyword, .search-wrap .total .num {color:#28528a}
.search-wrap .news-item .news-tit .search-word {font-weight:700; color:#28528a}
.search-wrap .search-area .inp-txt::placeholder {font-size:15px}
.search-wrap .search-area .inp-txt:-ms-input-placeholder {font-size:15px}
.search-wrap .search-area .inp-txt::-ms-input-placeholder {font-size:15px}
.search-wrap .search-area .inp-txt {padding:10px 40px 10px 0}

.search-nodata {padding:41px 5px 125px; box-sizing:border-box}
.search-nodata > p {margin-bottom:13px; padding-left:5px; line-height:25px; font-weight:700; font-size:16px}
.list-dash li {position:relative; padding-left:11px; line-height:24px; font-size:15px; word-break:keep-all}
.list-dash li::before {content:''; display:block; position:absolute; top:9px; left:0; width:5px; height:1px; background-color:#222}
.list-dash li + li {margin-top:6px}

/* 유료회원 가입안내 */
.sub-header .btn-close {position:absolute; top:48%; right:10px; width:20px; height:20px; transform:translateY(-50%)}
.sub-header .btn-close::before,
.sub-header .btn-close::after {content:''; position:absolute; left:50%; top:0; width:2px; height:19px; background-color:#000}
.sub-header .btn-close:before {transform:translate(-50%) rotate(45deg)}
.sub-header .btn-close:after {transform:translate(-50%) rotate(-45deg)}

.con-box {padding:20px 15px 35px; background-color:#f7f7f7; box-sizing:border-box}
.cont-tit {display:block; margin-bottom:10px; line-height:25px; font-size:18px}
.cont-desc {margin-bottom:20px; line-height:20px; font-size:14px; letter-spacing:-0.025em}
.bg-box {padding:6px 25px 25px; background-color:#f2f2f2}
.bg-box + .cont-tit {margin-top:23px}

.step-list {display:flex; flex-wrap:wrap; justify-content:space-around; width:100%}
.step-list li {width:50%; height:100%; padding:9px 0; text-align:center; box-sizing:border-box; vertical-align:top}
.step-list li .step-tit {display:inline-block; position:relative; padding-top:67px; line-height:16px; font-weight:700; font-size:14px}
.step-list li .step-tit::before {content:""; display:block; position:absolute; top:0; left:50%; width:51px; height:60px; margin:0 auto; transform:scale(0.9) translateX(-50%)}
.step-list li.step1 .step-tit::before {background-position:0 -170px}
.step-list li.step2 .step-tit::before {left:53%; width:75px; background-position:-150px -169px}
.step-list li.step2-2 .step-tit::before {width:61px; background-position:-65px -168px}
.step-list li.step3 .step-tit::before {left:56%; width:60px; height:65px; background-position:-236px -157px}
.step-list li.step4 .step-tit::before {left:49%; width:85px; background-position:-310px -156px}
.step-list li + li .step-tit::before {background-position:0 -155px}
.step-list .num {display:block; position:relative; margin-bottom:10px; font-weight:700; line-height:12px; font-size:14px; text-align:left; vertical-align:top}
.step-list .num::before {content:""; display:block; position:absolute; left:0; bottom:-2px; width:15px; height:1px; background-color:#000}
.step-list .step-desc {display:block; line-height:16px; font-size:13px; text-align:left}
.step-list .step-desc span {display:inline-block; line-height:20px}
.step-list.type2 .num {margin-bottom:10px}
.step-list.type2 li {width:33%}
.step-list.type2 li + li::before {top:70px; left:-63px}
.step-list.type2 li .step-tit {min-width:92px}

.list-desc li {position:relative; padding-left:7px}
.list-desc li::before {content:''; display:block; position:absolute; top:7px; left:0; width:3px; height:3px; background-color:#999}
.list-desc li, .list-desc li a {line-height:20px; color:#999; font-size:14px; letter-spacing:-0.025em}
.list-desc li + li {margin-top:8px}
.list-desc li .tel, .list-desc li .fax {display:inline-block; vertical-align:middle}
.list-desc li .fax {margin-left:15px}
.step-area + .list-desc {margin-top:20px}

.con-box .list-desc li {padding-left:15px}
.con-box .list-desc li::before {left:7px}

/* My Keyword */
.sub .top-box {padding:20px 20px 25px; background-color:#f7f7f7; box-sizing:border-box}
.keyword-wrap {margin-top:5px; padding:22px 15px; box-sizing:border-box; background-color:#f7f7f7}
.keyword-list li {display:flex; width:100%; align-items:center}
.keyword-list li + li {margin-top:12px}
.keyword-num {display:inline-block; flex:0 0 auto; width:35px; margin-right:10px; font-style:italic; font-family:'Lato'; font-weight:700; color:#666; font-size:20px; vertical-align:middle}
.keyword-box {flex: 1 0 auto; width:calc(100% - 45px); position:relative; padding-right:30px; vertical-align:middle; box-sizing:border-box}
.keyword-box::before {content:""; display:block; position:absolute; left:0; bottom:0; width:100%; height:1px; background-color:#ddd}
.keyword-box.active::before {background-color:#222}
.keyword-box .btn-delete {display:block; right:2px; width:25px; height:30px}
.btn-delete {position:absolute; top:50%; right:0; transform:translateY(-50%)}
.btn-delete::before, .btn-delete::after {content:''; position:absolute; top:50%; left:50%; width:2px; height:14px; background-color:#999}
.btn-delete:before {transform:translate(-50%,-50%) rotate(45deg)}
.btn-delete:after {transform:translate(-50%,-50%) rotate(-45deg)}

.inp-keyword {outline:none; width:100%; padding:10px 0; border:0; font-weight:700; font-size:18px; box-sizing:border-box; background-color:transparent}
.inp-keyword::placeholder {font-weight:400; color:#a4a4a4}
.inp-keyword:-ms-input-placeholder {font-weight:400; color:#a4a4a4}
.inp-keyword::-ms-input-placeholder {font-weight:400; color:#a4a4a4}
.inp-keyword + .btn-small {display:inline-block; position:absolute; bottom:10px; right:0; height:36px; padding:0 15px; font-weight:400; color:#fff; background-color:#28528a}
.keyword-list .tag-box {display:inline-block; position:relative; width:100%; padding-right:40px; vertical-align:middle; box-sizing:border-box}
.keyword-list .keyword-tag {display:inline-block; padding:8px 20px 8px 10px; border:1px solid #838383; font-weight:700; font-size:18px; box-sizing:border-box; background-color:#fff}
.keyword-list .tag-box .btn-delete {width:25px; height:25px}
.keyword-list .tag-box .btn-delete::before, .keyword-list .tag-box .btn-delete::after {width:2px; height:20px; background-color:#222}
.keyword-list + .btn-area {margin-top:25px}
.btn-full {display:inline-block; padding:15px 28px; font-weight:700; color:#fff; background-color:#28528a; box-sizing:border-box}

/* 고객센터 - 문의 */
.con-box.help-wrap {padding-bottom:55vh}
.con-box.help-wrap .cont-tit {margin-bottom:20px}
.basic-table {table-layout:fixed; width:100%; border-top:2px solid #222; border-bottom:1px solid #c4c4c4}
.basic-table tr + tr {border-top:1px solid #e4e4e4}
.basic-table th, .basic-table td {vertical-align:top; box-sizing:border-box}
.basic-table th {padding:18px 15px; font-weight:700; font-size:15px; text-align:left; background-color:#f2f2f2}
.basic-table td {padding:18px 17px; line-height:1; word-break:break-all}
.basic-table .tel, .basic-table .email {display:block; font-weight:700; font-size:18px}
.question-info {margin-top:7px}
.question-info > span {display:block; line-height:17px; color:#666; font-size:13px}

/* SPOTLIGHT */
.spotlight .con-box {position:relative}
.spotlight .con-box::before, .spotlight .con-box::after {content:''; display:block; position:absolute}
.spotlight .con-box::before {top:165px; right:0; width:117px; height:133px; background:url('https://hkstatic.hankyung.com/img/marketinsight/m/spotlight-bg-right.png') no-repeat; background-size:100%}
.spotlight .con-box::after {bottom:340px; left:0; width:93px; height:124px; background:url('https://hkstatic.hankyung.com/img/marketinsight/m/spotlight-bg-left.png') no-repeat;background-size:100%}
.spotlight .tit-spotlight {margin-bottom:180px; font-size:40px; text-align:center}
.spotlight .tit-spotlight .tit-in {z-index:1; position:relative}
.spotlight .tit-spotlight .tit-in::before {content:''; position:absolute; top:50%; left:35px; z-index:-1; width:50px; height:50px; margin-top:-29px; background:url('https://hkstatic.hankyung.com/img/marketinsight/m/spotlight-bg-tit.png') no-repeat 50% 50%/contain}
.spotlight .tit-spotlight .tit-in.only-tit::before {display:none}
.spotlight .tit-spotlight span {display:block; letter-spacing:0.275em}
.spotlight-list li {z-index:1; position:relative; float:left; width:50%; margin-bottom:110px; transition:all ease-in-out .3s; text-align:center}
.spotlight-list li:nth-child(2n + 1) {margin-top:-165px}
.spotlight-list li:last-child {margin-bottom:50px}
.spotlight-list li::before {content:''; position:absolute; top:5px; left:50%; width:155px; height:155px; border-radius:50px; box-shadow:14px 15px 15px 0 #2342ff; opacity:.2; transform:translateX(-50%); transition:all ease .3s}
.spotlight-list li > a {text-decoration:none}
.spotlight-list .thumb {position:relative; width:165px; height:165px; margin:0 auto; border-radius:55px; transition:all ease .3s}
.spotlight-list .thumb img {clip-path:url(#objClip)}
.spotlight-list .spot-tit {display:block; display:-webkit-box; position:relative; max-height:100px; margin-top:10px; text-overflow:clip; overflow:hidden; word-break:keep-all; word-wrap:break-word; -webkit-box-orient:vertical; text-align:center; -webkit-line-clamp:2; letter-spacing:-0.025em; transition:all ease .2s; font-weight:700; font-size:21px; line-height:26px}
.spotlight-list li:nth-child(9n - 8)::before {box-shadow:14px 14px 15px 0 #5cc21e}
.spotlight-list li:nth-child(9n - 7)::before {box-shadow:14px 14px 15px 0 #5e80ff}
.spotlight-list li:nth-child(9n - 6)::before {box-shadow:14px 14px 15px 0 #ffcc5e}
.spotlight-list li:nth-child(9n - 5)::before {box-shadow:14px 14px 15px 0 #3bcbea}
.spotlight-list li:nth-child(9n - 4)::before {box-shadow:14px 14px 15px 0 #5d8800}
.spotlight-list li:nth-child(9n - 3)::before {box-shadow:14px 14px 15px 0 #8a35fe}
.spotlight-list li:nth-child(9n - 2)::before {box-shadow:14px 14px 15px 0 #ea3b60}
.spotlight-list li:nth-child(9n - 1)::before {box-shadow:14px 14px 15px 0 #ffb503}
.spotlight-list li:hover .thumb {transform:scale(0.99) translate(2px, 2px)}
.spotlight-list li:hover::before {transform:translateX(-50%) scale(0.99); opacity:.4}
.spotlight-list li:hover .spot-tit,
.spotlight-list li:hover .spot-desc {transform:translate(0, -2px); -webkit-font-smoothing:antialiased}
.spotlight-list::after {content:''; display:block; clear:both}

/* My News Scrap */ 
.myscrap-wrap {margin-top:5px; padding:15px 15px 25px; background-color:#f7f7f7; box-sizing:border-box}
.myscrap-list li {margin-bottom:14px; border:1px solid #e5e5e5; padding:15px 13px; box-sizing:border-box; background-color:#fff}
.myscrap-list .date {color:#999; font-size:13px}
.scrap-info {position:relative; margin-bottom:15px; padding-bottom:10px; border-bottom:1px solid #222}
.scrap-info .num, .myscrap-list .date {display:inline-block; vertical-align:middle}
.scrap-info .num {padding-right:8px; margin-right:3px; font-weight:700; font-size:14px}
.scrap-info .btn-delete {top:35%; width:18px; height:30px}
.scrap-info .btn-delete::before, .scrap-info .btn-delete::after {height:17px; background-color:#222}
.scrap-news {display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:flex-start}
.scrap-news > .thumb {flex:0 0 auto; width:80px; height:50px; margin-left:10px}
.scrap-news > .txt-cont {flex:1 0 auto; width:calc(100% - 94px)}
.scrap-news .news-tit {height:50px; font-weight:normal; font-size:1.357em; line-height:1.316em; -webkit-line-clamp:2}
.scrap-news .news-tit + .date {margin-top:5px}
.myscrap-list + .btn-area {padding:0 25px}
.nodata-area {padding:44px 0 0; line-height:25px; letter-spacing:-0.025em; font-weight:700; font-size:19px; text-align:center}
.nodata-area::before {content:"!"; display:block; width:53px; height:53px; margin:0 auto 25px; border-radius:50px; border:4px solid #999; text-align:center; line-height:50px; font-weight:700; color:#999; font-size:36px; box-sizing:border-box}
.myscrap-wrap .nodata-area {padding-bottom:172px}
.nodata-area .btn-line {margin-top:15px; border-color:#c4c4c4; color:#222}

/* 알림 */
.push-wrap {padding:20px; background-color:#f7f7f7}
.push-wrap .date-tit {display:block; margin:30px 0 25px; line-height:25px; font-size:19px}
.push-wrap .date-tit:first-child {margin-top:0}
.push-list {border-left:1px solid #ddd; padding-left:15px; box-sizing:border-box}
.push-list li {padding:15px 0 10px; border-bottom:1px solid #ddd;}
.push-list .news-tit {font-weight:normal; font-size:1.357em; line-height:1.316em; -webkit-line-clamp:2}
.push-list .time-area {position:relative; height:15px}
.push-list .time-area::before {content:''; display:block; position:absolute; top:0; left:-19px; width:8px; height:8px; border-radius:50%; background-color:#28528a}
.push-list .time-area > span {display:inline-block; line-height:9px; font-size:12px; vertical-align:top}
.push-list .time-area .time {margin-right:5px; font-weight:700; color:#28528a}
.push-list .time-area .date {color:#999}
.push-wrap .date-tit + .push-list li:first-child {padding-top:0}
.push-list + .btn-area {padding:18px 24px}

/* 에러 페이지 */
.error-wrap {padding:0 20px 306px; background-color:#f7f7f7}
.error-wrap .txt-box {margin:20px 0 40px; padding:25px 37px 20px; line-height:20px; color:#666; font-size:15px; text-align:center; word-break:keep-all; background-color:#eee; box-sizing:border-box}

/* 무료- 서비스안내 */
.serviceinfo-list {margin:15px 0 30px; border-top:2px solid #222; border-bottom:1px solid #abadb1}
.serviceinfo-list li {display:table; width:100%}
.serviceinfo-list li + li {border-top:1px solid #e4e4e4}
.serviceinfo-list .num-tit, .serviceinfo-list .num-cont {display:table-cell; vertical-align:top}
.serviceinfo-list .num-tit {width:45px; padding-top:15px; color:#cfcfcf; line-height:30px; font-size:26px; font-style:italic}
.serviceinfo-list .num-cont {padding:15px 0; box-sizing:border-box}
.serviceinfo-list .num-cont em {line-height:22px; font-weight:700; font-size:16px}
.serviceinfo-list .num-cont p {margin-top:6px; color:#666; line-height:20px; font-size:14px}
.serviceinfo-bg {margin:0 -15px 20px; padding:20px 15px 35px; background-color:#f3f3f3; box-sizing:border-box}
.serviceinfo-bg .video-area .iframe-youtube {border-radius:0}
.serviceinfo-bg + .cont-tit, .serviceinfo-bg .cont-tit {margin-bottom:15px}
.serviceinfo-box {padding:20px 0; border-top:2px solid #222}
.serviceinfo-box .service-item {min-height:125px; padding:20px 25px; box-sizing:border-box; background-color:#fff}
.serviceinfo-box .service-item + .service-item {margin-top:15px}
.serviceinfo-box .service-tit {display:block; margin-bottom:5px; font-weight:700; font-size:16px}
.serviceinfo-box .service-desc {color:#666; line-height:20px; font-size:14px}

/* 이용약관, 개인정보취급방침 */
.bg-txt-box {margin-bottom:25px; padding:20px 23px; background-color:#eee; box-sizing:border-box}
.bg-txt-box p {line-height:20px; font-weight:700; font-size:15px}
.bg-txt-box ol {margin-top:10px}
.bg-txt-box ol li {line-height:25px; font-size:15px}
.cont-area > em {display:block}
.cont-area ol + em , .cont-area ul + em {margin-top:20px}
.cont-area em.bold {display:block; margin-bottom:15px}
.cont-area ul li, .cont-area ol li, .cont-area p, .cont-area em {line-height:23px; font-size:15px}
.cont-area .enforce {margin:45px 0 50px}
.terms-box .cont-desc {color:#999}
.terms-box .cont-area ol + em.bold, .terms-box .cont-area ul + em.bold {margin-top:45px}
.con-box.privacy-box {padding-bottom:60px}
.privacy-box .cont-area ol + em.bold, .privacy-box .cont-area ul + em.bold {margin-top:25px}
.privacy-box .cont-area,
.privacy-box .cont-area em.bold ~ em.bold {margin-top:25px}

/* IB대상 */
.ibaward-wrap .con-box {padding:15px}
.ibaward-wrap .menu-tit + .con-box {padding-top:2px}
.ibaward-wrap .cont-tit {border-bottom:1px solid #e2e2e2; margin:0 -15px 15px; padding:0 15px 15px}
.ibaward-wrap .con-box + .con-box {margin-top:5px}
.ibaward-wrap .basic-table th, .ibaward-wrap .basic-table td {padding:10px 15px; vertical-align:middle}
.ibaward-wrap .basic-table td {line-height:22px; font-size:15px}
.ibaward-wrap .select-area {position:relative; margin-bottom:15px}
.ibaward-wrap .select-area::after {content:''; position:absolute; top:50%; right:20px; transform:translateY(-50%); width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #000; vertical-align:baseline}
.ibaward-wrap .select-area select {outline:none; width:100%; padding:12px 17px; border-radius:0; border:none; box-sizing:border-box; background-color:#fff; font-weight:700; font-size:18px; -webkit-appearance:none; appearance:none;}
.ibaward-wrap .photo-area {overflow:hidden; position:relative; height:155px; margin-right:-15px; white-space:nowrap}
.ibaward-wrap .photo-area .inner-scroll {overflow-y:hidden; overflow-x:auto; position:absolute; top:0; left:0; right:0; height:155px; padding-bottom:80px; -webkit-overflow-scrolling:touch}
.ibaward-wrap .photo-list {width:auto}
.ibaward-wrap .photo-list li {position:relative; display:inline-block; width:260px; height:155px; border:1px solid #e1e1e1; box-sizing:border-box}
.ibaward-wrap .photo-list li + li {margin-left:12px}
.ibaward-wrap .photo-list li:last-child {margin-right:15px}
.ibaward-wrap .photo-list li img {clip-path:none; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:auto; min-height:auto; max-width:100%; max-height:100%}
.ibaward-wrap .btn-img-big {position:absolute; bottom:10px; right:8px; width:40px; height:40px; background-position:-262px -84px}

.ibaward-wrap .ib-rel-area {overflow:hidden; position:relative; height:170px; margin-right:-15px; white-space:nowrap}
.ibaward-wrap .ib-rel-area .inner-scroll {overflow-y:hidden; overflow-x:auto; position:absolute; top:0; left:0; right:0;height:170px; padding-bottom:80px; -webkit-overflow-scrolling:touch}
.ibaward-wrap .ib-rel-list {width:auto}
.ibaward-wrap .ib-rel-item {display:inline-block; width:125px; height:175px; vertical-align:middle}
.ibaward-wrap .ib-rel-item + .ib-rel-item {margin-left:12px}
.ibaward-wrap .ib-rel-item:last-child {margin-right:15px}
.ibaward-wrap .ib-rel-item a {display:block}
.ibaward-wrap .news-list-wrap {margin-top:15px; border-top:1px solid #ddd}
.ibaward-wrap .news-list-wrap .news-item > .thumb {margin-left:17px}
.ibaward-wrap .news-list-wrap .news-item .txt-cont {width:calc(100% - 97px)}

/* 무료 푸시알림 페이지 */
.free-push-wrap {padding:20px 13px 180px; background-color:#f7f7f7; box-sizing:border-box;}
.free-push-wrap .push-box {padding:108px 30px; border:5px solid #ececec; box-sizing:border-box; text-align:center}
.free-push-wrap .push-box > p {line-height:31px; font-weight:700; color:#222; font-size:18px; letter-spacing:-0.025em;}
.free-push-wrap .push-box + .list-desc {margin-top:18px}






/* 팝업 */
.layer-wrap {display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999999; align-items:center; justify-content:center; background:rgba(0,0,0,.5)}
.layer-wrap.active {display:flex}
.layer-wrap .pop-cont {position:relative; max-width:320px; max-height:437px; padding:24px; background-color:#fff; box-sizing:border-box; overflow-y:auto; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.10)}
.layer-wrap .cont-tit {margin-bottom:24px; font-weight:bold; font-size:24px}
.layer-wrap .btns-area {margin-top:24px; text-align:center}
.layer-wrap .btn-basic {height:45px; padding:10px 26px; line-height:25px; color:#fff; font-size:15px; background-color:#28528a}
.layer-wrap .msg {font-size:14px; line-height:1.7}
.layer-wrap .msg + .msg {margin-top:24px}

.layer-noti .cont-tit {text-align:center}
.layer-noti .btn-basic {min-width:142px}
@media screen and (max-height:330px) {
    .layer-noti {overflow-y:auto}
    .layer-noti .pop-cont {position:absolute; top:0}
}

/* 공지팝업 */
.hk-noti-modal {--pop-width:470px; display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999999; background:rgba(0,0,0,.5);  width:100%; height:100%; overflow-x:hidden; overflow-y:auto; outline:0; box-sizing:border-box}
.hk-noti-modal > .modal-inner {align-items:center; justify-content:center; min-height:calc(100dvh - 40px); margin:20px;}
.hk-noti-modal .modal-cont-wrap {position:relative; max-width:var(--pop-width); background:#F5FAFF; box-sizing:border-box; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.10); padding:24px 24px 0}
.hk-noti-modal .modal-body {word-break:keep-all; overflow-wrap:anywhere}
.hk-noti-modal .modal-tit {font-size:25px}
.hk-noti-modal .modal-cont {display:flex; flex-direction:column; gap:16px; padding:24px 0; font-size:16px}
.hk-noti-modal .point {color:#BC4141; font-weight:500}
.hk-noti-modal .point strong {font-weight:500}
.hk-noti-modal .action-area {text-align:center}
.hk-noti-modal .btn-link {position:relative; display:inline-flex; align-items:center; height:40px; padding:0 24px 1px; border-radius:25rem; background:#546C83; color:#fff; font-weight:500; font-size:16px; line-height:1}
.hk-noti-modal .btn-link::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0}
.hk-noti-modal .modal-footer {padding-bottom:28px; text-align:center}
.hk-noti-modal .modal-btn-close {position:static !important; display:inline-flex; align-items:center; justify-content:center; width:120px; height:40px; border-radius:25rem; background:#546C83; color:#fff; font-size:14px; line-height:1}
.hk-noti-modal.active {display:block}
.hk-noti-modal.active > .modal-inner {display:flex}
.hk-noti-modal .popup-control {height:34px; overflow:hidden; background:#121212; margin:0 -24px; font-size:14px}
.hk-noti-modal .popup-control > .popup-inner {display:flex; align-items:center; justify-content:space-between; height:100%; padding:0 24px}
.hk-noti-modal .form-checkbox {display:inline-flex; align-items:center; position:relative}
.hk-noti-modal .form-checkbox input[type="checkbox"] {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
.hk-noti-modal .form-checkbox label {color:#fff; font-size:14px; line-height:1.1}
.hk-noti-modal .form-checkbox label {user-select:none}
.hk-noti-modal .form-checkbox label::before {content:''; display:inline-block; width:16px; height:16px; margin-right:5px; border:none; border-radius:1px; background:#fff; box-sizing:border-box; vertical-align:-3px}
.hk-noti-modal .form-checkbox input[type="checkbox"]:checked + label::before {background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10px' height='7.9px' viewBox='0 0 10 7.9'%3E%3Cpath d='M3.8,7.9L0,4.3l1.5-1.5l2.2,2.1L8.5,0L10,1.5L3.8,7.9z' fill='%23121212' /%3E%3C/svg%3E") no-repeat center center/10px 9px}
.hk-noti-modal .btn-close {display:inline-flex; align-items:center; gap:5px; position:relative; background:none; width:auto; border:none; padding-right:20px; height:14px; color:#fff; font-size:14px; line-height:1.1; white-space:nowrap}
.hk-noti-modal .btn-close::before,
.hk-noti-modal .btn-close::after {content:''; position:absolute; right:7px; top:0; width:1px; height:14px; background-color:#fff}
.hk-noti-modal .btn-close:before {transform:rotate(45deg)}
.hk-noti-modal .btn-close:after {transform:rotate(-45deg)}

.hk-noti-modal.type-img .modal-cont-wrap {background:none; padding:0}
.hk-noti-modal.type-img .modal-body {background:none}
.hk-noti-modal.type-img .modal-body > a {display:block} 
.hk-noti-modal.type-img .modal-body .img-banner {width:100%; height:auto; vertical-align:top; object-fit:contain}
.hk-noti-modal.type-img .popup-control {margin:0}