@charset "UTF-8";
/* 
 * 섹션 공통 UI (header, footer)
 * Since 2020
 */

/* WebFont */
@import url('https://static.hankyung.com/fonts/NanumMyeongjo/nanum.myeongjo.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:#222; font-size:12px; font-family:'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', '돋움', Dotum, '굴림', Gulim,  Verdana, Arial, 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 {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption {display:block}
a {color:#222; text-decoration:none}
a:hover {text-decoration:underline}

/* Skip Navi */
.skip_navi a {display:block; overflow:hidden; height:0; margin:0 auto; font-size:0; text-align:center; background:#253081; color:#fff}
.skip_navi a:hover, .skip_navi a:active, .skip_navi a:focus {height:30px; font-size:15px; line-height:30px}

/* Common Class */
.blind {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent} 
.txt-en,
.txt-num,
.txt-date {letter-spacing:0}
.txt-num,
.txt-date {font-family:Tahoma, sans-serif}
a[class^="btn-"],
button[class^="btn-"] {display:inline-block}

/* IR */
.icon-new,
.btn-allmenu:before,
.btn-top,
.btn-close-allmenu,
.allmenu-util .util-sns > a,
.allmenu-util .user-menu > a.login_link:before,
.allmenu-util .user-menu > a.user-name:before,
.header-section .login-area .login-link:before,
.main-gnb-wrap .login-area .login-link:before,
.sitemap-wrap .cate-premium .sv-tit:after,
.btn-open-search:before,
.btn-search:before,
.header-section .layer-my .user-info .social-user::before,
.main-gnb-wrap .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;
}

/* 2021.08 공통 이미지 변경(반영 이후에 기존 이미지도 변경 이미지로 바꿔서 css정리 예정) */
.btn-allmenu.type-line::before,
.header-section-gnb .btn-allmenu:before,
.header-section-gnb .btn-open-search:before,
.header-section-gnb .btn-search:before,
.header-section-gnb .login-area .login-link::before {
    background-image:url('https://static.hankyung.com/img/www/w/common/2021/spr-common-20210811.svg');
    background-repeat:no-repeat;
}


.logo-short-hk::before {content:''; display:inline-block; width:66px; height:35px; background:url('https://static.hankyung.com/img/logo/logo-short-hk.svg') no-repeat 0 0/contain}
.logo-short-hk.white::before {background-image:url('https://static.hankyung.com/img/logo/logo-short-hk-w.svg')}


/* button */

/* 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-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,
.gnb-section .icon-g-vote {width:15px; height:15px; background-size:15px 15px; margin-right:4px; vertical-align:-2px} 

/* 한경 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}
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}

/* 전체메뉴 버튼 */
.btn-allmenu {position:relative; transform:scale(0.65)}
.btn-allmenu:before {content:''; display:inline-block; width:28px; height:28px; overflow:hidden; background-position:-61px 0; vertical-align:top}
.btn-allmenu.type-white:before {background-position:-101px 0}
.btn-allmenu .badge-new {position:absolute; top:-7px; right:-5px; width:8px; height:8px; border:none; border-radius:50%; overflow:hidden; background:#f51f2b; color:transparent; white-space:nowrap; box-sizing:content-box}

.btn-allmenu.type-line::before {width:22px; height:17px; background-position:-1px -1px}
.btn-allmenu.type-line .badge-new {top:-4px; right:-7px; width:7px; height:7px; border:2px solid #fff}

/* 전체메뉴 */
body.open-allmenu {overflow-x:hidden}
.layer-allmenu {display:none; position:absolute; top:0; left:0; right:0; margin:0 calc(50% - 50vw); z-index:9999; /*border-bottom:1px solid #ddd;*/ font-size:14px; font-family:'맑은 고딕','Malgun Gothic',sans-serif; text-align:left; 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; min-width:1180px; padding:27px 80px 37px; margin:0 auto; box-sizing:border-box}
.allmenu-inner .btn-close-allmenu {display:inline-block; position:absolute; top:30px; 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}
.user-menu > a.login_link:before,
.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 .cate-premium .banners img {max-width:100%}
.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:66px}
.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 #222}
.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}
}

/* Header(section) */
.header-section,
.header-section-inner {transition:all .2s cubic-bezier(.645,.045,.355,1)}
.header-section-inner {position:relative; min-width:1040px; background:#fff; line-height:1.21}
.header-section .login-area {position:relative}
.header-section .login-area .login-link {font-weight:bold; font-size:12px}
.header-section .login-area .login-link:before {content:''; display:inline-block; position:relative; top:2px; width:14px; height:14px; margin-right:5px; background-position:-161px -62px}
.header-section .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-section .layer-my [class^="btn-"] {text-decoration:none}
.header-section .layer-my > div + div {border-top:1px solid #ddd}
.header-section .layer-my .user-info {padding:24px 20px; text-align:center}
.header-section .layer-my .user-info .name,
.header-section .layer-my .user-info .email {overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.header-section .layer-my .user-info .name {font-size:17px}
.header-section .layer-my .user-info .email {margin:10px 0 15px; font-size:14px; line-height:1.3; letter-spacing:0}
.header-section .layer-my .user-info .social-user {margin:10px 0 15px; font-size:14px; letter-spacing:0}
.header-section .layer-my .user-info .social-user::before {content:''; display:inline-block; width:18px; margin-right:4px; overflow:hidden; vertical-align:-3px}
.header-section .layer-my .user-info .social-user.social-apple::before {height:17px; background-position:-212px -62px}
.header-section .layer-my .user-info .social-user.social-google::before {height:15px; background-position:-77px -62px}
.header-section .layer-my .user-info .social-user.social-kakao::before {height:15px; background-position:-185px -62px}
.header-section .layer-my .user-info .social-user.social-naver::before {height:15px; background-position:3px -62px}
.header-section .layer-my .user-info .social-user.social-facebook::before {height:17px; background-position:-25px -62px}
.header-section .layer-my .user-info .social-user::after {content:''; display:inline-block; width:1px; height:18px; vertical-align:-5px}
.header-section .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-section .layer-my .use-service {padding:24px 20px}
.header-section .layer-my .use-service li {position:relative; padding-left:7px}
.header-section .layer-my .use-service li:before {content:''; position:absolute; top:7px; left:0; width:2px; height:2px; background:#222}
.header-section .layer-my .use-service li + li {margin-top:10px}
.header-section .layer-my .btn-logout {display:block; width:100%; font-size:13px; line-height:40px; text-align:center}
.header-section .layer-my.active {visibility:visible; z-index:9999; transform:scale(1); opacity:1}


/* 갓머리만 있는 화면용- 개편 반영되면 제거예정 */
.main-gnb-wrap .login-area {position:relative}
.main-gnb-wrap .login-area .login-link {font-weight:bold; font-size:12px}
.main-gnb-wrap .login-area .login-link:before {content:''; display:inline-block; position:relative; top:2px; width:14px; height:14px; margin-right:5px; background-position:-161px -62px}
.main-gnb-wrap .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}
.main-gnb-wrap .layer-my [class^="btn-"] {text-decoration:none}
.main-gnb-wrap .layer-my > div + div {border-top:1px solid #ddd}
.main-gnb-wrap .layer-my .user-info {padding:24px 20px; text-align:center}
.main-gnb-wrap .layer-my .user-info .name,
.main-gnb-wrap .layer-my .user-info .email {overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.main-gnb-wrap .layer-my .user-info .name {font-size:17px}
.main-gnb-wrap .layer-my .user-info .email {margin:10px 0 15px; font-size:14px; letter-spacing:0}
.main-gnb-wrap .layer-my .user-info .social-user {margin:10px 0 15px; font-size:14px; letter-spacing:0}
.main-gnb-wrap .layer-my .user-info .social-user::before {content:''; display:inline-block; width:18px; margin-right:4px; overflow:hidden; vertical-align:-3px}
.main-gnb-wrap .layer-my .user-info .social-user.social-apple::before {height:17px; background-position:-212px -62px}
.main-gnb-wrap .layer-my .user-info .social-user.social-google::before {height:15px; background-position:-77px -62px}
.main-gnb-wrap .layer-my .user-info .social-user.social-kakao::before {height:15px; background-position:-185px -62px}
.main-gnb-wrap .layer-my .user-info .social-user.social-naver::before {height:15px; background-position:3px -62px}
.main-gnb-wrap .layer-my .user-info .social-user.social-facebook::before {height:17px; background-position:-25px -62px}
.main-gnb-wrap .layer-my .user-info .social-user::after {content:''; display:inline-block; width:1px; height:18px; vertical-align:-5px}
.main-gnb-wrap .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}
.main-gnb-wrap .layer-my .use-service {padding:24px 20px}
.main-gnb-wrap .layer-my .use-service li {position:relative; padding-left:7px}
.main-gnb-wrap .layer-my .use-service li:before {content:''; position:absolute; top:7px; left:0; width:2px; height:2px; background:#222}
.main-gnb-wrap .layer-my .use-service li + li {margin-top:10px}
.main-gnb-wrap .layer-my .btn-logout {display:block; width:100%; font-size:13px; line-height:40px; text-align:center}
.main-gnb-wrap .layer-my.active {visibility:visible; z-index:9999; transform:scale(1); opacity:1}
/* 갓머리(개편 후 스타워즈만 유지) */
.main-gnb-wrap {padding:12px 35px 0}
.main-gnb-wrap .btn-allmenu {float:left; transform-origin:left top}
.main-gnb-wrap .btn-allmenu.type-line {transform: scale(0.75)}
.main-gnb-wrap .gnb-main {float:left; margin-left:9px}
.main-gnb-wrap .gnb-main > li {float:left; font-size:12px}
.main-gnb-wrap .gnb-main > li + li {margin-left:11px}
.main-gnb-wrap .login-area {float:right}
.main-gnb-wrap:after {content:''; display:block; clear:both}
/* 로고 및 섹션 GNB */
.section-gnb-wrap {position:relative; padding:11px 35px 15px; border-bottom:1px solid #c3c3c3}
.section-gnb-wrap .logo-hk {position:absolute; top:28px; left:35px; width:75px; transition:all .2s cubic-bezier(.645,.045,.355,1)}
.section-gnb-wrap .logo-hk img {width:100%}
.section-gnb-wrap .logo-section {font-size:38px; text-align:center; transition:all .2s cubic-bezier(.645,.045,.355,1)}
.section-gnb-wrap .logo-section .logo-short-hk::before {vertical-align:-4px}
.section-gnb-wrap .logo-section .section-title {font-size:37px}
.section-gnb-wrap .logo-section .section-title::before {content:''; display:inline-block; position:relative; top:7px; width:1px; height:42px; margin:0 11px 0 3px; background:#ddd; vertical-align:baseline}
.section-gnb-wrap .sub-description {margin-top:8px; color:#888; font-size:12px; text-align:center}
.section-gnb-wrap .gnb-section {margin-top:15px; font-size:17px; text-align:center; transition:all .2s cubic-bezier(.645,.045,.355,1)}
.section-gnb-wrap .gnb-section > li {display:inline-block; margin:0 11px}
.section-gnb-wrap .gnb-section li.on > a {font-weight:bold}
.section-gnb-wrap .gnb-section .gnb-dropdown {position:relative}
.section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-toggle {cursor:pointer; user-select:none}
.section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-toggle::after {content:''; display:inline-block; position:relative; top:-2px; width:0; height:0; margin-left:5px; border-width:6px 4px 0 4px; border-style:solid; border-color:#888 transparent transparent transparent}
.section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-menu {display:none; position:absolute; top:36px; left:-19px; z-index:9999; min-width:150px; 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; transform-origin:left top}
/* .section-gnb-wrap .gnb-section .gnb-dropdown .icon-new + .gnb-dropdown-menu {left:calc(50% - 11px)}	 */
.section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-menu ul {padding:10px 20px}
.section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-menu li {padding:6px 0; font-weight:normal; font-size:14px; white-space:nowrap}
.section-gnb-wrap .gnb-section .gnb-dropdown.active .gnb-dropdown-toggle::after {top:-3px; border-width:0 4px 6px 4px; border-color:transparent transparent #888 transparent}


/* 증권 GNB */
.section-gnb-finance .gnb-dropdown-menu ul {float:left}
.section-gnb-finance .gnb-section > li:nth-child(1) .gnb-dropdown-menu {width:280px}
.section-gnb-finance .gnb-section > li:nth-child(2) .gnb-dropdown-menu {width:760px}
/* .section-gnb-finance .gnb-section > li:nth-child(5) .gnb-dropdown-menu {width:290px} */
.section-gnb-finance .gnb-section > li:nth-child(7) .gnb-dropdown-menu {width:260px}

/* 유료섹션 구독내역,구독신청 버튼 */
/******* 2021.08버전 개편 완료 되면 제거 가능 *******/
.section-gnb-wrap .gnb-section-etc {position:absolute; top:25px; right:105px}
.section-gnb-wrap .gnb-section-etc .btn-mypage {display:inline-block; height:30px; padding:0 20px; border-radius:15px; background:#f3f3f3; font-size:14px}
.section-gnb-wrap .gnb-section-etc .btn-mypage::before {content:''; display:inline-block; width:1px; height:30px; vertical-align:-10px}
/******* //2021.08버전 개편 완료 되면 제거 가능 *******/

/* 헤더 검색영역 */
.section-gnb-wrap .search-area {position:absolute; top:25px; right:35px}
.header-section .search-area .btn-open-search,
.header-section .search-area .btn-search {outline:none}
.header-section .search-area .btn-open-search:before,
.header-section .search-area .btn-search:before {content:''; display:inline-block; position:relative; top:-1px; width:29px; height:30px; overflow:hidden; background-position:-180px 0; transform:scale(0.586); vertical-align:middle}
.header-section .search-area .btn-open-search > span {position:relative; font-weight:bold; font-size:14px}
.header-section .search-area .btn-open-search > span.blind {position:absolute}
.header-section .search-area .layer-search {position:absolute; top:-9px; right:0; z-index:-1; width:60px; opacity:0; transition:all ease .2s}
.header-section .search-area .layer-search .inp-txt {width:100%; height:45px; padding:0 46px 0 14px; border:1px solid #c3c3c3; border-radius:5px; box-sizing:border-box; background:#fff; color:#222; font-size:14px; outline:none}
.header-section .search-area .layer-search .btn-search {position:absolute; top:9px; right:10px}
.header-section .search-area.active .layer-search { z-index:1; width:240px; opacity:1}
/* 헤더 고정시 스타일 */
.gnb-sticky .header-section-inner {position:fixed; top:0; left:0; right:0; z-index:999999}
/* 해주라 외주개발 메인화면 상단 주식정보 영역 top - 닷컴 헤더 변경시마다 수정 필요함. */
/* .header-section ~ aside.stock-graph {top:158.5px !important}
.header-section.header-section-gnb ~ aside.stock-graph {top:133px !important} */

/* 기존 fixed헤더 상단 패딩 제거를 위해. 임시 지정. 추후 제거 예정 */
.temp--class#wrap,
.temp--class #inner {padding-top:0 !important} 


/*
 *
 *
 *
 * 2021.08 개편버전 헤더 스타일 (반영이후 .header-section클래스만 있어도 가능하게 정리예정 - 갓머리 유지하는 스타워즈 같은 화면 체크 필요) */
.header-section-gnb .section-gnb-wrap {padding:0 30px 15px}
.header-section-gnb .section-gnb-wrap .logo-section .logo-short-hk {display:inline-block; height:80px; padding:30px 12px 0; background-color:#142c67; vertical-align:top; box-sizing:border-box}
.header-section-gnb .section-gnb-wrap .logo-section .logo-short-hk::before {background-image:url('https://static.hankyung.com/img/logo/logo-short-hk-w.svg'); vertical-align:top}
.header-section-gnb .section-gnb-wrap .logo-section .section-title {display:inline-block; margin-top:28px; color:#555; font-weight:700; font-size:36px; line-height:1.2; font-family:'NanumMyeongjo', serif; vertical-align:top}
.header-section-gnb .section-gnb-wrap .logo-section .section-title::before {display:none}
.header-section-gnb .section-gnb-wrap .gnb-section {margin-bottom:-2px; font-size:15px}
.header-section-gnb .section-gnb-wrap .gnb-section > li.expand a {color:#436f91}
.header-section-gnb .section-gnb-wrap .gnb-section > li.other {position:relative; margin-left:31px}
.header-section-gnb .section-gnb-wrap .gnb-section > li.other::before {content:'|'; position:absolute; top:-1px; left:-23px; color:#ddd}
.header-section-gnb .section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-menu {top:26px}
.header-section-gnb .section-gnb-wrap .gnb-section .gnb-dropdown .gnb-dropdown-menu li {font-size:13px}
.header-section-gnb .btn-allmenu {position:absolute; top:41px; left:30px; transform:none}
.header-section-gnb .btn-allmenu:before {width:22px; height:17px; background-position:-1px -1px}
.header-section-gnb .btn-allmenu .badge-new {top:-4px; right:-7px; width:7px; height:7px; border:2px solid #fff}
.header-section-gnb .search-area {position:absolute; top:40px; left:88px}
.header-section-gnb .search-area .btn-open-search:before,
.header-section-gnb .search-area .btn-search:before {width:21px; height:21px; background-position:-33px 0; transform:none}
.header-section-gnb .search-area .layer-search {right:auto; left:0}
.header-section-gnb .search-area .layer-search .btn-search {top:13px}
.header-section-gnb .header-section-side {position:absolute; top:35px; right:30px}
.header-section-gnb .header-section-side > * {display:inline-block; margin-left:26px; vertical-align:middle}
.header-section-gnb .header-section-side .btn-mypage {display:inline-block; height:30px; padding:0 20px; border-radius:15px; background:#f3f3f3; font-size:14px}
.header-section-gnb .header-section-side .btn-mypage::before {content:''; display:inline-block; width:1px; height:30px; vertical-align:-10px}
.header-section-gnb .login-area .login-link {font-weight:normal; font-size:13px}
.header-section-gnb .login-area .login-link::before {display:block; width:24px; height:24px; margin:0 auto 8px; background-position:-64px 0}

/* 로고 :  로고타입일 경우 */
.logo-section__logotype {display:inline-block}
/* 로고타입: 글로벌마켓 */
.logo__globalmarket::before {content:''; display:inline-block; width:106px; height:19px; background:url('https://static.hankyung.com/img/logo/logo-globalmarket.svg') no-repeat 0 0/contain; overflow:hidden; vertical-align:top}
.logo-section .logo__globalmarket {position:relative; height:55px}
.logo-section .logo__globalmarket::before {width:306px; height:55px}
.logo-section .logo__globalmarket > a {position:absolute; top:0; height:100%}
.logo-section .logo__globalmarket > a:nth-child(1) {left:0; width:65px}
.logo-section .logo__globalmarket > a:nth-child(2) {right:0; width:calc(100% - 65px)}
/* 로고타입: 코리아마켓 */
.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-section .logo__koreamarket {position:relative; height:55px}
.logo-section .logo__koreamarket::before {width:306px; height:55px}
.logo-section .logo__koreamarket > a {position:absolute; top:0; height:100%}
.logo-section .logo__koreamarket > a:nth-child(1) {left:0; width:65px}
.logo-section .logo__koreamarket > a:nth-child(2) {right:0; width:calc(100% - 65px)}

.header-section-gnb .section-gnb-wrap.section-gnb-logotype {padding-top:20px}
.header-section-gnb .badge-live {display:block; width:32px; height:14px; margin:0 auto 3px; background:url(https://static.hankyung.com/img/www/w/common/badge-live.svg) no-repeat 0 0/contain}

.badge-hkonly {display:inline-block; width:48px; height:14px; margin:0 0 0 3px; background:url(https://static.hankyung.com/img/www/w/common/badge-hkonly.svg) no-repeat 0 0/contain}
.header-section-gnb .badge-hkonly {display:block; margin:0 auto 3px}

/* 글로벌마켓 : 종목검색 추가 */
.gnb-section-globalmarket {min-width:1210px}
.section-gnb-wrap .gnb-section.gnb-section-globalmarket > li {margin:0 7px}
.gnb-section .mn-stocksearch .btn-stocksearch {margin-top:-2px; color:#ee4c4c; font-weight:bold; font-size:15px; line-height:1; outline:none}
.gnb-section .mn-stocksearch .btn-stocksearch::after {content:''; display:inline-block; width:16px; height:16px; margin-left:4px; background:url('https://static.hankyung.com/img/common/icon/icon-search-red.svg') no-repeat 0 0/contain; vertical-align:-2px}
.layer-globalmarket-stocksearch {position:fixed; top:137px; right:-400px; bottom:0; z-index:-1; opacity:0; width:380px; height:calc(100vh - 137px); background:rgba(255,255,255,.95); transition:all ease-in .3s}
.layer-globalmarket-stocksearch .stocksearch-wrap {padding:50px 30px 40px}
.layer-globalmarket-stocksearch .stocksearch-box {position:relative}
.layer-globalmarket-stocksearch .stocksearch-box .inp-txt {display:block; width:100%; height:45px; padding:0 50px 0 15px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; color:#222; font-size:15px; outline:none}
.layer-globalmarket-stocksearch .stocksearch-box .inp-txt::placeholder {color:#888}
.layer-globalmarket-stocksearch .stocksearch-box .inp-txt:-ms-input-placeholder {color:#888}
.layer-globalmarket-stocksearch .stocksearch-box .inp-txt::-ms-input-placeholder {color:#888}
.layer-globalmarket-stocksearch .stocksearch-box .btn-stock-search {position:absolute; top:0; right:0; width:45px; height:45px}
.layer-globalmarket-stocksearch .stocksearch-box .btn-stock-search:before {content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:20px; height:20px; background:url('https://static.hankyung.com/img/common/icon/icon-search-black.svg') no-repeat 0 0/contain}
.layer-globalmarket-stocksearch .stocksearch-list {max-height:calc(100vh - 277px); margin-top:5px; overflow-x:hidden; overflow-y:auto; background:#fff; box-shadow:0 
2px 24px 0 rgb(128 145 165 / 31%);}
.layer-globalmarket-stocksearch .stocksearch-list ul {padding:10px}
.layer-globalmarket-stocksearch .stocksearch-list li {margin:8px}
.layer-globalmarket-stocksearch .stocksearch-list a {display:flex; align-items:center; justify-content:space-between}
.layer-globalmarket-stocksearch .stocksearch-list a .stock-name {font-weight:bold; font-size:14px}
.layer-globalmarket-stocksearch .stocksearch-list a .ko {color:#868686; font-size:13px}
.layer-globalmarket-stocksearch .closd-stocksearch {position:absolute; top:15px; left:15px; width:20px; height:20px}
.layer-globalmarket-stocksearch .closd-stocksearch::before,
.layer-globalmarket-stocksearch .closd-stocksearch::after {content:''; position:absolute; left:50%; top:0; width:1px; height:20px; background-color:#222}
.layer-globalmarket-stocksearch .closd-stocksearch:before {transform:translate(-50%) rotate(45deg)}
.layer-globalmarket-stocksearch .closd-stocksearch:after {transform:translate(-50%) rotate(-45deg)}
.layer-globalmarket-stocksearch .nodata {padding:16px; text-align:center; font-size:14px}
.layer-globalmarket-stocksearch.active {right:0; z-index:99; opacity:1}

.gnb-section-koreamarket {min-width:1100px}

/* gnb hover type */
.section-gnb-wrap .gnb-section.type-hover .gnb-dropdown .gnb-dropdown-menu::before {content:''; position:absolute; top:-10px; left:0; right:0; height:10px}
.section-gnb-wrap .gnb-section.type-hover .gnb-dropdown .gnb-dropdown-menu {display:block; opacity:0; visibility:hidden; z-index:-1}
.section-gnb-wrap .gnb-section.type-hover .gnb-dropdown:hover .gnb-dropdown-menu,
.section-gnb-wrap .gnb-section.type-hover .gnb-dropdown.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:10; animation:.2s alternate gndSlideDown}
.section-gnb-wrap .gnb-section.type-hover .gnb-dropdown:hover .gnb-dropdown-toggle::after,
.section-gnb-wrap .gnb-section.type-hover .gnb-dropdown.focus .gnb-dropdown-toggle::after {border-width:5px 4px; border-color:transparent transparent #888 transparent}
@keyframes gndSlideDown {
    0% { transform:scaleY(0) }
    100% { transform:scaleY(1) }
}

.gnb-section .gnb-dropdown-menu-group {display:flex}

/* Footer */
.foot-inner {max-width:1040px; margin:0 auto; font-family:'맑은 고딕','Malgun Gothic',sans-serif; text-align:left; line-height:1.2}
.foot-sitemap {margin-top:20px; font-size:14px}
.foot-sitemap .foot-inner {padding:26px 0 28px; border-top:1px solid #222}
.foot-sitemap img.icon-premium {width:8px; height:11px; margin-left:6px; vertical-align:middle}
.foot-sitemap .service-cate + .service-cate {margin-top:28px}
.foot-sitemap .sv-list li {float:left; margin-right:17px; 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 {margin-top:10px}

.footer-wrap {font-size:14px}
.foot-cont {padding:25px 0 60px; border-top:1px solid #c8c8c8}
.foot-cont address {font-style:normal}
.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 .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}
/* TOP버튼 */
.btn-top-wrap {position:fixed; bottom:0; left:50%; width:1px; height:0; z-index:10}
.btn-top-wrap .btn-position {position:absolute; bottom:80px; right:-580px}
.btn-top-wrap .btn-top {position:fixed; display:block; width:50px; height:50px; background-position:0 0}
.btn-top-wrap.btn-top-globalstock .btn-position {right:-630px}
/* 디바이스별 */
@media only screen and (max-height: 715px) {
	.layer-allmenu.ver2 .sitemap-wrap .service-hk .service-cate .sv-tit {margin-bottom:15px}
	.allmenu-util {margin-bottom:20px}
	.allmenu-inner {padding-top:20px; padding-bottom:25px}
	.sitemap-wrap .service-group + .service-group {margin-top:15px; padding-top:20px}
	.sitemap-wrap .service-rel .service-cate + .service-cate {margin-top:20px}
	.sitemap-wrap .service-rel .sv-tit {margin-bottom:5px}
	.layer-allmenu.ver2 .allmenu-inner .btn-close-allmenu {top:59px}
}
@media all and (max-width:1024px) {
    .btn-top-wrap .btn-position {right:-510px}
}
/* 브라우저 지원 안내(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:20px; height:20px}
.browser-support-info .btn-close-info::before,
.browser-support-info .btn-close-info::after {content:''; position:absolute; left:50%; top:0; width:1px; height:20px; background-color:#fff}
.browser-support-info .btn-close-info:before {transform:translate(-50%) rotate(45deg)}
.browser-support-info .btn-close-info:after {transform:translate(-50%) rotate(-45deg)}

/* 맥사파리 대응 */
@media not all and (min-resolution:.001dpcm) { 
	@supports (-webkit-appearance:none) {
		.icon-new {position:relative; top:1px}
	}
}

/* 코리아마켓전용 */
.koreamarket .foot-inner {max-width:1180px}
.koreamarket .ad-bottom {max-width:1180px; margin:0 auto 30px; padding-top:30px; border-top:1px solid #ddd; text-align:center}


/* 2022개편버전 header (개편 GNB 반영 이후 전체 css 정리) */
/* 전체공통 */
.top-util-area {background:#f7f7f7}
.top-util-area .top-util-inner {height:32px; padding:0 30px; 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 {vertical-align:top; line-height:1.1}
.top-util-area .login-area .login-link::before {display:none !important}
.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(.9); z-index:-1; opacity:0; transition:all ease .2s}
.top-util-area .login-area .layer-my.active {visibility:visible; z-index:1000000; 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-weight:bold; font-size:17px; 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 .gnb-dropdown {position:relative}
.top-util-area .gnb-dropdown .gnb-dropdown-toggle {cursor:pointer; user-select:none; outline:none; font-weight:normal}
.top-util-area .gnb-dropdown .gnb-dropdown-menu {display:none; 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}
.top-util-area .gnb-dropdown .gnb-dropdown-menu ul {padding:10px}
.top-util-area .gnb-dropdown .gnb-dropdown-menu li {font-size:13px; white-space:nowrap}
.top-util-area .gnb-dropdown .gnb-dropdown-menu li + li {margin-top:8px}
.top-util-area .gnb-dropdown.active .gnb-dropdown-menu {z-index:1000001}
.top-util-area .gnb-dropdown.focus .gnb-dropdown-menu {display:block; z-index:1000001}

/* .top-util-area .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}
.top-util-area .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;}
.top-util-area .gnb-dropdown .gnb-dropdown-menu::before {content:''; position:absolute; top:-5px; left:0; right:0; height:5px}
.top-util-area .gnb-dropdown:hover .gnb-dropdown-menu,
.top-util-area .gnb-dropdown.focus .gnb-dropdown-menu {opacity:1; visibility:visible; z-index:1000001; animation:.2s alternate slideDown}
.top-util-area .gnb-dropdown:hover .gnb-dropdown-toggle::after,
.top-util-area .gnb-dropdown.focus .gnb-dropdown-toggle::after {position:relative; top:-5px; border-color:transparent transparent #bbb transparent}
.top-util-area .gnb-dropdown .gnb-dropdown-menu ul {padding:10px}
.top-util-area .gnb-dropdown .gnb-dropdown-menu li {font-size:13px; white-space:nowrap}
.top-util-area .gnb-dropdown .gnb-dropdown-menu li + li {margin-top:8px} */


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 .gnb-dropdown .gnb-dropdown-toggle::after {display:none !important}

header.ver2022 .layer-allmenu {top:0; border-bottom:1px solid #222; box-shadow:0 10px 10px rgba(0,0,0,.15)}
header.ver2022 .allmenu-util-wrap {position:relative; padding:45px 0 20px; 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 {position:static; padding:20px 0 40px}
header.ver2022 .allmenu-inner .sitemap-wrap {position:relative}
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 .cate-group {display:flex}
header.ver2022 .allmenu-inner .cate-group > .item {flex:0 0 auto; min-width:120px}
header.ver2022 .allmenu-inner .cate-group .sv-tit {margin:5px 0; font-size:13px}
header.ver2022 .allmenu-inner .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:36px; left:35px}
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 .promotion-nav-wrap {position:absolute; top:37px; left:80px; 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:160px; height:25px; overflow:hidden}
header.ver2022 .promotion-nav .slick-slide {border:none}
header.ver2022 .promotion-nav a {display:inline-block; color:#ee4c4c; font-weight:bold; font-size:17px; line-height:25px; text-decoration:none; box-sizing:border-box}

header.ver2022 .header-section-side {top:41px}
header.ver2022 .search-area {position:relative; top:0; left:0}
header.ver2022 .search-area .layer-search {right:-10px; top:-13px; left:auto}
header.ver2022 .search-area.active .layer-search {z-index:200; width:300px}

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 .inp-txt {padding:0 50px 0 15px; border-radius:8px 8px 0 0}
header.ver2022 .mn-search .layer-search .btn-search {right:15px}
header.ver2022 .layer-search.auto .search-auto-wrap {display:block}
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 .tooltip {position:absolute; display:flex; align-items:center; justify-content:center; min-width:110px; height:30px; border-radius:3px; background-color:#222; color:#fff; white-space:nowrap; transition:.2s linear all}
header.ver2022 .tooltip::before {content:''; position:absolute; bottom:-5px; left:50%; display:block; margin-left:-2px; border-top:5px solid #222; 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-section.ver2022 .header-section-cont {position:relative}
.header-section.ver2022 .search-area .tooltip {top:-37px; right:-20px}
.header-section.ver2022 .search-area .tooltip::before {left:auto; right:28px; margin:0}

@keyframes slideDown {
  0% { transform:scaleY(0) }
  100% { transform:scaleY(1) }
}
/* // 2022개편버전 header (개편 GNB 반영 이후 전체 css 정리) */