@charset "UTF-8";
/*
 * 텐아시아 다국어
 * 공통 UI css
 */

/* reset */
html,body {-webkit-text-size-adjust:none}
body,div,span,em,strong,select,section,article,nav,footer,header,address,caption,figure,figcaption,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p,textarea,input,button,tr,th,td,table {margin:0; padding:0}
body {background-color:#fff; color:#121212; font-size:14px; font-family:Arial, Verdana, Helvetica, Tahoma, sans-serif; letter-spacing:0}
h1,h2,h3,h4,h5,h6 {font-size:inherit}
ol,ul,li {list-style:none}
blockquote,q {quotes:none}
blockquote:before,blockquote:after,q:after,q:before {content:'';content:none}
img,fieldset,iframe {border:none; vertical-align:top}
img {max-width:100%}
iframe {vertical-align:top; max-width:100%}
i,em,address,optgroup {font-style:normal}
hr {display:none}
input,button,select,textarea,label {vertical-align:middle}
input::-ms-clear{display:none}
input {outline:none; border:none}
input::placeholder {color:#888}
input:-ms-input-placeholder {color:#888}
input::-ms-input-placeholde {color:#888}
select {outline:none; border:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; background-color:#fff}
textarea {resize:none}
button {border:none; border-radius:0; background:transparent; cursor:pointer}
table {border-collapse:collapse; border-spacing:0}
caption {width:0; height:0; overflow:hidden; color:transparent; text-indent:-9999px}
legend {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption {display:block}
a {color:#121212; text-decoration:none}
a:hover {text-decoration:underline}
a[role="button"] {cursor:pointer}
.blind {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
.txt-num {letter-spacing:0}

/* [lang="ja"] */
html[lang="ja"] body {font-family:Arial, Verdana, Helvetica, Tahoma, "Hiragino Kaku Gothic ProN", "Yu Gothic UI", Meiryo, sans-serif}

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

.ad-wrap {text-align:center; background-color:#f8f8f8}
.ad-wrap .is-pc {display:none}
.ad-wrap .is-mo {display:inline-block}
.ad-wrap a {display:block}
.ad-wrap img {max-width:100%}
.contents + .ad-wrap {margin-top:20px}

/* footer */
.footer {margin:0 20px; padding:30px 0 22px; text-align:center; box-sizing:border-box}
.ft-menu, .copyright {display:block; margin-top:15px}
.ft-tit {display:block; font-size:16px}
.ft-menu li {display:inline-flex; align-items:center; line-height:1.3; font-size:15px}
.ft-menu li::after {content:""; display:inline-block; margin-left:15px; margin-right:12px; width:1px; height:12px; vertical-align:middle; background-color:#ccc}
.ft-menu li:last-child::after {display:none}
.ft-menu a {display:block; line-height:18px; font-size:13px}
.ft-menu.type-small a, .footer .copyright {font-size:12px}
.copyright {color:#757777}
.ft-txt {max-width:650px; margin:15px auto 0; line-height:14px; font-size:12px; color:#757777}

/* common */
.thumb {position:relative; overflow:hidden; flex:0 0 auto; width:128px; height:80px}
.thumb > a {display:block; width:100%; height:100%}
.thumb img {width:100%; height:100%; object-fit:cover; object-position:top center}
.news-item {display:flex; flex-direction:row-reverse; gap:10px; box-sizing:border-box}
.news-item + .news-item {margin-top:15px}
.news-tit {display:block; line-height:22px; font-weight:500; font-size:17px; word-wrap:break-word; word-break:break-word}
.news-tit a {display:block}
.txt-cont {flex:1 1 auto; width:calc(100% - 138px)}
.txt-date {display:block; margin-top:12px; color:#757777; font-size:12px}
.lead {display:none; word-wrap:break-word; word-break:break-word}
.point-color {color:#e30f61}

/* header */
.logo-area > a {display:block; width:50px; height:33px; background:url('https://hkstatic.hankyung.com/resource/common/img/logo/logo-tenasia.svg') no-repeat center/contain}

.header {border-bottom:1px solid #eee}
.header-top {position:relative}
.header-logo {display:flex; justify-content:space-between; align-items:center; height:50px; padding:8px 20px; box-sizing:border-box}
.btn-search {display:block; width:50px; height:50px; background:url('https://hkstatic.hankyung.com/resource/lang/img/icon-search.svg') no-repeat center/24px 24px}
.header-top .btn-search {margin-right:-13px}

.sticky .header {z-index:99; position:fixed; top:0; left:0; right:0}
.sticky .header-top {background:rgba(255,255,255,0.8); backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px)}

.gnb-area {position:relative; min-height:40px; padding:11px 0; box-sizing:border-box; overflow:hidden; white-space:nowrap}
.gnb-area .inner-scroll {overflow-x:scroll; overflow-y:hidden; box-sizing:border-box; -webkit-overflow-scrolling:touch}
.gnb-area .inner-scroll::-webkit-scrollbar {display:none}
.gnb-list {display:flex}
.gnb-list li {flex:0 0 auto; min-width:11%; padding:0 10px; text-align:center; box-sizing:border-box}
.gnb-list li:first-child {padding-left:20px}
.gnb-list li:last-child {padding-right:20px}
.gnb-list li a {font-weight:700; font-size:16px; box-sizing:border-box}
.gnb-list li.on a {color:#e30f61}

.search-wrap {z-index:99; opacity:0; visibility:hidden; position:fixed; top:50px; left:0; right:0; bottom:0; padding:30px 20px; box-sizing:border-box; background-color:#fff; transition:all .3s}
.search-area {display:flex; align-items:center; padding:0 10px 0 30px; border-radius:30px; border:1px solid #121212; box-sizing:border-box}
.search-area .inp-txt, .search-area .btn-search {flex:0 0 auto}
.search-area .inp-txt {width:calc(100% - 50px); font-size:18px}

body.layer-open {overflow:hidden}
.layer-open .header-top .btn-search {position:relative; background:none}
.layer-open .header-top .btn-search::before,
.layer-open .header-top .btn-search::after {content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(45deg); background:#121212}
.layer-open .header-top .btn-search::before {width:23px; height:2px}
.layer-open .header-top .btn-search::after {width:2px; height:23px}
.layer-open .search-wrap {opacity:1; visibility:visible}

/* contents */
.contents {padding-top:23px}
.layout-inner {padding:0 20px}
.tit-wrap {display:flex; align-items:center; padding-top:30px}
.tit-wrap a {display:block; text-decoration:none}
.tit-wrap::after {content:''; display:inline-block; transform:translateY(50%); width:100%; height:2px; background-color:#121212}
.cont-tit {flex:0 0 auto; margin-right:20px; font-family:Georgia, "times new roman", times, serif; font-weight:700; font-size:32px; word-break:break-all; }
.news-list-area {padding:20px 0}
.contents + .footer, .ad-wrap[style="display:none"] + .footer {border-top:1px solid #eee}

/* m */
@media (min-width:430px) and (max-width:767px) {
    .gnb-list {justify-content:center}
}
/* tablet */
@media (min-width:768px){
    body.layer-open {overflow:auto}

    .footer {padding:30px 0 63px}
    .ft-menu {margin-top:30px}
    .ft-menu.type-default li::after {margin-left:50px; margin-right:50px}
    .copyright {margin-top:20px}

    .ft-menu a {font-size:15px}
    .ft-txt {margin:30px auto 0}

    .header-logo {height:80px; padding:17px 20px}
    .logo-area > a {width:68px; height:45px}
    .gnb-area {position:absolute; top:50%; left:50%; min-height:auto; padding:0; transform:translate(-50%,-50%)}
    .gnb-list li {min-width:auto; padding:0}
    .gnb-list li + li {margin-left:30px}
    .gnb-list li a {font-size:18px}
    .gnb-list li:first-child {padding-left:0}
    .gnb-list li:last-child {padding-right:0}

    .search-wrap {top:81px; bottom:auto; min-height:180px; padding:47px 20px; box-shadow:0px 3px 6px #00000014}
    .search-area {width:450px; margin:0 auto}

    .news-list-area {padding:30px 0}
    .news-item + .news-item {margin-top:0}
    .news-tit {line-height:24px; font-size:18px}
    .thumb {width:143px; height:90px}
    .txt-date {font-size:12px}

    .contents {padding-top:40px}
    .tit-wrap {padding-top:50px}
    .cont-tit {margin-right:25px; font-size:36px}
}
/* pc */
@media (min-width:1040px){
    .layout-inner {max-width:1040px; margin:0 auto; padding:0}
    .header-logo {max-width:1040px; margin:0 auto; padding:15px 0px}
    .logo-area > a {width:75px; height:50px}
    .search-wrap {top:81px}
    .gnb-list li + li {margin-left:50px}

    .ft-menu {margin-top:40px}
    .ft-txt {max-width:970px; margin-top:30px}

    .contents + .ad-wrap {margin-top:10px}
    .ad-wrap {padding:40px 0}
    .ad-wrap .is-pc {display:inline-block}
    .ad-wrap .is-mo {display:none}

    .thumb {width:256px; height:160px}
    .news-tit {line-height:26px; font-size:18px}
    .news-item {gap:20px}
    .lead {display:block; margin-top:15px; line-height:22px; color:#555; font-size:15px}
    .news-list-area {padding:40px 0}

    .contents {padding-top:58px}
    .tit-wrap {padding-top:68px}
    .cont-tit {margin-right:30px; font-size:40px}
    
    .contents + .footer, .ad-wrap[style="display:none"] + .footer {max-width:1040px; margin:0 auto}    
}