@charset "UTF-8";

/*
 * 한경닷컴 메인 & 개편 섹션 : header(fixed header), footer, top button
 */

/* 2020 메인개편 공통 UI 추가(개편 반영 후, 전체 정리 예정) */
@import url('http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sfgngvp.unaxlhat.pbz%2Spff%2Sjjj%2Sz%2Spbzzba.hv.nyy.pff%3Si%3Q202510141319');
/* // */

/* RESET */
/* html,body{-webkit-text-size-adjust:none}
body{color:#121212;font-family:'Helvetica Neue','Apple SD Gothic Neo','AppleGothic','Droid Sans fallback',sans-serif;font-size:14px;line-height:1.45;word-break:keep-all;word-wrap:break-word}
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,legend,input,textarea,select,p,button{margin:0;padding:0}
img,fieldset,iframe{border:0 none;vertical-align:middle}
table{width:100%}
table,thead,tbody,tfoot,tr,th,td{border:0 none;border-collapse:collapse;table-layout:fixed}
h1,h2,h3,h4,h5,h6{font-size:100%}
ul,ol,dl,li,dt,dd{list-style:none}
a{text-decoration:none;color:#121212}
em{font-style:normal}
button{border:0 none;border-radius:0;cursor:pointer; background:none}
input[type="text"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="email"],
input[type="button"], input[type="submit"], input[type="reset"],
textarea{border:0 none;border-radius:0; background: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}
caption{overflow:hidden;width:0;height:0;font-size:0;line-height:0}
legend {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0 0 0 0); color:transparent}
input,textarea,select,button{color:inherit;font-size:inherit;font-family:inherit}
input[type="submit"]{-webkit-appearance:none;-webkit-border-radius:0px;padding:0;border:0;margin:0}
textarea{width:100%;resize:none;vertical-align:middle}
textarea::-webkit-input-placeholder,textarea::-moz-placeholder,textarea:-ms-input-placeholder,textarea:-moz-placeholder{color:#777}
input::-webkit-input-placeholder,input::-moz-placeholder,input:-ms-input-placeholder,input:-moz-placeholder{color:#777}
iframe {max-width:100%} */

/* SKIP NAVI */
#skipnavi {position:relative; z-index:9999}
#skipnavi a {display:block; width:100%; font-size:0; line-height:0}
#skipnavi a:focus {padding:20px 0; font-size:14px; line-height:12px; color:#fff; text-align:center; background:#121212}

/* GLOBAL CLASS */
.blind {overflow:hidden; display:block; width:1px; height:1px; margin:-1px 0 0 -1px; padding:0; border:0; clip:rect(0 0 0 0)}
.icon-ir {overflow:hidden; display:inline-block; color:transparent}

/* SPRIGHT IMAGE */
#header h1 a,
#header .bg_ico,
.bg_ico.mark_new,
.bg_ico.btn_top {background-image:url('http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sfgngvp.unaxlhat.pbz%2Svzt%2Sjjj%2Sz%2Spbzzba%2Spbzzba_201909.fit'); background-repeat:no-repeat}

.icon-mail {background-image:url('http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sfgngvp.unaxlhat.pbz%2Svzt%2Sjjj%2Sz%2Spbzzba%2Sfrpgvba.fit'); background-repeat:no-repeat}

/* ICON */
.bg_ico {display:inline-block; text-indent:-9999px; vertical-align:middle}

.icon-mail {width:15px; height:11px; background-position:-23px -104px}

img.icon-premium {width:12px; height:16px; vertical-align:middle}

