@charset "UTF-8"; /* 메인개편 (60주년) * 2024.09 ~ */ :root { --col-w-270: 270px; --col-w-336: 336px; --col-w-352: 352.33px; --col-w-373: 373px; --col-w-474: 474px; --col-w-580: 580px; --col-w-890: 890px; --ad-y-padding: 20px; --module-line-color: #ddd; --fix-module-line-color: #121212; --col-line-color: #ddd; --list-line-color: #ddd; --module-light-bg: #F7F7F7; --keycolor-koreamarket: #EA666E; --keycolor-koreamarket-text: #d54049; --keycolor-globalmarket: #54B5B1; --keycolor-globalmarket-text: #00847f; --keycolor-jipconomy: #328CC8; --keycolor-jipconomy-text: #0d79c7; --keycolor-arte: #86704f; --keycolor-travel: #2caded; --keycolor-premium9: #CA002C; --keycolor-premium9-dark: #F0626F; --icon-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; --hk-text-primary: #121212; --hk-text-secondary: #585858; --hk-up: #b50000; --hk-down: #2853b2; --hk-hold: #585858; } /* reset */ html,body {-moz-text-size-adjust:none; -webkit-text-size-adjust:none; 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} header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption {display:block} body {color:#121212; font-size:16px; font-family:-apple-system, BlinkMacSystemFont, 'Noto Sans KR', 'Apple SD Gothic Neo', 'Apple SD 산돌고딕 Neo', 'Malgun Gothic', '맑은 고딕', 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif; letter-spacing:-0.039em} 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 {max-width:100%} i,em,address,optgroup {font-style:normal} hr {display:none} input,button,textarea,select {font:inherit} 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 {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent} a {color:#121212; text-decoration:none} a:hover {text-decoration:underline; text-underline-offset:2px} a[role="button"] {cursor:pointer} /* skip nav */ .skip-navi a {display:block; height:0; margin:0 auto; overflow:hidden; font-size:0; text-align:center; background:#142c67; color:#fff} .skip-navi a:hover, .skip-navi a:active, .skip-navi a:focus {height:30px; font-size:15px; line-height:30px} /* ad */ .ad-inner {position:relative; display:inline-block; margin:0 auto; max-width:970px} .ad-inner > div[id^="div-gpt-ad"] {position:relative; min-height:90px; padding:var(--ad-y-padding) 0} .close-ad .btn-close-ad {display:none; position:absolute; right:0; bottom:0; width:24px; height:24px; background-color:#7e898f; text-align:center} .close-ad .btn-close-ad::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .close-ad .ad-inner > div[id^="div-gpt-ad"] + .btn-close-ad {display:block} .close-ad .ad-inner > div[style*="none"] + .btn-close-ad {display:none; bottom:var(--ad-y-padding)} .close-ad .ad-inner > div[id^="div-gpt-ad"] + .btn-close-ad {bottom:var(--ad-y-padding)} .ad-top {background:#f7f7f7; text-align:center; font-size:0; line-height:0} .ad-top .ad-inner > div[id^="div-gpt-ad"] {display:flex; align-items:center; justify-content:center; min-height:250px; padding-top:24px} .ad-area {margin:32px 0; text-align:center} .ad-area.bg {background:#f7f7f7} /* .ad-bottom {height:290px} */ .banner-area + .main-module {margin-top:0} .banner-area a {display:block} /* 날개 광고 영역 */ .fltAd {position:absolute; top:0; left:50%; width:1px; height:0} .fltAd .left, .fltAd .right {position:absolute; top:1250px;} .fltAd .left {/*left:-769px;*/ text-align:right} .fltAd .left div + div {margin-top:900px} .fltAd .right {right:-743px !important; text-align:left} /* common */ html {min-width:1240px} body {scrollbar-gutter: stable;} .txt-en, .txt-num, .time {letter-spacing:0} /* .txt-num, .time {font-family:Tahoma, sans-serif} */ .hk-tooltip {position:absolute; left:50%; transform:translateX(-50%); padding:6px 8px; border:1px solid #ddd; border-radius:5px; background:#fff; font-size:10px; line-height:1; white-space:nowrap; opacity:0; z-index:-1; visibility:hidden; transition:all ease .3s; letter-spacing:0; font-weight:400} .hk-tooltip::before, .hk-tooltip::after {content:''; position:absolute; border-style:solid; width:0; left:50%; transform:translateX(-50%)} .hk-tooltip::before {z-index:0} .hk-tooltip::after {z-index:1} .hk-tooltip.top {top:-32px} .hk-tooltip.top::after {border-width:5px 4px 0 4px;border-color:#fff transparent;bottom:-3.7px;} .hk-tooltip.top::before {border-width:5px 4px 0 4px;border-color:#ddd transparent;bottom:-5px;} [data-toggle="hk-tooltip"] {position:relative} [data-toggle="hk-tooltip"]:hover .hk-tooltip, [data-toggle="hk-tooltip"]:focus .hk-tooltip {opacity:1; z-index:1; visibility:visible} /* logo */ .logo--myhankyung::before {content:''; display:inline-block; width:85px; height:32px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-myhankyung2-ani.svg') no-repeat center/contain; vertical-align:top} .badge--beta {position:relative; display:inline-block; width:34px; height:15px; color:transparent} .badge--beta::before {content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='20' fill='none'%3E%3Crect width='43' height='19' x='.939' y='.5' fill='%23121212' rx='9.5'/%3E%3Cpath fill='%23fff' d='M9.572 13.5V6.227h2.912c.534 0 .98.08 1.338.238.358.159.626.379.806.66.18.28.27.602.27.967 0 .284-.057.533-.17.749-.114.213-.27.388-.469.525-.196.135-.421.231-.675.288v.071a1.658 1.658 0 0 1 1.37.842c.153.258.228.566.228.923 0 .386-.096.73-.287 1.033-.19.301-.47.539-.842.714-.372.175-.83.263-1.374.263H9.572Zm1.537-1.257h1.254c.428 0 .74-.082.937-.245a.821.821 0 0 0 .295-.66.977.977 0 0 0-.146-.533.99.99 0 0 0-.415-.362 1.423 1.423 0 0 0-.636-.132H11.11v1.932Zm0-2.972h1.14c.21 0 .398-.037.561-.11a.934.934 0 0 0 .39-.32.833.833 0 0 0 .146-.494.798.798 0 0 0-.28-.635c-.185-.161-.448-.242-.789-.242H11.11v1.8Zm5.074 4.229V6.227h4.9v1.268h-3.362v1.733h3.11v1.268h-3.11v1.736h3.377V13.5h-4.915Zm5.846-6.005V6.227h5.973v1.268h-2.227V13.5h-1.52V7.495H22.03ZM29.35 13.5h-1.648l2.51-7.273h1.982l2.507 7.273h-1.648l-1.821-5.61h-.057L29.35 13.5Zm-.104-2.859h3.893v1.2h-3.893v-1.2Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .logo--myhankyung:has(.badge--beta) {display:inline-flex; align-items:center; text-decoration:none; vertical-align:middle} .logo--myhankyung:has(.badge--beta)::before, .logo--myhankyung:has(.badge--beta) .badge--beta {flex:0 0 auto} .logo--myhankyung:has(.badge--beta) .badge--beta {top:1px} .slick-slide img {display:inline} /* icon */ img.icon--member, img.icon--premium, img.icon--pro {margin-right:4px} .icon-membersonly2 {display:inline-block; width:10px; height:13px; margin:0 0 0 6px; background:url('https://hkstatic.hankyung.com/img/www/w/common/icon/icon-lock.svg') no-repeat center center/contain; color:transparent; overflow:hidden; text-indent:-999px; vertical-align:-1px} .badge-beta {display:inline-block; font-style:italic; font-weight:700; font-size:13px; color:#ee4c4c; letter-spacing:0} .icon--cir-x {display:inline-block; width:12px; height:12px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23888' d='M6 12A6 6 0 1 0 6 0a6 6 0 0 0 0 12Z'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' d='M8 4 4 8m0-4 4 4'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h12v12H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} /* ⓧ */ .i-vote {display:inline-block; width:16px; height:16px; background:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-vote.svg') no-repeat 50% 50%/contain} /* badge */ .badge-basic {display:inline-block; padding:6px 10px; border-radius:74px; border:1px solid #ddd; background:#fff; font-weight:normal; font-size:12px; line-height:1; vertical-align:top; box-sizing:border-box} /* button */ .btn-basic {display:inline-block; min-width:120px; height:34px; padding:0 16px 1px; border-radius:25rem; border:1px solid #585858; background:#fff; font-weight:normal; font-size:14px; line-height:1; box-sizing:border-box; text-align:center} .btn-basic:after {content:''; display:inline-block; width:1px; height:32px; vertical-align:-11px} .btn-basic.type-dark {border-color:#121212; background:#121212; color:#fff} /* header */ .nav-dropdown[data-event="hover"] .nav-dropdown__toggle {position:relative; display:inline-flex; align-items:center; gap:4px} .nav-dropdown[data-event="hover"] .nav-dropdown__menu {position:absolute; left:0; right:0; z-index:-1; padding:24px 24px 25px; border:1px solid #ddd; background:#fff; visibility:hidden; transform:scaleY(0); transform-origin:center top; transition:transform cubic-bezier(.4,0,.6,1) 261ms} .nav-dropdown[data-event="hover"] .nav-dropdown-inner {min-width:94px} /* .nav-dropdown[data-event="hover"] .nav-dropdown-etc {margin-top:16px; padding-top:16px; border-top:1px solid #ddd} .nav-dropdown[data-event="hover"] .nav-dropdown-etc .nav-desc {min-width:110px; color:#888; font-size:12px; word-break:keep-all} */ .nav-dropdown[data-event="hover"] .nav__list {display:flex; flex-direction:column; gap:16px; opacity:0; transition:opacity cubic-bezier(.4,0,.6,1) 261ms; position:relative} .nav-dropdown[data-event="hover"] .nav__list a {display:block; white-space:nowrap} .nav-dropdown[data-event="hover"] .nav__list .badge-beta {margin-left:2px; font-size:10px; transform:translateY(-4px)} .nav-dropdown[data-event="hover"] .nav__list .i-vote {margin-right:4px; vertical-align:-3px} .nav-dropdown[data-event="hover"] .nav-dropdown-inner:has(>.nav__list:not(:only-child)) {display:grid; grid-template-columns:repeat(2, auto); column-gap:49px} .nav-dropdown[data-event="hover"] .nav-dropdown-inner:has(>.nav__list:not(:only-child)) .nav__list + .nav__list::before {content:''; position:absolute; top:0; bottom:0; left:-25px; width:1px; background:#ddd} .nav-dropdown[data-event="hover"]:focus-within .nav-dropdown__menu:not(:has(input:focus)), .nav-dropdown[data-event="hover"]:hover .nav-dropdown__menu {visibility:visible; transform:scaleY(1); z-index:9} .nav-dropdown[data-event="hover"]:focus-within .nav__list, .nav-dropdown[data-event="hover"]:hover .nav__list {opacity:1} .nav-dropdown-more[data-event="hover"] .nav-dropdown__toggle {padding-right:30px; font-size:15px} .nav-dropdown-more[data-event="hover"] .nav-dropdown__toggle::after {content:''; display:inline-block; width:18px; height:18px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Cpath fill='none' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='m5.002 6.75 4.5 4.5 4.5-4.5'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu {top:44px; padding:26px 24px 27px; border-top:none; border-left:none; border-right:none; background:rgba(255, 255, 255, 1); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); font-size:13px; box-sizing:border-box; overflow:hidden} .nav-dropdown-more[data-event="hover"] .nav-dropdown-inner {display:flex; flex-direction:column; align-items:center; justify-content:center} .nav-dropdown-more[data-event="hover"] .nav-block .nav__list {display:grid; row-gap:14px; column-gap:14px} .nav-dropdown-more[data-event="hover"] .nav-block .nav__list a {padding:5px 8px; border-radius:6px; text-decoration:none} .nav-dropdown-more[data-event="hover"] .nav-block .nav__list a:hover {background:#f7f7f7} .nav-dropdown-more[data-event="hover"] .nav-block:not(:first-child) {margin-left:36px; padding-left:36px; border-left:1px solid #ddd} .nav-dropdown-more[data-event="hover"] .nav-block:nth-child(1) .nav__list {grid-template-columns:repeat(6, auto)} .nav-dropdown-more[data-event="hover"] .nav-block:nth-child(2) .nav__list {grid-template-columns:repeat(2, auto)} /* >> */ .nav-dropdown-more[data-event="hover"] .nav-service-mn {display:flex} .nav-dropdown-more[data-event="hover"] .nav-service-mn + .nav-service-mn {margin-top:24px; padding-top:24px; border-top:1px solid rgba(255, 255, 255, 0.20)} .nav-dropdown-more[data-event="hover"] .nav-service-mn .tit-service-group {flex:0 0 auto; width:120px; padding-top:4px; font-weight:700; font-size:15px} .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block-group {flex:1 1 auto; display:flex; width:calc(100% - 120px)} .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block .nav__list li {width:139px} .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:only-child .nav__list {grid-template-columns:repeat(8, auto); column-gap:0} .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(1) .nav__list {grid-template-columns:repeat(6, auto); column-gap:0} .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(2) .nav__list {grid-template-columns:repeat(2, auto); column-gap:28px} .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:only-child .nav__list li:nth-child(8n), .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(1) .nav__list li:nth-child(6n), .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(2) .nav__list li {width:auto} .nav-dropdown-more .banner-box {margin:16px 0 0 8px} .nav-dropdown-more .banner-box img {width:200px; height:52px; object-fit:contain; object-position:left top} /* / */ /* .hk-header-main {position:sticky; top:0; z-index:99} */ .hk-header-main-inner {border-bottom:1px solid #121212} .hk-header-main .header-inner {min-width:1200px; max-width:1200px; margin:0 auto} .header-top .header-inner {position:relative} .header-top .main-logo-area {display:flex; align-items:center; justify-content:center; gap:10px; padding:40px 0 24px} .header-top .main-logo-area .emblem {display:inline-block; width:135px; height:50px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/emblem-hk-60th.svg?v=2') no-repeat 50% 50%/contain} .header-top .rel-service {position:absolute; top:55px; left:0} .header-top .rel-service-list {display:flex; align-items:center; gap:40px} .header-top .rel-service-list:has(.mn-newspaper) {gap:32px} .header-top .rel-service-list .hit {display:inline-flex; align-items:center; height:24px; vertical-align:top} .header-top .rel-service-list .hit::before {content:''; display:inline-block; background-repeat:no-repeat; background-size:contain; vertical-align:top} .header-top .rel-service-list .mn-newspaper .hit::before {width:26px; height:20px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/icon-rel-newspaper.svg'); transform:translateY(2px)} .header-top .rel-service-list .mn-hktv .hit::before {width:44px; height:22px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/icon-rel-hktv.svg')} .header-top .rel-service-list .mn-wsj .hit::before {width:28px; height:16px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/icon-rel-wsj.svg')} /* .header-top .rel-service-list .mn-ked .hit::before {width:20px; height:20px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/icon-rel-ked.svg')} */ .header-top .rel-service-list .mn-ked .hit::before {width:41px; height:28px; background-image: url('https://hkstatic.hankyung.com/resource/www/main/img/icon-rel-kedglobal.svg')} .header-top .rel-service-list .mn-subscription .hit::before {width:24px; height:24px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/icon-rel-subscription.svg')} .header-top .rel-service-list .mn-allmenu > .gnb__btn-allmenu {font-size:0; line-height:0; color:transparent; gap:0; vertical-align:top} .header-top .rel-service-list .mn-allmenu > .gnb__btn-allmenu::before {width:28px; height:28px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M3.5 14h21m-21-7h21m-21 14h21'/%3E%3C/svg%3E")} .header-top-util {position:absolute; top:55px; right:0; display:flex; align-items:center; gap:26px} .header-top-util > .item > [class*="btn-"]:not(:has(.blind)) {line-height:24px} .header-top-util .logo--foryou::before {height:24px} .header-top-util .hk-top__user .btn-hk-user.before-login {position:relative} .header-top-util .hk-top__user .btn-hk-user.before-login::after {content:''; position:absolute; top:-7px; right:-18px; display:inline-block; width:20px; height:20px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='15' fill='none'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='.836' x2='23.276' y1='15.636' y2='-25.598' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0%25' stop-color='%23569AFF'%3E%3Canimate attributeName='stop-color' dur='5s' repeatCount='indefinite' values='%23569AFF;%23EA35B7;%23FF5648;%23FB9905;%23569AFF'/%3E%3C/stop%3E%3Cstop offset='33%25' stop-color='%23EA35B7'%3E%3Canimate attributeName='stop-color' dur='5s' repeatCount='indefinite' values='%23EA35B7;%23FF5648;%23FB9905;%23569AFF;%23EA35B7'/%3E%3C/stop%3E%3Cstop offset='66%25' stop-color='%23FF5648'%3E%3Canimate attributeName='stop-color' dur='5s' repeatCount='indefinite' values='%23FF5648;%23FB9905;%23569AFF;%23EA35B7;%23FF5648'/%3E%3C/stop%3E%3Cstop offset='100%25' stop-color='%23FB9905'%3E%3Canimate attributeName='stop-color' dur='5s' repeatCount='indefinite' values='%23FB9905;%23569AFF;%23EA35B7;%23FF5648;%23FB9905'/%3E%3C/stop%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23a)' fill-rule='evenodd' d='M10.684 0c.045 0 .084.028.1.072l1.127 3.06c.185.504.271.737.404.932.12.175.266.329.434.453.187.14.41.23.891.423l2.93 1.177a.112.112 0 0 1 .068.105.112.112 0 0 1-.068.104l-2.93 1.177c-.481.194-.704.284-.89.423a1.888 1.888 0 0 0-.435.453c-.133.195-.22.428-.404.932l-1.127 3.06a.107.107 0 0 1-.1.072.107.107 0 0 1-.1-.071L9.459 9.31c-.185-.504-.272-.737-.405-.932a1.886 1.886 0 0 0-.433-.453c-.187-.139-.41-.23-.892-.423l-2.93-1.177a.112.112 0 0 1-.068-.104c0-.047.028-.088.069-.105l2.93-1.177c.48-.193.704-.284.89-.423a1.87 1.87 0 0 0 .434-.453c.133-.195.22-.428.405-.931l1.126-3.06a.107.107 0 0 1 .1-.072ZM2.447 0c.018 0 .034.012.04.03l.464 1.257c.076.207.111.303.166.383.05.072.11.135.178.187.077.057.169.094.367.173l1.203.484a.046.046 0 0 1 .029.043.046.046 0 0 1-.029.043l-1.203.484c-.198.08-.29.116-.367.173a.775.775 0 0 0-.178.187c-.055.08-.09.176-.166.382l-.463 1.258a.044.044 0 0 1-.041.03.044.044 0 0 1-.041-.03l-.463-1.258c-.076-.206-.112-.302-.166-.382a.775.775 0 0 0-.179-.187c-.077-.057-.168-.094-.366-.173L.028 2.6A.046.046 0 0 1 0 2.557c0-.02.011-.036.028-.043l1.204-.484c.198-.08.29-.116.366-.173a.775.775 0 0 0 .179-.187c.054-.08.09-.176.166-.383L2.406.03a.044.044 0 0 1 .04-.03Zm2.316 9.916a.044.044 0 0 0-.04-.03.044.044 0 0 0-.042.03l-.463 1.258c-.076.207-.111.302-.166.383a.774.774 0 0 1-.178.186c-.077.057-.169.094-.367.174l-1.203.483a.046.046 0 0 0-.029.043c0 .02.012.036.029.043l1.203.484c.198.08.29.117.367.174a.75.75 0 0 1 .178.186c.055.08.09.176.166.383l.463 1.258a.045.045 0 0 0 .041.029.044.044 0 0 0 .041-.03l.463-1.257c.076-.207.112-.303.166-.383a.776.776 0 0 1 .179-.186c.077-.057.168-.095.366-.174l1.204-.484a.046.046 0 0 0 .028-.043.046.046 0 0 0-.028-.043l-1.204-.483c-.198-.08-.29-.117-.366-.174a.774.774 0 0 1-.179-.187c-.054-.08-.09-.175-.166-.382l-.463-1.258Z' clip-rule='evenodd'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top; pointer-events:none} .header-top .date-area {position:absolute; top:24px; left:0} .header-top .date-area .date {font-size:12px} .main__gnb__wrap {position:relative; border-top:1px solid #eee} .main__gnb__wrap .header-inner {display:flex; justify-content:space-between; align-items:center} .main__gnb {display:flex; justify-content:center} .main__gnb a:hover {text-underline-offset:3px} .main__gnb > li {display:inline-flex; align-items:center; height:44px; padding:0 12px} .main__gnb > li:first-child {padding-left:0} .main__gnb > li:last-child {padding-right:0} .main__gnb > li.bar {padding-left:0} .main__gnb > li.bar::before {content:''; display:inline-block; width:1px; height:16px; margin:0 20px 0 12px; background:#D9D9D9; transform:translateY(1px)} .main__gnb li > .nav-link, .main__gnb li > .nav-dropdown__toggle {font-weight:500} .main__gnb .nav-link {padding:3px 0; font-size:15px; line-height:1; white-space:nowrap; text-decoration:none} .main__gnb .nav-link:hover, .main__gnb .nav-link:focus {text-decoration:underline; text-underline-offset:3px} .main__gnb .nav-dropdown:not(.nav-dropdown-more) {position:relative} .main__gnb .nav-dropdown[data-event="hover"]:not(.nav-dropdown-more) .nav-dropdown__menu {top:37px; right:auto; padding:16px} .main__gnb .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu {border:none; background:#142C67; color:#fff} /* .main__gnb .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu::before {content:''; position:absolute; top:-2px; height:2px; width:100%} */ .main__gnb .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu a {color:#fff} .main__gnb .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu .new > a::after {content:''; display:inline-block; width:6px; height:6px; border-radius:100%; background:#EE4C4C; transform:translate(4px, -4px)} .main__gnb .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu .nav__list {font-size:13px} .main__gnb .nav-dropdown-more[data-event="hover"] .nav-block:not(:first-child) {border-color:rgba(221, 221, 221, 0.20)} /* .main__gnb .nav-dropdown-more[data-event="hover"] .nav-block .nav__list a:visited {color:#818FAF} */ .main__gnb .nav-dropdown-more[data-event="hover"] .nav-block .nav__list a:hover, .main__gnb .nav-dropdown-more[data-event="hover"] .nav-block .nav__list a:focus {background:none; color:#79ADD4} .main__gnb .nav-dropdown-more[data-event="hover"] .service-premium .tit-service-group::after {content:''; display:inline-block; width:16px; height:16px; margin-left:4px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M1.666 6.5h12.667m-7.667-4-1.333 4L8 14.167 10.666 6.5l-1.333-4m-.924 11.508 5.973-7.167c.101-.121.152-.182.171-.25a.332.332 0 0 0 0-.182c-.02-.068-.07-.129-.171-.25l-2.89-3.467a.715.715 0 0 0-.123-.131.333.333 0 0 0-.105-.05c-.043-.011-.089-.011-.18-.011H4.915c-.092 0-.138 0-.18.011a.333.333 0 0 0-.105.05c-.036.025-.066.06-.125.13L1.618 6.16c-.102.121-.152.182-.172.25a.333.333 0 0 0 0 .182c.02.068.07.129.172.25l5.972 7.167c.14.17.211.254.295.284a.333.333 0 0 0 .23 0c.083-.03.154-.115.294-.284Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:-3px} /* ######### */ /* .nav-dropdown-more[data-event="hover"] .nav-service-mn.service-premium .nav-block:only-child .nav__list {display:flex; flex-wrap:wrap; flex-direction:row} */ .nav-dropdown-more .allmenu-serach-wrap {padding:28px 0 0; box-sizing:border-box} .nav-dropdown-more .allmenu-serach-wrap > .allmenu-serach-inner {position:relative; width:400px} .nav-dropdown-more .allmenu-serach-wrap .search-input {position:relative} .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field {width:100%; padding:0 50px 0 24px; border:none; border-radius:50rem; background:#fff; box-sizing:border-box; vertical-align:top; color:#121212; font-size:14px; line-height:40px; outline:none} .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field::-webkit-search-cancel-button {-webkit-appearance:none} .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field::-webkit-input-placeholder {color:#888} .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field:-ms-input-placeholder {color:#888} .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field:-mos-input-placeholder {color:#888} .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field::placeholder {color:#888; opacity:1} .nav-dropdown-more .allmenu-serach-wrap .search-input .btn-inp-reset {display:none; position:absolute; top:50%; right:12px; transform:translateY(-50%); height:40px; padding:0 12px; line-height:0} /* .nav-dropdown-more .allmenu-serach-wrap .search-input-area:has(.inp-field:focus), .nav-dropdown-more .allmenu-serach-wrap .search-input-area.active {} .nav-dropdown-more .allmenu-serach-wrap .search-input-area .inp-field:focus, .nav-dropdown-more .allmenu-serach-wrap .search-input-area.active .inp-field {} */ .nav-dropdown-more .search-auto-layer {display:none; position:absolute; left:0; right:0; bottom:48px; z-index:2; padding:40px 16px 12px; border:none; border-radius:8px; background:#fff; box-sizing:border-box} .main__gnb .nav-dropdown-more[data-event="hover"] .nav-dropdown__menu .search-auto-layer a {color:#121212} .nav-dropdown-more .search-auto-layer .kwd-list {max-height:124px; overflow-y:auto} .nav-dropdown-more .search-auto-layer .kwd-list::-webkit-scrollbar {width:4px; height:4px; display:inherit} .nav-dropdown-more .search-auto-layer .kwd-list::-webkit-scrollbar-button {width:0; height:0} .nav-dropdown-more .search-auto-layer .kwd-list::-webkit-scrollbar-track-piece {background:transparent} .nav-dropdown-more .search-auto-layer .kwd-list::-webkit-scrollbar-thumb {border-radius:0; background:#ddd} .nav-dropdown-more .search-auto-layer .kwd-list > li {padding-right:10px} .nav-dropdown-more .search-auto-layer .kwd-list > li + li {margin-top:4px} .nav-dropdown-more .search-auto-layer .kwd {display:block; position:relative; width:100%; min-height:28px; padding:0 8px; border-radius:4px; font-weight:400; font-size:14px; line-height:28px; box-sizing:border-box; text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .nav-dropdown-more .search-auto-layer .kwd.on, .nav-dropdown-more .search-auto-layer .kwd:hover, .nav-dropdown-more .search-auto-layer .kwd:focus-visible {background-color:#f7f7f7; outline:none; text-decoration:none} .nav-dropdown-more .search-auto-layer .kwd .mark {color:#436f91; font-weight:400} .nav-dropdown-more .search-auto-layer .btn-close-auto {position:absolute; top:12px; right:6px; padding:7px 10px} .nav-dropdown-more .search-auto-layer .btn-close-auto::after {content:''; display:block; width:10px; height:10px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m11 1.5-10 10m0-10 10 10'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .nav-dropdown-more .search-auto-layer.active {display:block} .main__gnb > li:not(.nav-dropdown__menu) .nav__list {font-size:14px; line-height:1.2} .main__gnb > li:not(.nav-dropdown__menu) .nav-dropdown__menu {left:-4px} .main__gnb > li:not(.nav-dropdown__menu):first-child .nav-dropdown__menu {left:-14px} .main__gnb__util {position:relative} .promotion-nav-wrap {position:absolute; top:-1px; right:50px; outline:none} .promotion-nav {width:170px; height:25px; overflow:hidden; text-align:right} .promotion-nav .slick-slide {border:none} .promotion-nav a {display:inline-block; padding-right:2px; font-weight:normal; font-size:15px; line-height:25px; text-decoration:none; box-sizing:border-box; max-width:170px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap} .promotion-nav-all {position:absolute; top:0; right:0; min-width:180px; border:1px solid #ddd; border-radius:5px; background:#fff; text-align:left; box-sizing:border-box; opacity:0; z-index:-1; visibility:hidden; transition:all ease .2s} .promotion-nav-all ul {padding:10px 20px; text-align:center} .promotion-nav-all li {font-size:14px; white-space:nowrap} .promotion-nav-all li a {display:block; padding:6px 0; font-size:14px; white-space:nowrap; text-align:left; max-width:170px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap} .promotion-nav-all.on {opacity:1; visibility:visible; z-index:9999} .main__gnb__wrap .hk-top__search {position:relative} .main__gnb__wrap .hk-top__search .btn-total-search {padding:0 6px; margin-right:-6px} .main__gnb__wrap .hk-top__search .btn-total-search .icon-svg {display:none} .main__gnb__wrap .hk-top__search .btn-total-search::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m21 21-6-6m2-5a7 7 0 1 1-14 0 7 7 0 0 1 14 0Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} /* [2025.01] 메인 gnb 및 섹션 갓머리 개편 */ /* 공통 logo */ /* logo: 코리아마켓 */ .logo__koreamarket::before {content:''; display:inline-block; width:106px; height:19px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-koreamarket.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__koreamarket--w::before {content:''; display:inline-block; width:106px; height:19px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-koreamarket-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 글로벌마켓 */ .logo__globalmarket::before {content:''; display:inline-block; width:106px; height:19px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-globalmarket.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__globalmarket--w::before {content:''; display:inline-block; width:106px; height:19px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-globalmarket-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 집코노미 */ .logo__jipconomy::before {content:''; display:inline-block; width:63px; height:22px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-jipconomy.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top; position:relative} .logo__jipconomy--w::before {content:''; display:inline-block; width:63px; height:22px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-jipconomy-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top; position:relative} /* logo: 트래블 */ .logo__travel::before {content:''; display:inline-block; width:72px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-travel.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__travel--w::before {content:''; display:inline-block; width:72px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-travel-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 한경 ESG */ .logo__esg::before {content:''; display:inline-block; width:47px; height:12px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-esg.svg') no-repeat 0 0/contain; vertical-align:top} .logo__esg--w::before {content:''; display:inline-block; width:47px; height:12px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-esg.svg') no-repeat 0 0/contain; vertical-align:top} /* logo: 한경 BIO Insight */ .logo__bioinsight::before {content:''; display:inline-block; width:97px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-bioinsight.svg') no-repeat 0 0/contain; vertical-align:top} .logo__bioinsight--w::before {content:''; display:inline-block; width:97px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-bioinsight-w.svg') no-repeat 0 0/contain; vertical-align:top} /* logo: 한경 CHO Insight */ .logo__choinsight::before {content:''; display:inline-block; width:90px; height:16px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-choinsight.svg') no-repeat 0 0/contain; vertical-align:top} .logo__choinsight--w::before {content:''; display:inline-block; width:90px; height:16px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-choinsight-w.svg') no-repeat 0 0/contain; vertical-align:top} /* logo: 한경 Geeks */ .logo__geeks::before {content:''; display:inline-block; width:87px; height:14px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-geeks.svg') no-repeat 0 0/contain; vertical-align:top} .logo__geeks--w::before {content:''; display:inline-block; width:87px; height:14px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-geeks-w.svg') no-repeat 0 0/contain; vertical-align:top} /* logo: 로앤비즈 */ .logo__lawbiz::before {content:''; display:inline-block; width:74px; height:14px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-lawbiz.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__lawbiz--w::before {content:''; display:inline-block; width:74px; height:14px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-lawbiz-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 마켓인사이트 */ .logo__marketinsight::before {content:''; display:inline-block; width:88px; height:18px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-marketinsight.svg?v=2') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__marketinsight--w::before {content:''; display:inline-block; width:88px; height:18px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-marketinsight-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 아르떼 */ .logo__arte::before {content:''; display:inline-block; width:48px; height:18px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-arte.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__arte--w::before {content:''; display:inline-block; width:48px; height:18px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-arte-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 입법 익스플로러 */ .logo__legiexplorer::before {content:''; display:inline-block; width:79px; height:20px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-legiexplorer.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__legiexplorer--w::before {content:''; display:inline-block; width:79px; height:20px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-legiexplorer-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 프라이스 */ .logo__price::before {content:''; display:inline-block; width:63px; height:18px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-price-v2.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__price--w::before {content:''; display:inline-block; width:63px; height:18px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-price-w-v2.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: wave */ .logo__wave::before {content:''; display:inline-block; width:36px; height:10px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-wave-v2.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__wave--w::before {content:''; display:inline-block; width:36px; height:10px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-wave-v2-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 모닝루틴 */ .logo__mr::before {content:''; display:inline-block; width:40px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-morningroutine-v2.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__mr--w::before {content:''; display:inline-block; width:40px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-morningroutine-v2-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 한경epicAI */ .logo__epicai::before {content:''; display:inline-block; width:75px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-epicai.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__epicai--w::before {content:''; display:inline-block; width:75px; height:15px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-epicai-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* logo: 한경 프리미엄9 */ .logo__premium9::before {content:''; display:inline-block; width:207px; height:24px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-premium9.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__premium9--w::before {content:''; display:inline-block; width:207px; height:24px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-premium9-w.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .main__gnb .nav-premium .nav-link {color:#7B5F32; cursor:default} .main__gnb .nav-premium .nav-link::before {content:''; display:inline-block; width:16px; height:16px; margin-right:2px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%237B5F32' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M1.666 6h12.667M6.666 2 5.333 6 8 13.667 10.666 6 9.333 2m-.924 11.508 5.973-7.167c.101-.121.152-.182.171-.25a.332.332 0 0 0 0-.182c-.02-.068-.07-.129-.171-.25l-2.89-3.467a.715.715 0 0 0-.123-.131.333.333 0 0 0-.105-.05C11.22 2 11.175 2 11.084 2H4.915c-.092 0-.138 0-.18.011a.333.333 0 0 0-.105.05c-.036.025-.066.06-.125.13L1.618 5.66c-.102.121-.152.182-.172.25a.333.333 0 0 0 0 .182c.02.068.07.129.172.25l5.972 7.167c.14.17.211.254.295.284a.333.333 0 0 0 .23 0c.083-.03.154-.115.294-.284Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:-2px} .main__gnb .nav-premium .nav__list a[class*="logo__"] {line-height:0} .main__gnb .nav-premium .nav__list a.logo__lawbiz, .main__gnb .nav-premium .nav__list a.logo__legiexplorer, .main__gnb .nav-premium .nav__list a.logo__arte, .main__gnb .nav-premium .nav__list a.logo__price {transform:translateY(-4px)} .nav-dropdown[data-event="hover"] .nav-dropdown-etc {margin-top:16px; padding-top:16px; border-top:1px solid #ddd} .nav-dropdown[data-event="hover"] .nav-dropdown-etc .nav-desc {min-width:115px; color:#888; font-size:12px; line-height:1.45; word-break:keep-all} .hk-header-main.ver-2025 .main__gnb > li.bar::before {display:none} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-dropdown-inner {display:block; max-width:1200px; margin:0 auto; min-width:auto} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-dropdown__toggle {padding-left:12px; line-height:1} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-block .nav__list {column-gap:0; row-gap:12px} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-block .nav__list a {padding:5px 0; line-height:1.2} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-block .nav__list + .nav__list {margin-top:12px} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-block:not(:first-child) {min-width:200px; margin-left:0; padding:0 0 0 64px; box-sizing:border-box} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-service-mn {display:block} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block-group {width:auto} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block .nav__list li {width:auto} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(1) {flex:1} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(1) .nav__list {grid-template-columns:repeat(8, 1fr); column-gap:0} .hk-header-main .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(2) .nav__list {grid-template-columns:repeat(1, auto); column-gap:12px} .hk-header-main .nav-dropdown-more[data-event="hover"] .tit-service-group {display:block; width:auto; margin-bottom:15px; padding:0; color:rgba(255,255,255,.5); font-weight:500; font-size:12px} .hk-header-main .nav-cont-group {display:flex; margin-top:24px; padding-top:24px; border-top:1px solid rgba(255, 255, 255, 0.20)} .hk-header-main .nav-cont-group .service-media {flex:1} .hk-header-main .nav-cont-group .service-media .nav-block {width:100%} .hk-header-main .nav-cont-group .service-media .nav-block .nav__list {grid-template-columns:repeat(7, 1fr)} .hk-header-main .nav-cont-group .allmenu-serach-wrap {flex:0 0 auto; width:200px; padding:0} .hk-header-main .nav-dropdown-more .allmenu-serach-wrap > .allmenu-serach-inner {width:180px} .hk-header-main .nav-dropdown-more .allmenu-serach-wrap .search-input .inp-field {border-radius:4px; padding:0 36px 0 16px; line-height:36px} .hk-header-main .nav-dropdown-more .allmenu-serach-wrap .search-input .btn-inp-reset {right:0} /* [2025.10.13] gnb 메뉴구조 변경 버전 */ .hk-header-main .main__gnb__wrap.ver-202510 .nav-cont-group {justify-content:space-between} .hk-header-main .main__gnb__wrap.ver-202510 .nav-cont-group .service-media {flex:initial} .hk-header-main .main__gnb__wrap.ver-202510 .nav-cont-group .service-media .nav-block .nav__list {grid-template-columns:repeat(7, auto); column-gap:64px} .hk-header-main .main__gnb__wrap.ver-202510 .nav-dropdown-more[data-event="hover"] .nav-block:not(:first-child) {min-width:180px; padding:0 0 0 60px} .hk-header-main .main__gnb__wrap.ver-202510 .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block-group {justify-content:space-between} .hk-header-main .main__gnb__wrap.ver-202510 .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(1) {flex:initial} .hk-header-main .main__gnb__wrap.ver-202510 .nav-dropdown-more[data-event="hover"] .nav-service-mn .nav-block:not(:only-child):nth-child(1) .nav__list {grid-template-columns:repeat(8, auto); column-gap:60px} .hk-header-main .main__gnb__wrap.ver-202510 .nav-cont-group .allmenu-serach-wrap {width:180px} .hk-header-main .main__gnb__wrap.ver-202510 .hk-top__search.active .hk-top__search__layer .search__input__wrap {width:230px} /* // gnb 메뉴구조 변경 버전 */ /* 고정헤더 */ .isSticky .hk-header-main-inner {position:fixed; top:0; left:0; right:0; z-index:99; background:#fff; transition:position ease .25s} .isSticky .header-top, .isSticky .main__gnb__wrap {padding:0 20px;} .isSticky .header-top .main-logo-area {padding:16px 0} .isSticky .header-top .logo-hankyung img {width:100px; height:25px} .isSticky .header-top .main-logo-area .emblem {width:68px; height:25px} .isSticky .header-top .rel-service {top:16px} .isSticky .header-top-util {top:12px} .isSticky .header-top .hk-tooltip {display:none} .isSticky .header-top .date-area {display:none} /* [닷컴공통] 통합검색 레이어 */ .hk-top__search__layer {position:absolute; top:-8px; right:0; height:40px; z-index:-1; visibility:hidden; opacity:0} .hk-top__search__layer .inp-field {padding:0 12px 0 0; border:none; font-size:13px; outline:none} .hk-top__search__layer .inp-field::-webkit-search-cancel-button {-webkit-appearance:none} .hk-top__search__layer .inp-field::-webkit-input-placeholder {color:#888} .hk-top__search__layer .inp-field:-ms-input-placeholder {color:#888} .hk-top__search__layer .inp-field:-mos-input-placeholder {color:#888} .hk-top__search__layer .inp-field::placeholder {color:#888; opacity:1} .hk-top__search__layer .layer__inner {min-height:40px; padding:0 52px 0 20px; border-radius:12px; border:1px solid #ddd; background:#fff; box-sizing:border-box} .hk-top__search__layer .search__input__wrap {display:flex; width:0; height:38px; box-sizing:border-box; border-top:1px solid transparent; border-bottom:1px solid transparent; transition:all ease .25s} .hk-top__search__layer .search__input__wrap .btn-search {flex:0 0 auto; padding:0 4px; font-size:0} .hk-top__search__layer .search__input__wrap .btn-search::before {content:''; display:inline-block; width:18px; height:18px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='m15.75 15.75-4.5-4.5m1.5-3.75a5.25 5.25 0 1 1-10.5 0 5.25 5.25 0 0 1 10.5 0Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .hk-top__search__layer .search__input {display:flex; align-items:center; flex:1; width:calc(100% - 34px)} .hk-top__search__layer .search__input .inp-field {flex:1; width:calc(100% - 12px); height:100%; background:transparent} .hk-top__search__layer .search__input .btn-inp-reset {flex:0 0 auto; font-size:0; padding:4px} .hk-top__search__layer .search__input .btn-inp-reset .icon--cir-x {width:14px; height:14px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cg stroke-linecap='round' stroke-linejoin='round' clip-path='url(%23a)'%3E%3Cpath fill='%23585858' stroke='%23585858' stroke-width='2' d='M7 12.833A5.833 5.833 0 1 0 7 1.167a5.833 5.833 0 0 0 0 11.666'/%3E%3Cpath stroke='%23fff' stroke-width='1.5' d='m8.75 5.25-3.5 3.5m0-3.5 3.5 3.5'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h14v14H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")} .hk-top__search__layer .btn-close {position:absolute; top:0; right:16px; width:32px; height:40px} .hk-top__search__layer .btn-close .icon-svg {display:none} .hk-top__search__layer .btn-close::before {content:''; display:inline-block; width:24px; height:24px; background:var(--icon-x); vertical-align:top} .hk-top__search__layer .search__auto__wrap {display:none; padding:0 0 3px; box-sizing:border-box; font-size:13px; overflow-y:auto; scrollbar-width:auto} .hk-top__search__layer .search__auto__wrap::-webkit-scrollbar {width:4px} .hk-top__search__layer .search__auto__wrap::-webkit-scrollbar-track {background-color: transparent;} .hk-top__search__layer .search__auto__wrap::-webkit-scrollbar-thumb {border-radius:2px; background-color:#D7D7D7} .hk-top__search__layer .search__auto__wrap::-webkit-scrollbar-button {width: 0; height: 0;} @-moz-document url-prefix() { .hk-top__search__layer .search__auto__wrap {scrollbar-width:thin; scrollbar-color: #D7D7D7 transparent} } .hk-top__search__layer .autocomplete-result > li > a {display:flex; max-width:288px; padding:8px 4px 8px 0; box-sizing:border-box; text-decoration:none} .hk-top__search__layer .autocomplete-result > li > a:hover {background:#f7f7f7} .hk-top__search__layer .autocomplete-result > li mark {background:none} .hk-top__search__layer .autocomplete-result > li.type-stock > a {justify-content:space-between} .hk-top__search__layer .autocomplete-result > li.type-stock > a > span {flex:0 0 auto; white-space:nowrap; text-overflow:ellipsis; overflow:hidden} .hk-top__search__layer .autocomplete-result > li.type-stock .category, .hk-top__search__layer .autocomplete-result > li.type-stock .ko {color:#888; text-align:right} .hk-top__search__layer .autocomplete-result > li.type-stock .code {letter-spacing:0} .hk-top__search__layer .autocomplete-result > li.type-stock > a > .code {width:30%} .hk-top__search__layer .autocomplete-result > li.type-stock > a > .name {width:50%} .hk-top__search__layer .autocomplete-result > li.type-stock > a > .category {width:20%} .hk-top__search__layer .autocomplete-result > li.type-stock mark {color:#ee4c4c} .hk-top__search__layer .autocomplete-result > li.type-stock-global > a > .name {width:40%} .hk-top__search__layer .autocomplete-result > li.type-stock-global > a > .ko {width:60%} .hk-top__search__layer .autocomplete-result > li.type-default mark {color:#436f91} .hk-top__search__layer.auto .search__input__wrap {border-bottom-color:#ddd} .hk-top__search__layer.auto .search__auto__wrap {display:block; margin-right:-32px} .hk-top__search.active .hk-top__search__layer {visibility:visible; opacity:1; z-index:200} .hk-top__search.active .hk-top__search__layer .search__input__wrap {width:260px} /* [닷컴공통] 회원 레이어 */ [class^="icon-mylogin-"] {display:inline-block; width:20px; height:20px; border-radius:25rem; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; vertical-align:middle} .icon-mylogin-email {background-image:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-account-hk.svg')} .icon-mylogin-kakao {background-image:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-account-kakao.svg')} .icon-mylogin-naver {background-image:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-account-naver.svg')} .icon-mylogin-apple {background-image:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-account-apple.svg')} .icon-mylogin-google {background-image:url('https://hkstatic.hankyung.com/resource/common/img/icon/icon-account-google.svg')} .hk-top__user .btn-hk-user:not(.before-login)::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' class='icon-svg'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 15c-3.17 0-5.99 1.53-7.784 3.906-.386.511-.58.767-.573 1.112.005.267.172.604.382.769.272.213.649.213 1.402.213h13.146c.753 0 1.13 0 1.401-.213.21-.165.378-.502.383-.769.006-.345-.187-.6-.573-1.112C17.989 16.531 15.17 15 12 15Zm0-3a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Z'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .hk-user__layer {position:absolute; top:32px; right:0; z-index:-1; width:280px; box-sizing:border-box; background:#fff; border:1px solid #ddd; word-break:break-all; visibility:hidden; opacity:0; transform:scale(.5); transform-origin:right top; transition:all cubic-bezier(.25, .1, .25, 1.3) .2s} .hk-user__layer > .layer-inner {padding:48px 16px 8px} .hk-user__layer > .btn-close-layer {position:absolute; top:8px; right:16px} .hk-user__layer > .btn-close-layer::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' class='icon-svg'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .hk-user__layer .hk-user__btns {display:flex; gap:8px} .hk-user__layer .hk-user__btns [class^="btn-"] {flex:1; display:flex; align-items:center; justify-content:center; gap:8px; height:40px; border:1px solid #ddd; border-radius:8px; box-sizing:border-box; font-size:12px; line-height:1} .hk-user__layer .hk-user__btns [class^="btn-"]::before {content:''; display:inline-block; width:17px; height:16px; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; vertical-align:top} .hk-user__layer .hk-user__btns .btn-join::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='16' class='icon-svg'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='M8.5 10.333h-3c-.93 0-1.396 0-1.774.115a2.666 2.666 0 0 0-1.778 1.778c-.115.378-.115.844-.115 1.774m11.334 0v-4m-2 2h4m-5-7a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'/%3E%3C/svg%3E")} .hk-user__layer .hk-user__btns .btn-login::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='16' class='icon-svg'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='m12.667 14 2-2m0 0-2-2m2 2h-4M8 10.333H5c-.93 0-1.396 0-1.774.115a2.666 2.666 0 0 0-1.778 1.778c-.115.378-.115.844-.115 1.774m8.334-9a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'/%3E%3C/svg%3E")} .hk-user__layer .info__panel {display:flex; flex-direction:column; gap:20px; margin:16px 0; padding:24px 16px; border-radius:8px; background:#f5f5f7; font-size:11px} .hk-user__layer .info__panel::before {content:''; display:block; width:80px; height:80px; margin:0 auto; border-radius:100%; background:#fff url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-hk.svg') no-repeat 50% 50%/54px 14px} .hk-user__layer .info__panel > .info-item + .info-item {padding-top:20px; border-top:1px solid #ddd} .hk-user__layer .info__panel .info-msg {display:flex; flex-direction:column; gap:16px; font-size:12px} .hk-user__layer .info__panel .info-msg strong {font-size:14px} .hk-user__layer .info__panel .member-benefit {display:flex; flex-direction:column; gap:10px} .hk-user__layer .info__panel .member-benefit > li {display:flex; gap:4px} .hk-user__layer .info__panel .member-benefit > li::before {content:'· '; flex:0 0 auto} .hk-user__layer .info__mypages {display:flex; flex-direction:column; gap:8px} .hk-user__layer .info__mypages > .my-item {border:1px solid #ddd; border-radius:8px} .hk-user__layer .my-item__link {display:flex; align-items:center; padding:14px 16px; gap:8px; text-decoration:none} .hk-user__layer .my-item:not(.my-item-account) .my-item__link::before {flex:0 0 auto; content:''; display:inline-block; width:16px; height:16px; margin:0 2px; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; vertical-align:top} .hk-user__layer .my-item-news .my-item__link::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='icon-svg'%3E%3Cpath fill='none' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='M8.333 1.333h1.8c1.12 0 1.68 0 2.108.218a2 2 0 0 1 .874.875c.218.427.218.987.218 2.107v6.934c0 1.12 0 1.68-.218 2.108a2 2 0 0 1-.874.874c-.428.218-.988.218-2.108.218H5.867c-1.12 0-1.68 0-2.108-.218a2 2 0 0 1-.874-.874c-.218-.428-.218-.988-.218-2.108V11m8-2.333h-3m3-2.667H8.333m2.334 5.334H5.333M4 6.667V3a1 1 0 0 1 2 0v3.667a2 2 0 1 1-4 0V4'/%3E%3C/svg%3E")} .hk-user__layer .my-item-stock .my-item__link::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='icon-svg'%3E%3Cpath fill='none' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='M14 14H3.067c-.374 0-.56 0-.703-.073a.667.667 0 0 1-.291-.291C2 13.493 2 13.306 2 12.933V2m12 2.667L10.377 8.29c-.132.132-.198.198-.274.222a.333.333 0 0 1-.206 0c-.076-.024-.142-.09-.274-.222L8.377 7.044c-.132-.132-.198-.198-.274-.223a.333.333 0 0 0-.206 0c-.076.025-.142.09-.274.223L4.667 10M14 4.667h-2.667m2.667 0v2.666'/%3E%3C/svg%3E")} .hk-user__layer .info__mypages > .my-item.my-item-myhankyung {position:relative; padding:1px; border:none; border-radius:0} .hk-user__layer .info__mypages > .my-item.my-item-myhankyung::before {content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:linear-gradient(60deg, #569AFF, #EA35B7, #FF5648, #FB9905); border-radius:8px; animation:aniGradientLine 3s ease alternate infinite; background-size:300% 300%; box-sizing:border-box; pointer-events:none} .hk-user__layer .info__mypages > .my-item.my-item-myhankyung .my-item__link {position:relative; border-radius:7px; background:#fff} .hk-user__layer .info__mypages > .info-txt {padding:0 16px 3px 17px; color:var(--hk-text-secondary); font-size:11px} .hk-user__layer .my-item-myhankyung .my-item__link::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='15' fill='none'%3E%3Cpath fill='%23121212' fill-rule='evenodd' d='M10.395.854a.1.1 0 0 1 .093.065l1.058 2.778c.174.456.255.668.38.845.112.16.25.298.407.411.175.126.385.209.837.384l2.75 1.068a.101.101 0 0 1 .064.095c0 .042-.026.08-.065.095l-2.75 1.068c-.451.175-.66.258-.836.384a1.739 1.739 0 0 0-.407.41c-.125.178-.206.39-.38.846l-1.058 2.778a.1.1 0 0 1-.093.065.1.1 0 0 1-.094-.065L9.243 9.303c-.173-.456-.255-.668-.38-.845a1.738 1.738 0 0 0-.407-.411c-.175-.126-.384-.209-.836-.384L4.87 6.595a.101.101 0 0 1 0-.19l2.75-1.068c.452-.175.661-.258.836-.384.158-.113.296-.252.408-.41.124-.178.206-.39.38-.846L10.3.919a.1.1 0 0 1 .094-.065ZM2.667.854c.017 0 .032.011.038.027l.435 1.142c.071.187.105.274.156.347a.714.714 0 0 0 .167.169c.073.052.159.086.344.158l1.13.439a.042.042 0 0 1 0 .077l-1.13.44c-.185.072-.271.105-.344.157a.714.714 0 0 0-.167.17c-.051.072-.085.159-.156.347l-.435 1.141a.041.041 0 0 1-.038.027.041.041 0 0 1-.038-.027l-.435-1.141c-.072-.188-.105-.275-.156-.348a.714.714 0 0 0-.168-.169c-.072-.052-.158-.085-.343-.158l-1.13-.439a.042.042 0 0 1 0-.077l1.13-.44c.185-.071.271-.105.343-.157a.714.714 0 0 0 .168-.169c.051-.073.084-.16.156-.347L2.628.88a.041.041 0 0 1 .039-.027ZM4.806 9.826c.017 0 .032.01.038.026l.435 1.142c.071.187.105.274.156.347a.715.715 0 0 0 .167.17c.072.05.158.085.344.157l1.13.439a.042.042 0 0 1 0 .078l-1.13.438c-.186.073-.272.106-.344.158a.714.714 0 0 0-.167.17c-.051.072-.085.159-.156.347l-.435 1.141a.041.041 0 0 1-.077 0l-.434-1.141c-.072-.188-.105-.275-.157-.348a.714.714 0 0 0-.167-.169c-.072-.052-.158-.085-.344-.158l-1.13-.438a.042.042 0 0 1 0-.078l1.13-.44c.186-.071.272-.105.344-.157a.714.714 0 0 0 .167-.169c.052-.073.085-.16.157-.347l.434-1.142a.041.041 0 0 1 .039-.026Z' clip-rule='evenodd'/%3E%3C/svg%3E")} .hk-user__layer .my-item-subscribe .my-item__link::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='icon-svg'%3E%3Cpath fill='none' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='m3.548 3 2.323 10L8.194 3l2.322 10 1.936-10M2 6.333h12M2 9.667h12'/%3E%3C/svg%3E")} .hk-user__layer .my-item__link .my-item__txt {flex:1 1 auto; width:calc(100% - 28px)} .hk-user__layer .my-item__link .my-item__txt .tit {text-overflow:ellipsis; white-space:nowrap; overflow:hidden; font-weight:700; font-size:14px} .hk-user__layer .my-item__link .my-item__txt .desc {margin-top:5px; color:var(--hk-text-secondary); font-weight:400; font-size:12px} .hk-user__layer .hk-user__links {display:flex; align-items:center; justify-content:center; margin:16px 0} .hk-user__layer .hk-user__links > .item {font-size:12px} .hk-user__layer .hk-user__links > .item:not(:last-child)::after {content:''; display:inline-block; width:1px; height:14px; margin:0 16px; background:#ddd; vertical-align:-3px} .hk-top__user.active .hk-user__layer {visibility:visible; opacity:1; z-index:9998; transform:scale(1)} @keyframes aniGradientLine { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } /* footer */ .footer-module {margin-top:30px; padding:0 20px} .footer-module > div > .foot-inner {max-width:1180px; margin:0 auto; padding:25px 0; border-top:1px solid #c3c3c3; box-sizing:border-box; font-size:14px} .footer-module > div:first-child > .foot-inner {border-top-color:#121212} .footer-module > div:last-child > .foot-inner {padding-bottom:70px} .footer-module > div.footer-sponsor > .foot-inner {padding:20px 0} .footer-module .is-mo {display:none} .footer-sponsor-list {display:flex; align-items:center; justify-content:center; gap:80px} .footer-sponsor-list [class^="f-sponsor"] {flex:0 1 auto; display:inline-block; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; vertical-align:top} .footer-sponsor-list .f-sponsor-samsung {width:94px; height:14px; background-image:url('https://hkstatic.hankyung.com/resource/common/img/footer/footer-sponsor-samsung.svg')} .footer-sponsor-list .f-sponsor-wooribank {width:76px; height:18px; background-image:url('https://hkstatic.hankyung.com/resource/common/img/footer/footer-sponsor-wooribank.svg')} .footer-sponsor-list .f-sponsor-kbstar {width:109px; height:18px; background-image:url('https://hkstatic.hankyung.com/resource/common/img/footer/footer-sponsor-kbstar.svg')} .footer-sitemap .service-list {display:flex; align-items:center; flex-wrap:wrap; gap:18px} .footer-sitemap .service-list + .service-list {margin-top:25px} .footer-sitemap .service-list.v2 {display:grid; grid-template-columns:repeat(auto-fill, minmax(130px, 1fr));} .footer-infomation .f-row + .f-row {margin-top:25px} .footer-infomation dt {font-weight:700} .footer-infomation .item {display:inline-block; padding:5px 0} .footer-infomation .item:not(:last-child)::after, .footer-infomation .hk-family dt::after {content:''; display:inline-block; width:1px; height:14px; margin:0 11px 0 15px; font-weight:normal; vertical-align:-2px; background:#121212} .footer-infomation .f-define dt {margin-bottom:5px} .footer-infomation .hk-family dt {/*float:left;*/ padding:5px 0} .footer-infomation .hk-family dt::after {margin:0 15px} /* .footer-infomation .hk-family.type-row dt {float:none} */ .footer-infomation .hk-family.type-row dt::after {display:none} .footer-infomation .copyright {margin-bottom:5px; font-weight:700} .footer-infomation .hk-family-select {display:none; position:relative; max-width:100%; height:40px; margin-top:24px; background:#fff; box-sizing:border-box} .footer-infomation .hk-family-select select {position:relative; z-index:2; width:100%; height:100%; padding:0 47px 0 16px; border:1px solid #ddd; border-radius:8px; background:transparent; font-size:14px; line-height:38px; vertical-align:middle; cursor:pointer; appearance:none; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; outline:none; box-sizing:border-box; text-overflow:ellipsis; white-space: nowrap; overflow: hidden;} .footer-infomation .hk-family-select select::-ms-expand {opacity:0} .footer-infomation .hk-family-select select option {font-size:14px} .footer-infomation .hk-family-select::after {content:''; position:absolute; top:50%; right:16px; width:16px; height:16px; transform:translateY(-50%); background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='M12 10 8 6l-4 4'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top; pointer-events:none} @media only screen and (max-width: 719px){ .footer-sponsor-list {gap:min(max(10px, 6vw), 80px)} .footer-infomation .hk-family.type-row {display: none} .footer-infomation .hk-family-select {display: inline-block;} .footer-module .is-pc {display:none} } .btn-top-wrap {position:fixed; bottom:0; left:50%; width:1px; height:0; opacity:0; z-index:10; transition:opacity ease .3s} .btn-top-wrap .btn-position {position:absolute; bottom:80px; right:-650px} .btn-top-wrap .btn-top {position:fixed; display:flex; align-items:center; justify-content:center; border:1px solid #ddd; border-radius:100%; width:50px; height:50px; box-sizing:border-box; background:#fff; backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px)} .btn-top-wrap .btn-top::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 20.606v-16m0 0-6 6m6-6 6 6'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .isSticky .btn-top-wrap {opacity:1} /* layout */ .layout-container {max-width:1200px; margin:0 auto} .module-row {display:flex; gap:40px} .module-row > .col {flex:1 1 auto; box-sizing:border-box} .module-row > .col[data-width], .module-row > .col.fix {flex:0 0 auto} .module-row > .col[data-width="270"] {width:var(--col-w-270)} .module-row > .col[data-width="336"] {width:var(--col-w-336)} .module-row > .col[data-width="352"] {width:var(--col-w-352)} .module-row > .col[data-width="373"] {width:var(--col-w-373)} .module-row > .col[data-width="474"] {width:var(--col-w-474)} .module-row > .col[data-width="580"] {width:var(--col-w-580)} .module-row > .col[data-width="890"] {width:var(--col-w-890)} .module-row.col-line > .col {position:relative; padding:0 20px} .module-row.col-line > .col:not(:first-child)::before {--col-gap:40px; content:''; position:absolute; top:0; left:calc((-1 * var(--col-gap)) / 2); bottom:0; width:1px; background:var(--col-line-color)} .module-row.col-line > .col:first-child {padding-left:0} .module-row.col-line > .col:last-child {padding-right:0} .module-row.col-line.col-darkline > .col:not(:first-child)::before {background:#121212} .txt-center {text-align:center} .txt-start {text-align:left} .txt-end {text-align:right} /* 종목 슬라이드 */ .stock-marquee-wrap {border-bottom:1px solid #e2e2e2} .stock-marquee {position:relative; max-width:1200px; height:37px; margin:0 auto; overflow:hidden; box-sizing:border-box} .stock-marquee::before, .stock-marquee::after {content:''; display:block; position:absolute; top:0; bottom:0; z-index:2} .stock-marquee::before {left:0; width:15px; background:-moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.75) 51%, rgba(255,255,255,0) 100%); background:-webkit-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.75) 51%, rgba(255,255,255,0) 100%); background:linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0.75) 51%, rgba(255,255,255,0) 100%)} .stock-marquee::after {right:0; width:40px; background:-moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 51%, rgba(255,255,255,1) 100%); background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 51%, rgba(255,255,255,1) 100%); background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 51%, rgba(255,255,255,1) 100%)} .stock-marquee .marquee, .stock-marquee *[class^="marquee"] {position:absolute; white-space:nowrap} .stock-marquee .marquee {top:4px} .stock-marquee .stock-item-list {display:inline-flex; gap:40px; padding:10px 16px 0} .stock-marquee .item {display:inline-flex; align-items:center; gap:4px; height:18px; font-size:12px; line-height:16px; text-decoration:none; vertical-align:top; -webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale} .stock-marquee .item .name {font-weight:normal} .stock-marquee .item::before {content:''; display:inline-block; width:16px; height:16px; background-repeat:no-repeat; background-size:contain} .stock-marquee .item.up::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23b50000' stroke-linecap='round' stroke-linejoin='round' d='M8 13.333V2.667m0 0-4 4m4-4 4 4'/%3E%3C/svg%3E")} .stock-marquee .item.down::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%232853b2' stroke-linecap='round' stroke-linejoin='round' d='M8 2.667v10.666m0 0 4-4m-4 4-4-4'/%3E%3C/svg%3E")} .stock-marquee .item.hold::before {width:10px; height:2px; margin:7px 0; background:#585858} .stock-marquee .item.up .per-change {color:var(--hk-up)} .stock-marquee .item.down .per-change {color:var(--hk-down)} .stock-marquee .item.hold .per-change {color:var(--hk-hold)} .ad-top + .stock-marquee-wrap .stock-marquee {height:27px} .ad-top + .stock-marquee-wrap .stock-item-list {padding-top:0} .ad-top[style*="none"] + .stock-marquee-wrap .stock-marquee, .ad-top:has(>.ad-inner> div[style*="none"]) + .stock-marquee-wrap .stock-marquee {height:37px} .ad-top[style*="none"] + .stock-marquee-wrap .stock-item-list, .ad-top:has(>.ad-inner> div[style*="none"]) + .stock-marquee-wrap .stock-item-list {padding-top:10px} /* 상단 프로모션 */ .main-promotion {margin:32px 0} .main-promotion .layout-container {position:relative} .main-promotion .promotion-banner {position:relative; display:flex; align-items:center; justify-content:center; min-height:100px; text-align:center; box-sizing:border-box} .main-promotion .promotion-banner::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.1); pointer-events:none} .main-promotion .promotion-banner a {display:block; width:100%; padding:10px 0; box-sizing:border-box} .main-promotion .promotion-banner img {max-width:800px; min-height:80px; max-height:80px} .main-promotion .banner-control {position:absolute; top:50%; right:16px; transform:translateY(-50%); display:flex; gap:16px; align-items:center} .main-promotion .banner-control .btn-close-promotion {width:24px; height:24px; background:var(--icon-x)} .main-promotion .check-style {display:inline-flex; align-items:center; position:relative; cursor:pointer} .main-promotion .check-style [type="checkbox"] {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent} .main-promotion .check-style label {display:inline-flex; align-items:center; cursor:pointer; font-size:12px; user-select:none} .main-promotion .check-style label::before {content:''; display:inline-block; width:18px; height:18px; margin-right:8px; border:1px solid #ddd; background:#fff; box-sizing:border-box} .main-promotion .check-style [type="checkbox"]:checked + label::before {/*border:none;*/ background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' width='10' height='7.9' style='enable-background:new 0 0 10 7.9'%3E%3Cpath d='M3.8 7.9 0 4.3l1.5-1.5 2.2 2.1L8.5 0 10 1.5 3.8 7.9z' style='fill:%23121212'/%3E%3C/svg%3E") no-repeat center center/10px 9px} .main-promotion.dark {color:#fff} .main-promotion.dark .banner-control .btn-close-promotion {filter:invert(1)} /* news item */ .news-tit, .news-subtit, .lead {display:block; display:-webkit-box; text-overflow:clip; overflow:hidden; word-wrap:break-word; -webkit-box-orient:vertical; overflow-wrap:anywhere} .lead, .time {color:var(--hk-text-secondary); font-size:12px} .news-tit {font-weight:500} /* a:focus-visible {outline-color:rgba(12, 191, 180, .5)} */ .news-tit a:focus-visible {outline:none} .news-tit:has(>a:focus-visible) {outline:2px solid #01998f; outline-offset:1px; outline-style:auto} .thumb {position:relative; overflow:hidden; aspect-ratio:16/9} .thumb > a {display:block; width:100%; height:100%} .thumb img {width:100%; height:100%; object-fit:cover; object-position:center} .thumb img[src*="thumb-default-hk.svg"] {object-position:center} .thumb > .thumb-icon {position:absolute; right:15px; bottom:15px; width:50px; height:50px; overflow:hidden; background-repeat:no-repeat; background-position:right bottom; background-size:contain; color:transparent; text-indent:-9999px; pointer-events:none; transform-origin:right bottom} .thumb-icon.thumb-vod {background-image:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-thumb-video.svg')} .thumb-icon.thumb-audio {background-image:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-thumb-audio.svg')} .thumb-icon.thumb-graph {background-image:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-thumb-graph.svg')} .thumb-icon.thumb-photo {background-image:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-thumb-photo.svg')} .thumb-icon.thumb-slide {background-image:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-thumb-slide.svg')} .iframe-youtube {position:relative; height:0; width:100%; padding-bottom:56.25%; /* 4:3 비율 75%, 16:9 비율 56.25% */ 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-item-group .news-item:not(.column) .thumb > .thumb-icon, .news-item-group.sm .news-item.column .thumb > .thumb-icon {right:10px; bottom:10px; width:32px; height:32px} .news-item-group.sm .news-item:not(.column) .thumb > .thumb-icon {right:5px; bottom:5px; width:24px; height:24px} .news-item {display:flex; gap:16px} .news-item > .text-cont {flex:1 1 auto} .news-item > .thumb {flex:0 0 auto} .news-item > .thumb::after {content:''; position:absolute; top:0; left:0; bottom:0; right:0; z-index:2; border:1px solid rgba(0,0,0,.1); box-sizing:border-box; pointer-events:none} .news-item .news-tit {line-height:1.3} .news-item .lead {-webkit-line-clamp:2; line-height:1.3} .news-item .news-subtit {margin-top:16px; color:#888; font-weight:400; font-size:16px} .news-item .lead {font-weight:400; margin-top:10px} .news-item .time {margin-top:10px} .news-item .category-name {font-weight:700; font-size:14px} .news-item .category-name + .news-tit {margin-top:8px} .news-item.reverse {flex-direction:row-reverse} .news-item.column {flex-direction:column} .news-item.column > .text-cont {width:100%} .news-item.column .news-tit {font-size:20px} .news-item.column.type-headline {gap:16px} /* .news-item.column.type-headline .thumb {height:380px} */ .news-item.column.type-headline .news-tit {font-size:24px; /*-webkit-line-clamp:1*/} .news-item.column.type-headline .news-tit > a {display:block} .news-item.column.reverse {flex-direction:column-reverse} .news-item.column.reverse .lead {margin-top:24px} /* 엣지 84버전 이슈 */ .news-item.column {gap:0 !important} .news-item.column .thumb {margin:16px 0 0} .news-item.column.reverse .thumb, .news-item.column.reverse .iframe-youtube {margin:0 0 16px} .col[data-width="270"] .news-item.column .thumb {margin:8px 0 0} .col[data-width="270"] .news-item.column.reverse .thumb {margin:0 0 8px} .news-item .text-cont.txt-center .news-tit, .news-item .text-cont.txt-center .lead {word-break:keep-all} .news-item-group {display:flex; flex-direction:column; gap:32px} .news-item-group .news-item {align-items:center} /* .news-item-group .news-item:not(.column) {min-height:100px} */ .news-item-group .news-item:not(.column) .thumb {width:160px; /*height:100px*/} .news-item-group .news-item:not(.column) .text-cont {width:calc(100% - 176px)} .news-item-group .news-tit {font-size:20px} .news-item-group.line .news-item {position:relative} .news-item-group.line .news-item + .news-item::before {content:''; position:absolute; top:-16px; left:0; right:0; height:1px; background:var(--list-line-color)} /* 리스트: 가로 레이아웃이지만 썸네일 없는 유형(기본높이 불필요) */ .news-item-group.type-txt-nowrap .news-item, .main-top.type-3 .news-item-group .news-item, .special-module.type-2 .news-item-group .news-item, .editor-pick .news-item-group .news-item {min-height:0} /* .news-item-group.sm:not(.line) {gap:16px} */ .news-item-group.sm .news-item {gap:8px; /*min-height:75px*/} .news-item-group.sm .news-item .news-tit {font-weight:400} .news-item-group.sm .news-item:not(.column) .thumb {width:128px; /*height:75px*/} .news-item-group.sm .news-item:not(.column) .iframe-youtube {width:128px; height:auto; padding:0; aspect-ratio:16 / 9} [data-width="270"] .news-item-group .news-item:not(.column) .text-cont, .news-item-group.sm .news-item:not(.column) .text-cont {width:calc(100% - 134px)} .news-item-group.sm .news-item:not(.column) .news-tit {font-size:16px; /*-webkit-line-clamp:3*/} .news-item-group.type-txt-nowrap {gap:26px} /* .news-item-group.type-txt-nowrap .news-tit {-webkit-line-clamp:1} */ .news-control {display:flex; align-items:center; gap:16px} .news-control .paging {display:inline-flex; align-items:center; gap:4px; font-size:14px; line-height:24px} .news-control .swiper-pagination-current {font-weight:700} .news-control .btn-slide-prev::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='m15 18.517-6-6 6-6'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .news-control .btn-slide-next::before {content:''; display:inline-block; width:24px; height:24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='m9 18.517 6-6-6-6'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .news-control .btn-refresh {display:inline-flex; padding:0 12px; border-radius:25rem; background:#F5F5F7; font-size:11px; line-height:28px} /* main module */ .module-tit-wrap {display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px} .module-tit-area {display:flex; align-items:center; gap:16px} .module-tit {font-size:18px; line-height:1.1} .module-tit > a:not(.no-arrow)::after {content:''; display:inline-block; width:20px; height:20px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='m7.5 15 5-5-5-5'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:-4px} .module-tit-desc {font-size:14px} .news-item .module-tit-wrap {margin-bottom:8px} .module-rel-link {display:flex; justify-content:space-around; align-items:center; height:50px; margin-top:16px; border-top:1px solid var(--module-line-color); /*border-bottom:1px solid var(--module-line-color);*/ font-weight:700; font-size:14px} .main-module, .main-module-group {margin:32px 0} .main-module-group > .main-module:first-child {margin-top:0} .main-module-group > .main-module:last-child {margin-bottom:0} .main-module > .layout-container {padding-top:16px; border-top:1px solid var(--fix-module-line-color)} .fix-module > .layout-container, .main-module-group > .main-module:first-child > .layout-container {border-top-color:var(--fix-module-line-color)} .main-module-group:has(> .main-module.bg) {margin-bottom:0} .main-module.bg + .main-module, .main-module.bg + .main-module-group:has(> .main-module.bg), .main-module-group:has(> .main-module.bg) + .ad-area, .ad-area.bg + .main-module {margin-top:0} .main-module.bg + .main-module > .layout-container {border:none; padding-top:32px} .contents > .main-module:first-child, .contents > .main-module-group:first-child {margin-top:16px} .contents > .main-module:first-child > .layout-container, .contents > .main-module-group:first-child > .main-module:first-child > .layout-container, .ad-area.bg + .main-module > .layout-container, .main-promotion + .main-module > .layout-container {padding-top:0; border-top:none} .contents > .main-module-group:first-child:has( > .main-module.bg:first-child ) {margin-top:0} .contents > .main-module-group:first-child > .main-module.bg:first-child > .layout-container {padding-top:32px} .premium9-module + .main-module-group {margin-top:0} .premium9-module + .main-module:not(.bg):not(.special-module) > .layout-container {padding-top:0; border-top:none} .main-module.bg {margin:0} .main-module.bg > .layout-container {border:none; padding:32px 0} .main-module.bg-dark .module-tit > a::after {background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' d='m7.5 15 5-5-5-5'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .main-module.bg-dark a {color:#fff} .main-module.bg-dark .lead {color:rgba(255, 255, 255, .7)} .main-module.bg-dark .module-rel-link {border-color:rgba(255, 255, 255, .3)} .main-module.bg-dark .news-tit a {display:block} .main-module.bg-light {background:var(--module-light-bg)} .box-group {display:flex; flex-direction:column; gap:16px} .box-group > .box {background:#F5F5F7} .col[data-width="270"] .news-item.column {gap:8px} .col[data-width="270"] .news-item.column > .thumb {width:270px; /*height:168px*/} .col[data-width="373"] .news-item.column > .thumb {width:373px; /*height:232px*/} /* main top */ .main-top .headline .news-item {gap:16px} .main-top .headline .news-tit {font-weight:700; letter-spacing:-0.039em} /* .main-top .headline .thumb {height:362px} */ .main-top .headline .thumb {position:relative; height:0; padding-bottom:56.25%; aspect-ratio:auto; overflow:hidden} .main-top .headline .thumb > a {position: absolute; top:0; left:0; width:100%; height:100%} .main-top .headline .news-item.column .news-tit {font-size:40px} .main-top .news-item-group .news-item {gap:14px} .main-top .news-item .lead {margin-bottom:0} .main-top.type-1 .headline .news-item.column .news-tit {padding-bottom:3px; line-height:1.3} .main-top.type-1 .headline .news-item.column .news-tit a:hover {text-underline-offset:8px} .main-top.type-1 .headline .news-item.column .news-subtit {margin-top:7px; -webkit-line-clamp:1} .main-top.type-1 .headline .news-item.column.reverse .thumb, .main-top.type-1 .headline .news-item.column.reverse .iframe-youtube {margin:0} /*임시스타일*/ .main-top.type-1 .headline {position:relative; /*height:100%;*/ background:#071d39; color:#fff} .main-top.type-1 .headline a, .main-top.type-1 .headline .lead, .main-top.type-1 .headline .news-subtit {color:#fff} .main-top.type-1 .headline .news-item {/*height:100%;*/ gap:0} .main-top.type-1 .headline .news-item.column.reverse .thumb {flex:1} .main-top.type-1 .headline .thumb > .thumb-icon {z-index:2} .main-top.type-1 .headline .text-cont {/*position:absolute; bottom:0; left:0; right:0;*/flex-shrink:0; position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:159px; padding:0 24px 20px; box-sizing:border-box; z-index:2; background:#071d39; /*margin-top:-20px*/} .main-top.type-1 .headline .text-cont::before {content:''; position:absolute; top:-50px; left:0; right:0; z-index:2; height:50px; background:linear-gradient(#0000,#071d39 80%); pointer-events:none} /* .main-top.type-1 .headline .news-item.column.reverse .thumb {padding-bottom:336px} */ .main-top.type-1 .headline .text-cont font[color="#ee4c4c"], [style="color:#ee4c4c"] {color:#F04D4D !important} .main-top.type-1 .headline .text-cont font[color="#0265CB"], [style="color:#0265CB"] {color:#45A0FF !important} .main-top.type-2 .module-row .module-row {flex-direction:row-reverse; min-height:100%} /* .main-top.type-2 .headline .thumb {height:320px} */ .main-top.type-2 .headline .news-item.column {gap:16px; justify-content:space-between} .main-top.type-2 .headline .news-item.column > .text-cont {flex:0 0 auto} .main-top.type-2 .headline .news-item.column .news-tit {font-size:24px; /*-webkit-line-clamp:1*/} .main-top.type-2 .headline .news-item.column .news-subtit {margin-top:8px; -webkit-line-clamp:1} .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm {gap:28px} .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm .news-item + .news-item::before {top:-14px} .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm .news-item.column .news-tit, .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm .news-tit {font-size:16px; /*-webkit-line-clamp:2*/} /* .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm .news-item:not(.column):has(.text-cont:only-child) {min-height:0} */ .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm .news-item:not(.column):not(:has(.thumb)) {min-height:0} .main-top.type-2 .module-row > .col:nth-child(1) .news-item.column > .thumb {position:relative; height:0; padding-bottom:56.25%; aspect-ratio:auto; overflow:hidden} .main-top.type-2 .module-row > .col:nth-child(1) .news-item.column > .thumb > a {position:absolute; top:0; left:0; width:100%; height:100%} .main-top.type-2 .module-row > .col[data-width="580"] {position:relative} .main-top.type-2 .module-row > .col[data-width="580"]::before, .main-top.type-2 .module-row > .col[data-width="580"]::after {content:''; position:absolute; top:0; bottom:0; width:1px; background:#ddd} .main-top.type-2 .module-row > .col[data-width="580"]::before {left:-20px} .main-top.type-2 .module-row > .col[data-width="580"]::after {right:-20px} /* .main-top.type-2 .module-row > .col:nth-child(1) .headline .news-item.column > .thumb {padding-bottom:336px} .main-top.type-2 .module-row > .col:nth-child(1) .news-item-group.sm .news-item.column > .thumb {padding-bottom:169px} */ .main-top.type-2 .module-row > .col:nth-child(2) .news-item-group {gap:42px} .main-top.type-2 .module-row > .col:nth-child(2) .news-item-group .news-item + .news-item::before {top:-21px} .main-top.type-2 .module-row > .col:nth-child(2) .news-item-group .news-item {gap:12px} /* type-2 썸네일 배경 스타일 */ .main-top.type-2-2 .headline {position:relative; /*height:100%;*/ background:#071d39; color:#fff} .main-top.type-2-2 .headline a, .main-top.type-2-2 .headline .lead, .main-top.type-2-2 .headline .news-subtit {color:#fff} .main-top.type-2-2 .headline .news-item.column {gap:0; /*height:100%;*/} .main-top.type-2-2 .headline .thumb {flex:1; margin-bottom:0} .main-top.type-2-2 .headline .thumb > .thumb-icon {z-index:2} .main-top.type-2-2 .headline .text-cont {/*position:absolute; bottom:0; left:0; right:0;*/ flex-shrink:0; position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:90px; padding:0 24px 20px; box-sizing:border-box; /*z-index:2; background:#071d39; margin-top:-20px*/} .main-top.type-2-2 .headline .text-cont::before {content:''; position:absolute; top:-50px; left:0; right:0; z-index:2; height:50px; background: linear-gradient(180deg, rgba(7, 29, 57, 0.00) 0%, #071D39 100%); pointer-events:none} /* .main-top.type-2-2 .headline .text-cont::before {content:''; position:absolute; top:-50px; left:0; right:0; z-index:2; height:50px; background: linear-gradient(180deg, rgba(7, 29, 57, 0.00) 0%, #071D39 100%); pointer-events:none} */ .main-top.type-2-2 .headline .text-cont font[color="#ee4c4c"], [style="color:#ee4c4c"] {color:#F04D4D !important} .main-top.type-2-2 .headline .text-cont font[color="#0265CB"], [style="color:#0265CB"] {color:#45A0FF !important} .main-top.type-2-2 .headline:has(.iframe-youtube):has(.news-item__meta), .main-top.type-2-2 .headline:has(.iframe-youtube) .news-item.column {height:auto} /* .main-top.type-2-2 .headline:has(.iframe-youtube) .text-cont {min-height:100px} */ .main-top.type-2-2 .headline:has(.iframe-youtube) .iframe-youtube {margin:0} /* .main-top.type-2-2 .news-item-group.sm .news-item:not(.column) .thumb {width:128px} */ .main-top.type-3 .headline {margin-bottom:32px} .main-top.type-3 .headline .news-tit {font-size:44px} /* .main-top.type-3 .headline-thumb {height:362px} */ .main-top.type-3 .col:nth-child(1) {width:680px} .main-top.type-3 .col:nth-child(2) {width:480px} .main-top.type-3 .col:nth-child(1) .news-item-group {margin-top:16px} .main-top.type-3 .col:nth-child(1) .news-item {min-height:100px} .main-top.type-3 .news-item-group.line {gap:36px; padding:18px 0 0; border-top:1px solid var(--list-line-color)} .main-top.type-3 .news-item-group.line .news-item + .news-item::before {top:-18px} /* 헤드라인 주요뉴스 (텍스트 4단뉴스) */ .major-text-news.module-row.col-line > .col {width:270px; padding:0} .major-text-news {margin-top:24px; padding-top:28px; border-top:1px solid var(--col-line-color)} .major-text-news .news-item .news-tit {font-size:18px} .main-top .major-text-news .news-item .news-tit {font-size:20px} .major-text-news-sm {padding-top:24px} .major-text-news-sm > .col {display:flex; flex-direction:column; gap:20px} .major-text-news-sm .news-item .news-tit {font-weight:400; font-size:16px; /*-webkit-line-clamp:1;*/ line-clamp:1} /* 오피니언 */ .series-list {display:grid; grid-template-columns:repeat(2, calc(50% - 10px)); column-gap:20px; row-gap:24px} .series-list .news-item > .thumb {width:56px; height:56px; margin-top:10px; aspect-ratio:1/1} .series-list .news-item > .thumb, .series-list .news-item > .thumb::after {border-radius:100%} .series-list .news-item > .text-cont {--thumb-w:56px; --thumb-gap:16px; width:calc(100% - (var(--thumb-w) + var(--thumb-gap)))} .series-list .news-item .news-tit {font-weight:400; font-size:16px} .series-list .category-name {min-height:21px; /*transform:translateY(5px)*/} .series-list.column-3 {grid-template-columns:repeat(3, 1fr); column-gap:40px; row-gap:36px} .series-list.column-3 .news-item::before {display:none} .series-list.column-3 .news-item:nth-child(3) ~ .news-item::before {content:''; display:block; position:absolute; top:-18px; left:0; right:0; height:1px; background:var(--list-line-color)} .series-list.column-4 {grid-template-columns:repeat(4, 1fr); column-gap:40px; row-gap:36px} .series-list.column-4 .news-item::before {display:none} .series-list.column-4 .news-item:nth-child(4) ~ .news-item::before {content:''; display:block; position:absolute; top:-18px; left:0; right:0; height:1px; background:var(--list-line-color)} .series-list.column-5 {grid-template-columns:repeat(5, 1fr); gap:24px; row-gap:36px} .series-list.column-5 .news-item::before {display:none} .series-list.column-5 .news-item:nth-child(5) ~ .news-item::before {content:''; display:block; position:absolute; top:-18px; left:0; right:0; height:1px; background:var(--list-line-color)} .series-list.column-5 .news-item .news-tit {font-size:18px} /* 오피니언 - 제목영역 서브링크 (사설/칼럼) */ .opinion .module-tit-wrap {margin-bottom:8px} .opinion-nav {display:flex; align-items:center; flex-wrap:wrap; gap:4px 16px; max-width:100px; font-size:16px; line-height:normal} .opinion-nav > li {position:relative; padding-left:8px} .opinion-nav > li::before {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:2px; height:2px; border-radius:50%; background:#121212} /* .opinion-nav > li + li {margin-top:8px} */ /* .member-opinion .news-item {min-height:72px} .member-opinion .module-row.col-line > .col {padding:0} */ /* 상단 주요뉴스 */ .major-top .news-item {min-height:100px} /* 특집모듈 */ .special-module .band-banner-area {flex:1; height:40px; box-sizing:border-box; overflow:hidden} .main-module.special-module> .layout-container {border-color:#121212} .special-module .band-banner-area.type-txtbox {padding:0 16px; background:#eee; border-radius:8px; color:#888; line-height:40px; white-space:nowrap; text-overflow:ellipsis} .special-module .band-banner-area.type-txtbox > a {color:#888} .special-module .band-banner-area.type-img > a {display:inline-block; vertical-align:top} .special-module .band-banner-area.type-img img {height:40px; border-radius:8px} .special-module .logotype {display:inline-flex; align-items:center} /* 특집모듈 - 동영상 */ /* .special-video.bg {background:#222; color:#fff} .special-video.bg a {color:#fff} .special-video.bg > .layout-container {padding:32px 0; border:none} */ .special-video .module-row {align-items:center; justify-content:space-between; gap:80px} .special-video .news-keyword {display:block; font-weight:700; /*font-size:16px*/ font-size:32px; word-break:keep-all;} .special-video .news-tit {/*font-size:32px;*/ font-size:16px; -webkit-line-clamp:unset; word-break:keep-all;} .special-video .news-tit + .news-keyword, .special-video .news-keyword + .news-tit {margin-top:20px} /* .special-video .col-txt {flex:0 0 auto; width:362px} .special-video .col-video {flex:0 0 auto; width:804px} */ .special-video .col-txt {flex:1 1 auto; overflow-wrap:anywhere} .special-video .col-video {flex:0 0 auto; width:580px} /* 프리미엄9 모듈 */ .premium9-module {margin:0; padding:24px 0 32px; background:#262A33} .premium9-module .module-tit-wrap {margin-bottom:20px} .premium9-module .module-tit-area {align-items:flex-end} .main-module.premium9-module > .layout-container {padding-top:0; border-top:none} .premium9-module .logo__premium9--w::before {width:207px; height:24px} .premium9-module .module-tit-desc, .premium9-module .news-subtit, .premium9-module .depth3 {color:#bdbdbd} .premium9-module .module-tit-desc, .premium9-module .depth3 {font-size:12px} .premium9-module .news-subtit {font-size:18px} .premium9-module .news-tit, .premium9-module .news-tit > a {color:#fff} /* .premium9-module .news-tit {-webkit-line-clamp:3} */ .premium9-module .depth3 {margin-top:8px} .premium9-module .module-row {padding-top:24px; border-top:1px solid rgba(255, 255, 255, 0.20)} .premium9-module .module-row + .module-row {margin-top:24px} .premium9-module .module-row.news-item-col2 {gap:32px} .premium9-module .module-row.news-item-col2 > .col {width:calc(50% - 16px)} .premium9-module .module-row.news-item-col2 .thumb {width:274px; /*height:171px*/} .premium9-module .module-row.news-item-col2 .news-item {align-items:center} .premium9-module .module-row.news-item-col2 .news-tit {height:52px; font-weight:400; font-size:20px; /*-webkit-line-clamp:2*/} .premium9-module .module-row.news-item-col2 .news-item__meta {margin-bottom:6px} .premium9-module .module-row.news-item-col2 .thumb-icon.thumb-vod {width:40px; height:40px} .premium9-module .module-row.news-item-col3 {gap:32px} .premium9-module .module-row.news-item-col3 > .col {width:calc(33.33336% - 32px)} .premium9-module .module-row.news-item-col3 .thumb {width:144px; /*height:90px*/} .premium9-module .module-row.news-item-col3 .news-tit {height:52px; font-weight:400; font-size:20px; /*-webkit-line-clamp:2*/} .premium9-module .module-row.news-item-col3 .text-cont {width:calc(100% - (144px + 16px))} .premium9-module .module-row.news-item-col3 .news-item__meta {margin-bottom:6px; line-height:1} .premium9-module .module-row.news-item-col3 .thumb-icon.thumb-vod {right:8px; bottom:8px;width:28px; height:28px} .premium9-module .news-item__depth2 {color:#F0626F; font-size:14px} .premium9-module .news-item__meta {margin-bottom:8px} .premium9-module .news-item.type-headline {gap:40px} .premium9-module .news-item.type-headline .thumb {width:560px; /*height:350px*/} .premium9-module .module-row > .col:has(>.news-item.type-headline) {width:890px} .premium9-module .news-item.type-headline .text-cont {width:calc(100% - 600px)} .premium9-module .news-item.type-headline .news-tit {font-weight:700; font-size:34px; /*-webkit-line-clamp:4*/} .premium9-module .news-item.type-headline .news-subtit {margin-top:16px} .premium9-module .news-item.type-headline .depth3 {margin-top:24px} .premium9-module .news-item-group {gap:40px; justify-content:space-between} .premium9-module .news-item-group .news-item:not(.column) .thumb {width:120px; /*width:80px; height:50px*/} .premium9-module .news-item-group .news-item:not(.column) .thumb .thumb-icon {right:6px; bottom:6px; width:24px; height:24px} .premium9-module .news-item-group .news-item {align-items:flex-start} .premium9-module .news-item-group .news-item-box {min-height:153px} .premium9-module .news-item-group .news-item-box + .news-item-box {position:relative} .premium9-module .news-item-group .news-item-box + .news-item-box::before {content:''; display:block; position:absolute; top:-20px; left:0; width:100%; height:1px; background:rgba(255, 255, 255, 0.20)} .premium9-module .news-item-group .news-tit {font-weight:400; font-size:18px} .premium9-module .depth3 {word-break:keep-all; overflow-wrap:anywhere;} .premium9-module .text-cont .icon-premium9 {width:auto; margin-top:12px} .premium9-module .btn-basic {border:none; min-width:56px; height:33px; padding:0 20px} .premium9-module .btn-basic.light-type {background:#CA002C; color:#fff} .premium9-module .btn-basic.light-type.ing, .premium9-module .btn-basic.black-type {background:rgba(255, 242, 228, 0.10); color:#FFF2E4} .premium9-module + .epic-n-showcase > .layout-container {border-top:none; padding-top:0} .premium9-module + .ad-area {margin-top:0} .ad-area + .premium9-module {margin-top:-40px} /* 프리미엄9 모듈 편집기 글자색 - 서비스 컬러 조정 */ .premium9-module [color="#0265cb"] {color:#5D93F4 !important} .premium9-module [color="#ee4c4c"] {color:#F0626F !important} .premium9-module [color="#7c41a4"] {color:#B563EF !important} /* 에픽+홍보 */ .epic-n-showcase .epic-module {display:flex; flex-direction:column; justify-content:space-between} .epic-n-showcase .epic-info, .epic-n-showcase .epic-news {width:100%} .epic-n-showcase .epic-info .module-tit-wrap {margin-bottom:18px} .epic-n-showcase .epic-info .btn-basic {height:29px; font-size:12px} .epic-n-showcase .epic-info .btn-basic::after {height:29px} .epic-n-showcase .epic-info .module-tit-desc, .epic-n-showcase .epic-info .epic-info-cont .txt {font-size:13px} .epic-n-showcase .promotion-showcase {flex:0 0 auto; display:flex; gap:40px} .epic-n-showcase .promotion-showcase .promotion-cont-group {width:360px; gap:32px} .epic-n-showcase .promotion-showcase .promotion-cont-group > .promotion-cont {padding:0} .epic-n-showcase .promotion-showcase .promotion-cont-group > .promotion-cont:not(:first-child)::after {top:-12px} .epic-n-showcase .promotion-showcase .tit {padding-top:12px} .epic-n-showcase .promotion-showcase .desc {font-size:13px} .epic-n-showcase .promotion-showcase .promotion--aliceq .tit::before {width:75px; height:22px} .epic-n-showcase .promotion-showcase .promotion-cont-group > .promotion-cont::before {width:42px; height:40px; right:9px} .epic-n-showcase .promotion-showcase .promotion-cont-group > .promotion--aliceq::before {right:6px} .epic-n-showcase .promotion-showcase .promotion-cont-group > .promotion--fortune::before {right:4px} .epic-n-showcase .promotion-showcase:not(:has(.showcase-banner)) {width:580px} .epic-n-showcase .promotion-showcase:not(:has(.showcase-banner)) .promotion-cont-group {width:100%} .epic-n-showcase .showcase-banner {width:160px} .epic-n-showcase .showcase-banner > a {display:block} .epic-n-showcase .showcase-banner img {width:160px; height:240px; object-fit:cover} /* 코리아마켓, 글로벌마켓, 집코노미 */ .koreamarket:not(.bg) .module-tit > a::after {background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath stroke='%23FE4E59' stroke-linecap='round' stroke-linejoin='round' d='m7.5 15 5-5-5-5'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .koreamarket:not(.bg) .module-tit > a, .koreamarket:not(.bg) .news-item.column.type-headline .news-tit > a {color:var(--keycolor-koreamarket)} .koreamarket:not(.bg) .module-rel-link {border-color:var(--keycolor-koreamarket)} .koreamarket.bg {background:var(--keycolor-koreamarket)} .globalmarket:not(.bg) .module-tit > a::after {background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath stroke='%2300BEB5' stroke-linecap='round' stroke-linejoin='round' d='m7.5 15 5-5-5-5'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .globalmarket:not(.bg) .module-tit > a, .globalmarket:not(.bg) .news-item.column.type-headline .news-tit > a {color:var(--keycolor-globalmarket)} .globalmarket:not(.bg) .module-rel-link {border-color:var(--keycolor-globalmarket)} .globalmarket.bg {background:var(--keycolor-globalmarket)} .jipconomy:not(.bg) .module-tit > a::after {background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath stroke='%23007ED2' stroke-linecap='round' stroke-linejoin='round' d='m7.5 15 5-5-5-5'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .jipconomy:not(.bg) .module-tit > a, .jipconomy:not(.bg) .news-item.column.type-headline .news-tit > a {color:var(--keycolor-jipconomy)} .jipconomy:not(.bg) .module-rel-link {border-color:var(--keycolor-jipconomy)} .jipconomy.bg {background:var(--keycolor-jipconomy)} /* 에디터 PICK */ .editor-pick .module-row > .col[data-width="336"] {width:352.33px} .editor-pick .col .module-row {justify-content:space-between} .editor-pick .thumb-news-pick {margin-top:28px; padding-top:24px; border-top:1px solid var(--col-line-color)} .editor-pick .news-tit {font-weight:400; /*-webkit-line-clamp: 2;*/} /* 아르떼 */ /* .arte .news-item.column.type-headline .news-tit > a {color:var(--keycolor-arte)} */ /* 트래블 */ /* .travel .news-item.column.type-headline .news-tit > a {color:var(--keycolor-travel)} */ /* 한경 동영상 */ /* .video-slide {padding-left:calc((100vw - 1200px) / 2)} */ .swiper.video-slide {max-width:1200px; overflow:hidden; margin:0 auto} .video-slide .item {width:854px} .hk-video .video-slide .item {padding:0 12px} .hk-video .video-slide .item:not(.slick-active) {opacity:.3; pointer-events:none} /* 하단 주요뉴스 */ .major-list {display:grid; grid-template-columns:repeat(2, calc(50% - 20px)); column-gap:40px; row-gap:28px; margin-top:13px} .major-list .news-item:nth-child(2) ~ .news-item::before {content:''; position:absolute; top:-14px; left:0; right:0; height:1px; background:var(--list-line-color)} .major-list .news-item {position:relative; align-items:flex-start; min-height:75px} .major-list .news-item > .thumb {width:120px; /*width:104px; height:65px*/} .major-list .news-item > .text-cont {--thumb-w:104px; --thumb-gap:16px; width:calc(100% - (var(--thumb-w) + var(--thumb-gap)))} .major-list .news-item .news-tit {font-weight:400; font-size:18px} .major-list .news-item:nth-child(10n+1)::before, .major-list .news-item:nth-child(10n+2)::before {display:none} .major-list.type-col3 {grid-template-columns:repeat(3, 1fr)} .major-list.type-col3 .news-item:nth-child(10n+1)::before, .major-list.type-col3 .news-item:nth-child(10n+2)::before {display:block} .major-list.type-col3 .news-item:nth-child(3)::before, .major-list.type-col3 .news-item:nth-child(15n+1)::before, .major-list.type-col3 .news-item:nth-child(15n+2)::before, .major-list.type-col3 .news-item:nth-child(15n+3)::before {display:none} /* 뉴스레터, 구독신청, 기자코너 */ .major-module .module-tit-wrap {height:28px} .major-module .box {position:relative} .major-module .box-inner {position:relative; display:flex; flex-direction:column; align-items:flex-start; z-index:2; padding:32px 32px 24px} .major-module .box-group {gap:24px} .major-module .box .tit {font-weight:500; font-size:16px} .major-module .box .desc {margin-top:10px; color:#888; font-size:14px} .major-module .box .btn-link {display:inline-flex; align-items:center; height:34px; padding:0 24px 1px; border-radius:25rem; background:#fff; font-size:14px; line-height:1} .major-module .box .btn-link::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0} .major-module .box::before {content:''; position:absolute; bottom:24px; right:40px; background-repeat:no-repeat; background-size:contain} .major-module .box-newsletter {min-height:157px} .major-module .box-newsletter::before {width:64px; height:60px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/box-bg-newsletter.png')} .major-module .box-newsletter .btn-link {margin-top:24px} .major-module .box-subscribe {min-height:154px} /* .major-module .box-subscribe::before {width:56px; height:114px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/box-bg-subscribe.png')} */ .major-module .box-subscribe::before {bottom:20px; right:20px; width:158px; height:108px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/box-bg-subscribe3.png')} .major-module .box-subscribe .btn-link {margin-top:20px} .major-module .box-journalist {min-height:160px} .major-module .box-journalist::before {right:20px; width:107px; height:100px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/box-bg-journalist.png')} .major-module .box-journalist .btn-link {margin-top:20px} /* [2025.03.26] 주요뉴스 우측 운세 배너 추가 - 배너모듈 ui 수정 */ /* .major-module .box-banner-group {gap:8px} .major-module .box-banner-group > .box {flex:1; display:flex; align-items:center; min-height:126px} .major-module .box-banner-group > .box .tit {line-height:1.3} .major-module .box-banner-group > .box .desc {margin-top:2px; color:var(--hk-text-secondary)} .major-module .box-banner-group > .box .box-inner {width:100%; padding:0 32px; box-sizing:border-box} .major-module .box-banner-group > .box .btn-link {height:30px; margin-top:10px; padding:0 16px; box-sizing:border-box} .major-module .box-banner-group > .box::before {top:50%; right:40px; bottom:auto; transform:translateY(-50%)} .major-module .box-banner-group .box-newsletter::before {width:53px; height:50px} .major-module .box-banner-group .box-subscribe::before {width:104px; height:74px} .major-module .box-banner-group .box-journalist::before {width:78px; height:72px} .major-module .box-banner-group .box-fortune::before {width:43px; height:64px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/box-bg-fortune.png')} */ /* 스페셜 리포트 */ .special-reports .report-item {display:flex; gap:24px; align-items:flex-start} .special-reports .report-cont {flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:16px; overflow-wrap:anywhere} .special-reports .report-tit {display:block; font-weight:700; font-size:20px} .special-reports .report-tit > a {display:flex; align-items:flex-start; gap:8px; min-width:0} .special-reports .report-tit > a:hover {text-decoration:none} .special-reports .report-tit > a:hover .tit-txt {text-decoration:underline; text-underline-offset:5px} .special-reports .report-tit .badge-basic {flex:0 0 auto; margin-top:2px} .special-reports .report-news {display:flex; flex-direction:column; gap:16px; font-size:18px; line-height:1.6} .special-reports .report-news > li {display:flex; gap:4px; align-items:flex-start} .special-reports .report-news > li::before {content:'·'; flex:0 0 auto} .special-reports .report-news-tit {flex:1 1 auto; min-width:0; margin:0; font-weight:400; font-size:inherit; line-height:inherit} .special-reports .thumb {flex:0 0 auto; width:160px} .special-reports .thumb::after {content:''; position:absolute; inset:0; border:1px solid rgba(0,0,0,.1); box-sizing:border-box; pointer-events:none} /* 아르떼 - Wave */ .arte-wave .news-tit {font-weight:400} .arte-wave .news-item-group .news-item {min-height:90px} .arte-wave .news-item-group .news-item:not(:has(.thumb)) {align-items:flex-start;} /* .wave .module-row > .col:nth-child(1) .news-item.column.reverse {gap:24px} .wave .module-row > .col:nth-child(1) .news-item.column.reverse .lead {margin-top:16px} */ /* 랭킹뉴스 */ .ranking-list {display:grid; grid-template-columns:repeat(2, auto); grid-template-rows:repeat(5, auto); grid-auto-flow:column; column-gap:40px; row-gap:10px} .ranking-list > li {display:flex; align-items:center; gap:8px; width:580px; padding-top:24px; /*border-top:1px solid var(--list-line-color)*/} .ranking-list .news-item {align-items:center} .ranking-list .news-tit {flex:0 0 auto; width:calc(100% - 48px); font-size:20px; /*-webkit-line-clamp:2*/} .ranking-list .thumb {width:120px} .ranking-list .txt-num {position:relative; flex:0 0 auto; display:block; width:40px; text-align:center; color:transparent; font-style:italic; font-size:20px} .ranking-list .txt-num::before {content:''; position:absolute; top:0; left:0; width:40px; height:26px; background-repeat:no-repeat; background-position:50% 50%; background-size:contain} .ranking-list > li:nth-child(1) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='27' fill='none'%3E%3Cpath fill='%23121212' d='m.964 26.518.08-.4 1.48-.4c1.44-.4 2.294-1.32 2.56-2.76l3.92-19-4.08.4.08-.52c1.734-.32 3.4-.76 5-1.32s3.147-1.2 4.64-1.92l.2.28-1.32 5.8-2.4 11.52c-.16.746-.333 1.546-.52 2.4l-.48 2.48c-.266 1.333.254 2.186 1.56 2.56l1.76.48-.08.4H.964Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(2) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='27' fill='none'%3E%3Cpath fill='%23121212' d='m.384 26.518.64-3.16 5.8-5.24c2.08-1.947 3.72-3.627 4.92-5.04 1.227-1.414 2.094-2.694 2.6-3.84.534-1.147.8-2.307.8-3.48 0-1.44-.333-2.52-1-3.24-.64-.747-1.533-1.12-2.68-1.12-.906 0-1.76.24-2.56.72-.773.453-1.493 1.253-2.16 2.4l-1.92 3.36h-.52l.72-5.72c.8-.454 1.814-.827 3.04-1.12a14.68 14.68 0 0 1 3.72-.48c2.507 0 4.467.52 5.88 1.56 1.44 1.013 2.16 2.506 2.16 4.48 0 1.44-.466 2.84-1.4 4.2-.933 1.333-2.253 2.68-3.96 4.04-1.706 1.36-3.733 2.8-6.08 4.32l-4.76 3.24h14l-.72 4.12H.384Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(3) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='28' fill='none'%3E%3Cpath fill='%23121212' d='M8.182 27.118c-1.52 0-2.933-.187-4.24-.56-1.306-.374-2.426-.894-3.36-1.56l1.52-5.48h.72l.44 2.84c.214 1.386.747 2.4 1.6 3.04.854.613 1.867.92 3.04.92 1.547 0 2.8-.574 3.76-1.72.96-1.147 1.44-2.814 1.44-5 0-1.734-.373-3.094-1.12-4.08-.72-.987-1.88-1.48-3.48-1.48h-1.12l.2-.8h1.08a6.55 6.55 0 0 0 3.04-.72c.96-.48 1.734-1.227 2.32-2.24.587-1.014.88-2.32.88-3.92 0-1.734-.346-3-1.04-3.8-.666-.8-1.493-1.2-2.48-1.2-1.866 0-3.32.986-4.36 2.96l-1.8 3.4h-.52l.92-6.12c.854-.347 1.8-.6 2.84-.76 1.04-.187 2.08-.28 3.12-.28 2.56 0 4.507.52 5.84 1.56 1.36 1.04 2.04 2.506 2.04 4.4 0 1.04-.293 2.053-.88 3.04-.56.986-1.413 1.826-2.56 2.52-1.12.693-2.533 1.16-4.24 1.4 2.267.266 3.907.92 4.92 1.96 1.04 1.04 1.56 2.426 1.56 4.16 0 1.52-.453 2.84-1.36 3.96-.906 1.12-2.12 2-3.64 2.64-1.52.613-3.213.92-5.08.92Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(4) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='28' fill='none'%3E%3Cpath fill='%23121212' d='m10.158 27.318 1.4-6.96H.718l.6-2.88 15.44-16.6h3.24l-3.32 16.4h4.08l-.6 3.08h-4.12l-1.4 6.96h-4.48Zm-7.36-10.04h9.4l2.56-12.76-11.96 12.76Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(5) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='27' fill='none'%3E%3Cpath fill='%23121212' d='M6.397 26.118c-1.253 0-2.426-.174-3.52-.52-1.093-.347-1.986-.747-2.68-1.2l.96-5.16h.48l1.16 2.88c.454 1.146 1.014 1.973 1.68 2.48.667.48 1.467.72 2.4.72.854 0 1.654-.294 2.4-.88.747-.614 1.347-1.494 1.8-2.64.48-1.174.72-2.587.72-4.24 0-1.654-.36-2.974-1.08-3.96-.693-.987-1.733-1.48-3.12-1.48-.88 0-1.64.106-2.28.32a9.706 9.706 0 0 0-1.68.76l-.96-.36L5.837.158h13.2l-.84 4.32H6.117l-2.12 7.4c.614-.534 1.44-.96 2.48-1.28 1.04-.32 2.014-.48 2.92-.48 2.373 0 4.227.64 5.56 1.92 1.334 1.28 2 2.973 2 5.08 0 1.866-.48 3.48-1.44 4.84-.96 1.333-2.24 2.36-3.84 3.08-1.573.72-3.333 1.08-5.28 1.08Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(6) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='28' fill='none'%3E%3Cpath fill='%23121212' d='M8.857 27.118c-2.4 0-4.32-.76-5.76-2.28-1.44-1.547-2.16-3.72-2.16-6.52 0-2.4.493-4.64 1.48-6.72a17.717 17.717 0 0 1 4.2-5.56c1.787-1.627 3.853-2.907 6.2-3.84 2.373-.96 4.92-1.494 7.64-1.6l.08.72c-3.68.586-6.68 1.92-9 4-2.293 2.08-3.88 4.626-4.76 7.64a10.399 10.399 0 0 1 2.6-1.32c.88-.294 1.84-.44 2.88-.44 2.133 0 3.76.64 4.88 1.92 1.12 1.253 1.68 2.866 1.68 4.84 0 2-.48 3.68-1.44 5.04a9.094 9.094 0 0 1-3.72 3.08c-1.52.693-3.12 1.04-4.8 1.04Zm-2.92-8.12c0 2.72.307 4.626.92 5.72.64 1.066 1.493 1.6 2.56 1.6 1.253 0 2.306-.707 3.16-2.12.853-1.414 1.28-3.267 1.28-5.56 0-2-.347-3.467-1.04-4.4-.667-.96-1.653-1.44-2.96-1.44a4.93 4.93 0 0 0-1.64.28c-.533.186-1.12.52-1.76 1a22.804 22.804 0 0 0-.52 4.92Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(7) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='26' fill='none'%3E%3Cpath fill='%23121212' d='m.634 25.518-.2-.36 16.92-21H2.434l.8-4h16.48l-.56 2.84-13.52 22.52h-5Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(8) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='28' fill='none'%3E%3Cpath fill='%23121212' d='M8.395 27.118c-2.266 0-4.08-.494-5.44-1.48-1.333-1.014-2-2.347-2-4 0-1.6.574-3 1.72-4.2 1.174-1.2 2.787-2.2 4.84-3-2.48-1.947-3.72-4.187-3.72-6.72 0-1.387.36-2.614 1.08-3.68.72-1.094 1.707-1.947 2.96-2.56 1.254-.614 2.68-.92 4.28-.92 2.24 0 3.96.466 5.16 1.4 1.2.933 1.8 2.173 1.8 3.72 0 1.52-.506 2.813-1.52 3.88-.986 1.04-2.466 2-4.44 2.88 1.494 1.2 2.6 2.306 3.32 3.32.747 1.013 1.12 2.28 1.12 3.8 0 1.493-.413 2.813-1.24 3.96-.826 1.146-1.933 2.04-3.32 2.68-1.36.613-2.893.92-4.6.92Zm-.56-21.68c0 1.146.347 2.186 1.04 3.12.694.933 1.907 2.066 3.64 3.4 1.227-.96 2.067-1.934 2.52-2.92.48-.987.72-2.054.72-3.2 0-1.494-.346-2.614-1.04-3.36-.693-.747-1.6-1.12-2.72-1.12-1.253 0-2.266.386-3.04 1.16-.746.746-1.12 1.72-1.12 2.92Zm-3.44 16.04c0 1.466.374 2.64 1.12 3.52.747.88 1.8 1.32 3.16 1.32 1.334 0 2.44-.4 3.32-1.2.88-.827 1.32-1.907 1.32-3.24 0-.827-.146-1.574-.44-2.24-.293-.667-.813-1.36-1.56-2.08-.746-.72-1.786-1.587-3.12-2.6l-.08-.04c-1.173.746-2.093 1.666-2.76 2.76-.64 1.093-.96 2.36-.96 3.8Z' opacity='.8'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(9) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='28' fill='none'%3E%3Cpath fill='%23121212' d='m1.054 27.198-.16-.68c3.547-1.227 6.347-2.774 8.4-4.64 2.053-1.894 3.48-4.2 4.28-6.92-.773.533-1.6.946-2.48 1.24-.853.293-1.72.44-2.6.44-2.053 0-3.733-.614-5.04-1.84-1.28-1.227-1.92-2.827-1.92-4.8 0-1.76.44-3.347 1.32-4.76a9.884 9.884 0 0 1 3.56-3.4c1.493-.827 3.12-1.24 4.88-1.24 2.507 0 4.453.773 5.84 2.32 1.413 1.546 2.12 3.706 2.12 6.48 0 2.16-.453 4.2-1.36 6.12-.88 1.92-2.133 3.666-3.76 5.24-1.6 1.573-3.52 2.906-5.76 4-2.213 1.093-4.653 1.906-7.32 2.44Zm5.16-17.68c0 1.786.36 3.16 1.08 4.12.72.933 1.72 1.4 3 1.4 1.067 0 2.24-.347 3.52-1.04.427-1.707.64-3.627.64-5.76 0-4.56-1.08-6.84-3.24-6.84-.88 0-1.707.346-2.48 1.04-.747.693-1.36 1.653-1.84 2.88-.453 1.2-.68 2.6-.68 4.2Z'/%3E%3C/svg%3E")} .ranking-list > li:nth-child(10) .txt-num::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='28' fill='none'%3E%3Cpath fill='%23121212' d='m.203 26.518.08-.4 1.48-.4c1.44-.4 2.293-1.32 2.56-2.76l3.92-19-4.08.4.08-.52c1.733-.32 3.4-.76 5-1.32s3.146-1.2 4.64-1.92l.2.28-1.32 5.8-2.4 11.52c-.16.746-.334 1.546-.52 2.4l-.48 2.48c-.267 1.333.253 2.186 1.56 2.56l1.76.48-.08.4H.202Zm24.871.52c-2.267 0-4.08-.734-5.44-2.2-1.36-1.494-2.04-3.654-2.04-6.48 0-2.534.32-4.867.96-7 .64-2.16 1.52-4.04 2.64-5.64 1.12-1.6 2.4-2.84 3.84-3.72 1.467-.907 3-1.36 4.6-1.36 2.293 0 4.107.733 5.44 2.2 1.333 1.466 2 3.64 2 6.52 0 2.613-.333 5-1 7.16s-1.573 4.026-2.72 5.6c-1.12 1.573-2.4 2.786-3.84 3.64-1.413.853-2.893 1.28-4.44 1.28Zm.24-.8c.693 0 1.373-.347 2.04-1.04.667-.694 1.28-1.64 1.84-2.84.587-1.2 1.093-2.56 1.52-4.08.453-1.547.8-3.174 1.04-4.88.267-1.707.4-3.387.4-5.04 0-1.84-.133-3.254-.4-4.24-.24-1.014-.573-1.707-1-2.08-.4-.4-.84-.6-1.32-.6-.827 0-1.653.493-2.48 1.48-.827.96-1.573 2.28-2.24 3.96-.667 1.653-1.2 3.533-1.6 5.64-.4 2.08-.6 4.253-.6 6.52 0 1.946.12 3.44.36 4.48.24 1.013.573 1.72 1 2.12.427.4.907.6 1.44.6Z'/%3E%3C/svg%3E")} /* 대한민국 대표 브랜드 대상 */ .masterbrand .module-tit {display:flex; align-items:center; gap:10px} .masterbrand .logo-masterbrand {display:inline-block; width:75px; height:30px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-masterbrand.svg') no-repeat 0 0/contain; overflow:hidden} /* The Pen */ .thepen .news-tit {font-weight:400} /* 행사 */ .event-notice .module-row {gap:96px} .event-notice .module-row.col-line > .col {padding:0} .event-notice .module-row.col-line > .col:not(:first-child)::before {--col-gap:96px} .event-notice .event-item {position:relative} .event-notice .event-item .thumb {position:relative; width:373px; /*height:232px*/} .event-notice .event-item .thumb img {width:100%; height:100%; object-fit:cover; object-position:center top} .event-notice .event-item .thumb::after {content:''; position:absolute; top:0; left:0; bottom:0; right:0; z-index:2; box-sizing:border-box; pointer-events:none; background:rgba(0,0,0,.3)} .event-notice .event-item .txt-cont {position:absolute; left:0; bottom:0; right:0; top:0; z-index:3; display:flex; flex-direction:column; justify-content:flex-end; gap:12px; padding:24px; box-sizing:border-box; color:#fff; overflow-wrap:anywhere} .event-notice .event-item .txt-cont .event-period {letter-spacing:0} .event-notice .event-item .txt-cont:hover {text-decoration:none} .event-notice .event-item .txt-cont:hover .event-tit {text-decoration:underline; text-underline-offset:3px} /* 공지사항 */ .notice-slide {height:20px} .notice-slide .item {display:flex; align-items:center; /*gap:8px*/} /* .notice-slide .item::before {content:''; flex:0 0 auto; display:inline-block; width:3px; height:3px; border-radius:100%; background:#121212} */ .notice-slide .notice-tit {display:inline-block; max-width:450px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px} .event-notice .module-tit-wrap {position:relative; min-height:26px; margin-bottom:16px} .event-notice .module-notice {gap:8px} .event-notice .module-notice .notice-slide {width:450px; top:-1px} .notice-slide .slick-slide:not(.slick-active) .notice-tit {pointer-events:none} .event-notice .alert-link {position:absolute; top:50%; right:0; transform:translateY(-50%); display:flex; align-items:center; gap:16px; font-weight:700; font-size:16px} .event-notice .alert-link > a {position:relative} .event-notice .alert-link > a + a::before {content:''; position:absolute; top:50%; left:-8px; transform:translateY(-50%); display:inline-block; width:1px; height:13px; background-color:var(--module-line-color)} .main-pr-banner {padding-top:36px; border-top:1px solid var(--list-line-color)} .main-pr-banner {display:grid; grid-template-columns:repeat(2, auto); column-gap:24px; row-gap:28px} .main-pr-banner .banner-item > a {display:flex; align-items:center; flex-direction:row-reverse; gap:16px; /*min-height:85px*/} .main-pr-banner .banner-item .thumb {flex:0 0 auto; position:relative; width:128px; /*width:136px; height:85px*/} .main-pr-banner .banner-item .thumb img {width:100%; height:100%; object-fit:cover; object-position:center top} .main-pr-banner .banner-item .thumb::after {content:''; position:absolute; top:0; left:0; bottom:0; right:0; z-index:2; border:1px solid rgba(0,0,0,.1); box-sizing:border-box; pointer-events:none} .main-pr-banner .banner-item .txt-cont {--thumb-w:128px; --thumb-gap:16px; width:calc(100% - (var(--thumb-w) + var(--thumb-gap))); display:flex; flex-direction:column; gap:8px; font-size:14px} .main-pr-banner .banner-item .tit {font-weight:500; font-size:16px} .main-pr-banner .banner-item .desc, .main-pr-banner .banner-item .info {color:var(--hk-text-secondary)} .main-pr-banner .banner-item .info br {display:none} .main-pr-banner .banner-item > a:hover {text-decoration:none} .main-pr-banner .banner-item > a:hover .tit {text-decoration:underline; text-underline-offset:3px} /* POLL 모듈 */ .main-module.poll .poll-content {position:relative; display:flex; align-items:center; justify-content:center; justify-content:space-between; padding:0 48px; overflow-wrap:anywhere} .main-module.poll .poll-content::before {content:''; width:110px; height:80px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='80' fill='none'%3E%3Cg opacity='.8'%3E%3Cpath fill='%23585858' d='M44.145 13.028c-4.382-3.206-9.767-5.111-15.576-5.111C11.31 7.917 0 17.867 0 35.127c0 15.96 9.96 24.454 24.8 25.747 2.868.25 5.643 1.129 8.198 2.446l11.374 5.879-2.783-5.174c-1.191-2.218-.415-5.04 1.811-6.216.11-.055.204-.125.314-.18-3.794-6.083-5.762-13.921-5.793-23.43-.024-7.775 2.273-15.05 6.224-21.171'/%3E%3Cpath fill='%23121212' d='M111.572 34.67C111.572 16.518 99.445 0 76.91 0 57.807 0 42.185 15.74 42.24 34.85c.04 14.744 5.322 24.99 15.308 30.288 2.909 1.544 3.928 5.22 2.368 8.113L56.286 80l14.847-7.674c3.339-1.724 6.96-2.869 10.707-3.19 19.369-1.685 29.732-14.06 29.732-34.466'/%3E%3Cpath fill='%23fff' d='M64.305 38.777a3.817 3.817 0 1 0 0-7.634 3.817 3.817 0 0 0 0 7.634M76.596 38.777a3.817 3.817 0 1 0 0-7.634 3.817 3.817 0 0 0 0 7.634M88.88 38.777a3.817 3.817 0 1 0 0-7.634 3.817 3.817 0 0 0 0 7.634'/%3E%3C/g%3E%3C/svg%3E") no-repeat 50% 50%/contain} .main-module.poll .poll-tit-wrap {flex:0 0 auto; width:760px; display:flex; flex-direction:column; gap:8px; padding-right:48px; border-right:1px solid #ddd} .main-module.poll .poll-topic {font-weight:500; font-size:24px; line-height:1.3} .main-module.poll .poll-period {color:var(--hk-text-secondary); font-size:14px} .main-module.poll .lead {/*-webkit-line-clamp:2;*/ color:var(--hk-text-primary); font-size:14px} .main-module.poll .poll-btns {flex:0 0 auto; width:120px; display:flex; flex-direction:column; gap:12px} /* 기사제목별 회원전용, 프리미엄 정렬 (기사제목과 상단정렬) */ .news-item img.icon--member, .news-item img.icon--premium {vertical-align:-3px} .news-item img.icon--pro {vertical-align:-2px} .news-item.column img.icon--member, .news-item.column img.icon--premium, .news-item.column img.icon--pro {vertical-align:-1px} .news-item .category-name img.icon--member, .news-item .category-name img.icon--premium, .news-item .category-name img.icon--pro {vertical-align:-4px} .main-top.type-1 .headline img.icon--member, .main-top.type-1 .headline img.icon--premium, .main-top.type-1 .headline img.icon--pro {vertical-align:10px} .main-top.type-2 .headline img.icon--member, .main-top.type-2 .headline img.icon--premium, .main-top.type-2 .headline img.icon--pro {vertical-align:1px} .main-top.type-3 .headline img.icon--member, .main-top.type-3 .headline img.icon--premium {vertical-align:15px} .main-top.type-3 .news-item img.icon--pro {vertical-align:baseline} .main-top.type-3 .headline .news-item img.icon--pro {vertical-align:8px} .news-item-group.sm .news-item img.icon--member, .news-item-group.sm .news-item img.icon--premium {vertical-align:-5px} .special-video .news-keyword img.icon--member, .special-video .news-keyword img.icon--premium {vertical-align:4px} .special-video .news-keyword img.icon--pro {vertical-align:5px} .special-video .news-tit img.icon--member, .special-video .news-tit img.icon--premium {vertical-align:-4px} .special-video .news-tit img.icon--pro {vertical-align:-2px} .news-item.column.type-headline img.icon--member, .news-item.column.type-headline img.icon--premium {vertical-align:1px} .news-item.column.type-headline img.icon--pro {vertical-align:baseline} .ranking-list img.icon--member, .ranking-list img.icon--premium, .ranking-list img.icon--pro {vertical-align:-2px} .koreamarket img.icon--pro, .globalmarket img.icon--pro, .jipconomy img.icon--pro {vertical-align:baseline} .koreamarket .icon--premium, .koreamarket .icon--member, .globalmarket .icon--premium, .globalmarket .icon--member, .jipconomy .icon--premium, .jipconomy .icon--member {box-shadow:2px 2px 6px rgba(0, 0, 0, .085); border-radius:5px; border:1px solid rgba(255,255,255,.2); box-sizing:border-box} /* 테스트!! 모든리스트에 라인으로 변경 테스트 확정시 정리 */ .news-item-group .news-item {position:relative} .news-item-group .news-item + .news-item::before {content:''; position:absolute; top:-16px; left:0; right:0; height:1px; background:var(--list-line-color)} .news-item-group.type-txt-nowrap .news-item + .news-item::before {top:-13px} .main-module.bg-dark .news-item-group .news-item + .news-item::before {background:rgba(255, 255, 255, .3)} .series-list .news-item {position:relative} .series-list .news-item:nth-child(2) ~ .news-item::before {content:''; position:absolute; top:-12px; left:0; right:0; height:1px; background:var(--list-line-color)} .main__gnb .nav-link[href*="koreamarket"] {color:var(--keycolor-koreamarket-text)} .main__gnb .nav-link[href*="globalmarket"] {color:var(--keycolor-globalmarket-text)} .main__gnb .nav-link[href*="realestate"] {color:var(--keycolor-jipconomy-text)} .main__gnb .nav-link[href*="wave"] {color:#B20A6A} /* 축하 폭죽 */ .particles {position:fixed; top:0; left:0; right:0; bottom:0; z-index:100; overflow:hidden; pointer-events:none} /* 임시영상 모듈(추후 유지할지 체크) */ .special-video2 {background:#121212; color:#fff} .special-video2 a {color:#fff} .special-video2 > .layout-container {padding:40px 0 32px} .special-video2 .text-cont {margin-bottom:24px; text-align:center} .special-video2 .text-cont a:hover {text-underline-offset:8px} .special-video2 .news-keyword {font-size:24px} .special-video2 .video-tit {font-size:44px} .special-video2 .iframe-youtube {padding-bottom:293px; border-radius:0;} .special-video2 .lead {font-size:16px; margin-top:24px; text-align:center} /* [2024.12.10] 플로팅 AI 추천 뉴스 */ .hk__icon-x {content:''; display:inline-block; width:20px; height:20px; background-image:linear-gradient(to bottom, #373737 0%, #373737 100%), linear-gradient(to left, #373737 0%, #373737 100%); background-size:100% 1px,1px 100%; background-position:center; background-repeat:no-repeat; transform:rotate(45deg); vertical-align:top} .floating-recommended {position:fixed; bottom:0; left:50%; z-index:99999999; width:1px; height:0} .floating-recommended .floating-recommended-inner {position:absolute; bottom:50px; left:-730px} .floating-recommended .btn-open-recommended {position:relative; background: linear-gradient(60deg, #00DFDF, #E980EC, #44A5FF, #7D72FD); border-radius:25rem; overflow:hidden; animation:floating-move 1s infinite alternate linear; will-change:transform} .floating-recommended .btn-open-recommended::before {content:''; position:absolute; top:1px; left:1px; right:1px; bottom:1px; border-radius:25rem; background:#fff; box-sizing:border-box; pointer-events:none} .floating-recommended .btn-open-recommended .txt {position:relative; padding:13px 20px; display:flex; align-items:center; gap:8px; background:linear-gradient(to right, #AD7BFF 0%, #00B6ED 50%, #00BFB8 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; text-fill-color:transparent; background-size:200% auto; font-weight:700; font-size:16px; white-space:nowrap} .floating-recommended .btn-open-recommended .txt::before {content:''; display:inline-block; width:18px; height:22px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='22' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M13.245 14.122H4.752m8.493-7.927H11m.245 11.028H4.752m8.493-8.02H11M17 5.8v10.4c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C14.72 21 13.88 21 12.2 21H5.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C1 18.72 1 17.88 1 16.2V5.8c0-1.68 0-2.52.327-3.162a3 3 0 0 1 1.311-1.311C3.28 1 4.12 1 5.8 1h6.4c1.68 0 2.52 0 3.162.327a3 3 0 0 1 1.311 1.311C17 3.28 17 4.12 17 5.8Z'/%3E%3Cpath stroke='url(%23b)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M13.245 14.122H4.752m8.493-7.927H11m.245 11.028H4.752m8.493-8.02H11M17 5.8v10.4c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C14.72 21 13.88 21 12.2 21H5.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C1 18.72 1 17.88 1 16.2V5.8c0-1.68 0-2.52.327-3.162a3 3 0 0 1 1.311-1.311C3.28 1 4.12 1 5.8 1h6.4c1.68 0 2.52 0 3.162.327a3 3 0 0 1 1.311 1.311C17 3.28 17 4.12 17 5.8Z'/%3E%3Cpath fill='%23121212' d='M4.003 5.656a1 1 0 0 1 1-1H8a1 1 0 0 1 1 1v4.482a1 1 0 0 1-1 1H5.003a1 1 0 0 1-1-1V5.656Z'/%3E%3Cpath fill='url(%23c)' d='M4.003 5.656a1 1 0 0 1 1-1H8a1 1 0 0 1 1 1v4.482a1 1 0 0 1-1 1H5.003a1 1 0 0 1-1-1V5.656Z'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='b' x1='-3.97' x2='11.879' y1='9.425' y2='.117' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2300DFDF'/%3E%3Cstop offset='.35' stop-color='%23E980EC'/%3E%3Cstop offset='.7' stop-color='%2344A5FF'/%3E%3Cstop offset='1' stop-color='%237D72FD'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' x1='2.828' x2='8.193' y1='7.069' y2='4.749' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2300DFDF'/%3E%3Cstop offset='.35' stop-color='%23E980EC'/%3E%3Cstop offset='.7' stop-color='%2344A5FF'/%3E%3Cstop offset='1' stop-color='%237D72FD'/%3E%3C/linearGradient%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h18v22H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .floating-recommended .layer-floating-recommended {position:absolute; left:0; bottom:0; width:348px; background:#fff; border-radius:16px; border:1px solid #ddd; box-shadow:4px 4px 12px 0px rgba(0, 0, 0, 0.10); padding:24px; box-sizing:border-box; opacity:0; visibility:hidden;} .layer-floating-recommended .recommended-tit-wrap {display:flex; align-items:center; justify-content:space-between; margin-bottom:20px} .layer-floating-recommended .recommended-tit-wrap .tit {display:flex; align-items:center; gap:8px; font-size:18px} .layer-floating-recommended .recommended-tit-wrap .tit-etc {display:inline-flex; align-items:center; color:var(--hk-text-secondary); font-weight:400; font-size:13px; background:linear-gradient(90deg, #0084FF 0%, #3B2782 50%, #F79413 100%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent} .layer-floating-recommended .recommended-tit-wrap .tit-etc::after {content:''; display:inline-block; width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23585858' stroke-linecap='round' stroke-linejoin='round' d='m6 12 4-4-4-4'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .layer-floating-recommended .recommended-news-list .news-item {align-items:center; gap:10px; min-height:50px} .layer-floating-recommended .recommended-news-list > li + li {margin-top:16px} .layer-floating-recommended .recommended-news-list .thumb {flex:0 0 auto; width:80px; height:50px} .layer-floating-recommended .recommended-news-list .txt-cont {flex:1 1 auto; width:calc(100% - 90px)} .layer-floating-recommended .recommended-news-list .news-tit {max-height:44px; font-weight:400; font-size:16px; line-height:1.375; -webkit-line-clamp:2; word-break:break-all} .layer-floating-recommended .loading {display:flex; align-items:center; justify-content:center; min-height:314px} .layer-floating-recommended .loading > .spinner {width:70px} @keyframes floating-move { 0%{transform:translate(0,0); box-shadow:none} 100%{transform:translate(0,10px); box-shadow:0 2px 5px rgba(0,0,0,.15)} } .floating-slide-in {animation:floating-slide-in 175ms cubic-bezier(0.4, 0, 1, 1) forwards !important} @keyframes floating-slide-in { from { opacity:0; visibility:hidden; transform:translateY(110%); } to { opacity:1; visibility:visible; transform:translateY(0%); } } .floating-slide-out {animation:floating-slide-out 175ms cubic-bezier(0.4, 0, 1, 1) forwards !important} @keyframes floating-slide-out { from { opacity:1; visibility:visible; transform:translateY(0%); } to { opacity:0; visibility:hidden; transform:translateY(110%); } } @media (max-width:1490px) { .floating-recommended {left:20px} .floating-recommended .floating-recommended-inner {left:0} } /* 공지팝업 */ .hk-noti-modal {--pop-width:470px; display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:99999999; 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; min-width:240px; 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 {background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' fill='none'%3E%3Cpath stroke='%23BACADA' stroke-linecap='round' stroke-linejoin='round' stroke-width='5' d='M28 18.667v11.958m0 6.708h.023M51.333 28c0 12.887-10.446 23.333-23.333 23.333C15.113 51.333 4.667 40.887 4.667 28 4.667 15.113 15.113 4.667 28 4.667c12.887 0 23.333 10.446 23.333 23.333Z'/%3E%3C/svg%3E") no-repeat right top/40px 40px; word-break:keep-all; overflow-wrap:anywhere} .hk-noti-modal .modal-tit-wrap {padding-right:40px} .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 {position:relative; 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} /* [2025.08.13] 프로모션 모듈 추가 */ .promotion-showcase .module-row > .col:nth-child(1), .promotion-showcase .module-row > .col:nth-child(3) {flex:0 0 auto; width:380px} .promotion-showcase .promotion-cont {position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; height:100%; padding:8px 0; box-sizing:border-box} .promotion-showcase .promotion-cont .promotion-cont-link {display:block; position:absolute; top:0; left:0; right:0; bottom:0} .promotion-showcase .promotion-cont::before {content:''; position:absolute; top:50%; right:0; transform:translateY(-50%); background-repeat:no-repeat; background-position:50% 50%; background-size:contain} .promotion-showcase .tit {margin-bottom:8px; font-weight:500; font-size:16px; line-height:1} .promotion-showcase .tit.type-badge {display:inline-block; height:34px; padding:0 16px 1px; border-radius:25rem; background:#121212; color:#fff; font-weight:normal; line-height:1; box-sizing:border-box; text-align:center} .promotion-showcase .tit.type-badge:after {content:''; display:inline-block; width:1px; height:34px; vertical-align:-11px} .promotion-showcase .desc {color:var(--hk-text-secondary); font-size:14px; line-height:1.4} .promotion-showcase .promotion-cont-group {display:flex; flex-direction:column; gap:24px} .promotion-showcase .promotion-cont-group > .promotion-cont:not(:first-child)::after {content:''; position:absolute; top:-13px; left:0; right:0; height:1px; background:var(--list-line-color); pointer-events:none} .promotion-showcase .promotion-cont-group > .promotion-cont::before {width:60px; height:60px} .promotion-showcase .promotion--aliceq .tit::before {content:''; display:block; width:116px; height:34px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-aliceq.svg') no-repeat left top/contain} .promotion-showcase .promotion--aliceq::before {width:100px; height:100px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/promotion-icon-aliceq@2x.png')} .promotion-showcase .promotion--newsletter::before {background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/promotion-icon-newsletter@2x.png')} .promotion-showcase .promotion--series::before {background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/promotion-icon-series@2x.png')} .promotion-showcase .promotion--fortune::before {width:100px; height:100px; background-image:url('https://hkstatic.hankyung.com/resource/www/main/img/promotion-icon-fortune@2x.png')} /* [2025.12.15] 에픽 모듈 추가 */ .epic-info {width:var(--col-w-580)} .epic-info .module-tit-wrap {margin-bottom:36px} .epic-info .module-tit-area {gap:9px} .epic-info .logo__epicai::before {width:160px; height:32px} .epic-info .module-tit-desc {color:#124DFF} .epic-info .epic-info-cont {display:flex; align-items:center; justify-content:space-between} .epic-info .epic-info-cont .txt {font-size:14px; line-height:1.6} .epic-info .epic-info-cont .link {flex:0 0 auto} .epic-news {flex:0 0 auto; width:var(--col-w-580)} .epic-news .tit {display:flex; align-items:center; gap:6px; font-weight:700; font-size:14px; margin-bottom:20px} .epic-news .tit::before {content:''; display:inline-block; width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cg stroke='%23121212' stroke-width='1.2' clip-path='url(%23a)'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12.8 6.625H9.6m3.2 2.75H9.6M12.8 4H3.2m9.6 8H3.2M3.2 7.04c0-.224 0-.336.054-.422a.46.46 0 0 1 .218-.174C3.58 6.4 3.72 6.4 4 6.4h2.4c.28 0 .42 0 .527.044.094.038.17.1.219.174.054.086.054.198.054.422v1.92c0 .224 0 .336-.054.422a.46.46 0 0 1-.219.174C6.82 9.6 6.68 9.6 6.4 9.6H4c-.28 0-.42 0-.527-.044a.46.46 0 0 1-.218-.174c-.055-.086-.055-.198-.055-.422z'/%3E%3Crect width='14.8' height='13.2' x='.6' y='1.4' rx='1'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h16v16H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat 50% 50% / contain} .epic-news .cont-scroll-area {height:85px; overflow-y:auto} .epic-news .cont-scroll-area::-webkit-scrollbar {width:4px; height:4px; display:inherit} .epic-news .cont-scroll-area::-webkit-scrollbar-button {width:0; height:0} .epic-news .cont-scroll-area::-webkit-scrollbar-track-piece {background:transparent} .epic-news .cont-scroll-area::-webkit-scrollbar-thumb {border-radius:0; background:#ececec} .epic-news .epic-news-list {display:flex; flex-direction:column; gap:12px; line-height:1.1; padding-right:16px} .epic-news .epic-news-list > li {display:flex; align-items:center; justify-content:space-between} .epic-news .epic-news-list .epic-news-tit {max-width:430px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap} .epic-news .epic-news-list .date {flex:0 0 auto; color:var(--hk-text-secondary); font-size:12px; white-space:nowrap} .epic-news .btn-more-wrap {margin-top:24px; text-align:center} /* 2026 메인GNB 개편 */ .hk-header-main.ver-2026 .header-top .main-logo-area {padding:49px 0 24px} .hk-header-main.ver-2026 ~ .stock-marquee-wrap {border:none; display:flex; align-items:center; justify-content:center} .hk-header-main.ver-2026 ~ .stock-marquee-wrap .stock-marquee {height:40px; flex:1; max-width:1050px; margin:0} .hk-header-main.ver-2026 ~ .stock-marquee-wrap .stock-marquee .marquee {top:8px} .hk-header-main.ver-2026 ~ .stock-marquee-wrap .exchange-rate {width:150px; padding-top:14px; font-size:12px; text-align:right} .hk-header-main.ver-2026 ~ .stock-marquee-wrap .exchange-rate .num {display:inline-flex; justify-content:space-between; width:100%} .hk-header-main.ver-2026 ~ .stock-marquee-wrap .exchange-rate .num::before {content:'|'; margin-right:16px; color:#ddd; font-size:16px} .hk-header-main.ver-2026 .main__gnb__wrap {border:none} .hk-header-main.ver-2026 .main__gnb__wrap .header-inner {position:relative; justify-content:center} .hk-header-main.ver-2026 .main__gnb__wrap .main__gnb__util {position:absolute; top:9px; right:0} .hk-header-main.ver-2026 .main__gnb .nav-link.nav-link-premium9 {border:2px solid var(--keycolor-premium9); border-radius:50rem; padding:6px 10px} .hk-header-main.ver-2026 .main__gnb .nav-link[href*="koreamarket"], .hk-header-main.ver-2026 .main__gnb .nav-link[href*="globalmarket"], .hk-header-main.ver-2026 .main__gnb .nav-link[href*="realestate"] {color:#121212} .hk-header-main.ver-2026 .main__gnb .nav-dropdown[data-event="hover"]:hover .nav-dropdown__menu {border-radius:12px} .hk-header-main.ver-2026 .main__gnb .nav-dropdown.nav-pro .nav-link {cursor:default} .hk-header-main.ver-2026 .main__gnb .nav-dropdown.nav-pro .nav__list {display:grid; grid-template-columns:repeat(2, 1fr); gap:16px 28px; line-height:0} .hk-header-main.ver-2026 .main__gnb .nav-dropdown.nav-pro .logo__legiexplorer {transform: translateY(-4px)} .hk-header-main.ver-2026 .main__gnb .nav-dropdown.nav-pro .logo__price {transform: translateY(-4px)} .hk-header-main.ver-2026 .nav-dropdown[data-event="hover"] .nav-dropdown-etc {margin-top:12px; padding-top:12px} .hk-header-main.ver-2026 .main__gnb > li:not(.nav-dropdown__menu):first-child .nav-dropdown__menu {left:-10px} .hk-header-main.ver-2026 .hk-top__search__layer .search__auto__wrap {max-height:calc(100vh - 490px); overflow-y:auto; scrollbar-gutter:stable} .icon-user-general {display:inline-block; width:20px; height:20px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Crect width='24' height='24' fill='%2341454e' rx='12'/%3E%3Cpath fill='%23fff' fill-opacity='.2' d='M23 12c0-6.075-4.925-11-11-11S1 5.925 1 12s4.925 11 11 11v1C5.373 24 0 18.627 0 12S5.373 0 12 0s12 5.373 12 12-5.373 12-12 12v-1c6.075 0 11-4.925 11-11'/%3E%3Cpath fill='%23fff2e4' d='M12 12a3 3 0 1 0 0-6 3 3 0 0 0 0 6M13.667 13.333h-3.333c-.93 0-1.396 0-1.774.115a2.67 2.67 0 0 0-1.778 1.778c-.115.378-.115 1.844-.115 2.774h10.667c0-.93 0-2.396-.115-2.774a2.67 2.67 0 0 0-1.778-1.778c-.378-.115-.844-.115-1.774-.115'/%3E%3C/svg%3E") no-repeat 50% 50%/contain} .icon-user-premium9 {display:inline-block; width:20px; height:20px; background:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-9.svg') no-repeat 50% 50%/contain} .header-account-info {position:absolute; top:24px; right:0; display:flex; align-items:center; gap:16px} .header-account-info > .item {position:relative; font-weight:500; font-size:14px} .header-account-info > .item a:hover {text-underline-offset:3px} .header-account-info > .item.item-divider {display:flex; align-items:center} .header-account-info > .item.item-divider::before {content:''; display:inline-block; width:1px; height:10px; margin-right:16px; background:#D9D9D9} .header-account-info > .item.item-myhankyung > a {display:flex; align-items:center; gap:4px} .header-utility {position:absolute; top:65px; right:0; display:flex; align-items:center; gap:12px} .header-utility .promotion-nav-wrap {position:relative; top:auto; right:auto} .gnb__btn-allmenu {display:inline-flex; align-items:center; gap:4px} .gnb__btn-allmenu::before {content:''; display:inline-block; width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M2 8h12M2 4h12M2 12h12'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} /* 전체메뉴 레이어 */ html:has(.allmenu__wrap.active), body:has(.allmenu__wrap.active) {overflow:hidden; overscroll-behavior:none} .allmenu__wrap {position:fixed; top:0; left:0; right:0; bottom:0; z-index:2147483647; background:#fff; overflow-y:auto; opacity:0; visibility:hidden; transition:opacity .15s ease-in, visibility 0s linear .15s; scrollbar-width:none; -ms-overflow-style:none; font-family:'Noto Sans KR', sans-serif; line-height:1.5} .allmenu__wrap::-webkit-scrollbar {display:none} .allmenu__wrap .allmenu__inner {position:relative; max-width:1200px; margin:0 auto; padding:30px 0 40px; transform:translate3d(0,-100%,0); transition:transform .15s cubic-bezier(.645,.045,.355,1)} .allmenu__wrap.active {opacity:1; visibility:visible; transition:opacity .3s ease-in, visibility 0s linear 0s} .allmenu__wrap.active .allmenu__inner {transform:translateZ(0); transition:transform .3s cubic-bezier(.645,.045,.355,1)} .allmenu__header {display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:30px} .allmenu__header .logo__hankyung {display:inline-block; width:99px; height:24px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-hk.svg') no-repeat 0 0/contain; vertical-align:top} .allmenu__close {margin:-10px -10px 0 0; padding:10px} .allmenu__close::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .allmenu__filter-area {display:flex; align-items:center; flex-wrap:wrap; gap:24px} .allmenu__filter {display:inline-flex} .allmenu__filter-item {min-width:90px; padding:8px; font-weight:400; font-size:14px; border:1px solid #DDD; border-radius:8px; cursor:pointer} .allmenu__filter > .allmenu__filter-item:first-child:not(:last-child) {border-radius:8px 0 0 8px} .allmenu__filter > .allmenu__filter-item:last-child:not(:first-child) {margin-left:-1px; border-radius:0 8px 8px 0} .allmenu__filter-item.on, .allmenu__filter-item:not(:disabled):hover {position:relative; z-index:1; border-color:#121212} .allmenu__filter-item:disabled {cursor:not-allowed} .allmenu__recent {display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding-left:16px} .allmenu__recent-label {flex-shrink:0; font-size:14px; color:#585858} .allmenu__recent-list {display:flex; flex-wrap:wrap; align-items:center; gap:12px} .allmenu__recent-item {position:relative} .allmenu__recent-link {display:inline-block; padding:4px 12px; font-size:14px; background:#F3F5F7; border-radius:8px} .allmenu__recent-link:hover {text-decoration:none} .allmenu__recent-del {position:absolute; top:-6px; right:-6px; display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:100%; cursor:pointer; background:#E2E5E7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' d='M6 2 2 6m0-4 4 4'/%3E%3C/svg%3E") no-repeat 50%/8px} .allmenu__section {margin-top:40px} .allmenu__list {display:grid; grid-template-columns:repeat(7, 1fr); row-gap:24px} .allmenu__link {display:flex; align-items:center; padding:4px 12px; border-radius:8px; font-weight:400; font-size:18px; white-space:nowrap; transition:background .15s linear} .allmenu__link:hover {background:#F3F5F7; text-decoration:none} /* 전문채널 */ .allmenu__section-head {display:flex; align-items:baseline; flex-wrap:wrap; gap:16px; padding:0 12px; margin-bottom:32px} .allmenu__section-title {font-weight:700; font-size:18px} .allmenu__section-desc {font-size:14px; color:#585858} .allmenu__section--pro {padding-top:40px; border-top:1px solid #121212} .allmenu__section--pro .allmenu__link {align-items:flex-start; height:35px; padding:8px 12px 0; line-height:0; box-sizing:border-box} .allmenu__section--pro .allmenu__link:hover {background:transparent} .allmenu__section--pro .allmenu__sub-list .allmenu__item + .allmenu__item {margin-top:24px} .allmenu__section--pro .logo__semiconinsight::before {width:145px; height:20px} .allmenu__section--pro .logo__marketinsight::before {width:116px; height:21px} .allmenu__section--pro .logo__lawbiz::before {width:104px; height:20px} .allmenu__section--pro .logo__price::before {width:77px; height:22px; transform:translateY(-8px)} .allmenu__section--pro .logo__bioinsight::before {width:123px; height:22px} .allmenu__section--pro .logo__choinsight::before {width:123px; height:21px} .allmenu__section--pro .logo__esg::before {width:67px; height:17px} .allmenu__section--pro .logo__legiexplorer {padding-top:1px} .allmenu__section--pro .logo__legiexplorer::before {width:96px; height:24px} .allmenu__section--pro .logo__arte {padding-top:3px} .allmenu__section--pro .logo__arte::before {width:64px; height:24px} .allmenu__section--pro .logo__wave::before {width:55px; height:15px} .allmenu__section--pro .logo__mr::before {width:56px; height:21px} .allmenu__section--pro .logo__travel::before {width:104px; height:16px} /* 회원레이어 */ .hk-header-main.ver-2026 .hk-user__layer > .layer-inner {padding:52px 16px 16px} .hk-header-main.ver-2026 .hk-user__layer > .btn-close-layer {top:16px} .hk-header-main.ver-2026 .hk-user__layer .info__panel {margin:0} .hk-header-main.ver-2026 .hk-user__layer .hk-user__links {margin:0} .hk-header-main.ver-2026 .hk-user__info {display:flex; flex-direction:column; gap:16px} .hk-header-main.ver-2026 .hk-user__layer .info__panel {padding:24px} .hk-header-main.ver-2026 .hk-user__layer .info__panel > .info-item {display:flex; flex-direction:column; gap:20px} .hk-header-main.ver-2026 .hk-user__layer .info__panel > .info-item.member-benefit {gap:8px} .hk-header-main.ver-2026 .hk-user__layer .info__panel > .info-item .txt:not(.sm) {font-size:12px} .hk-user__bnr-premium9 .bnr-link {display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border:1px solid #DDD; border-radius:8px; font-weight:700; font-size:14px} .hk-user__bnr-premium9 .bnr-link::before {content:''; display:inline-block; width:20px; height:20px; background:url('https://hkstatic.hankyung.com/resource/www/common/img/icon/icon-9.svg') no-repeat 50% 50%/contain} .hk-user__bnr-premium9 .bnr-link:hover {text-decoration:none} /* isSticky heaer */ .isSticky .hk-header-main.ver-2026 .header-top .main-logo-area {padding:16px 0} .isSticky .header-account-info {display:none} .isSticky .header-utility {top:16px} @view-transition {navigation: auto} /* [2026] 모듈별 코너명 추가 */ .news-item__meta {width:100%; margin-bottom:8px; font-family:'Noto Sans KR', sans-serif} .news-item__series {color:var(--keycolor-premium9); font-weight:700; font-size:13px} .news-item__series > .icon-premium9 {vertical-align:-5px; margin-right:6px} .news-item:has(> .news-item__meta) {flex-wrap:wrap; row-gap:0 !important} .news-item:has(> .news-item__meta) > .text-cont {width:auto; flex:1 1 0} .news-item:has(> .news-item__meta) > .thumb {flex:0 0 auto} .news-item:has(.text-cont .news-item__meta):not(.column) {align-items:flex-start} /* 코너명 예외 */ .main-top.type-1 .headline .news-item__series, .main-top.type-2-2 .headline .news-item__series, .special-video .news-item__series {color:var(--keycolor-premium9-dark)} .series-list .news-item__meta, .ranking-list .news-item__meta {margin-bottom:4px} /* [2026] 닷컴 공통 모달 */ .h-modal { --pop-width:520px; --pop-radius:clamp(18px, 4vw, 32px); /* max기준: 768 */ --pop-padding:clamp(20px, 4vw, 32px); --pop-bg:#fff; --pop-color:#121212; --pop-primary-btn-bg:#121212; --pop-primary-btn-color:#fff; display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:99999999; width:100%; height:100%; background:rgba(0, 0, 0, 0.40); overflow-x:hidden; overflow-y:auto; outline:0; box-sizing:border-box; } .h-modal__inner {align-items:center; justify-content:center; min-height:calc(100dvh - 40px); margin:20px} .h-modal__contents {position:relative; width:min(100%, var(--pop-width)); max-width:var(--pop-width); border-radius:var(--pop-radius); box-sizing:border-box; box-shadow:0 15px 75px 0 rgba(0, 0, 0, 0.18); padding:var(--pop-padding); background:var(--pop-bg)} .h-modal__body{word-break:keep-all; overflow-wrap:anywhere; color:var(--pop-color)} .h-modal__btns {display:flex; justify-content:center; margin-top:clamp(16px, 3vw, 24px)} .h-modal-close {position:absolute; top:clamp(0px, calc((100vw - 400px) * 0.05), 8px); right:clamp(0px, calc((100vw - 400px) * 0.05), 8px); padding:12px} .h-modal-close::before {content:''; display:inline-block; width:24px; height:24px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M17 7 7 17M7 7l10 10'/%3E%3C/svg%3E") no-repeat 50% 50%/contain; vertical-align:top} .h-modal__btns {display:flex; justify-content:center; align-items:center} .h-modal-btn {flex:1; display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:9px 20px 7px; border:none; border-radius:50rem; cursor:pointer; font-weight:400; font-size:16px; letter-spacing:-0.6px; box-sizing:border-box; text-decoration:none} .h-modal-btn:only-child {max-width:240px} .h-modal-btn:hover {text-decoration:none} .h-modal-btn--primary {background:var(--pop-primary-btn-bg); color:var(--pop-primary-btn-color)} .h-modal.active {display:block} .h-modal.active > .h-modal__inner {display:flex} /* 배지 획득 모달 */ .h-modal--badge .h-modal__contents {transform:scale(0.85)} .h-modal--badge .badge-modal__content {--fluid-size:28vw; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center} .h-modal--badge .badge-modal__image {perspective:1000px} .h-modal--badge .badge-modal__img {width:clamp(var(--min-w, 100px), var(--fluid-size), var(--max-w, 150px)); height:auto; backface-visibility:hidden; transform-origin:50% 50%} .h-modal--badge .badge-modal__title {font-size:clamp(20px, calc(var(--fluid-size) * 0.16), 24px)} .h-modal--badge .badge-modal__desc {font-size:16px} .h-modal--badge .badge-modal__date {color:#585858; font-size:14px} .h-modal--badge.active .h-modal__contents {animation:badge-modal-pop 560ms cubic-bezier(0.22, 1, 0.36, 1) both} .h-modal--badge.active .badge-modal__img {animation:badge-modal-spin 700ms cubic-bezier(0.22, 1, 0.36, 1) 80ms both} @keyframes badge-modal-pop { 0% {opacity:0; transform:scale(0.85)} 65% {opacity:1; transform:scale(1.03)} 100% {opacity:1; transform:scale(1)} } @keyframes badge-modal-spin { 0% {opacity:0; transform:rotateY(-1turn) scale(0.92)} 70% {opacity:1; transform:rotateY(18deg) scale(1.04)} 100% {opacity:1; transform:rotateY(0deg) scale(1)} } /* 페이월 팝업 */ html:has(.paywall-popup.active), body:has(.paywall-popup.active) {overflow:hidden; overscroll-behavior:none} .paywall-popup {position:fixed; inset:0; z-index:-1; display:flex; align-items:center; justify-content:center; box-sizing:border-box; visibility:hidden; word-break:keep-all; overflow-wrap:anywhere; background:rgba(0, 0, 0, 0.6); font-family:'Noto Sans KR', sans-serif} .paywall-popup__inner {width:100%; height:100%; box-sizing:border-box; display:flex; align-items:safe center; justify-content:center; padding:16px; overflow-y:auto} .paywall-popup.active {visibility:visible; z-index:2147483647} .paywall-popup__panel {position:relative; display:flex; flex-direction:column; width:480px; height:auto; border-radius:16px; overflow:hidden; flex-shrink:0; background:#FFF2E4; box-sizing:border-box; overflow-y:auto} .paywall-popup__menu {display:flex; align-items:center; justify-content:flex-end; padding:14px} .paywall-popup__close {width:24px; height:24px; padding:0; border:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") no-repeat center/contain; cursor:pointer} .paywall-popup__body {display:flex; flex:0 0 auto; flex-direction:column; align-items:center; justify-content:center; gap:32px; width:100%; max-width:1000px; margin:0 auto; padding:0 32px 52px; box-sizing:border-box} .paywall-popup__logo {display:block; width:100%; max-width:278px; height:32px; aspect-ratio:278 / 32; background:url('https://static.hankyung.com/resource/common/img/logo/logo-premium9.svg') no-repeat center/contain} .paywall-popup__title {width:100%; font-weight:700; font-size:20px; line-height:1.5; text-align:center} .paywall-popup__desc {font-size:16px; line-height:1.5; text-align:center} .paywall-popup__btn {display:inline-flex; align-items:center; justify-content:center; min-width:140px; padding:10px; border:0; border-radius:8px; background:#F2DFCF; font-size:16px; line-height:1.5; cursor:pointer} .paywall-popup__body {padding:0 32px 32px} .paywall-popup__foot {display:flex; align-items:center; justify-content:space-between; margin:0 32px; padding:24px 0 32px; border-top:1px solid #e6d9ce} .paywall-popup__check {display:inline-flex; align-items:center; gap:8px; cursor:pointer; user-select:none} .paywall-popup__check-input {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0} .paywall-popup__check-text {position:relative; display:flex; align-items:center; gap:8px; font-size:14px; font-weight:400; line-height:1.5} .paywall-popup__check-text::before {content:""; display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; box-sizing:border-box; border:1px solid #e6d9ce; background:transparent} .paywall-popup__check-input:checked + .paywall-popup__check-text::after {content:""; position:absolute; top:50%; left:4px; transform:translateY(-50%); display:inline-block; width:13px; height:10px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' fill='none'%3E%3Cpath stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m14.333 1-9.166 9.167L1 6'/%3E%3C/svg%3E") no-repeat center / contain} .paywall-popup__close-text {padding:0; border:0; background:transparent; font-size:14px; font-weight:400; line-height:1.5; cursor:pointer} /* 페이월 팝업: 신문구독자 */ /* .paywall-popup--notice .paywall-popup__title, .paywall-popup--notice .paywall-popup__desc {text-align:left} */ .paywall-popup--notice .paywall-popup__title {color:#CA002C} /*== 제호,특집등 임시 css ===*/ /* 2026 북중미 월드컵 */ .logo--worldcup-2026::before {content:''; display:inline-block; width:181px; height:20px; background:url('https://static.hankyung.com/resource/special/worldcup/canadamexicousa2026/img/logo--worldcup-2026.svg') no-repeat 0 0/contain; vertical-align:top} /*++++++++++ new ++++++++++*/ /* GNB */ /* 프리미엄9 모듈 */ .main-premium9 {padding:32px 0; background:#262A33} .main-premium9.main-module.bg > .layout-container {padding:0; position:relative} .main-premium9.main-module.bg-dark .news-item__depth2 {font-weight:500; color:var(--keycolor-premium9-dark); font-size:14px} .main-premium9 .logo__premium9--w:hover {text-decoration:none} .main-premium9 .logo__premium9--w::before {width:172px; height:20px; transform:translateY(-2px)} .main-premium9 .news-tit a, .main-premium9 .news-subtit, .main-premium9 .depth3 {color:#F2DFCF} .main-premium9 .news-subtit, .main-premium9 .depth3, .main-premium9 .text-cont > .icon-premium9 {margin-top:8px} .main-premium9 .text-cont {overflow-wrap:anywhere} .main-premium9 .depth3 {font-size:12px} .main-premium9 .type-headline {gap:40px} .main-premium9 .type-headline .text-cont {width:270px; padding-bottom:30px} .main-premium9 .type-headline .news-tit {font-weight:700; font-size:32px; /*-webkit-line-clamp:4*/} .main-premium9 .type-headline .thumb, .main-premium9 .type-headline .media-cont {width:580px} .main-premium9 .news-item-group .news-tit {font-size:18px} .main-premium9 .module-tit-wrap {position:absolute; left:0; bottom:0; margin:0} .main-premium9 .btn-basic {border:none; min-width:55px; height:26px; padding:0 16px; font-size:12px} .main-premium9 .btn-basic:after {height:100%; vertical-align:-8px} .main-premium9 .btn-basic.light-type {background:var(--keycolor-premium9); color:#F2DFCF} .main-premium9 .btn-basic.light-type.ing {background:rgba(255, 242, 228, 0.10); color:#FFF2E4} .main-premium9 [color="#0265cb"] {color:#5D93F4 !important} .main-premium9 [color="#ee4c4c"] {color:#F0626F !important} .main-premium9 [color="#7c41a4"] {color:#B563EF !important} /* 코리아마켓, 글로벌마켓, 집코노미 그룹 */ .main-market .news-tit {min-height:52px; font-weight:400} .main-market .module-row.col-line > .col {padding:0} .btn-link-yt {display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:8px 12px; border:1px solid #ddd; border-radius:8px; background:#fff; font-size:14px; line-height:1} .btn-link-yt::before {content:''; flex:0 0 auto; width:23px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23f03' d='M11.588 16s7.268 0 9.07-.48a2.9 2.9 0 0 0 2.047-2.024c.495-1.776.495-5.512.495-5.512s0-3.712-.496-5.472A2.84 2.84 0 0 0 20.659.488C18.856 0 11.588 0 11.588 0S4.336 0 2.542.488A2.92 2.92 0 0 0 .48 2.512C0 4.272 0 7.984 0 7.984s0 3.736.48 5.512a2.98 2.98 0 0 0 2.062 2.024c1.794.48 9.046.48 9.046.48'/%3E%3Cpath fill='%23fff' d='m15.2 8-6-3.4v6.8z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h23.2v16H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat 0 0/contain} /* 그룹 - 섹션 */ .module-list {display:grid; row-gap:32px} .module-list > .module-list-item {position:relative} .module-list .module-tit-wrap {margin-bottom:8px} .module-list .module-tit {font-size:18px; font-weight:700} .module-list .news-item {align-items:flex-start} .module-list .news-item > .thumb {width:160px} .module-list .news-tit {font-size:20px; font-weight:400; /*-webkit-line-clamp:3*/} .module-list .news-item > .text-cont {width:calc(100% - 176px)} .module-list > .module-list-item::before {content:''; display:none; position:absolute; top:-16px; left:0; right:0; height:1px; background:var(--list-line-color)} /* 2단 */ .module-list.column-2 {grid-template-columns:repeat(2, minmax(0, 1fr)); column-gap:40px} .module-list.column-2 > .module-list-item:nth-child(2) ~ .module-list-item::before {display:block} /* 3단 */ .module-list.column-3 {grid-template-columns:repeat(3, minmax(0, 1fr)); column-gap:40px} .module-list.column-3 > .module-list-item:nth-child(3) ~ .module-list-item::before {display:block} /* 4단 */ .module-list.column-4 {grid-template-columns:repeat(4, minmax(0, 1fr)); column-gap:40px} .module-list.column-4 > .module-list-item:nth-child(4) ~ .module-list-item::before {display:block} /*++++++++ // new ++++++++++*/ /* [2026.07.16] GNB 관련 수정 */ /* 이 부분은 바로 특정 클래스 등 필요. 반영시점 체크해서 정하기 */ .header-utility {top:19px; left:70px; right:auto} .promotion-nav {text-align:left} .promotion-nav a {font-size:14px} .promotion-nav-all {right:auto; left:0} .hk-header-main.ver-2026 .main__gnb .nav-link.nav-link-premium9 {border:none; padding:0} .isSticky .header-utility {opacity:0; visibility:hidden; pointer-events:none} /* slick 유지 위해 display:none 대신 숨김 처리 */ .hk-header-main.ver-2026 .main__gnb .nav-dropdown__menu:has(.nav__group) {padding:24px} .hk-header-main.ver-2026 .main__gnb .nav-dropdown-inner:has(.nav__group) {display:flex; align-items:flex-start; gap:40px} .hk-header-main.ver-2026 .main__gnb .nav__group {display:flex; flex-direction:column; gap:16px} .hk-header-main.ver-2026 .main__gnb .nav__group-tit {display:block; color:var(--hk-text-secondary); font-weight:400; font-size:12px; line-height:normal; white-space:nowrap} .hk-header-main.ver-2026 .main__gnb .nav__group .nav__list {gap:12px} .hk-header-main.ver-2026 .main__gnb .nav__group--bar {align-self:stretch; padding-left:32px; border-left:1px solid #ddd} .hk-header-main.ver-2026 .main__gnb .nav__group--bar .nav__list {gap:17px} /* [2026.07.16] 전문채널 롤링 메뉴 (.pro-nav) - 구조는 .promotion-nav 와 동일 */ .pro-nav-item {position:relative; display:flex; align-items:center} .pro-nav-wrap {position:relative; outline:none} .pro-nav {width:130px; height:30px; overflow:hidden} .pro-nav .slick-slide {border:none} .pro-nav .item {height:30px} .pro-nav .item a {display:flex; align-items:center; height:30px; text-decoration:none} .pro-nav .item a::before {flex:none} .pro-nav-all {position:absolute; top:-13px; left:-21px; min-width:160px; border:1px solid #ddd; border-radius:5px; background:#fff; text-align:left; box-sizing:border-box; opacity:0; z-index:-1; visibility:hidden; transition:all ease .2s} .pro-nav-all ul {padding:10px 20px} .pro-nav-all li {white-space:nowrap} .pro-nav-all li a {display:flex; align-items:center; height:34px; text-decoration:none} .pro-nav-all li a::before {flex:none} .pro-nav-all.on {opacity:1; visibility:visible; z-index:9999} .logo__yt-link {display:flex; align-items:center; gap:6px} .logo__yt-link::before {content:''; display:inline-block; flex:0 0 auto; width:21px; height:14px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='14' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23f03' d='M10.14 14s6.359 0 7.936-.42a2.53 2.53 0 0 0 1.79-1.771c.434-1.554.434-4.823.434-4.823s0-3.248-.434-4.788a2.49 2.49 0 0 0-1.79-1.771C16.5 0 10.14 0 10.14 0S3.795 0 2.225.427A2.56 2.56 0 0 0 .42 2.198C0 3.738 0 6.986 0 6.986s0 3.269.42 4.823a2.6 2.6 0 0 0 1.804 1.771c1.57.42 7.916.42 7.916.42'/%3E%3Cpath fill='%23fff' d='M13.3 7 8.05 4.025v5.95z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20.3v14H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat 0 0/contain; vertical-align:middle} .logo__yt-link:hover {text-decoration:none} /* */ .main__gnb .logo__koreamarket::before {width:97px; height:17px} .main__gnb .logo__globalmarket::before {width:97px; height:17px} .main__gnb .logo__jipconomy::before {width:50px; height:16px} .main__gnb .logo__travel::before {width:85px; height:13px;} .main__gnb .logo__esg::before {width:48px; height:12px} .main__gnb .logo__bioinsight::before {width:97px; height:15px} .main__gnb .logo__choinsight::before {width:101px; height:18px} .main__gnb .logo__lawbiz::before {width:83px; height:15px} .main__gnb .logo__marketinsight::before {width:94px; height:17px} .main__gnb .logo__arte::before {width:53px; height:22px;} .main__gnb .logo__legiexplorer::before {width:77px; height:19px} .main__gnb .logo__price::before {width:63px; height:18px;} .main__gnb .logo__wave::before {width:44px; height:12px;} .main__gnb .logo__mr::before {width:46px; height:17px}