@charset "UTF-8";

/* 
 * 매거진한경 반응형 개편 v2021
 */

/* reset */
html,body {-webkit-text-size-adjust:none}
body,div,span,em,strong,select,section,article,nav,footer,header,address,caption,figure,figcaption,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p,textarea,input,button,tr,th,td,table {margin:0; padding:0}
body, button, input, select, option, textarea, table, th, td {color:#222; font-size:14px; font-family:'Apple SD Gothic Neo','AppleGothic','Droid Sans fallback',sans-serif}
h1,h2,h3,h4,h5,h6 {font-size:100%}
ol,ul,li {list-style-type:none}
img,fieldset, iframe {border:0 none; vertical-align:top}
img {max-width:100%}
input,button,select,textarea,label {vertical-align:middle; resize:none; outline:none}
input,textarea {-webkit-appearance:none; -webkit-border-radius:0}
input[type="checkbox"] {-webkit-appearance:checkbox}
input[type="radio"] {-webkit-appearance:radio; -webkit-border-radius:10px}
input[type="button"], input[type="submit"], input[type="reset"] {cursor:pointer}
button {border:0 none; background:transparent; cursor:pointer}
i,em,address,optgroup {font-style:normal}
hr {display:none}
table {border-collapse:collapse; border-spacing:0}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block}
legend, .blind {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
caption {width:0; height:0; overflow:hidden; color:transparent; text-indent:-9999px}
a {color:#222; text-decoration:none}
a:hover {text-decoration:underline}
/* skip-navi */
.skip-navi a {display:block; height:0; margin:0 auto; overflow:hidden; font-size:0; text-align:center; background:#142c67; color:#fff}
.skip-navi a:hover, .skip-navi a:active, .skip-navi a:focus {height:30px; font-size:15px; line-height:30px}
/* global */
.txt-en,
.txt-num {letter-spacing:0}

.txt-lt {text-align:left}
.txt-ct {text-align:center}
.txt-rt {text-align:right}

a[class^="btn-"],
button[class^="btn-"] {display:inline-block}

.is-pc {display:none}
.is-mobile {display:block}
.is-mobile.inline {display:inline}

body {min-width:320px}
.cont-inner {position:relative; margin:0 20px}

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

/* .news-list .thumb {position:relative; overflow:hidden; text-align:center} 
.news-list .thumb > a::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd; border-radius:9px}
.news-list .thumb img {width:auto; min-height:auto; max-height:100%; object-fit:fill} */

.news-tit,
.news-subtit,
.lead {display:block; display:-webkit-box; text-overflow:clip; overflow:hidden; word-break:break-all;/*word-break:keep-all; word-wrap:break-word;*/ -webkit-box-orient:vertical}
.news-subtit,
.lead {color:#888}
.news-subtit {font-size:16px}
.lead {font-size:13px}

.date {color:#888; font-size:12px; letter-spacing:0}

.bul-dot li {position:relative; padding-left:10px}
.bul-dot li::before {content:""; display:inline-block; position:absolute; top:10px; left:0; width:4px; height:4px; border-radius:50%; background-color:#222}

.text-underline {text-decoration:underline}

/* IR */
.btn-login::before,
.btn-user::before,
.btn-open-search::before,
.btn-search::before,
.btn-close-search::before,
/* .share-sns [class^="sns-"]::before, */
.paging .btn-first::before,
.paging .btn-prev::before,
.paging .btn-next::after,
.paging .btn-end::after,
.utility > div > [class^="btn-"]::before,
.layer-sns .share-sns-list [class^="btn-"]::before,
.layer-sns .btn-copy-url::before,
.layer-font [class^="btn-"]::before,
.btn-img-big::before,
.list-toggle::after,
.btn-audio::before,
.writer-info .photo::after,
.sns-group [class^="icon-sns-"]::before {
    background-image:url('//static.hankyung.com/img/magazine/2021/common/spr-icon-20220114.svg');
    background-repeat:no-repeat;
}
.logo-magazine {display:inline-block; width:124px; height:31px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-magazine.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-business {display:inline-block; width:110px; height:17px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-business.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-business.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-business-w.svg')}
.logo-money {display:inline-block; width:52px; height:18px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-money2.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-money.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-money2-w.svg')}
.logo-jobnjoy {display:inline-block; width:74px; height:25px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-jobnjoy.svg?v=202101181541') no-repeat 0 0/contain; vertical-align:top}
.logo-jobnjoy.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-jobnjoy-w.svg?v=202101181541')}
.logo-jobnjoy2 {display:inline-block; width:55px; height:30px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-jobnjoy2.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-jobnjoy2.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-jobnjoy2-w.svg')}
.logo-mook {display:inline-block; width:110px; height:19px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-mook.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-mook.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-mook-w.svg')}
.logo-esg {display:inline-block; width:140px; height:30px; background:url('https://static.hankyung.com/img/logo/logo-esg2.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-esg.white {background-image:url('https://static.hankyung.com/img/logo/logo-esg2-w.svg')}
.logo-9to9 {display:inline-block; width:140px; height:22px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-9to9.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-9to9.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-9to9-w.svg')}
.logo-bettergolf {display:inline-block; width:140px; height:18px; background:url('//static.hankyung.com/img/magazine/2021/common/logo-bettergolf.svg') no-repeat 0 0/contain; vertical-align:top}
.logo-bettergolf.white {background-image:url('//static.hankyung.com/img/magazine/2021/common/logo-bettergolf-w.svg')}

/* .share-sns [class^="sns-"]::before {content:''; display:inline-block}
.sns-f-business::before {width:27px; height:23px; background-position:0 -45px}
.sns-f-money::before {width:27px; height:23px; background-position:-73px -45px} 
.sns-insta::before {width:21px; height:21px; background-position:-145px -45px}
.sns-naver-post::before {width:16px; height:25px; background-position:-218px -43px}
.sns-naver-news::before {width:19px; height:17px; background-position:-291px -47px} */

.sns-group [class^="icon-sns-"]::before {content:''; display:inline-block; vertical-align:top}
.icon-sns-naver::before {width:18px; height:17px; margin-top:3px; background-position:-292px -47px}
.icon-sns-facebook::before {width:12px; height:21px; background-position:0 -45px}
.icon-sns-npost::before {width:15px; height:25px; background-position:-219px -43px}
.icon-sns-instagram::before {width:20px; height:21px; background-position:-146px -45px}
.icon-sns-youtube::before {width:21px; height:17px; margin-top:2px; background-position:-73px -48px}

/* 브라우저 지원 안내(lte IE9) */
.browser-support-info {background:#16394d}
.browser-support-info .layout-inner {position:relative; padding:20px 50px 20px 20px}
.browser-support-info .info-txt {color:#fff; font-size:15px; line-height:24px}
.browser-support-info .browser-list {margin-top:10px; overflow:hidden}
.browser-support-info .browser-list > a {float:left; width:42px; height:40px}
.browser-support-info .browser-list > a + a {margin-left:30px}
.browser-support-info .layout-inner::after {content:''; display:block; clear:both}
.browser-support-info .btn-close-info {position:absolute; top:20px; right:20px; width:30px; height:30px}
.browser-support-info .btn-close-info::before,
.browser-support-info .btn-close-info::after {content:''; display:inline-block; width:1px; height:26px; background:#fff}
.browser-support-info .btn-close-info::before {transform:rotate(45deg)}
.browser-support-info .btn-close-info::after {transform:rotate(-45deg)}
/* header */
.header {padding-top:20px; border-bottom:1px solid #ddd;}
.header .logo {text-align:center}
.header .link-subscribe {display:none}

.header .login-area {position:absolute; top:5px; right:40px}
.header .btn-login,
.header .btn-user {transform:scale(.9); transform-origin:right top}
.header .btn-login::before,
.header .btn-user::before {content:''; display:inline-block; vertical-align:top}
.header .btn-login::before {width:24px; height:24px; background-position:-216px 0}
.header .btn-user::before {width:26px; height:26px; background-position:-289px 0}
.header .login-area .layer-my {position:absolute; top:30px; right:-50px; 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 .login-area .layer-my [class^="btn-"] {text-decoration:none}
.header .login-area .layer-my > div + div {border-top:1px solid #ddd}
.header .login-area .layer-my .user-info {padding:24px 20px; text-align:center}
.header .login-area .layer-my .user-info .name,
.header .login-area .layer-my .user-info .email {overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.header .login-area .layer-my .user-info .name {font-size:17px}
.header .login-area .layer-my .user-info .email {margin:10px 0 15px; font-size:14px; letter-spacing:0}
.header .login-area .layer-my .user-info .account-info .email {margin:0}
.header .login-area .layer-my .user-info .social-user {margin:10px 0 15px; font-size:14px; letter-spacing:0}
.header .login-area .layer-my .user-info .social-user::before {content:''; display:inline-block; position:relative; width:18px; margin-right:4px; overflow:hidden; vertical-align:-3px; background-image:url('https://static.hankyung.com/img/www/w/common/2021/spr-common-20210811.svg'); background-repeat:no-repeat}
.header .login-area .layer-my .user-info .social-user.social-apple::before {height:17px; background-position:-123px -35px}
.header .login-area .layer-my .user-info .social-user.social-google::before {height:15px; background-position:-72px -35px}
.header .login-area .layer-my .user-info .social-user.social-kakao::before {height:15px; background-position:-99px -34px}
.header .login-area .layer-my .user-info .social-user.social-naver::before {height:15px; background-position:1px -35px}
.header .login-area .layer-my .user-info .social-user.social-facebook::before {height:17px; background-position:-22px -35px}
.header .login-area .layer-my .user-info .social-user::after {content:''; display:inline-block; width:1px; height:18px; vertical-align:-5px}
.header .login-area .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 .login-area .layer-my .use-service {padding:24px 20px}
.header .login-area .layer-my .use-service li {position:relative; padding-left:7px}
.header .login-area .layer-my .use-service li:before {content:''; position:absolute; top:7px; left:0; width:2px; height:2px; background:#222}
.header .login-area .layer-my .use-service li + li {margin-top:10px}
.header .login-area .layer-my .btn-logout {display:block; width:100%; font-size:13px; line-height:40px; text-align:center}
.header .login-area .layer-my.active {visibility:visible; z-index:999; transform:scale(1); opacity:1}

.header .btn-open-search::before,
.header .btn-search::before {content:''; display:inline-block; width:20px; height:20px; background-position:-73px -2px}
.header .btn-close-search::before {content:''; display:inline-block; width:17px; height:17px; background-position:-145px -4px}
.header .btn-open-search {position:absolute; top:6px; right:0}
.header .btn-close-search {display:none; position:absolute; top:8px; right:0}
.header .search-area .layer-search {height:0; position:relative; margin-top:10px; overflow:hidden; z-index:-1; opacity:0; transition:all ease .3s}
.header .search-area .layer-search .inp-txt{width:100%; height:40px; padding:0 48px 1px 18px; border:1px solid #ddd; border-radius:8px; box-sizing:border-box; background:#fff; color:#222; font-size:16px} 
.header .search-area .layer-search .btn-search {position:absolute; top:10px; right:14px}
.header .search-area.active .btn-open-search {display:none}
.header .search-area.active .btn-close-search {display:block}
.header .search-area.active .layer-search {height:40px; overflow:visible; z-index:1; opacity:1}

.banner-top {text-align:center}
.banner-top > a {display:block}
.banner-top img {max-width:320px}

/* 회원 아이콘 */
.icon-myinfo::before {content:''; display:inline-block; width:12px; height:12px; margin-right:4px; background:url('https://static.hankyung.com/img/common/icon/icon-myinfo.svg') no-repeat 50% 50%/contain}
[class^="icon-mylogin-"] {display:inline-block; width:24px; height:24px; border-radius:25rem; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; vertical-align:middle}	
.icon-mylogin-email {background:#142c67 url('https://static.hankyung.com/img/logo/logo-short-hk-w.svg') no-repeat 3px 50%/17px 9px}
.icon-mylogin-kakao {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-kakao.svg')}
.icon-mylogin-naver {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-naver.svg')}
.icon-mylogin-apple {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-apple.svg')}
.icon-mylogin-google {background-image:url('https://static.hankyung.com/img/common/icon/social/icon-cir-google.svg')}
.header .login-area .layer-my .user-info .btns {margin-top: 20px}
.header .login-area .layer-my .user-info .btns [class^="btn-"] {display: inline-block; width: 90px; height: 35px; margin: 0 3px; border: 1px solid #c3c3c3; border-radius: 20px; line-height: 33px; font-size:14px; box-sizing: border-box}

.gnb {padding-top:9px; margin-bottom:-1px}
.gnb > ul {display:flex; justify-content:space-between; align-items:flex-end}
.gnb > ul > li {position:relative; flex:0 0 auto; padding-bottom:15px}
.gnb > ul > li.on::after {content:''; display:block; position:absolute; left:0; bottom:0; right:0; height:4px; background:#222}
.ie9 .gnb > ul {display:table; width:100%}
.ie9 .gnb > ul > li {display:table-cell; width:33.33336%; text-align:center}
.ie9 .gnb > ul > li:first-child {text-align:left}
.ie9 .gnb > ul > li:last-child {text-align:right}
.magazine-category-wrap {position:relative; height:40px; border-top:1px solid #ddd; background:#eee; overflow:hidden; white-space:nowrap}
.magazine-category-wrap:before,
.magazine-category-wrap:after {content:''; display:block; position:absolute; top:0; width:20px; height:100%; z-index:2}
.magazine-category-wrap:before {left:0; background:-moz-linear-gradient(left, rgba(238, 238, 238,1) 0%, rgba(238, 238, 238,0.75) 51%, rgba(238, 238, 238,0) 100%); background:-webkit-linear-gradient(left, rgba(238, 238, 238,1) 0%, rgba(238, 238, 238,0.75) 51%, rgba(238, 238, 238,0) 100%); background:linear-gradient(to right, rgba(238, 238, 238,1) 0%, rgba(238, 238, 238,0.75) 51%, rgba(238, 238, 238,0) 100%)}
.magazine-category-wrap:after {right:0; background:-moz-linear-gradient(left, rgba(238, 238, 238,0) 0%, rgba(238, 238, 238,0.75) 51%, rgba(238, 238, 238,1) 100%); background:-webkit-linear-gradient(left, rgba(238, 238, 238,0) 0%, rgba(238, 238, 238,0.75) 51%, rgba(238, 238, 238,1) 100%); background: linear-gradient(to right, rgba(238, 238, 238,0) 0%, rgba(238, 238, 238,0.75) 51%, rgba(238, 238, 238,1) 100%)}
.magazine-category-wrap  .inner-scroll {height:100%; padding:0 15px 80px; overflow-x:scroll; overflow-y:hidden; text-align:center; box-sizing:border-box; -webkit-overflow-scrolling:touch}
.magazine-category {display:inline-block}
.magazine-category .item {display:inline-block; font-size:16px; line-height:40px}
.magazine-category .item + .item {margin-left:25px}

.magazine-category .btn-subscription {position:relative; top:2px; margin-left:5px; color:#142c67; font-weight:bold; font-size:16px; text-decoration:underline}
.magazine-category .btn-subscription::before {content:''; display:inline-block; width:16px; height:18px; margin-right:5px; background:url('https://static.hankyung.com/img/magazine/2021/common/icon-bookmark.svg') no-repeat 0 0/contain; vertical-align:-3px}
.magazine-category .btn-e-magazine {position:relative; top:2px; margin-left:5px; color:#e13030; font-weight:bold; font-size:16px; text-decoration:underline}
.magazine-category .btn-e-magazine::before {content:''; display:inline-block; width:15px; height:18px; margin-right:5px; background:url('https://static.hankyung.com/img/magazine/2021/common/icon-emagazine.svg') no-repeat 0 0/contain; vertical-align:-3px}

.magazine-category-wrap.tag-type .tit {position:relative; top:1px; margin:0 10px 0 5px; font-size:16px; vertical-align:middle}
.magazine-category-wrap.tag-type .item {vertical-align:middle}
.magazine-category-wrap.tag-type .item + .item {margin-left:10px}
.magazine-category-wrap.tag-type .item > a {display:inline-block; position:relative; height:26px; padding:1px 10px 0; border:1px solid #ddd; border-radius:5px; background:#f3f3f3; font-weight:normal; font-size:14px; line-height:1.1; text-align:center; box-sizing:border-box}
.magazine-category-wrap.tag-type .item > a::before {content:''; display:inline-block; width:1px; height:24px; vertical-align:-8px}

/* header logo type(error, sitemap) */
.header-logo-type .cont-inner {border-bottom:3px solid #222}
.header-logo-type .logo {padding:30px 0 20px}
.header-logo-type .logo-txt {display:inline-block; margin-left:6px; font-size:22px; vertical-align:middle}
.header-logo-type.center .logo {text-align:center}

/* footer */
.footer {margin-top:20px}
.footer .foot-cont {padding:20px 0; border-top:1px solid #eee}
.footer .logo-magazine {width:112px; height:16px; background:url('https://static.hankyung.com/img/magazine/2021/common/logo-hk-magazine.svg') no-repeat 0 0/112px 15px}
.footer .foot-tit {display:block; margin-bottom:15px; font-weight:normal; font-size:16px}
.footer .service-menu > li {float:left; min-height:21px; font-size:16px; line-height:21px}
.footer .service-menu::after {content:''; display:block; clear:both}
.foot-magazine .service-menu + .service-menu {margin-top:10px}
.foot-magazine .service-menu > li {margin:4px 25px 4px 0}
.footer .hk-group .service-menu {margin-top:-5px}
.footer .hk-group .service-menu > li {width:33.33336%; height:21px; margin:4px 0; font-size:14px}
.foot-info .f-item {display:block; line-height:1.5}
/* .footer .share-sns {margin-top:20px}
.footer .share-sns > li {float:left; width:20%; text-align:center}
.footer .share-sns .txt {display:none; font-size:11px}
.footer .share-sns::after {content:''; display:block; clear:both} */
.foot-sns {margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #eee}
.foot-sns .sns-group dl {width:250px; margin:0 auto; font-size:14px}
.foot-sns .sns-group dt,
.foot-sns .sns-group dd {float:left; line-height:25px}
.foot-sns .sns-group dt {width:110px}
.foot-sns .sns-group dl + dl {margin-top:18px}
.foot-sns .sns-group li {float:left; min-width:25px; text-align:center}
.foot-sns .sns-group li > a {display:inline-block; padding:0 5px}
.foot-sns .sns-group li + li {margin-left:25px}
.foot-sns .sns-group dl::after,
.foot-sns .sns-group ul::after {content:''; display:block; clear:both}

.btn-top {position:fixed; right:20px; bottom:60px; z-index:10; width:40px; height:40px; border-radius:50%; background:rgba(136,136,136,.7)}
.btn-top::before {content:''; display:inline-block; position:absolute; top:calc(50% + 2px); left:50%; width:10px; height:10px; border-top:1px solid #fff; border-left:1px solid #fff; transform:rotate(45deg) translate(-50%, -50%); transform-origin:left top}
/* AD */
.ad-area {margin:20px auto; text-align:center}
.ad-aside {text-align:center}
.ad-area * {max-width:100% !important; /*width:100% !important*/}
.ad-area > img {width:auto !important}
.banner-aside {text-align:center}
.banner-aside img {min-width:300px; max-width:300px}
/* 하단 고정 광고 */
.ad-bottom-fix {position:fixed; bottom:0; left:0; z-index:2; width:100%; background-color:#f2f2f2; text-align:center}
.ad-bottom-fix div {margin:0 auto}
/* 닫기 버튼 있는 광고 */
.btn-close-ad {display:none}
.btn-close-ad::before,
.btn-close-ad::after {content:''; position:absolute; left:50%; top:0; width:1px; height:20px; background-color:#fff}
.btn-close-ad:before {transform:translate(-50%) rotate(45deg)}
.btn-close-ad:after {transform:translate(-50%) rotate(-45deg)}
.ad-bottom-fix.close-ad {background:rgba(0,0,0,0.6); min-height:50px}
.ad-bottom-fix.close-ad .ad-inner {margin-left:-20px}
.ad-bottom-fix.close-ad .btn-close-ad {display:block; position:absolute; top:50%; right:50%; width:20px; height:20px; margin:-10px -175px 0 0}
@media all and (max-width:359px){
	.ad-bottom-fix.close-ad .ad-inner {margin-left:0}
	.ad-bottom-fix.close-ad .btn-close-ad {top:0; margin:0 -160px 0 0; background:rgba(0,0,0,0.6)}
}
/* 기사뷰 내 광고 추천광고 */
.ad-recommend {margin:25px 0 15px}
/* 좌우 날개 광고 */
.fltAd {position:absolute; top:0; left:50%; width:1px; height:0}
.fltAd .left {position:absolute; top:450px; left:-760px; text-align:right}
.fltAd .left div + div {margin-top:300px}
.fltAd .right {position:absolute; top:450px; right:-760px; text-align:left}
/* .fltAd .right #stickyAd {position:absolute} */

/* main */
.main-top {padding-top:30px}
.main-top .logo-business {width:158px; height:23px}
.main-top .logo-money {width:80px; height:28px}
.main-top .logo-jobnjoy {width:113px; height:38px}
.main-top article {position:relative; padding-bottom:20px}
.main-top article::before {content:''; display:block; position:absolute; top:92px; left:-20px; right:-20px; bottom:0;}
.main-top article + article {margin-top:40px}
.main-top .news-top {position:relative}
.main-top .news-top .magazine-tit {margin-bottom:10px}
.main-top .news-top .thumb {position:relative; height:0; padding-bottom:62.5%}
.main-top .news-top .thumb > a {position:absolute; top:0; right:0; bottom:0; left:0}
.main-top .news-top .news-tit {max-height:60px; margin-top:13px; font-size:24px; line-height:30px; -webkit-line-clamp:2}
.main-top .news-top .news-subtit,
.main-top .news-top .lead {margin-top:10px; max-height:40px; line-height:20px; -webkit-line-clamp:2}
.main-top .news-top .news-subtit {font-weight:bold}
.main-top .news-top .date {margin-top:10px}
.main-top .main-news-list {position:relative; margin-top:20px}
.amagazine-business::before {background:#edf1fc}
.amagazine-money::before {background:#fef2f3}
.amagazine-jobnjoy::before {background:#edf7fc}

.main-news-list > li {display:flex; align-items:center; justify-content:space-between}
.main-news-list > li + li {margin-top:15px}
.main-news-list .thumb {flex:0 0 auto; width:110px; height:69px}
.main-news-list .txt-cont {flex:0 0 auto; width:calc(100% - 120px)}
.main-news-list .txt-cont .news-tit {max-height:48px; font-weight:normal; font-size:19px; line-height:24px; -webkit-line-clamp:2}
.main-news-list .txt-cont .date {margin-top:2px}
.ie9 .main-news-list > li {display:table}
.ie9 .main-news-list > li .thumb,
.ie9 .main-news-list .txt-cont {display:table-cell; vertical-align:middle}
.ie9 .main-news-list > li .thumb + .txt-cont {padding-left:10px}

.magazine-subscribe {padding:30px 0 40px; background:#65616f}
.magazine-subscribe .main-tit {margin-bottom:-5px; font-size:24px; text-align:center}
.magazine-subscribe .main-tit,
.magazine-subscribe .main-tit a {color:#fff}
.magazine-list .item {padding-top:20px; text-align:center; outline:none;}
.magazine-list .magazine-img {position:relative; display:inline-block; width:174px; height:218px; background:#d9d9db url('//static.hankyung.com/img/magazine/2021/m/bg-book.png') no-repeat 0 0/174px 218px; box-shadow:7px 7px 25px rgba(0,0,0,0.8)}
.magazine-list .magazine-img > a {position:absolute; top:15px; right:16px; bottom:15px; left:16px; overflow:hidden}
.magazine-list .magazine-img > a img {width:100%; min-height:100%; object-fit:cover}
.magazine-list .magazine-info {margin-top:20px; color:#fff}
.magazine-list .magazine-info dt {margin-bottom:17px}
.magazine-list .magazine-info dt .logo-business {width:123px; height:19px}
.magazine-list .magazine-info dt .logo-money {width:56px; height:19px}
.magazine-list .magazine-info dt .logo-jobnjoy {width:84px; height:28px; margin-top:-11px}
.magazine-list .magazine-info dt .logo-mook {width:110px; height:19px}
.magazine-list .magazine-info dt .logo-esg {width:89px; height:19px}
.magazine-list .magazine-info .desc {display:none; font-size:12px}
.magazine-list .magazine-info .price {margin:0 0 10px; font-size:24px; letter-spacing:0}
.magazine-list .btn-subscribe {display:inline-block; min-width:78px; height:34px; padding:0 20px; border-radius:17px; background:#95919f; color:#fff; font-size:16px; line-height:1.1; outline:none; text-decoration:none; box-sizing:border-box}
.magazine-list .btn-subscribe::after {content:''; display:inline-block; width:1px; height:100%; vertical-align:-11px}
.magazine-list .btn-subscribe + .btn-subscribe {margin-left:4px}
.magazine-list .slick-arrow {display:none !important} 

.ranking-news .cont-inner {margin-top:40px}
.ranking-news .main-tit {margin-bottom:15px; font-size:19px}
/* sub common */
.container {position:relative; padding:30px 0 10px}
.sub-tit-wrap {margin-bottom:15px; padding-bottom:12px; border-bottom:1px solid #eee}
.sub-tit-wrap .sub-tit {font-size:24px}

.sub-tit-wrap .sub-tit.breadcrumb > a + a::before {content:''; display:inline-block; position:relative; top:-3px; width:10px; height:10px; margin-right:10px; border-top:1px solid #222; border-right:1px solid #222; transform:rotate(45deg)}

.tag-list {font-size:0}
.tag-list .tag {display:inline-block; height:25px; margin:5px 5px 0 0; padding:0 10px; border-radius:4px; background:#eee; color:#888; font-size:14px; line-height:25px}
/* aside */
.aside-module + .aside-module {margin-top:30px}

.aside-video .video-area {position:relative; max-width:300px; height:0; margin:0 auto; padding-bottom:56.25%; overflow:hidden; padding-bottom:182px}
.aside-video .video-area::before,
.aside-video .video-area::after {content:''; display:block; position:absolute; left:0; right:0; z-index:2; background:#fff}
.aside-video .video-area::before {top:0; height:7px}
.aside-video .video-area::after {bottom:0; height:6px}
.aside-video .video-area iframe {position:absolute; top:0; left:0; width:100%; height:100%}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.aside-video::after {content:''; display:block; position:absolute; top:0; right:0; bottom:0; z-index:2; width:1px; background:#fff}
}

.aside-news-list > li + li {margin-top:10px}
.aside-news-list .news-cont {display:table; width:100%; box-sizing:border-box}
.aside-news-list .news-cont .txt-cont,
.aside-news-list .news-cont .thumb-cont {display:table-cell; vertical-align:middle}
.aside-news-list .txt-cont .news-tit {max-height:52px; font-weight:normal; font-size:19px; line-height:26px; -webkit-line-clamp:2}
.aside-news-list .news-cont .thumb-cont {width:100px}
.aside-news-list .news-cont .thumb {width:100px; height:63px}
.aside-news-list .news-cont .thumb-cont + .txt-cont {padding-left:15px} 

.aside-tab {margin-bottom:20px; border:1px solid #ddd}
.aside-tab > li {position:relative; float:left; width:50%; text-align:center; box-sizing:border-box}
.aside-tab > li > a {display:block; height:48px; font-size:19px; text-decoration:none}
.aside-tab > li > a::after {content:''; display:inline-block; width:1px; height:48px; vertical-align:-16px}
.aside-tab > li.on::after {content:''; display:block; position:absolute; top:-1px; left:-1px; right:-1px; bottom:-1px; border:1px solid #222; box-sizing:border-box; pointer-events:none}
.aside-tab > li.on > a {font-weight:bold}
.aside-tab::after {content:''; display:block; clear:both}
/* list */
.news-list > li {padding:15px 0; border-top:1px solid #eee}
.news-list > li:first-child {padding-top:0; border-top:none}
.news-list > li:last-child {border-bottom:1px solid #eee}
.news-list .news-cont {display:table; width:100%; box-sizing:border-box}
.news-list .news-cont .txt-cont,
.news-list .news-cont .thumb-cont {display:table-cell; vertical-align:top}
.news-list .txt-cont .news-tit {font-weight:normal; font-size:19px; line-height:26px}
.news-list .txt-cont .lead {display:none; max-height:40px; margin-top:10px; color:#888; font-size:13px; line-height:20px; -webkit-line-clamp:2}
.news-list .txt-cont .date {margin-top:10px}
.news-list .news-cont .thumb-cont {width:100px}
.news-list .news-cont .thumb {width:100px; height:63px}
.news-list .news-cont .txt-cont + .thumb-cont {padding-left:15px} 
.news-list .tag-list {margin-top:5px}

.paging {position:relative; margin:20px 0; padding-bottom:20px; border-bottom:1px solid #eee; text-align:center}
.paging a,
.paging strong {display:inline-block; height:32px; font-size:16px; line-height:32px; vertical-align:middle; box-sizing:border-box}
.paging .num a,
.paging strong {min-width:38px; padding:0 5px; border:1px solid #fff; line-height:30px}
.paging strong {border-color:#222}
.paging .txt {display:none; font-size:13px}
.paging .btn-first::before {content:''; display:inline-block; width:9px; height:10px; background-position:0 -335px}
.paging .btn-prev::before {content:''; display:inline-block; width:6px; height:10px; background-position:-20px -335px}
.paging .btn-next::after {content:''; display:inline-block; width:6px; height:10px; background-position:-36px -335px}
.paging .btn-end::after {content:''; display:inline-block; width:10px; height:10px; background-position:-52px -335px}
.paging .btn-first,
.paging .btn-end {display:none}
.paging .btn-prev,
.paging .btn-next {position:absolute; top:0; width:32px}
.paging .btn-prev {left:0}
.paging .btn-next {right:0}
/* search */
.search-result {padding:25px 15px; font-size:19px; text-align:center}
.search-re {position:relative}
.search-re .inp-txt{width:100%; height:50px; padding:0 50px 1px 18px; border:1px solid #ddd; border-radius:8px; box-sizing:border-box; background:#fff; color:#222; font-size:16px} 
.search-re .btn-search {position:absolute; top:15px; right:17px}
.search-re .btn-search::before {content:''; display:inline-block; width:20px; height:20px; background-position:-73px -2px}
/* view */
.breadcrumb {margin-bottom:10px; font-size:0}
.breadcrumb > li {display:inline-block; font-size:13px}
.breadcrumb > li:last-child {font-weight:bold}
.breadcrumb > li + li::before {content:'>'; margin:0 4px; font-family:serif}

.article-head .news-tit {font-size:25px}
.utility-wrap {margin:20px 0}
.utility-wrap .date-info {margin-top:20px; color:#888; font-size:12px}
.utility-wrap .date-info > span + span::before {content:'|'; position:relative; top:-1px; margin:0 4px 0 0px}
.utility-wrap .date-info .txt-num {margin-left:4px}

.utility::after {content:''; display:block; clear:both}
.utility [class^="btn-"] {vertical-align:top; box-sizing:border-box; text-decoration:none}
.utility [class^="btn-"]::before {content:''; display:inline-block}
.utility > div > [class^="btn-"] {position:relative; width:36px; height:36px; border:1px solid #dedede; border-radius:100%}
.utility > div > [class^="btn-"] + [class^="btn-"] {margin-left:4px}
.utility > div > [class^="btn-"]::before {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%)}
.utility .util-share {float:left}
.util-share .btn-util-facebook::before {width:9px; height:18px; background-position:0 -97px}
.util-share .btn-util-twitter::before {width:18px; height:16px; background-position:-73px -98px}
.util-share .btn-util-kakao::before {width:17px; height:16px; background-position:-146px -98px}
.util-share .btn-util-more::before {width:17px; height:4px; background-position:-219px -104px}
.layer-sns {display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:1000}
.layer-sns::before {content:''; position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,0.5)}
.layer-sns .layer-inner {position:absolute; top:50%; left:50%; width:320px; padding:15px 15px 30px; background:#fff; transform:translate(-50%, -50%); border-radius:3px; box-shadow:0 0 15px rgba(0,0,0,.2); box-sizing:border-box}
.layer-sns .layer-tit {margin-bottom:15px; font-size:14px; text-align:center}
.layer-sns .share-sns-list > [class^="btn-"] {float:left; width:33.33336%; margin-bottom:10px; text-align:center}
.layer-sns .share-sns-list > [class^="btn-"]::before {width:41px; height:41px}
.layer-sns .share-sns-list > [class^="btn-"] .txt {display:block; font-size:12px; line-height:20px}
.layer-sns .share-sns-list::after {content:''; display:block; clear:both}
.layer-sns .btn-share-facebook::before {background-position:0 -227px}
.layer-sns .btn-share-twitter::before {background-position:-72px -227px}
.layer-sns .btn-share-kakao::before {background-position:-145px -227px}
.layer-sns .btn-share-naver::before {background-position:-219px -227px}
.layer-sns .btn-share-band::before {background-position:-291px -227px}
.layer-sns .btn-share-daumcafe::before {background-position:-364px -227px}
.layer-sns .share-url {position:relative; display:block; width:220px; height:36px; margin:0 auto 20px; padding:0 38px 0 10px; border:1px solid #e2e2e2; line-height:36px; overflow:hidden; box-sizing:border-box}
.layer-sns .share-url .url {display:block; color:#888; font-size:12px; line-height:34px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; letter-spacing:0}
.layer-sns .share-url .btn-copy-url {position:absolute; top:0; right:0; width:38px; height:34px; background-color:#999}
.layer-sns .share-url .btn-copy-url::before {width:16px; height:16px; background-position:-438px -239px}
/* .layer-sns .share-sns > li {float:left; width:25%; text-align:center}
.layer-sns .share-sns > li > a {display:block; position:relative; padding-top:35px; text-decoration:none}
.layer-sns .share-sns::after {content:''; display:block; clear:both}
.layer-sns .share-sns .txt {font-size:11px}
.layer-sns .share-sns [class^="sns-"]::before {position:absolute; top:3px; left:50%; transform:translateX(-50%)}
.layer-sns .share-sns.sns-naver-post::before {top:1px}
.layer-sns .share-sns .sns-naver-news::before {top:5px} */
.layer-sns .naver-channel {margin-top:20px; text-align:center}
.layer-sns .naver-channel .btn-naver-channel {display:inline-block; width:220px; height:35px; border-radius:18px; background:#3bc33d; color:#fff; font-size:14px; line-height:34px; text-decoration:none; box-sizing:border-box}
.layer-sns .btn-close-layer {position:absolute; top:15px; right:15px; width:20px; height:20px}
.layer-sns .btn-close-layer::before,
.layer-sns .btn-close-layer::after {content:''; display:inline-block; width:1px; height:20px; background:#9d9d9d}
.layer-sns .btn-close-layer::before {transform:rotate(45deg)}
.layer-sns .btn-close-layer::after {transform:rotate(-45deg)}
.layer-sns.active {display:block}
.utility .util-font {position:relative; float:right}
.util-font .btn-util-font::before {width:19px; height:14px; background-position:-292px -99px}
.layer-font {display:none; position:absolute; right:0; bottom:-72px; width:220px; padding:14px 0; text-align:center; background-color:#fff; border:1px solid #e2e2e2; -webkit-box-shadow:0px 0px 10px 3px rgba(0,0,0,0.08); -moz-box-shadow:0px 0px 10px 3px rgba(0,0,0,0.08); box-shadow:0px 0px 10px 3px rgba(0,0,0,0.08); vertical-align:top; z-index:10}
.layer-font > button {position:relative; width:32px; height:32px; overflow:hidden; border:1px solid #dedede; border-radius:50%; background:#fff}
.layer-font > button + button {margin-left:4px}
.layer-font > button::before {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%)}
.layer-font > button.on {border-color:#999; background:#999}
.layer-font .btn-fs05::before {width:14px; height:16px; background-position:0 -146px}
.layer-font .btn-fs04::before {width:13px; height:14px; background-position:-73px -147px}
.layer-font .btn-fs03::before {width:11px; height:12px; background-position:-146px -148px}
.layer-font .btn-fs02::before {width:9px; height:10px; background-position:-219px -149px}
.layer-font .btn-fs01::before {width:8px; height:9px; background-position:-292px -150px}
.layer-font .btn-fs05.on::before {background-position:0 -186px}
.layer-font .btn-fs04.on::before {background-position:-73px -187px}
.layer-font .btn-fs03.on::before {background-position:-146px -188px}
.layer-font .btn-fs02.on::before {background-position:-219px -189px}
.layer-font .btn-fs01.on::before {background-position:-292px -189px}
.layer-font.active {display:block}
.util-audio-area iframe {margin:0 !important; z-index:999 !important}

.article-body {padding:20px 0 0; font-size:20px; line-height:1.5}
.article-body > p {margin:25px 0; display:-webkit-box; -webkit-box-orient:vertical; word-break:keep-all; word-wrap:break-word}
.article-body em ,
.article-body i {font-style:italic}
.article-body table {width:100%; border-collapse:collapse; table-layout:fixed}
.article-body table,
.article-body table th,
.article-body table td {border:1px solid #e5e5e5}
.article-body table th,
.article-body table td {padding:5px 8px}
.article-body blockquote {position:relative; margin:20px 0; padding:19px; /*border:1px solid #e5e5e5; background:#f7f7f7*/}
.article-body blockquote .svg-quote {fill:#666; display:block; width:22px; height:17px; margin-bottom:10px}
.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 .summary {position:relative; margin-bottom:25px; padding-left:15px; font-weight:normal}
.article-body .summary:before {content:''; display:block; position:absolute; top:5px; bottom:2px; left:0;  width:3px; background-color:#e5e5e5}
.article-copy {font-size:20px}

.article-figure {margin:25px 0; text-align:center}
.figure-img {position:relative; display:inline-block; max-width:inherit}
.figure-img .btn-img-big {position:absolute; right:0px; bottom:0px; width:45px; height:45px; background-color:rgba(0,0,0,0.6)}
.figure-img .btn-img-big::before {content:''; display:inline-block; position:absolute; top:50%; left:50%; width:26px; height:26px; background-position:-219px -290px; transform:translate(-50%, -50%)}
.figure-caption {max-width:100%; margin:10px auto; color:#888; font-size:0.6em; line-height:1.3; text-align:left}

.article-audio-player {position:relative; height:60px; margin:20px auto; padding:13px 66px 0 80px; border:1px solid #e7e7e7; border-radius:30px; box-sizing:border-box}
.article-audio-player .btn-audio {display:inline-block; position:absolute; top:13px; width:32px; height:32px; outline:none}
.article-audio-player .btn-audio::before {content:''; display:inline-block}
.article-audio-player .btn-audio.play {left:26px; width:33px; height:33px}
.article-audio-player .btn-audio.play::before {width:22px; height:24px; background-position:-291px -294px}
.article-audio-player.playing .btn-audio.play::before {width:33px; height:33px; background-position:-339px -290px}
.article-audio-player .btn-audio.mute {right:24px}
.article-audio-player .btn-audio.mute::before {width:23px; height:17px; background-position:-393px -298px}
.article-audio-player.muted .btn-audio.mute::before {width:23px; height:17px; background-position:-443px -298px}
.article-audio-player .progress-controls {position:relative; padding:15px 47px 0 0}
.article-audio-player .progress-bar {position:relative; height:2px; background-color:#e5e5e5}
.article-audio-player .progress-bar .progress-bar-played {position:relative; height:100%; background-color:#222}
.article-audio-player .progress-bar .progress-handle {position:absolute; top:-9px; display:inline-block; width:18px; height:18px; margin-left:-9px; border-radius:100%; border:1px solid #c6c6c6; background-color:#fff; box-shadow:0 0 2px rgba(0,0,0,.1); outline:0; cursor:pointer}
.article-audio-player .progress-time {position:absolute; top:0; right:0; height:32px; color:#777; font-size:13px; line-height:30px; letter-spacing:0}

.article-video {margin:20px 0; padding:5px; border-radius:4px; background:#000; overflow:hidden; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0)}
.article-video .video-link {height:35px; padding-top:10px; text-align:center}
.article-video .btn-go-video {display:inline-block; color:#fff !important; font-size:16px; vertical-align:top}
.article-video .youtube {position:relative; height:0; padding-bottom:56.25%; /* 4:3 75%, 16:9 56.25% */ overflow:hidden}
.article-video .youtube iframe {position:absolute; top:0; left:0; width:100%; height:100%}

.marker {color:inherit; text-decoration:none !important; box-shadow:inset 0 -8px 0 #cddcff; overflow-wrap:break-word; word-wrap:break-word; word-break:break-word; -webkit-tap-highlight-color:rgba(0,0,0,0)}
.marker:hover {background:#cddcff}
.stock-point {text-decoration:none !important}
.stock-point > span {letter-spacing:0}
.stock-point.hold {color:#222; box-shadow:inset 0 -1px 0 #222}
.stock-point.up {color:#ff000a !important; box-shadow:inset 0 -1px 0 #ff000a}
.stock-point.down {color:#457fff !important; box-shadow:inset 0 -1px 0 #457fff}

.article-tag {margin:30px 0}
.article-tag a {display:inline-block; margin-top:6px; margin-right:1px; padding:3px 9px; border-radius:3px; background-color:#f7f7f7; font-size:14px}

.article-writer {margin:30px 0 50px}
.article-writer .writer-info {display:inline-block}
.article-writer .writer-info .photo {display:inline-block; width:25px; height:25px; margin-right:6px; border-radius:100%; overflow:hidden; vertical-align:middle}
.article-writer .writer-info .photo > img {width:100%; height:100%; object-fit:cover; object-position:left top}
.article-writer .writer-info .photo::after {content:''; display:inline-block; width:25px; height:25px; background-position:0 -290px}
.article-writer .writer-info .name {font-size:15px; vertical-align:middle}
.article-writer .writer-info + .writer-info {margin-left:20px}
.article-writer + .ad-area.is-mobile {margin-top:-20px; margin-bottom:30px}

.article-headline {display:block; margin:25px 0 15px; padding:12px 0 11px; border-top:2px solid #c3c3c3; border-bottom:1px solid #e5e5e5; font-style:normal; font-weight:bold; font-size:1.1em; line-height:1.36em; word-wrap:break-word; display:-webkit-box; -webkit-box-orient:vertical}

.related-area {margin:15px 0}
.related-area .tit-wrap {margin-bottom:5px; text-align:center}
.related-area .tit-wrap .list-tit {display:inline-block; padding:5px 0;font-weight:bold; font-size:17px; border-top:3px solid #222}
/* .related-area .tit-wrap .list-tit.list-toggle {cursor:pointer}
.related-area .tit-wrap .list-tit.list-toggle::after {content:''; display:inline-block; width:16px; height:16px; margin-left:8px; background-position:-72px -290px; vertical-align:-3px}
.related-area.active .tit-wrap .list-tit.list-toggle:after {background-position:-96px -290px} */
.related-list .news-tit {display:block; font-weight:normal; font-size:19px; line-height:1.8; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.related-list .news-tit::before  {content:''; display:inline-block; width:2px; height:2px; margin-right:8px; background-color:#222; vertical-align:5px}
.related-list.more {display:none}
.related-area.active .related-list.more {display:block}
.comment-area {margin:30px 0}
/* error */
.error-contents {padding:10% 6% 8%; text-align:center; word-break:keep-all}
.error-contents .error-msg {font-weight:bold; font-size:22px}
.error-contents .info-txt {margin-top:20px; font-size:16px}
.error-contents .move-page {margin-top:30px}
.error-contents .move-page a {display:inline-block; margin:3px 15px; font-size:15px; text-decoration:underline}
/* sitemap */
.news-archive {padding:20px 0}
.news-archive-tit {margin-bottom:5px; font-weight:bold; font-size:15px}
.news-archive-list {margin:0 -10px; overflow:hidden}
.news-archive-list li {float:left; width:60px}
.news-archive-list a {display:block; padding:5px 10px; color:#5c7bc2; letter-spacing:0}
.news-archive-list:after {content:''; display:block; clear:both}
.news-archive-day dl + dl {margin-top:25px}
.news-archive-day dt {font-weight:bold; font-size:15px}
.news-archive-day dd li {float:left; width:40px; margin-top:2px; color:#999; font-size:13px; letter-spacing:0; text-align:right}
.news-archive-day dd li a {color:#5c7bc2}
.news-archive-day dd ul:after {content:''; display:block; clear:both}
.archive-article li {position:relative; margin-top:20px; padding-left:10px}
.archive-article li:before {content:'· '; position:absolute; top:1px; left:0; color:#5c7bc2}
.archive-article .news-tit {font-weight:normal; font-size:17px}
.archive-article .news-tit a {color:#5c7bc2}
/* company */
.company-wrap {font-size:15px; line-height:1.6}
.company-wrap .img-magazine {margin-bottom:20px; text-align:center}
.company-wrap .cont-tit {margin:20px 0 10px; font-size:17px}
.company-wrap .cont-tit .num {font-size:25px; vertical-align:-3px}
.company-wrap .cont-tit:first-of-type {margin-top:0}
.company-wrap .cont-info p {color:#555}
.company-wrap .cont-info dl {margin:15px 0}
.company-wrap .cont-info dt {margin-bottom:5px}
.company-wrap .cont-info .logo-txt {display:inline-block; padding:4px 4px 2px; line-height:1.1; color:#fff; font-size:17px; background:#96c0df}
.company-wrap .history-list {border-top:2px solid #00448d}
.company-wrap .history-list li {padding:10px 0}
.company-wrap .history-list li + li {border-top:1px solid #ececec}
.company-wrap .history-list li > div {position:relative; padding-left:90px}
.company-wrap .history-list li > div .history-date {position:absolute; top:0; left:0; width:80px; font-weight:bold; color:#00448d; text-align:right; letter-spacing:0}
.company-wrap .history-list li > div .history-txt {word-break:keep-all}
.company-wrap .history-list li > div + div {margin-top:20px}
.company-wrap .history-list li.hidden-point ~ li {display:none}
.company-wrap .history-list.active li.hidden-point ~ li {display:block}
.company-wrap .history-list.active + .btn-more-history > span::after {transform:rotate(-135deg); vertical-align: baseline}
.company-wrap .btn-more-history {display:block; width:100%; padding:20px 0; border-top:1px solid #eaeaea; border-bottom:1px solid #eaeaea; text-align:center}
.company-wrap .btn-more-history > span::after {content:''; display:inline-block; width:6px; height:6px; margin-left:6px; border-right:1px solid #222; border-bottom:1px solid #222; vertical-align:4px; transform:rotate(45deg)}
.company-wrap .img-map {text-align:center}
.company-wrap .contact-area {position:relative; padding-left:110px}
.company-wrap .contact-area dt {position:absolute; top:0; left:0; width:105px; font-weight:bold}
.company-wrap .contact-area dd > span {display:block}
.company-wrap .contact-area dd > span em {display:inline-block; width:30px; font-weight:normal}
.company-wrap .contact-area dd > span + span {margin-top:5px}
.company-wrap .contact-area dl + dl {margin-top:10px}
/* 구독신청 */
.page-subscription .subscription-wrap {max-width:740px; margin:0 auto}
.page-subscription iframe {width:100%; overflow:hidden}
/* 광고문의 */
.page-advertisement .sub-tit-wrap {margin:0}
.advertisement-info {max-width:740px; margin:0 auto}
.advertisement-category {position:relative; height:50px; overflow:hidden; white-space:nowrap; border-bottom:1px solid #ececec}
.advertisement-category::before,
.advertisement-category::after {content:''; display:block; position:absolute; top:0; width:20px; height:100%; z-index:2}
.advertisement-category::before {left:0; background:-moz-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.75) 51%, rgba(255, 255, 255, 0) 100%); background:-webkit-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.75) 51%, rgba(255, 255, 255, 0) 100%); background:linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.75) 51%, rgba(255, 255, 255, 0) 100%)}
.advertisement-category::after {right:0; background:-moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 51%, rgba(255, 255, 255, 1) 100%); background:-webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 51%, rgba(255, 255, 255, 1) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 51%, rgba(255, 255, 255, 1) 100%)}
.advertisement-category .inner-scroll {height:100%; padding:0 20px 80px; overflow-x:scroll; overflow-y:hidden; text-align:center; box-sizing:border-box; -webkit-overflow-scrolling:touch; text-align:center}
.advertisement-category ul {display:inline-block}
.advertisement-category ul li {position:relative; display:inline-block; padding:10px 0; vertical-align:middle}
.advertisement-category ul li a {display:block; padding:3px 15px; color:#223870; font-weight:500; font-size:16px; line-height:25px; box-sizing:border-box; box-sizing:border-box; text-decoration:none}
.advertisement-category ul li.on::before {z-index:-1; content:""; display:block; position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; height:auto; padding:15px; border-radius:20px; background-color:#223870; box-sizing:border-box}
.advertisement-category ul li.on a {position:relative; color:#fff; font-weight:bold}
.advertisement-info {padding:30px 0 0; font-size:15px; line-height:1.6}
.advertisement-info .cont-tit {display:block; width:100%; margin-bottom:23px; padding:10px 0; border-radius:20px; font-weight:600; color:#00448d; font-size:16px; text-align:center; background-color:#dfebf8; box-sizing:border-box}
.advertisement-info .category-logo {margin-bottom:25px; text-align:center}
.advertisement-info .category-logo .logo-business {width:142px; height:22px}
.advertisement-info .category-logo .logo-money {width:64px; height:22px}
.advertisement-info .category-logo .logo-jobnjoy {width:89px; height:30px}

.advertisement-info .cont-info p {color:#555}
.advertisement-info .cont-info p + p {margin-top:10px}
.advertisement-info .cont-info dl {margin:15px 0}
.advertisement-info .cont-info dt {margin-bottom:5px; font-weight:bold}
.advertisement-info .unit {margin-bottom:5px; color:#777; font-size:14px; line-height:23px; letter-spacing:-0.01em; text-align:right}
.advertisement-info .cont-list li {padding:15px 0; border-top:1px solid #e3e3e3; box-sizing:border-box}
.advertisement-info .cont-list .tit {display:block; font-size:17px}
.advertisement-info .cont-list .desc {font-size:21px}
.advertisement-info .cont-list li .page-name {float:left; font-size:17px; line-height:33px}
.advertisement-info .cont-list li .page-name > span {margin-left:10px; color:#555; letter-spacing:0}
.advertisement-info .cont-list li .price {float:right; font-size:21px; letter-spacing:0}
.advertisement-info .cont-list li::after {content:''; display:block; clear:both}
.advertisement-info .contact {margin:25px 0 0; padding:25px 15px; font-size:14px; background-color:#f3f3f3}
.advertisement-info .contact > strong,
.advertisement-info .contact > ul {float:left}
.advertisement-info .contact > strong {width:85px; margin-bottom:10px; font-weight:bold}
.advertisement-info .contact > ul {min-width:65%}
.advertisement-info .contact > ul li + li {margin-top:10px}
.advertisement-info .contact > ul li > em,
.advertisement-info .contact > ul li > span {display:inline-block; vertical-align:middle}
.advertisement-info .contact > ul li > em {width:24px; height:24px}
.advertisement-info .contact > ul li > em.tel {background:url('//static.hankyung.com/img/magazine/m/icon-tel.png') no-repeat center; background-size:cover}
.advertisement-info .contact > ul li > em.fax {background:url('//static.hankyung.com/img/magazine/m/icon-fax.png') no-repeat center; background-size:cover}
.advertisement-info .contact > ul li > em.email {background:url('//static.hankyung.com/img/magazine/m/icon-email.png') no-repeat center; background-size:cover}
.advertisement-info .contact > ul li > span {margin-left:12px; letter-spacing:0}
.advertisement-info .contact::after {content:""; display:block; clear:both}
.advertisement-jobnjoy .cont-info p + p {margin-top:25px}
.advertisement-jobnjoy .cont-info dl {margin-top:30px}
.advertisement-jobnjoy .cont-list {border-bottom:1px solid #e3e3e3}
.advertisement-jobnjoy .bul-dot {margin-top:10px}

/* cp */
.cp-wrap {max-width:740px; margin:0 auto}
.cp-nav {margin-bottom:50px}
.cp-nav > li {float:left; width:50%}
.cp-nav > li > a {display:block; box-shadow:1px 0 0 0 #ddd, 0 1px 0 0 #ddd, 1px 1px 0 0 #ddd, 1px 0 0 0 #ddd inset, 0 1px 0 0 #ddd inset; line-height:58px; font-size:19px; text-align:center}
.cp-nav > li.on {position:relative}
.cp-nav > li.on > a {background:#fff; box-shadow:1px 0 0 0 #222, 0 1px 0 0 #222, 1px 1px 0 0 #222, 1px 0 0 0 #222 inset, 0 1px 0 0 #222 inset; font-weight:bold}
.cp-nav::after {content:''; display:block; clear:both}
.cp-cont .tit-cont {margin-bottom:15px; font-weight:bold; font-size:22px}
.cp-cont p {font-size:16px; line-height:1.7}
.cp-cont + .cp-cont {margin-top:40px}
.cp-info-intro::after {content:''; display:block; width:242px; height:222px; margin:10px auto 0; background:url('https://static.hankyung.com/img/magazine/2021/w/bg-cp-info.png') no-repeat 0 0/contain}
.cp-item-box {display:flex; flex-wrap:wrap; flex-direction:column; justify-content:space-between; margin:-10px -5px}
.cp-item-box > li {flex:0 0 auto; margin:10px 5px; box-sizing:border-box}
.cp-item-box .in {height:100%; padding:17px 20px; background:#6fc5da; color:#fff; font-size:16px; line-height:1.7; box-sizing:border-box}
.cp-item-box .in br {display:none}
.cp-item-box dt {font-weight:bold; font-size:19px}
.cp-item-box dd {margin-top:3px}
.cp-workflow {margin:30px 0}
.cp-workflow li {position:relative}
.cp-workflow li .cp-work {position:relative; padding:10px 20px 10px 50px; border-radius:4px; background:linear-gradient(90deg, rgba(53,86,147,1) 50px, rgba(111,149,218,1) 50px); color:#fff; font-size:16px; text-align:center}
.cp-workflow li .cp-work span {vertical-align:middle}
.cp-workflow li .num,
.cp-workflow li .txt {font-weight:bold}
.cp-workflow li .num {position:absolute; left:0; width:50px; margin:0 30px 0 2px}
.cp-workflow li + li::before {content:''; display:block; width:20px; height:20px; margin:0 auto 15px; border-right:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1; transform:rotate(45deg)}
.work-area {margin:20px 0}
.work-area dl {position:relative; margin:17px 0; padding-left:20px; font-size:16px; line-height:1.4}
.work-area dl::before {content:''; position:absolute; top:3px; left:0; bottom:3px; width:4px; background:#6f95da}
.work-area dt {margin-bottom:7px; font-weight:bold; font-size:19px} 
.work-area li {position:relative; padding-left:10px}
.work-area li::before {content:'·'; position:absolute; top:0; left:0}
.cp-portfolio .cp-cont ul {display:flex; flex-wrap:wrap; margin:0 -15px}
.cp-portfolio .cp-cont li {flex:0 0 calc(50% - 30px); margin:0 15px 30px}
.cp-portfolio .cp-cont .thumb {position:relative; width:100%; padding-bottom:125%; border-radius:0; box-sizing:border-box}
.cp-portfolio .cp-cont .thumb::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd}
.cp-portfolio .cp-cont .thumb img {position:absolute; top:50%; left:0; width:auto; min-height:auto; transform:translateY(-50%)}
.cp-portfolio .cp-cont .tit {margin:15px 0 10px; font-weight:bold; font-size:19px; word-break:break-all}
.cp-portfolio .cp-cont .desc {font-size:16px; line-height:1.5; word-break:break-all}
.portfolio-view-position {position:sticky; top:0; z-index:10; margin:-20px -20px 20px}
.portfolio-view {display:flex; color:#fff; font-size:13px; line-height:1.3}
.portfolio-view li {flex:1}
.portfolio-view a {display:flex; justify-content:center; align-items:center; padding:10px 20px; color:#fff; text-decoration:none}
.portfolio-view .pdf {background:#ff6363}
.portfolio-view .brochure {background:#955ab1}
.portfolio-view .material-icons-outlined {margin:0 5px 0 0; font-size:30px}
.portfolio-view .txt {word-break:keep-all}
.cp-contact .tit-cont {margin-top:-10px; line-height:1.4}

.board-table {margin-top:30px; width:100%; table-layout:fixed; border-top:2px solid #222; border-bottom:1px solid #222; text-align:left}
.board-table tr:first-child th,
.board-table tr:first-child td {padding-top:30px}
.board-table tr:first-child th {padding-top:40px}
.board-table tr:last-child th,
.board-table tr:last-child td {padding-bottom:30px}
.board-table th, .board-table td {font-size:16px; padding:10px 0; vertical-align:top}
.board-table th {padding-top:20px; font-weight:normal}
.board-action {margin-top:30px; text-align:center}
.board-action [class^="btn-"] {display:inline-block; width:150px; height:50px; margin:0 7px; border:1px solid #ddd; font-size:19px; text-align:center; box-sizing:border-box}
.board-action .btn-submit {border-color:#222}
.inp-txt {width:100%; max-width:100%; height:50px; padding:10px 15px; border:1px solid #ddd; box-sizing:border-box}
.inp-txtarea {width:100%; padding:10px 15px; border:1px solid #ddd; box-sizing:border-box; resize:none}

/* e매거진 */
.info-box {padding:18px 20px 17px; border-radius:10px; background:#f7f7f7; font-size:14px; line-height:1.6}
.info-box .txt {position:relative; padding-left:10px}
.info-box .txt::before {content:''; position:absolute; top:10px; left:0; width:2px; height:2px; background:#222}
.info-box .btns {margin-top:15px; text-align:center}
.info-box .btns .btn-emagazine-pramary {margin:5px}

.btn-emagazine-pramary {display:inline-block; height:30px; padding:0 20px; border-radius:150rem; background:#e85454; color:#fff; font-size:16px; text-align:center}
.btn-emagazine-pramary::before {content:''; display:inline-block; width:1px; height:30px; vertical-align:-9px}
.btn-emagazine-pramary::after {content:''; display:inline-block; position:relative; top:-3px; width:6px; height:6px; margin-left:5px; border-top:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg)}

.emagazine-list .item > a {position:relative; z-index:1; float:left; text-decoration:none; width:225px; -webkit-perspective:1800px; perspective: 1800px}
.emagazine-list .book-wrap {position:absolute; width:100%; height:300px; -webkit-transform-style:preserve-3d; transform-style:preserve-3d; -webkit-transition:-webkit-transform .5s; transition:transform .5s}
.emagazine-list .book-wrap > div {display:block; position:absolute}
.emagazine-list .book-front,
.emagazine-list .book-front .book-cover img,
.emagazine-list .book-back {width:225px; height:300px}
.emagazine-list .book-front {-webkit-transform-style:preserve-3d; transform-style:preserve-3d; -webkit-transform-origin:0% 50%; transform-origin:0% 50%; -webkit-transition:-webkit-transform .5s; transition:transform .5s; -webkit-transform:translate3d(0,0,20px); transform:translate3d(0,0,20px); z-index:10}
.emagazine-list .book-front::before {content:''; position:absolute; top:0; left:0; bottom:0; right:0; z-index:3; box-shadow:inset 4px 0 10px rgba(0,0,0,.1); border-radius:0 3px 3px 0; background:linear-gradient(90deg, rgba(0,0,0,.05) .5%, transparent 3%)}
.emagazine-list .book-front > div {z-index:1; box-shadow:2px 2px 1px rgba(0,0,0,.05); -webkit-backface-visibility:hidden; backface-visibility:hidden; -webkit-transform-style:preserve-3d; transform-style:preserve-3d}
.emagazine-list .book-front .book-cover::after {content:''; position:absolute; top:0; left:10px; bottom:0; width:3px; background:rgba(0,0,0,0.06); box-shadow:1px 0 3px rgba(255,255,255,.1)}
.emagazine-list .book-front .book-cover img {object-fit:unset; outline:1px solid transparent; border-radius:0 3px 3px 0}
.emagazine-list .book-back {-webkit-transform:rotate3d(0,1,0,-180deg) translate3d(0,0,20px); transform:rotate3d(0,1,0,-180deg) translate3d(0,0,20px); box-shadow:10px 10px 30px rgba(0,0,0,.3); border-radius: 3px 0 0 3px; background:#65616f}
.emagazine-list .book-left {height:300px; -webkit-transform:rotate3d(0,1,0,-90deg); transform:rotate3d(0,1,0,-90deg); width:40px; left:-20px; background:#65616f}
.emagazine-list .book-left .txt {position:absolute; left:0; bottom:0; width:100px; transform: rotate(90deg) translateY(30px); color:#fff; text-align:left}
.emagazine-list .book-left .txt.dark {color:#222}
.emagazine-list .emagazine-category {position:relative; margin-top:325px}

.emagazine-datail-list {display:flex; flex-wrap:wrap; justify-content:space-between}
.emagazine-datail-list > li {flex:0 0 auto; width:calc(50% - 15px); margin-top:45px}
.emagazine-datail-list > li > a {display:block; position:relative}
.emagazine-datail-list .badge-new {position:absolute; top:-10px; left:-10px; display:flex; align-items:center; justify-content:center; width:40px; height:40px; padding-top:1px; border-radius:50%; background:#e85353; color:#fff; font:bold 10px Tahoma,sans-serif; z-index:2; box-sizing:border-box}
.emagazine-datail-list .thumb {position:relative; height:0; padding-top:131%;  border-radius:5px; background:#f7f7f7}
.emagazine-datail-list .thumb img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:unset}
.emagazine-datail-list .thumb::after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border-radius:5px; border:1px solid rgba(0,0,0,.1)}
.emagazine-datail-list .info {text-align:center}
.emagazine-datail-list .info .emagazine-tit {margin:13px 0 8px}
.emagazine-datail-list .info .date, 
.emagazine-datail-list .info .num {color:#222; font-size:14px}
.emagazine-datail-list .btn-go-pdf {display:inline-block; width:140px; height:30px; border-radius:150rem; background:#e85454; color:#fff; font-size:16px; text-align:center}
.emagazine-datail-list .btn-go-pdf::after {content:''; display:inline-block; width:1px; height:30px; vertical-align:-10px}

.btn-more-wrap {margin:45px 0 15px; text-align:center}
.btn-more-wrap .btn-more {display:block; height:45px; border:1px solid #e5e5e5; border-radius:10px; font-size:16px}
.btn-more-wrap .btn-more::after {content:''; display:inline-block; width:1px; height:45px; vertical-align:-17px}

/* e매거진 뷰어 */
.loading-spinner {width:100%; display:flex; align-items:center; justify-content:center}
.loading-spinner img {width:70px; height:70px}

.emagazin-viewer .page-num {display:flex; align-items:center; justify-content:center; width:100px; height:40px; border-radius:20px; background:rgba(0,0,0,.5); color:#fff; font-size:16px}
.emagazin-viewer .page-num .bar {margin:0 4px}

/* 팝업 */
.popup-wrap {position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999999; background:rgba(0,0,0,.7)}
.popup-wrap .popup-inner {position:absolute; top:50%; left:30px; right:30px; transform:translateY(-50%); max-width:400px; margin:0 auto; padding:40px 30px 30px; border:1px solid #ddd; border-radius:10px; background:#fff; text-align:center; word-break:keep-all; box-sizing:border-box}
.popup-wrap .txt-point {color:#ea5a53}
.popup-wrap .btn-popup-default {display:inline-block; width:170px; height:35px; border-radius:150rem; background:#e85454; color:#fff; font-size:16px; text-align:center}
.popup-wrap .btn-popup-default::after {content:''; display:inline-block; width:1px; height:35px; vertical-align:-11px}
.popup-wrap .popup-header {margin-bottom:10px}
.popup-wrap .popup-tit {font-size:20px}
.popup-wrap .popup-body {font-size:16px}
.popup-wrap .popup-body p + p {margin-top:10px}
.popup-wrap .popup-foot {margin-top:20px}
.popup-wrap .btn-popup-close {position:absolute; top:10px; right:10px; width:30px; height:30px}
.popup-wrap .btn-popup-close::before,
.popup-wrap .btn-popup-close::after {content:''; position:absolute; left:15px; width:1px; height:30px; background-color:#222}
.popup-wrap .btn-popup-close::before {transform:rotate(45deg)}
.popup-wrap .btn-popup-close::after {transform:rotate(-45deg)}

/* 구독인증 페이지 */
.form-item + .form-item {margin-top:10px}
.form-element {position:relative;}
.form-element .form-label {position:absolute; top:50%; left:20px; color:#888; font-size:16px; transform:translateY(-50%); transition:top ease-in .125s}
.form-element .inp-txt {height:60px; padding:16px 20px 0; border-radius:10px; color:#222; font-size:16px}
.form-element .inp-txt:disabled {-webkit-text-fill-color:#888; opacity:1}
.form-element.form-fixed .inp-txt {color:#888; letter-spacing:0; background-color:#f3f3f3}
.form-element.form-num .inp-txt {letter-spacing:0}
.is-focus .form-element, .form-element .inp-txt:focus {border-color:#666}
.is-focus .form-element .form-label {top:10px; left:20px; font-size:11px; transform:none}
.form-element .form-select::after {content:''; display:inline-block; position:absolute; top:calc(50% - 4px); right:20px; width:0; height:0; margin-left:5px; border-width:9px 7px; border-style:solid; border-color:#222 transparent transparent transparent; vertical-align:-3px}
.form-element select {cursor:pointer; -webkit-appearance:none; -moz-appearance:none; appearance:none; background-color:#fff}
.form-element select::-ms-expand{display:none}
.form-element .inp-txt:-webkit-autofill,
.form-element .inp-txt:-webkit-autofill:hover, 
.form-element .inp-txt:-webkit-autofill:focus, 
.form-element .inp-txt:-webkit-autofill:active {box-shadow: 0 0 0 30px white inset; -webkit-box-shadow: 0 0 0 30px white inset !important}
.info-list {margin-top:10px}
.info-list li, .info-list li a {line-height:21px; color:#888; font-size:14px}
.info-list li + li {margin-top:5px}
.info-list + .txt-ct {margin-top:25px}

.certify-wrap {letter-spacing:-.075em}
.certify-wrap .cp-nav {display:table; width:100%; margin-bottom:0}
.certify-wrap .cp-nav::after {display:none}
.certify-wrap .cp-nav > li {float:none; display:table-cell; width:33.33%; height:60px; vertical-align:middle}
.certify-wrap .cp-nav > li > a {display:flex; justify-content:center; align-items:center; flex-direction:column; height:100%; line-height:normal; font-size:16px; box-sizing:border-box}
.certify-wrap .certify-step1 {margin-top:15px}
.certify-wrap .btn-reset, .certify-wrap .btn-submit {height:50px; padding:0px 50px; border-radius:25px; line-height:1; font-size:16px; text-align:center; box-sizing:border-box}
.certify-wrap .btn-reset {border:1px solid #ddd; color:#222; background-color:#fff}
.certify-wrap .btn-submit {margin-left:8px; color:#fff; background-color:#e85353}

/* step2 */
.certify-wrap .certify-step2 {margin-bottom:100px}
.certify-info-txt {padding:100px 0 80px; font-size:24px; font-weight:700; text-align:center; word-break:keep-all; box-sizing:border-box}

/* step3 */
.certify-wrap .certify-step3 {margin-bottom:130px}
.certify-wrap .row-tbl {margin-top:30px}
.row-tbl {width:100%; border:1px solid #ddd}
.row-tbl tr + tr {border-top:1px solid #ddd}
.row-tbl th, .row-tbl td {padding:15px 15px; font-size:16px; box-sizing:border-box;}
.row-tbl th {border-right:1px solid #ddd; font-weight:400; text-align:center; background-color:#f3f3f3}
.row-tbl td {letter-spacing:0}

/* 개인정보 수집 및 이용 추가 */
.privacy-box .essential {color:#eb0026; font-size:13px}
.privacy-box .essential-txt {margin-bottom:12px; color:#eb0026; font-size:13px}
.privacy-box .scroll {overflow-y:auto; height:100px; padding:15px 20px; border-radius:5px; border:1px solid #e0e0e0; color:#555; line-height:21px; font-size:14px; box-sizing:border-box}
.privacy-box .scroll::-webkit-scrollbar {width:5px; -webkit-appearance: none;}
.privacy-box .scroll::-webkit-scrollbar-thumb {height:17%; background-color:#ddd; border-radius:10px}
.privacy-box .scroll ul + p {margin-top:15px}
.privacy-box .chk-area {display:block; margin:15px 0 25px}
.privacy-box .chk-area label {display:inline-block; position:relative; padding-top:2px; padding-left:31px; line-height:21px; font-size:15px; cursor:pointer}
.privacy-box .chk-area label:before {content:''; display:inline-block; position:absolute; top:1px; left:0; width:22px; height:22px; border:1px solid #666; border-radius:3px; box-sizing:border-box}
.privacy-box .chk-area .inp-chk {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
.privacy-box .chk-area .inp-chk:checked + label::before {border-color:#000; background-color:#000}
.privacy-box .chk-area .inp-chk:checked + label:after {content:''; display:block; position:absolute; top:6px; left:3px; width:15px; height:6px; margin-bottom:4px; border-bottom:2px solid #fff; border-left:2px solid #fff; transform:rotate(-45deg);}

/* Mobile style */
@media screen and (max-width:319px) {
    .banner-top img {max-width:300px}
}
@media screen and (max-width:359px) {
    .paging a, .paging strong {font-size:13px}
    .layer-sns .layer-inner {width:300px; padding:15px 5px 30px}
    .advertisement-info .cont-list li .page-name {line-height:1.6}
    .advertisement-info .cont-list li .page-name > span {display:block; margin-left:0}
}
@media screen and (max-width:899px) { 
    .sub-tit-wrap.no-line {border-bottom:none; padding-bottom:0}
	.magazine-category .btn-subscription + .btn-e-magazine {margin-left:10px}
    /* e매거진 */
    .magazine-category-wrap.tag-type .btn-e-magazine + .tit {margin-left:28px} 
    .magazine-category-wrap.tag-type .btn-e-magazine + .tit::before {content:''; position:absolute; left:-17px; top:-2px; width:1px; height:22px; background:#ddd}
    .emagazine-list .slick-list {padding:40px 0; outline: none;}
    .emagazine-list-wrap {margin:0 -20px}
    .emagazine-list .item > a {left:50%; transform:translateX(-50%); outline:none}
    .emagazine-list .emagazine-category {font-size:16px; text-align:center}
    .emagazine-list .item.slick-current .book-wrap {-webkit-transform:rotate3d(0,1,0,35deg); transform:rotate3d(0,1,0,35deg)}
    .emagazine-list .item.slick-current .book-back {box-shadow:15px 10px 30px rgba(0,0,0,.5);}
    /* e매거진 뷰어 */
	.loading-wrap {position:relative; height:0; padding-bottom:126%}
	.loading-spinner {position:absolute; top:0; left:0; right:0; bottom:0}

	.emagazin-viewer .page-column1,
	.emagazin-viewer .page-column2,
    .emagazin-viewer .emagazine-category,
    .emagazin-viewer .viewer-options,
    .emagazin-viewer .btn-close-viewer .txt,
    .emagazin-viewer .btn-prev-page,
    .emagazin-viewer .btn-next-page,
    .emagazin-viewer .btn-toggle-header {display:none}

    .emagazin-viewer .page-view {padding-top:10px; background:#aaa}
    .emagazin-viewer .page {background:#fff}
    .emagazin-viewer .page + .page {margin-top:10px}
    .emagazin-viewer .empty {display:none}
    .emagazin-viewer .viewer-header {position:sticky; top:0; height:50px; background-color:rgba(255,255,255,0.9); backdrop-filter:blur(15px)}
    .emagazin-viewer .emagazine-edition {display:flex; align-items:center; height:100%; padding:0 55px 0 20px}
    .emagazin-viewer .emagazine-edition .edition-title,
    .emagazin-viewer .emagazine-edition p {color:#222; font-weight:normal; font-size:16px; white-space:nowrap}
    .emagazin-viewer .emagazine-edition .edition-title {overflow:hidden; text-overflow:ellipsis}
    .emagazin-viewer .emagazine-edition p {margin-left:8px}
    .emagazin-viewer .btn-close-viewer {position:absolute; top:50%; right:17px; width:30px; height:30px; transform:translateY(-50%)}
    .emagazin-viewer .btn-close-viewer::before,
    .emagazin-viewer .btn-close-viewer::after {content:''; position:absolute; left:15px; width:1px; height:31px; background-color:#222}
    .emagazin-viewer .btn-close-viewer::before {transform:rotate(45deg)}
    .emagazin-viewer .btn-close-viewer::after {transform:rotate(-45deg)}
    .emagazin-viewer .page-move {position:fixed; bottom:20px; left:50%; transform:translateX(-50%)}
}
@media screen and (min-width: 374px) {
    .certify-wrap .cp-nav > li > a {flex-direction:row}
    .certify-wrap .cp-nav > li .txt-en, .certify-wrap .cp-nav > li .txt-num {margin-left:5px}
}
/* PC style (header 및 서브 콘텐츠는 900이상일때 pc버전) */
@media screen and (min-width:768px) {
    /* AD */
    .ad-area {margin:40px auto}
    /* main */
	/* .main .news-tit br {display:block} */
    .main-top {padding-top:40px; overflow:hidden}
    .main-top .logo-business {width:110px; height:17px}
    .main-top .logo-money {width:49px; height:17px}
    .main-top .logo-jobnjoy {width:74px; height:24px}
    .main-top article {padding-bottom:0}
    .main-top article::before {top:20px; left:-50px; right:-50px; bottom:195px; border-radius:9px}
    .main-top article + article {margin-top:30px; padding-top:40px; border-top:1px solid #222}
    .main-top article + article::before {top:60px}
    .main-top article.amagazine-jobnjoy {margin-bottom:30px}
    .main-top .news-top {min-height:250px; padding:35px 0 0 420px; box-sizing:border-box}
    .main-top .news-top .magazine-tit {margin-bottom:10px}
    .main-top .news-top .thumb {position:absolute; top:0; left:0; width:400px; height:250px; padding:0}
    .main-top .news-top .thumb > a {position:static}
    .main-top .news-top .news-tit {max-height:84px; margin-top:0; font-size:30px; line-height:42px}
	.main-top .news-top .news-subtit,
    .main-top .news-top .lead {margin-top:10px}
    .main-top .news-top .news-subtit {max-height:30px; font-size:20px; line-height:30px; -webkit-line-clamp:1}
    .main-top .news-top .lead {max-height:22px; font-size:14px; line-height:22px; -webkit-line-clamp:1}
    .main-top .main-news-list {margin-top:0; padding-bottom:0}

    .main-news-list {margin:0 -10px; padding:10px 0}
    .main-news-list > li {display:block; float:left; width:33.33336%; box-sizing:border-box}
    .main-news-list > li,
    .main-news-list > li + li {margin:0; padding:10px}
    .main-news-list .thumb {position:relative; flex:none; width:100%; height:0; padding-bottom:62.5%}
    .main-news-list .thumb > a {position:absolute; top:0; right:0; bottom:0; left:0;}
    .main-news-list .txt-cont {flex:none; width:auto}
    .main-news-list .txt-cont .news-tit {margin-top:10px; height:68px; max-height:68px; font-weight:normal; font-size:24px; line-height:34px; /* text-align:center */}
    .main-news-list .txt-cont .date {margin-top:5px}
	.main-news-list::after {content:''; display:block; clear:both}
    .ie9 .main-news-list > li {display:block}
    .ie9 .main-news-list > li .thumb,
    .ie9 .main-news-list .txt-cont {display:block; vertical-align:baseline}
    .ie9 .main-news-list > li .thumb + .txt-cont {padding-left:0}
    .main-tit {font-size:20px}
    .ranking-news .cont-inner {margin-top:40px; padding-top:30px; border-top:1px solid #222}
    /* company */
    .company-wrap .cont-info .logo-txt {padding:4px} 
    .company-wrap .history-list li > div {padding-left:110px}
    .company-wrap .history-list li > div .history-date {width:90px}

    /* footer */
    .foot-sns .sns-group dl {float:left; width:auto; margin:0}
    .foot-sns .sns-group dt {width:auto; margin-right:20px}
    .foot-sns .sns-group dl + dl {margin:0 0 0 15px; padding-left:15px; border-left:1px solid #eee}
    .foot-sns .sns-group::after {content:''; display:block; clear:both}

    /* cp */
    .cp-item-box {flex-direction:row}
    .cp-item-box > li {width:230px}
    .cp-item-box .in {padding:15px}
    .cp-item-box .in br {display:inline}

    .cp-workflow {display:flex; flex-wrap:wrap; justify-content:center}
    .cp-workflow li {flex:0 0 auto; display:inline-flex; align-items:center}
    .cp-workflow li .cp-work {position:relative; width:120px; min-height:120px; padding:0; background:none}
    .cp-workflow li .cp-work::before {content:''; position:absolute; top:0; left:0; z-index:-1; width:120px; height:120px; border-radius:50%; background:linear-gradient(180deg, rgba(53,86,147,1) 30px, rgba(111,149,218,1) 30px)}
    .cp-workflow li .cp-work span {display:block; text-align:center}
    .cp-workflow li .num {position:static; width:auto; margin:5px 0}
    .cp-workflow li [class^="material-icons"] {margin:30px 0; font-size:32px}
    .cp-workflow li .txt {padding-top:10px; color:#222}
    .cp-workflow li + li::before {width:30px; height:30px; margin:0 25px; border:none; border-right:1px solid #e1e1e1; border-top:1px solid #e1e1e1}
    .cp-workflow li:nth-child(4) ~ li {margin-top:30px}

    .portfolio-view-position {margin:0}
    .portfolio-view {position:absolute; top:40px; right:-160px; flex-direction:column; width:120px; font-size:14px; line-height:1.4}
    .portfolio-view li {margin-bottom:2px; text-align:center}
    .portfolio-view a {flex-direction:column; height:170px; padding:15px 20px; box-sizing:border-box}
    .portfolio-view .material-icons-outlined {margin:0 0 20px 0}
    .work-area > div {float:left; width:calc(50% - 15px)}
    .work-area > div + div {float:right}
    .work-area::after {content:''; display:block; clear:both}

    /* 구독인증 페이지 */
    .info-list {margin-top:20px}
    .certify-wrap .certify-step1 {padding:0 50px}
    .certify-wrap .certify-step2 {margin:0 auto 264px}
    .certify-wrap .certify-step2 .info-list {max-width:435px; margin:0 auto}
    .row-tbl th, .row-tbl td {padding:19px 30px}

    /* 개인정보 수집 및 이용 추가 */
    .privacy-box .essential {font-size:15px}
    .privacy-box .essential-txt {margin-bottom:10px; text-align:right}
    .privacy-box .scroll {height:150px; padding:25px; border-radius:10px; line-height:25px}
    .privacy-box .chk-area {margin:20px 0 30px}
    .privacy-box .chk-area label {padding-left:37px; font-size:16px}
    .privacy-box .chk-area label:before {top:-1px; width:25px; height:25px}
    .privacy-box .chk-area .inp-chk:checked + label:after {top:5px; left:4px}
}
@media screen and (min-width:780px) {
    /* 구독신청 */
    .page-subscription iframe {height:2000px !important}
    /* cp */
    .cp-portfolio .cp-cont ul {margin:0}
    .cp-portfolio .cp-cont li {flex:0 0 213px; margin:0 0 50px 50px}
    .cp-portfolio .cp-cont li:nth-child(3n - 2) {margin-left:0}
    .cp-portfolio .cp-cont .thumb {width:213px}
}
@media screen and (min-width:900px) { 
    /* reset */
    body, button, input, select, option, textarea, table, th, td {font-family:'맑은 고딕','Malgun Gothic',AppleSDGothicNeo-Light,HelveticaNeue-Light,'나눔고딕',NanumGothic,'돋움',Dotum,sans-serif; letter-spacing:-.075em}

	.is-pc {display:block}
    .is-pc.inline {display:inline}
	.is-mobile {display:none}

    /* header */
    .header {padding-top:5px}
    .header .cont-inner {min-height:100px}
    .header .logo {position:absolute; top:24px; left:1px; text-align:left}
    .header .logo-magazine {width:180px; height:43px}
    
    .header .login-area {top:32px; right:60px}
    .header .btn-login,
    .header .btn-user {transform:scale(1.25)}
    .header .login-area .layer-my {top:40px; right:-10px}

    .header .search-area {position:absolute; top:33px; right:0}
    .header .btn-open-search,
    .header .btn-search {transform:scale(1.5); transform-origin:top right}
    .header .btn-open-search {position:static}
    .header .search-area .layer-search {position:absolute; top:-10px; right:-14px; width:100px; height:50px; margin-top:0; overflow:hidden}
    .header .search-area .layer-search .inp-txt{height:50px; padding:0 48px 1px 14px; border-radius:10px} 
    .header .search-area .layer-search .btn-search {position:absolute; top:10px; right:14px}
    .header .search-area.active .layer-search {width:250px; height:50px}
    .header .search-area.active .btn-open-search {display:block}
    .header .search-area.active .btn-close-search {display:none}
    .gnb {padding-top:35px; padding-left:200px}
    .gnb > ul {display:block}
    .gnb > ul > li {position:relative; flex:none; float:left}
    .gnb > ul > li + li {margin-left:18px}
    .gnb > ul > li.on::after {height:5px}
    .gnb > ul:after {content:''; display:block; clear:both}
    .gnb .logo-business {width:147px; height:23px}
    .gnb .logo-money {width:65px; height:22px}
    .gnb .logo-jobnjoy {width:110px; height:37px; margin-bottom:-16px; transform:translateY(-16px)}
    .magazine-category .item {font-weight:bold}

	.magazine-category-wrap .inner-scroll.v2 {max-width:1160px; margin:0 auto; text-align:left}
    .magazine-category .btn-subscription {position:absolute; top:50%; right:150px; margin-left:0; font-weight:normal; transform:translate(0, -50%); text-decoration:none}
	.magazine-category .btn-subscription::before {width:19px; height:21px; vertical-align:-5px}

	.magazine-category .btn-e-magazine {position:absolute; top:50%; right:20px; margin-left:0; font-weight:normal; transform:translate(0, -50%); text-decoration:none}
    .magazine-category .btn-e-magazine::before {width:20px; height:24px; vertical-align:-5px}

	.header-banner {position:absolute; right:113px; top:17px}

    /* header logo type(error, sitemap) */
    .header-logo-type .logo-magazine {width:180px; height:43px}
    .header-logo-type .logo-txt {font-size:32px}
	/* footer */
	.btn-top {width:50px; height:50px}
	.btn-top::before {width:15px; height:15px}
    /* main */
    .main-top .news-top {min-height:344px; padding:60px 0 0 580px; box-sizing:border-box}
    .main-top .news-top .thumb {width:550px; height:344px}
	.main-top .news-top .news-subtit,
    .main-top .news-top .lead {margin-top:15px}
    .main-top .news-top .news-subtit {max-height:60px; -webkit-line-clamp:2}
    .main-top .news-top .lead {max-height:44px; line-height:22px; -webkit-line-clamp:2}

    /* sub */
    .container {padding:40px 0}
    .container > .cont-inner #contents {float:left; width:66%; max-width:740px}
    .container > .cont-inner .aside {float:right; width:27%; max-width:300px}
    .container > .cont-inner .aside-inner {max-width:300px; transition:all ease .3s}
    .container > .cont-inner::before {content:''; display:block; position:absolute; top:0; bottom:0; left:69.5%; width:1px; background:#ccc}
    .container > .cont-inner::after {content:''; display:block; clear:both}

    .container.full > .cont-inner #contents {float:none; width:100%; max-width:none}
    .container.full > .cont-inner::before {display:none}
    .contents-row .col:nth-child(1) {float:left; width:32%; max-width:360px}
    .contents-row .col:nth-child(2) {float:right; width:66%; max-width:740px}
    .contents-row.revers .col:nth-child(1) {float:right}
    .contents-row.revers .col:nth-child(1) {float:left}
    .contents-row .col:nth-child(2) {float:right}
    .contents-row::after {content:''; display:block; clear:both}
    
    .sub-tit-wrap {margin-top:-5px; margin-bottom:40px}
    .tag-list .tag {height:24px; font-size:13px; line-height:24px}
	/* aside */
	

	.aside-tab > li > a {font-size:16px}
	.aside-tab > li > a::after {vertical-align:-18px}
    /* list */
    .news-list > li {margin-top:40px; padding:0; border-top:none}
    .news-list > li:first-child {margin-top:0}
    .news-list > li:last-child {border:none}
    .news-list .txt-cont .news-tit {position:relative; top:-3px;font-size:24px; line-height:34px}
    .news-list .txt-cont .lead {display:block; display:-webkit-box}
    .news-list .txt-cont .date {margin-top:15px; font-size:13px}
    .news-list .news-cont .thumb-cont {width:170px}
    .news-list .news-cont .thumb {width:170px; height:106px}
    .news-list .news-cont .txt-cont + .thumb-cont {padding-left:30px} 
    .news-list .tag-list {margin-top:10px}

    .paging {margin:40px 0 0; padding-bottom:0; border-bottom:none; font-size:0}
    .paging a,
    .paging strong {margin:0 5px; font-size:13px}
    .paging .num {display:inline-block; position:relative; padding:0 15px}
    .paging .txt,
    .paging .btn-first,
    .paging .btn-end {display:inline-block}
    .paging .btn-first::before,
    .paging .btn-prev::before {margin-right:8px}
    .paging .btn-next::after,
    .paging .btn-end::after {margin-left:8px}
    .paging .btn-prev,
    .paging .btn-next {position:relative; width:auto; margin:0 10px}
    .paging .btn-prev {margin-right:15px}
    .paging .btn-next {margin-left:15px}
    .paging .btn-prev::after,
    .paging .btn-next::before {content:''; position:absolute; top:50%; width:1px; height:15px; background:#ddd; transform:translateY(-50%)}
    .paging .btn-prev::after {right:-15px}
    .paging .btn-next::before {left:-15px}
    /* search */
    .search-result {padding:0 15px 30px}
    .search-re {width:450px; margin:0 auto}
	.search-re .inp-txt{height:60px}
	.search-re .btn-search {top:20px}
    /* view */
    .breadcrumb > li {font-size:16px}
    .article-head {padding-bottom:20px; border-bottom:1px solid #eee}
    .article-head .news-tit {font-size:32px}
    .utility-wrap {position:relative; margin:30px 0 0}
    .utility-wrap .utility {float:right}
    .utility-wrap .utility > div > [class^="btn-"] {width:40px; height:40px}
    .utility-wrap .date-info {float:left; margin:10px 0 0}
    .utility-wrap::after {content:''; display:block; clear:both}
    .utility .util-share,
    .utility .util-font {float:right}
    .utility .util-share {position:relative; margin-left:8px}
    .utility .util-share .layer-sns {position:absolute; top:50px; right:0; left:auto; bottom:auto}
    .utility .util-share .layer-sns::before {pointer-events:none; background:none}
    .utility .util-share .layer-sns .layer-inner {position:static; transform:none}
    .layer-font.active {right:-95px}
    
    .article-body {font-size:18px; line-height:1.7}
    .article-body .summary {font-weight:bold}
    .figure-caption {font-size:0.77em; line-height:1.4}
    .article-body blockquote {padding:19px 29px}
    .article-body blockquote .svg-quote {width:28px; height:20px}
    
    .related-area {margin:40px 0; /*padding-bottom:15px; border-bottom:1px solid #e5e5e5*/}
    .related-area .tit-wrap {position:relative; text-align:left}
    /* .related-area .tit-wrap::before {content:''; position:absolute; top:16px; display:inline-block; width:100%; height:1px; background-color:#e5e5e5; z-index:-1} */
    .related-area .tit-wrap .list-tit {margin-bottom:5px; padding:0 5px 0 0; font-size:16px; border-top:none; background:#fff}
    /* .related-list .news-tit {font-size:19px; line-height:1.8} */
	.comment-area {padding-top:15px; border-top:1px solid #e5e5e5}

    .article-video {margin:30px 0; padding:15px}

    .article-tag a {margin-top:10px; margin-right:6px; font-size:15px; letter-spacing:-0.02em}

    .article-audio-player {width:510px; height:70px; margin:30px auto; padding:16px 84px 0 96px; border-radius:35px}
    .article-audio-player .btn-audio {top:19px; transform:scale(1.1)}
    .article-audio-player .btn-audio.play {left:29px}
    .article-audio-player .progress-time {font-size:15px}

    /* error */
    .error-contents .error-msg {font-size:32px}
    .error-contents .move-page {margin-top:45px}

    /* cp */
    .cp-nav > li {width:25%}
    .cp-info-intro {position:relative; padding-right:275px}
    .cp-info-intro::after {position:absolute; top:0; right:14px; margin:0}

    /* e매거진 */
	.loading-wrap,
	.loading-spinner {height:100%}
    .info-box {padding-left:30px; padding-right:30px}
	.info-box .txt-info::before {content:''; display:inline-block; width:24px; height:24px; margin-right:8px; background:url('https://static.hankyung.com/img/magazine/2021/common/icon-info.svg') no-repeat 0 0/contain; vertical-align:middle}

	.btn-emagazine-pramary {height:40px; padding:0 25px}
	.btn-emagazine-pramary::before {height:40px; vertical-align:-14px}
	.btn-emagazine-pramary::after {top:-2px; width:8px; height:8px}

    /* e매거진 */
    .cont-emagazine .info-box {margin:50px 60px 60px}
    .emagazine-list {display:flex; flex-wrap:wrap}
    .emagazine-list .item {flex:0 0 auto; display:flex; width:33.33336%}
    .emagazine-list .item:nth-child(3n) {justify-content:flex-end}
    .emagazine-list .item:nth-child(3n - 1) {justify-content:center}
    .emagazine-list .item:nth-child(3n) ~ .item {margin-top:50px}
    .emagazine-list.col2 .item {width:50%; justify-content:center}
    .emagazine-list.col2 .item:nth-child(2n) ~ .item {margin-top:50px}
    .emagazine-list .item > a {width:260px; text-align:left}
    .emagazine-list .book-wrap,
    .emagazine-list .book-left {height:347px}
    .emagazine-list .book-front,
    .emagazine-list .book-front .book-cover img,
    .emagazine-list .book-back {width:260px; height:347px}
    .emagazine-list .emagazine-category {margin-top:367px}
    .emagazine-list .emagazine-category {color:#888; font-size:14px; text-align:right}
    .emagazine-list .item > a:hover .book-wrap {-webkit-transform:rotate3d(0,1,0,35deg); transform:rotate3d(0,1,0,35deg)}
    .emagazine-list .item > a:hover .book-back {box-shadow:0 5px 30px rgba(0,0,0,.4)}

    .emagazine-datail-list {justify-content:flex-start; margin:-25px 0 0 -4.7%}
    .emagazine-datail-list > li {width:25%; margin:25px 0 0; padding-left:4.7%; box-sizing:border-box}
	.emagazine-datail-list > li:nth-child(4) ~ li {margin-top:55px}
    .emagazine-datail-list .badge-new {top:-15px; left:-15px; width:60px; height:60px; font-weight:normal; font-size:16px; letter-spacing:0}
    /* .emagazine-datail-list .info {position:absolute; left:0; top:0; right:0; bottom:0; border-radius:5px; background:rgba(0,0,0,.8); visibility:hidden; opacity:0; transition:all ease .2s}
    .emagazine-datail-list .info .emagazine-tit {display:flex; flex-direction:column; justify-content:center; height:185px; margin:0; padding-top:10px}
    .emagazine-datail-list .info .date, 
    .emagazine-datail-list .info .num {color:#fff; font-size:14px; letter-spacing:0}
    .emagazine-datail-list .info .num {margin-top:5px; font-size:24px}
	.emagazine-datail-list .btn-go-pdf {width:100px; height:40px}
    .emagazine-datail-list .btn-go-pdf::after {height:40px; vertical-align:-15px} */
	.emagazine-datail-list .info .date, 
    .emagazine-datail-list .info .num {font-size:14px; letter-spacing:0}
	.emagazine-datail-list .info .num {margin-top:5px}
    .emagazine-datail-list a:hover .thumb img {transform:scale(1.1); transition:transform .5s}
    .emagazine-datail-list a:hover .info {visibility:visible; opacity:1}

    .btn-more-wrap {margin:60px 0 0}
    .btn-more-wrap .btn-more {display:inline-block; width:300px; height:50px}
    .btn-more-wrap .btn-more::after {height:50px; vertical-align:-19px}

    /* e매거진 뷰어 */
	.emagazin-viewer .page-column1 {display:block}

    .emagazin-viewer {position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden}
    .emagazin-viewer .viewer-header {position:absolute; top:0; right:0; bottom:0; width:240px; padding:70px 30px 0; border-left:1px solid #e6e6e6; background:#f7f7f7; box-sizing:border-box; transition:right ease .3s}
    .emagazin-viewer .emagazine-category {text-align:center}
    .emagazin-viewer .logo-emagazine {margin-bottom:5px; color:#888; font-size:14px; letter-spacing:0}
    .emagazin-viewer .viewer-title .logo-business {width:140px; height:22px}
    .emagazin-viewer .viewer-title .logo-money {width:64px; height:22px}
    .emagazin-viewer .viewer-title .logo-esg {width:103px; height:22px}
    .emagazin-viewer .viewer-title .logo-mook {width:127px; height:22px}
    .emagazin-viewer .viewer-title .logo-jobnjoy2 {width:90px; height:49px}
    .emagazin-viewer .emagazine-edition {margin:25px 0 85px; text-align:center}
    .emagazin-viewer .emagazine-edition .edition-title {margin-bottom:5px; font-weight:normal; font-size:16px}
    .emagazin-viewer .emagazine-edition .num,
    .emagazin-viewer .emagazine-edition .date {color:#222; font-size:14px; letter-spacing:0}
    .emagazin-viewer .viewer-option + .viewer-option {margin-top:20px} 
    .emagazin-viewer .viewer-option {display:flex}
    .emagazin-viewer .viewer-option > li {flex:0 0 auto; width:50%}
    .emagazin-viewer .viewer-option > li button {display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:78px; border:1px solid #e8e8e8; border-left:none; background:#fff; box-sizing:border-box}
    .emagazin-viewer .viewer-option > li:first-child button {border-left:1px solid #e8e8e8; border-radius:10px 0 0 10px}
    .emagazin-viewer .viewer-option > li:last-child button {border-radius:0 10px 10px 0}
    .emagazin-viewer .viewer-option > li button::before {content:''; display:inline-block; background:url('https://static.hankyung.com/img/magazine/2021/common/spr-emagazine.svg') no-repeat}
    .emagazin-viewer .viewer-option > li button .txt {display:block; margin-top:6px; font-size:12px}
    .emagazin-viewer .viewer-option > li button.on {background:#e85454; color:#fff}
    .emagazin-viewer .viewer-option.view-mode .btn-column1::before {width:24px; height:29px; background-position:0 0}
    .emagazin-viewer .viewer-option.view-mode .btn-column1.on::before {background-position:0 -37px}
    .emagazin-viewer .viewer-option.view-mode .btn-column2::before {width:47px; height:29px; background-position:-39px 0}
    .emagazin-viewer .viewer-option.view-mode .btn-column2.on::before {background-position:-39px -37px}
    .emagazin-viewer .viewer-option.view-zoom > li button .txt {margin-top:10px} 
    .emagazin-viewer .viewer-option.view-zoom .btn-zoom-plus::before {width:18px; height:18px; background-position:0 -85px}
    .emagazin-viewer .viewer-option.view-zoom .btn-zoom-plus:hover::before,
    .emagazin-viewer .viewer-option.view-zoom .btn-zoom-plus:active::before {background-position:0 -125px}
    .emagazin-viewer .viewer-option.view-zoom .btn-zoom-minus::before {width:18px; height:18px; background-position:-53px -85px}
    .emagazin-viewer .viewer-option.view-zoom .btn-zoom-minus:hover::before,
    .emagazin-viewer .viewer-option.view-zoom .btn-zoom-minus:active::before {background-position:-53px -125px}
    .emagazin-viewer .btn-close-viewer {position:absolute; left:30px; right:30px; bottom:30px; width:180px; height:40px; border:1px solid #e5e5e5; border-radius:10px; background:#fff; box-sizing:border-box; font-size:16px; text-align:center; line-height:1}
    .emagazin-viewer .btn-close-viewer::after {content:''; display:inline-block; width:1px; height:40px; vertical-align:-15px}
    .emagazin-viewer .btn-toggle-header {position:absolute; top:22px; left:-30px; z-index:100; width:30px; height:50px; border:1px solid #e6e6e6; border-radius:8px 0 0 8px; background:#f7f7f7; box-sizing:border-box}
    .emagazin-viewer .btn-toggle-header::before {content:''; display:inline-block; width:8px; height:8px; margin:0 4px 0 0; border-width:2px; border-style:solid; transform:rotate(45deg); border-color:#999 #999 transparent transparent}
    
    .emagazin-viewer .viewer-contents {position:absolute; top:0; bottom:0; left:0; right:240px; padding:70px; transition:right ease .3s}
    .emagazin-viewer .page-view {border:1px solid #ddd}
    .emagazin-viewer .page {height:calc(100vh - 142px); text-align:center}
    .emagazin-viewer .page,
	.emagazin-viewer .page > div {display:flex; align-items:center}
	.emagazin-viewer .page > div > img,
	.emagazin-viewer .page > img {/*height:100%;*/ max-height:100%; object-fit:contain}
    .emagazin-viewer .btn-prev-page,
    .emagazin-viewer .btn-next-page {position:absolute; top:70px; bottom:70px; z-index:1000; width:100px}
    .emagazin-viewer .btn-prev-page {left:70px; text-align:left}
    .emagazin-viewer .btn-next-page {right:70px; text-align:right}
    .emagazin-viewer .btn-prev-page::before,
    .emagazin-viewer .btn-next-page::before {content:''; display:inline-block; width:70px; height:70px; border-width:17px; border-style:solid; transform:rotate(45deg); box-sizing:border-box; opacity:.5}
    .emagazin-viewer .btn-prev-page::before {left:0; margin-left:25px; border-color:transparent transparent #000 #000}
    .emagazin-viewer .btn-next-page::before {right:0; margin-right:25px; border-color:#000 #000 transparent transparent}
    .emagazin-viewer .btn-prev-page:hover,
    .emagazin-viewer .btn-next-page:hover {background:rgba(0,0,0,.02)}
    .emagazin-viewer .page-move button.slick-disabled {visibility:hidden; opacity:0}
    .emagazin-viewer .page-num {position:absolute; bottom:90px; left:50%; z-index:1000; transform:translateX(-50%)}

    .emagazin-viewer.fold .viewer-header {right:-240px}
    .emagazin-viewer.fold .btn-toggle-header::before {margin:0 0 0 4px; border-color:transparent transparent #999 #999}
    .emagazin-viewer.fold .viewer-contents {right:0}

    .emagazin-viewer .page-mobile {display:none}
    .emagazin-viewer .page-wrap {overflow:hidden}
	.emagazin-viewer .page-column1 .page {justify-content:center}
    .emagazin-viewer .page-column2 {position:relative}
    .emagazin-viewer .page-column2 .page-wrap {position:relative}
    .emagazin-viewer .page-column2 .page > div {position:relative; flex:0 0 auto; width:50%; height:100%; box-sizing:border-box}
    .emagazin-viewer .page-column2 .page > div:empty {width:50%}
    .emagazin-viewer .page-column2 .page .left {text-align:right; justify-content:flex-end}
    .emagazin-viewer .page-column2 .page .right {text-align:left; border-left:1px solid #ddd}
    /* .emagazin-viewer .page-column2::after {content:''; position:absolute; top:0; left:50%; width:1px; margin-left:-.5px; bottom:0; background:#ddd; z-index:5} */
    
    .emagazin-viewer .page-column2.flipping {position:relative; height:calc(100vh - 142px)}
    .emagazin-viewer .page-column2.flipping .page-wrap {position:relative; height:100%}
    .emagazin-viewer .page-column2.flipping .flipbook {display:none; position:absolute; top:0; left:0; right:0; bottom:0}
    .emagazin-viewer .page-column2.flipping .flipbook .page > div img {position:absolute}
    .emagazin-viewer .page-column2.flipping .flipbook .left {border-right:1px solid transparent}
	.emagazin-viewer .page-column2.flipping .flipbook .left img {right:0}
    .emagazin-viewer .page-column2.flipping .flipbook .left img:first-child {z-index:2}
    .emagazin-viewer .page-column2.flipping .flipbook .right {border-left:1px solid transparent}
    .emagazin-viewer .page-column2.flipping .flipbook .right img {left:0}
    .emagazin-viewer .page-column2.flipping .flipbook .right img:first-child {z-index:3}
    /* .emagazin-viewer .page-column2.flipping .flipbook .page div {transform-style: preserve-3d; -webkit-transform-style: preserve-3d} */
    .emagazin-viewer .page-column2.flipping .flipbook .page.flip div {transform-origin: 0% 0%}
    .emagazin-viewer .page-column2.flipping .flipbook .page.flip .right {
        transform:rotateY(-180deg);
        transition: transform .35s cubic-bezier(0.645, 0.045, 0.355, 1);
    }
    .emagazin-viewer .page-column2.flipping .flipbook .page.flip .right img:nth-child(2) {
        transform: rotateY(180deg);
        animation: zIndex .2s .15s forwards;
    }
    .emagazin-viewer .page-column2.flipping .flipbook .page.unflip div {
        transform-origin: 100% 100%;
    }
    .emagazin-viewer .page-column2.flipping .flipbook .page.unflip .left {
        transform:rotateY(180deg);
        transition: transform .35s cubic-bezier(0.645, 0.045, 0.355, 1);
    }
    .emagazin-viewer .page-column2.flipping .flipbook .page.unflip .left  img:nth-child(2) {
        transform:rotateY(180deg);
        animation: zIndex .2s .15s forwards;
    }
    @keyframes zIndex {
        from {
            z-index:2;
            opacity:0; 
        }
        to {
            z-index:3;
            opacity:1; 
        }
    }

	.emagazin-viewer .loading-wrap {position:absolute; top:0; left:0; right:0; bottom:0; z-index:10; background:rgba(255,255,255,.2)}

	#view_both {transform-origin: center center !important}
	/* .faceImageLayer {position:relative; width:100% !important; height:100% !important;}
	.faceImageLayer #staticBook {position:relative; min-height:100%; box-sizing:border-box} */



    /* 팝업 */
    .popup-wrap {position:fixed; top:50%; left:calc(50% - 100px); right:auto; bottom:auto; background:none; transform:translate(-50%, -50%)}
    .popup-wrap .popup-inner {position:static; transform:none; box-shadow:7px 7px 20px rgba(0,0,0,.3)}
    .popup-wrap .btn-popup-default {width:160px; height:40px}
    .popup-wrap .btn-popup-default::after {height:40px; vertical-align:-15px}
    .popup-wrap .popup-header {margin-bottom:15px}
    .popup-wrap .popup-tit {font-size:24px}
    .popup-wrap .popup-body {line-height:1.5}
    .popup-wrap .popup-body p + p {margin-top:15px}
    .popup-wrap .popup-foot {margin-top:25px}
    .emagazin-viewer.fold + .popup-wrap {left:50%}
}
@media screen and (min-width:1000px) {
	.gnb {padding-left:220px}
	.gnb > ul > li + li {margin-left:38px}
}
@media screen and (min-width:1120px) {
    /* global */
    .cont-inner {max-width:1120px; margin:0 auto; padding:0}
    /* 브라우저 지원 안내(lte IE9) */
    .browser-support-info .layout-inner {max-width:1120px; margin:0 auto; padding:20px 50px 20px 0; box-sizing:border-box}
    .browser-support-info .info-txt {float:left}
    .browser-support-info .browser-list {float:left; margin:0 0 0 30px}
    .browser-support-info .btn-close-info {right:0}
    /* header */
    .header .logo-magazine {width:210px; height:50px}
    .gnb {padding-left:281px}
    .gnb > ul > li + li {margin-left:68px}
    .gnb .logo-business {width:167px; height:25px}
    .gnb .logo-money {width:80px; height:27px}
    .gnb .logo-jobnjoy {width:120px; height:40px}
    .magazine-category-wrap {height:50px}
    .magazine-category .item {line-height:48px}
    .magazine-category .btn-subscription {right:auto; left:50%; margin-left:370px; transform:translate(-50%, -50%)}
    .magazine-category .btn-e-magazine {right:auto; left:50%; margin-left:510px; transform:translate(-50%, -50%)}
    
	.magazine-category-wrap.tag-type .item > a {height:30px}
	.magazine-category-wrap.tag-type .item > a::before {height:28px; vertical-align:-9px}
    /* footer */
    .footer .foot-cont {padding-left:143px}
    .footer .foot-magazine {padding-left:10px; padding-right:10px; border-color:#ccc}
    .footer .foot-magazine .foot-tit {float:left; margin:3px 18px 0 0}
    .footer .foot-magazine .service-menu {float:left; margin-top:0; white-space:nowrap}
    .footer .foot-magazine .service-menu:last-child {float:right}
    .footer .foot-magazine .service-menu > li {margin:0; line-height:22px}
    .footer .foot-magazine .service-menu > li + li {margin-left:20px}
    .footer .foot-magazine::after {content:''; display:block; clear:both}
    .foot-rel {position:relative}
    .footer .hk-group .service-menu {width:560px; margin:0}
    .footer .hk-group .service-menu > li {width:140px}
    /* .footer .share-sns {position:absolute; top:20px; right:0; margin-top:0}
    .footer .share-sns > li {width:80px; border-left:1px solid #eee; box-sizing:border-box}
    .footer .share-sns > li:first-child {border-left:none}
    .footer .share-sns > li > a {display:block; position:relative; padding-top:35px; text-decoration:none}
    .footer .share-sns [class^="sns-"]::before {position:absolute; top:3px; left:50%; transform:translateX(-50%)}
    .footer .sns-naver-post::before {top:1px}
    .footer .sns-naver-news::before {top:5px}
    .footer .share-sns [class^="sns-"] .txt {display:block} */
    .foot-info .f-item + .f-item {margin-top:5px}

    .sns-group [class^="icon-sns-"]::before {transform:scale(0.8)}
    .foot-sns {position:absolute; top:20px; right:0; margin-bottom:0; padding-bottom:0; border-bottom:none}
    .foot-sns .sns-group dt,
    .foot-sns .sns-group dd {float:none}
    .foot-sns .sns-group dt {margin:0 0 10px}
    .foot-sns .sns-group dl + dl {margin:0 0 0 30px; padding-left:30px}
    .foot-sns .sns-group li {min-width:auto}
	.foot-sns .sns-group li > a {padding:0 3px}

	.btn-top-wrap {position:fixed; bottom:0; left:50%; width:1px; height:0}
    .btn-top-wrap .btn-position {position:absolute; bottom:60px; right:-580px}
    /* main */
    .magazine-subscribe-inner {max-width:1120px; margin:0 auto}
    .magazine-subscribe .main-tit {margin-bottom:-3px; font-size:20px; text-align:left}
    .magazine-list .magazine-img {width:293px; height:366px; background:#d9d9db url('//static.hankyung.com/img/magazine/2021/w/bg-book.jpg') no-repeat 0 0; box-shadow:7px 7px 25px rgba(0,0,0,0.8)}
    .magazine-list .magazine-img > a {top:20px; right:20px; bottom:20px; left:20px}
    .magazine-list .magazine-info {margin-top:40px}
    .magazine-list .magazine-info dt {margin-bottom:20px}
    .magazine-list .magazine-info dt .logo-business {width:165px; height:26px}
	.magazine-list .magazine-info dt .logo-money {width:77px; height:26px}
	.magazine-list .magazine-info dt .logo-jobnjoy {width:120px; height:40px; margin-top:-16px}
	.magazine-list .magazine-info dt .logo-mook {width:146px; height:26px}
	.magazine-list .magazine-info dt .logo-esg {width:121px; height:26px}
    .magazine-list .magazine-info .desc {font-size:16px}
    .magazine-list .magazine-info .price {margin:0 0 15px; font-size:24px}
    .magazine-list .btn-subscribe {min-width:90px; height:40px; padding:0 25px; border-radius:20px}
    .magazine-list .btn-subscribe::after {vertical-align:-15px}
    .magazine-list .btn-subscribe + .btn-subscribe {margin-left:9px}
	.magazine-list .slick-arrow {display:block !important; position:absolute; top:140px; z-index:2; width:70px; height:140px; background:rgba(44, 40, 54, .9); color:transparent; font-size:0; text-align:center}
	.magazine-list .slick-arrow:before {content:''; display:inline-block; width:20px; height:20px; border-width:1px; border-style:solid}
	.magazine-list .slick-prev {left:5px; border-radius:0 10px 10px 0}
	.magazine-list .slick-prev:before {border-color:#fff transparent transparent #fff; transform:rotate(-45deg)}
	.magazine-list .slick-next {right:5px; border-radius:10px 0 0 10px}
	.magazine-list .slick-next:before {border-color:#fff #fff transparent transparent; transform:rotate(45deg) translate(-5px, 5px)}
	.magazine-list .slick-disabled {opacity:0}

    /* e매거진 */
    .emagazine-list .item > a {width:300px}
    .emagazine-list .book-wrap,
    .emagazine-list .book-left {height:400px}
    .emagazine-list .book-front,
    .emagazine-list .book-front .book-cover img,
    .emagazine-list .book-back {width:300px; height:400px}
    .emagazine-list .emagazine-category {margin-top:420px}
}

/* 맥사파리 대응 */
@media not all and (min-resolution:.001dpcm) { 
    @supports (-webkit-appearance:none) {
       body, button, input, select, option, textarea, table, th, td {letter-spacing:0}
    }
}