@charset "UTF-8";

/* 기사뷰 PC UI Style, 2022 */

/* common.ui.all? */
/* .hk__tooltip {display:inline-block; position:relative; padding:4px 9px; border-radius:3px; background-color:#222; color:#fff; font-size:12px; white-space:nowrap; box-sizing:border-box}
.hk__tooltip::before {content:''; display:inline-block; position:absolute; pointer-events:none}
.hk__tooltip.top::before {bottom:-5px; left:50%; border-top:5px solid #222; border-left:5px solid transparent; border-right:5px solid transparent; transform:translateX(-50%)}
.hk__tooltip.bottom::before {top:-5px; left:50%; border-bottom:5px solid #222; border-left:5px solid transparent; border-right:5px solid transparent; transform:translateX(-50%)}
.hk__tooltip.left::before {top:50%; left:-10px; border-top:5px solid transparent; border-left:5px solid transparent; border-bottom:5px solid transparent; border-right:5px solid #222; transform:translateY(-50%)}
.hk__tooltip.right::before {top:50%; right:-10px; border-top:5px solid transparent; border-left:5px solid #222; border-bottom:5px solid transparent; border-right:5px solid transparent; transform:translateY(-50%)}
.hk__tooltip .tooltip__btn-close {position:relative; top:-2px; width:11px; height:11px; margin-left:5px}
.hk__tooltip .tooltip__btn-close::before {content:''; display:inline-block; width:12px; height:12px; background-image:linear-gradient(to bottom, #fff 0%, #fff 100%), linear-gradient(to left, #fff 0%, #fff 100%); background-size:100% 1px,1px 100%; background-position:center; background-repeat:no-repeat; transform:rotate(45deg)} */


