@charset "utf-8"; 

/* 메인화면 컴포넌트 */


/*───────────────────────────────────────────────────────────
공통
───────────────────────────────────────────────────────────*/
/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button { margin:0; padding:0; color: #111; letter-spacing:-0.18px} 
fieldset,img { border:0 none; vertical-align:top; } 
dl,ul,ol,li { list-style:none; margin-bottom: 0 } 
blockquote, q { quotes: none } 
blockquote:before, blockquote:after,q:before, q:after { content:''; content:none } 
input,select,textarea,button { vertical-align:middle } 
button { border:0 none; background-color:transparent; cursor:pointer; font-weight: 500; --bs-btn-font-weight:500; cursor: pointer } 

body { font-family: 'Pretendard','Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Dotum', 'Arial', sans-serif; --bs-body-font-family:'Pretendard','Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Dotum', 'Arial', sans-serif; font-style:normal; word-wrap: break-word; word-break: break-all; background-color: #fff; overflow-x: hidden; } 
body,th,td,input,select,textarea,button, pre, a { font-size:14px; line-height:1.5; color:#111; letter-spacing:-0.35px; word-break:break-all; font-family: 'Pretendard','Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Dotum', 'Arial', sans-serif; } 
a { color:#111; text-decoration:none; cursor: pointer } 
a:active, a:hover { text-decoration:none; } 
a:hover {color: inherit }
address,caption,cite,code,dfn,em,var { font-style:normal; font-weight:normal } 
em { font-style:normal; } 
table { border-spacing:0; border-collapse:collapse; width:100%; } 
legend { display: none; } 
caption { display: none; } 
img { width:100%; object-fit: cover; } 
textarea { resize: none !important; padding:15px; } 
textarea:focus-visible { outline: none } 

.form-control { -webkit-appearance:auto !important; appearance:auto !important; cursor: pointer; border:1px solid #dadce0; border-radius: 3px } 
.form-control:focus {border-color: inherit; cursor: pointer; box-shadow: none} 
.btn:focus, .btn:active, .btn:hover { box-shadow: none !important; outline: 0 !important; border-collapse: transparent !important } 
[class^="bi-"]::before, [class*=" bi-"]::before { line-height: inherit !important } 
label { cursor: pointer; margin-bottom: 0 } 
input:focus { border-color: inherit; -webkit-box-shadow: none; box-shadow: none; outline: inherit; } 
input[type="checkbox"] { cursor: pointer } 

.content a { display: block } 
.show { display: block } 
.m_nav { display: none }
.no-scroll { overflow: hidden}
/*dropdown*/
.dropbtn { } 
.dropdown { position: relative; display: inline-block } 
.dropdown-content { display: none; position: absolute; background-color: #fff; overflow: auto; z-index: 1; top: auto; bottom: 100%; } 
.dropdown-content a { display: block } 
#wrapper .dropdown-item.active, .dropdown-item:active { background-color: inherit; color:inherit } 
.show { display: block } 

/*layout*/
#wrapper { margin: 0 auto; width: 100%; height: 100%; min-width: 320px } 
.header { width: 100%; height: 100%; margin: 0 auto } 
.contents { margin: 10px auto; width: 100%; height: 100%} 



.description a { color: #666; font-weight: 400; font-size: 14px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box !important; overflow: hidden; text-overflow: ellipsis; white-space: normal } 


/*
pc메뉴와 모바일메뉴는 모든 템플릿에 공통적용

_wrap : 컨텐츠 감싸는 영역 (ex. haeader_wrap, footer_wrap 등 )
_area : wrap 보다 작은 영역


각 컴포넌트는 모두 _wrap 으로 감싸져있습니다. 컴포넌트에 _left 를 붙이면 왼쪽정렬이 됩니다. _right 오른쪽 정렬
모바일헤더(메뉴포함)는 공통으로 컴포넌트는 1개만 있습니다. 

fr, fl


* section : 각 단 컨텐츠 박스 

* 공통 클래스
- flex_wrap > let_wrap, right_wrap 반으로 나눌때 

* 큰 컴포넌트 : 컴포넌트_box로 표시됩니다. 
slide_box, article_box, banner_box

- 슬라이드 감싸는 클래스
: slide_box

- 기사 감싸는 클래스
: article_box


- 배너일경우
: banner_box


* 디테일 컴포넌트 
: slide_top_01, slide_01, slide_02, slide_03, 

- 카드기사일 경우
: card_box

- 썸네일기사일경우
: thum_box 

- 오피니언 같은 동그란 사진 기사일 경우
: opinion_box



- 모바일이 들어가는 경우 
: m_클래스

*/




/*컨텐츠 레이아웃*/
.flex_wrap { display: flex; justify-content: space-between; flex-shrink: 0; gap:20px } 
.flex_wrap > div:nth-child(1) {border-right: 1px solid #dadce0; padding-right: 20px}

.right_wrap { position: relative; width: 300px } 


/*단표시 구분*/
.section { display: block; margin-top:35px; padding-top: 17px; border-top:1px solid #222 } 
.section:first-child { border-top: none } 
.section_tit { display: inline-block;margin-bottom: 25px; color:#111; } 
.section_tit a { display: inline-block; padding-right: 25px; font-size: 20px; line-height: 1.3; color:#111; background: url(../images/ico/arrow.png) no-repeat center right } 
.section h3 {font-size:18px; font-weight: 600 }
.section h3 a { font-size:18px; font-weight: 600 }

.border_black {border-top:1px solid #222; width: 100%; margin-top: 30px; padding:20px 0}
.border_gray {border-top:1px solid #666; width: 100%; margin-top: 30px; padding:20px 0}



/*레이아웃 너비 지정 */
/*디폴트값 1200*/

.width_1280 {width:1280px}
.width_1200 {width:1200px}
.width_1100 {width:1100px}
.width_1000 {width:1000px}


/*칼라뱃지*/
.red {color:#e70a0a}


/*───────────────────────────────────────────────────────────
헤더 
───────────────────────────────────────────────────────────*/

#wrapper {width: 100%}

/*header */
.header {border-bottom: 1px solid #dadce0} 

/*header_wrap 로고가운데*/
.header_wrap {margin:0 auto; width: 1200px; min-width: 320px; height: auto; clear: both; height: 110px} 
.header_wrap .logo { position: relative; text-align: center } 
.header_wrap .logo a {display: inline-block} 
/*.header_wrap .logo img {max-height:62px}*/
.header_wrap h1 { display: block } 
.header_wrap h1 a { display: block } 
.header_area {position: relative; padding:15px 0; display: flex; justify-content:space-between; align-items: center } 
 
.header .util {position: absolute; right:0; top: 10px } 
.header .util_list {} 
.header .util_list li:first-child { padding-left: 0 } 
.header .util_list li:first-child::after { display: none } 


/*util_list*/
.util_list { position: relative; display: flex} 
.util_list li { padding: 0 10px } 
.util_list li { position: relative; display: inline-block; } 
.util_list li::after { position: absolute; content: ""; display: block; width: 1px; height: 13px; background:#d9d9d9; top: 2px; left:0px } 
.util_list li a { color: #757575; font-size: 13px; } 
 
.gnb_left {justify-content: flex-start}
.gnb .gnb_list {display: flex; align-items: center; flex-wrap: wrap }
.gnb .gnb_list li {margin: 0 10px}
.gnb .gnb_list a {display: inline-block; padding:0 5px; font-size: 17px; font-weight: 600 }


/*메뉴검색*/
.header_btn_box {display: flex}
.header .menu_btn { padding: 0; border: none; position: relative; width: 24px; height: 24px; background-image: url(../images/ico/menu.png); background-repeat:no-repeat; background-position:center center; background-size: 24px; border-radius: 0 } 
.header .menu_btn.on {background-image: url(../images/ico/close.png); background-size: 14px; background-position: center 4px } 
.header .menu_btn img { object-fit: contain} 

.header .search_area { margin: 0 auto 30px; width: auto; border-bottom: 1px solid #222; padding-bottom: 30px; width: 1200px;} 
.header .search_box { position: relative; width: 500px; height: 50px; margin: 0 auto } 
.header .search_box .form-control {width: 100%; padding-right: 40px; height: 100%; border-radius: 100px; border: 1px solid #dadce0; font-size: 18px; line-height: 1; cursor: text } 
.header .search_box .form-control:focus { box-shadow: 0 0 0 0.05rem rgba(13, 110, 253, 0.25) } 
.header .search_box .form-control::placeholder { font-size: 18px; line-height: 1; opacity: .8 } 
.header .search_box .btn_search {padding:0; position: absolute; right: 25px; top:9px; width: 30px; height: auto; cursor: pointer } 
.searchBtn {width: 20px}

/*버튼*/
.btn_wrap {margin: 0 auto; text-align: center; padding: 20px 0}

/*header_wrap 디폴트 왼쪽 header_wrap_left */
.header_wrap_left {clear: both; }
.header_wrap_left .gnb_list {justify-content: flex-end}
.header_wrap_left .header_area {display: block; text-align: right; padding-top: 60px; clear: both}
.header_wrap_left .header_area .logo {float: left; bottom: 35px }
.header_wrap_left .header_area .header_inner {display: flex; justify-content: flex-end}

.header.fix .util {display: none }
.header.fix .header_wrap.header_wrap_left .header_area {position: relative; width: 1200px; margin: 0 auto; top:16px; padding:0} 
.header.fix .header_wrap.header_wrap_left .header_inner { } 
.header.fix .header_wrap.header_wrap_left .logo {bottom: 6px}
.header.fix .header_wrap.header_wrap_left .logo img {width: 135px; height: 40px}


/*헤더픽스*/
.header.fix { width: 100% } 
.header.fix .header_wrap { position:fixed; top:0; left: 0; width:100%; max-width: 100%; height:60px; border-bottom:1px solid #c5c5c5 !important; background-color: #fff; z-index: 998 } 
.header.fix .gnb {width: auto; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); }
.header.fix .header_wrap .logo { text-align: center } 
.header.fix .header_wrap .logo h1 { width: 135px; display: inline-block; text-align: center } 
.header.fix .all_menu_wrap { top: -46px} 
.header.fix .all_menu { position: fixed; top: 104px; z-index: 999; left: 0; height: auto } 

.m_login {display: none}


/* pc전체메뉴 all_menu_wrap */
.all_menu {display: none; position: relative; width: 100%; height: 100%; margin: 0 auto } 
.all_menu_wrap { position: absolute; top:-1px; padding:40px 0 0; width: 100%; background: #fff; z-index: 999; box-shadow:0 4px 6px 0px rgb(32 33 36 / 10%); border-top: 1px solid #dadce0 } 
.all_menu_wrap a { color: #111; } 
.nav_area { display: flex; justify-content: space-between; margin: 30px auto 40px; width: 1200px} 
.nav_area dl { width: 100%; margin-right:20px; border-right: 1px solid #dadce0 } 
.nav_area dt a { display: block; margin-bottom: 12px; font-size: 15px; font-weight: 600 } 
.nav_area dd a { display: block; padding: 6px 0; color: #5a5a5a;; font-size:14px; font-weight:300 } 
.nav_area dl:last-child {border: none } 

.nav_bottom {margin-top: 40px; padding: 15px 0; border-top:1px solid #dadce0}
.nav_bottom > div {display: flex; justify-content: space-between}
.nav_bottom ul {display: flex; align-items: center }
.nav_bottom li {margin-right: 13px}
.nav_bottom li a {font-size: 15px; font-weight: 500}
.nav_bottom li a img {width: 18px; height: 18px; object-fit: contain}

#wrapper .contents .nav_area > div {margin-bottom: 25px}
.contents .nav_area dt a {margin-bottom: 5px}
.contents .nav_area dd a {font-size: 13px}


/* 모바일 메뉴 m_search_wrap */
.m_search_wrap { display: none; } 
.m_search { display: none; } 
.search_inner { position: absolute; z-index: 99; width: 100%; background: #fff; display: flex; height: 60px; align-items: center; } 
.search_inner .form-control { border-radius: 100px; margin-left: 10px } 
.search_inner img { width: 14px; height: 14px; margin-left: 20px } 

.m_menu_btn {display: none } 
#m_menu { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; overflow-y: scroll; z-index: 999999999; -webkit-overflow-scrolling: touch; } 
.m_menu_wrap { width: 100%; background: #fff; height: auto } 
.mmn01 > div { display: flex; align-items: center; justify-content: space-between } 
.mmn01 > div:first-child { padding: 0 20px; height:60px } 
.mmn01 > div:last-child { background-color: #ededed; padding: 15px 0 } 
.mmn01 > div:last-child a { width: 45%; margin: 0 10px; height: auto; padding: 10px; text-align: center; border-radius: 100px; font-size: 16px; font-weight: 600; background: #fff } 
.mmn01 > div:last-child a:first-child { color:#0072EC; border: 1px solid #0072EC } 
.mmn01 > div:last-child a:last-child { border: 1px solid #dadce0 } 
.mlogo { width: 140px; } 
.mclose { width: 19px } 

.mmn02 { padding: 25px 20px 40px } 
.mcate { padding-bottom: 10px } 
.mcate strong { display: inline-block; width: auto; margin-bottom: 20px; padding-right: 20px; background: url(../images/ico/arrow.png) no-repeat center right; background-size:7px } 
.mcate strong a { font-size: 18px; line-height: 1 } 
.mcate ul { display: flex; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-start } 
.mcate ul li { width: 50%; margin-bottom: 15px } 
.mcate ul li a { font-size: 16px; color:#757575; font-weight: 500; line-height: 1 } 
.mcate { margin-bottom: 25px; border-bottom: 1px solid #ededed } 
.mcate:last-child { border-bottom: none } 

.container {max-width: 100%; padding: 0; margin: 0 auto}


/*───────────────────────────────────────────────────────────
슬라이드
───────────────────────────────────────────────────────────*/

/*slide_box*/

.slide_box .swiper-wrapper { margin-bottom:50px } 
.swiper-wrapper { margin-bottom: 50px } 

.slide_tit { margin-bottom: 20px; text-align: center } 
.slide_tit a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 
.slide_cont { display: flex; justify-content: space-between; flex-direction: row-reverse; width: 100%; } 
.slide_cont .description a { margin-top: 10px; font-size:15px; line-height: 26px; font-weight: 300; -webkit-line-clamp: 11; } 
.swiper-slide{ width: fit-content }

.slide_cont .slide_cont_txt { width: calc(100% + -50%); padding-right: 20px } 
.slide_cont .slide_cont_img { width: 100%; max-width: 625px; height: auto } 
.slide_cont img { width: 100%; height: 100% } 
.slide_cont_img a {display: block; padding-top: 56.25%; position: relative; overflow: hidden } 
.slide_cont_img a img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }



/*───────────────────────────────────────────────────────────
기사 종류
───────────────────────────────────────────────────────────*/

/*탑뉴스 section클래스에 too_section 들어감*/
.top_news {margin-top: 0}
.top_news h2 a { font-size: 36px; line-height: 1.2; margin-bottom:10px; font-weight:bold; letter-spacing: -1px} 
.top_news h3 a {margin-bottom:10px; font-weight:bold; letter-spacing: -1px} 
.top_news strong a { font-size: 22px; color: #555; font-weight: 500; letter-spacing: -.5px } 
.left_wrap {flex-shrink: 0; width:calc(100% + -360px) }
.top_news .thum_img a {width: 500px; height: 300px}
.top_news .card_body h3 a {font-size: 16px}


/*관련기사 rel_gisa*/
.rel_gisa {margin:15px 0; display:inline-grid; font-size:15px; text-align: left } 
.rel_gisa li {padding-left: 10px; position: relative; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; max-height: 48px; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-break: break-all;} 
.rel_gisa li::before {border-color: transparent transparent transparent #666; border-style: solid; border-width: 3px 3.5px; content: ""; height: 0; left: 0; position: absolute; top: 8px; width: 0; margin-bottom: 7px } 
.rel_gisa li a {}


/*텍스트만 있는 기사박스 */
.articel_text_box {margin-top: 15px}
.articel_text_box .card_box {padding: 15px 5px; margin-bottom: 0  }
.articel_text_box .row > div {border-right: 1px solid #dadce0;}
.articel_text_box .row > div:last-child {border-right: none }
.articel_text_box .card_box h3 a {font-size: 18px}



/*카드형 기사 article_box */

.article_box .row:nth-child(n+2) {margin-top: 40px}
.article_box .flex_wrap .card_box {border-bottom: none}
.card_box {margin-bottom: 30px; border-bottom: 1px solid #dadce0 } 
.card_box:last-child { border-bottom: 0 } 
.card_box .card_img {padding-bottom: 13px} 
.card_body {padding-bottom: 15px}
.card_body + .card_body {border-top: 1px solid #dadce0; padding: 15px 0 }
.card_body h3 a { -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box !important; overflow: hidden; text-overflow: ellipsis; white-space: normal; } 
.card_box .description { margin-top: 10px } 
.card_img a {display: block; padding-top:56.25%; position:relative } 
.card_img a img { position:absolute; left:0; top:0; width:100%; height:100%; object-position: 0 40% }


/*썸네일 리스트형 기사 articel_list */
.articel_list {}
.thum_box { padding:11px 0; display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 1px solid #dadce0 } 
.thum_box:first-child { padding-top: 0 } 
.thum_box:last-child { border-bottom: 0 } 
.thum_box h3 a { -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box !important; overflow: hidden; text-overflow: ellipsis; white-space: normal; }
.thum_box .thum_img { margin-left: 20px; width: auto; height: 100% } 
.thum_box .thum_body { padding-top: 6px } 
.thum_box .description { margin-top: 10px } 
 .thum_img a {display: block; padding-top:56.25%; position:relative; background-color:#f5f6f8; width: 163px; height: 112px; overflow: hidden; } 
.thum_img a img { position:absolute; left:0; top:0; width:100%; height:100%; object-position: 0 40%; } 


/*한줄처리*/
#wrapper .contents .jul_01 a {-webkit-line-clamp: 1;  -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; white-space: normal } 


/*───────────────────────────────────────────────────────────
배너박스
───────────────────────────────────────────────────────────*/

.banner_box {margin: 35px 0; text-align: center}
.banner_box a {display: block}
.banner_box img {width: 100%; object-fit: contain}



/*───────────────────────────────────────────────────────────
메인 
───────────────────────────────────────────────────────────*/
.main_wrap {margin: 0 auto;}

.right_wrap .section_tit { margin-bottom:15px } 
.right_wrap .section_tit a { font-size:1.2rem } 
.right_wrap .thum_box h3 a { font-size: 16px; font-weight: 500 } 
.right_wrap .thum_box .thum_body { padding-top: 0 } 
.right_wrap .thum_box .thum_img { flex-shrink: 0; margin-left: 20px; width: 84px; height: 60px } 
.flex_wrap .right_wrap .thum_box .thum_img a { padding-top: 0; width: 84px; height: 60px } 
.flex_wrap .right_wrap .thum_box .thum_img a img { position: relative} 
#wrapper .right_wrap .thum_box:last-child {border-bottom:none}


/*───────────────────────────────────────────────────────────
오피니언 사설
───────────────────────────────────────────────────────────*/
.bunryu {color:#0072EC; display: block; margin-right: 7px; font-weight: 500 } 
.opinion_box .thum_img {width: 60px !important}
.opinion_box .thum_img a { background-color: #fff; width: 60px !important } 
.opinion_box .thum_img img { border-radius: 100px !important; } 
.opinion_box .writer a { display: block; margin-top: 5px; font-size: 13px; color:#757575; font-weight: 400 }


/*───────────────────────────────────────────────────────────
유튜브 아이프레임
───────────────────────────────────────────────────────────*/
.ytb_area { cursor: pointer } 
.ytb_area iframe { width: 100%; height: 373px; } 
.ytb_area video { width: 100%; padding-bottom: 7%; background-repeat: no-repeat; background-position: center } 

.ytb_wrap .card_img a::after {content:url(../../common/images/ico/youtube.png); display: inline-block; position: absolute; top:44%; left: 42%}

.video_wrap .visual_list .card_img a::after {content:url(../../common/images/ico/youtube.png); display: inline-block; position: absolute; top:44%; left: 42%}




/*───────────────────────────────────────────────────────────
멀티미디어
───────────────────────────────────────────────────────────*/
.multi_box > .row > div:first-child a {font-size: 24px}



/*───────────────────────────────────────────────────────────
인기뉴스 많이본뉴스 
───────────────────────────────────────────────────────────*/
.popular_box .thum_box {align-items: center; justify-content: flex-start}
.thum_num {color:#757575; font-size: 22px; margin-right: 10px; font-weight: bold; letter-spacing: -2px; min-width: 22px}

.popular_box > .row > div:first-child .thum_num {font-size: 26px;}
.popular_box > .row > div:first-child .thum_body + .thum_img a {width: 260px}

.right_wrap .popular_box .row {display: block}
.right_wrap .popular_box .row > div {width: 100%}
.right_wrap .popular_box .thum_box {border-bottom: 1px solid #dadce0 }
.right_wrap .popular_box .row .thum_img a {width: auto !important; height: auto !important}



/*───────────────────────────────────────────────────────────
푸터
───────────────────────────────────────────────────────────*/
#footer {width: 100%; margin:70px 0 auto; border-top: 1px solid #dadce0;  clear: both } 
.footer_wrap { margin: 0 auto; width: 1200px; height: 100%; clear: both; position: relative; clear: both} 
.footer_logo a {display: block}

.footer_01 {display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #dadce0; padding-bottom: 10px}

.footer .util_list li:first-child { padding-left:0; } 
.footer .util_list li:first-child::after { content: none }  
.footer .util_list a { color: #555; font-size: 15px; font-weight: 400 }
.footer_address {padding-bottom: 10px}

.footer_02 { margin: 30px 0; display: flex; align-items: center} 
.footer_02 .footer_logo {margin-right: 30px}
.footer_02 .footer_logo img {width: auto}
.footer_02 p { margin-top: 5px; color:#888; font-weight: 300; font-size: 13px } 
.footer_02 .util_list {display: block}
.footer_02 .util_list li { padding:0 5px; font-weight: 300; color:#888; font-size: 13px } 
.footer_02 .util_list li::after { top: 2px; left:0px } 

.footer_family_site .dropbtn { text-align: left; padding:6px 40px 5px 20px; width: 100%; border: none;  font-size: 15px; font-weight: 500; background:#f4f6f7 url(../../common/images/ico/top.png) no-repeat 101px center; background-size: 16px; border-radius: 100px; z-index: 10 } 
.footer_family_site .dropdown-content { padding-top:5px; border:1px solid #dadce0; width: 100%; text-align: left; padding-left: 20px; } 
.footer_family_site .dropdown-content a { padding: 5px } 
.footer_family_site .dropdown-content a:hover { color: inherit } 

.footer_wrap_left {display: flex; }
.footer_wrap_left .footer_01 {margin-right: 30px; border: none}
.footer_wrap_left .footer_02 {display: block; width: 100%}
.footer_wrap_left .footer_02 > div {display: inline-block}
.footer_wrap_left .footer_family_site {float:right; }




/*───────────────────────────────────────────────────────────
섹션메인
───────────────────────────────────────────────────────────*/

/*섹션메인 네비게이션*/
.header.fix .header_detail_wrap {border-bottom: 1px solid #dadce0}
.nav_list { width:100%; margin:5px auto} 
.section_nav_wrap {width: 100%; margin:75px auto 35px }  
.section_nav_wrap .section_tit {width: 100%; margin-bottom: 0; flex-shrink: 0; font-weight:bold; position: relative; background: none} 
.section_nav_wrap .section_tit a {font-size: 40px; background: none }

.section_nav_wrap .nav_list { display: flex; align-items: baseline; flex-wrap: wrap; border-top: 2px solid #444; border-bottom: 1px solid #ccc; padding: 15px 0; margin-top: 10px; } 
.section_nav_wrap .nav_list li {position: relative ; margin-right:22px; }
.section_nav_wrap .nav_list li.active a { font-weight: bold;  opacity: 1}
.section_nav_wrap .nav_list li.active::after {content:""; display: block; position: absolute; top:36px; left: 45%; width: 7px; height: 7px; background: #111; border-radius: 100px}
.section_nav_wrap .nav_list li:hover::after {content:""; display: block; position: absolute; top:36px; left: 45%; width: 7px; height: 7px; background: #111; border-radius: 100px}
.section_nav_wrap .nav_list a { display: block; font-size: 16px; color:#454545; font-weight: 400 } 
.section_nav_wrap a:hover { opacity: 1; color: initial }  



/*섹션메인 탑뉴스*/
.top_news .top_img { margin-left: 0 } 
.top_news .top_cont { flex-direction: row } 
.top_news .top_cont > div { width: 100% } 
.top_news .top_cont h2 a { font-weight: 600 } 
.top_news .top_cont .top_img { height: 260px; margin-left: 30px; overflow: hidden; border-radius: 8px; } 
.top_news .top_cont .top_img a { padding-top: 75.25% } 
.top_news .top_cont .description { margin-top: 20px } 
.top_news .top_cont .description a { -webkit-line-clamp:4 } 

.top_cont { display: flex; justify-content: space-between; flex-direction: row-reverse; width: 100%; } 
.top_cont .description a { margin-top: 10px; font-size:14px; font-weight: 300; -webkit-line-clamp: 11} 
.top_cont .top_txt {margin-top: 10px} 
.top_cont .top_img { width: 627px; height: 348px } 
.top_cont img { width: 100%; height: 100%; object-position: 0 40%; } 


/*전체기사목록*/
.sub_wrap .section.top_news {padding-top: 0}
.sub_wrap .articel_list h3 a {font-size: 20px; font-weight: 600}
.sub_wrap .articel_list .thum_box {position: relative; min-height: 185px; padding:16px 0}
.sub_wrap .articel_list .thum_img a {width: 270px; height: 152px}
.gisa_date {position: absolute; bottom:15px; color:#959595; font-size: 14px; margin-top: 12px}


/*기사더보기버튼*/
.more_wrap {border-top: 1px solid #dadce0; width: 100%; margin-top: 50px; text-align: center}
.btn_more {display: inline-block; background:#F4F8FC; width: 165px; height: 35px; text-align: center; margin: 30px auto; border-radius: 100px; border: 1px solid #eee; font-size: 14px; line-height: 35px }
.btn_more img {border-radius: 0; width: auto; margin-top: 12px; margin-left: 5px }

/*페이징*/
.pagination { display: flex; justify-content: center; margin-top: 60px } 
.pagination a { font-size: 15px; margin: 0 10px; color:#626262; cursor: pointer } 
.pagination a.active { color:#2D63CD } 
.pagination a:hover { color:#2D63CD } 



/*───────────────────────────────────────────────────────────
기사상세
───────────────────────────────────────────────────────────*/
.scrollprogress { position:fixed; top:59px; left:0; height:3px; background:#0072EC; width:0%; z-index: 99;  transition: width 0.2s ease-out; } 
.header_detail_wrap { position: fixed; width: 100%; padding-top: 18px; z-index: 9999;  top:0; height:60px; background-color:#fff; } 
.header_detail_area { width: 1200px; position: relative; max-width:1280px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center } 

.article_wrap {position: relative; padding-top: 30px; max-width: 1000px; margin: 0 auto}

.header02 .all_menu_wrap {top: 60px;}
.header02 .jimyun {display: none !important}
.header02 .gudok {display: none !important}
.header02 .join {display: none !important}
.header02 .login {position: absolute; right: 30px; display: block; width: 56px; top: 9px }
.header02 .login a {font-size: 14px}
.header02 .login::after {display: none !important}
.header02  .header_inner {display: flex;}

.header02.fix + .contents .news_tit_wrap h2 {position: absolute; top: 0}

.all_detail { top: 94px; position: fixed; z-index: 9999 } 
.all_detail .all_menu { background-color:rgba(255,255,255,.97); } 

.series { padding-bottom: 50px } 
.series .section_tit { margin-bottom: 5px } 
.series .thum_box { display: block } 
.series h3 a { display: inline-block !important; max-width: 100%; padding-right: 20px; background: url(../images/ico/arrow.png) no-repeat center right; background-size: 7px; white-space: nowrap; margin-bottom: 5px } 

.article_detail_area { display: flex; justify-content: space-between } 

/*기사상세제목*/
.header_detail_wrap {padding:0 15px;  }
.header_detail_wrap .header_area {width: 1200px; margin: 0 auto; padding:10px 0 }
.header_detail_wrap .header_area .logo img {max-height: 36px}	
.header_detail_wrap .header_tit h1 {font-size: 18px}
.header_detail_wrap .header_area .gnb {position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto}

.news_tit.on {position: fixed; background: #fff; top: 0; z-index: 9999; margin: 0px 150px; text-align: center;font-size: 16px; height: 59px;line-height: 59px;overflow: hidden;  white-space: nowrap; text-overflow: ellipsis; max-width: 70%;}
.news_tit_wrap { border-bottom: 1px solid #dadce0; padding-bottom: 20px; margin-bottom: 50px } 
.news_tit_wrap .location { color:#0072EC; font-size: 16px; font-weight: 600; margin-bottom: 15px } 
.news_tit_wrap .location a { color:#0072EC; font-size: 16px; font-weight: 600; margin-bottom: 15px } 
.news_tit_wrap h2 { font-size: 38px; font-weight: bold } 

.news_info { padding-top:25px; display: flex; align-items: center; justify-content: space-between; width: 100% } 
.news_tit_wrap .reporter {font-size: 14px; line-height: 1; } 
.news_tit_wrap .news_date { margin-top:10px; font-size: 14px; line-height: 1; font-weight: 300; color:#888 } 
.news_tit_wrap .news_date span { margin-right: 5px } 


/*공유*/
.news_tool { display: flex } 
.news_tool > div { cursor: pointer; padding: 5px 7px; } 
.news_tool > div > img { opacity: .6 } 
.news_tool > div:hover img { opacity: 1 } 
.news_tool .dropdown-toggle { opacity: .6 } 
.news_tool .dropdown-toggle:hover { opacity: 1 } 
.news_tool > div .btn { padding: 0 } 
.news_tool img { width: 25px } 
.news_tool .fsize img { width: 28px; } 
.news_tool .dropdown-toggle.show { opacity: 1 } 
.news_tool .dropdown-toggle::after { display: none } 
.news_tool .scrap_btn { text-indent: -999999px; background-image:url(../images/ico/scrap.png); background-repeat: no-repeat; background-position: center 5px; background-size:23px; width: 32px; height: 35px; opacity: .6 } 
.news_tool .scrap_btn:hover { opacity: 1 } 
.news_tool .scrap_btn.active { background-image:url(../images/ico/scrap_on.png); opacity: 1 } 


.news_tool > div:first-child img { width: 23px } 
.news_tool .dropdown-menu strong { margin-bottom: 15px; display: block } 
.news_tool .dropdown-menu { padding: 20px 20px 25px; } 

.sns_drop .dropdown-menu ul { display: flex; justify-content: space-between; align-items: center } 
.sns_drop li { display: block; width:40px; margin: 0 5px; height: 40px; cursor: pointer; text-align: center; border-radius: 100px; background: #e5e7e9 } 
.sns_drop li.sns_fb img { width: 12px; } 
.sns_drop li img { padding-top: 7px; width: 28px } 

.fsize ul { display: flex; justify-content: space-between; align-items: center } 
.fsize ul li {margin:0 5px; border-radius: 100px; width: 40px; height: 40px; text-align: center; line-height: 40px; background-color: #fafafa } 
.fsize ul li.active { background-color:#e5e7e9 } 
.fsize ul li:hover { background-color: #e5e7e9 } 
.fsize ul li:nth-child(1) { font-size:14px } 
.fsize ul li:nth-child(2) { font-size:18px } 
.fsize ul li:nth-child(3) { font-size:22px } 
.fsize ul li:nth-child(4) { font-size:26px } 


/*기사상세 내용*/
.news_content { padding-bottom: 50px; margin-bottom: 15px; } 
.news_content p { font-size: 18px; line-height: 1.75; font-weight: 400; margin-bottom: 15px; color: #222; text-align: justify; } 
.news_content blockquote {padding-left: 1.5em; padding-right: 1.5em; margin-bottom: 1rem}
.news_content i {font-size: 18px; line-height: 1.7 }
.news_content .item.type-8 {padding: 18px}
.news_content .item.type-8 strong {padding-top: .5em;  display: inline-block;}
.news_content .item.type-8 > p {margin-bottom: 15px}

.sub_tit { margin-bottom: 50px; padding-left:17px; border-left:3px solid #111; } 
.sub_tit p {font-size: 20px; color:#111; font-family: 'pretendard'; white-space: break-spaces; line-height:1.75; padding:3px 0 5px; font-weight: bold}
.sub_tit pre {font-size: 20px; color:#111; font-family: 'pretendard'; white-space: break-spaces; line-height:1.75; padding:3px 0 5px; font-weight: bold}

.article_image { margin: 30px 0 } 
.news_content figure { position: relative;  display:table !important; margin: 0 auto 30px; min-width: 200px;  } 
.news_content figure img { width: auto; height: auto; max-width: 100%; cursor: pointer; } 
.news_content figcaption { position: relative; padding-top: 10px; font-size: 13px; line-height: 1.5; color:#999 !important; text-align: left; display: table-caption; caption-side: bottom; } 
.news_content figure .img_zoom_pop {position: absolute; top: 10px; left: 10px;}
.news_content .reporter { margin:30px 0 5px; font-weight: 500 } 
.news_content .reporter strong { color:#222; font-weight: 600 } 
.news_content .reporter_more a {display: inline-block; padding-right: 15px; background: url(../images/ico/arrow.png) no-repeat center right; background-size: 13px; font-weight:600; color:#333; font-size: 14px }
.news_content figure.media {width: 100%}

.article_area .banner_wrap { margin-bottom: 50px } 

.relatied_wrap { padding:30px 0; border-top: 1px solid #dadce0 } 
.relatied_wrap strong { font-size: 20px; font-weight: 600 } 
.relatied_wrap ul li { position: relative; padding-left: 10px } 
.relatied_wrap ul li::before { top:11px} 
/*.relatied_wrap ul li::before { position: absolute; content: ""; left:0; top:45%; width: 4px; height: 4px; display: block; border-radius: 100px; background: #0072EC } */
.relatied_wrap ul li a { font-size: 16px; line-height: 1.5; display: block; padding: 5px 0 } 
.series_wrap > strong {color:#0072EC}

.article_wrap .sitemap {border-top: 1px solid #dadce0; margin:60px auto 0; padding-top: 30px; width: 1000px !important }
.article_wrap .sitemap .nav_area {width: 100% !important}

.tag_wrap ul {display: flex; flex-wrap: wrap; gap:5px;}
.tag_wrap ul li {margin-bottom: 5px}
.tag_wrap .tag {background: #3A3C3F; color:#fff; padding:7px 15px; border-radius: 100px; font-size: 12px; font-weight: 600; letter-spacing:0; line-height: 1; margin-bottom: 10px}

/*댓글 영역*/
.robot_box {margin:20px}
.robot_box img {border-radius: 0}
.comment_wrap { margin-bottom:100px; padding-top:30px; border-top:1px solid #222 } 
.nonmember_box .btn { padding:10px 15px; width:100%; text-align:left; font-size:14px; color:#656565; border-radius: 0; border:1px solid #dadce0; } 
.nonmember_box:hover { color: inherit; } 

.comment_wrap .writer { font-size:15px; color:#111; font-weight:500; margin:10px 0; } 
.comment_write .reply_box input { width:214px; height:34px; } 
.comment_write .nickname_box { font-size:0; } 
.comment_write .chk_duplicate { display: inline-block; box-sizing:border-box; vertical-align: top; margin-left:5px; width:76px; height:34px; line-height:34px; text-align: center; background:#666; font-size:13px; color:#fff; font-weight:400; } 
.comment_write .nickname_box p { font-size:13px; display: inline-block; vertical-align: top; line-height:32px; margin-left:16px; } 

.comment_write .reply_txt { margin-top:9px; box-sizing:border-box; border:1px solid #222; } 
.comment_write .reply_txt textarea { width: 100%; height:86px; border:none; } 
.comment_write .reply_txt textarea::placeholder { color:rgba(37,37,37,0.4); } 
.comment_write .reply_btn_box { padding:5px 15px 10px; background: #fff } 
.comment_write .reply_btn_box p { font-size:14px; color:#999; font-weight:400; letter-spacing:-0.28px; line-height:20px; } 
.comment_write .regist_box { margin-top:6px; } 
.comment_write .regist_box:after { clear:both; content:""; display: block; } 
.comment_write .regist_box span { font-size:13px; color:#666; line-height:30px; } 
.comment_write .regist_box button { margin-left:5px; float: right; display: inline-block; box-sizing:border-box; vertical-align: top; min-width:60px; height:30px; line-height:30px; text-align: center; background:#0072EC; font-size:13px; color:#fff; font-weight:500; border-radius: 6px } 
.btn_regist { background:#0072EC !important; color:#fff !important } 
.btn_cancel { background:#f8f9fa !important; color:#757575 !important } 

.comment_edit { padding: 15px 15px 25px; background:#fafafa } 
.comment_edit .comment_write .reply_txt { border:1px solid #dadce0; } 
.comment_edit .comment_write .reply_txt textarea:focus { outline: none; border-color:#222 } 
 
.total_comment { margin-bottom: 15px } 
.total_comment span { font-size: 20px; font-weight: 600; margin-bottom: 15px } 
.total_comment em { color:#0072EC } 

.comment_total { font-size: 20px; font-weight: 600; margin-bottom: 15px } 
.comment_total em { color:#0072EC } 

.comment_list .comment_box .declaration { display: inline-block; vertical-align: top; font-size:13px; color:#666; font-weight:300; position: relative; margin-left:5px; padding-left:8px; } 
.comment_list .comment_box .declaration:before { width:1px; height:12px; content:""; background:#666; position: absolute; left:0; top:6px; opacity:0.5; } 
.btn_delete .dropdown-menu { transform:translate3d(-50px, 7px, 0px) !important; } 

.comment_bot { margin-top:9px; padding-bottom: 15px } 
.comment_bot:after { clear:both; content:""; display: block; } 
.comment_bot .lookup { opacity: .8; cursor:pointer; font-size: 13px } 
.comment_bot .lookup em { font-size:inherit; color:inherit; font-weight:inherit; } 
.comment_box .btn_thumb img { width: 18px; margin-right:5px; } 
.comment_box .btn_thumb span { font-size:12px; color:rgba(102, 102, 102, 0.8); font-weight:400; font-family:'Roboto'; display: inline-block; vertical-align: top; } 

.comment_box .comment_bot .fr { display: flex } 

.comment_reply_wrap { display: none } 
.comment_reply_wrap .reply_txt { border: 1px solid #dadce0 } 
.comment_reply_box { background:#f8f9fa; border-top:1px solid #d7d7d7; border-top: 0 } 
.comment_reply_box .comment_reply { box-sizing:border-box; border-bottom:1px solid #dadce0; padding:0 15px } 
.comment_reply_box .comment_reply:last-child { border-bottom: 0 } 
.comment_reply_box .comment_reply .writer { box-sizing:border-box; position: relative; } 
.comment_reply_box .comment_write { background:#fafafa; padding:0 15px 20px; border-top:0; } 
.comment_reply_box .comment_write .reply_btn_box { background:#fff; padding-right:15px; } 

.comment_list .flex_wrap { display: flex; justify-content: space-between; align-items: center; padding-bottom: 5px } 
.comment_cont { padding: 10px 0 } 
.comment_cont > p { font-size: 15px } 
.btn_opt .dropdown-toggle { position: absolute; top:-10px; right: 0; width: 20px; height: 20px; background: url(../images/ico/dot.png) no-repeat center center; background-size: 23px; padding: 0; opacity: .5 } 
.btn_opt .dropdown-toggle::after { display: none } 
.btn_opt .dropdown-menu { min-width: auto } 
.btn_opt .dropdown-item { color:#888; font-size: 14px; padding:5px 15px; cursor: pointer } 
.btn_opt .dropdown-item:active { background-color: inherit } 

.comment_login { padding:10px 15px; width:100%; font-size:13px; text-align:left; color:#a5a5a5; border:1px solid #ddd; background-color:#fff } 
.btn-group, .btn-group-vertical { position: relative; display: -ms-inline-flexbox; display: inline-flex; vertical-align: middle; } 

.comment_list { margin-bottom:50px } 
.comment_list .btn { border:0; cursor: pointer !important } 
.comment_list .comment_wrap:first-child { border-top:none } 
.comment_box { clear:both; padding-top:20px; border-bottom:1px solid #dadce0; font-size:14px; line-height:22px; } 
.comment_box .reply_03 p { word-break: break-all } 
.comment_box .btn_thumb { padding-right: 0 !important; display: flex; align-items: center; margin-right: 5px; } 
.comment_box .btn_thumb:last-child { margin-right: 0 } 
.comment_box .btn_thumb:first-child .active { color:#d9534f !important } 
.comment_box .btn_thumb:last-child .active { color:blue !important } 
.comment_box p { word-break:break-all; line-height: 1.7; color:#222 } 
.comment_time { padding-left:3px; font-size:14px; font-weight: 300; color:#888 } 

.not_comment { padding: 20px; margin: 0 auto; } 
.not_comment p { text-align: center; opacity: .8 } 

.comment_list .btn-info { padding:10px 15px; width:100%; text-align:left; font-size:14px; color:#656565 !important; border-radius: 0; border:1px solid #dadce0; background: #fff !important; margin-bottom: 15px } 
.comment_list .btn-info:hover { color: inherit; border: 1px solid #222 } 

.comment_tab { display: block; margin-top:50px; padding-bottom: .75rem; border-bottom:1px solid #222 } 
.comment_tab a { display: inline-block; margin-right:10px; font-size:16px; line-height: 1.125; opacity: .7 } 
.comment_tab a:hover { color:inherit; font-weight: bold; opacity: 1 } 
.comment_tab a.active { font-weight:bold; opacity: 1 } 

.re_write { clear:both; position:relative; padding:0 15px 15px; background-color: #f9f9f9; border-top: 1px solid #d7d7d7 } 
.re_write::before { content: ''; position: absolute; width: 8px; height: 8px; border-left: 2px solid #ddd; border-bottom: 2px solid #ddd; left:15px; top:20px } 
.re_write .re_txtarea::placeholder { color:#ccc } 
.re_write .re_under_wrap { } 
.login_notice { display:inline-block; margin-top:15px; margin-left:15px; padding:0; font-size:14px; color: #222; text-align: left; background: none } 
.re_txtarea { display:block; width:100%; overflow-y: auto; height: 85px; padding: 15px; font-size: 14px !important; line-height: 1.625; border:0; } 
.re_txtarea::placeholder { color:#a5a5a5 } 

.re_under_wrap { display:flex; padding:5px 15px; justify-content: space-between; align-items: center; border-top:1px solid #ddd } 
.re_under_wrap > span { font-size:12px; opacity: .6; letter-spacing: 0 } 
.re_under_wrap > .btn { padding:.375rem 1rem } 

.robbot_box { padding-left:141px; padding-bottom:15px } 
/* .g-recaptcha { padding-left:141px; padding-bottom:15px } */

.reply_login { margin-top:2px } 

/* 페이징 */
.paging_wrap { display:block; width:100%; } 
.paging_wrap > ul { display:flex; align-items:center; justify-content:center; margin-top:25px; padding-bottom:70px; } 
.paging_wrap > ul li + li { margin-left: 22px; } 
.paging_wrap > ul li a { color:#666; font-size: 13px; font-weight:400; } 
.paging_wrap > ul li.on a { font-weight: bold; color:#0072EC; text-decoration:underline; } 
.paging_wrap .prev_btn, .paging_wrap .next_btn { display:inline-flex; width:23px; height:23px; } 
.paging_wrap .prev_btn { background:url(../images/ico/prev.png) no-repeat center center; margin-right:10px; background-size: 5px; opacity: .45 } 
.paging_wrap .next_btn { background:url(../images/ico/next.png) no-repeat center center; margin-left:10px; background-size: 5px; opacity: .45 } 
.paging_wrap .first_btn , .paging_wrap .end_btn { display:inline-flex; width:10px; height:23px; } 
.paging_wrap .first_btn { background:url(../images/ico/prev02.png) no-repeat center center; margin-right:10px; background-size: 9px; opacity: .45 } 
.paging_wrap .end_btn { background:url(../images/ico/next02.png) no-repeat center center; margin-left:10px; background-size: 9px; opacity: .45 } 


/*인쇄*/
.print_header { height: 60px; margin-bottom: 30px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #dadce0 } 
.print_header .logo { display: block; width: 100px !important; margin-left: 35px; position: relative !important; left: 0; transform: none; } 
.print_header .btn { margin-right: 35px; border:1px solid #0072ec; color: #0072ec; border-radius: 100px; font-size: 13px; height: 30px; padding: 0 20px } 
.print_content { margin: 0 auto; padding:0 35px } 


/*기자목록*/
.reporter_wrap {padding-top: 40px}
.contents .reporter_area .thum_img a {width:120px; height: 120px; border-radius: 100px; padding-top: 0; margin: 0 auto }
.reporter_area {display: block; text-align: center; align-items: center; justify-content: center; margin-bottom: 13px; padding: 0 0 40px; border-bottom: 1px solid #111; /*background:#f8f9fa url(../images/etc/report_bg.png) no-repeat -69px -271px*/}
.reporter_area .name {font-size: 36px; font-weight: bold; margin:10px 0 5px }
.reporter_area .report {font-weight: bold}
.reporter_area .mail a {color:#666}