/* HEADER */
.bg_ico.mark_new {width:16px; height:17px; background-position:-290px -73px}
.bg_ico.mark_new02 {width:11px; height:11px; background-position:-192px -76px}
.bg_ico.menu {width:16px; height:14px; background-position:-144px -75px}
.bg_ico.notify {width:19px; height:21px; background-position:-236px -71px}
#header {position:relative}
#header .header_inner {position:relative}
#header .header_inner::before {content:''; display:block; position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(255,255,255,0.9); -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px)}
#header h1 {height:50px; padding:15px 0 14px; text-align:center; box-sizing:border-box}
#header h1 a {position:relative; display:inline-block; width:82px; height:21px; text-indent:-9999px; background-position:-26px -71px}
#header .btn_all_menu {position:absolute; top:50%; left:6px; width:44px; height:44px; margin-top:-22px; overflow:hidden; text-align:center}
#header .btn_all_menu .bg_ico.menu {margin-top:15px}
#header button.btn_all_menu .bg_ico.menu {margin:0}
#header .btn_all_menu .bg_ico.mark_new02 {position:absolute; top:10px; right:10px}
#header .notification {position:absolute; top:50%; right:8px; width:44px; height:44px; margin-top:-22px; overflow:hidden; text-align:center}
#header .notification .bg_ico.notify {margin-top:12px}
#header .notification .bg_ico.mark_new02 {position:absolute; top:10px; right:10px}
#wrap.fixgnb {padding-top:51px}
#wrap.fixgnb #header {position:fixed; top:0; width:100%; border-bottom:1px solid #e2e2e2; z-index:3000; box-sizing:border-box}
img.logo-bioinsight {width:199px}

