@charset "UTF-8"; /* 메인개편 Ver2020 */ /* 2022 대선모듈 폰트: 대선 이후 주석예정 */ /* @import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap'); */ /* 2022 카타르월드컵 폰트: 모듈 제거시 주석예정 */ /* @import url('https://static.hankyung.com/fonts/GmarketSans/GmarketSans.css'); */ /* RESET */ html,body {-webkit-text-size-adjust:none} body,div,span,em,strong,select,section,article,nav,footer,header,address,caption,figure,figcaption,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p,textarea,input,button,tr,th,td,table {margin:0; padding:0} body,button,input,select,option,textarea,table,th,td {color:#121212; font-size:14px; font-family:'맑은 고딕','Malgun Gothic',AppleSDGothicNeo-Light,HelveticaNeue-Light,'나눔고딕',NanumGothic,'돋움',Dotum,sans-serif; letter-spacing:-.075em} 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,select,textarea,label {vertical-align:middle} input::-ms-clear{display:none} textarea {resize:none} button {border:0 none; border-radius:0; background:transparent; cursor:pointer} table {border-collapse:collapse; border-spacing:0} caption {width:0; height:0; overflow:hidden; color:transparent; text-indent:-9999px} legend, .blind {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent} header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption {display:block} a {color:#121212; text-decoration:none} a:hover {text-decoration:underline} a[role="button"] {cursor:pointer} /* SKIP */ .skip-nav a {display:block; height:0; margin:0 auto; overflow:hidden; font-size:0; text-align:center; background:#142c67; color:#fff} .skip-nav a:hover, .skip-nav a:active, .skip-nav a:focus {height:30px; font-size:15px; line-height:30px} /* IR */ .icon-new, .btn-allmenu:before, .btn-top, .btn-close-allmenu, .allmenu-util .util-sns > a, .sitemap-wrap .cate-premium .sv-tit:after, .top-link .login-link:before, .user-menu > a.login_link:before, .user-menu > a.user-name:before, .btn-open-search, .btn-search, .top-link .layer-my .user-info .social-user::before { background-image:url('https://static.hankyung.com/img/www/w/common/2021/spr-common-20210625-2.svg'); background-repeat:no-repeat; } /* ********** 공통이미지 업데이트 예정 */ .header-main .mn-login .layer-my .user-info .social-user::before { background-image:url('https://static.hankyung.com/img/www/w/common/2021/spr-common-20210811.svg'); background-repeat:no-repeat; } .btn-close-ad:before, .btn-close-info:before, .stock-marquee .num:before, .thumb-icon, .hover-slide .slick-arrow, .hktv-youtube .youtube-header .youtube-tit { background-image:url('https://static.hankyung.com/img/www/w/main/2020/spr-main-20211130@2x.png'); background-repeat:no-repeat; background-size:400px 400px; } .btn-audio:before { background-image:url('https://static.hankyung.com/img/www/w/main/2020/spr-audio@2x.png'); background-repeat:no-repeat; background-size:156px 28px; } /* BUTTON */ a[class^="btn-"], button[class^="btn-"] {display:inline-block; vertical-align:middle; box-sizing:border-box} .btn > .txt {position:relative} .btn-allmenu {position:relative} .btn-allmenu:before {content:''; display:inline-block; width:29px; height:29px; overflow:hidden; background-position:-61px 0} .btn-allmenu .badge-new {position:absolute; top:-7px; right:-7px; width:7px; height:7px; border:2px solid #fff; border-radius:50%; overflow:hidden; background:#f51f2b; color:transparent; white-space:nowrap} .btn-top-wrap {position:fixed; bottom:0; left:50%; width:1px; height:0} .btn-top-wrap .btn-position {position:absolute; bottom:80px; right:-630px} .btn-top-wrap .btn-top {position:fixed; display:block; width:50px; height:50px; background-position:0 0} .hover-slide .slick-arrow {position:absolute; top:50%; z-index:5; width:50px; height:51px; margin-top:-25px; overflow:hidden; text-indent:-9999px; visibility:hidden; opacity:0; transition:opacity ease .3s} .hover-slide .slick-prev {left:20px; background-position:0 -39px} .hover-slide .slick-next {right:20px; background-position:-60px -39px} .hover-slide:hover .slick-arrow {visibility:visible; opacity:1} /* ICON */ .icon-new {display:inline-block; width:15px; height:15px; margin-left:4px; overflow:hidden; text-indent:-9999px; background-position:-133px -62px; vertical-align:-2px} /* 회원 아이콘 */ .icon-myinfo::before {content:''; display:inline-block; width:12px; height:12px; margin-right:4px; background:url('https://static.hankyung.com/img/common/icon/icon-myinfo.svg') no-repeat 50% 50%/contain} [class^="icon-mylogin-"] {display:inline-block; width:24px; height:24px; border-radius:25rem; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; vertical-align:middle} .icon-mylogin-hk, .icon-mylogin-email {background:#142c67 url('https://static.hankyung.com/img/logo/logo-short-hk-w.svg') no-repeat 3px 50%/17px 9px} .icon-mylogin-kakao {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-kakao.svg')} .icon-mylogin-naver {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-naver.svg')} .icon-mylogin-apple {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-apple.svg')} .icon-mylogin-google {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-google.svg')} /* 선거 아이콘 */ .icon-g-vote {display:inline-block; width:20px; height:20px; background:url('https://static.hankyung.com/img/election/common/icon-vote.svg') no-repeat 0 0/20px 20px} .layer-allmenu .icon-g-vote {width:15px; height:15px; background-size:15px 15px; margin-right:4px; vertical-align:-2px} /* P아이콘 */ img.icon-premium {width:12px; height:16px; vertical-align:middle} .icon-premium-pay {display:inline-block; background:url('https://static.hankyung.com/img/www/w/common/icon-premium.svg') no-repeat 0 0/contain; width:10px; height:13px; margin:0 0 0 5px; text-indent:-9999px; overflow:hidden; color:transparent} .gnb a[href="https://www.hankyung.com/bioinsight"] + .icon-premium-pay.icon-premium-pay, .gnb a[href="https://www.hankyung.com/esg"] + .icon-premium-pay.icon-premium-pay {vertical-align:-2px} .allmenu-inner .sv-list .icon-premium-pay {position:relative; top:1px} .icon-premium-txt {display:inline-block; margin-right:6px; padding:2px 5px 2px 6px; border-radius:4px; background:#eb4e45; color:#fff; font-weight:bold; font-size:11px; line-height:1.3; letter-spacing:0; vertical-align:2px; font-family:-apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",sans-serif; text-align:center} /* 한경 Only 아이콘 */ .icon-hkonly {display:inline-block; margin-right:6px; padding:2px 5px 3px; border-radius:4px; background:#04aba9; color:#fff; font-weight:normal; font-size:11px; line-height:1.4; letter-spacing:-0.075em; vertical-align:3px} a.news-hkonly {text-decoration:none; box-shadow:inset 0 -8px 0 #dff9f8; transition:all .15s cubic-bezier(.33,.66,.66,1); overflow-wrap:break-word; -webkit-tap-highlight-color:rgba(0,0,0,0)} a.news-hkonly:hover {box-shadow:inset 0 -20px 0 #dff9f8} /* 회원전용 아이콘 */ .icon-membersonly {display:inline-block; margin-right:6px; padding:2px 5px; border-radius:4px; background:#00bbb4; /*background:#ff761b;*/ color:#fff; font-weight:normal; font-size:11px; line-height:1.4; letter-spacing:-0.075em; vertical-align:4px; font-family:-apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",sans-serif} .icon-membersonly2 {display:inline-block; width:10px; height:13px; margin:0 0 0 6px; background:url('https://static.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} a.news-membersonly {text-decoration:none; box-shadow:inset 0 -8px 0 #ffebdd; transition:all .15s cubic-bezier(.33,.66,.66,1); overflow-wrap:break-word; -webkit-tap-highlight-color:rgba(0,0,0,0)} a.news-membersonly:hover {box-shadow:inset 0 -20px 0 #ffebdd} .main-top .main-headline .thumb .icon-membersonly, .main-top .main-headline .iframe-youtube .icon-membersonly {position:absolute; top:0; left:0; border-radius:0 0 4px 0; font-size:13px} /* beta아이콘 */ .badge-beta {display:inline-block; font-style:italic; font-weight:bold; font-size:13px; color:#ee4c4c; letter-spacing:0} .header-main .badge-beta {margin-left:2px; font-size:10px; transform:translateY(-4px)} /* logo */ .logo__globalmarket::before {content:''; display:inline-block; width:111px; height:19px; background:url('https://static.hankyung.com/img/logo/logo-globalmarket.svg') no-repeat 0 0/contain; overflow:hidden} .logo__koreamarket::before {content:''; display:inline-block; width:106px; height:19px; background:url('https://static.hankyung.com/img/logo/logo-koreamarket.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__jipconomy::before {content:''; display:inline-block; width:60px; height:21px; background:url('https://static.hankyung.com/img/logo/logo-jipconomy.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top; position:relative; top:-1px} .logo__marketpro::before {content:''; display:inline-block; width:99px; height:22px; background:url('https://static.hankyung.com/img/logo/logo-marketpro.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} .logo__hankyungpro::before {content:''; display:inline-block; width:99px; height:16px; background:url('https://static.hankyung.com/resource/common/img/logo/logo-hankyungpro.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} /* FROM */ .inp-txt::placeholder {color:#666} .inp-txt:-ms-input-placeholder {color:#666} .inp-txt::-ms-input-placeholder {color:#666} /* LAYOUT */ #wrap {min-width:1180px} .layout-inner {position:relative; max-width:1180px; margin:0 auto} .cont-row {display:table; table-layout:fixed; width:100%} .cont-row > .col {display:table-cell} .row-float {margin:0 -10px} .row-float > .col {float:left; padding:0 10px; box-sizing:border-box} .row-float.col-2 > .col {width:50%} .row-float.col-3 > .col {width:33.33336%} .row-float.col-4 > .col {width:25%} .row-float:after {content:''; display:block; clear:both} /* AD */ .close-ad .ad-inner {position:relative; display:inline-block; margin:0 auto} .close-ad .btn-close-ad {display:none; position:absolute; right:0; bottom:0; width:30px; height:30px; background-color:#7e898f; text-align:center} .close-ad .btn-close-ad:before {content:''; display:inline-block; width:11px; height:11px; margin-left:1px; background-position:-43px -176px} .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} .ad-area, .ad-bottom, .banner-area {max-width:1180px; margin:30px auto; text-align:center} .ad-top {position:relative; z-index:1005; background:#f7f7f7; text-align:center} /* .ad-top .ad-inner {max-width:1060px} */ .ad-top .ad-inner > div[id^="div-gpt-ad"] {position:relative; padding:20px 0} .ad-top .btn-close-ad {bottom:20px} .ad-area > div, .ad-bottom > div, .banner-area {padding-top:30px; border-top:1px solid #ddd} /* header */ .header {position:relative; border-bottom:1px solid #ddd} .top-link {font-size:13px} .top-link .layout-inner {height:30px; padding:8px 10px 0; box-sizing:border-box} .top-link .ked-global {float:left} .top-link .ked-global dt {float:left; font-weight:bold; letter-spacing:0} .top-link .ked-global dd {float:left; margin-left:19px} .top-link .ked-global {letter-spacing:0} .top-link .top-rel-area {float:left} .top-link .top-rel-area > ul > li {float:left; min-height:18px; margin-right:13px} .top-link .top-rel-area > ul::after {content:''; display:block; clear:both} .top-link .top-rel-area .gnb-dropdown {position:relative; outline:none} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-menu {position:absolute; top:20px; left:-10px; min-width:100px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; text-align:left; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; opacity:0; visibility:hidden; z-index:-1; transform-origin:left top;} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-menu::before {content:''; position:absolute; top:-5px; left:0; right:0; height:5px} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-toggle {cursor:pointer; user-select:none; outline:none} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-toggle::after {content:''; display:inline-block; width:0; height:0; margin-left:5px; border-width:4px; border-style:solid; border-color:#bbb transparent transparent transparent; vertical-align:-2px} .top-link .top-rel-area .gnb-dropdown:hover .gnb-dropdown-menu, .top-link .top-rel-area .gnb-dropdown.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:10; animation:.2s alternate slideDown} .top-link .top-rel-area .gnb-dropdown:hover .gnb-dropdown-toggle::after, .top-link .top-rel-area .gnb-dropdown.focus .gnb-dropdown-toggle::after {position:relative; top:-4px; border-color:transparent transparent #bbb transparent} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-menu ul {padding:10px; text-align:center} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-menu li {font-size:14px; white-space:nowrap} .top-link .top-rel-area .gnb-dropdown .gnb-dropdown-menu li + li {margin-top:5px} .top-link .login-area {position:relative; float:right} .top-link .login-area > a, .top-link .login-area > span {min-height:18px; vertical-align:middle} .top-link .login-area > a + a {margin-left:13px} .top-link .login-area > .today::after {content:'|'; position:relative; top:-1px; margin:0 6px 0 10px; color:#ddd} .top-link .layer-my {position:absolute; top:0; right:0; z-index:-1; width:300px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; font-size:13px; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; visibility:hidden; transform:scale(.9); opacity:0; transition:all ease .2s} .top-link .layer-my [class^="btn-"] {text-decoration:none} .top-link .layer-my > div + div {border-top:1px solid #ddd} .top-link .layer-my .user-info {padding:24px 20px; text-align:center} .top-link .layer-my .user-info .name, .top-link .layer-my .user-info .email {overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .top-link .layer-my .user-info .name {font-size:17px} .top-link .layer-my .user-info .email {margin:10px 0 15px; font-size:14px; letter-spacing:0} .top-link .layer-my .user-info .social-user {margin:10px 0 15px; font-size:14px; letter-spacing:0} .top-link .layer-my .user-info .social-user::before {content:''; display:inline-block; position:relative; width:18px; margin-right:4px; overflow:hidden; vertical-align:-3px} .top-link .layer-my .user-info .social-user.social-apple::before {height:17px; background-position:-212px -62px} .top-link .layer-my .user-info .social-user.social-google::before {height:15px; background-position:-77px -62px} .top-link .layer-my .user-info .social-user.social-kakao::before {height:15px; background-position:-185px -62px} .top-link .layer-my .user-info .social-user.social-naver::before {height:15px; background-position:3px -62px} .top-link .layer-my .user-info .social-user.social-facebook::before {height:17px; background-position:-25px -62px} .top-link .layer-my .user-info .social-user::after {content:''; display:inline-block; width:1px; height:18px; vertical-align:-5px} .top-link .layer-my .user-info .btn-account {display:inline-block; width:190px; height:40px; border:1px solid #c3c3c3; border-radius:20px; font-size:13px; line-height:38px; box-sizing:border-box} .top-link .layer-my .use-service {padding:24px 20px} .top-link .layer-my .use-service li {position:relative; padding-left:7px} .top-link .layer-my .use-service li:before {content:''; position:absolute; top:7px; left:0; width:2px; height:2px; background:#121212} .top-link .layer-my .use-service li + li {margin-top:10px} .top-link .layer-my .btn-logout {display:block; width:100%; font-size:13px; line-height:40px; text-align:center} .top-link .layer-my.active {visibility:visible; z-index:999; transform:scale(1); opacity:1} .top-link .layout-inner:after {content:''; display:block; clear:both} .header .header-inner {position:relative; width:1180px; margin:0 auto} .header .logo {height:90px; padding:28px 0 24px; text-align:center; box-sizing:border-box} .header .logo .logo-hankyung {display:inline-block; position:relative; left:2px; width:201px; height:50px; background:url('https://static.hankyung.com/img/logo/hankyung-logo@2x.png') no-repeat; background-size:201px 50px; vertical-align:top} .header .service-area {position:absolute; top:34px; left:0; padding-left:66px} .header .btn-allmenu {position:absolute; top:8px; left:10px} .header .today-info {margin:2px 0; padding-left:2px} .header .today-info .today {float:left; margin-right:15px; font-weight:bold} .header .today-info .weather-wrap {float:left; width:200px; height:20px; overflow:hidden} .header .today-info:after {content:''; display:block; clear:both} .header .service-menu li {position:relative; float:left} .header .service-menu li + li {margin-left:10px} .header .service-menu li + li:before {content:'|'; margin-right:10px; color:#ddd} .header .service-menu:after {content:''; display:block; clear:both} .header .header-banner {position:absolute; top:30px; right:90px; width:240px; height:50px; overflow:hidden} .header .header-banner .item {height:50px; overflow:hidden} .header .header-banner a {outline:none} .header .search-area {position:absolute; top:32px; right:10px} .header .btn-open-search, .header .btn-search {width:29px; height:29px; margin-top:10px; overflow:hidden; background-position:-180px 0} .header .layer-search {display:none; position:absolute; top:0; right:-20px; width:360px} .header .layer-search .inp-txt {width:100%; height:50px; padding:0 60px 0 20px; border:1px solid #ddd; border-radius:10px; box-sizing:border-box; color:#121212; font-size:14px} .header .layer-search .btn-search {position:absolute; top:0; right:20px} .weather-slide .item {font-weight:bold; font-size:13px} .weather-slide .item .temperature {font-size:14px; letter-spacing:0; vertical-align:-1px} .gnb-inner {position:relative; width:1180px; height:45px; margin:0 auto -1px; padding-top:13px; text-align:center; box-sizing:border-box} .gnb-inner > ul, .gnb-inner > ul > li, .gnb-inner > ul > li > a, .gnb-inner .gnb-dropdown-toggle {display:inline-block; vertical-align:top; box-sizing:border-box} .gnb-inner > ul + ul {margin-left:8px} .gnb-inner > ul + ul::before {content:''; display:inline-block; position:relative; top:2px; width:1px; height:13px; margin-right:8px; background-color:#c8c8c8} .gnb-inner > ul > li {margin:0 10px} .gnb-inner > ul > li > a, .gnb-inner .gnb-dropdown-toggle {height:32px; padding:0 0 10px; font-weight:bold; font-size:16px; text-decoration:none} .gnb-inner li > .icon-new {margin-left:0; vertical-align:-3px} .gnb-inner li > .icon-premium-pay {margin-left:2px} .gnb-inner .nav-expand > li > a, .gnb-inner .nav-expand .gnb-dropdown-toggle {color:#436f91} .gnb-inner > ul > li > a:hover, .gnb-inner .gnb-dropdown-toggle:hover, .gnb-inner .gnb-dropdown:hover .gnb-dropdown-toggle, .gnb-inner .gnb-dropdown.focus .gnb-dropdown-toggle {border-bottom:4px solid #121212} .gnb-inner .nav-expand > li > a:hover, .gnb-inner .nav-expand .gnb-dropdown-toggle:hover, .gnb-inner .nav-expand .gnb-dropdown:hover .gnb-dropdown-toggle, .gnb-inner .nav-expand .gnb-dropdown.focus .gnb-dropdown-toggle {border-color:#436f91} .gnb-inner .gnb-dropdown {position:relative; outline:none} .gnb-inner .gnb-dropdown .gnb-dropdown-toggle {cursor:pointer; user-select:none; outline:none} .gnb-inner .gnb-dropdown .gnb-dropdown-toggle::after {content:''; display:inline-block; width:0; height:0; margin-left:5px; border-width:4px; border-style:solid; border-color:#bbb transparent transparent transparent} /* .gnb-inner .nav-expand .gnb-dropdown .gnb-dropdown-toggle::after {border-color:#bbb transparent transparent transparent} */ .gnb-inner .gnb-dropdown .gnb-dropdown-menu {position:absolute; top:36px; left:-20px; min-width:110px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; text-align:left; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; /*transition:all .2s cubic-bezier(0.2,0,0.5,1);*/ opacity:0; visibility:hidden; z-index:-1; transform-origin:left top;} .gnb-inner .gnb-dropdown .gnb-dropdown-menu::before {content:''; position:absolute; top:-10px; left:0; right:0; height:10px} /* .gnb-inner .gnb-dropdown .icon-new + .gnb-dropdown-menu {margin-left:-85px} */ .gnb-inner .gnb-dropdown .gnb-dropdown-menu ul {padding:10px 20px} .gnb-inner .gnb-dropdown .gnb-dropdown-menu li {padding:6px 0; font-size:14px; white-space:nowrap} .gnb-inner .gnb-dropdown:hover .gnb-dropdown-menu, .gnb-inner .gnb-dropdown.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:10; animation:.2s alternate slideDown} .gnb-inner .gnb-dropdown:hover .gnb-dropdown-toggle::after, .gnb-inner .gnb-dropdown.focus .gnb-dropdown-toggle::after {position:relative; top:-4px; border-color:transparent transparent #bbb transparent} /* .gnb-inner .nav-expand .gnb-dropdown:hover .gnb-dropdown-toggle::after {border-color:transparent transparent #bbb transparent} */ .gnb .icon-premium {width:9px; height:11px; margin-left:4px} .gnb .gnb-dropdown-menu-group {display:flex} .gnb .gnb-dropdown-menu-group > ul {position:relative} .gnb .gnb-dropdown-menu-group > ul + ul::before {content:''; position:absolute; top:19px; left:0; bottom:19px; width:1px; background:#ddd} .gnb .gnb-dropdown-menu-group.premium-menu-group {width:315px} .gnb .gnb-dropdown-menu .premium-menu-list > li {display:flex; align-items:center; justify-content:space-between} .gnb .gnb-dropdown-menu .premium-menu-list > li > a {flex:1 1 auto; padding-right:15px} .gnb .gnb-dropdown-menu .premium-menu-list > li .icon-premium-pay {margin:0} @keyframes slideDown { 0% { transform:scaleY(0) } 100% { transform:scaleY(1) } } @media \0screen { .header .logo .logo-hankyung {background-image:url('https://static.hankyung.com/img/logo/hankyung-logo.png')} } /* 시즌제호 */ /* .logo[class*="seasonal-"] .logo-hankyung {top:-17px; left:0} .logo.seasonal-202102-v1 .logo-hankyung {width:310px; height:90px; margin-left:120px; background:url('https://static.hankyung.com/img/logo/seasonal/202102/m/slogo-202102-1.png') no-repeat -146px 50%/500px 90px} .logo.seasonal-202102-v2 .logo-hankyung {width:250px; height:90px; background:url('https://static.hankyung.com/img/logo/seasonal/202102/w/slogo-202102-2.gif') no-repeat 50% 50%} */ /* 2021 추석 제호 */ /* .header-main.seasonal-202109-v1 .logo {position:relative; z-index:2; padding-left:45px} .header-main.seasonal-202109-v1 [class^="seasonal-obj-"] {position:absolute; background-repeat:no-repeat; background-size:contain; opacity:0} .header-main.seasonal-202109-v1 .seasonal-obj-cloud {top:0; left:-40px; width:calc(550px / 2); height:calc(122px / 2); background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v1/seasonal-v1-cloud.png'); animation:fadeIn 1s ease-in 0s 1 both} .header-main.seasonal-202109-v1 .seasonal-obj-tree {top:0; left:-40px; width:calc(550px / 2); height:calc(122px / 2); background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v1/seasonal-v1-tree.png'); animation:fadeIn 1.3s ease-in .7s 1 both} .header-main.seasonal-202109-v1 .seasonal-obj-food-bg {top:69px; left:380px; width:calc(180px / 2); height:calc(92px / 2); background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v1/seasonal-v1-food.png'); animation:fadeIn 2.5s ease-in 1s 1 both} .header-main.seasonal-202109-v1 .seasonal-obj-food1 {top:69px; left:380px; width:calc(180px / 2); height:calc(92px / 2); background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v1/seasonal-v1-food-bg.png'); animation:fadeIn 2.5s ease-in 1.2s 1 both} .header-main.seasonal-202109-v1 .seasonal-obj-food2 {top:69px; left:380px; width:calc(180px / 2); height:calc(92px / 2); background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v1/seasonal-v1-food2.png'); animation:fadeIn 2.5s ease-in 2s 1 both} @keyframes fadeIn { 0%, 10% {opacity:0} 90%, 100% {opacity:1} } .header-main.seasonal-202109-v2 .header-inner .logo {margin-left:-40px; padding:0; } .header-main.seasonal-202109-v2 .header-inner .logo .logo-hankyung {width:340px; height:120px; background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v2/logo-seasonal-202109-v2.gif')} .header-main.seasonal-202109-v2 .gnb-wrap {margin-top:19px} .header-main.seasonal-202109-v3 .header-inner .logo {padding:0} .header-main.seasonal-202109-v3 .header-inner .logo .logo-hankyung {width:200px; height:120px; background-image:url('https://static.hankyung.com/img/logo/seasonal/202109/v3/logo-seasonal-202109-v3.gif')} .header-main.seasonal-202109-v3 .gnb-wrap {margin-top:19px} */ /* 2022 새해 제호 */ /*.header-main.seasonal-202201-v1 .header-inner .logo {margin-left:9px; padding-top:35px} .header-main.seasonal-202201-v1 .header-inner .logo .logo-hankyung {width:223px; height:75px; background-image:url('https://static.hankyung.com/img/logo/seasonal/202201/v1/logo-seasonal-v1.gif')} .header-main.seasonal-202201-v1 .gnb-wrap {margin-top:30px} .header-main.seasonal-202201-v2::before {content:''; display:block; position:absolute; top:0; left:50%; width:340px; height:120px; margin-left:-304px; background:url('https://static.hankyung.com/img/logo/seasonal/202201/v2/logo-seasonal-v2.gif') no-repeat; transform:scale(.75) translateY(13px); transform-origin:top left} .header-main.seasonal-202201-v3::before {content:''; display:block; position:absolute; top:0; left:50%; width:265px; height:120px; margin-left:-248px; background:url('https://static.hankyung.com/img/logo/seasonal/202201/v3/logo-seasonal-v3.gif') no-repeat; transform:scale(.8); transform-origin:center left} .header-main.seasonal-202201-v4 .header-inner .logo {margin-left:-4px; padding-top:0} .header-main.seasonal-202201-v4 .header-inner .logo .logo-hankyung {width:340px; height:120px; background-image:url('https://static.hankyung.com/img/logo/seasonal/202201/v4/logo-seasonal-v4.gif')} .header-main.seasonal-202201-v4 .gnb-wrap {margin-top:19px}*/ /* 2022 설닐 제호 */ /* .header-main.seasonal-202202-v1 .header-inner .logo {margin-top:0; padding-top:0} .header-main.seasonal-202202-v1 .header-inner .logo .logo-hankyung {width:222px; height:111px; background:url('https://static.hankyung.com/img/logo/seasonal/202202/logo-seasonal-v1.gif') no-repeat -68px 0} .header-main.seasonal-202202-v1 .gnb-wrap {margin-top:30px} .header-main.seasonal-202202-v2::before {content:''; display:block; position:absolute; top:0; left:50%; width:130px; height:120px; margin-left:-365px; background:url('https://static.hankyung.com/img/logo/seasonal/202202/logo-seasonal-v2.gif') no-repeat} .header-main.seasonal-202202-v2 .header-inner .logo {margin-right:125px} .header-main.seasonal-202202-v3::before {content:''; display:block; position:absolute; top:10px; left:50%; width:150px; height:120px; margin-left:-365px; background:url('https://static.hankyung.com/img/logo/seasonal/202202/logo-seasonal-v3.gif') no-repeat} .header-main.seasonal-202202-v3 .header-inner .logo {margin-right:130px} */ /* 2022 추석 제호 */ /* .header-main.seasonal-202209-v1 .header-inner .logo {position:relative; z-index:2} .header-main.seasonal-202209-v1 .header-inner::before {content:''; display:block; position:absolute; top:0; left:220px; width:150px; height:120px; background:url('https://static.hankyung.com/img/logo/seasonal/202209/logo-seasonal-v1.gif') no-repeat} .header-main.seasonal-202209-v2 .header-inner::before {content:''; display:block; position:absolute; top:0; left:235px; width:150px; height:120px; background:url('https://static.hankyung.com/img/logo/seasonal/202209/logo-seasonal-v2.gif') no-repeat} .header-main.seasonal-202209-v3 .header-inner::before {content:''; display:block; position:absolute; top:0; left:235px; width:150px; height:120px; background:url('https://static.hankyung.com/img/logo/seasonal/202209/logo-seasonal-v3.gif') no-repeat} .header-main.seasonal-202209-v4 .header-inner::before {content:''; display:block; position:absolute; top:0; left:235px; width:150px; height:120px; background:url('https://static.hankyung.com/img/logo/seasonal/202209/logo-seasonal-v4.gif') no-repeat} .header-main.seasonal-202209-v5 .header-inner .logo {margin-top:0; padding-top:0} .header-main.seasonal-202209-v5 .header-inner .logo .logo-hankyung {width:340px; height:111px; background:url('https://static.hankyung.com/img/logo/seasonal/202209/logo-seasonal-v5.gif') no-repeat -68px 0} .header-main.seasonal-202209-v5 .gnb-wrap {margin-top:25px} */ /* 2023 신년 제호 */ /* .header-main.ver2022.seasonal-2023-v1 .header-inner .logo {margin-top:0; padding-top:0} .header-main.ver2022.seasonal-2023-v1 .header-inner .logo .logo-hankyung {width:222px; height:120px; background:url('https://static.hankyung.com/img/logo/seasonal/202301/logo-seasonal-v1.gif') no-repeat 0 0} .header-main.ver2022.seasonal-2023-v1 .gnb-wrap {margin-top:20px} .header-main.ver2022.seasonal-2023-v2 .header-inner .logo {padding-top:10px} .header-main.ver2022.seasonal-2023-v2 .header-inner .logo .logo-hankyung {width:225px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/202301/logo-seasonal-v2.gif') no-repeat 0 0} .header-main.ver2022.seasonal-2023-v2 .header-inner .service-area {padding-top:39px} .header-main.ver2022.seasonal-2023-v3 .header-inner .logo {padding-top:0} .header-main.ver2022.seasonal-2023-v3 .header-inner .logo .logo-hankyung {width:245px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/202301/logo-seasonal-v3.gif') no-repeat 0 0} .header-main.ver2022.seasonal-2023-v4 .header-inner .logo {padding-top:10px} .header-main.ver2022.seasonal-2023-v4 .header-inner .logo .logo-hankyung {width:222px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/202301/logo-seasonal-v4.gif') no-repeat 0 0} .header-main.ver2022.seasonal-2023-v4 .header-inner .service-area {padding-top:39px} .header-main.ver2022.seasonal-2023-v5 .header-inner .logo {padding-top:10px} .header-main.ver2022.seasonal-2023-v5 .header-inner .logo .logo-hankyung {width:420px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/202301/logo-seasonal-v5.gif') no-repeat 0 0} .header-main.ver2022.seasonal-2023-v5 .header-inner .service-area {padding-top:39px} .header-main.ver2022.seasonal-2023-v2 .gnb-wrap, .header-main.ver2022.seasonal-2023-v3 .gnb-wrap, .header-main.ver2022.seasonal-2023-v4 .gnb-wrap, .header-main.ver2022.seasonal-2023-v5 .gnb-wrap {margin-top:35px} .isSticky .header-main.ver2022.seasonal-2023-v1 .header-inner .logo, .isSticky .header-main.ver2022.seasonal-2023-v2 .header-inner .logo, .isSticky .header-main.ver2022.seasonal-2023-v3 .header-inner .logo, .isSticky .header-main.ver2022.seasonal-2023-v4 .header-inner .logo, .isSticky .header-main.ver2022.seasonal-2023-v5 .header-inner .logo, .isSticky .header-main.ver2022.seasonal-2023-v1 .header-inner .service-area, .isSticky .header-main.ver2022.seasonal-2023-v2 .header-inner .service-area, .isSticky .header-main.ver2022.seasonal-2023-v3 .header-inner .service-area, .isSticky .header-main.ver2022.seasonal-2023-v4 .header-inner .service-area, .isSticky .header-main.ver2022.seasonal-2023-v5 .header-inner .service-area {padding-top:0} .isSticky .header-main.ver2022.seasonal-2023-v1 .header-inner .logo .logo-hankyung, .isSticky .header-main.ver2022.seasonal-2023-v2 .header-inner .logo .logo-hankyung, .isSticky .header-main.ver2022.seasonal-2023-v3 .header-inner .logo .logo-hankyung, .isSticky .header-main.ver2022.seasonal-2023-v4 .header-inner .logo .logo-hankyung, .isSticky .header-main.ver2022.seasonal-2023-v5 .header-inner .logo .logo-hankyung {width:54px !important; height:48px !important; background:#142c67 url('https://static.hankyung.com/img/logo/logo-short-hk-w.svg') no-repeat 50% 19px/40px 21px !important; vertical-align:top; box-sizing:border-box} */ /* NEW GNB */ .header-main .btn-allmenu:before { background-image:url('https://static.hankyung.com/img/www/w/common/2021/spr-common-20210811.svg'); background-repeat:no-repeat; } .header-main .service-list > li .hit::before, .header-main .mn-search .btn-search, .badge-live, .stock-marquee-wrap .stock-marquee .num:before { background-image:url('https://static.hankyung.com/img/www/w/main/2020/spr-main-2023.svg'); background-repeat:no-repeat; background-size:auto; } .header-main {position:relative; background:#fff; transition:all 0.5s cubic-bezier(0.23,1,0.32,1)} .header-main .logo__globalmarket::before {width:118px; height:21px; vertical-align:top; position:relative; top:0} .header-main .logo__koreamarket::before {width:118px; height:21px; vertical-align:top; position:relative; top:0} .header-main .gnb-dropdown {position:relative; outline:none} .header-main .gnb-dropdown .gnb-dropdown-toggle {cursor:pointer; user-select:none; outline:none; font-weight:normal} .header-main .gnb-dropdown .gnb-dropdown-toggle::after {content:''; display:inline-block; width:0; height:0; margin-left:5px; border-width:5px 4px; border-style:solid; border-color:#bbb transparent transparent transparent; vertical-align:-3px} .header-main .gnb-dropdown .gnb-dropdown-menu {position:absolute; left:-10px; min-width:100px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; text-align:left; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; opacity:0; visibility:hidden; z-index:-1; transform-origin:left top;} .header-main .gnb-dropdown .gnb-dropdown-menu::before {content:''; position:absolute; top:-5px; left:0; right:0; height:5px} .header-main .gnb-dropdown:hover .gnb-dropdown-menu, .header-main .gnb-dropdown.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:10; animation:.2s alternate slideDown} .header-main .gnb-dropdown:hover .gnb-dropdown-toggle::after, .header-main .gnb-dropdown.focus .gnb-dropdown-toggle::after {position:relative; top:-5px; border-color:transparent transparent #bbb transparent} .header-main .gnb-dropdown .gnb-dropdown-menu ul {padding:10px} .header-main .gnb-dropdown .gnb-dropdown-menu li {font-size:13px; white-space:nowrap} .header-main .gnb-dropdown .gnb-dropdown-menu li + li {margin-top:8px} .header-main .gnb .nav-expand > li.globalmarket > a:hover, .header-main .gnb .nav-expand > li.globalmarket .gnb-dropdown-toggle:hover, .header-main .gnb .nav-expand .gnb-dropdown.globalmarket:hover .gnb-dropdown-toggle, .header-main .gnb .nav-expand .gnb-dropdown.globalmarket.focus .gnb-dropdown-toggle {border-color: #243081} .header-main .gnb .gnb-dropdown.globalmarket .gnb-dropdown-menu {left:0} .header-main .gnb .gnb-dropdown .gnb-dropdown-menu li + li {margin-top:0} .header-main .gnb .gnb-dropdown .gnb-dropdown-menu li .icon-membersonly {margin:0 0 0 5px; font-size:10px; vertical-align:1px} .header-main .gnb-dropdown.type-click .gnb-dropdown-menu {display:none; opacity:1; visibility:visible; z-index:1} .header-main .gnb-dropdown.type-click .gnb-dropdown-menu::before {display:none} .header-main .gnb-dropdown.type-click:hover .gnb-dropdown-menu, .header-main .gnb-dropdown.type-click.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:10; animation:none} .header-main .gnb-dropdown.type-click.focus .gnb-dropdown-menu {display:block} .header-main .gnb-dropdown.type-click .gnb-dropdown-menu ul {padding:10px} .header-main .gnb-dropdown.type-click .gnb-dropdown-menu li {font-size:13px; white-space:nowrap} .header-main .gnb-dropdown.type-click .gnb-dropdown-menu li + li {margin-top:8px} .header-main .gnb-dropdown.type-click.active .gnb-dropdown-menu {z-index:99999} .header-main .header-inner {position:relative; max-width:1180px; margin:0 auto} .header-main .header-inner .logo {float:left; margin:0 20px 0 10px; padding-top:39px} .header-main .header-inner .logo .logo-hankyung {display:inline-block; width:221px; height:55px; background:url('https://static.hankyung.com/img/logo/logo-hk.svg') no-repeat 0 0/contain; vertical-align:top} .header-main .header-inner .info-area {float:left; margin-top:44px} .header-main .info-area .today-info {margin-bottom:4px; font-size:14px} .header-main .info-area .gnb-dropdown .gnb-dropdown-menu {top:20px} .header-main .header-inner .service-area {float:right; padding:41px 10px 0 0} .header-main .service-list > li {float:left; margin-left:20px} .header-main .service-list > li .hit {display:inline-block; position:relative; padding-top:35px} .header-main .service-list > li .hit::before {content:''; position:absolute; top:0; left:50%; transform:translateX(-50%)} .header-main .service-list .mn-hktv {position:relative} .header-main .service-list .mn-hktv .hit::before {width:27px; height:26px; background-position:-1px -1px} .header-main .service-list .mn-hktv .badge-live {content:''; position:absolute; top:2px; right:-16px; width:28px; height:12px; background-position:-2px -41px; pointer-events:none; animation:.7s linear alternate showHide forwards infinite} @keyframes showHide { from, 50% { opacity:0 } 50.00001%, to { opacity:1 } } .header-main .service-list .mn-newspaper .hit::before {top:5px; width:25px; height:21px; background-position:-48px -6px} .header-main .service-list .mn-wsj .hit::before {top:5px; width:31px; height:18px; background-position:-94px -6px} .header-main .service-list .mn-ked .hit::before {top:5px; width:50px; height:25px; background-position:-145px -6px} .header-main .service-list .mn-ked .gnb-dropdown-menu {top:55px; min-width:auto; width:85px} .header-main .service-list .mn-ked .gnb-dropdown-menu ul {padding-left:20px} .header-main .service-list .mn-subscribe .hit::before {top:3px; width:22px; height:27px; background-position:-214px -4px} .header-main .service-list .mn-login {position:relative} .header-main .service-list .mn-login .hit::before {top:3px; width:24px; height:24px; background-position:-256px -4px} .header-main .service-list .mn-login .ellips {text-overflow:ellipsis; overflow:hidden; display:inline-block; vertical-align:top; white-space:nowrap; max-width:42px} .header-main .mn-login .layer-my {position:absolute; top:0; right:0; z-index:-1; width:300px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; font-size:13px; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; visibility:hidden; transform:scale(.9); opacity:0; transition:all ease .2s} .header-main .mn-login .layer-my [class^="btn-"] {text-decoration:none} .header-main .mn-login .layer-my > div + div {border-top:1px solid #ddd} .header-main .mn-login .layer-my .user-info {padding:24px 20px; text-align:center} .header-main .mn-login .layer-my .user-info .name, .header-main .mn-login .layer-my .user-info .email {overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .header-main .mn-login .layer-my .user-info .name {font-size:17px} .header-main .mn-login .layer-my .user-info .email {margin:10px 0 15px; font-size:14px; letter-spacing:0} .header-main .mn-login .layer-my .user-info .social-user {margin:10px 0 15px; font-size:14px; letter-spacing:0} .header-main .mn-login .layer-my .user-info .social-user::before {content:''; display:inline-block; position:relative; width:18px; margin-right:4px; overflow:hidden; vertical-align:-3px} .header-main .mn-login .layer-my .user-info .social-user.social-apple::before {height:17px; background-position:-123px -35px} .header-main .mn-login .layer-my .user-info .social-user.social-google::before {height:15px; background-position:-72px -35px} .header-main .mn-login .layer-my .user-info .social-user.social-kakao::before {height:15px; background-position:-99px -34px} .header-main .mn-login .layer-my .user-info .social-user.social-naver::before {height:15px; background-position:1px -35px} .header-main .mn-login .layer-my .user-info .social-user.social-facebook::before {height:17px; background-position:-22px -35px} .header-main .mn-login .layer-my .user-info .social-user::after {content:''; display:inline-block; width:1px; height:18px; vertical-align:-5px} .header-main .mn-login .layer-my .user-info .btn-account {display:inline-block; width:190px; height:40px; border:1px solid #c3c3c3; border-radius:20px; font-size:13px; line-height:38px; box-sizing:border-box} .header-main .mn-login .layer-my .use-service {padding:24px 20px} .header-main .mn-login .layer-my .use-service li {position:relative; padding-left:7px} .header-main .mn-login .layer-my .use-service li:before {content:''; position:absolute; top:7px; left:0; width:2px; height:2px; background:#121212} .header-main .mn-login .layer-my .use-service li + li {margin-top:10px} .header-main .mn-login .layer-my .btn-logout {display:block; width:100%; font-size:13px; line-height:40px; text-align:center} .header-main .mn-login .layer-my.active {visibility:visible; z-index:999; transform:scale(1); opacity:1} .header-main .service-list .mn-search {position:relative} .header-main .service-list .mn-search .hit::before {top:5px; width:20px; height:20px; background-position:-300px -6px} .header-main .mn-search .btn-open-search {background:none} .header-main .mn-search .btn-search {width:20px; height:20px; background-position:-300px -6px} .header-main .mn-search .layer-search {display:none; position:absolute; top:0; right:-10px; width:270px} .header-main .mn-search .layer-search .inp-txt {width:100%; height:57px; padding:0 60px 0 20px; border:1px solid #ddd; border-radius:10px; box-sizing:border-box; color:#121212; font-size:14px; outline:none} .header-main .mn-search .layer-search .btn-search {position:absolute; top:50%; right:20px; transform:translateY(-50%)} .header-main .service-list::after, .header-main .header-inner::after {content:''; display:block; clear:both} .header-main .service-list .txt {font-size:13px; vertical-align:top} .header-main .gnb-wrap {margin-top:45px} .header-main .gnb-wrap-inner {max-width:1180px; margin:0 auto; padding:0 10px; box-sizing:border-box} .header-main .gnb-wrap-inner .btn-allmenu {float:left} .header-main .gnb-wrap-inner .gnb {float:left} .header-main .gnb-wrap-inner::after {content:''; display:block; clear:both} .header-main .btn-allmenu {position:relative; top:3px} .header-main .btn-allmenu:before {width:22px; height:17px; background-position:-1px -1px; vertical-align:top;} .header-main .btn-allmenu .badge-new {top:-4px; right:-7px; width:7px; height:7px; border:2px solid #fff} .header-main .gnb {margin-left:37px} .header-main .gnb > ul, .header-main .gnb > ul > li, .header-main .gnb > ul > li > a, .header-main .gnb .gnb-dropdown-toggle {float:left; box-sizing:border-box} .header-main .gnb > ul + ul {margin-left:35px} .header-main .gnb > ul > li + li {margin-left:35px} .header-main .gnb > ul > li > a, .header-main .gnb .gnb-dropdown-toggle {height:35px; padding:0 0 10px; font-weight:bold; font-size:17px; line-height:20px; text-decoration:none} .header-main .gnb li > .icon-new {vertical-align:-3px} .header-main .gnb li > .icon-premium-pay {margin-left:2px} .header-main .gnb .nav-expand > li > a, .header-main .gnb .nav-expand .gnb-dropdown-toggle {color:#436f91} .header-main .gnb > ul > li > a:hover, .header-main .gnb .gnb-dropdown-toggle:hover, .header-main .gnb .gnb-dropdown:hover .gnb-dropdown-toggle, .header-main .gnb .gnb-dropdown.focus .gnb-dropdown-toggle {border-bottom:4px solid #121212} .header-main .gnb .nav-expand > li > a:hover, .header-main .gnb .nav-expand .gnb-dropdown-toggle:hover, .header-main .gnb .nav-expand .gnb-dropdown:hover .gnb-dropdown-toggle, .header-main .gnb .nav-expand .gnb-dropdown.focus .gnb-dropdown-toggle {border-color:#436f91} .header-main .gnb .gnb-dropdown .gnb-dropdown-toggle::after {vertical-align:-1px} .header-main .gnb .gnb-dropdown .gnb-dropdown-menu::before {content:''; position:absolute; top:-10px; left:0; right:0; height:10px} .header-main .gnb .gnb-dropdown .gnb-dropdown-menu {position:absolute; top:35px; left:-20px; min-width:110px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; text-align:left; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; opacity:0; visibility:hidden; z-index:-1; transform-origin:left top;} .header-main .gnb .gnb-dropdown .gnb-dropdown-menu li {padding:6px 0; font-size:14px; white-space:nowrap} .header-main .gnb .gnb-dropdown .gnb-dropdown-menu ul {padding:10px 20px} .header-main .gnb .gnb-dropdown:hover .gnb-dropdown-menu, .header-main .gnb .gnb-dropdown.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:10; animation:.2s alternate slideDown} .header-main .gnb .gnb-dropdown:hover .gnb-dropdown-toggle::after, .header-main .gnb .gnb-dropdown.focus .gnb-dropdown-toggle::after {position:relative; top:-5px; border-color:transparent transparent #bbb transparent} .header-main .header-banner {position:absolute; top:43px; right:480px} /* 전체메뉴 */ .layer-allmenu {display:none; position:absolute; top:0; left:0; right:0; z-index:1000; border-bottom:1px solid #ddd; font-size:14px; box-shadow:0 5px 30px rgba(0,0,0,.3)} .layer-allmenu::before {content:''; display:block; position:absolute; top:0; left:0; right:0; bottom:0; background:#fff; background:rgba(255,255,255,0.95); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px)} .allmenu-inner {position:relative; max-width:1180px; padding:27px 80px 37px; margin:0 auto; box-sizing:border-box} .allmenu-inner .btn-close-allmenu {display:inline-block; position:absolute; top:66px; left:10px; width:29px; height:28px; background-position:-140px 0} .allmenu-util {margin-bottom:28px; line-height:19px} .allmenu-util .util-menus {float:left} .allmenu-util .util-sns {float:left; padding-left:3px} .allmenu-util .util-sns > a {float:left} .allmenu-util .util-sns > a + a {margin-left:30px} .allmenu-util .util-sns .btn-sns-naver {width:13px; height:12px; margin-top:4px; background-position:0 -62px} .allmenu-util .util-sns .btn-sns-facebook {width:9px; height:17px; margin-top:1px; background-position:-29px -62px} .allmenu-util .util-sns .btn-sns-twitter {width:17px; height:15px; margin-top:3px; background-position:-51px -62px} .allmenu-util .util-sns .btn-sns-google {width:15px; height:15px; margin-top:2px; background-position:-79px -62px} .allmenu-util .util-sns .btn-sns-youtube {width:18px; height:13px; margin-top:4px; background-position:-268px -63px} .allmenu-util .util-menus .user-menu {position:relative; float:left; margin-left:20px; padding-left:21px} .allmenu-util .util-menus .user-menu:before {content:''; display:inline-block; position:absolute; top:4px; left:0; width:1px; height:13px; background:#ddd} .allmenu-util .user-menu > a {float:left; margin-right:20px} .allmenu-util .user-menu > a.login_link:before, .allmenu-util .user-menu > a.user-name:before {content:''; display:inline-block; position:relative; top:1px; width:13px; height:13px; margin-right:5px; background-position:-161px -62px} .allmenu-util .util-links {float:right} .allmenu-util .util-links li {float:left; margin-left:20px} .allmenu-util:after {content:''; display:block; clear:both} .sitemap-wrap img.icon-premium {width:8px; height:11px; margin-left:6px} .sitemap-wrap .service-group > div {box-sizing:border-box} .sitemap-wrap .service-group + .service-group {margin-top:25px; padding-top:27px; border-top:1px solid #ddd} .sitemap-wrap .sv-tit {display:block; font-size:17px} .sitemap-wrap .service-hk .sv-list li {position:relative; min-height:20px; margin-bottom:12px} .sitemap-wrap .service-hk .sv-list li:last-child {margin-bottom:0 !important} .sitemap-wrap .service-hk .service-cate {float:left} .sitemap-wrap .service-hk .service-cate .sv-tit {margin-bottom:16px; padding-bottom:13px; border-bottom:1px solid #ddd; font-size:19px} .sitemap-wrap .service-hk .cate-news {width:160px;} .sitemap-wrap .service-hk .cate-pro {position:relative; width:490px; margin-left:60px} .sitemap-wrap .service-hk .cate-pro .sv-order-tab {position:absolute; top:0; right:0; height:26px; border-radius:4px; background:#f3f3f3} .sitemap-wrap .service-hk .cate-pro .sv-order-tab:after {content:''; display:inline-block; position:absolute; top:0; left:0; width:90px; height:26px; border:1px solid #ddd; background:#fff; border-radius:4px; box-sizing:border-box; transition:all ease-in-out .3s} .sitemap-wrap .service-hk .cate-pro .sv-order-tab > .btn-order {position:relative; z-index:2; float:left; width:90px; height:26px; box-sizing:border-box; font-size:13px; outline:none} .sitemap-wrap .service-hk .cate-pro .sv-order-tab > .btn-order:before {content:''; display:inline-block; width:1px; height:26px; vertical-align:-8px} .sitemap-wrap .service-hk .cate-pro .sv-order-tab.service:after {left:0} .sitemap-wrap .service-hk .cate-pro .sv-order-tab.alphabetical:after {left:90px} .sitemap-wrap .service-hk .cate-pro .order-service .sv-list {float:left} .sitemap-wrap .service-hk .cate-pro .order-service > .sv-list:nth-child(1), .sitemap-wrap .service-hk .cate-pro .order-service > .sv-list:nth-child(2) {width:165px} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap {position:relative; overflow:hidden} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap::before, .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap::after {content:''; position:absolute; top:0; bottom:0; width:1px; background:#eee} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap::before {left:290px} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap::after {left:460px} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap > dl {float:left} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap > dl dt {margin-bottom:10px; font-weight:bold; font-size:17px; color:#5c7bc2} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap > dl .sv-list + .sv-list {margin-left:40px} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap > dl.sv-section-hk {width:310px} .sitemap-wrap .service-hk .cate-pro .order-service .sv-section-wrap > dl.sv-section-finance {width:170px} .sitemap-wrap .service-hk .cate-pro .order-alphabetical .sv-list li {float:left; width:33.33336%} .sitemap-wrap .service-hk .cate-pro .order-service:after, .sitemap-wrap .service-hk .cate-pro .order-service > dl dd:after, .sitemap-wrap .service-hk .cate-pro .order-alphabetical .sv-list:after {content:''; display:block; clear:both} .sitemap-wrap .service-hk .cate-premium {float:right; width:240px; padding:23px 25px; border:1px solid #e5e5e5; border-radius:4px; background:#f3f3f3} .sitemap-wrap .service-hk .cate-premium .sv-tit {margin-bottom:10px} .sitemap-wrap .service-hk .cate-premium .sv-tit:after {content:''; display:inline-block; width:22px; height:18px; margin:1px 0 0 3px; background-position:-103px -62px} .sitemap-wrap .service-hk .cate-premium .btn-mypage {display:inline-block; position:absolute; top:-1px; right:0; height:23px; padding:0 10px 0 8px; border-radius:12px; background:#fff; font-size:12px} .sitemap-wrap .service-hk .cate-premium .btn-mypage:before {content:''; display:inline-block; width:1px; height:23px; vertical-align:-7px} .sitemap-wrap .service-hk .cate-premium.cate-premium-wrap {padding:0; border:none; border-radius:0; background:none} .sitemap-wrap .service-hk .cate-premium.cate-premium-wrap .cate-premium-inner {padding:23px 25px; border:1px solid #e5e5e5; border-radius:4px; background:#f3f3f3} .sitemap-wrap .service-hk .cate-premium .banners {margin-top:10px} .sitemap-wrap .service-hk:after {content:''; display:block; clear:both} .sitemap-wrap .service-rel .service-cate + .service-cate {margin-top:35px} .sitemap-wrap .service-rel .sv-tit {margin-bottom:12px} .sitemap-wrap .service-rel .sv-list li {float:left; margin-right:20px} .sitemap-wrap .service-rel .sv-list:after {content:''; display:block; clear:both} .layer-allmenu.ver2 .allmenu-inner {padding-right:0} .layer-allmenu.ver2 .allmenu-inner .btn-close-allmenu {top:72px} .layer-allmenu.ver2 .sitemap-wrap .service-hk .cate-news {width:130px} .layer-allmenu.ver2 .sitemap-wrap .service-hk .cate-pro {width:590px; margin-left:70px} .layer-allmenu.ver2 .sitemap-wrap .service-hk .service-cate .sv-tit {margin-bottom:28px; border-bottom:3px solid #121212} .layer-allmenu.ver2 .sitemap-wrap .service-hk .cate-premium .sv-tit:after {background:url('https://static.hankyung.com/img/www/w/common/icon-premium.svg') no-repeat 0 0/contain; width:10px; height:13px; margin:0 0 0 5px} .layer-allmenu.ver2 .sitemap-wrap .service-hk .sv-list li {margin-bottom:6px} .layer-allmenu.ver2 .sitemap-wrap .service-hk .cate-premium .sv-list li {margin-bottom:8px} .layer-allmenu.active {display:block} @media only screen and (max-width:1179px) { .layer-allmenu {margin:0} } .layer-allmenu .service-notice {margin-top:15px} .layer-allmenu .service-notice .noti-msg {color:#ee4c4c; font-size:13px} .layer-allmenu .service-notice .noti-msg::before {content:''; display:inline-block; width:21px; height:19px; margin-right:6px; background:url('https://static.hankyung.com/img/common/icon/icon-notice.svg') no-repeat center center/contain; vertical-align:middle} /* 2022개편버전 header (개편 GNB 반영 이후 전체 css 정리) */ /* 전체공통 */ .top-util-area {background:#f7f7f7} .top-util-area .top-util-inner {max-width:1180px; height:32px; margin:0 auto; padding:0 0 0 10px; font-size:13px; box-sizing:border-box} .top-util-area .util-items.lt {float:left} .top-util-area .util-items.rt {float:right} .top-util-area .util-items {display:flex; align-items:center; height:100%; margin:0 -12px} .top-util-area .util-items .item {margin:0 12px} .top-util-area .login-area {position:relative} .top-util-area .login-area .user-name {position:relative; vertical-align:top; font-size:13px; line-height:1.1} .top-util-area .login-area .user-name .icon-myinfo::before {vertical-align:-1px} .top-util-area .login-area .user-name.new::after {content:''; position:absolute; top:-2px; right:-9px; width:7px; height:7px; border-radius:100%; background:#ff0000} .top-util-area .login-area .layer-my {position:absolute; top:25px; right:0; width:300px; border:1px solid #c3c3c3; border-radius:5px; background:#fff; font-size:14px; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; visibility:hidden; transform:scale(.5); z-index:-1; opacity:0; transition:all cubic-bezier(.25, .1, .25, 1.3) .2s} .top-util-area .login-area .layer-my.active {visibility:visible; z-index:9999; transform:scale(1); opacity:1} .top-util-area .layer-my .user-info {padding:25px 19px; text-align:center} .top-util-area .layer-my .user-info .account-info .email {font-size:13px; letter-spacing:0; overflow:visible; white-space:unset; text-overflow:unset; word-break:break-all} .top-util-area .layer-my .btns {margin-top:20px} .top-util-area .layer-my .btns [class^="btn-"] {display:inline-block; width:90px; height:35px; margin:0 3px; border:1px solid #c3c3c3; border-radius:20px; line-height:33px; box-sizing:border-box} .top-util-area .layer-my .subscription-info {padding:25px 19px; border-top:1px solid #ddd} .top-util-area .layer-my .subscription-info .details dt {margin-bottom:10px; font-weight:bold; font-size:15px} .top-util-area .layer-my .subscription-info .details dd {position:relative; margin-top:5px; padding:0 75px 0 7px; line-height:25px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .top-util-area .layer-my .subscription-info .details dd::before {content:'·'; position:absolute; top:0; left:0} .top-util-area .layer-my .subscription-info .details dd .badge-subscribing {position:absolute; top:0; right:0; width:70px; height:25px; border-radius:50rem; background:#f3f3f3; font-size:12px; text-align:center} .top-util-area .layer-my .mypages-area {display:flex; align-items:center; justify-content:center; margin:0 -5px 25px} .top-util-area .layer-my .mypages-area > a {flex:0 0 auto; display:inline-flex; justify-content:center; width:calc(50% - 10px); margin:0 5px; border-radius:10px; background:#ff761b; color:#fff; font-size:14px; line-height:35px; white-space:nowrap} .top-util-area .layer-my .mypages-area > a:only-child {width:calc(100% - 10px)} .top-util-area .layer-my .mypages-area > a.new > span {position:relative} .top-util-area .layer-my .mypages-area > a.new > span::before {content:''; position:absolute; top:8px; left:-11px; width:7px; height:7px; border-radius:100%; background:#ff0000} header.ver2022 .color-primary {color:#ee4c4c !important} header.ver2022 .color-secondary {color:#436f91 !important} header.ver2022 .ellip {white-space:nowrap; text-overflow:ellipsis; overflow:hidden; padding-right:1px} header.ver2022 .promotion-nav-wrap {position:relative; outline:none} header.ver2022 .promotion-nav-wrap .promotion-nav-all {position:absolute; top:-10px; left:0; min-width:180px; border:1px solid #c2c2c2; border-radius:5px; background:#fff; text-align:left; box-shadow:3px 3px 5px rgba(0,0,0,.2); box-sizing:border-box; opacity:0; z-index:-1; visibility:hidden; transition:all ease .2s} header.ver2022 .promotion-nav-wrap .promotion-nav-all ul {padding:10px 20px; text-align:center} header.ver2022 .promotion-nav-wrap .promotion-nav-all li {font-size:14px; white-space:nowrap} header.ver2022 .promotion-nav-wrap .promotion-nav-all li a {display:block; padding:6px 0; font-size:14px; white-space:nowrap; text-align:left} header.ver2022 .promotion-nav-wrap .promotion-nav-all.on {opacity:1; visibility:visible; z-index:10} header.ver2022 .promotion-nav {width:250px; height:35px; overflow:hidden} header.ver2022 .promotion-nav .slick-slide {border:none} header.ver2022 .promotion-nav a {display:inline-block; height:35px; padding:0 2px 10px 0; color:#ee4c4c; font-weight:bold; font-size:17px; line-height:20px; text-decoration:none; box-sizing:border-box; max-width:250px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap} header.ver2022 .search-auto-wrap {display:none; position:absolute; left:0; right:0; z-index:200; padding:5px 0; border:1px solid #ddd; border-top:none; border-radius:0 0 8px 8px; box-sizing:border-box; background:#fff; font-size:13px; max-height:500px; overflow-y:auto} header.ver2022 .search-auto-wrap::-webkit-scrollbar {width:6px} header.ver2022 .search-auto-wrap::-webkit-scrollbar-track {background-color: transparent;} header.ver2022 .search-auto-wrap::-webkit-scrollbar-thumb {border-radius:3px; background-color:rgba(0,0,0,.5)} header.ver2022 .search-auto-wrap::-webkit-scrollbar-button {width: 0; height: 0;} header.ver2022 .search-auto-wrap {scrollbar-width:thin} header.ver2022 .layer-search.auto .search-auto-wrap {display:block} header.ver2022 .layer-search.auto .inp-txt {padding:0 50px 0 15px; border-radius:10px 8px 0 0} header.ver2022 .mn-search .layer-search {display:block; width:80px; z-index:-1; opacity:0; transition:all ease .2s} header.ver2022 .mn-search .layer-search .btn-search {right:15px} header.ver2022 .search-area.active .layer-search {width:340px; top:0; right:-13px; z-index:200; opacity:1} header.ver2022 .autocomplete-result > li > a {display:flex; padding:10px 15px; text-decoration:none} header.ver2022 .autocomplete-result > li > a:hover {background:#f7f7f7} header.ver2022 .autocomplete-result > li mark {background:none} header.ver2022 .autocomplete-result > li.type-stock > a {justify-content:space-between} header.ver2022 .autocomplete-result > li.type-stock > a > span {flex:0 0 auto; white-space:nowrap; text-overflow:ellipsis; overflow:hidden} header.ver2022 .autocomplete-result > li.type-stock .category, header.ver2022 .autocomplete-result > li.type-stock .ko {color:#888; text-align:right} header.ver2022 .autocomplete-result > li.type-stock .code {letter-spacing:0} header.ver2022 .autocomplete-result > li.type-stock > a > .code {width:30%} header.ver2022 .autocomplete-result > li.type-stock > a > .name {width:50%} header.ver2022 .autocomplete-result > li.type-stock > a > .category {width:20%} header.ver2022 .autocomplete-result > li.type-stock mark {color:#ee4c4c} header.ver2022 .autocomplete-result > li.type-stock-global > a > .name {width:40%} header.ver2022 .autocomplete-result > li.type-stock-global > a > .ko {width:60%} header.ver2022 .autocomplete-result > li.type-default mark {color:#436f91} header.ver2022 .gnb-dropdown .gnb-dropdown-toggle::after {display:none !important} header.ver2022 .gnb-dropdown:hover .gnb-dropdown-menu, header.ver2022 .gnb-dropdown.focus .gnb-dropdown-menu {z-index:99999} header.ver2022 .layer-allmenu {border-bottom:1px solid #121212; box-shadow:0 10px 10px rgba(0,0,0,.15)} header.ver2022 .allmenu-util-wrap {position:relative; padding:10px 0; border-bottom:1px solid #e5e5e5} header.ver2022 .allmenu-util {display:flex; justify-content:flex-end; max-width:1180px; margin:0 auto} header.ver2022 .allmenu-util .util-menus, header.ver2022 .allmenu-util .util-links {float:none} header.ver2022 .allmenu-util .util-links {margin-left:20px} header.ver2022 .allmenu-util .util-sns {padding-left:0} header.ver2022 .allmenu-util::after {display:none} header.ver2022 .allmenu-inner {padding:20px 0 40px 5px} header.ver2022 .allmenu-inner .service-hankyung {display:flex; justify-content:space-between} header.ver2022 .allmenu-inner .sv-tit {display:block; margin-bottom:8px; font-size:16px} header.ver2022 .allmenu-inner .sv-tit .sv-tit-in {position:relative} header.ver2022 .allmenu-inner .sv-tit ~ .sv-tit {margin-top:50px} header.ver2022 .allmenu-inner .sv-list > li {font-size:13px} header.ver2022 .allmenu-inner .sv-list > li .sv-rel > li {position:relative; padding:3px 0 0 10px} header.ver2022 .allmenu-inner .sv-list > li .sv-rel > li::before {content:''; position:absolute; left:2px; top:5px; width:5px; height:7px; border-left:1px solid #999; border-bottom:1px solid #999; box-sizing:border-box} header.ver2022 .allmenu-inner .sv-list > li a {position:relative; color:#777} header.ver2022 .allmenu-inner .sv-list > li a:hover {background:#f7f7f7} header.ver2022 .allmenu-inner .sv-list > li .icon-membersonly {margin:0 0 0 5px; font-size:10px; vertical-align:1px} header.ver2022 .allmenu-inner .cate-group {display:flex} header.ver2022 .allmenu-inner .cate-group > ul + ul {margin-left:20px} header.ver2022 .allmenu-inner .service-hankyung .sv-list.premium-menu-list > li {display:flex; align-items:center; justify-content:space-between} header.ver2022 .allmenu-inner .service-hankyung .sv-list.premium-menu-list > li > a {flex:1 1 auto; margin:0; padding-right:6px} header.ver2022 .allmenu-inner .service-hankyung .sv-list.premium-menu-list > li .icon-premium-pay {margin:0; transform:scale(.9)} header.ver2022 .allmenu-inner .service-hankyung .service-premium .sv-tit:after {content:''; display:inline-block; background:url('https://static.hankyung.com/img/www/w/common/icon-premium.svg') no-repeat 0 0/contain; width:10px; height:13px; margin:0 0 0 5px} header.ver2022 .allmenu-inner .btn-close-allmenu {top:-38px; left:5px} header.ver2022 .layer-allmenu .badge-new {position:absolute; top:0; right:-10px; width:6px; height:6px; border-radius:50%; overflow:hidden; background:#ff3b3b; color:transparent; white-space:nowrap} header.ver2022 .allmenu-inner .service-hankyung .sv-list > li > a {display:block; margin:0 -10px; padding:5px 10px; border-radius:5px; text-decoration:none} header.ver2022 .allmenu-inner .service-media .sv-list > li > a {display:inline-block; margin:0 -10px; padding:5px 10px; border-radius:5px; text-decoration:none} header.ver2022 .allmenu-inner .service-media .service-cate {display:flex; align-items:center} header.ver2022 .allmenu-inner .service-media .service-cate + .service-cate {margin-top:10px} header.ver2022 .allmenu-inner .service-media .sv-tit {margin:0; min-width:185px} header.ver2022 .allmenu-inner .service-media .sv-list {display:flex} header.ver2022 .allmenu-inner .service-media .sv-list li + li {margin-left:25px} header.ver2022 .sitemap-wrap .service-group + .service-group {margin-top:15px; padding-top:17px} header.ver2022 .tooltip {position:absolute; top:-32px; right:50%; display:flex; align-items:center; justify-content:center; min-width:110px; height:30px; border-radius:3px; background-color:#121212; color:#fff; white-space:nowrap; transform:translateX(-50%); transition:.2s linear all} header.ver2022 .tooltip::before {content:''; position:absolute; bottom:-5px; left:50%; display:block; margin-left:-2px; border-top:5px solid #121212; border-left:5px solid transparent; border-right:5px solid transparent} header.ver2022 .tooltip .msg {font-size:12px} header.ver2022 .tooltip .btn-close-tooltip {position:relative; width:11px; height:11px; margin-left:8px} header.ver2022 .tooltip .btn-close-tooltip::before, header.ver2022 .tooltip .btn-close-tooltip::after {content:''; position:absolute; left:50%; top:0; width:1px; height:11px; background-color:#fff} header.ver2022 .tooltip .btn-close-tooltip:before {transform:translate(-50%) rotate(45deg)} header.ver2022 .tooltip .btn-close-tooltip:after {transform:translate(-50%) rotate(-45deg)} header.ver2022 .tooltip.hide {opacity:0; visibility:hidden} header.ver2022 .service-list .search-area .tooltip {right:-36px; z-index:201; transform:none} /* 메인 */ .header-main.ver2022 .header-inner .logo {padding-top:28px} .header-main.ver2022 .header-inner .service-area {display:flex; align-items:center; padding:29px 0 0 0} .header-main.ver2022 .header-inner .service-area .service-banner {width:130px; height:50px; overflow:hidden; margin-right:15px} .header-main.ver2022 .gnb > ul > li + li {margin-left:30px} .header-main.ver2022 .gnb .gnb-etc {position:relative; float:left; margin-left:20px; padding-left:21px} .header-main.ver2022 .gnb .gnb-etc::before {content:''; position:absolute; top:3px; left:0; width:1px; height:15px; background:#ddd} .header-main.ver2022 .gnb .gnb-dropdown-toggle.color-primary:hover {border-color:#ee4c4c} .header-main.ver2022 .gnb .gnb-dropdown-toggle.color-secondary:hover {border-color:#436f91} .header-main.ver2022 .gnb .gnb-dropdown-toggle.logo__globalmarket + .gnb-dropdown-menu, .header-main.ver2022 .gnb .gnb-dropdown-toggle.logo__koreamarket + .gnb-dropdown-menu {min-width:150px} .header-main.ver2022 .layer-allmenu {top:155px} /* // 2022개편버전 header (개편 GNB 반영 이후 전체 css 정리) */ /* 2023 설날 제호 */ .header-main.seasonal-20230122-v1 .header-inner::before {content:''; display:block; position:absolute; top:5px; left:232px; width:120px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/20230122/logo-seasonal-v1.gif') no-repeat 50% 50%/contain} .header-main.seasonal-20230122-v2 .header-inner::before {content:''; display:block; position:absolute; top:5px; left:232px; width:120px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/20230122/logo-seasonal-v2.gif') no-repeat 50% 50%/contain} .header-main.seasonal-20230122-v3 .header-inner .logo {padding-top:6px} .header-main.seasonal-20230122-v3 .header-inner .logo .logo-hankyung {width:385px; height:100px; background:url('https://static.hankyung.com/img/logo/seasonal/20230122/logo-seasonal-v3.gif') no-repeat 50% 50%/contain} .header-main.seasonal-20230122-v3 .gnb-wrap {margin-top:25px} .isSticky .header-main.ver2022.seasonal-20230122-v1 .header-inner::before, .isSticky .header-main.ver2022.seasonal-20230122-v2 .header-inner::before {display:none} /* gnb sticky UI */ .isSticky .header-main {position:sticky; top:-1px; z-index:999; height:60px; border-bottom:1px solid #ddd; box-shadow:0 5px 5px rgba(0,0,0,.1); box-sizing:border-box} .isSticky .header-main .top-util-area {display:none} .isSticky .header-main .header-inner .logo {position:absolute; top:0; left:50px; margin:0; padding:0} .isSticky .header-main .header-inner .logo .logo-hankyung {width:54px; height:48px; background:#142c67 url('https://static.hankyung.com/img/logo/logo-short-hk-w.svg') no-repeat 50% 19px/40px 21px; vertical-align:top; box-sizing:border-box} .isSticky .header-main .header-inner .service-area {position:absolute; top:8px; right:0; padding:0} .isSticky .header-main .service-list > li:not(.mn-search) {display:none} .isSticky .header-main .service-list .txt {display:none} .isSticky .header-main .service-list .search-area .tooltip {display:none} .isSticky .header-main .service-list .search-area {right:0} .isSticky .header-main .service-list .search-area .btn-open-search {position:absolute; top:12px; right:12px; width:20px; height:20px; padding:0} .isSticky .header-main .service-list .search-area .btn-open-search::before {top:0} .isSticky .header-main .service-list .search-area .layer-search {right:0} .isSticky .header-main .service-list .search-area .layer-search .inp-txt {height:44px; padding:0 40px 0 14px} .isSticky .header-main .service-list .search-area .layer-search .btn-search {right:12px} .isSticky .header-main .service-list .search-area.active .layer-search {width:220px; right:0} .isSticky .header-main .gnb-wrap {margin:0; padding-top:20px} .isSticky .header-main .gnb {margin-left:105px} .isSticky .header-main .promotion-nav-wrap {visibility:hidden; opacity:0} .isSticky .header-main .layer-allmenu {top:0; padding-top:15px} .isSticky .header-main.ver2022 .header-inner .service-area .service-banner {display:none} .isSticky header.ver2022 .promotion-nav {width:195px} .isSticky header.ver2022 .promotion-nav a {max-width:195px} /* footer */ .foot-inner {max-width:1180px; margin:0 auto} .foot-sitemap {margin-top:20px} .foot-sitemap .foot-inner {padding:26px 0 28px; border-top:1px solid #121212} .foot-sitemap img.icon-premium {width:8px; height:11px; margin-left:6px} .foot-sitemap .service-cate + .service-cate {margin-top:28px} .foot-sitemap .sv-list li {float:left; margin-right:20px; min-height:20px} .foot-sitemap .sv-list li.break {margin-top:8px; clear:both} .foot-sitemap .sv-list li.break ~ li {margin-top:8px} .foot-sitemap .sv-list:after {content:''; display:block; clear:both} .foot-sitemap .service-hankyung .service-cate {position:relative; padding:0 0 0 120px} .foot-sitemap .service-hankyung .service-cate .sv-tit {position:absolute; top:0; left:0; padding:3px 0; font-weight:bold} .foot-sitemap .service-hankyung .service-cate + .service-cate, .foot-sitemap .service-hankyung .service-cate .sv-list + .sv-list {margin-top:10px} .footer-wrap {font-size:14px} .foot-cont {padding:25px 0 60px; border-top:1px solid #c8c8c8} .foot-cont .f-item-group + .f-item-group {margin-top:35px} .foot-cont .f-item-group dt {margin-bottom:5px; font-weight:bold} .foot-cont .f-item > a:before, .foot-cont .f-item > span:before {content:'|'; margin:0 15px 0 11px} .foot-cont .f-item > address {display:inline-block} .foot-cont .hk .f-item > a:first-child:before, .foot-cont .hk .f-item > span:first-child:before, .foot-cont .hk-dotcom .f-item > a:first-child:before, .foot-cont .hk-dotcom .f-item > span:first-child:before {display:none} .foot-cont .f-item + .f-item {margin-top:7px} .foot-cont .hk-family:after {content:''; display:block; clear:both} .foot-cont .hk-family dt, .foot-cont .hk-family dd {float:left} .foot-cont .copyright {margin-bottom:5px; font-weight:bold; letter-spacing:0} .foot-sponsor .foot-inner {padding:16px 0; border-top:1px solid #c8c8c8; text-align:center} .foot-sponsor [class^="f-sponsor"] {display:inline-block; margin:0 38px; background-image:url('https://static.hankyung.com/img/logo/spr-footer-sponsor.svg'); background-repeat:no-repeat; vertical-align:middle} .f-sponsor-samsung {width:81px; height:27px} .f-sponsor-wooribank {width:77px; height:20px; background-position:-110px -2px} .f-sponsor-kbstar {width:120px; height:21px; background-position:-217px -3px} /* [2023.07.20] 반응형 공통푸터 */ .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-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://static.hankyung.com/resource/common/img/footer/footer-sponsor-samsung.svg')} .footer-sponsor-list .f-sponsor-wooribank {width:76px; height:18px; background-image:url('https://static.hankyung.com/resource/common/img/footer/footer-sponsor-wooribank.svg')} .footer-sponsor-list .f-sponsor-kbstar {width:109px; height:18px; background-image:url('https://static.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-infomation .f-row + .f-row {margin-top:25px} .footer-infomation dt {font-weight:bold} .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 .copyright {margin-bottom:5px; font-weight:bold} /* // [2023.07.20] 반응형 공통푸터 */ /* COMMON CLASS */ .txt-num, .txt-date, .txt-en {letter-spacing:0} .txt-num, .txt-date {font-family:Tahoma, sans-serif} .thumb {position:relative; overflow:hidden} .thumb > a {display:block; position:relative; width:100%; height:100%} .thumb img {width:100%; min-height:100%; object-fit:cover; object-position:top} .thumb > .thumb-icon {position:absolute; right:19px; bottom:17px; overflow:hidden; text-indent:-9999px; pointer-events:none; transform-origin:right bottom} .thumb-icon.thumb-vod {width:69px; height:69px; background-position:0 -99px} .thumb-icon.thumb-audio {width:69px; height:69px; background-position:-78px -99px} .thumb-icon.thumb-graph {width:69px; height:69px; background-position:-156px -99px} .thumb-icon.thumb-photo {width:65px; height:53px; background-position:-234px -99px} .thumb-icon.thumb-slide {width:68px; height:57px; background-position:-308px -99px} .major-thumb-news .thumb > .thumb-icon, .nt-thumb-bundle .thumb > .thumb-icon, .nt-thumb-col4 .thumb > .thumb-icon, .series-list .thumb > .thumb-icon {right:14px; bottom:14px; transform:scale(0.55)} .nt-list .thumb > .thumb-icon, .nt-spare-1 .thumb-cont .thumb > .thumb-icon, .nt-thumb-col3 .thumb > .thumb-icon, .nt-spare-2 .news-item > .thumb-cont .thumb > .thumb-icon, .nt-section .thumb-cont .thumb > .thumb-icon {right:14px; bottom:14px; transform:scale(0.8)} .series-list.type-journalist .thumb > .thumb-icon {display:none} .thumb-dim-wrap {position:relative} .thumb-dim-wrap > .news-tit {position:absolute; bottom:25px; left:30px; right:110px; color:#fff;} .thumb-dim-wrap > .news-tit a {color:#fff} .thumb-dim > a:after {content:''; position:absolute; left:0; bottom:0; width:100%; height:100%; background:url('https://static.hankyung.com/img/www/w/common/bg-dimmed.png') repeat-x 0 100%} .series-list .thumb, .news-tmp .thumb, .major-thumb-news .thumb, .video-slide .thumb, .thepen-slide .thumb, /* .today-photo .thumb, .today-photo-slide .thumb, */ .hkgroup .thumb {background:url('https://static.hankyung.com/img/www/w/common/thumb-blank.png') no-repeat center center; background-size:cover} .news-tit, .lead {display:block; display:-webkit-box; text-overflow:clip; overflow:hidden; /*word-break:keep-all;*/ word-wrap:break-word; -webkit-box-orient:vertical} .news-tit, .poll-question, .event-tit, .letter-tit {font-weight:normal} h1.news-tit {font-weight:bold} .news-tit > a:visited, .nt-card-list a:visited, .poll-question a:visited {color:#777 !important} .thumb-dim-wrap > .news-tit a:visited, .event-tit a:visited, .promotion-tit a:visited, .today-photo-expand a:visited {color:#ddd !important} .lead {margin:0; color:#666; font-weight:normal; font-size:14px; line-height:21px} .news-subject {font-size:16px} .rel {max-width:100%; padding-left:15px; border-left:6px solid #ddd} .rel ul {position:relative; top:-2px} .rel ul + ul, .rel li + li {margin-top:6px} .rel .news-tit {max-height:72px; -webkit-line-clamp:3; font-size:19px; line-height:24px} .news-subject, .news-subject a {color:#436f91} .main-component {margin-top:30px} .main-component > .layout-inner {border-top:2px solid #121212} .main-component > .layout-inner:before {content:''; display:block; width:100%; height:1px; margin-top:2px; background-color:#121212} .main-component.bg-type > .layout-inner:before {height:2px; margin:0; border-bottom:1px solid #121212; background:#fff} .main-tit {margin-bottom:12px; padding-top:24px; font-size:20px} .main-tit-wrap .main-tit {display:inline-block} .main-tit-wrap .tit-info-area {display:inline-block; vertical-align:2px} .main-tit-wrap .tit-info-area:before {content:''; display:inline-block; position:relative; top:3px; width:1px; height:15px; margin:0 11px; background-color:#ddd} .main-tit-wrap .tit-info-area .type-btn {display:inline-block; height:25px; padding:0 10px; border-radius:3px; background:#eee; font-size:15px} .main-tit-wrap .tit-info-area .type-btn:before {content:''; display:inline-block; width:1px; height:25px; vertical-align:-7px} .iframe-youtube {position:relative; height:0; padding-bottom:56.25%; /* padding-bottom은 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%} .slick-slide {outline:none} /* 상단 증권 슬라이드 */ .stock-marquee {position:relative; width:1180px; height:40px; margin:0 auto; overflow:hidden; box-sizing:border-box; color:#fff} .stock-marquee:before, .stock-marquee:after {content:''; display:block; position:absolute; top:0; height:40px; z-index:100} .stock-marquee:before {left:0; width:15px; background:-moz-linear-gradient(left, rgba(20,44,103,1) 0%, rgba(20,44,103,0.75) 51%, rgba(20,44,103,0) 100%); background:-webkit-linear-gradient(left, rgba(20,44,103,1) 0%, rgba(20,44,103,0.75) 51%, rgba(20,44,103,0) 100%); background:linear-gradient(to right, rgba(20,44,103,1) 0%, rgba(20,44,103,0.75) 51%, rgba(20,44,103,0) 100%)} .stock-marquee:after {right:0; width:40px; background:-moz-linear-gradient(left, rgba(20,44,103,0) 0%, rgba(20,44,103,0.75) 51%, rgba(20,44,103,1) 100%); background:-webkit-linear-gradient(left, rgba(20,44,103,0) 0%, rgba(20,44,103,0.75) 51%, rgba(20,44,103,1) 100%); background: linear-gradient(to right, rgba(20,44,103,0) 0%, rgba(20,44,103,0.75) 51%, rgba(20,44,103,1) 100%)} .stock-marquee .marquee, .stock-marquee *[class^="marquee"] {display:inline-block; position:absolute; white-space:nowrap} .stock-marquee .stock-item-list {display:inline-block; padding:10px 10px 0 10px} .stock-marquee .stock-item-list li {display:inline-block} .stock-marquee .stock-item-list li + li {margin-left:40px} .stock-marquee .stock-item-list li > a {text-decoration:none; color:#fff} .stock-marquee .name {display:inline-block; margin-right:3px; font-weight:normal; vertical-align:-1px} .stock-marquee .num {display:inline-block; vertical-align:top; letter-spacing:0} .stock-marquee .num:before {content:''; display:inline-block; margin-right:8px} .stock-marquee .rate {margin-left:2px; letter-spacing:0} .stock-marquee .up .num:before {position:relative; top:1px; width:12px; height:11px; background-position:0 -176px} .stock-marquee .down .num:before {width:11px; height:11px; background-position:-22px -176px} .stock-marquee .hold .num:before {position:relative; top:-3px; width:10px; height:3px; background:#888} .stock-marquee-wrap {background:#142c67} .stock-marquee-wrap .stock-marquee .up .num:before {width:10px; height:10px; background-position:-39px -41px} .stock-marquee-wrap .stock-marquee .down .num:before {width:10px; height:10px; background-position:-59px -41px} .stock-marquee-wrap .stock-marquee .hold .num:before {background:#999} /* top영역 외 모듈이 최상단 일 경우 */ #contents > :first-child:not(.main-top-wrap) {margin-top:0} #contents > .main-promotion:first-child {margin-top:20px} #contents > :first-child:not(.mymodul-wrap[style="display:none;"]) + .main-top-wrap.type-2 {margin-top:-10px} /* main top */ .main-top > .layout-inner {padding-top:20px; /*border-top:1px solid #ddd*/} .main-top .thumb {border-radius:10px} .main-top .main-headline > .news-tit {margin-right:5px; letter-spacing:-0.12em; text-align:center; /* -webkit-line-clamp:1 */} .main-top .main-headline > .lead {font-weight:bold; font-size:20px; text-align:center; overflow:visible} .main-top .iframe-youtube {border-radius:10px; overflow:hidden} .main-top-wrap.type-1 .main-top {text-align:center} .main-top-wrap.type-1 .main-top > .layout-inner {/*padding-top:0;*/ border-top:none} /* .main-top-wrap.type-1 .main-headline > .thumb {height:380px} */ .main-top-wrap.type-1 .main-headline > .news-tit {/* max-height:66px; */ margin-top:15px; font-size:42px; text-align:center} .main-top-wrap.type-1 .main-headline > .lead {margin-top:8px} .main-top-wrap.type-1 .main-headline > .rel {display:inline-block; margin-top:19px; text-align:left} .main-top-wrap.type-1 .main-top .rel .news-tit {/* max-height:34px; */ font-size:24px; line-height:1.4} .main-top-wrap.type-1 .major-news.col-2 .col > .news-tit {max-height:114px; font-size:28px; line-height:38px} /* .main-top-wrap.type-1 .major-thumb-news.col-4 .layout-inner {border-color:#121212} */ .main-top-wrap.type-1-2 .main-headline > .thumb {margin-top:15px} .main-top-wrap.type-1-2 .main-headline > .news-tit {/* max-height:66px; */ margin-top:15px; font-size:50px; text-align:center} .main-top-wrap.type-2 .main-top .layout-inner:after {content:''; display:block; clear:both} .main-top-wrap.type-2 .main-headline {float:left; width:780px} .main-top-wrap.type-2 .main-headline > .news-tit {/* max-height:54px; */ margin-bottom:10px; font-size:34px; text-align:center} .main-top-wrap.type-2 .main-headline > .lead {margin-bottom:14px} /* .main-top-wrap.type-2 .main-headline > .thumb {height:320px} */ .main-top-wrap.type-2 .main-headline > .rel {margin-top:20px} .main-top-wrap.type-2 .main-top-major {float:right; width:380px} .main-top-wrap.type-2 .main-top-major li {padding:12px 0 14px} .main-top-wrap.type-2 .main-top-major li + li {border-top:1px solid #ddd} .main-top-wrap.type-2 .main-top-major li:first-child {padding-top:2px} .main-top-wrap.type-2 .main-top-major li:last-child {padding-bottom:0 !important} .main-top-wrap.type-2 .main-top-major .news-subject {display:block; margin-bottom:10px} .main-top-wrap.type-2 .main-top-major .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .main-top-wrap.type-2 .iframe-youtube {margin-bottom:20px} /* .main-top-wrap.type-2 .main-top-major li.main-top-banner {padding:0; border:none} */ .main-top-wrap.type-2-2 .main-headline {text-align:center} .main-top-wrap.type-2-2 .main-headline > .news-tit {margin:10px 0; font-weight:bold} .main-top-wrap.type-2-2 .main-headline > .lead {margin-bottom:0} .main-top-wrap.type-2-2 .main-headline > .rel {display:inline-block; margin-top:14px} .main-top-wrap.type-2-2 .main-headline > .rel ul {text-align:left} .main-top-wrap.type-member .main-top-major {position:sticky; top:0; transition:top .25s ease-in} .main-top-wrap.type-member .main-top-major .main-top-major-tit {display:flex; align-items:center; height:54px; border-top:5px solid #00bbb4; border-bottom:1px solid #ddd; color:#00bbb4; font-weight:bold; font-size:20px} .main-top-wrap.type-member .main-top-major .main-top-major-tit a {display:flex; align-items:center; width:100%; height:100%; color:#00bbb4} .main-top-wrap.type-member .main-top-major li {display:flex; gap:0 10px; align-items:flex-start; min-height:63px} .main-top-wrap.type-member .main-top-major li, .main-top-wrap.type-member .main-top-major li:first-child {padding:20px 0 !important} .main-top-wrap.type-member .main-top-major li .thumb {flex:0 0 auto; width:100px; height:63px} .main-top-wrap.type-member .main-top-major li .thumb > .thumb-icon, .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .thumb > .thumb-icon {right:8px; bottom:8px; transform:scale(0.35)} .main-top-wrap.type-member .main-top-major li .news-tit {margin-top:1px; flex:1 1 auto; width:calc(100% - 110px); -webkit-line-clamp:2; max-height:56px; font-size:19px; line-height:28px} /* .main-top-wrap.type-member .main-headline > .thumb {height:360px; overflow:hidden} */ .main-top-wrap.type-member .main-headline > .txt-cont {display:flex; flex-direction:column; justify-content:center; gap:10px; min-height:115px; padding:10px 0; box-sizing:border-box} .main-top-wrap.type-member .main-headline > .txt-cont .news-tit {font-weight:bold; font-size:34px; line-height:40px; letter-spacing:-0.12em} .main-top-wrap.type-member .main-headline > .txt-cont .lead {font-weight:bold; font-size:18px; line-height:22px; transform:translateY(-2px)} .main-top-wrap.type-member .main-headline .iframe-youtube {margin-bottom:0} .main-top-wrap.type-member .main-headline .iframe-youtube + .txt-cont {justify-content:flex-start; min-height:140px; padding-top:20px} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 {margin-top:0; text-align:left} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .layout-inner {padding-top:0} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 ul {display:flex; flex-wrap:wrap; gap:0 40px; margin:0} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 ul > li {float:none; flex:0 0 auto; align-items:flex-start; width:calc(50% - 20px); min-height:63px; padding:20px 0 0 0; margin:0; box-sizing:border-box} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 ul:not(.txt-news) > li:nth-child(2) ~ li {margin-top:20px} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 ul:after {display:none} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 ul + ul {margin-top:21px; border-top:1px solid #ddd} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item {display:flex; gap:15px; min-height:unset;} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .thumb {flex:0 0 auto; display:block; width:100px; height:63px} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .thumb > a {width:100%; height:100%} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .thumb + .txt-cont {padding:0} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .txt-cont {display:block; flex:1 1 auto; width:calc(100% - 115px); height:auto} .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .txt-cont .news-tit {margin-top:1px; -webkit-line-clamp:2; max-height:56px; font-size:19px; line-height:28px} .main-top-wrap.type-member .main-headline .major-thumb-news ul.txt-news {gap:0 45px} .main-top-wrap.type-member .main-headline .major-thumb-news ul.txt-news > li {width:calc(33.33336% - 30px)} .main-top-wrap.type-member .main-headline .major-thumb-news ul.txt-news > li:nth-child(3) ~ li {margin-top:20px} .main-top-wrap.type-member .main-headline .major-thumb-news ul.txt-news > li .news-item {position:relative} .main-top-wrap.type-member .main-headline .major-thumb-news ul.txt-news > li:not(:nth-child(3n + 1)) .news-item::before {content:''; position:absolute; left:-20px; top:0; width:1px; height:60px; background:#ddd} .main-top-wrap.type-member .main-top-major .icon-membersonly {vertical-align:1px} .main-top-wrap.type-member .main-headline > .rel {transform:translateY(-10px); margin:0 0 16px} .main-top-wrap.type-member .main-top-major.v2 .main-top-major-tit {height:53px} .main-top-wrap.type-member .main-top-major.v2 li {display:flex; flex-direction:column; justify-content:center; height:104px; box-sizing:border-box} .main-top-wrap.type-member .main-top-major.v2 li, .main-top-wrap.type-member .main-top-major.v2 li:first-child {padding:0 !important} .main-top-wrap.type-member .main-top-major.v2 li:last-child {height:auto; padding:10px 0 0 0 !important} .main-top-wrap.type-member .main-top-major.v2 .corner-tit {margin-bottom:2px; font-weight:bold; font-size:14px} .main-top-wrap.type-member .main-top-major.v2 .news-item {display:flex; width:100%; gap:0 10px} .main-top-wrap.type-member .main-top-major.v2 .news-item .news-tit {margin-top:2px} .isSticky .main-top-wrap.type-member .main-top-major {top:60px} .main-top-wrap.type-2-3 .main-headline > .news-tit {margin:10px 0} .main-top-wrap.type-2-3 .hktv-youtube .iframe-youtube {margin:0; border-radius:0} .hktv-youtube {margin-bottom:17px; border-radius:10px; background:#262a52; overflow:hidden} .hktv-youtube .youtube-header {position:relative; height:55px; box-sizing:border-box} .hktv-youtube .youtube-header .youtube-tit {position:absolute; top:50%; left:20px; width:100px; height:18px; background-position:-144px -298px; transform:translateY(-50%)} .hktv-youtube .youtube-header .state-onair {position:absolute; top:50%; right:26px; min-width:82px; height:24px; padding:0 10px; border:1px solid #686a86; box-sizing:border-box; color:#fff; font-size:12px; font-family:Arial, Helvetica, sans-serif; letter-spacing:0; transform:translateY(-50%)} .hktv-youtube .youtube-header .state-onair::before {content:''; display:inline-block; width:7px; height:7px; margin-right:10px; border-radius:50%; background-color:#ff5151; vertical-align:1px} .hktv-youtube .youtube-header .state-onair::after {content:''; display:inline-block; width:1px; height:22px; vertical-align:-7px} .hktv-youtube .youtube-header::after {content:''; display:block; clear:both} .main-top-wrap.type-3 .main-top {text-align:center} .main-top-wrap.type-3 .main-headline > .thumb {/*height:380px;*/ margin-top:15px} .main-top-wrap.type-3 .main-headline > .thumb .thumb-img {display:block; float:left; width:33.33336%} /* .main-top-wrap.type-3 .main-headline > .thumb .thumb-3 {width:396px} */ .main-top-wrap.type-3 .main-headline > .news-tit {/* max-height:66px; */ /* margin-top:11px; */ font-size:50px; text-align:center} .main-top-wrap.type-3 .main-headline > .lead {margin-top:8px} .main-top-wrap.type-3 .main-headline > .rel-col2 {margin-top:19px; text-align:left} .main-top-wrap.type-3 .main-headline > .rel-col2 > .col:first-child {padding-right:20px} .main-top-wrap.type-3 .main-headline > .rel-col2 > .col + .col {padding-left:10px} .main-top-wrap.type-4 .main-top .layout-inner:after {content:''; display:block; clear:both} .main-top-wrap.type-4 .main-headline {float:left; width:780px} .main-top-wrap.type-4 .main-headline > .news-tit {/* max-height:54px; */ margin-bottom:10px; font-size:40px; text-align:center} .main-top-wrap.type-4 .main-headline > .lead {margin-bottom:14px} /* .main-top-wrap.type-4 .main-headline > .thumb {height:320px} */ .main-top-wrap.type-4 .main-headline > .rel {margin-top:20px} .main-top-wrap.type-4 .main-top-major {float:right; width:380px} .main-top-wrap.type-4 .main-top-major li {padding:13px 0 16px} .main-top-wrap.type-4 .main-top-major li + li {border-top:1px solid #ddd} .main-top-wrap.type-4 .main-top-major li:first-child {padding-top:10px} .main-top-wrap.type-4 .main-top-major .news-subject {display:block; margin-bottom:10px} .main-top-wrap.type-4 .main-top-major .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} /* 바로가기 모듈 */ .quick-list-wrap {display:flex; align-items:center; max-width:1180px; padding:10px 10px 0; margin:0 auto -10px; color:#436f91; font-size:14px; box-sizing:border-box} .quick-list-wrap > dt {flex:0 0 auto; width:55px; font-weight:bold} .quick-list-wrap > dd {position:relative; flex:0 0 auto; width:calc(100% - 55px)} .quickSwiper {display:flex; align-items:center; position:relative; padding:0 20px; overflow:hidden} .quickSwiper .swiper-slide {flex:0 0 auto; display:inline-flex; width:auto; padding:10px 0; font-size:13px; line-height:30px; white-space:nowrap; box-sizing:border-box} .quickSwiper .link {display:inline-block; padding:0 15px; border:1px solid #ddd; border-radius:25rem; background:#fff; box-shadow:3px 3px 7px rgba(0,0,0,.05); transition:all ease .2s; color:#436f91} .quickSwiper .link:hover {box-shadow:3px 3px 7px rgb(0 0 0 / 15%)} .quickSwiper .swiper-button-arrow {position:absolute; top:50%; width:20px; height:40px; margin:0; color:transparent; font-size:0; overflow:hidden; transform:translateY(-50%); opacity:1; box-sizing:border-box} .quickSwiper .swiper-button-arrow::before {content:''; display:inline-block; width:6px; height:6px; border-width:4px; border-style:solid} .quickSwiper .swiper-button-prev {left:0; padding-left:5px; background:linear-gradient(90deg, rgba(255,255,255,1) 65%, rgba(255,255,255,0) 100%); text-align:left} .quickSwiper .swiper-button-prev::before {border-color:#121212 transparent transparent #121212; transform:rotate(-45deg) translate(2px, 2px)} .quickSwiper .swiper-button-next {right:0; background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 45%); text-align:right} .quickSwiper .swiper-button-next::before {border-color:#121212 #121212 transparent transparent; transform:rotate(45deg) translate(-2px, 2px)} .quickSwiper .swiper-button-disabled {opacity:0} .quick-list-wrap ~ .main-top-wrap.type-1-2 .main-headline > .news-tit {margin-top:0; padding-top:15px; border-top:1px solid #ddd} .quick-list-wrap ~ .main-top-wrap.type-2:not(.type-2-2):not(.type-2-3) .main-top > .layout-inner, .quick-list-wrap ~ .main-top-wrap.type-3 .main-top > .layout-inner {margin-top:20px; border-top:1px solid #ddd} /* 주요뉴스 */ .major-news {position:relative; margin-top:30px} .major-news .layout-inner {padding:20px 0 0; border-top:1px solid #ddd} .major-news .news-subject {display:inline-block; min-height:22px} .major-news .news-subject + .news-tit {margin-top:3px} .major-news .lead {margin-top:10px} .major-news .col > .news-tit + .rel {margin-top:16px} .major-news .col > .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3; letter-spacing:-0.12em} .major-news .layout-inner + .layout-inner {padding-top:25px; border-top:none} .major-news .col:first-child {padding-right:20px} .major-news.col-2 .col + .col {padding-left:20px} .major-news.col-2:before {content:''; position:absolute; top:20px; bottom:0; left:50%; width:1px; background:#ddd} .major-news.col-2 .col:only-child {display:inline-block; max-width:calc(50% - 25px)} .main-tit + .major-news.col-2:before {top:0} .major-news.col-3 .col + .col {padding:0 20px} .major-news.col-3 .col + .col + .col {padding:0 0 0 20px} .major-news.col-3:before, .major-news.col-3:after {content:''; position:absolute; top:20px; bottom:0; left:50%; width:1px; background:#ddd} .major-news.col-3 .lead {max-height:42px; -webkit-line-clamp:2} .main-tit + .major-news.col-3:before, .main-tit + .major-news.col-3:after {top:0} .major-news.col-3:before {margin-left:-200px} .major-news.col-3:after {margin-left:200px} .major-thumb-news {margin-top:30px} .major-thumb-news .layout-inner {padding:30px 0 0; border-top:1px solid #ddd} .major-thumb-news .thumb {border-radius:10px} .major-thumb-news .news-tit {max-height:102px; -webkit-line-clamp:3} .major-thumb-news.col-2 ul {margin:-10px} .major-thumb-news.col-2 ul > li {float:left; width:580px; margin:10px} .major-thumb-news.col-2 ul:after {content:''; display:block; clear:both} .major-thumb-news.col-2 .news-item {display:table; table-layout:fixed; width:100%; min-height:113px} .major-thumb-news.col-2 .news-item > div {display:table-cell} .major-thumb-news.col-2 .news-item > .thumb {width:180px; height:113px} .major-thumb-news.col-2 .news-item > .thumb > a {height:113px} .major-thumb-news.col-2 .news-item > .txt-cont {height:113px; vertical-align:middle} .major-thumb-news.col-2 .news-item > .thumb + .txt-cont {padding:0 41px 0 15px} .major-thumb-news.col-2 .news-tit {padding-right:1px; font-size:24px; line-height:34px} .major-thumb-news.col-4 ul {margin:0 -10px} .major-thumb-news.col-4 ul > li {float:left; width:280px; margin:0 10px} .major-thumb-news.col-4 ul:after {content:''; display:block; clear:both} .major-thumb-news.col-4 .thumb {width:280px; height:175px} .major-thumb-news.col-4 .news-tit {font-size:24px; line-height:34px} .major-thumb-news.col-4 .thumb + .news-tit {margin-top:11px} .major-thumb-news.type-list {margin-top:30px} .major-thumb-news.type-list .layout-inner {padding-top:0; border:none} .major-thumb-news.type-list ul > li + li {margin-top:20px} .major-thumb-news.type-list .news-item {display:flex; gap:15px} .major-thumb-news.type-list .news-item > .thumb {flex:0 0 auto; width:280px; height:175px} .major-thumb-news.type-list .news-item > .thumb > a {height:100%} .major-thumb-news.type-list .news-item > .txt-cont {flex:1 1 auto; width:calc(100% - 295px); padding-top:17px; text-align:left} .major-thumb-news.type-list .news-tit {padding-right:1px; font-size:24px; line-height:34px} .major-thumb-news.type-list .lead {margin-top:20px; -webkit-line-clamp:2} .major-news-list {margin-top:30px} .major-news-list .layout-inner {padding:30px 0 0; border-top:1px solid #ddd} .major-news-list li + li {margin-top:20px} .major-news-list li:after {content:''; display:block; clear:both} .major-news-list .thumb {float:left; width:180px; height:113px; margin-right:20px; border-radius:10px} .major-news-list .txt-cont {padding-top:6px} .major-news-list .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .major-news-list .lead {max-height:72px; margin-top:10px; line-height:24px; -webkit-line-clamp:3} .main-tit + .major-news, .main-tit + .major-thumb-news {margin-top:0} .main-tit + .major-news .layout-inner, .main-tit + .major-thumb-news .layout-inner {padding-top:0; border-top:none} /* 오피니언 */ /* del */ .opinion-list {height:420px; overflow:hidden} .opinion-list > li {float:left; padding:0 25px; background:#f2eede; box-sizing:border-box} .opinion-list > li + li {margin-left:20px} .opinion-list > li .news-item {display:table-cell; height:inherit; padding-top:25px; box-sizing:border-box} .opinion-list .thumb {width:46px; height:46px; margin-bottom:10px; border-radius:23px} .opinion-list .news-tit, .opinion-list .lead, .opinion-list .news-subject {max-width:230px} .opinion-list .news-tit {max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .opinion-list .news-subject {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .opinion-list .news-subject, .opinion-list .news-subject a {color:#a56c1b} .opinion-list .lead {margin-top:20px} .opinion-list .news-tit + .news-subject {margin-top:3px} .opinion-list .news-subject + .news-tit {margin-top:5px} .opinion-list > li:first-child .thumb {width:66px; height:66px; margin-bottom:11px; border-radius:33px} .opinion-list > li:first-child .lead {/*max-height:168px;*/ margin-top:24px} .opinion-list > .opinion-item-1 {width:280px; height:420px; border-radius:10px 0 0 10px} .opinion-list > .opinion-item-2 {width:580px; height:200px; padding-top:25px} .opinion-list > .opinion-item-2 .news-tit, .opinion-list > .opinion-item-2 .lead, .opinion-list > .opinion-item-2 .news-subject {max-width:530px} /* .opinion-list > .opinion-item-2 .news-tit {max-height:38px; -webkit-line-clamp:1} */ .opinion-list > .opinion-item-2 .lead {max-height:67px} .opinion-list > .opinion-item-3 {width:280px; height:200px; border-radius:0 10px 0 0} .opinion-list > .opinion-item-4 {width:280px; height:200px; margin-top:20px} .opinion-list > .opinion-item-5 {width:280px; height:200px; margin-top:20px} .opinion-list > .opinion-item-6 {width:280px; height:200px; margin-top:20px; border-radius:0 0 10px 0} .opinion-list:after {content:''; display:block; clear:both} /* //del */ .opinion-list-area {position:relative; height:420px; overflow:hidden} .opinion-list-area > li {overflow:hidden; float:left; padding:0 25px; background:#f2eede; box-sizing:border-box} .opinion-list-area > li + li {margin-left:20px} .opinion-list-area > li .news-item {display:table-cell; height:inherit; padding-top:25px; box-sizing:border-box} .opinion-list-area .thumb {width:46px; height:46px; margin-bottom:10px; border-radius:23px} .opinion-list-area .news-tit, .opinion-list-area .lead, .opinion-list-area .news-subject {max-width:230px} .opinion-list-area .news-tit {max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .opinion-list-area .news-subject {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .opinion-list-area .news-subject, .opinion-list-area .news-subject a {color:#a56c1b} .opinion-list-area .lead {margin-top:20px} .opinion-list-area .news-tit + .news-subject {margin-top:3px} .opinion-list-area .news-subject + .news-tit {margin-top:5px} .opinion-list-area > li:first-child .thumb {width:66px; height:66px; margin-bottom:11px; border-radius:33px} .opinion-list-area > li:first-child .lead {/*max-height:168px;*/ margin-top:24px; -webkit-line-clamp:3} .opinion-list-area > .opinion-item-1 {width:280px; height:305px; border-radius:10px 0 0 0} .opinion-list-area > .opinion-item-2, .opinion-list-area > .opinion-item-3 {width:430px; height:200px; padding-top:25px} .opinion-list-area > .opinion-item-2 .news-tit, .opinion-list-area > .opinion-item-3 .news-tit, .opinion-list-area > .opinion-item-2 .lead, .opinion-list-area > .opinion-item-3 .lead, .opinion-list-area > .opinion-item-2 .news-subject, .opinion-list-area > .opinion-item-3 .news-subject {max-width:430px} .opinion-list-area > .opinion-item-2 .lead, .opinion-list-area > .opinion-item-3 .lead {max-height:44px; -webkit-line-clamp:2} .opinion-list-area > .opinion-item-3 {border-radius:0 10px 0 0} .opinion-list-area > .opinion-item-4 {width:280px; height:95px; margin-top:20px; margin-left:0; border-radius:0 0 0 10px; background-color:#f3f3f3;} .opinion .opinion-list-area .news-letter {float:none; left:0; right:auto; min-height:95px} .opinion .opinion-list-area .news-letter-list li:nth-child(1) > a {padding-left:0} .opinion .opinion-list-area .news-letter-list li > a {background-position:170px 100%} .opinion .opinion-list-area .news-letter-list > li:only-child {height:95px} .opinion-list-area > .opinion-item-5, .opinion-list-area > .opinion-item-6, .opinion-list-area > .opinion-item-7 {width:280px; height:200px; margin-top:20px} .opinion-list-area > .opinion-item-7 {border-radius:0 0 10px 0} .opinion-list-area:after {content:''; display:block; clear:both} .opinion .news-letter {position:absolute; right:0; bottom:0; width:280px; min-height:200px} .opinion .news-letter a {display:block; background-color:#f3f3f3; box-sizing:border-box} .opinion .news-letter a:hover {text-decoration:none} .opinion .news-letter .letter-tit {font-size:19px; line-height:28px} .opinion .news-letter .link-apply {display:block; margin-top:3px; color:#436f91; font-weight:bold} .opinion .news-letter-list li + li {margin-top:10px} .opinion .news-letter-list li > a {min-height:95px; padding:22px 0 0 25px; box-sizing:border-box; background-repeat:no-repeat; background-position:193px 100%} .opinion .news-letter-list li:nth-child(1) > a {background-image:url('https://static.hankyung.com/img/www/w/main/2020/bg-letter.png')} .opinion .news-letter-list li:nth-child(2) > a {border-radius:0 0 10px; background-image:url('https://static.hankyung.com/img/www/w/main/2020/bg-letter-lee.png')} .opinion .news-letter-list li:only-child {height:200px; border-radius:0 0 10px 0; background-color:#f3f3f3; overflow:hidden} .opinion .news-letter-list li:only-child a {height:100%} .opinion .news-letter-list .txt {margin:10px 0 55px; color:#666; font-size:14px} .opinion .news-letter .letter-item {text-align:center} .opinion .news-letter .letter-item > a {height:200px; padding-top:27px; border-radius:10px} .opinion .news-letter .letter-item .thumb {margin-bottom:13px} .opinion .news-letter .letter-item .thumb img {width:auto} /* 브리핑 */ .briefing .layout-inner:before {margin-bottom:30px} .audio-news-list:after {content:''; display:block; clear:both} .audio-news {position:relative; float:left; width:380px; height:200px; padding:26px 24px 0; /*border:1px solid #ddd;*/ box-sizing:border-box} .audio-news button {outline:none} .audio-news .news-subject {display:block; margin-bottom:7px} .audio-news .news-tit {height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .audio-news .audio-player {position:absolute; bottom:32px; left:29px; right:29px; height:30px} .audio-news .audio-support {display:none; position:absolute; bottom:32px; left:29px; font-size:15px; line-height:28px} .audio-news .audio-support a {color:#777} .audio-news + .audio-news {margin-left:20px} .audio-news:first-of-type {border-radius:10px 0 0 10px} .audio-news:last-of-type {border-radius:0 10px 10px 0} .audio-player audio {position:absolute; width:1px; height:1px; margin-left:-1px} .audio-player .btn-audio {position:absolute; top:0} .audio-player .btn-audio.play {left:0} .audio-player .btn-audio.mute {right:0} .audio-player .btn-audio {display:inline-block; width:26px; height:28px; vertical-align:middle; text-align:left} .audio-player .btn-audio:before {content:''; display:inline-block} .audio-player .btn-audio.play:before {width:26px; height:28px; background-position:0 0} .audio-player.playing .btn-audio.play:before {width:19px; height:25px; margin:3px 0 0 3px; background-position:-46px 0} .audio-player .btn-audio.mute:before {width:25px; height:19px; margin:3px 0 0 0; background-position:-85px 0} .audio-player.muted .btn-audio.mute:before {width:25px; height:19px; margin:3px 0 0 0; background-position:-130px 0} .audio-player .progress-controls {height:30px; padding:0 40px} .audio-player .progress-bar, .audio-player .progress-time {float:left} .audio-player .progress-bar {position:relative; top:50%; width:140px; height:2px; margin-top:-1px; background-color:#e5e5e5} .progress-bar .progress-bar-played {height:100%; background-color:#121212} .progress-bar .progress-handle {display:inline-block; position:absolute; top:50%; width:16px; height:16px; margin:-8px 0 0 0; border-radius:50%; background:#fff; box-shadow:0 0 3px rgba(0,0,0,0.3); cursor:pointer; outline:none} .progress-bar .progress-handle[style*="99"], .progress-bar .progress-handle[style*="100"] {transform: translateX(-16px)} .audio-player .progress-time {width:100px; color:#777; font-size:15px; line-height:28px; text-align:right; letter-spacing:0} .audio-player .progress-time .time-duration:before {content:'/'; margin-right:4px} @media \0screen { .audio-news .audio-player {display:none} .audio-news .audio-support {display:block} } .briefing.cols-2 .audio-news {width:calc(50% - 10px); height:140px; padding-top:16px} .briefing.cols-2 .audio-news .news-tit {font-size:19px; height:34px; -webkit-line-clamp:1} .briefing.cols-2 .audio-news .audio-player {bottom:20px} .briefing.cols-2 .audio-player .progress-bar {width:calc(100% - 100px)} /* 프로모션 홍보영역 */ .main-promotion {margin:30px auto} .main-promotion > .layout-inner {display:table; table-layout:fixed; height:360px; border-radius:10px; background-color:#121212; box-sizing:border-box} .main-promotion .promotion-tit a {color:#fff} .main-promotion .txt-cont {display:table-cell; width:590px; padding:20px 40px; color:#fff; vertical-align:middle; box-sizing:border-box} .main-promotion .txt-cont .subject {font-size:20px; letter-spacing:0} .main-promotion .txt-cont .promotion-tit {display:block; display:-webkit-box; width:510px; max-height:150px; margin-left:-4px; text-overflow:clip; overflow:hidden; /*word-break:keep-all; word-wrap:break-word;*/ -webkit-box-orient:vertical; -webkit-line-clamp:3; font-size:39px; line-height:50px} .main-promotion .txt-cont .promotion-info {display:block; display:-webkit-box; width:510px; max-height:96px; margin-top:30px; font-size:16px; line-height:24px; text-overflow:clip; overflow:hidden; /*word-break:keep-all; word-wrap:break-word;*/ -webkit-box-orient:vertical; -webkit-line-clamp:4} .main-promotion .thumb-cont {display:table-cell; width:570px; padding:20px 20px 20px 0} .main-promotion .thumb-cont .thumb {width:570px; height:320px} .main-promotion .thumb-cont .thumb > .thumb-icon {bottom:30px} .main-promotion:after {content:''; display:block; clear:both} /* 모바일한경 */ .mobile-hk {margin:30px 0} .mobile-hk .main-tit, .mobile-hk .main-tit-wrap .tit-info-area {position:relative; z-index:5} .mobile-hk {padding-bottom:25px; background:#f3f3f3} .mobile-hk-slide {height:260px; margin:-30px 20px 0; overflow:hidden} .mobile-hk-slide .slick-list {margin:0 ; padding:0 !important; height:300px; overflow:hidden} .mobile-hk-slide .item > a, .mobile-hk-slide .item .thumb {display:inline-block} .mobile-hk-slide .item .page {display:block; margin-bottom:8px} .mobile-hk-slide .item.slick-center {padding-top:60px} .mobile-hk-slide .item.slick-center > a {opacity:1; transform:scale(1.3)} .mobile-hk-slide .item.slick-center .page {transform:scale(0.8)} .mobile-hk-slide .item {padding-top:70px; text-align:center} .mobile-hk-slide .item > a {opacity:0.5; transition:all .2s ease} .mobile-hk-slide .item img {width:96px; height:128px; border:1px solid #ddd; box-sizing:border-box} .mobile-hk-slide .slick-arrow {top:calc(50% + 10px); margin:0} .mobile-hk-slide .slick-arrow.slick-prev {left:0} .mobile-hk-slide .slick-arrow.slick-next {right:0} /* 뉴스 템플릿 */ .news-tmp:after {content:''; display:block; clear:both} .nt-list > .news-item:after {content:''; display:block; clear:both} .nt-list > .news-item + .news-item {margin-top:20px} .nt-list .thumb {float:left; width:280px; height:175px; margin-right:20px; border-radius:10px} .nt-list .news-tit {max-height:102px; padding-top:8px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .nt-list .lead {/*max-height:63px;*/ margin-top:11px; /*-webkit-line-clamp:3*/} /* type: 에디터 PICK */ .nt-editor .thumb-cont {float:left; width:580px} .nt-editor .thumb-cont .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .nt-editor .thumb {width:580px; height:363px; border-radius:10px} .nt-editor .thumb > a:after {background-position:0 60px} .nt-editor .txt-cont {float:right; width:570px; padding-top:15px} .nt-editor .txt-cont li {padding-right:110px} .nt-editor .txt-cont li + li {margin-top:26px} .nt-editor .txt-cont .news-tit {display:block; /*white-space:nowrap; text-overflow:ellipsis;*/ font-size:24px} .nt-editor .txt-cont.row-7 {padding-top:6px} .nt-editor .txt-cont.row-7 li + li {margin-top:20px} /* type: 자동차 */ .nt-headline {display:table; table-layout:fixed; width:100%; padding-top:30px} .nt-headline > div {display:table-cell} .nt-headline .main-tit {display:block} .nt-headline .txt-cont {width:580px; padding-right:20px; text-align:center; vertical-align:middle} .nt-headline .txt-cont .main-tit {padding-top:0} .nt-headline .txt-cont .news-item {padding:0 60px} .nt-headline .txt-cont .news-tit {max-height:150px; font-size:39px; line-height:50px; -webkit-line-clamp:3; letter-spacing:-0.12em} .nt-headline .txt-cont .lead {max-height:85px; margin-top:20px; -webkit-line-clamp:4; text-align:left} .nt-headline .thumb-cont {width:580px} .nt-headline .thumb {width:580px; height:363px; border-radius:10px} /* type: 증권,가상화폐 카드뉴스 */ .nt-card-list {float:right; width:580px} .nt-card-list > ul {position:relative} .nt-card-list > ul::before {content:''; position:absolute; left:0; top:50%; right:0; height:1px; background:#ddd} .nt-card-list > ul::after {content:''; display:block; clear:both} .nt-card-list li {position:relative; float:left; width:280px; height:170px; /*border:1px solid #ddd;*/ box-sizing:border-box} .nt-card-list li:nth-child(2n)::before {content:''; position:absolute; left:0; top:0; bottom:0; width:1px; background:#ddd} .nt-card-list .card1 {border-radius:10px 0 0 0} .nt-card-list .card2 {padding-left:20px; border-radius:0 10px 0 0} .nt-card-list .card3 {margin-top:40px; border-radius:0 0 0 10px} .nt-card-list .card4 {margin-top:40px; padding-left:20px; border-radius:0 0 10px 0} .nt-card-list .news-item {display:table-cell; height:168px; padding:10px 30px; /*vertical-align:middle*/} .nt-card-list .news-tit {width:218px; max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} /* type: 경제, 부동산 */ .nt-section .nt-list {float:left; width:770px} .nt-section .thumb-cont {float:right; width:380px} .nt-section .thumb-cont .thumb {width:380px; height:238px; border-radius:10px} .nt-section .thumb-cont .news-tit {max-height:114px; margin-top:10px; font-size:29px; line-height:38px; -webkit-line-clamp:3} /* type: 정치 */ .nt-thumb-col3 > ul {margin:0 -10px} .nt-thumb-col3 > ul > li {float:left; width:380px; margin:0 10px} .nt-thumb-col3 > ul:after {content:''; display:block; clear:both} .nt-thumb-col3 .thumb {width:380px; height:238px; border-radius:10px} .nt-thumb-col3 .news-tit {max-height:102px; margin-top:10px; font-size:24px; line-height:34px; -webkit-line-clamp:3; text-align:center} /* type: 사회 */ .nt-thumb-bundle > ul {margin:0 -10px} .nt-thumb-bundle > ul > li {float:left; width:280px; margin:0 10px} .nt-thumb-bundle > ul > li + li + li {width:580px} .nt-thumb-bundle > ul:after {content:''; display:block; clear:both} .nt-thumb-bundle .thumb {width:280px; height:175px; border-radius:10px} .nt-thumb-bundle .txt-cont {margin-top:10px} .nt-thumb-bundle .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .nt-thumb-bundle li + li + li .news-item {display:table; table-layout:fixed; width:100%} .nt-thumb-bundle li + li + li .thumb {display:table-cell; width:180px; height:113px} .nt-thumb-bundle li + li + li .thumb > a {height:113px; border-radius:10px; overflow:hidden} .nt-thumb-bundle li + li + li .txt-cont {display:table-cell; margin-top:0; vertical-align:middle} .nt-thumb-bundle li + li + li .thumb + .txt-cont {padding-left:15px} .nt-thumb-bundle li + li + li .news-item + .news-item {margin-top:20px} /* type: 핫이슈 */ .nt-thumb-col4 > ul {margin:0 -10px} .nt-thumb-col4 > ul > li {float:left; width:280px; margin:0 10px} .nt-thumb-col4 > ul:after {content:''; display:block; clear:both} .nt-thumb-col4 .thumb {width:280px; height:175px; border-radius:10px} .nt-thumb-col4 .news-tit {max-height:68px; margin-top:10px; padding-right:10px; font-size:24px; line-height:34px; -webkit-line-clamp:2} /* type: 연예, 스포츠 */ .nt-thubm-dim {position:relative} .nt-thubm-dim .thumb {width:580px; height:363px; border-radius:10px} .nt-thubm-dim .thumb > a:after {background-position:0 60px} .nt-thubm-dim .news-tit {left:25px; max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} /* 뉴스 템플릿 spare 1 */ .nt-spare-1 .thumb-cont {float:left; width:380px} .nt-spare-1 .thumb-cont .thumb {width:380px; height:238px; border-radius:10px} .nt-spare-1 .thumb-cont .news-tit {max-height:114px; margin-top:10px; font-size:29px; line-height:38px; -webkit-line-clamp:3} .nt-spare-1 .txt-cont {float:right; width:760px; padding-top:0} .nt-spare-1 .txt-cont li + li {margin-top:24px} .nt-spare-1 .txt-cont .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .nt-spare-1 > .news-item:after {content:''; display:block; clear:both} .nt-spare-1 > .news-item + .news-item {margin-top:30px; padding-top:30px; border-top:1px solid #ddd} /* 뉴스 템플릿 spare 2 */ .nt-spare-2 > .thumb-cont {float:left; width:580px} .nt-spare-2 > .thumb-cont .thumb {width:580px; height:363px; border-radius:10px} .nt-spare-2 > .thumb-cont .news-tit {max-height:150px; margin-top:17px; font-size:39px; line-height:50px; -webkit-line-clamp:3; letter-spacing:-0.1em; text-align:center} .nt-spare-2 .news-item {float:right; width:580px} .nt-spare-2 .news-item > .thumb-cont {float:left; width:280px; margin-bottom:25px} .nt-spare-2 .news-item > .thumb-cont .thumb {width:280px; height:175px; border-radius:10px} .nt-spare-2 .news-item > .thumb-cont .news-tit {max-height:102px; margin-top:10px; font-size:24px; line-height:34px; -webkit-line-clamp:3} .nt-spare-2 .news-item > .thumb-cont + .thumb-cont {margin-left:20px} .nt-spare-2 .news-item > .txt-cont {clear:both; padding-top:20px; border-top:1px solid #ddd} .nt-spare-2 .news-item > .txt-cont li + li {margin-top:15px} .nt-spare-2 .news-item > .txt-cont .news-tit {max-height:102px; font-size:24px; line-height:34px; -webkit-line-clamp:3} /* 뉴스 템플릿 spare 3 */ .nt-spare-3 > .news-item {float:left; width:380px; margin-left:20px} .nt-spare-3 > .news-item:first-child {margin-left:0} .nt-spare-3 .thumb-cont .thumb {width:380px; height:238px; border-radius:10px} .nt-spare-3 .thumb-cont .news-tit {max-height:76px; margin-top:10px; font-size:29px; line-height:38px; -webkit-line-clamp:2; letter-spacing:-0.1em; text-align:center} .nt-spare-3 .txt-cont li {margin-top:15px; padding-top:10px; border-top:1px solid #ddd} .nt-spare-3 .txt-cont .news-tit {display:table-cell; height:76px; vertical-align:middle} .nt-spare-3 .txt-cont .news-tit > a {display:block; display:-webkit-box; text-overflow:clip; overflow:hidden; word-break:keep-all; word-wrap:break-word; -webkit-box-orient:vertical; width:380px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} /* 뉴스 템플릿 spare 5 */ .nt-spare-5 .thumb {float:left; width:280px; height:175px; margin-right:20px; border-radius:10px} .nt-spare-5 .txt-cont {padding-top:6px} .nt-spare-5 .news-tit {max-height:114px; font-size:29px; line-height:38px; -webkit-line-clamp:3} .nt-spare-5 .lead {max-height:72px; margin-top:20px; line-height:24px; -webkit-line-clamp:3} /* 뉴스 템플릿 spare 6 */ .nt-spare-6 .nt-list {float:right; width:780px} .nt-spare-6 .thumb-cont {float:left; width:380px} .nt-spare-6 .thumb-cont .thumb {width:380px; height:238px; border-radius:10px} .nt-spare-6 .thumb-cont .news-tit {max-height:114px; margin-top:10px; font-size:29px; line-height:38px; -webkit-line-clamp:3} /* 증권 */ .finance .layout-inner:before {margin-bottom:30px} .finance .news-cont > .finance-chart {position:relative; float:left; width:580px} .finance-chart .stock-tab > li {float:left; width:33.33336%; border-top:2px solid #ddd} .finance-chart .stock-tab > li > a, .finance-chart .stock-tab > li > a > span {display:block; text-align:center} .finance-chart .stock-tab > li > a {height:118px; padding-top:23px; text-decoration:none; box-sizing:border-box} .finance-chart .stock-tab > li.on {border-color:#121212} .finance-chart .stock-tab .name {display:block; font-size:16px} .finance-chart .stock-tab .num {display:block; margin-top:3px; font-weight:bold; font-size:20px; letter-spacing:0} .finance-chart .stock-tab .rate {display:inline-block; height:23px; margin-top:4px; padding:0 10px; border-radius:5px; letter-spacing:0} .finance-chart .stock-tab .rate em {margin-left:9px} .finance-chart .stock-tab .rate:after {content:''; display:inline-block; width:1px; height:23px; vertical-align:-6px} .finance-chart .stock-tab .up .rate {background:#ffecec; color:#ff0000} .finance-chart .stock-tab .down .rate {background:#ebf2ff; color:#2175ff} .finance-chart .stock-tab .hold .rate {background:#eee; color:#666} .finance-chart .stock-tab:after {content:''; display:block; clear:both} .finance-chart .chart-area {height:240px; overflow:hidden} .finance-chart .date {position:absolute; top:123px; right:0; color:#888; line-height:30px} .finance-chart .date > span {letter-spacing:0} .finance .news-cont:after {content:''; display:block; clear:both} .finance-video {float:left; width:790px;} .finance-video .video-cont {float:left; width:380px} .finance-video .video-cont .thumb {width:380px; height:215px} .finance-video .video-cont .thumb-dim > a:after {background-position:0 -100px} .finance-video .video-cont:first-child .thumb, .finance-video .video-cont:first-child .iframe-youtube {border-radius:10px 0 0 10px} .finance-video .video-cont:last-child {float:right; margin-left:20px} .finance-video .video-cont:last-child .thumb, .finance-video .video-cont:last-child .iframe-youtube {border-radius:0 10px 10px 0} .finance-video .txt-cont .news-subject {display:block; margin:17px 0 8px; font-size:16px} .finance-video .txt-cont .news-tit {max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .finance-news-box {float:left; width:795px; padding:30px 0; border-radius:10px; box-sizing:border-box} .finance-news-box .logo-globalmarket::before {content:''; display:inline-block; width:111px; height:21px; background:url('https://static.hankyung.com/img/logo/logo-globalmarket.svg') no-repeat 0 0/contain; vertical-align:top} .finance-news-box .major-news.col-2 {margin:0} .finance-news-box .major-news.col-2 .col > .news-tit {max-height:68px; margin-top:10px; line-height:34px; -webkit-line-clamp:2} .finance-news-box .major-news.col-2:before {top:28px} .finance-news-box .major-news.col-2 .col {vertical-align:top} .finance-news-box .major-news.col-2 .col + .col {padding-top:22px} .finance-news-box .major-news.col-2 + .major-news {margin-top:30px; padding-top:30px; border-top:1px solid #ddd} .finance-news-box .major-news.col-2 + .major-news:before {top:56px} .finance-news-box .logo-koreamarket::before {content:''; display:inline-block; width:117px; height:21px; background:url('https://static.hankyung.com/img/logo/logo-koreamarket.svg') no-repeat 0 0/contain; vertical-align:top} /* .finance-news-box .logo-marketpro::before {content:''; display:inline-block; width:99px; height:22px; background:url('https://static.hankyung.com/img/logo/logo-marketpro.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top} */ .finance-stock-table {float:right; width:360px} .stock-table-wrap {position:relative} .stock-table-wrap .stock-table-tit {margin-bottom:6px; padding:0 0 8px; border-bottom:1px solid #ddd; font-size:20px} .stock-table-wrap .trade-date {position:absolute; top:8px; right:0; color:#777; font-size:12px} .stock-table-wrap + .stock-table-wrap {margin-top:19px} .stock-table-wrap.type-tab .stock-table-tit {margin-bottom:0; border-bottom:none} .stock-table-tab {margin-bottom:5px} .stock-table-tab button {float:left; height:40px; border:1px solid #ddd; font-size:16px} .stock-table-tab button::after {content:''; display:inline-block; width:1px; height:38px; vertical-align:-13px} .stock-table-tab button:first-child {border-radius:8px 0 0 8px} .stock-table-tab button:last-child {border-radius:0 8px 8px 0} .stock-table-tab button.on {position:relative; margin:0 -1px; border-color:#121212; background:#fff; font-weight:bold} .stock-table-tab button:first-child.on {margin:0 -1px 0 0} .stock-table-tab button:last-child.on {margin:0 0 0 -1px} .stock-table-tab.tab-2 button {width:50%} .stock-table-tab::after {content:''; display:block; clear:both} .stock-table {width:100%} .stock-table tbody th, .stock-table td {padding:5px 0; font-size:15px; vertical-align:middle} .stock-table tbody th {width:130px; text-align:left; font-weight:normal} .stock-table td {text-align:right; letter-spacing:0} .stock-table .name {display:inline-block; max-width:130px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:16px; padding-right:1px; vertical-align:top} .stock-table .up .change-price, .stock-table .up .change-ratio {color:#ff0000} .stock-table .down .change-price, .stock-table .down .change-ratio {color:#2175ff} .stock-table .hold .change-price, .stock-table .hold .change-ratio {color:#777} .stock-table .change-price::before {content:''; display:inline-block; margin-right:4px} .stock-table .up .change-price::before {width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:9px solid #ff0000; vertical-align:1px} .stock-table .down .change-price::before {width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:9px solid #2175ff; vertical-align:baseline} .stock-table .hold .change-price::before {width:10px; height:4px; background:#777; vertical-align:3px} .finance-news-box.v2 {padding:0} .finance-news-box.v2 + .finance-stock-table .stock-table-wrap + .stock-table-wrap {margin-top:50px} .finance-news-box .logo__koreamarket::before, .finance-news-box .logo__globalmarket::before {width:128px; height:23px; vertical-align:top} .finance-news-box .news-cont {float:left; width:380px} .finance-news-box .news-cont + .news-cont {margin-left:20px} .finance-news-box .news-cont .news-category {margin-bottom:10px} .finance-news-box .news-cont > ul > li + li {margin-top:11px; padding-top:11px; border-top:1px solid #ddd} .finance-news-box .news-cont .thumb {width:380px; height:238px; margin-bottom:11px; border-radius:10px} .finance-news-box .news-cont .news-tit {min-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .finance-news-box.v3 {width:780px; padding:0} .finance-news-box.v3 + .finance-stock-table .stock-table-wrap + .stock-table-wrap {margin-top:35px} .finance-news-box.v3 + .finance-stock-table .stock-table-tab {margin-bottom:10px} .finance-news-box.v3 + .finance-stock-table .stock-table tbody th, .finance-news-box.v3 + .finance-stock-table .stock-table td {padding:7px 0} .finance-news-box.v3 + .finance-stock-table .stock-table-wrap:first-child .stock-table-tit {position:relative; top:-3px; height:30px; padding-bottom:0} .finance-news-box.v3 + .finance-stock-table .stock-table-wrap:first-child .trade-date:first-of-type {top:6px} /* VIDEO */ .video-slide {height:238px; border-radius:10px; overflow:hidden; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -webkit-transform:translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0)} .video-slide .slick-list {margin:0 -10px} .video-slide .news-item {padding:0 10px} .video-slide .news-item .thumb {width:380px; height:238px; border-radius:0} .video-slide .news-item .thumb-dim > a:after {background-position:0 -80px} .video-slide .news-item .news-tit {bottom:20px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .video-slide .news-item .news-tit a {color:#fff} .video-slide .news-subject {position:absolute; top:0; left:0; height:30px; color:#fff; background:rgba(0,0,0,0.5); box-sizing:border-box} .video-slide .news-subject a {display:inline-block; color:#fff; padding:4px 15px 0; outline:none} /* 가상화폐 */ .coin .news-cont > .coin-list {float:left; width:580px; border-right:1px solid #ddd; box-sizing:border-box} .coin .coin-list ul {position:relative} .coin .coin-list ul:before {content:''; display:block; position:absolute; top:111px; left:0; width:100%; height:114px; /*border-top:1px solid #ddd; border-bottom:1px solid #ddd*/} .coin .coin-list li {position:relative; float:left; width:33.33336%; margin:14px 0 5px; /*border-left:1px solid #ddd;*/ text-align:center; box-sizing:border-box} .coin .coin-list li a {display:block; min-height:81px; text-decoration:none} .coin .coin-list .name {display:block; font-size:16px} .coin .coin-list .num {display:block; margin-top:3px; font-weight:bold; font-size:20px; letter-spacing:0} .coin .coin-list .rate {display:inline-block; min-width:70px; height:23px; margin-top:7px; padding:0 10px; border-radius:5px; letter-spacing:0; box-sizing:border-box} .coin .coin-list .rate:after {content:''; display:inline-block; width:1px; height:23px; vertical-align:-6px} .coin .coin-list .up .rate {background:#ffecec; color:#ff0000} .coin .coin-list .down .rate {background:#ebf2ff; color:#2175ff} .coin .coin-list .hold .rate {background:#eee; color:#666} .coin .coin-list li:nth-child(3n + 1) {border-left:none} .coin .coin-list ul:after {content:''; display:block; clear:both} .coin .nt-card-list li {height:120px} .coin .nt-card-list .news-item {height:118px} .coin .news-cont:after {content:''; display:block; clear:both} /* 농산물 지수 */ .kapi .news-cont > .kapi-chart {float:left; width:580px} .kapi-cont .kapi-data {float:left} .kapi-cont .kapi-data > a {display:block; text-decoration:none; text-align:center} .kapi-cont .kapi-data > span, .kapi-cont .kapi-data > a > span {float:left} .kapi-cont .kapi-data .num {display:block; margin-top:10px; font-weight:bold; font-size:26px; letter-spacing:0} .kapi-cont .kapi-data .rate {display:inline-block; min-width:70px; height:23px; margin-top:7px; padding:0 10px; border-radius:5px; letter-spacing:0; box-sizing:border-box} .kapi-cont .kapi-data .rate:after {content:''; display:inline-block; width:1px; height:23px; vertical-align:-6px} .kapi-cont .kapi-data .rate em {margin-left:9px} .kapi-cont .kapi-data .up .rate {background:#ffecec; color:#ff0000} .kapi-cont .kapi-data .down .rate {background:#ebf2ff; color:#2175ff} .kapi-cont .kapi-data .hold .rate {background:#eee; color:#666} .kapi-cont .kapi-data .date {float:left; padding:53px 0 0 10px; color:#888} .kapi-cont .kapi-data .date > span {letter-spacing:0} .kapi-cont .qr-area {float:right} .kapi-cont .qr-area p {float:left; padding-top:29px; line-height:22px} .kapi-cont .qr-area .qr-code {position:relative; top:20px; float:right} .kapi-cont .qr-area .qr-code .img-qr {width:60px; height:60px} .kapi .chart-area {margin-top:10px} .kapi .nt-card-list {margin-top:30px} .kapi .nt-card-list li {height:120px} .kapi .nt-card-list .news-item {height:118px} .kapi .nt-card-list li:nth-child(2n)::before {bottom:5px} .kapi .kapi-cont:after, .kapi .news-cont:after {content:''; display:block; clear:both} /* 한경 기자 코너 */ .series-list {margin:-10px -20px} .series-list li {float:left; width:570px; min-height:113px; margin:10px 20px} .series-list .thumb {float:left; width:180px; height:113px; border-radius:10px} .series-list .txt-cont {overflow:hidden; padding-top:9px} .series-list .news-subject {display:block; margin-bottom:4px} .series-list .news-tit {max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .series-list .thumb + .txt-cont {padding-left:15px} .series-list:after {content:''; display:block; clear:both} .series-list.type-journalist li {min-height:98px} .series-list.type-journalist .thumb {width:50px; height:50px; margin-top:10px; border-radius:25px} .series-list.type-journalist .thumb + .txt-cont {padding-left:10px} .series-list.type-journalist .news-subject {margin-bottom:0} /* The pen */ .thepen-slide {height:280px; overflow:hidden} .thepen-slide .thepen-cont {position:relative; display:table-cell; height:280px; padding:0 450px 0 130px; vertical-align:middle} .thepen-slide .thepen-cont .thumb {position:absolute; top:0; right:130px; width:280px; height:280px; border-radius:140px; background:#f5f7f8} .thepen-slide .thepen-cont .news-tit {width:600px; max-height:100px; margin-left:-4px; font-size:39px; line-height:50px; -webkit-line-clamp:2; letter-spacing:-0.1em} .thepen-slide .thepen-cont .lead {width:600px; max-height:65px; margin-top:20px; -webkit-line-clamp:3} /* 오늘의 포토 */ .today-photo .today-photo-cont {display:table; table-layout:fixed; height:363px; background:#121212; border-radius:10px; overflow:hidden} .today-photo .today-photo-cont > div {display:table-cell} .today-photo .thumb {width:580px} .today-photo .thumb > a {width:580px; height:363px; border-radius:10px 0 0 10px; overflow:hidden} .today-photo .txt-cont {padding:0 60px; vertical-align:middle} .today-photo .txt-cont .info {color:#fff; font-size:16px} .today-photo .txt-cont .subject {display:block; color:#fff; font-size:20px} .today-photo .txt-cont .news-tit {max-height:100px; margin-left:-4px; font-size:39px; line-height:50px; -webkit-line-clamp:2; letter-spacing:-0.1em} .today-photo .news-tit a {display:block; color:#fff} .today-photo .txt-cont .lead {max-height:65px; margin-top:20px; -webkit-line-clamp:3} .today-photo-expand {margin:60px 0 0; padding:10px 0 35px; background:#121212; color:#fff} .today-photo-expand a {color:#fff} .today-photo-expand .main-tit-wrap {width:1180px; margin:0 auto} .today-photo-expand .main-tit-wrap .tit-info-area {margin-left:20px} .today-photo-expand .main-tit-wrap .tit-info-area:before {display:none} .today-photo-slide {height:465px; overflow:hidden} .today-photo-slide .news-item {width:570px; padding:0 5px; opacity:.2} .today-photo-slide .thumb {width:570px; height:369px; border-radius:10px} .today-photo-slide .news-tit {max-height:68px; margin-top:20px; padding:0 50px; font-size:24px; line-height:34px; -webkit-line-clamp:2; text-align:center} .today-photo-slide .slick-current .news-item {opacity:1} .today-photo-slide .slick-prev {left:50%; margin-left:-570px} .today-photo-slide .slick-next {left:50%; right:auto; margin-left:520px} /* 오늘의 투표 */ .poll .main-tit {text-align:center} .poll-cont {position:relative; padding:0 130px} .poll-cont .poll-question {font-size:39px; line-height:50px; letter-spacing:-0.1em; text-align:center} .poll-cont .period {margin-top:20px; color:#436f91; font-weight:bold; font-size:14px; text-align:center} .poll-cont .lead {/*max-height:65px;*/ margin-top:25px; /*-webkit-line-clamp:3*/} .poll-cont .poll-answer {margin-top:20px; padding-right:190px} .poll-cont .poll-answer li {/* font-weight:bold; */ font-size:19px} .poll-cont .poll-answer li + li {margin-top:14px} .poll-cont .btn-poll {display:inline-block; position:absolute; bottom:0; right:130px; height:55px; padding:0 30px; border-radius:8px; background:#436f91; color:#fff; font-size:19px; text-align:center} .poll-cont .btn-poll:after {content:''; display:inline-block; width:1px; height:55px; vertical-align:-20px} /* 섹션뉴스 */ .section-news-group ul {margin:-15px -10px} .section-news-group li {float:left; width:280px; height:290px; margin:15px 10px; overflow:hidden; box-sizing:border-box} .section-news-group .thumb {width:280px; height:175px; border-radius:10px} .section-news-group .news-subject {display:block; margin-top:15px} .section-news-group .news-tit {max-height:68px; margin-top:4px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .section-news-group li.noimg {padding:25px 30px; border-radius:10px; background:#f3f3f3} .section-news-group li.noimg .news-subject {margin-top:0} .section-news-group li.noimg .lead {max-height:115px; margin:20px 10px 0 0; -webkit-line-clamp:5; line-height:23px} .section-news-group ul:after {content:''; display:block; clear:both} .section-news-group.type-col3 li {width:380px; height:350px} .section-news-group.type-col3 .thumb {width:380px; height:238px} .section-news-group.type-col3 li.noimg .lead {max-height:161px; -webkit-line-clamp:7} /* EVENT */ .event-wrap {position:relative; padding:30px 0 0 380px} .event-tit a {color:#fff; outline:none} .event-intro {position:absolute; top:100px; left:6px; width:380px; text-align:center} .event-intro p {font-size:38px; line-height:56px; letter-spacing:-0.12em} .event-slide .slick-list {height:400px; overflow:hidden} .event-slide .event-cont {position:relative; width:380px; height:400px; margin-left:20px; border-radius:10px; overflow:hidden; background:#4e5463; color:#fff} .event-slide .event-cont .thumb {width:380px; height:243px} .event-slide .event-cont .txt-cont {display:table-cell; width:380px; height:76px; text-align:center; vertical-align:middle} .event-slide .event-cont .event-tit {display:block; display:-webkit-box; width:320px; max-height:68px; padding:0 30px; text-overflow:clip; overflow:hidden; word-break:keep-all; word-wrap:break-word; -webkit-box-orient:vertical; font-size:24px; line-height:34px; -webkit-line-clamp:2} .event-slide .event-cont .event-period {position:absolute; left:0; right:0; bottom:40px; height:21px; overflow:hidden; font-size:14px; letter-spacing:0} .event-slide .slick-prev {left:-380px} .event-wrap:hover .slick-arrow {visibility:visible; opacity:1} .event-wrap:after {content:''; display:block; clear:both} .eventhk-wrap .eventhk-slide .slick-list {margin:0 -10px} .eventhk-wrap .eventhk-slide.hover-slide .slick-arrow {margin-top:-80px} .eventhk-slide .item {width:380px; margin:0 10px} .eventhk-slide .thumb {height:243px; border-radius:10px} .eventhk-slide .thumb img {min-height:auto; height:100%; object-position:center} .eventhk-slide .event-period {margin-bottom:8px; color:#777; font-size:13px; letter-spacing:0} .eventhk-slide .txt-cont {padding:15px 10px; text-align:center; box-sizing:border-box} .eventhk-slide .event-tit a {overflow:hidden; display:block; display:-webkit-box; font-weight:700; color:#121212 !important; font-size:24px; max-height:72px; line-height:36px; text-overflow:ellipsis; word-break:break-word; -webkit-line-clamp:2; -webkit-box-orient:vertical} .eventhk-slide .event-badge-end {display:inline-block; margin-left:7px; padding:3px 10px 5px; border-radius:15px; font-size:11px; color:#777; background-color:#f3f3f3; box-sizing:border-box} .alert-wrap {height:61px; margin:60px 0 30px; padding:16px 0 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; overflow:hidden; box-sizing:border-box} .alert-wrap:after {content:''; display:block; clear:both} .alert-wrap .notice, .alert-wrap .notice .main-tit, .alert-wrap .notice-list {float:left} .alert-wrap .notice .main-tit {width:auto; margin-right:20px; padding:0; line-height:25px} .alert-wrap .notice-list {width:455px} .alert-wrap .notice-list .notice-tit {overflow:hidden; font-weight:normal; font-size:14px; white-space:nowrap; text-overflow:ellipsis} .alert-wrap .notice-list .notice-tit:before {content:''; display:inline-block; width:2px; height:2px; margin-right:10px; background-color:#121212; vertical-align:1px} .alert-wrap .notice-list .notice-tit > a {vertical-align:-3px} .alert-wrap .notice-list .notice-tit:only-child {position:relative; top:1px} .alert-wrap .notice-list ~ .notice-list {margin-left:20px} .alert-wrap .alert-link {float:right; margin-top:3px} .alert-wrap .alert-link a {float:left; font-weight:bold; font-size:14px; display:inline-flex; align-items:center} .alert-wrap .alert-link a + a:before {content:''; display:inline-block; width:1px; height:13px; margin:0 13px; background-color:#ddd} .main-fix-banner li {float:left; width:25%; text-align:center} .main-fix-banner li > a {text-decoration:none} .main-fix-banner li > a:before {content:''; display:inline-block; width:175px; height:175px; background-repeat:no-repeat} .main-fix-banner ul:after {content:''; display:block; clear:both} .main-fix-banner .tit {display:block; margin:19px 0 8px; font-size:19px} .main-fix-banner .desc {display:block; color:#436f91; font-size:14px} .main-fix-banner .banner-hkclean > a:before {background-image:url('https://static.hankyung.com/img/www/w/main/2020/fix-banner-hkclean.png')} .main-fix-banner .banner-rpa > a:before {background-image:url('https://static.hankyung.com/img/www/w/main/2020/fix-banner-itedu.png')} .main-fix-banner .banner-hkfin > a:before {background-image:url('https://static.hankyung.com/img/www/w/main/2020/fix-banner-finance.png')} .main-fix-banner .banner-maemul > a:before {background-image:url('https://static.hankyung.com/img/www/w/main/2020/fix-banner-maemul.png')} .main-fix-banner li > a:hover .tit {text-decoration:underline} .main-fix-banner .col2 {padding:0 200px} .main-fix-banner .col2 li.banner-rpa {width:455px} .main-fix-banner .col2 li.banner-maemul {width:325px} .main-fix-banner .col2 li > a {display:table} .main-fix-banner .col2 li > a:before {display:table-cell; width:100px; height:100px; background-size:cover} .main-fix-banner .col2 .txt-area {display:table-cell; padding-left:20px; vertical-align:middle; text-align:left} .main-fix-banner .col2 .tit {margin-top:0} .main-fix-banner .col3 {padding:0 85px} .main-fix-banner .col3 li {width:33.3333%} /* 관계사 */ .hkgroup .layout-inner > div {padding:30px 0} .hkgroup .layout-inner > div + div {border-top:1px solid #ddd} .hkgroup .layout-inner > div:last-of-type {margin-bottom:30px; padding-bottom:0} .hkgroup .layout-inner > div:after {content:''; display:block; clear:both} .hkgroup .hkgroup-tit {float:left} .hkgroup .hkgroup-logo {display:inline-block} .hkgroup .hkgroup-news {float:right; width:980px; padding-left:20px; border-left:1px solid #ddd} .hkgroup .hkgroup-news > div {float:left; margin-left:20px} .hkgroup .hkgroup-news > div:first-child {margin-left:0} .hkgroup .hkgroup-news:after {content:''; display:block; clear:both} .hkgroup .thumb {border-radius:10px} .hkgroup .news-item-headline {width:380px; padding-top:4px} .hkgroup .news-item-headline .news-tit {max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .hkgroup .news-item-headline .lead {max-height:65px; margin-top:20px; -webkit-line-clamp:3} .hkgroup .news-item-thumb {width:280px; min-height:175px} .hkgroup .news-item-thumb .news-tit {left:20px; right:20px; bottom:20px; max-height:56px; font-size:19px; line-height:28px; -webkit-line-clamp:2} .hkgroup .news-item-thumb .thumb {width:280px; height:175px} .hkgroup .news-item-thumb .thumb > a:after {background-position:0 -110px} .hkgroup .news-item-thumb.noimg {border-radius:10px; background:#f3f3f3; text-align:center} /* .hkgroup .news-item-thumb.noimg a {color:#121212} */ .hkgroup .news-item-thumb.noimg:before {content:''; display:inline-block; width:1px; height:175px; vertical-align:-60px} .hkgroup .news-item-thumb.noimg .news-tit {display:inline-block; position:static; max-width:240px; text-align:left} .hkgroup .news-item-thumb.noimg .news-tit > a {display:block; display:-webkit-box; max-height:56px; text-overflow:clip; overflow:hidden; word-break:keep-all; word-wrap:break-word; -webkit-box-orient:vertical; font-size:inherit; line-height:inherit; -webkit-line-clamp:2} .hkgroup .news-item-thumb.big-thumb {width:480px; min-height:300px} .hkgroup .news-item-thumb.big-thumb .thumb {width:480px; height:300px} .hkgroup .news-item-thumb.big-thumb .thumb > a:after {background-position:0 -45px} .hkgroup .news-item-thumb.big-thumb.noimg:before {height:300px; vertical-align:-115px} .hkgroup .news-item-thumb.big-thumb .news-tit {max-width:400px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .hkgroup .news-item-thumb.big-thumb.noimg .news-tit > a {max-height:76px} .hkgroup .news-item {display:table; table-layout:fixed; width:580px} .hkgroup .news-item .thumb {display:table-cell; width:180px; height:113px} .hkgroup .news-item .thumb > a {width:180px; height:113px; overflow:hidden} .hkgroup .news-item .txt-cont {display:table-cell; height:113px; vertical-align:middle} .hkgroup .news-item .news-tit {max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .hkgroup .news-item .thumb + .txt-cont {padding-left:15px} .hkgroup .news-item-list {width:380px} .hkgroup .news-item-list li + li {margin-top:5px} .hkgroup .news-item-list .news-tit {display:block; font-size:19px; white-space:nowrap; text-overflow:ellipsis} .hkgroup .news-item-list .news-tit:before {content:''; display:inline-block; width:2px; height:2px; margin-right:7px; background-color:#121212; vertical-align:6px} .hkgroup .news-item-list.expand {position:relative; top:2px} .hkgroup .news-item-list.expand li + li {margin-top:10px} .hkgroup .hkgroup-kedglobal-en .news-tit {letter-spacing:0} .hkgroup-kedglobal-en .hkgroup-logo {width:117px; height:17px; background:url('https://static.hankyung.com/img/logo/rel/logo-kedglobal.svg') no-repeat 0 0/117px 17px} .hkgroup-tv .hkgroup-logo {width:116px; height:19px; background:url('https://static.hankyung.com/img/logo/rel/logo-hktv.svg') no-repeat 0 0/116px 19px} .hkgroup-magazine .hkgroup-logo {width:98px; height:23px; background:url('https://static.hankyung.com/img/logo/rel/logo-magazine.svg') no-repeat 0 0/98px 23px} .hkgroup-magazine .news-item-list {margin-top:-6px} .hkgroup-marketinsight .hkgroup-logo {width:139px; height:23px; background:url('https://static.hankyung.com/img/logo/rel/logo-marketinsight.svg') no-repeat 0 0/139px 23px} .hkgroup-sgsg .hkgroup-logo {width:76px; height:28px; background:url('https://static.hankyung.com/img/logo/rel/logo-sgsg.svg') no-repeat 0 0/76px 28px} .hkgroup-bloomingbit .hkgroup-logo {width:134px; height:24px; background:url('https://static.hankyung.com/img/logo/rel/logo-bloomingbit.svg') no-repeat 0 0/134px 24px} .hkgroup-tenasia .hkgroup-logo {width:108px; height:20px; background:url('https://static.hankyung.com/img/logo/rel/logo-tenasia.svg') no-repeat 0 0/108px 20px} /* .hkgroup-thefarmer .hkgroup-logo {width:63px; height:22px; background:url('https://static.hankyung.com/img/logo/rel/logo-famers.svg') no-repeat 0 0/63px 22px} */ .hkgroup-thefarmer .hkgroup-logo {width:141px; height:22px; background:url('https://static.hankyung.com/img/logo/rel/logo-agroplus.svg') no-repeat 0 0/141px 22px} .hkgroup-autotimes .hkgroup-logo {width:121px; height:24px; background:url('https://static.hankyung.com/img/logo/rel/logo-autotimes.svg') no-repeat 0 0/121px 24px} .hkgroup-bnt .hkgroup-logo {width:70px; height:23px; background:url('https://static.hankyung.com/img/logo/rel/logo-bntnews.svg') no-repeat 0 0/70px 23px} .hkgroup-gametoc .hkgroup-logo {width:123px; height:25px; background:url('https://static.hankyung.com/img/logo/rel/logo-gametoc.svg') no-repeat 0 0/123px 25px} .hkgroup-kizmom .hkgroup-logo {width:108px; height:24px; background:url('https://static.hankyung.com/img/logo/rel/logo-kizmom.svg') no-repeat 0 0/108px 24px} /* 섹션 태그 뉴스 */ .tag-category {position:relative; height:62px; padding:0 50px 0 70px; border-bottom:1px solid #ddd; overflow:hidden} .tag-category .item + .item {margin-left:55px} .tag-category .tag-txt {display:inline-block; padding:0 10px; font-size:20px; line-height:61px; cursor:pointer} .tag-category .on .tag-txt {color:#436f91; font-weight:bold} .tag-category .on .tag-txt.txt-en {letter-spacing:-0.03em} .tag-category .slick-arrow {position:absolute; top:0; width:50px; height:62px; overflow:hidden; color:transparent; font-size:0; outline:none} .tag-category .slick-arrow:after {content:''; display:inline-block; position:relative; width:11px; height:11px; border-width:1px; border-color:#121212; text-indent:0; transform:rotate(45deg)} .tag-category .slick-prev {left:0} .tag-category .slick-prev:after {border-style:none none solid solid} .tag-category .slick-next {right:0} .tag-category .slick-next:after {border-style:solid solid none none} .tag-category .slick-disabled {visibility:hidden} .tag-news .major-thumb-news.col-2 ul {margin:-12px -10px 0} .tag-news .major-thumb-news.col-2 ul > li {margin:12px 10px} .tag-news .btn-area {position:relative; margin-top:8px; text-align:center} .tag-news .btn-area:before {content:''; display:block; position:absolute; top:50%; left:0; right:0; height:1px; background:#ddd; transform:translateY(-50%)} .tag-news .btn-area .btn-more-tagnews {display:inline-block; position:relative; min-width:110px; height:40px; padding:0 15px; border:1px solid #ddd; border-radius:20px; background:#fff; font-size:14px; line-height:38px; text-align:center; text-decoration:none; box-sizing:border-box; outline:none} .tag-news .btn-area .icon-plus {position:relative; display:inline-block; width:11px; height:11px; margin-left:10px; overflow:hidden} .tag-news .btn-area .icon-plus:before, .tag-news .btn-area .icon-plus:after {content:''; display:inline-block; position:absolute; background:#121212} .tag-news .btn-area .icon-plus:before {top:50%; left:0; width:100%; height:1px; transform:translateY(-50%)} .tag-news .btn-area .icon-plus:after {top:0; left:50%; width:1px; height:100%; transform:translateX(-50%)} /* 랭킹뉴스 */ .ranking-cont:after {content:''; display:block; clear:both} .ranking-cont ol {float:left; width:345px} .ranking-cont ol + ol {margin-left:70px} .ranking-cont li {position:relative; margin-top:15px; padding-left:42px; font-weight:bold} .ranking-cont li .num {position:absolute; top:-6px; left:-2px; font-style:italic; font-size:29px; letter-spacing:-0.09em} .ranking-cont li .news-tit {display:block; height:56px; font-size:19px; line-height:28px; -webkit-line-clamp:2} .ranking-cont li + li {padding-top:15px; border-top:1px solid #ddd} .ranking-cont li + li .num {top:10px} /* 브라우저 지원 안내(lte IE9) */ .browser-support-info {min-width:1180px; background:#16394d} .browser-support-info .layout-inner {position:relative; max-width:1180px; margin:0 auto; padding:17px 0 19px} .browser-support-info .info-txt {float:left; width:800px; color:#fff; font-size:15px; line-height:24px} .browser-support-info .browser-list {float:left; margin-left:10px; padding-top:3px} .browser-support-info .browser-list > a {float:left; width:42px; height:40px} .browser-support-info .browser-list > a + a {margin-left:29px} .browser-support-info .layout-inner:after {content:''; display:block; clear:both} .browser-support-info .btn-close-info {position:absolute; top:25px; right:-10px; width:32px; height:31px} .browser-support-info .btn-close-info:before {content:''; display:inline-block; width:11px; height:11px; margin-left:1px; background-position:-43px -176px} /* 2021.04.19 대한민국 대표브랜드 대상 */ .masterbrand-wrap .main-tit > a {vertical-align:middle} .masterbrand-wrap .logo-masterbrand {display:inline-block; width:87px; height:35px; margin-right:4px; background:url('https://static.hankyung.com/img/logo/logo-masterbrand.svg') no-repeat 0 0/contain; overflow:hidden} .masterbrand-wrap .masterbrand-list .slick-list {margin:0 -10px} .masterbrand-wrap .masterbrand-list .item {width:280px; margin:0 10px} .masterbrand-wrap .masterbrand-list .thumb {width:280px; height:175px; border:1px solid #ddd; border-radius:10px} .masterbrand-wrap .masterbrand-list .thumb > a {display:flex; align-items:center; justify-content:center} .masterbrand-wrap .masterbrand-list .thumb img {width:auto; height:auto; min-height:unset; max-width:100%; max-height:100%; object-fit:contain} .masterbrand-wrap .masterbrand-list .news-tit {max-height:68px; margin-top:10px; padding-right:10px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .masterbrand-wrap .masterbrand-list .news-tit a {outline:none} .masterbrand-wrap .hover-slide .slick-arrow {top:62px; margin:0} /* 2021.06.21 레이디스컵 모듈 */ .ladiescup .main-tit > a {display:inline-block; width:268px; height:26px; background:url('https://static.hankyung.com/img/logo/logo-ladiescup-pc-2023.svg') no-repeat 0 0/contain; vertical-align:top} .ladiescup .period {display:inline-block; padding-top:29px; font-size:13px; vertical-align:top; letter-spacing:0} .ladiescup .period::before {content:'|'; margin:0 10px; color:#ddd} .ladiescup .article-thumb {float:left; width:600px; margin:0 -10px} .ladiescup .article-thumb li {float:left; width:280px; margin:0 10px} .ladiescup .article-thumb .thumb {width:280px; height:175px; border-radius:10px} .ladiescup .article-thumb .news-tit {max-height:68px; margin-top:15px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .ladiescup .article-txt {float:right; width:555px; padding-right:15px} .ladiescup .article-txt li {padding:18px 0} .ladiescup .article-txt li + li {border-top:1px solid #ddd} .ladiescup .article-txt li:first-child {padding-top:4px} .ladiescup .article-txt li:last-child {padding-bottom:0} .ladiescup .article-txt .news-tit {max-height:34px; font-size:24px; line-height:34px; -webkit-line-clamp:1} .ladiescup .news-cont::after {content:''; display:block; clear:both} /* 영상모듈 */ .vod-component .vod-logo-wowtv::before {content:''; display:inline-block; position:relative; top:3px; width:94px; height:16px; background:url('https://static.hankyung.com/img/logo/logo-rel-20210730.svg') no-repeat; transform:scale(1.17); transform-origin:top left; vertical-align:top} .vod-component .vod-logo-globalmarket::before {content:''; display:inline-block; width:128px; height:23px; background:url('https://static.hankyung.com/img/logo/logo-globalmarket.svg') no-repeat 0 0/contain; vertical-align:top} .vod-component .logo__globalmarket::before, .vod-component .logo__koreamarket::before {position:relative; top:1px; width:128px; height:23px} .vod-component .logo__jipconomy::before {position:relative; top:2px; width:66px; height:23px} .vod-component .iframe-youtube {border-radius:10px; overflow:hidden; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -webkit-transform:translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0)} .vod-component .vod-slider.hover-slide .slick-arrow {transform:translateY(30px)} .vod-slider {margin:0 -10px} .vod-slider .item {padding:0 10px} /* CES */ .ces > .layout-inner {background:#e8f1fa} .ces .main-tit {padding-left:50px; padding-right:50px} .ces .news-cont {padding:0 50px 40px} .ces .news-cont .ces-headline {float:left; width:580px} .ces .news-cont .ces-headline .thumb {width:580px; height:363px; border-radius:10px} .ces .news-cont .ces-headline .thumb > a:after {background-position:0 60px} .ces .news-cont .ces-headline .news-tit {right:150px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .ces .news-cont .ces-headline .iframe-youtube {border-radius:10px} .ces .news-cont .ces-major {float:right; width:480px} .ces .news-cont .ces-major li {position:relative} .ces .news-cont .ces-major li + li {margin-top:12px} .ces .news-cont .ces-major .news-item {display:flex;align-items:center; height:113px;width: 100%;} .ces .news-cont .ces-major .news-item > .thumb {flex:0 0 auto; width:180px; height:113px} .ces .news-cont .ces-major .news-item > .thumb > a {height:113px; border-radius:10px; overflow:hidden} .ces .news-cont .ces-major .news-item > .thumb > .thumb-icon {right:14px; bottom:14px; transform:scale(0.55)} .ces .news-cont .ces-major .news-item > .txt-cont {flex:1 0 auto; width:calc(100% - 200px)} .ces .news-cont .ces-major .news-item > .thumb + .txt-cont {margin-left:20px} .ces .news-cont .ces-major .news-tit {position:relative; top:-3px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .ces .news-cont .ces-major .news-item .txt-cont::after {content:''; position:absolute; right:0; bottom:-6px; left:196px; height:1px; background:#ddd} .ces .news-cont .ces-major li:nth-child(1) .txt-cont::after {left:0} .ces .news-cont .ces-major li:nth-child(1) .thumb + .txt-cont::after {left:196px} .ces .news-cont .ces-major li:nth-child(3) .txt-cont::after {bottom:auto; top:-7px; left:0; opacity:1} .ces .news-cont .ces-major li:nth-child(3) .thumb + .txt-cont::after {left:196px; opacity:0} .ces .news-cont::after {content:''; display:block; clear:both} /*.ces.ces-video .news-cont .ces-major li + li {margin-top: 13px} .ces.ces-video .news-cont .ces-major .news-item {height: 100px} .ces.ces-video .news-cont .ces-major .news-item > .thumb {width:159px; height:100px} .ces.ces-video .news-cont .ces-major .news-item > .thumb > a {height: 100px} .ces.ces-video .news-cont .ces-major .news-item > .txt-cont {width:calc(100% - 179px)} .ces.ces-video .news-cont .ces-major .news-item .txt-cont::after {left:175px} .ces.ces-video .news-cont .ces-major li:nth-child(1) .txt-cont::after {left:0} .ces.ces-video .news-cont .ces-major li:nth-child(1) .thumb + .txt-cont::after {left:175px} .ces.ces-video .news-cont .ces-major li:nth-child(3) .thumb + .txt-cont::after {left:175px}*/ .ces.ces-video .ces-headline .news-tit {margin-top:10px} .ces.ces-video .news-cont .ces-major li + li {margin-top:30px} /* 2022.08.04 혁신 스타트업 모듈(슬라이드뉴스유형 공통으로 추가) */ .slide-newsmodule-wrap .main-tit > a {vertical-align:middle} .slide-newsmodule-wrap .slide-newsmodule-list .slick-list {margin:0 -10px} .slide-newsmodule-wrap .slide-newsmodule-list .item {width:280px; margin:0 10px} .slide-newsmodule-wrap .slide-newsmodule-list .thumb {width:280px; height:175px; border:1px solid #ddd; border-radius:10px} .slide-newsmodule-wrap .slide-newsmodule-list .thumb > a {display:flex; align-items:center; justify-content:center} .slide-newsmodule-wrap .slide-newsmodule-list .thumb img {width:auto; height:auto; min-height:unset; max-width:100%; max-height:100%; object-fit:contain} .slide-newsmodule-wrap .slide-newsmodule-list .news-tit {max-height:68px; margin-top:10px; padding-right:10px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .slide-newsmodule-wrap .slide-newsmodule-list .news-tit a {outline:none} .slide-newsmodule-wrap .hover-slide .slick-arrow {top:62px; margin:0} /* 자간조절 24px 글자 적용 */ .main-top-wrap.type-1 .main-top .rel .news-tit, .main-top-wrap.type-2 .main-top-major .news-tit, .main-top-wrap.type-4 .main-top-major .news-tit, .major-news .col > .news-tit, .major-thumb-news.col-2 .news-tit, .major-thumb-news.col-4 .news-tit, .major-news-list .news-tit, .opinion-list .news-tit, .opinion-list-area .news-tit, .audio-news .news-tit, .nt-list .news-tit, .nt-editor .thumb-cont .news-tit, .nt-editor .txt-cont .news-tit, .nt-card-list .news-tit, .nt-card-list .news-tit, .nt-thumb-col3 .news-tit, .nt-thumb-bundle .news-tit, .nt-thumb-col4 .news-tit, .nt-thubm-dim .news-tit, .nt-spare-1 .txt-cont .news-tit, .nt-spare-2 .news-item > .thumb-cont .news-tit, .nt-spare-2 .news-item > .txt-cont .news-tit, .nt-spare-3 .txt-cont .news-tit > a, .video-slide .news-item .news-tit, .series-list .news-tit, .today-photo-slide .news-tit, .section-news-group .news-tit, .event-slide .event-cont .event-tit, .hkgroup .news-tit, .ladiescup .article-thumb .news-tit, .ladiescup .article-txt .news-tit, .finance-news-box .news-cont .news-tit {letter-spacing:-.1em} /* 회원전용 아이콘 크기별 */ .nt-spare-2 > .thumb-cont .news-tit .icon-membersonly, .today-photo .txt-cont .news-tit .icon-membersonly {padding:3px 6px 4px; font-size:15px; vertical-align:7px} /*39*/ .nt-spare-1 .thumb-cont .news-tit .icon-membersonly, .nt-section .thumb-cont .news-tit .icon-membersonly, .main-top-wrap.type-1 .major-news.col-2 .col > .news-tit .icon-membersonly {padding:3px 6px 4px; font-size:13px; vertical-align:5px} /*28,29*/ .major-thumb-news.col-4 .news-tit .icon-membersonly, .major-news .col > .news-tit .icon-membersonly, .main-top-wrap.type-2 .main-top-major .news-tit .icon-membersonly, .major-thumb-news.col-2 .news-tit .icon-membersonly, .nt-spare-1 .txt-cont .news-tit .icon-membersonly, .nt-spare-2 .news-item > .thumb-cont .news-tit .icon-membersonly, .nt-spare-2 .news-item > .txt-cont .news-tit .icon-membersonly, .nt-thumb-col3 .news-tit .icon-membersonly, .nt-thumb-bundle .news-tit .icon-membersonly, .series-list .news-tit .icon-membersonly, .today-photo-slide .news-tit .icon-membersonly {font-size:12px} /*24*/ /* 프리미엄 아이콘 크기별 */ .nt-spare-2 > .thumb-cont .news-tit .icon-premium-txt, .today-photo .txt-cont .news-tit .icon-premium-txt {padding:2px 8px 2px 7px; font-size:15px; vertical-align:7px} /*39*/ .nt-spare-1 .thumb-cont .news-tit .icon-premium-txt, .nt-section .thumb-cont .news-tit .icon-premium-txt, .main-top-wrap.type-1 .major-news.col-2 .col > .news-tit .icon-premium-txt {font-size:13px; padding:2px 6px 2px 7px; vertical-align:6px} /*28,29*/ .major-thumb-news.col-4 .news-tit .icon-premium-txt, .major-news .col > .news-tit .icon-premium-txt, .main-top-wrap.type-2 .main-top-major .news-tit .icon-premium-txt, .major-thumb-news.col-2 .news-tit .icon-premium-txt, .nt-spare-1 .txt-cont .news-tit .icon-premium-txt, .nt-spare-2 .news-item > .thumb-cont .news-tit .icon-premium-txt, .nt-spare-2 .news-item > .txt-cont .news-tit .icon-premium-txt, .nt-thumb-col3 .news-tit .icon-premium-txt, .nt-thumb-bundle .news-tit .icon-premium-txt, .series-list .news-tit .icon-premium-txt, .today-photo-slide .news-tit .icon-premium-txt, .ladiescup .article-txt .news-tit .icon-premium-txt, .finance-news-box .news-cont .icon-premium-txt {font-size:12px; vertical-align:5px} /*24*/ .main-top .main-headline .thumb .icon-premium-txt, .main-top .main-headline .iframe-youtube .icon-premium-txt {position:absolute; top:0; left:0; border-radius:0 0 4px 0; padding:2px 8px 2px 7px; font-size:17px; vertical-align:7px} /* 개인화모듈 */ /* .hover-slide2 .slick-list {overflow:visible} .hover-slide2 .slick-slide {opacity:0} .hover-slide2 .slick-slide.slick-active {opacity:1} */ .hover-slide2 .slick-arrow {position:absolute; top:0; bottom:0; z-index:5; width:30px; overflow:hidden; visibility:hidden; opacity:0; transition:opacity ease .3s; font-size:0; color:transparent; white-space:nowrap} .hover-slide2 .slick-arrow::before {content:''; position:relative; display:inline-block; width:6px; height:6px; border-style:solid; border-width:2px} .hover-slide2 .slick-prev {left:-25px; background:linear-gradient(90deg, rgba(237,239,243,1) 65%, rgba(237,239,243,0) 100%)} .hover-slide2 .slick-prev::before {border-color:#888 transparent transparent #888; transform:rotate(-45deg) translate(6px, 6px)} .hover-slide2 .slick-next {right:-25px; background:linear-gradient(-90deg, rgba(237,239,243,1) 65%, rgba(237,239,243,0) 100%)} .hover-slide2 .slick-next::before {border-color:#888 #888 transparent transparent; transform:rotate(45deg) translate(-4px, 4px); margin-right:4px} .hover-slide2:hover .slick-arrow {visibility:visible; opacity:1} .mymodul-wrap .swiper-button-arrow {position:absolute; top:0; bottom:0; width:20px; height:auto; margin:0; color:transparent; font-size:0; overflow:hidden} .mymodul-wrap .swiper-button-arrow::before, .mymodul-wrap .swiper-button-arrow::after {content:''} .mymodul-wrap .swiper-button-arrow::before {content:''; display:inline-block; width:6px; height:6px; border-width:2px; border-style:solid} .mymodul-wrap .swiper-button-prev {left:0; background:linear-gradient(90deg, rgba(237,239,243,1) 65%, rgba(237,239,243,0) 100%); text-align:left} .mymodul-wrap .swiper-button-prev::before {border-color:#888 transparent transparent #888; transform:rotate(-45deg) translate(2px, 2px)} .mymodul-wrap .swiper-button-next {right:0; background:linear-gradient(-90deg, rgba(237,239,243,1) 65%, rgba(237,239,243,0) 100%); text-align:right} .mymodul-wrap .swiper-button-next::before {border-color:#888 #888 transparent transparent; transform:rotate(45deg) translate(-2px, 2px)} .mymodul-wrap .swiper-button-next.swiper-button-disabled, .mymodul-wrap .swiper-button-prev.swiper-button-disabled {opacity:0} .mymodul-wrap {background:#edeff3} .mymodul-wrap button {outline:none} .mymodul-wrap .mymodul-inner {max-width:1160px; margin:0 auto} .mymodul-wrap .btn-close-mymodul::before {content:''; display:inline-block; width:12px; height:12px; border-radius:100%; background-image:linear-gradient(to bottom, #85878d 0%, #85878d 100%), linear-gradient(to left, #85878d 0%, #85878d 100%); background-size:100% 1px,1px 100%; background-position:center; background-repeat:no-repeat; transform:rotate(45deg)} .mymodul-wrap .info-msg {color:#85878d; font-size:12px} .mymodul-wrap .info-msg a {color:#85878d} .mymodul-wrap .txt-underline {text-decoration:underline} .mymodul-before-login {display:flex; align-items:center; justify-content:center; padding:10px 0} .mymodul-before-login .btn-close-mymodul {margin-left:20px} .mymodul-wrap .loading-spinner {text-align:center} .mymodul-wrap .loading-spinner .spinner {width:50px; height:50px} .mymodul-tabpanel {position:relative} .mymodul-tabpanel .loading-spinner {opacity:0; visibility:hidden; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; display:flex; align-items:center; justify-content:center; background:#edeff3} .mymodul-tabpanel .loading-spinner .spinner {width:50px; height:50px; position:relative; top:-10px} .mymodul-tabpanel .loading-spinner.show {opacity:1; visibility:visible} .mymodul-contents .btn-more-mymodul {position:relative; right:-5px; display:inline-flex; align-items:center; padding:10px} .mymodul-contents .btn-more-mymodul::before {content:''; display:inline-block; width:6px; height:6px; margin-top:-3px; border-right:1px solid #888; border-bottom:1px solid #888; transform:rotate(45deg); vertical-align:top} .mymodul-contents .btn-more-mymodul.on::before {margin-top:5px; transform:rotate(-135deg)} .mymodul-menu {display:flex; align-items:center; justify-content:space-between} .mymodul-menu .mymodul-tab {display:flex; align-items:center; height:40px} .mymodul-menu .mymodul-tab > li + li {margin-left:30px} .mymodul-menu .mymodul-tab .menu {position:relative; font-size:13px} /* .mymodul-menu .mymodul-tab .menu[data-tab="issue"] {position:relative; top:-1px} */ .mymodul-menu .mymodul-tab .btn-set {padding:3px; line-height:1} .mymodul-menu .mymodul-tab > li.on .menu {font-weight:bold; letter-spacing:-.025em} .mymodul-menu .mymodul-tab > li.new .menu::before {content:''; position:absolute; top:-3px; right:-4px; width:5px; height:5px; border-radius:100%; background:#ff0000} .mymodul-wrap .issue-slider .swiper-button-arrow::before {position:absolute; top:10px} .mymodul-wrap .issue-slider .swiper-button-prev::before {left:5px} .mymodul-wrap .issue-slider .swiper-button-next {width:30px} .mymodul-wrap .issue-slider .swiper-button-next::before {right:5px} .mymodul-tabpanel {position:relative; height:0; transition:height ease-in-out .5s; overflow:hidden; margin:0 -60px; padding:0 60px} .mymodul-tabpanel .tabpanel {opacity:0; visibility:hidden; position:absolute; top:0; z-index:-1; transition:opacity ease-in .3s .1s, visibility ease-in .3s .1s; width:1160px; box-sizing:border-box} .mymodul-tabpanel .tabpanel.active {opacity:1; visibility:visible; position:static} .mymodul-tabpanel .tabpanel.tab-issue {visibility:visible} .mymodul-tabpanel .slick-arrow {width:60px} .mymodul-tabpanel .slick-prev {left:-55px; text-align:right} .mymodul-tabpanel .slick-prev::before {margin-right:13px} .mymodul-tabpanel .slick-next {right:-55px; text-align:left} .mymodul-tabpanel .slick-next::before {margin-left:10px} .mymodul-tabpanel:hover .slick-arrow {visibility:visible; opacity:1} /* .mymodul-tabpanel .tabpanel.fade {animation:fadeInOut .8s ease-in-out forwards} @keyframes fadeInOut{0%{opacity:1}to{opacity:0}} */ /* .mymodul-tabpanel .tab-mystock {min-height:105px} */ .mymodul-tabpanel .info-msg {min-height:45px; padding-top:10px; box-sizing:border-box} .mymodul-tabpanel .info-msg .txt-underline {margin-left:10px} .mymodul-tabpanel .mystock-group-wrap ~ .info-msg {display:flex; align-items:center; height:82px; padding-top:5px; padding-bottom:10px} .mynews-slider-wrap {height:90px; margin:0 -60px; padding:0 60px 15px; overflow:hidden} .mynews-slider {margin:0 -5px} .mynews-slider .slick-slide {margin:0 5px} .mynews-slider .item {height:90px; padding:12px 15px; border:1px solid #ddd; border-radius:10px; background:#fff; box-sizing:border-box} .mynews-slider .item .journalist-profile {margin-bottom:10px; font-size:13px} .mynews-slider .item .journalist-profile .name {font-weight:bold} .mynews-slider .item .news-tit {max-height:38px; -webkit-line-clamp:2; font-size:13px; line-height:19px} .mystock-group-wrap {margin:0 -20px} .mystock-group-slider {flex:1 1 auto; display:flex; align-items:center; position:relative; padding:0 20px; overflow:hidden} .mystock-group-slider .swiper-wrapper {margin:0 -10px} .mystock-group-slider .swiper-slide {width:auto} .mystock-group-slider .swiper-button-arrow::before {position:absolute; top:8px} .mystock-group-slider .swiper-button-prev::before {left:5px} .mystock-group-slider .swiper-button-next {width:30px} .mystock-group-slider .swiper-button-next::before {right:5px} .mystock-group-slider .btn-group {display:inline-block; margin:0 10px; border-radius:25rem; color:#888; font-size:12px; line-height:23px; vertical-align:top} .mystock-group-slider .on .btn-group {padding:0 10px; background:#fff; color:#121212} .mystock-slider-wrap {height:60px; margin:0 -30px; padding:7px 30px 15px; overflow:hidden} .mystock-slider {margin:0 -5px} .mystock-slider .slick-slide {margin:0 5px} .mystock-slider .item {display:flex; justify-content:space-between; height:60px; padding:12px 15px; border-radius:10px; box-sizing:border-box; color:#fff; text-decoration:none; font-size:13px} .mystock-slider .item.up {background:#ff0000} .mystock-slider .item.down {background:#237bfb} .mystock-slider .item.hold {background:#888} .mystock-slider .item .name {display:block; display:-webkit-box; text-overflow:clip; overflow:hidden; word-wrap:break-word; -webkit-box-orient:vertical; max-height:34px; -webkit-line-clamp:2; word-break:break-all; line-height:17px} .mystock-slider .item .stock-nums {flex:0 0 auto; margin-left:10px; text-align:right} .mymodul-tabpanel .issue-slider {display:flex; align-items:center; position:relative; padding:0 20px; overflow:hidden} .mymodul-tabpanel .issue-slider .swiper-wrapper {margin:0 -5px} .mymodul-tabpanel .issue-slider .swiper-slide {width:auto; padding-bottom:7px} .quick-list {min-height:45px; margin:0 -20px} .quick-list .link {display:inline-block; margin:0 5px; padding:0 15px; border:1px solid #ddd; border-radius:25rem; background:#fff; box-shadow:3px 3px 7px rgba(0,0,0,.05); transition:all ease .2s; font-size:13px; line-height:30px} .quick-list .link:hover {box-shadow:3px 3px 7px rgb(0 0 0 / 15%)} /* 2022.11.17 공통모달 추가 */ /* modal */ .hk-modal {display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999999; align-items:center; justify-content:center; background:rgba(0,0,0,.5)} .hk-modal.show {display:flex} .hk-modal-inner {position:relative; padding:40px 30px 30px; border-radius:10px; box-shadow:3px 3px 7px rgba(0,0,0,.05); background:#fff; box-sizing:border-box} .modal-btn-close {position:absolute; top:20px; right:20px} .modal-btn-confirm {background-color:#ff761b; color:#fff} .modal-btn-cancel {background-color:#666; color:#fff} .modal-btn-outline {display:inline-flex; align-items:center; box-sizing:border-box; justify-content:center; min-width:70px; padding:0 10px; margin:0 3px; border:1px solid #ddd; border-radius:5px; line-height:30px; font-size:14px} .modal-btn-outline.color-primary {color:#ff761b} .hk-modal-footer {display:flex; align-items:center; justify-content:space-between; padding-top:25px; text-align:center} .hk-modal-footer [class^="modal-btn-"] {flex:0 0 auto; width:calc(50% - 5px); display:inline-flex; align-items:center; box-sizing:border-box; justify-content:center; height:40px; border-radius:10px; font-size:16px; text-decoration:none} .hk-modal-footer [class^="modal-btn-"]:only-child {width:100%} .modal-alert .hk-modal-inner {width:380px} .modal-alert .msg {font-size:18px; line-height:28px; text-align:center} /* [2022.11.17] 마켓프로 투자스쿨 모듈 */ @font-face { font-family: 'Bitgoeul_Light'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_seven@1.2/Bitgoeul_Light.woff') format('woff'); font-weight: normal; font-style: normal; } .marketpro-school .date-color1 .thumb {background-color:#ecf8fa} .marketpro-school .date-color1 .thumb span {background-color:#46a9b9} .marketpro-school .date-color2 .thumb {background-color:#f7f5fc} .marketpro-school .date-color2 .thumb span {background-color:#432595} .marketpro-school .date-color3 .thumb {background-color:#fdf2f9} .marketpro-school .date-color3 .thumb span {background-color:#be4c91} .marketpro-school .date-color4 .thumb {background-color:#f0f4f9} .marketpro-school .date-color4 .thumb span {background-color:#6096d4} .marketpro-school .date-color5 .thumb {background-color:#f8fbe6} .marketpro-school .date-color5 .thumb span {background-color:#adbe4c} .marketpro-school .date-color6 .thumb {background-color:#fcf4ef} .marketpro-school .date-color6 .thumb span {background-color:#e97e36} .marketpro-school .date-color7 .thumb {background-color:#e8eef7} .marketpro-school .date-color7 .thumb span {background-color:#25447e} .marketpro-school .date-color8 .thumb {background-color:#f9f0fe} .marketpro-school .date-color8 .thumb span {background-color:#bf74ea} .marketpro-school .date-color9 .thumb {background-color:#fffbeb} .marketpro-school .date-color9 .thumb span {background-color:#ffd93f} .marketpro-school .layout-inner {background-color:#f7fcfd} .marketpro-school .main-tit {position:relative; padding-left:30px} .marketpro-school .main-tit > a {display:inline-block; text-decoration:none; vertical-align:middle} .marketpro-school .main-tit .logo {line-height:1;} .marketpro-school .main-tit em {display:inline-block; width:85px; height:24px; background:url('//static.hankyung.com/img/logo/logo-investingschool.svg') no-repeat 0 0/contain; vertical-align:top} .marketpro-school .main-tit strong {display:inline-block; font-family:'Bitgoeul_Light'; font-size:22px; color:#00089b; letter-spacing:0; vertical-align:middle} .marketpro-school .logo__marketpro::before {width:160px; height:33px} .marketpro-school .icon-membersonly2 {width:13px; height:15px; margin-left:0; vertical-align:2px} .marketpro-school .investing-txt {display:block; margin-bottom:20px} .marketpro-school .investing-cont {padding:0 30px 45px; box-sizing:border-box} .marketpro-school .hover-slide .slick-arrow {top:43%} .marketpro-school .investing-program-slide {display:flex; height:334px; overflow:hidden} .marketpro-school .investing-program-slide .item {overflow:hidden; position:relative; flex:0 0 auto; width:240px; height:334px; margin:0 8px; border-radius:10px; border:1px solid #d3d3d3; box-sizing:border-box; background-color:#fff} .marketpro-school .badge-date {z-index:9; display:inline-block; position:absolute; top:0; left:0; padding:3px 8px 5px; border-bottom-right-radius:10px; font-weight:700; color:#fff; font-size:15px; letter-spacing:0; box-sizing:border-box;} .marketpro-school .item.upload .badge-date {background-color:#00119f} .marketpro-school .item.ready .badge-date {background-color:#b3b3b3} .marketpro-school .thumb {display:flex; align-items:center; justify-content:center; width:100%; height:200px} .marketpro-school .thumb a, .marketpro-school .thumb span {display:block} .marketpro-school .thumb a::after {display:none} .marketpro-school .thumb button {width:100%; height:100%} .marketpro-school .thumb span {overflow:hidden; width:190px; height:190px; border-radius:50%} .marketpro-school .thumb img {width:100%; height:100%; object-fit:cover; object-position:center 10px} .marketpro-school .txt-cont {padding:15px 15px 15px 25px; border-top:1px solid #e4e4e4; box-sizing:border-box; background-color:#fff} .marketpro-school .lecture-category {display:-webkit-box; overflow:hidden; height:56px; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical} .marketpro-school .lecture-category > a, .marketpro-school .lecture-category > span {display:block; font-weight:700; font-size:20px; line-height:28px; text-align:left} .marketpro-school .speaker-info {display:flex; justify-content:space-between; align-items:center; margin-top:10px} .marketpro-school .item.ready .speaker-info {margin-top:15px} .marketpro-school .speaker-name {font-size:15px} .marketpro-school .speaker-name .name {color:#00109e} .marketpro-school .speaker-name .comp {color:#777} .marketpro-school .badge-state .play {display:block; width:35px; height:35px; background:url('https://static.hankyung.com/img/www/w/marketpro/investingschool/icon-play.png') no-repeat center/contain} .marketpro-school .badge-state .ready {display:inline-block; width:60px; padding:2px 5px; border:1px solid #888; border-radius:15px; line-height:1.5; color:#000; font-weight:700; font-size:14px; text-align:center; box-sizing:border-box} .marketpro-school .top-sub-txt {position:absolute; top:30px; right:30px; font-weight:500; color:#777; font-size:15px} /* [2023.06.15] 아르떼 모듈 추가 */ .logo__arte::before {content:''; display:inline-block; width:86px; height:33px; background:url('https://static.hankyung.com/resource/common/img/logo/logo-arte.svg') no-repeat 0 0/contain} .main-arte {padding:32px 0 40px; background:#f5f3ec} .main-arte:not(:first-child) {margin-top:30px} .main-arte .major-thumb-news {margin-top:12px} .main-component.arte > .layout-inner {background:#f5f3ec} .main-component.arte .main-tit {display:flex; align-items:center; gap:15px; padding-left:50px; padding-right:50px} .main-component.arte .main-tit .desc {color:#666; font-size:14px} .main-component.arte .news-cont {padding:0 50px 40px} .main-component.arte .news-cont .arte-headline {float:left; width:580px} .main-component.arte .news-cont .arte-headline .thumb {width:580px; height:363px; border-radius:10px} .main-component.arte .news-cont .arte-headline .thumb > a:after {background-position:0 60px} .main-component.arte .news-cont .arte-headline .news-tit {right:150px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .main-component.arte .news-cont .arte-headline .iframe-youtube {border-radius:10px} .main-component.arte .news-cont .arte-major {float:right; width:480px} .main-component.arte .news-cont .arte-major li {position:relative} .main-component.arte .news-cont .arte-major li + li {margin-top:12px} .main-component.arte .news-cont .arte-major .news-item {display:flex;align-items:center; height:113px;width: 100%;} .main-component.arte .news-cont .arte-major .news-item > .thumb {flex:0 0 auto; width:180px; height:113px} .main-component.arte .news-cont .arte-major .news-item > .thumb > a {height:113px; border-radius:10px; overflow:hidden} .main-component.arte .news-cont .arte-major .news-item > .thumb > .thumb-icon {right:14px; bottom:14px; transform:scale(0.55)} .main-component.arte .news-cont .arte-major .news-item > .txt-cont {flex:1 0 auto; width:calc(100% - 200px)} .main-component.arte .news-cont .arte-major .news-item > .thumb + .txt-cont {margin-left:20px} .main-component.arte .news-cont .arte-major .news-tit {position:relative; top:-3px; max-height:68px; font-size:24px; line-height:34px; -webkit-line-clamp:2} .main-component.arte .news-cont .arte-major .news-item .txt-cont::after {content:''; position:absolute; right:0; bottom:-6px; left:196px; height:1px; background:#ddd} .main-component.arte .news-cont .arte-major li:nth-child(1) .txt-cont::after {left:0} .main-component.arte .news-cont .arte-major li:nth-child(1) .thumb + .txt-cont::after {left:196px} .main-component.arte .news-cont .arte-major li:nth-child(3) .txt-cont::after {bottom:auto; top:-7px; left:0; opacity:1} .main-component.arte .news-cont .arte-major li:nth-child(3) .thumb + .txt-cont::after {left:196px; opacity:0} .main-component.arte .news-cont::after {content:''; display:block; clear:both} /* 디바이스별 */ @media all and (max-width:1220px) { .btn-top-wrap .btn-position {right:-540px} } /* 맥 사파리 대응 */ @supports (-webkit-backdrop-filter: blur(1px)) { .icon-new {position:relative; top:1px} .gnb ul + ul:before {top:0} .rel ul {top:0} .rel ul + ul, .rel li + li {margin-top:8px} .stock-marquee .stock-item-list {padding-top:12px} .main-top-wrap.type-2 .main-top-major li {padding:13px 0} /* .main-top-wrap.type-2 .main-top-major li:first-child {padding-top:2px} .main-top-wrap.type-2 .main-top-major li:last-child {padding-bottom:0} */ .main-top-wrap.type-member .main-headline .major-thumb-news.col-2 .news-item > .txt-cont .news-tit, .main-top-wrap.type-member .main-top-major li .news-tit {transform:translateY(4px)} .main-top-wrap.type-4 .main-top-major li {padding:20px 0 15px} .nt-editor .txt-cont {padding-top:20px} .nt-spare-3 .txt-cont li {padding-top:19px} .video-slide .news-subject a {padding-top:5px} .coin .coin-list li {margin-top:18px} .coin .coin-list li a {min-height:76px} .hkgroup .news-item-list li + li {margin-top:8px} .hkgroup .news-item-list.expand li + li {margin-top:14px} .hkgroup-magazine .news-item-list {margin-top:1px} .main-top .main-headline > .news-tit, .main-top-wrap.type-member .main-headline > .txt-cont .news-tit {letter-spacing:-0.1em} .main-top-wrap.type-1 .main-top .rel .news-tit, .main-top-wrap.type-2 .main-top-major .news-tit, .main-top-wrap.type-4 .main-top-major .news-tit, .major-news .col > .news-tit, .major-thumb-news.col-2 .news-tit, .major-thumb-news.col-4 .news-tit, .major-news-list .news-tit, .opinion-list .news-tit, .opinion-list-area .news-tit, .audio-news .news-tit, .nt-list .news-tit, .nt-editor .thumb-cont .news-tit, .nt-editor .txt-cont .news-tit, .nt-card-list .news-tit, .nt-card-list .news-tit, .nt-thumb-col3 .news-tit, .nt-thumb-bundle .news-tit, .nt-thumb-col4 .news-tit, .nt-thubm-dim .news-tit, .nt-spare-1 .txt-cont .news-tit, .nt-spare-2 .news-item > .thumb-cont .news-tit, .nt-spare-2 .news-item > .txt-cont .news-tit, .nt-spare-3 .txt-cont .news-tit > a, .video-slide .news-item .news-tit, .series-list .news-tit, .today-photo-slide .news-tit, .section-news-group .news-tit, .event-slide .event-cont .event-tit, .event-intro p, .hkgroup .news-tit, .ladiescup .article-thumb .news-tit, .ladiescup .article-txt .news-tit, .finance-news-box .news-cont .news-tit {letter-spacing:-.075em} } /* 편집기 화면대응 */ #pageAreaRoot {width:1180px !important} /* #pageAreaRoot {width:1180px !important; transform:scale(0.72); transform-origin:center top;} */