@charset "utf-8";
/* ====== Frank Ruhl Libre, Nanum Myeongjo ========================================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@300;400;500;700;900&family=Nanum+Myeongjo:wght@400;700;800&display=swap');


/* ====== 기후시계 ========================================================================================= */
@import url(//res.heraldm.com/climate/climate.css);


/* ====== [HTML5] ======================================================================================================= */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary{display:block;} /* HTML5에 새로 추가된 요소들 블럭처리(IE6/7/8/9, 파폭3) */
audio, canvas, video{display:inline-block; *display:inline; *zoom:1;} /* audio, canvas,video 를 inline-block 처리. 지원하지 않는 브라우저는 핵이용(IE6/7/8/9, 파폭3) */
audio:not([controls]){display:none; height:0;} /* audio 에 contorls 속성이 정의되지 않은경우 이를 감춤(모든 웹브라우저 및 iOS5 이상) */
[hidden]{display:none;} /* visibility 속성의 hidden값과 display 속성의 none 값을 통일(IE7/8/9, 파폭3, 사파리4, IE6) */
mark{background:#ff0; color:#000;} /* mark 속성값 통일(IE 6/7/8/9) */
/* ====== [Base] ======================================================================================================== */
/* 1. IE 6/7 에서 body에 em 단위의 정확한 글자크기를 구현하기 위한 설정으로 100%=16px, 75%=12px
 * 2. iOS에서 가로,세로 모드로 화면을 전환할때 사용자가 직접 줌하지 않는 한 글자크기를 조정하지 않음 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, button, input, select, textarea{font-family:'Frank Ruhl Libre', 'Nanum Myeongjo', -apple-system,BlinkMacSystemFont,'Noto Sans KR', 'Malgun Gothic','맑은 고딕','helvetica','Apple SD Gothic Neo','sans-serif'; font-style:normal; margin:0; padding:0; border:0; font-size:100%;/* 1 */-ms-text-size-adjust:100%;/* 2 */-webkit-text-size-adjust:100%;/* 2 */ vertical-align:baseline;}
body{line-height:1;}
/* ====== [Link] ======================================================================================================= */
a:focus{outline:none;} /* 크롬과 outline 속성값 통일 */
a:active, a:hover{outline:0; text-decoration:none;} /* 포커스, 마우스오버 통일 */
a{text-decoration:none; cursor:pointer; color:inherit;}
/* ====== [Typography] ================================================================================================== */
h1{font-size:2em; margin:0.67em 0;} /* IE 6/7에서 폰트크기와 마진값 통일. 파폭4+, 사파리5, 크롬에서 폰트크기 통일 */
h2{font-size:1.5em; margin:0.83em 0;}
h3{font-size:1.17em; margin:1em 0;}
h4{font-size:1em; margin:1.33em 0;}
h5{font-size:0.83em; margin:1.67em 0;}
h6{font-size:0.67em; margin:2.33em 0;}
small{font-size:80%;} /* small 폰트크기 */
b,strong{font-weight:bold;} /* b, strong 폰트 굵게 적용 */
p, pre{margin:0;} /* IE6/7의 p, pre 마진값 통일*/
dfn{font-style:italic;} /* dfn 요소 이탤릭 설정, 사파리5, 크롬 적용*/
abbr[title]{border-bottom:1px dotted;} /* abbr(축약어) title 속성 디자인 통일, IE 7/8/9,사파리 5, 크롬 적용*/
blockquote{margin:1em 40px;} /* blockquote(인용) 마진값 설정, 파폭3+, 사파리4/5, 크롬 적용*/
hr{-moz-box-sizing:content-box; box-sizing:content-box; height:0;} /* 파폭의 차이점 통일, IE 6/7 적용되지 않음 */
code, kbd, pre, samp{font-family:monospace, serif; _font-family:'courier new', monospace; font-size:1em;} /* 폰트 글꼴 통일, IE6, 사파리4/5, 크롬 적용 */
pre{white-space:pre; white-space:pre-wrap; word-wrap:break-word;} /* pre 요소의 가독성을 향상 */
q{quotes:none;} /*IE 6/7에서 q(""인용)가 안되므로 노출안함 */
q:before, q:after, blockquote:before, blockquote:after{content:''; content:none;} /* 사파리4에서 q 의 :before와 :after가 안되므로 노출안함*/
sub, sup{font-size:75%; line-height:0; position:relative; vertical-align:baseline;} /* sub, sup 요소 line-height 초기화 */
sup{top:-0.5em;}
sub{bottom:-0.25em;}
/*
::selection{background:#000; color:#148bff;} /* 드래그 영역 색상
::-moz-selection{background:#000; color:#148bff;} /* 드래그 영역 색상
::-webkit-selection{background:#000; color:#148bff;} /* 드래그 영역 색상
*/
/* ====== [List] ======================================================================================================= */
menu, ol, ul, nav ul, nav ol{list-style:none;} /* IE6/7에서 패딩값 통일 */
nav ul, nav ol{list-style-image:none;} /* IE 7에서 이미지 위치가 달라 사용자가 직접 설정하게 도와줌 */
/* ====== [Embed] ====================================================================================================== */
img{border:0; -ms-interpolation-mode:bicubic; vertical-align:top} /* IE7에서 이미지 축소/확대시 계단현상 방지 */
/*svg:not(:root){overflow:hidden;}  IE9에서 svg 가 영역의 크기를 벗어나지 않도록 */
/* ====== [Table] ====================================================================================================== */
table{border-collapse:collapse; border-spacing:0;} /* 테이블 사이의 간격을 제거 */
/* ====== [Form] ======================================================================================================= */
form,button,select,input,textarea{outline:none;}
textarea{resize:none; overflow:auto; vertical-align:top;}
button, input, select, textarea{vertical-align:baseline; *vertical-align:middle; } /* 세로정렬 위치 통일 */
button, input{line-height:normal;} /* line-height 통일(파폭3+) */
button, select{text-transform:none; -webkit-appearance:none;}/* value 값 대소문자 초기화, button(크롬, 사파리5+, IE6+ 적용), select(파폭4+, 오페라) */
/* 1. 안드로이드 4.0 이상의 웹킷 브라우저에서 audio와 video의 버그 방지
 * 2. iOS에서 input 요소의 type 속성값을 인식하지 못하는 버그 방지
 * 3. IE 7에서 내부 간격을 제거하는 핵(IE 6은 내부 간격이 남아있음) */
button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"]{-webkit-appearance:button;/* 2 */ cursor:pointer; *overflow:visible;/* 3 */}
button[disabled], html input[disabled]{cursor:default;} /* disabled 된 button과 input 커서모양 기본값 */
button::-moz-focus-inner, input::-moz-focus-inner{border:0; padding:0;} /* 파폭3+ 에서 button과 input의 패딩과 보더값0 */
input{border:none;} /* input 테두리 없애기(크롬, Ie) */
/* 1. IE 8/9에서 box sizing 속성값을 content-box에서 border-box로 변경
 * 2. IE 8/9에서 패딩 제거. IE 7은 핵을 이용해 패딩 제거(IE 6은 패딩이 남아있음) */
input[type="checkbox"], input[type="radio"]{box-sizing:border-box;/* 1 */ padding:0;/* 2 */ *height:13px;/* 2 */ *width:13px;/* 2 */}
/* 1. 사파리5와 크롬에서 텍스트 입력 가능
 * 2. 해당 영역의 크기를 콘텐츠 영역만큼 설정하도록 content-box 설정 */
input[type="search"]{-webkit-appearance:textfield;/* 1 */ -moz-box-sizing:content-box;/* 2 */ -webkit-box-sizing:content-box;/* 2 */ box-sizing:content-box;/* 2 */}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance:none;} /* 맥의 사파리5와 크롬의 내부 패딩과 검색 취소 버튼 제거*/
fieldset{border:1px solid #c0c0c0; margin:0 2px; padding:0.35em 0.625em 0.75em;}
legend{border:0;  padding:0; white-space:normal; *margin-left:-7px;} /* 파폭3에서 캡션내용의 공백문자 통일(IE 6/7은 핵사용) */
fieldset{border:0; padding:0; margin:0}


/* ====== common ======================================================================================================= */
.ellipsis{text-overflow:ellipsis; overflow:hidden; white-space:nowrap;  word-wrap:break-word}
.ellipsis2, .ellipsis3{display:-webkit-box; text-overflow:ellipsis; overflow:hidden; -webkit-box-orient:vertical; word-wrap:break-word}
.ellipsis2{-webkit-line-clamp:2}
.ellipsis3{-webkit-line-clamp:3}
.wrap{position:relative; max-width:828px; margin:0 auto; font-size:0;}
.img_line:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border-radius:8px; border:1px solid rgba(0,0,0,.08);}
/* color_style */
.color_style_fill{fill:#303038;}
.color_style_font{color:#303038;}
.color_style_identity{color:#1BA2DA;}
/* btn */
.btn_bg{font-size:0; text-align:center; margin:30px 0}
.btn{display:inline-block; vertical-align:middle; padding:9px 16px; border:1px solid #E6E6E6; border-radius:8px; background:#fff;}
.btn span{display:inline-block; vertical-align:middle; font-size:15px; font-weight:500; line-height:24px; padding:0 8px 0 16px; max-width:198px; min-width:150px;}
.btn span b{font-weight:500;}
.btn_icon{display:inline-block; vertical-align:middle; width:24px; height:24px; fill:#B9B9B9}
/* 기후시계 */
.climate{margin:30px 0 10px}
/* top */
.top{position:fixed; bottom:50px; right:20px; width:38px; height:38px; border:1px solid rgba(0,0,0,.1); border-radius:8px; z-index:2; background:rgba(255,255,255,0.9); backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px); box-shadow:0 1px 4px 0 rgba(0,0,0,.05);}
.top svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:34px; height:34px; }
/* breaking */
.breaking{position:relative; display:block; margin:8px 10px; border-radius:8px; border:1px solid rgba(0,0,0,.1); background:rgba(255,255,255,.8); box-shadow:0px 2px 15px 0px rgba(0,0,0,.04); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); padding:8px}
.breaking_rolling_bg{position:relative; overflow:hidden; width:calc(100% - 20px)}
.breaking_rolling{display:flex; height:100%; justify-content:center; align-items:center}
.breaking_rolling_list_bg{position:relative; width:100%; height:18px}
.breaking_rolling_list{position:relative; width:auto; height:100%; overflow:hidden}
.breaking_rolling_list li{position:absolute; top:-18px; left:0; right:0}
.breaking_rolling_list li.prev{top:-18px; transition:top 0.4s ease; }
.breaking_rolling_list li.current{top:0; transition: top 0.4s ease;}
.breaking_rolling_list li.next{top:18px;}
.breaking_rolling_list li a{display:block;}
.breaking_time{display:inline-block; vertical-align:middle; width:35px; border-radius:4px; background:#E84C4C; margin-right:8px; text-align:center; font-size:10px; font-weight:500; line-height:18px; color:#fff}
.breaking_rolling_list a span{display:inline-block; vertical-align:middle; font-size:13px; line-height:18px; font-weight:500; width:calc(100% - 43px)}
.breaking_btn{position:absolute; top:5px; right:2px; width:24px; height:24px; z-index:1;}
.breaking_icon{width:24px; height:24px; fill:rgba(0,0,0,.2);}


/* ====== ad ======================================================================================================= */
.ad{position:relative; margin:20px 0; text-align:center; z-index:0}
.ad a{display:block}
.ad img, .ad iframe{display:block; width:100%; margin:0 auto !important}
.ad > div{display:inline-block}
.ad.ad1.view_bottom_iframe4 > iframe{min-width:auto !important; width:calc(100% - 40px) !important}/* 이 광고에서만 사용되는 가로값 */
.ad.ad1.view_bottom_iframe1 > iframe, .ad.ad1.view_bottom_iframe3 > iframe, .ad.ad1.view_bottom_script7 > div{width:320px}/* 이 광고에서만 사용되는 가로값 */
.ad.ad1.view_bottom_script7{z-index:3; margin:0}
.ad.ad1.view_bottom_script7 iframe{display:inline-block; width:320px}


/* ====== header_menu_all_bg ======================================================================================================= */
/* header_menu_all_bg */
.header_menu_all_black_touch, .header_menu_all_bg{z-index:11; position:fixed; left:0; font-size:0; display:none}
.header_menu_all_black_touch{top:0; right:0; bottom:0}
.header_menu_all_black{position:fixed; top:48px; left:0; right:0; bottom:0; background:rgba(0,0,0,.6);}
.header_menu_all_bg{background:rgba(255,255,255,.93); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px);  top:48px; width:290px; height:calc(100% - 48px);}
.header_menu_all_black_touch.active, .header_menu_all_bg.active{display:block;}
.header_menu_all{padding-top:10px; height:calc(100% - 10px);}
.header_menu_all_sch{position:relative; margin:0 20px 10px; height:38px; border-radius:8px; border:1px solid rgba(0,0,0,.1); background:rgba(255,255,255,.8);}
.header_menu_all_sch input{position:absolute; top:0; left:20px; right:40px; height:100%; background:transparent; font-size:17px; font-weight:400;}
.header_menu_all_sch button{background:transparent; position:absolute; top:-1px; right:-1px; width:40px; height:40px;}
.header_menu_all_sch button svg{position:absolute; top:50%; height:50%; transform:translate(-50%,-50%); width:24px; height:24px;}
.header_menu_all_bnn{position:relative; overflow:hidden; display:block; border-radius:8px; margin:0 20px 10px; height:40px; background:#666;}
.header_menu_all_bnn img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; }
/* header_menu_all_cate_bg */
.header_menu_all_cate_bg{position:relative; overflow-y:scroll; height:calc(100% - 212px);}
.header_menu_all_cate_special{border-top:1px solid rgba(0,0,0,.06);}
.header_menu_all_cate_acc{position:relative; padding:12px 20px 11px;; width:100%; text-align:left; background:transparent;}
.header_menu_all_cate_acc span{display:block; width:calc(100% - 24px); font-size:17px; line-height:21px; font-weight:500}
.header_menu_all_cate_acc span img{max-width:170px; max-height:21px; display:inline-block; vertical-align:middle;}
.header_menu_all_cate_acc_icon{position:absolute; top:9px; right:16px; width:24px; height:24px; fill:rgba(0,0,0,.2); transition:.1s;}
.header_menu_all_cate_acc_li_bg{max-height:0; overflow:hidden; transition:max-height .1s ease-out}
.header_menu_all_cate_acc_li{border-top:1px solid rgba(0,0,0,.05); border-bottom:1px solid rgba(0,0,0,.05); background:rgba(0,0,0,.04); padding:10px; }
.header_menu_all_cate_acc_li li{width:50%; display:inline-block; vertical-align:top}
.header_menu_all_cate_acc_li li a{display:block; padding:0 10px; font-size:14px; line-height:34px; font-weight:400; border-radius:8px;}
.header_menu_all_cate_acc_li li a b{font-weight:600}
.header_menu_all_cate_acc.header_menu_all_cate_acc_no .header_menu_all_cate_acc_icon{display:none;}
.header_menu_all_cate_acc.active .header_menu_all_cate_acc_icon{transform:rotate(180deg); fill:#303038}
.header_menu_all_cate_acc_li li.on a{background:rgba(255,255,255,.7); font-weight:600;}
.header_menu_all_cate > li:last-child .header_menu_all_cate_acc_li{border-bottom:none;}
.header_menu_all_cate.header_menu_all_cate_special .header_menu_all_cate_acc_bg:last-child .header_menu_all_cate_acc_li li{width:100%}
/* header_menu_all_footer */
.header_menu_all_footer_li{text-align:center; border-top:1px solid rgba(0,0,0,.06); border-bottom:1px solid rgba(0,0,0,.06);}
.header_menu_all_footer_li li{display:inline-block; vertical-align:middle; width:50%}
.header_menu_all_footer_li li a{display:block;}
.header_menu_all_footer_li li a svg, .header_menu_all_footer_li li a span{display:inline-block; vertical-align:middle;}
.header_menu_all_footer_li li a svg{width:14px; height:14px; margin-right:8px}
.header_menu_all_footer_li li a span{font-size:14px; font-weight:500; line-height:54px;}
/* header_menu_all_footer_sns */
.header_menu_all_footer_sns{text-align:center; padding:10px 0;}
.header_menu_all_footer_sns li{display:inline-block; vertical-align:middle; margin:0 7px}
.header_menu_all_footer_sns li a{display:block;}
.header_menu_all_footer_sns li a svg{width:36px; height:36px;}


/* ====== header ======================================================================================================= */
/* header */
header{position:fixed; z-index:10; top:0; left:0; width:100%; background:rgba(255,255,255,.92); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 2px 10px rgba(0,0,0,.1); height:48px; font-size:0; transition:.1s;}
.header_icon{position:absolute; top:0; width:48px; height:48px; display:block;}
.header_icon svg{position:absolute; top:50%; left:50%; width:24px; transform:translate(-50%,-50%); transition:.1s;}
.header_menu{left:0}
.header_logo{position:absolute; top:0; left:calc(50% - 80px); width:160px; height:48px; display:block; background:url(//res.heraldm.com/koreaherald/version03/mobile/images/logo.png) no-repeat center; background-size:160px; transition:.1;}
.header_my{right:0}
/* .header_index */
.header_index{background:transparent; backdrop-filter:blur(0); -webkit-backdrop-filter:blur(0); box-shadow:none}
.header_index .color_style_fill{fill:#fff}
.header_index .header_logo{background:url(//res.heraldm.com/koreaherald/version03/mobile/images/logo_w.png) no-repeat center; background-size:160px}
/* .header_index.change */
.header_index.change, .header_index.active{background:rgba(255,255,255,.92); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 2px 10px rgba(0,0,0,.1); }
.header_index.change .color_style_fill, .header_index.active .color_style_fill{fill:#303038}
.header_index.change .header_logo, .header_index.active .header_logo{background:url(//res.heraldm.com/koreaherald/version03/mobile/images/logo.png) no-repeat center; background-size:160px}


/* ====== index ======================================================================================================= */
/* main_top */
.main_top{position:relative; font-size:0; padding-top:48px; height:442px;}
/* main_top .breaking */
.main_top .breaking{position:absolute; width:calc(100% - 36px); z-index:1; border:none; background:rgba(0,0,0,.5);}
.main_top .breaking .color_style_font{color:#fff}
.main_top .breaking .breaking_icon{fill:rgba(255,255,255,.5);}
/* main_top_article */
.main_top_article, .main_top_article_img_bg, .main_top_article_img, .main_top_article_img_black{position:absolute; top:0; left:0;}
.main_top_article{right:0; bottom:0; display:block;}
.main_top_article_img_bg{width:100%; height:100%;}
.main_top_article_img{width:100%; height:100%; object-fit:cover;}
.main_top_article_img_black{width:100%; height:100%;
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.2) 18%,rgba(0,0,0,0.4) 70%,rgba(0,0,0,0.9) 100%); 
background: linear-gradient(to bottom,  rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.2) 18%,rgba(0,0,0,0.4) 70%,rgba(0,0,0,0.9) 100%); }
.main_top_article_t_bg{position:absolute; left:24px; right:24px; bottom:26px}
.main_top_article_tag{display:inline-block; font-size:13px; font-weight:500; color:#fff; line-height:26px; border-radius:13px; padding:0 15px; background:rgba(255,255,255,.3); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px);}
.main_top_article_title{font-size:24px; font-weight:500; color:#fff; line-height:29px; margin:10px 0;}
.main_top_article_txt{font-size:14px; font-weight:300; color:rgba(255,255,255,.5); line-height:19px;}
/* relation */
.relation{font-size:0; margin-bottom:40px;}
.relation_li{position:relative; padding:20px 20px 0 16px;}
.relation_li:before{position:absolute; content:""; width:0; top:0; left:27px; bottom:3px; border-left:1px dashed rgba(0,0,0,.15);}
.relation_li li + li{margin-top:18px}
.relation_li li a{display:block;}
.relation_li_icon{position:relative; display:inline-block; vertical-align:top; width:24px; height:24px; fill:#B9B9B9; margin-right:6px; background:#fff}
.relation_li_txt{display:inline-block; vertical-align:top; width:calc(100% - 30px); font-size:20px; font-weight:600; line-height:26px;}
/* article (newsmaker) */
.article{padding:0 20px; font-size:0;}
.article_title{position:relative; display:block;}
.article_title span{display:inline-block; vertical-align:top; font-size:22px; font-weight:800; line-height:28px; padding:15px 0; max-width:calc(100% - 30px);}
.article_title span span{font-size:14px; font-weight:400; vertical-align:top; padding:0; max-width:none;}
.article_title span span:before{content:""; width:1px; height:10px; background:#D9D9D9; display:inline-block; vertical-align:middle; margin:-2px 9px 0}
.article_title.article_title_img span{font-size:0}
.article_title.article_title_img span img{max-width:240px; max-height:28px; display:inline-block; vertical-align:middle;}
.article_title_icon{position:absolute; top:17px; right:-2px; width:24px; height:24px; fill:rgba(0,0,0,.3)}
.article_li li{margin-bottom:20px; position:relative}
.article_li li a{display:block;}
.article_li_img_bg{position:relative; overflow:hidden; padding-bottom:60%; border-radius:8px; margin-bottom:12px;}
.article_li_img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.article_li_img_black{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.2);}
.article_li_img_play{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:36px; height:36px; fill:#fff}
/*
.article_li_title_cate{font-size:20px; font-weight:700; line-height:26px; margin-bottom:6px;}
*/
.article_li_title{font-size:20px; font-weight:700; line-height:26px; margin-bottom:6px;}
.article_li_txt{font-size:14px; font-weight:400; line-height:19px; color:rgba(0,0,0,.4);}
.article_li_day{font-size:13px; font-weight:400; line-height:17px; color:rgba(0,0,0,.4); margin-top:6px}
.article_text_only:before{content:""; position:absolute; height:1px; left:0; right:0; background:#f2f2f2; top:-10px}
/* article.article_type2 (opinion) */
.article.article_type2 .article_li{margin:0 -8px}
.article.article_type2 .article_li li{display:inline-block; vertical-align:top; width:calc(50% - 16px); margin:0 8px 16px}
.article.article_type2 .article_li_img_bg{margin-bottom:8px;}
.article.article_type2 .article_li_title_cate{font-size:13px; font-weight:500; line-height:17px; margin-top:-2px;}
.article.article_type2 .article_li_title{font-size:15px; font-weight:500; line-height:18px; margin-bottom:0}
.article.article_type2 .article_li_img_play{width:24px; height:24px;}
/* popular */
.popular{padding:0 20px; font-size:0; margin-bottom:20px}
.popular_li li{position:relative;}
.popular_li li a{display:block; padding:8px 0 7px;}
.popular_li li a:after{position:absolute; content:""; width:calc(53% - 16px); height:1px; background:#F2F2F2; bottom:0; right:0;}
.popular_li_img_bg{display:inline-block; vertical-align:middle; position:relative; overflow:hidden; width:47%; padding-bottom:28%; margin-right:16px; border-radius:8px;}
.popular_li_img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.popular_li_tag{position:absolute; top:0; left:0; width:24px; line-height:24px; text-align:center; border-radius:0 0 8px 0; background:rgba(27,162,218,.9); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); font-size:14px; color:#fff; font-weight:500;}
.popular_li_t_bg{display:inline-block; vertical-align:middle; width:calc(53% - 16px)}
.popular_li_title{font-size:16px; font-weight:500; line-height:19px; margin-bottom:4px;}
.popular_li_cate{ font-size:14px; font-weight:400; line-height:20px; color:rgba(0,0,0,.4);}
.popular_li_tag_cate{position:absolute; bottom:6px; left:6px; line-height:19px; border-radius:11px; background:rgba(27,162,218,.6); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); font-size:10px; font-weight:500; color:#fff; padding:0 10px; max-width:70%;}
/* graphic */
.graphic{font-size:0; margin-bottom:20px;}
.graphic .article_title{margin:0 20px}
.graphic_swiper{position:relative; overflow:hidden;}
.graphic_swiper .swiper-wrapper{margin-bottom:28px; }
.graphic_swiper .swiper-slide{width:55% !important; border-radius:8px; overflow:hidden;}
.graphic_swiper_img_bg{position:relative; overflow:hidden; display:block; padding-bottom:177.8%; border-radius:8px;}
.graphic_swiper_img_bg img{position:absolute; top:0; left:0; width:100%; height:100%;}
.graphic_swiper .swiper-pagination{bottom:0}
.graphic_swiper .swiper-pagination-bullet{background:#d9d9d9; opacity:1;}
.graphic_swiper .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#303038;}
/* culture */
.culture{padding:0 20px; font-size:0; margin-bottom:20px;}
.culture_img_bg{position:relative; overflow:hidden; display:block; padding-bottom:77.1%; border-radius:8px;}
.culture_img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.culture_title_bg{position:absolute; left:0; right:0; bottom:0; padding:15px 20px 14px; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); background:rgba(0,0,0,.3);}
.culture_title_bg_color{position:absolute; left:0; right:0; top:0; bottom:0; opacity:.5;}
.culture_title{position:relative; font-size:20px; line-height:26px; font-weight:500; color:#fff;}
/* hashtag */
.hashtag{font-size:0; margin-bottom:20px;}
.hashtag .article_title{margin:0 20px}
.hashtag_swiper{position:relative; overflow:hidden;}
.hashtag_swiper .swiper-slide{width:54% !important;}
.hashtag_swiper .culture_title_bg{padding:12px 14px;}
.hashtag_swiper .culture_title{font-size:16px; line-height:20px; font-weight:500;}
/* kpop */
.kpop{padding:0 20px; font-size:0; margin-bottom:20px;}
.kpop_li{margin:0 -2px}
.kpop_li li{display:inline-block; vertical-align:top; position:relative; overflow:hidden; border-radius:8px; width:calc(36.2% - 4px); padding-bottom:calc(36.2% - 4px); background:#666; margin:0 2px 4px}
.kpop_li:after{content:""; display:table; table-layout:fixed; clear:both}
.kpop_li li a{display:block; font-size:30px; position:absolute; top:0; left:0; right:0; bottom:0}
.kpop_li_t_bg{position:absolute; left:0; bottom:0; right:0; padding:29px 10px 8px;
background:-webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%);
background:linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); 
}
.kpop_li_t{font-size:11px; font-weight:500; line-height:12px; color:#fff;}
.kpop_li li:first-child{float:left; width:calc(63.8% - 4px); padding-bottom:calc(72.4% - 4px);}
.kpop_li li:first-child .kpop_li_t_bg{padding:57px 14px 12px;}
.kpop_li li:first-child .kpop_li_t{font-size:16px; line-height:19px;}
/* video */
.video{font-size:0; margin-bottom:20px;}
.video .article_title{margin:0 20px}
.video_swiper{position:relative; overflow:hidden;}
.video_swiper .swiper-slide{width:85.8% !important;}


/* ====== footer ======================================================================================================= */
footer{font-size:0; border-top:1px solid rgba(0,0,0,.06); padding:20px 20px 30px; text-align:center;}
.footer_li li{display:inline-block; vertical-align:top; margin:0 10px}
.footer_li li a{display:block; font-weight:400; font-size:14px; line-height:26px; color:rgba(0,0,0,.6);}
.footer_li li a b{font-weight:600;}
.footer_sns li{display:inline-block; vertical-align:top; margin:0 7px}
.footer_sns li a{display:block;}
.footer_sns_icon{width:36px; height:36px;}
.footer_copy{font-weight:300; font-size:12px; line-height:20px; color:rgba(0,0,0,.4);}
.footer_copy b{font-weight:600}
.footer_our_site{position:relative; display:inline-block; vertical-align:middle; width:100%; max-width:230px; height:42px; border:1px solid #E6E6E6; border-radius:8px; background:#fff;}
.footer_our_site select{position:absolute; top:0; left:0; width:100%; height:100%; background:transparent; font-size:15px; font-weight:500; line-height:24px; padding:0 45px 0 5px; cursor:pointer; z-index:1; text-align-last:center;}
.footer_our_site_icon{position:absolute; top:9px; right:16px; width:24px; height:24px; fill:#B9B9B9;}


/* ====== header_logo_special (스페셜로고로 변경될경우 클래스명 변경, 관련 이미지 및 가로값 변경) ======================================================================================================= */
.header_index .header_logo.header_logo_special_70{background:url(//res.heraldm.com/koreaherald/version03/mobile/images/special_logo_70_w.png) no-repeat center; background-size:180px}
.header_logo.header_logo_special_70,
.header_index.change .header_logo.header_logo_special_70,
.header_index.active .header_logo.header_logo_special_70
{left:calc(50% - 90px); background:url(//res.heraldm.com/koreaherald/version03/mobile/images/special_logo_70.png) no-repeat center; background-size:180px; width:180px}
@media screen and (min-width:560px) {
.header_index .header_logo.header_logo_special_70{background:url(//res.heraldm.com/koreaherald/version03/mobile/images/special_logo_70.png) no-repeat center; background-size:180px}
}


/* ====== contents ======================================================================================================= */
.contents{position:relative; max-width:828px; margin:0 auto; font-size:0; padding-top:48px}
.contents_title{font-size:24px; font-weight:800; line-height:31px; padding:12px 20px 10px}
.contents_title span{font-size:14px; font-weight:400; display:inline-block; vertical-align:middle;}
.contents_title img{max-width:240px; max-height:28px; display:inline-block; vertical-align:middle;}
.contents_title span:before{content:""; width:1px; height:10px; background:#D9D9D9; display:inline-block; vertical-align:middle; margin:-2px 9px 0}
.contents .article.article_type2 .article_li{margin-bottom:-16px;}
.contents .latest .popular_li li a{padding:16px 0 14px;}
.contents .latest .popular_li li a:after{width:100%}
.contents .latest .article_li_txt{margin-top:10px}
.contents .relation{margin-bottom:30px;}
.contents .relation .article_title{padding:0 20px}
/* list_menu */
.list_menu{position:relative; overflow:hidden; margin:0 20px 16px; padding-right:38px; height:38px;}
.list_menu_li li{display:inline-block; vertical-align:top; margin:0 4px 4px 0}
.list_menu_li li a{display:block; font-size:14px; line-height:16px; font-weight:400; border-radius:8px; border:1px solid rgba(0,0,0,.1); padding:8px 16px; background:rgba(255,255,255,.8);}
.list_menu_li li.on a{background:rgba(27,162,218,.9); border:1px solid rgba(0,0,0,.14); color:#fff; font-weight:600;}
.list_menu_li li .list_menu_li_series{border-color:rgba(0,0,0,.7); font-weight:600;}
.list_menu_li li.on .list_menu_li_series{background:transparent; border-color:rgba(0,0,0,.7); color:#303038;}
.list_menu_btn{position:absolute; top:0; right:0; width:32px; height:32px; border:1px solid rgba(0,0,0,.1); border-radius:50%;}
.list_menu_btn_icon{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:24px; height:24px; transition:.1s;}
/* list_menu.active */
.list_menu.active{height:auto; position:absolute; left:0; right:0;
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 100%); background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 100%);  
backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px); margin:0; padding:0 56px 16px 20px; z-index:1; box-shadow:0 7px 7px rgba(0,0,0,.03);}
.list_menu.active .list_menu_btn{right:20px}
.list_menu.active .list_menu_btn_icon{transform:rotate(180deg) translate(50%,50%)}
.list_menu_top1.active{margin-top:54px}
/* list_menu_global */
.list_menu_global{position:relative; overflow:hidden; margin:0 0 16px;}
/* view_head */
.view_head{margin:0 20px 20px}
.view_headline{font-size:24px; font-weight:500; line-height:1.3; letter-spacing:-.2px; margin:0 0 6px;}
.view_headline_subtitle{font-size:18px; font-weight:400; line-height:1.3; letter-spacing:-.2px; margin:0 0 8px; color:rgba(0,0,0,.4)}
.view_head_day{font-size:14px; font-weight:400; line-height:1.3; color:rgba(0,0,0,.4); letter-spacing:-0.14px; margin-bottom:10px; display:block;}
.view_head_journalist{display:block;}
.view_head_journalist_icon{display:inline-block; vertical-align:middle; width:26px; height:26px; stroke:rgba(0,0,0,.2); margin-right:6px}
.view_head_journalist_name{display:inline-block; vertical-align:middle; font-size:14px; font-weight:400; line-height:1.4; width:calc(100% - 34px)}
.view_head .view_head_journalist + .view_head_journalist{margin-top:6px}
/* view_info */
.view_info{margin:0 20px; padding-bottom:20px; border-bottom:1px solid #F2F2F2}
.view_info_li li{display:inline-block; vertical-align:middle;}
.view_info_li li a{display:block; width:24px; height:24px;}
.view_info_li li + li{margin-left:14px}
.view_info_l{float:left;}
.view_info_r{float:right;}
.view_info:after{content:""; display:table; table-layout:fixed; clear:both}
/* view_info_li_share */
#mask{background:rgba(0,0,0,0.7); position:fixed; left:0; top:0; width:100%; height:100%; z-index:10}
.view_info_li_share_close{position:absolute; display:block; bottom:-57px; left:50%; width:40px; height:40px;border:1px solid rgba(255,255,255,.3); border-radius:50%; margin-left:-22px; backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); background:rgba(0,0,0,.3);}
.view_info_li_share_close svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:24px; height:24px; fill:#fff}
.view_info_li_share{position:fixed; background:rgba(255,255,255,.9); top:50%; left:50%; width:240px; z-index:11; font-size:0; display:none; transform:translate(-50%,-50%); border-radius:8px; padding:10px;backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 4px 20px rgba(0,0,0,.1);}
.view_info_li_share_li li{display:inline-block; vertical-align:middle; width:33.33%; position:relative;}
.view_info_li_share_li li button{display:block; width:100%; padding-bottom:100%; position:relative; background:transparent; border-radius:8px;}
.view_info_li_share_li li button svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.view_info_li_share_li li button .view_info_li_share_li_icon_share{fill:#777; width:34px}
.view_info_li_share_li li button .view_info_li_share_li_icon_reddit{fill:#ff4500; width:46px}
.view_info_li_share_li li button .view_info_li_share_li_icon_twitter{fill:#1d9bf0; width:38px}
.view_info_li_share_li li button .view_info_li_share_li_icon_facebook{fill:#1877f2; width:42px;}
.view_info_li_share_li li button .view_info_li_share_li_icon_kakao{fill:#3d1d1a; width:40px}
.view_info_li_share_li li button .view_info_li_share_li_icon_mail{fill:#777; width:34px}
/* view_info_li_share_li_copied */
.view_info_li_share_li_copied{position:absolute; top:50%; left:50%; width:34px; height:34px; margin:-17px 0 0 -17px; border-radius:40px; display:none;}
.view_info_li_share_li_copied_t{position:absolute; bottom:-17px; left:50%; width:60px; margin-left:-30px; font-size:10px; text-align:center; z-index:1; color:#666}
.view_info_li_share_li_copied_icon{position:absolute; top:50%; left:50%; width:56px; height:56px; margin:-28px 0 0 -28px; background:#ededed;}
.view_info_li_share_li_copied_icon_line{animation:0.34s cubic-bezier(0.65, 0, 1, 1) 0.1s forwards copied; stroke-dasharray:0, 75px; stroke-linecap:round; stroke-linejoin:round; stroke:#777;}
@keyframes copied{
from{stroke-dasharray:0, 75px;}
to{stroke-dasharray:75px, 75px;}
}
/* view_emil */
.view_emil{position:fixed; overflow:hidden; top:50%; left:50%; width:82%; transform:translate(-50%,-50%); background:rgba(255,255,255,.97); border-radius:8px; font-size:0; height:100%; max-height:76%; max-width:550px; display:none; z-index:12; backdrop-filter:blur(100px);
    -webkit-backdrop-filter:blur(100px); box-shadow:0 4px 20px rgba(0,0,0,.1);}
.view_emil form{height:100%}
.view_emil_top{overflow-y:scroll; height:calc(100% - 50px)}
.view_emil .popular_li{padding:10px 15px; border:1px solid rgba(0,0,0,.2); border-radius:8px;}
.view_emil .popular_li li a:after{display:none;}
.view_emil .article_li_txt{margin-top:10px;}
.view_emil_sub_title{font-size:18px; font-weight:500; padding:0 20px}
.view_emil_sub_input_bg{padding:20px}
.view_emil_sub_input_bg input{display:block; padding:0 20px; font-size:16px; line-height:38px; font-weight:500; width:calc(100% - 40px);  background:rgba(0,0,0,.05); margin-bottom:6px; border-radius:8px; color:#303038}
.view_emil_sub_input_bg input::-webkit-input-placeholder{color:#a8a8a8 !important; font-weight:400;}
.view_emil_sub_input_bg input:-ms-input-placeholder{color:#a8a8a8 !important; font-weight:400;}
.view_emil_btn_bg{position:absolute; left:0; right:0; bottom:0}
.view_emil_btn{display:block; font-size:15px; font-weight:500; line-height:50px; width:50%; display:inline-block; vertical-align:middle; text-align:center; background:#f1f1f1;}
.view_emil_btn2{background:#1BA2DA; color:#fff}
/* view_body */
.view_body{margin-bottom:40px;}
.view_body img{max-width:100%; display:block; margin:0 auto}
.view_body .youtube{margin:0 -20px; width:calc(100% + 40px); padding-bottom:calc(56% + 24px); position:relative}
.view_body .youtube iframe{position:absolute; top:0; left:0; width:100%; height:100%;}
.view_body p{padding:0 20px; font-size:18px; font-weight:400; line-height:1.5; margin:1.3rem 0; min-height:1.6rem;}
.view_body_img_bg{margin:1.3rem 0}
.view_body_img_cap{text-align:center; padding:0 30px; color:rgba(0,0,0,.4); font-size:14px; font-weight:400; line-height:1.4; margin-top:12px}
/* 토네이토 태그 적용 */
.view_body p em{font-style:italic}
.view_body p strong{font-weight:700}
.view_body p u{text-decoration:underline}
.view_body p strike{text-decoration:line-through}


/* view_journalist */
.view_journalist{margin:0 20px 20px;}
.view_journalist_li{margin-bottom:10px;}
.view_journalist_li li{border-radius:8px; border:1px solid rgba(0,0,0,.1); margin-bottom:10px;}
.view_journalist_li li a{display:block; padding:11px 16px 11px 20px}
.view_journalist_li_icon, .view_journalist_li_t, .view_journalist_li_more{display:inline-block; vertical-align:middle;}
.view_journalist_li_icon{width:46px; height:46px; stroke:rgba(0,0,0,.1); margin-right:16px}
.view_journalist_li_t{width:calc(100% - 96px);}
.view_journalist_li_name{font-size:16px; line-height:1.2; font-weight:500; word-break:break-all;}
.view_journalist_li_mail{font-size:14px; line-height:1.1; font-weight:400; color:rgba(0,0,0,.4); word-break:break-all; margin-top:4px}
.view_journalist_li_more{width:24px; height:24px; margin-left:10px; fill:rgba(0,0,0,.3)}
.view_journalist_li_btn{display:block; text-align:center; background:#F5F5F5; border-radius:8px; padding:5px 0;}
.view_journalist_li_btn_icon{width:24px; height:24px; fill:rgba(0,0,0,.3); display:inline-block; vertical-align:middle;}


/* ====== journalist ======================================================================================================= */
/* journalist */
.contents_journalist{padding-top:0;}
.journalist{background:url(//res.heraldm.com/koreaherald/version03/mobile/images/journalist.png) center no-repeat; background-size:cover; padding:78px 30px 30px;}
.journalist_icon{width:80px;height:80px; stroke:rgba(0,0,0,.1); margin-right:20px;}
.journalist_icon, .journalist_t_bg{display:inline-block; vertical-align:middle;}
.journalist_t_bg{width:calc(100% - 100px)}
.journalist_name{font-size:22px; font-weight:700; line-height:28px; color:#fff; margin-bottom:8px; word-break:break-all;}
.journalist_mail{font-size:14px; font-weight:400; line-height:17px; color:rgba(255,255,255,.7); word-break:break-all;}


/* ====== search ======================================================================================================= */
/* search */
.search_head_bg .article_title{padding:0 20px;}
.search_head{position:relative; overflow:hidden; background:#F1F1F1; border-radius:8px; margin:0 20px 10px;}
.search_head_input{position:relative; width:calc(100% - 60px); padding:0 40px 0 20px; font-size:17px; font-weight:400; line-height:40px; background:transparent;}
.search_head_btn{position:absolute; width:40px; height:40px; top:0; right:0; background:transparent;}
.search_head_icon{width:24px; height:24px}
.search_head_tab{position:relative;}
.search_head_tab:after{position:absolute; content:""; bottom:0; left:0; right:0; height:1px; background:rgba(0,0,0,.1);}
.search_head_tab li{display:inline-block; vertical-align:middle; width:50%}
.search_head_tab li a{ line-height:44px; display:block; text-align:center;}
.search_head_tab li a span{display:inline-block; vertical-align:middle; position:relative; font-size:17px; font-weight:400;}
.search_head_tab li a span:after{position:absolute; content:""; bottom:0; left:0; right:0; height:2px;}
.search_head_tab li.on a span{ font-weight:700;}
.search_head_tab li.on a span:after{background:#303038;}
.search_head_results{margin:16px 16px 0 20px}
.search_head_results:after{content:""; display:table; table-layout:fixed; clear:both}
.search_head_results_l{float:left; font-size:15px; line-height:24px; color:rgba(0,0,0,.4); font-weight:400; max-width:50%; word-break:break-all;}
.search_head_results_l b{font-weight:500;}
.search_head_results_r{float:right; position:relative; max-width:50%}
.search_head_results_r select{width:100%; font-size:14px; height:24px; font-weight:400; text-align-last:right; padding-right:28px; cursor:pointer; background:transparent;}
.search_head_results_r_icon{position:absolute; top:0; right:0; width:24px; height:24px; fill:rgba(0,0,0,.2);}
.search_img_li{margin:16px 15px 4px}
.search_img_li li{display:inline-block; vertical-align:top; position:relative; overflow:hidden; width:calc(50% - 10px); margin:0 5px 16px; border-radius:8px;}
.search_img_li li a{display:block; padding-bottom:100%;}
.search_img_li li a img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.search_no{font-size:15px; font-weight:400; line-height:1.3; text-align:center; color:#999; margin-bottom:20px; padding:15vh 20px;}
.search_no b{font-weight:600; color:#555}


/* ====== announce ======================================================================================================= */
/* announce */
.announce{padding:0 20px}
.announce_li li{border-bottom:1px solid #F2F2F2;}
.announce_li li a{display:block; padding:15px 0;}
.announce_li_notice{font-size:10px; font-weight:600; line-height:18px; color:#fff; background:rgba(27,162,218,.8); display:inline-block; padding:0 5px; border-radius:4px; margin-bottom:10px;}
.announce_li_title{font-size:17px; line-height:25px; font-weight:900; margin-bottom:4px; font-family:'Nanum Myeongjo'; word-break:keep-all;}
.announce_li_day{font-size:14px; line-height:20px; font-weight:400; color:rgba(0,0,0,.4);}
/* paging */
.paging{text-align:center; padding:30px 0;}
.paging li{display:inline-block; vertical-align:top;}
.paging li a{display:block; position:relative; width:36px; line-height:36px; height:36px; font-size:16px; color:rgba(0,0,0,.40); font-weight:400;}
.paging li.on a{color:#303038; font-weight:700;}
.paging li a svg{width:24px; height:24px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); fill:#B9B9B9}
.paging li a.paging_prev svg{transform:translate(-50%,-50%) rotate(180deg);}
/* announce_view_bg */
.announce_view_bg{padding-top:15px;}
.announce_view_title{font-size:20px; line-height:31px; font-weight:900; margin-bottom:6px; font-family:'Nanum Myeongjo'; word-break:keep-all;}
.announce_view{padding:20px 0; border-top:1px solid #F2F2F2; border-bottom:1px solid #F2F2F2; font-family:'Nanum Myeongjo'; font-size:15px; line-height:28px; font-weight:400; color:#303038; margin:20px 0; overflow:hidden}
.announce_view table{max-width:100%; width:100% !important; margin:15px 0}
.announce_view table tr{height:inherit !important;}
.announce_view table th, .announce_view table td{padding:5px !important; height:auto !important; border:1px solid #ccc !important; font-size:12px; vertical-align:middle !important;}
.announce_view img{display:block; margin:0 auto; max-width:100%; height:auto !important}
.announce_view p, .announce_view span, .announce_view b{font-family:inherit !important; line-height:1.7 !important; font-size:inherit !important; word-break:break-all !important}
.announce_view p, .announce_view span{font-weight:600 !important}
.announce_view b{font-weight:900 !important}
.announce_view:after{content:""; display:table; table-layout:fixed; clear:both}
.announce .btn span{padding:0 12px;}


/* ====== ann ======================================================================================================= */
/* ann */
.ann{padding:0 20px}
.ann_top{margin-bottom:30px;}
.ann_top_img{display:block; width:90%; max-width:250px; margin:30px auto}
.ann_top_t{font-size:13px; line-height:19px; font-weight:400; color:rgba(0,0,0,.5); padding:0 10px;}
.ann_li{margin:0 -5px 20px}
.ann_li li{display:inline-block; vertical-align:top; position:relative; width:calc(33.33% - 10px); margin:0 5px 10px} 
.ann_li li a{display:block; }
.ann_li_img{position:relative; overflow:hidden; border-radius:8px; padding-bottom:60%; margin-bottom:6px;}
.ann_li_img img{position:absolute; top:50%; left:50%; max-width:68%; max-height:45%; transform: translate(-50%,-50%);}
.ann_li_t{padding:0 5px; font-size:12px; font-weight:400; line-height:15px;}


/* ====== contact ======================================================================================================= */
/* contact */
.contact{padding:0 20px}
.contact_li{padding-bottom:15px; border-bottom:1px solid #F2F2F2}
.contact_li:last-child{border:none;}
.contact_li_type1 li, .contact_li_type2 li{padding:5px 0;}
.contact_li_type1 li span, .contact_li_type2 li span{display:inline-block; vertical-align:middle; line-height:21px; font-size:16px; font-weight:400;}
.contact_li_type1 b{display:inline-block; vertical-align:middle; font-size:16px; font-weight:500; margin-right:15px}
.contact_li_type2 .announce_li_notice{vertical-align:middle; min-width:28px; text-align:center; margin:0 10px 0 0}
.contact_li_title{font-size:18px; font-weight:700; line-height:23px; margin:20px 0 15px;}
.contact_li_cap{font-size:12px; line-height:15px; font-weight:400; color:rgba(0,0,0,.4);}
.contact .footer_sns{margin:5px 0 10px}
.contact .footer_sns li:first-child{margin-left:0}
.contact .footer_sns li:last-child{margin-right:0}


/* ====== rss ======================================================================================================= */
/* rss */
.rss{padding:0 20px}
.rss_txt{border:1px solid rgba(0,0,0,.08); border-radius:8px; padding:15px 20px; font-size:15px; font-weight:400; line-height:22px; color:rgba(0,0,0,.5); margin-bottom:20px;}
.rss_li{margin-bottom:30px;}
.rss_li li{margin-bottom:20px}
.rss_li_title{font-size:18px; font-weight:700; line-height:23px; margin-bottom:10px}
.rss_li_link_bg{background:#f3f3f3; border-radius:8px; padding:15px;}
.rss_li_link_bg a{display:inline-block; vertical-align:middle;}
.rss_li_link_txt{width:calc(100% - 108px); margin-right:15px; color:rgba(0,0,0,.5); font-size:12px;line-height:16px; word-break:break-all;}
.rss_li_link_btn{width:88px; text-align:center; font-size:12px; line-height:30px; font-weight:500; border-radius:8px; border:1px solid rgba(0,0,0,.2); background:rgba(255,255,255,.8);}
.rss form{font-size:12px;}


/* ====== letter ======================================================================================================= */
/* letter */
.letter{padding:0 20px}
.letter_input_bg{position:relative; background:#f3f3f3; border-radius:8px;}
.letter_input{padding:0 20px; font-size:14px; line-height:42px; font-weight:500; color:#303038; width:calc(100% - 40px); background:transparent;}
.letter_input_type1{padding-right:100px; width:calc(100% - 120px)}
.letter_input_type1::-webkit-input-placeholder{color:#a8a8a8 !important; font-weight:400;}
.letter_input_type1:-ms-input-placeholder{color:#a8a8a8 !important; font-weight:400;}
.letter_input_bg button{position:absolute; top:50%; right:5px; text-align:center; font-size:12px; line-height:30px; font-weight:500; border-radius:8px; border:1px solid rgba(0,0,0,.4); background:rgba(255,255,255,.8); padding:0 10px; transform:translate(0,-50%);}
.letter_agree{border:1px solid rgba(0,0,0,.1); border-radius:8px; font-size:11px; font-weight:500; line-height:1.5; color:rgba(0,0,0,.4); padding:10px 15px; height:100px; overflow-y:scroll; margin-bottom:15px;}
.letter_agree b{font-weight:600; color:rgba(0,0,0,.4);}
/* letter_agree_chk */
.letter_agree_chk{position:relative}
.letter_agree_chk input{position:absolute; top:1px; left:1px; z-index:-1; width:1px; height:1px; cursor:pointer; opacity:0}
.letter_agree_chk label{display:block; cursor:pointer}
.letter_agree_chk_icon{position:relative; width:18px; height:18px; display:inline-block; vertical-align:middle; margin-right:5px; border:1px solid rgba(0,0,0,.2); border-radius:4px;}
.letter_agree_chk_icon svg{position:absolute; top:50%; left:50%; width:90%; height:90%; transform:translate(-50%,-50%); fill:rgba(0,0,0,.2)}
.letter_agree_chk_t{display:inline-block; vertical-align:middle; font-size:12px; font-weight:400; color:#999; line-height:1.3}
.letter_agree_chk input:checked + label .letter_agree_chk_icon{background:rgba(27,162,218,.8); border-color:rgba(27,162,218,.8)}
.letter_agree_chk input:checked + label .letter_agree_chk_icon svg{fill:#fff}
.letter_agree_chk input:checked + label .letter_agree_chk_t{color:#303038}


/* ====== errer ======================================================================================================= */
/* errer */
.errer{text-align:center; padding:60px 0 30px; word-break:keep-all;}
.errer_icon{width:30px; fill:#E84C4C; margin-bottom:10px;}
.errer_t_bg{line-height:1.5; padding:10px 0}
.errer_t1{font-size:20px; font-weight:600; margin-bottom:10px;}
.errer_t2{font-size:14px; font-weight:400; color:rgba(0,0,0,.5)}
.errer_t2 a{font-weight:600; color:#303038}
.errer_t_bg_korean .errer_t1{font-size:17px; font-weight:900;}
.errer_t_bg_korean .errer_t2{font-size:13px; font-weight:500;}


/* ====== 2단 ======================================================================================================= */
@media screen and (min-width:560px) {
body{background:#F8F8F8;}
/* top */
.top{right:30px;}
/* .header_index.change */
.header_index{background:rgba(255,255,255,.92); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 2px 10px rgba(0,0,0,.1); }
.header_index .color_style_fill{fill:#303038}
/* site_l, .site_r */
.site_l, .site_r{width:calc(50% - 24px); display:inline-block; vertical-align:top; margin:0 12px}
.site_bg{position:relative; border-radius:8px; border:1px solid rgba(0,0,0,.08); background:#FFF; box-shadow:0px 1px 15px 0px rgba(0,0,0,.04); margin-bottom:20px; }
.site_bg_type_main{border-radius:0 0 8px 8px; padding-bottom:10px;}
.site_bg_type_main .relation{margin-bottom:20px;}
.site_bg_type_main .btn_bg{margin-bottom:20px}
.site_bg_type1{padding-top:20px; padding-bottom:10px;}
.climate{margin:20px 0}
.site_bg_type_opinion{margin-top:68px; padding-bottom:4px;}
/* contents */
.search, .contents.announce_bg, .contents.ann_bg, .contents.contact_bg, .contents.rss_bg, .contents.newsletter_bg{margin-top:8px}
.contents .breaking{margin-bottom:8px;}
.contents .site_bg{margin:0 10px 20px}
.contents_title{padding-top:15px;}
.contents .ad > a{max-width:50%; margin:0 auto}
.contents .article{display:inline-block; vertical-align:top; width:calc(50% - 40px)}
.contents .article.article_type2 .article_li{margin-bottom:4px;}
.contents .article_global{display:block; width:calc(100% - 40px)}
.contents .popular_li li{display:inline-block; vertical-align:middle; width:calc(50% - 10px)}
.contents .popular_li li:nth-child(2n){margin-left:20px}
.contents footer{border:none; margin-top:-20px}
/* list_menu.active */
.list_menu_top2.active{margin-top:54px}
/* journalist */
.contents_journalist{padding-top:56px;}
.journalist{padding:30px 30px 30px; margin:0 10px 8px; border-radius:8px; border:1px solid rgba(0,0,0,.08); box-shadow:0px 1px 15px 0px rgba(0,0,0,.04);}
/* contact */
.contact_li_type1 li, .contact_li_type2 li{padding:5px 0; display:inline-block; vertical-align:middle; width:50%}
/* 231025 뷰페이지 'New on the Scene' 리스트 추가 */
.article.article_type2.scene{width:auto}
.article.article_type2.scene .article_li li{width:calc(25% - 16px)}
}