/* FOOTER */
#footer {border-top:1px solid #eee; padding-bottom:65px; padding-top:11px; font-size:12px; color:#555; text-align:center}
#footer a {color:#555}
/* 2020.07.23 공통푸터 변경 */
.footer_inner {max-width:720px; margin:0 auto; padding:0 20px; color:#555; line-height:1.45; text-align:left}
.footer_inner .f_item + .f_item {margin-top:10px}
.footer_inner dt {margin-bottom:3px; font-weight:bold}
.footer_inner .f_item_group > a,
.footer_inner .f_item_group > span {display:inline-block; margin-right:13px}
/***** 2020.07.23 footer_inner 반영이후 삭제 가능 *****/
#footer .foot_mn li {display:inline-block}
#footer .foot_mn li::before {content:'|';  margin:0 10px 0 6px}
#footer .foot_mn li:first-child::before,
#footer .foot_mn li:last-child::before {display:none}
#footer .foot_mn li:last-child {display:block; margin-top:10px}
#footer .foot_mn li:last-child a:after {content:' (Advertisement)'}
/***** // 2020.07.23 footer_inner 반영이후 삭제 가능 *****/

.footer_sitemap {padding-bottom:9px; background:#ececec}
.footer_sitemap ul {display:flex; flex-wrap:wrap; max-width:720px; min-width:320px; margin:0 auto; padding:10px 0 10px 9%; background:#fff; box-sizing:border-box; transition:all ease .3s}
.footer_sitemap li {flex:1 1 33.3333%}
.footer_sitemap li h2 {padding:5px 0; font-weight:normal}
.footer_sitemap li h2 > a {display:inline-block; padding:5px 15px; color:#121212; font-size:15px}
@media all and (min-width:720px){
	.footer_sitemap ul {padding-left:100px}
}
@media all and (max-width:360px){
	.footer_sitemap ul {padding-left:12%}
	.footer_sitemap li h2 > a {padding:5px}
}
.footer_sitemap_area {padding-bottom:9px; background:#f3f2f8; font-size:15px}
.footer_sitemap_area > div {max-width:720px; margin:0 auto; padding:30px 20px; background:#fff; box-sizing:border-box}
.footer_sitemap_area .category_tit {font-weight:bold; font-size:17px}
.footer_sitemap_area .category_list {display:flex; flex-wrap:wrap; width:100%}
.footer_sitemap_area .category_list > li {flex:0 0 33.333336%}
.footer_sitemap_area .category_list > li > a {display:inline-block; padding:5px 0 4px}
.footer_sitemap_area .section_menu {padding-bottom:0}
.footer_sitemap_area .section_menu .category_list {padding:10px 0}
.footer_sitemap_area .section_menu .category_list:last-of-type {padding-bottom:30px}
.footer_sitemap_area .section_menu_news .category_list:last-of-type {border-bottom:1px solid #e5e5e5}
.footer_sitemap_area .section_submenu {display:none}
/* 공통 푸터 사이트맵 (2020.08.03 수정- 반영후 위내용과 통합) */
.footer_sitemap_area .icon-premium {width:10px; height:12px; margin:0 0 0 4px; vertical-align:-2px}
.footer_sitemap_area.list_only_type {font-size:13px}
.footer_sitemap_area.list_only_type > div {padding:0 20px}
.footer_sitemap_area.list_only_type .category_list > li {flex:0 0 30%}
.footer_sitemap_area.list_only_type .category_list > li:nth-child(3n + 2) {flex:0 0 40%}
.footer_sitemap_area.list_only_type .category_tit {display:none}
.footer_sitemap_area.list_only_type .section_menu .category_list {padding:0}
.footer_sitemap_area.list_only_type .section_menu .category_list:first-of-type {padding-top:12px}
.footer_sitemap_area.list_only_type .section_menu .category_list:last-of-type {padding-bottom:12px}
@media all and (max-width:359px){
	.footer_sitemap_area.list_only_type .category_list > li {flex:0 0 28%}
	.footer_sitemap_area.list_only_type .category_list > li:nth-child(3n + 2) {flex:0 0 44%}
}
/* top button */
.bg_ico.btn_top {position:fixed; right:20px; bottom:80px; width:42px; height:42px; background-position:-24px -161px; z-index:20}

/* COMMON CONTENTS */
.section_tit_wrap {max-width:720px; margin:0 auto; padding:10px 20px 10px; background:#fff; box-sizing:border-box}
.section_tit_wrap.line_type {margin-bottom:6px}
.section_tit {font-weight:bold; font-size:24px}

/* AD */
.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-remove-ad {position:absolute; top:0; left:50%; display:inline-flex; align-items:center; width:40px; height:15px; margin-left:160px; padding:1px 2px 0; text-align:center; background:#B50000; color:#fff; white-space:nowrap; font-size:10px; line-height:1}
.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:390px){
    .ad_bottom_fix.close_ad .btn-remove-ad {top:-15px; margin-left:120px;}
}
@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)}
}
@media all and (max-width:319px){
    .ad_bottom_fix.close_ad .btn-remove-ad {margin-left:0; left:auto; right:0}
}


/* 광고 정렬 공통 */
div[id^="div-gpt-ad"] {text-align:center}
div[id^="div-gpt-ad"] div {margin:0 auto}

/* 앱 프로모션 배너 */
.banner-app-promotion {position:relative; height:50px; border-bottom:1px solid #ddd; background:#f7f7f7; box-sizing:border-box}
.banner-app-promotion > a {display:flex; justify-content:space-between; align-items:center; height:100%; padding:0 50px 0 72px; background:url('http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sfgngvp.unaxlhat.pbz%2Svzt%2Sjjj%2Sz%2Spbzzba%2Svpba-ux-ncc2.cat') no-repeat  20px 50%; background-size:40px 40px; font-weight:bold; font-size:15px; box-sizing:border-box}
.banner-app-promotion > a .btn-open-app {color:#4c88b6}
.banner-app-promotion > .btn-close-app {position:absolute; top:17px; right:20px; width:15px; height:15px}
.banner-app-promotion > .btn-close-app::before,
.banner-app-promotion > .btn-close-app::after {content:''; position:absolute; left:50%; top:0; width:1px; height:15px; background-color:#121212}
.banner-app-promotion > .btn-close-app:before {transform:translate(-50%) rotate(45deg)}
.banner-app-promotion > .btn-close-app:after {transform:translate(-50%) rotate(-45deg)}

/* #wrap.view .header_inner {position:relative}
#wrap.has-top-banner {padding-top:101px !important} */

/* 개편 후 삭제 예정 */
/* 전체 메뉴 */
#header .bg_ico.btn_close_menu_3,
#header .bg_ico.plusfriend_sm,
#header .bg_ico.home,
#header .bg_ico.facebook_sm,
#header .bg_ico.ttwitter_sm,
#header .bg_ico.header_search {background-image:url('http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sfgngvp.unaxlhat.pbz%2Svzt%2Sjjj%2Sz%2Spbzzba%2Spbzzba.fit')}
#header .bg_ico.btn_close_menu_3 {width:24px; height:24px;  background-position:-239px -123px}
#header .bg_ico.plusfriend_sm {width:41px; height:41px; background-position:-160px -114px}
#header .bg_ico.home {width:41px; height:41px; background-position:-412px -114px}
#header .bg_ico.facebook_sm {width:41px; height:41px; background-position:-40px -114px}
#header .bg_ico.ttwitter_sm {width:41px; height:41px; background-position:-100px -114px}
#header .bg_ico.header_search {width:20px; height:20px; background-position:-357px -125px}
.menu_all {overflow:auto; position:fixed; top:0; left:0; right:0; bottom:0; z-index:1100}
.menu_all .wrap_menu {background:#ececec; padding:0 0 20px}
.menu_all .menu_header_v2 {position:relative; padding:12px 70px 12px 20px; background:#fff; margin-bottom:0}
.menu_all .menu_header_v2 a {display:inline-block}
.menu_all .menu_header_v2 .sns >a + a {margin-left:9px}
.menu_all .bg_ico.btn_close_menu_3 {position:absolute; top:50%; right:20px; margin-top:-12px}
.menu_all .wrap_menu .tit {margin-top:10px; padding:10px 20px 8px; font-size:14px; line-height:1.45em; background:#fff; border-bottom:1px solid #e7e7e7}
.menu_all .wrap_menu .tit.tit_pen em {display:inline-block; vertical-align:-2px}
.menu_all .wrap_menu .menu_search_wrap + .tit {margin-top:0}
.menu_all .nav_list_wrap {display:-webkit-flex; display:-moz-flex; display:flex; margin-top:0; padding:20px 0; background:#fff}
.menu_all .nav_list_wrap:after {display:block; clear:both; content:""}
.menu_all .nav_list_wrap + .nav_list_wrap {border-top:1px solid #e7e7e7}
.menu_all .nav_list_wrap >ul {width:50%; box-sizing:border-box}
.menu_all .nav_list_wrap >ul + ul {border-left:1px solid #e7e7e7}
.menu_all .nav_list_wrap >ul >li + li {margin-top:20px}
.menu_all .nav_list_wrap >ul >li >a {display:block; padding:0 20px; font-size:17px; line-height:1.45em; letter-spacing:-0.5px}
.menu_all .bg_ico.mark_new {margin-left:3px; vertical-align:-2px}
.menu_all .nav_list_side {margin:10px 0}
.menu_all .nav_list_side >ul:after {display:block; clear:both; content:""}
.menu_all .nav_list_side >ul >li {float:left; width:33.34%; text-align:center; background:#fff; box-sizing:border-box}
.menu_all .nav_list_side >ul >li + li {width:33.33%; border-left:1px solid #e7e7e7}
.menu_all .nav_list_side >ul >li a {display:block; padding:15px 0; font-size:14px; line-height:1.45em}
.menu_all .nav_list_side >ul >li:only-child {width: 100%}
.menu_all .menu_search_wrap {padding:11px 20px}
.menu_all .search_box {position:relative; height:auto; padding:9px 50px 9px 10px; border:0; background-color:#fff}
.menu_all .search_box input[type="search"] {width:100%; height:20px; border:none; color:#888; font-size:15px; -webkit-appearance:none; -moz-appearance:none; appearance:none}
.menu_all .search_box input:-ms-input-placeholder {color:#d3d3d3}
.menu_all .search_box input:-moz-input-placeholder {color:#d3d3d3}
.menu_all .search_box input::-webkit-input-placeholder {color:#d3d3d3}
.menu_all .search_box .bg_ico.header_search {position:absolute; top:50%; left:auto; right:16px; margin-top:-10px}

/* .list-loading, .list_loading {background:#f3f2f8 !important} */
@media all and (max-width:336px){
	div[id^="div-gpt-ad"] {min-width:auto !important; max-width:100%}
}
@media all and (min-width:720px){
	/* #footer {background:#fff} */
	.view_mode #footer {background:transparent}

	.banner-app-promotion {max-width:720px; margin:0 auto}
}



/*  Mobile OS dark mode */
@media (prefers-color-scheme: dark) {
	body, a {color:#fff}	
    #header {border-width:0.5px; border-color:#262626 !important; background:rgba(28,28,30,0.2)}
    #header .header_inner::before {background:rgba(28,28,30,0.9)}
	#header .logo {filter:grayscale(100%) brightness(10)}

    .banner-app-promotion {background-color:#000}
    .banner-app-promotion {border-width:0.5px; border-color:#323235}
    .banner-app-promotion > .btn-close-app::before,
    .banner-app-promotion > .btn-close-app::after {background-color:#fff}

    .section_tit_wrap {background-color:#000}

	.list-loading, .list_loading {background-color:#000 !important}
	.list-loading img, .list_loading img {filter:invert(1)}

	/* 해주라 외주제작 화면에 다크모드 적용 안되게 */
	.page-globalstock body,
    .page-globalstock a {color:#121212}
	.page-globalstock .section_tit_wrap {background-color:#fff}
}