/*_____ Common _____*/
body,button,input,select,option,textarea,table,th,td {font-family:-apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",sans-serif}
img {max-width:100%}
iframe {vertical-align:top}

/* helpers class */
.ellip {display:block; display:-webkit-box; word-break:break-all; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical}
.overflow-hidden {height:100vh; overflow:hidden}
.overflow--hidden {position:fixed; top:0; right:0; left:0; bottom:0; height:100vh; overflow:hidden; touch-action:none} /* 스크롤 위치 상단 */

/* ad */
.ad-top {padding:20px; text-align:center; /*background:#eee*/}
.ad-bottom {margin:20px auto; text-align:center}
.ad-wrap {display:flex; flex-wrap:wrap; justify-content:center; margin:25px -10px; text-align:center; clear:both}
.ad-wrap > .ad-box {margin:5px}
.ad-wrap > .ad-box:only-child {flex:1 1 auto}
.ad-wrap.col2-20-300 {margin-left:-20px; margin-right:-20px}
.ad-wrap.col2-20-300 > .ad-box {margin:10px}
.ad-wrap.col2-20-336 {margin:40px -56px}
.ad-wrap.col2-20-336 > .ad-box {margin:10px}

/* 광고 텍스트 리스트(iframe) */
.ad-list > li {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:15px; line-height:28px}
.ad-list > li a {color:#222}

/* icon */
.svg-icon {vertical-align:top}

.aside-list-thumb .icon-premium2 {vertical-align:-4px}
.aside .icon-premium-txt {margin-right:4px; padding:2px 4px 3px 5px; line-height:1}

/* button */
.btn-star-toggle > svg {transform:scale(1.2)}
.btn-star-toggle .svg-icon {fill:#fff; stroke:#222; stroke-width:2px; transform:scale(.8); transform-origin:center center}
.btn-star-toggle.on > svg {transform:none}
.btn-star-toggle.on .svg-icon {fill:#ff761b !important; stroke:#ff761b !important; stroke-width:unset; transform:none}

/* form */
.input-txt {display:block; width:100%; padding:0 14px; border:1px solid #ddd; border-radius:8px; background:#fff; box-sizing:border-box; outline:none; font-size:16px}
input.input-txt {height:40px; line-height:38px}
textarea.input-txt {padding:14px}
.input-txt::placeholder {color:#888}
.input-txt:-ms-input-placeholder {color:#888}
.input-txt::-ms-input-placeholder {color:#888}
.input-txt:disabled {background:#eee; cursor:not-allowed}

.radio-style .inp-radio {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
.radio-style {display:inline-flex; align-items:center; position:relative; cursor:pointer; margin-right:10px}
.radio-style label {cursor:pointer}
.radio-style .label-txt {display:inline-flex; align-items:center}
.radio-style .label-txt::before {content:''; display:inline-block; width:16px; height:16px; margin-right:10px; border:1px solid #ddd; border-radius:10px; background:radial-gradient(circle, rgba(221,221,221,1) 4px, rgba(255,255,255,1) 4px); box-sizing:border-box}
.radio-style .inp-radio:checked + .label-txt::before {border:none; background:radial-gradient(circle, rgba(255,255,255,1) 4px, rgba(34,34,34,1) 4px)}
.radio-style .inp-radio:disabled + .label-txt::before,
.radio-style .inp-radio[readonly] + .label-txt::before {background:radial-gradient(circle, rgba(211,211,211,1) 4px, rgba(238,238,238,1) 4px); cursor:not-allowed}
.radio-style .inp-radio:checked:disabled + .label-txt::before,
.radio-style .inp-radio:checked[readonly] + .label-txt::before {background:radial-gradient(circle, rgba(255,255,255,1) 4px, rgba(238,238,238,1) 4px)}
.radio-style:last-child {margin-right:0}

/* plugin */
.ui-widget.ui-widget-content {background:none}
.ui-state-default {background:#222}
.ui-slider {position:relative; text-align:left}
.ui-slider::before {content:''; display:block; position:absolute; top:4px; left:-6px; right:-6px; height:4px; background:#ddd}
.ui-slider .ui-slider-handle {position:absolute; z-index:3; width:12px; height:12px; margin-left:-6px; border-radius:6px; cursor:default; -ms-touch-action:none; touch-action:none; outline:none; box-sizing:border-box; cursor:pointer}
.ui-slider .ui-slider-range {position:absolute; z-index:1; display:block; border:none}
.ui-slider-horizontal {height:12px}

/* 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:8px; font-size:16px; text-decoration:none}
.hk-modal-footer [class^="modal-btn-"]:only-child {width:100%}

.modal-photoviewer {display:flex; overflow:hidden; background:#111; visibility:hidden; transform:scale(.8); opacity:0; transition:all ease .2s}
.modal-photoviewer .hk-modal-inner {position:static; padding:0; border-radius:0; box-shadow:none; background:none}
.modal-photoviewer .article-figure {display:flex; flex-direction:column; max-height:100vh; margin:0; padding:10px; box-sizing:border-box}
.modal-photoviewer .article-figure .figure-img {border-radius:0}
.modal-photoviewer .article-figure .figure-caption {font-size:14px}
.modal-photoviewer .modal-btn-close {top:30px; right:30px; width:50px; height:50px; border-radius:100%; background:#1d1d1d}
.modal-photoviewer .hk__icon-x {background-image:linear-gradient(to bottom, #fff 0%, #fff 100%), linear-gradient(to left, #fff 0%, #fff 100%)}
.modal-photoviewer.show {visibility:visible; z-index:1000000; transform:scale(1); opacity:1}

.modal-font .font-control {width:290px}
.modal-font .font-control + .font-control {margin:40px 0 20px}
.modal-font .font-control dt {margin-bottom:15px; font-size:16px; text-align:center}
.modal-font .font-control dd {position:relative; height:12px}
.modal-font .font-control-list {display:flex; align-items:center; justify-content:space-between; position:absolute; left:0; right:0; top:0; margin:0 -6px; pointer-events:none}
.modal-font .font-control-list li {flex:0 0 auto; width:12px; height:12px; border-radius:6px; background-color:#ddd}

.modal-scrap .hk-modal-inner {width:380px}

.modal-alert .hk-modal-inner {width:380px}
.modal-alert .msg {font-size:18px; line-height:28px; text-align:center}

.modal-alert2 .hk-modal-inner {min-width:300px; padding:30px}
.modal-alert2 .msg {font-size:14px; text-align:center}

.modal-share .hk-modal-inner {width:380px}
.modal-share .view-share-list {display:flex; flex-wrap:wrap; margin:-10px auto}
.modal-share .view-share-list li {flex:0 0 auto; width:80px; margin:10px 0; text-align:center}
.modal-share [class^="btn-share-"]::before {content:''; display:inline-block; width:40px; height:40px; background-repeat:no-repeat; background-size:contain; background-position:50% 50%}
.modal-share [class^="btn-share-"] .txt {display:block; margin-top:5px; color:#888; font-size:11px; white-space:nowrap}
.modal-share .btn-share-kakao::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-kakaotalk.svg')}
.modal-share .btn-share-facebook::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-facebook.svg')}
.modal-share .btn-share-twitter::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-twitter.svg')}
.modal-share .btn-share-url::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-url.svg')}
.modal-share .btn-share-naver::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-naver.svg')}
.modal-share .btn-share-band::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-band.svg')}
.modal-share .btn-share-mail::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-share-mail.svg')}

.modal-journalist .hk-modal-inner {width:500px}
.modal-journalist .profile-wrap {position:relative; min-height:70px; padding-right:80px}
.modal-journalist .profile {flex:0 0 auto; display:flex; align-items:center}
.modal-journalist .profile .name {font-size:20px}
.modal-journalist .profile .part {flex:0 0 auto; margin-left:7px; color:#888; font-size:12px}
.modal-journalist .journalist-say {margin-top:5px; font-size:14px}
.modal-journalist .journalist-subscription {display:flex; margin-top:15px}
.modal-journalist .journalist-subscription > dl {display:inline-flex; align-items:center; margin-right:10px}
.modal-journalist .journalist-subscription > dl dt {font-size:12px}
.modal-journalist .journalist-subscription > dl .count {margin-left:5px; font-weight:bold; font-size:20px}
.modal-journalist .btn-journalist-subscribe {display:inline-flex; align-items:center; padding:0 15px; border:1px solid #ddd; border-radius:25rem; color:#ff761b; font-weight:bold; line-height:25px}
.modal-journalist .btn-journalist-subscribe svg {margin-right:5px}
.modal-journalist .profile-thumb {position:absolute; top:50%; right:0; transform:translateY(-50%); width:70px; height:70px; border-radius:100%; overflow:hidden}
.modal-journalist .profile-thumb > a {display:block; width:100%; height:100%}
.modal-journalist .profile-thumb > a::after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid rgba(0,0,0,.1); border-radius:100%; box-sizing:border-box}
.modal-journalist .profile-thumb img {width:100%; height:100%; object-fit:cover}
.modal-journalist .popular-article {margin-top:20px; padding-top:20px; border-top:1px solid #ddd; font-size:16px}
.modal-journalist .popular-article .tit {display:block; margin-bottom:20px}

.modal-columnist .hk-modal-inner {width:500px}
.modal-columnist .profile-wrap {display:flex; align-items:center; min-height:40px}
.modal-columnist .profile {flex:0 0 auto; display:flex; align-items:center}
.modal-columnist .profile .name {font-size:20px}
.modal-columnist .profile .part {flex:0 0 auto; margin-left:7px; color:#888; font-size:12px}
.modal-columnist .profile-thumb {flex:0 0 auto; width:40px; height:40px; margin-right:10px; border-radius:100%; overflow:hidden}
.modal-columnist .profile-thumb > a {position:relative; display:block; width:100%; height:100%}
.modal-columnist .profile-thumb > a::after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid rgba(0,0,0,.1); border-radius:100%; box-sizing:border-box}
.modal-columnist .profile-thumb img {width:100%; height:100%; object-fit:cover}
.modal-columnist .popular-article {margin-top:20px; padding-top:20px; border-top:1px solid #ddd; font-size:14px}
.modal-columnist .popular-article .tit {display:block; margin-bottom:20px}
.modal-columnist .popular-article .scroll-area {max-height:300px; overflow-y:auto}

/* 하단 슬라이드월 팝업 */
.layer-fullpopup {visibility:hidden; z-index:-1; opacity:0; position:fixed; top:0; right:0; bottom:0; left:0; background:linear-gradient(0deg, rgba(0,0,0,.9) 50%, rgba(0,0,0,0.5) 100%)}
.layer-fullpopup.show {visibility:visible; z-index:999999999; opacity:1; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); transition:all ease-in .3s}

.layer-offcanvas {position:fixed; display:flex; flex-direction:column; justify-content:center;  background:#fff}
.layer-offcanvas .para {font-size:18px}
.layer-offcanvas .txt-point {color:#ff761b}
.layer-offcanvas .txt-underline {text-decoration:underline}
.layer-offcanvas .offcanvas-foot {margin-top:25px}
.layer-offcanvas .offcanvas-foot .btn {display:inline-block; min-width:170px; line-height:50px; margin:0 3px; padding:0 10px; border-radius:25px; color:#fff; font-size:18px; text-align:center; box-sizing:border-box}
.layer-offcanvas .offcanvas-foot .btn-pramary {background-color:#ff761b}
.layer-offcanvas .offcanvas-foot .btn-secondary {background-color:#666}
.layer-offcanvas .offcanvas-etc {margin-top:27px}
.layer-offcanvas .btn-link {font-size:16px}
.layer-offcanvas .btn-link::after {content:''; display:inline-block; width:6px; height:6px; margin-left:6px; border-top:1px solid #222; border-right:1px solid #222; transform:rotate(45deg); vertical-align:3px}
.layer-offcanvas.bottom {right:0; bottom:-100%; left:0; padding:50px 0; text-align:center}
.layer-fullpopup.show .layer-offcanvas.bottom {bottom:0; transition:bottom 1s}

.layer-fullpopup#layer-memberlogin {background:rgba(0,0,0,.5)}

/*_____ View _____*/
/* common */
.up,
.up a {color:#ff0000}
.down,
.down a {color:#2175ff}
.hold,
.hold a {color:#888}

.news-tit,
.lead {overflow:hidden; display:block; display:-webkit-box; text-overflow:clip; -webkit-box-orient:vertical; font-weight:normal}
.lead {color:#888; font-size:13px}

.thumb {position:relative; overflow:hidden; border-radius:10px}
.thumb > a {display:block; position:relative; width:100%; height:100%}
.thumb img {width:100%; min-height:100%; object-fit:cover; object-position:top}

.iframe-youtube {position:relative; height:0; padding-bottom:56.25%; overflow:hidden}
.iframe-youtube iframe {position: absolute; top:0; left:0; width:100%; height:100%}
.iframe-youtube .layer-info-ieyoutube {position:absolute; left:50%; bottom:10px; width:550px; margin-left:-275px; padding:11px 40px 11px 15px; border-radius:4px; background:#000; background:rgba(0,0,0,.7); box-sizing:border-box}
.iframe-youtube .layer-info-ieyoutube p {color:#f9ff56; font-size:13px; line-height:22px; letter-spacing:-0.075em; white-space:nowrap}
.iframe-youtube .layer-info-ieyoutube .btn-close-info {position:absolute; top:15px; right:16px; width:13px; height:13px}
.iframe-youtube .layer-info-ieyoutube .btn-close-info::before {content:''; display:inline-block; width:13px; height:13px; background-image:linear-gradient(to bottom, #f9ff56 0%, #f9ff56 100%), linear-gradient(to left, #f9ff56 0%, #f9ff56 100%); background-size:100% 1px,1px 100%; background-position:center; background-repeat:no-repeat; transform:rotate(45deg)}

.news-item {display:flex}
.news-item > .txt-cont {flex:1 1 auto}
.news-item > .thumb {flex:0 0 auto}
.news-item.type-thumb-lt {flex-direction:row-reverse}

.list-txt > li {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:15px; line-height:1.2}
.list-txt > li + li {margin-top:10px}
.list-txt.type-dot > li {position:relative; padding-left:7px}
.list-txt.type-dot > li::before {content:''; position:absolute; top:50%; left:0; width:2px; height:2px; background:#222; transform:translateY(-50%)}

/* layout */
#wrap {min-width:1240px}
.header-section {z-index:999999}
.header-section-inner {min-width:1180px}
.foot-inner {max-width:1180px}
.btn-top-wrap .btn-position {right:-630px}
.layout-inner,
.article-wrap {min-width:1180px; max-width:1180px; margin:0 auto}
.article-wrap {padding:40px 0}
.article-container {display:flex; align-items:flex-start; justify-content:space-between; position:relative}
.article-container > .utility {flex:0 0 auto; position:sticky; top:168px; width:80px; box-sizing:border-box}
.article-container > .article-contents {flex:0 0 auto; width:1000px}
.article-contents > .content {display:flex; align-items:flex-start; justify-content:space-between}
.article-contents > .content > .article {flex:0 0 auto; width:600px; box-sizing:border-box}
.article-contents > .content > .aside {flex:0 0 auto; /*position:sticky; top:88px;*/ width:300px; padding-top:80px}
.article-contents > .content > .aside > .aside-inner {width:300px; z-index:2 !important}
.cleanview .aside {position:sticky; top:88px}
.cleanview .aside > .aside-inner {position:static !important}

/* utility */
.share-tool-kakao::before {content:''; display:inline-block; width:24px; height:23px; background:url('https://static.hankyung.com/img/www/w/news/view/icon-kakaotalk.svg') no-repeat 50% 50%/contain}
.share-tool-facebook::before {content:''; display:inline-block; width:10px; height:19px; background:url('https://static.hankyung.com/img/www/w/news/view/icon-facebook.svg') no-repeat 50% 50%/contain}
.share-tool-twitter::before {content:''; display:inline-block; width:19px; height:16px; background:url('https://static.hankyung.com/img/www/w/news/view/icon-twitter.svg') no-repeat 50% 50%/contain}
.share-tool-more::before {content:''; display:inline-block; width:20px; height:20px; background:url('https://static.hankyung.com/img/www/w/news/view/icon-share-more.svg') no-repeat 50% 50%/contain}

.utility {padding:19px; border:1px solid #e3e3e3; border-radius:20px; background:#fff; box-shadow:3px 3px 7px rgba(0,0,0,.05)}
.utility .hk__tooltip {display:none; position:absolute; top:50%; left:60px; transform:translateY(-50%)}
.utility > .tools {text-align:center}
.utility > .tools > .tit {display:none; padding-bottom:2px; color:#888; font-size:12px}
.utility > .tools > ul > li, 
.utility > .tools > ul > li > .menuitem {position:relative}
.utility > .tools > ul > li:not(.active):hover .hk__tooltip {display:block}
.utility > .tools + .tools {margin-top:10px; padding-top:15px; border-top:1px solid #ddd}
.utility > .tools .tool {display:inline-flex; align-items:center; justify-content:center; width:100%; margin:5px 0; padding:10px 0}
.utility .login-tool-close-cleanview .hk__icon-x {width:20px; height:20px; background-color:#222; background-image:linear-gradient(to bottom, #fff 0%, #fff 100%), linear-gradient(to left, #fff 0%, #fff 100%); background-size:50% 2px,2px 50%; border-radius:100%}
.theme-list {position:absolute; top:50%; left:40px; transform:translateY(-50%); z-index:-1; visibility:hidden; opacity:0; display:flex; align-items:center; justify-content:space-between; width:0; padding:10px; border:1px solid #ddd; border-radius:8px; background:#fff; transition:all ease .2s}
.theme-list [class^="btn-theme"] {display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:10px; box-sizing:border-box; opacity:0}
.theme-list [class^="btn-theme"] .svg-check {display:none}
.theme-list .btn-theme-sepia {border:1px solid #d6cebf; background:#f7f1e6}
.theme-list .btn-theme-light {border:1px solid #ddd; background:#fff}
.theme-list .btn-theme-dark {border:1px solid #222; background:#222}
.water-fill {animation:wave 0.5s 7 linear, fill-up 3s ease-out}
.menuitem-theme:hover .water-fill {animation:wave 0.5s infinite linear, fill-up 3s infinite ease-out}
.menuitem-theme.active .theme-list {width:80px; opacity:1; visibility:visible; z-index:100}
.menuitem-theme.active .theme-list [class^="btn-theme"] {opacity:1}
@keyframes wave {
  0% {x:-30px}
  100% {x:0}
}
@keyframes fill-up {
  0% {y:35px}
  100% {y:0}
}

/* article */
.article-contents > .headline {margin-bottom:5px;  padding-right:170px; font-size:40px}

.byline-logo {display:inline-block; vertical-align:middle; background-repeat:no-repeat; background-size:contain}
.byline-logo.wsj {width:121px; height:11px; background-image:url('https://static.hankyung.com/img/logo/logo-wsj.svg')}
.byline-logo.logo__marketpro::before {width:77px; height:17px}
.article-byline-wrap {position:relative; margin-bottom:15px; padding-top:35px}
.article-byline-wrap .logo-area {position:absolute; top:0; left:0; margin-bottom:20px}
.article-byline-wrap .author-container {position:relative}
.article-byline-wrap .author-container .hk__tooltip {position:absolute; top:-30px; z-index:2}
.article-byline-wrap .author-list {display:flex; flex-wrap:wrap}
.article-byline-wrap .author {display:inline-flex; position:relative; margin:0 5px 5px 0; font-size:14px; line-height:29px; white-space:nowrap; box-sizing:border-box}
.article-byline-wrap .author > .item {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}
.article-byline-wrap .author.link > .item {padding:0 40px 0 15px}
.article-byline-wrap .author.link > .item + .btn-star-toggle {position:absolute; right:10px; top:50%; transform:translateY(-50%); height:25px; padding:5px}
.article-byline-wrap .author.link:hover > .item {box-shadow:3px 3px 7px rgb(0 0 0 / 15%)}

.article-timestamp {display:flex; align-items:center; justify-content:space-between; margin-bottom:30px; padding-bottom:15px; border-bottom:1px solid #222}
.article-timestamp .datetime {color:#666; font-size:14px}
.article-timestamp .datetime > .item + .item {margin-left:15px}
.article-timestamp .datetime > .item > span {margin-left:5px}

.article-body-wrap {font-size:18px; line-height:1.78em; word-break:keep-all; word-wrap:break-word}
.article-body-wrap.fontSize1 {font-size:14px}
.article-body-wrap.fontSize2 {font-size:16px}
.article-body-wrap.fontSize3 {font-size:18px}
.article-body-wrap.fontSize4 {font-size:20px}
.article-body-wrap.fontSize5 {font-size:22px}
.article-body-wrap.lineH1 {line-height:1.56em}
.article-body-wrap.lineH2 {line-height:1.78em}
.article-body-wrap.lineH3 {line-height:2em}
.article-body-wrap > .summary {margin-bottom:25px; font-weight:bold;}
.article-body-wrap > .summary::before {content:''; display:block; width:100px; height:6px; margin-bottom:15px; background:#e5e5e5}
.article-body-wrap > .summary.on {animation:leftIn ease 2s}

.article-body > *:first-child {margin-top:0 !important}
.article-body > *:last-child {margin-bottom:0 !important}

.article-body ol li, .article-body ul li {margin-left:25px}
.article-body ol, .article-body ol ol, .article-body ol li {list-style-type:decimal}
.article-body ol ol ol, .article-body ol ol li {list-style-type:upper-alpha}
.article-body ol ol ol ol, .article-body ol ol ol li {list-style-type:lower-alpha}
.article-body ol ol ol ol ol, .article-body ol ol ol ol li {list-style-type:decimal}
.article-body ol ul ul, .article-body ol ul li {list-style-type:disc}
.article-body ol ul ul ul, .article-body ol ul ul li {list-style-type:circle}
.article-body ol ul ul ul ul, .article-body ol ul ul ul li {list-style-type:square}
.article-body ul, .article-body ul ul, .article-body ul li {list-style-type:disc}
.article-body ul ul ul, .article-body ul ul li {list-style-type:circle}
.article-body ul ul ul ul, .article-body ul ul ul li {list-style-type:square}
.article-body ul ol ol, .article-body ul ol li {list-style-type:decimal}
.article-body ul ol ol ol, .article-body ul ol ol li {list-style-type:upper-alpha}
.article-body ul ol ol ol ol, .article-body ul ol ol ol li {list-style-type:lower-alpha}
.article-body ul ol ol ol ol ol, .article-body ul ol ol ol ol li {list-style-type:decimal}

.article-body table {/*table-layout:unset; max-width:100%;*/ margin:10px 0; width:100%; font-size:inherit}
.article-body table th,
.article-body table td {padding:5px 8px; border:1px solid #e5e5e5; font-size:inherit}
/*
.article-body table tr,
.article-body table th,
.article-body table td {width:auto !important; height:auto !important}
*/
.article-body hr {display:block; border-style:solid; border-color:#c3c3c3}

.article-btn-group {display:inline-flex; border:1px solid #ddd; border-radius:6px}
.article-btn-group > [class^="btn-"]:not(:first-child) {border-left:1px solid #ddd}
.article-btn-group > [class^="btn-"] {display:inline-flex; align-items:center; justify-content:center}

.article-figure {margin:30px auto; max-width:100%; text-align:center}
.article-figure .figure-img {display:inline-flex; position:relative; border-radius:20px; overflow:hidden; text-align:center; vertical-align:top}
.article-figure .figure-img img {max-width:100%; max-height:100%; object-fit:contain}
.article-figure .figure-img .btn-photo-viewer {position:absolute; right:15px; bottom:15px; width:50px; height:50px; border-radius:100%; background:rgba(34, 34, 34, .7)}
.article-figure .figure-img .btn-photo-viewer svg {position:relative; top:2px}
.article-figure .figure-caption {max-width:100%; margin:10px auto 0; color:#888; text-align:left; font-size:0.778em; line-height:1.57em}
.article-body-wrap.fontSize1 .figure-caption {font-size:12px}
.article-figure.img-lt {float:left; margin:15px 20px 15px 0}
.article-figure.img-rt {float:right; margin:15px 0 15px 20px}
.article-figure.img-lt .figure-img,
.article-figure.img-rt .figure-img {border-radius:10px}

.article-audio {height:70px; margin:30px auto}
.article-audio iframe {width:100%; max-height:100%}

.article-body > blockquote {position:relative; margin:30px 0; padding-left:15px; font-weight:normal}
.article-body > blockquote::before {content:''; position:absolute; top:6px; bottom:5px; left:0; width:6px; background-color:#e5e5e5}
.article-body > blockquote.on {animation:leftIn ease 2s}

.article-body .marker {color:#436f91; text-decoration:underline}

.article-body .stock-link-wrap {position:relative; display:inline-block}
.article-body .stock-link {color:#436f91; font-weight:bold; text-decoration:underline}
.article-body .stock-layer {display:none; position:absolute; z-index:2; border:1px solid #e3e3e3; border-radius:10px; background:#fff; box-shadow:3px 3px 7px rgba(0,0,0,.05); font-weight:normal}
.article-body .stock-layer > a {display:block; min-width:150px; padding:17px 19px; font-size:16px; line-height:1.5; text-decoration:none; box-sizing:border-box}
.article-body .stock-layer .rate {font-size:12px}
.article-body .stock-layer .txt-standard {margin-top:10px; color:#888; font-size:11px}
.article-body .stock-layer .read-more {margin-top:15px; color:#888; font-size:12px}
.article-body .stock-link-wrap:hover  .stock-layer {display:block}

.hk_sub_headline {display:block; margin:30px 0; padding:15px 0; border-top:2px solid #c3c3c3; border-bottom:1px solid #e5e5e5; color:#436f91; font-style:normal; font-weight:bold; font-size:1.25em; line-height:1.6; word-wrap:break-word; display:-webkit-box; -webkit-box-orient: vertical; clear:both}
.magazine_sub_headline {display:block; position:relative; margin:30px 0; padding:15px 0; border-top:2px solid #222; border-bottom:2px solid #222; font-weight:bold; font-size:1em; text-align:center; clear:both}
.magazine_sub_headline::before,
.magazine_sub_headline::after {content:''; display:block; position:absolute; left:0; right:0; height:1px; background:#999}
.magazine_sub_headline::before {top:3px}
.magazine_sub_headline::after {bottom:3px}

.article-video {margin:30px 0}
.article-video .iframe-youtube {border-radius:20px; overflow:hidden; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -webkit-transform:translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0)}

.article-slide-wrap {margin:30px 0}
.article-slide-wrap .article-figure {position:relative; margin:0 auto}
.article-slide-wrap .article-figure + .article-figure {margin-top:20px}
/* .article-slide-wrap .figure-img img {width:100%} */
.article-slide-wrap .article-slide {position:relative; border-radius:20px; overflow:hidden}
.article-slide-wrap .article-slide.slick-slider .article-figure {margin:0 !important}
.article-slide-wrap .article-slide.slick-slider .article-figure {display:flex; align-items:center; justify-content:center}
.article-slide-wrap .article-slide.slick-slider::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.15); border-radius:20px; pointer-events:none}
.article-slide-wrap .article-slide.slick-slider .article-figure .figure-img {border-radius:0}
.article-slide-option {display:flex; justify-content:space-between; margin-top:15px}
.article-slide-option .article-btn-group > [class^="btn-"] {min-width:38px; height:30px}
.article-slide-option .view-type .on .svg-icon {fill:#222}
.article-slide-option .view-paging {font-size:14px}
.article-slide-option .view-nav > [class^="btn-"]::before {content:''; display:inline-block; width:6px; height:6px}
.article-slide-option .view-nav .btn-prev::before {margin-left:3px; border-top:1px solid #222; border-left:1px solid #222; transform:rotate(-45deg)}
.article-slide-option .view-nav .btn-next::before {margin-right:3px; border-top:1px solid #222; border-right:1px solid #222; transform:rotate(45deg)}

.article-poll {display:flex; align-items:center; justify-content:space-between; margin:30px 0; padding:19px 28px; border:1px solid #ddd; border-radius:20px; background:#fff; box-shadow:3px 3px 7px rgba(0,0,0,.05)}
.article-poll .poll-contents {flex:1 1 auto; width:calc(100% - 90px)}
.article-poll .poll-contents .poll-tit {display:block; margin-bottom:14px}
.article-poll .poll-contents .poll-tit,
.article-poll .poll-contents .poll-question {font-size:18px; line-height:1.2}
.article-poll .btn-go-poll {flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:70px; height:70px; margin-left:20px; border-radius:100%; background:#436f91; color:#fff; font-size:14px; line-height:1.2}

.empathy-wrap {display:flex; justify-content:space-around; margin:40px 0 55px; padding:30px 0 0; border-top:1px solid #ddd}
.empathy-wrap .emotion-label {display:block; margin-top:10px; color:#888; font-size:12px}
.empathy-wrap .emotion-count {display:block; margin-top:2px; font-size:16px; letter-spacing:0}
.empathy-wrap .btn-like.on {color:#03a754}
.empathy-wrap .btn-like.on .svg-icon {fill:#03a754}
.empathy-wrap .btn-hate.on {color:#df1f51}
.empathy-wrap .btn-hate.on .svg-icon {fill:#df1f51}
.empathy-wrap .btn-want.on {color:#754bc2}
.empathy-wrap .btn-want.on .svg-icon {fill:#754bc2}
.empathy-wrap [class^="btn-"].on .emotion-label,
.empathy-wrap [class^="btn-"].on .emotion-count {color:inherit}
.empathy-wrap [class^="btn-"]:hover svg {animation:bounce 0.82s cubic-bezier(.36,.07,.19,.97) both; transform:translate3d(0, 0, 0)}

.article-tag {display:flex; flex-wrap:wrap; margin:30px 0 10px}
.article-tag .tag {display:inline-block; margin:0 10px 10px 0; padding:0 15px; border-radius:25rem; background-color:#eee; font-size:12px; line-height:29px; white-space:nowrap; font-size:14px}

.article > .btn-subscribe {display:flex; align-items:center; justify-content:center; width:100%; height:50px; margin:20px 0; border-radius:8px; background:#eee; color:#ff761b; font-size:16px}
.article > .btn-subscribe .txt {margin-left:10px}
.article > .btn-subscribe.btn-star-toggle .svg-icon {fill:#eee}
.article > .btn-subscribe.on {background:#fff7f1}

.article-copyright {display:flex; align-items:center; justify-content:space-between; margin-top:35px; font-size:14px}
.hk-subscribe-link {display:flex; align-items:center}
.hk-subscribe-link > a {display:inline-block; position:relative; padding:0 9px}
.hk-subscribe-link > a:first-child {padding-left:0}
.hk-subscribe-link > a:last-child {padding-right:0}
.hk-subscribe-link > a + a::before {content:''; position:absolute; top:50%; left:0; width:1px; height:14px; background:#ddd; transform:translateY(-50%)}

.article-label {margin-bottom:20px; font-size:18px}
.article-list-module > li {display:flex}
.article-list-module > li > .num {display:block; flex:0 0 auto; width:25px; padding-top:5px; font-size:18px; font-style:italic}
.article-list-module > li > .news-item {flex:1 1 auto}
.article-list-module > li + li {margin-top:20px}
.article-list-module .news-tit {max-height:26px; font-size:18px; line-height:26px; -webkit-line-clamp:1}
.article-list-module .lead {max-height:44px; margin-top:5px; line-height:22px; -webkit-line-clamp:2}
.article-list-module .thumb {width:100px; height:62px; margin-top:5px; margin-left:20px}

.related-article {margin:40px 0}

.slick-slide img {display:inline}
.hover-slide .slick-arrow {position:absolute; top:60px; z-index:2; width:50px; height:50px; border-radius:100%; background:#888; overflow:hidden; visibility:hidden; opacity:0; transition:all ease .3s; color:transparent}
.hover-slide .slick-arrow::before {content:''; position:absolute; top:50%; left:50%; width:15px; height:15px}
.hover-slide .slick-prev::before {margin:-8px 0 0 6px; border-top:1px solid #fff; border-left:1px solid #fff; transform:rotate(-45deg) translate(-50%, -50%)}
.hover-slide .slick-next::before {margin:4px 0 0 -12px; border-top:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg) translate(-50%, -50%)}
.hover-slide:hover .slick-arrow {visibility:visible; opacity:1}

.section-topnews {padding:35px 0; background:#eee}
.section-topnews .section-tit {margin-bottom:10px; /*font-size:20px*/ font-size:18px}
.section-topnews-slider {margin:0 -10px}
.section-topnews-slider .item {padding:0 10px}
.section-topnews-slider .slick-prev {left:-15px}
.section-topnews-slider .slick-next {right:-15px}
.section-topnews-slider .thumb {width:280px; height:175px}
.section-topnews-slider .news-tit {max-height:52px; margin-top:10px; /*font-size:24px; line-height:34px;*/ font-size:18px; line-height:26px; -webkit-line-clamp:2}
.section-topnews-slider .icon-membersonly {font-size:12px; vertical-align:1px}

/* aside */
.aside-component {margin-top:60px}
.aside-component.aside-ad {margin-top:30px}
.aside-component:first-child {margin:0}

.aside-tit-wrap {margin-bottom:15px}
.aside-tit-wrap .aside-tit {font-size:20px}
.aside-ad-component .aside-tit-wrap {margin-bottom:10px}
.aside-ad-component .aside-tit {display:flex; font-size:16px}
.aside-ad-component .ad-label {margin-left:5px; color:#888; font-weight:normal; font-size:11px}

.aside-list-thumb > li + li {margin-top:25px}
.aside-list-thumb .news-item {align-items:center}
.aside-list-thumb .news-item .thumb {width:88px; height:55px; margin-right:10px}
.aside-list-thumb .news-tit {max-height:44px; font-size:16px; line-height:22px; -webkit-line-clamp:2}

/* 댓글 */
.comments-sector-hk {margin-bottom:30px; border-top:1px solid #ddd}

/* 슬라이드다운 프로모션 배너 */
.promotion-floating {position:fixed; left:50%; z-index:99; width:600px; margin-left:-110px; border-radius:10px; font-size:13px; transform:translateX(-50%); opacity:0; visibility:hidden; box-sizing:border-box}
.promotion-floating a {text-decoration:none}
.promotion-floating .hk__icon-x {width:20px; height:20px; background-size:50% 2px,2px 50%; border-radius:100%}
.promotion-floating .promotion-inner {display:flex; align-items:center; justify-content:space-between; padding:10px 35px 10px 20px}
.promotion-floating .msg p + p {margin-top:3px}
.promotion-floating .btns {flex:0 0 auto; display:flex; align-items:center}
.promotion-floating .btn-promotion {display:inline-flex; line-height:26px; padding:0 15px; border-radius:25rem; font-size:11px}
.promotion-floating .btn-close-promotion {margin-left:10px}
.promotion-floating > .btn-close-promotion {position:absolute; top:50%; right:10px; transform:translateY(-50%)}
.isSticky .promotion-floating {opacity:1; visibility:visible; animation:promoionShow .5s both ease-in-out}

.promotion-floating.bg-white {background:#fff; border:1px solid #ddd}
.promotion-floating.bg-white .txt-point {color:#ee4c4c}
.promotion-floating.bg-white .btn-promotion {background:#eee}
.promotion-floating.bg-white .hk__icon-x {background-image:linear-gradient(to bottom, #888 0%, #888 100%), linear-gradient(to left, #888 0%, #888 100%)}

.promotion-floating.bg-red {background:#ee4c4c; color:#fff}
.promotion-floating.bg-red a {color:#fff}
.promotion-floating.bg-red .txt-point {color:#fffb8d}
.promotion-floating.bg-red .btn-promotion {background:#bb2525}
.promotion-floating.bg-red .hk__icon-x {background-image:linear-gradient(to bottom, #fff 0%, #fff 100%), linear-gradient(to left, #fff 0%, #fff 100%)}

.promotion-floating.bg-hk {background:#243065; color:#fff}
.promotion-floating.bg-hk a {color:#fff}
.promotion-floating.bg-hk .txt-point {color:#fffb8d}
.promotion-floating.bg-hk .btn-promotion {background:#fff; color:#243065}
.promotion-floating.bg-hk .hk__icon-x {background-image:linear-gradient(to bottom, #fff 0%, #fff 100%), linear-gradient(to left, #fff 0%, #fff 100%)}

.promotion-floating.bg-gray {background:#4b505e; color:#fff}
.promotion-floating.bg-gray a {color:#fff}
.promotion-floating.bg-gray .txt-point {color:#fffb8d}
.promotion-floating.bg-gray .btn-promotion {background:#2f3545}
.promotion-floating.bg-gray .hk__icon-x {background-image:linear-gradient(to bottom, #fff 0%, #fff 100%), linear-gradient(to left, #fff 0%, #fff 100%)}

/* 프로모션 배너(디자인2) */
.promotion-floating2 {position:fixed; left:50%; z-index:99; width:700px; margin-left:-110px; border-radius:10px; background:#fff; box-shadow:1px 1px 7px rgba(0,0,0,.1); font-size:13px; transform:translateX(-50%); opacity:0; visibility:hidden; box-sizing:border-box}
.promotion-floating2 a {text-decoration:none}
.promotion-floating2 .hk__icon-x {width:20px; height:20px; border-radius:100%}
.promotion-floating2 .promotion-inner {display:flex; align-items:center; justify-content:center; padding:20px 50px}
.promotion-floating2 .promotion-inner::before {content:''; display:block; flex:0 0 auto; width:80px; height:82px; margin-right:30px; background:url('https://static.hankyung.com/img/www/w/news/view/promotion/img-login.svg') no-repeat 0 0/contain}
.promotion-floating2 .msg p + p {margin-top:3px}
.promotion-floating2 .txt-lg {font-size:17px}
.promotion-floating2 .msg .btns {display:flex; gap:10px; margin-top:15px}
.promotion-floating2 .msg .btns .btn {flex:0 0 auto; display:inline-flex; justify-content:center; min-width:120px; border-radius:25rem; font-size:13px; line-height:30px; white-space:nowrap}
.promotion-floating2 .btn-promotion-pramary {background:#ff761b; color:#fff}
.promotion-floating2 .btn-close-promotion {position:absolute; top:15px; right:15px}
.isSticky .promotion-floating2 {opacity:1; visibility:visible; animation:promoionShow .5s both ease-in-out}

@keyframes promoionShow {
  0% {top:-100px}
  80% {top:76px}
  90% {top:60px}
  100% {top:66px}
}
@media only screen and (max-width: 1250px) {
    .promotion-floating {transform:none; left:320px}
	.promotion-floating2 {transform:none; left:270px}
}

/* 클린뷰 */
.theme-sepia .btn-theme-sepia .svg-check,
.theme-light .btn-theme-light .svg-check,
.theme-dark .btn-theme-dark .svg-check {display:inline-block}

.theme-sepia {background:#f7f1e6; color:#4b3321}
.theme-sepia a,
.theme-sepia .empathy-wrap .emotion-count {color:#4b3321}
.theme-sepia .article-figure .figure-caption,
.theme-sepia .article-body .stock-layer .txt-standard,
.theme-sepia .article-body .stock-layer .read-more,
.theme-sepia .empathy-wrap .emotion-label {color:#9c9690}
.theme-sepia .utility,
.theme-sepia .article-byline-wrap .author > .item,
.theme-sepia .article-body .stock-layer,
.theme-sepia .article-poll,
.theme-sepia .theme-list {background:#f7f1e6; border-color:#d6cebf}
.theme-sepia .foot-inner,
.theme-sepia .foot-cont,
.theme-sepia .utility > .tools + .tools {border-color:#eae3d4}
.theme-sepia .article-body-wrap > .summary::before,
.theme-sepia .article-body > blockquote::before {background:#d6cebf}
.theme-sepia .hk_sub_headline {border-top-color:#d6cebf; border-bottom-color:#eae3d4}
.theme-sepia .article-btn-group,
.theme-sepia .article-btn-group > [class^="btn-"],
.theme-sepia .magazine_sub_headline,
.theme-sepia .empathy-wrap,
.theme-sepia .article-body table th,
.theme-sepia .article-body table td,
.theme-sepia .theme-list .btn-theme-light {border-color:#d6cebf}
.theme-sepia .magazine_sub_headline::before,
.theme-sepia .magazine_sub_headline::after,
.theme-sepia .article-tag .tag,
.theme-sepia .article > .btn-subscribe,
.theme-sepia .section-topnews {background:#eae3d4}
.theme-sepia .article > .btn-subscribe.btn-star-toggle .svg-icon {fill:#eae3d4}
.theme-sepia .btn-star-toggle .svg-icon {stroke:#4b3321; fill:#f7f1e6}
.theme-sepia #waterdrop-fill {fill:#f7f1e6}
.theme-sepia .article-slide-option .view-type .svg-icon {fill:#d6cebf}
.theme-sepia .article-slide-option .view-type .on .svg-icon {fill:#4b3321}
.theme-sepia .article-slide-option .view-nav > [class^="btn-"]::before,
.theme-sepia .article-timestamp {border-color:#4b3321}
.theme-sepia .btn-star-toggle.on .svg-icon {stroke:#ff761b; fill:#ff761b}
.theme-sepia .hk-modal,
.theme-sepia .hk-modal a {color:#222}
.theme-sepia .hk-modal .modal-btn-confirm {color:#fff}
.theme-sepia .promotion-floating.bg-white {border-color:#d6cebf; background:#f7f1e6}
.theme-sepia .promotion-floating.bg-white .hk__icon-x {background-image: linear-gradient(to bottom, #4b3321 0%, #4b3321 100%), linear-gradient(to left, #4b3321 0%, #4b3321 100%)}

.theme-dark {background:#232324; color:#c3c3c3}
.theme-dark a:not(.modal-btn-confirm),
.theme-dark .article-body table th,
.theme-dark .article-body table td,
.theme-dark .empathy-wrap .emotion-count {color:#c3c3c3}
.theme-dark .article-body [style*="color:#000000"] {color:#c3c3c3 !important}
.theme-dark .utility,
.theme-dark .article-byline-wrap .author > .item,
.theme-dark .article-body .stock-layer,
.theme-dark .article-poll,
.theme-dark .hk__toast,
.theme-dark .theme-list {background:#232324; border-color:#444}
.theme-dark .foot-inner,
.theme-dark .foot-cont,
.theme-dark .utility > .tools + .tools {border-color:#2c2c2c}
.theme-dark .article-body-wrap > .summary::before,
.theme-dark .article-body > blockquote::before {background:#444}
.theme-dark .hk_sub_headline {border-top-color:#444; border-bottom-color:#444; color:#5b97ca}
.theme-dark .article-btn-group,
.theme-dark .article-btn-group > [class^="btn-"],
.theme-dark .magazine_sub_headline,
.theme-dark .empathy-wrap,
.theme-dark .article-body table th,
.theme-dark .article-body table td,
.theme-dark .article-timestamp,
.theme-dark .cmt__tool-area .cmt__btn-txt {border-color:#444}
.theme-dark .magazine_sub_headline::before,
.theme-dark .magazine_sub_headline::after,
.theme-dark .article-tag .tag,
.theme-dark .article > .btn-subscribe {background:#2c2c2c}
.theme-dark .article > .btn-subscribe.btn-star-toggle .svg-icon {fill:#2c2c2c}
.theme-dark .section-topnews,
.theme-dark .hk__tooltip {background:#444}
.theme-dark .hk__tooltip::before {border-right-color:#444}
.theme-dark .btn-star-toggle .svg-icon {stroke:#888; fill:#232324}
.theme-dark #waterdrop-fill {fill:#232324}
.theme-dark .article-slide-option .view-type .svg-icon,
.theme-dark .article > .btn-subscribe .svg-icon {fill:#444}
.theme-dark .btn-font .svg-icon,
.theme-dark .article-slide-option .view-type .on .svg-icon {fill:#888}
.theme-dark .article-slide-option .view-nav > [class^="btn-"]::before {border-color:#888}
.theme-dark .btn-star-toggle.on .svg-icon {stroke:#ff761b; fill:#ff761b}
.theme-dark .article-slide-wrap .article-slide.slick-slider::after {border-color:rgba(255,255,255,.15)}
.theme-dark .share-tool-kakao::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-kakaotalk-gray.svg')}
.theme-dark .share-tool-facebook::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-facebook-gray.svg')}
.theme-dark .share-tool-twitter::before {background-image:url('https://static.hankyung.com/img/www/w/news/view/icon-twitter-gray.svg')}
.theme-dark .membership-tool .tool:not(.btn-star-toggle) .svg-icon {fill:#888}
.theme-dark .utility .login-tool-close-cleanview .hk__icon-x {background-color:#888}
.theme-dark .theme-list .btn-theme-sepia {border-color:#e4d0b0; background:#e4d0b0}
.theme-dark .theme-list .btn-theme-light {border-color:#fff}
.theme-dark .theme-list .btn-theme-dark {border-color:#434343}
.theme-dark .byline-logo.wsj {background-image:url('https://static.hankyung.com/img/logo/logo-wsj-w.svg')}
.theme-dark .layer-offcanvas,
.theme-dark .hk-modal-inner {background:#232324}
.theme-dark .hk-modal button {color:#c3c3c3}
.theme-dark .modal-btn-outline,
.theme-dark .modal-journalist .popular-article,
.theme-dark .modal-journalist .btn-journalist-subscribe {border-color:#444}
.theme-dark .ui-slider::before,
.theme-dark .modal-font .font-control-list li {background:#444}
.theme-dark .hk-modal .modal-btn-confirm {color:#fff}
.theme-dark .ui-state-default {background:#c3c3c3}
.theme-dark .hk__icon-x {background-image:linear-gradient(to bottom, #c3c3c3 0%, #c3c3c3 100%), linear-gradient(to left, #c3c3c3 0%, #c3c3c3 100%)}
.theme-dark .scroll-indicator {border:none}
.theme-dark .scroll-indicator > div {top:0; background:#5b97ca}
.theme-dark .promotion-floating.bg-white {border-color:#444; background:#232324}
.theme-dark .promotion-floating.bg-white .hk__icon-x {background-image: linear-gradient(to bottom, #c3c3c3 0%, #c3c3c3 100%), linear-gradient(to left, #c3c3c3 0%, #c3c3c3 100%)}

.theme-sepia .header-section,
.theme-sepia .header-section a,
.theme-dark .header-section,
.theme-dark .header-section a,
.isSticky .theme-sepia .view .article-contents > .headline,
.isSticky .theme-dark .view .article-contents > .headline {color:#222}

/* 타블라(추천뉴스) */
#taboola-desktop-article-stream .trc_rbox_header,
#taboola-desktop-article-stream .video-title,
#taboola-desktop-article-stream .branding,
#taboola-desktop-article-stream button.video-cta-button {font-family:-apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",sans-serif !important}
.theme-light div.videoCube a.video-cta-style a.video-cta-href button.video-cta-button {border-color:#ddd !important; color:#222 !important}
.theme-sepia .thumbnails-stream-desktop .trc_rbox_header,
.theme-sepia .thumbnails-stream-desktop .syndicatedItem .video-title,
.theme-sepia .thumbnails-stream-desktop .video-title {color:#4b3321}
.theme-sepia .thumbnails-stream-desktop .syndicatedItem .branding,
.theme-sepia .thumbnails-stream-desktop .logoDiv a span {color:#9c9690}
.theme-sepia div.videoCube a.video-cta-style a.video-cta-href button.video-cta-button {border-color:#d6cebf !important; color:#4b3321 !important}
.theme-dark .thumbnails-stream-desktop .trc_rbox_header,
.theme-dark .thumbnails-stream-desktop .syndicatedItem .video-title,
.theme-dark .thumbnails-stream-desktop .video-title {color:#c3c3c3}
.theme-dark .thumbnails-stream-desktop .syndicatedItem .branding,
.theme-dark .thumbnails-stream-desktop .logoDiv a span {color:#888}
.theme-dark div.videoCube a.video-cta-style a.video-cta-href button.video-cta-button {border-color:#444 !important; color:#c3c3c3 !important}

/* animation */
@keyframes bounce {
	0%, 20%, 80%, 100% {transform: translateY(0);} 
	40% {transform: translateY(-10px)} 
	50% {transform: translateY(5px)} 
	65% {transform: translateY(-5px)} 
	75% {transform: translateY(5px)} 
	90% {transform: translateY(-2px)} 
}
@keyframes leftIn {
	0% {transform: translateX(-50px)} 
	100% {transform: translateX(0)} 
}

@media all and (max-width:1240px){
	.btn-top-wrap .btn-position {right:-520px}
}

@media all and (max-height:700px){
	.article-container > .utility {top:140px; transition:position ease .3s}
	.isSticky .article-container > .utility {top:80px}
	.utility > .tools .tool {padding:7px 0}
}
@media all and (min-height:900px){
	.layer-fullpopup.show .layer-offcanvas.bottom {top:690px}
}