@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Crimson+Text:400,600,700');

@font-face {font-family: 'Crimson'; font-style: normal; font-weight: 400; src: url(../fonts/Crimson-Semibold.woff2) format('woff2');}
@font-face {font-family: 'Crimson'; font-style: normal; font-weight: 700; src: url(../fonts/Crimson-Bold.woff2) format('woff2');}
@font-face {font-family: 'OpenSans'; font-style: normal; font-weight: 400; src: url(../fonts/OpenSans-Regular.woff2) format('woff2');}
@font-face {font-family: 'OpenSans'; font-style: normal; font-weight: 700; src: url(../fonts/OpenSans-Bold.woff2) format('woff2');}
@font-face {font-family: 'Lato'; font-style: normal; font-weight: 400; src: url(../fonts/lato-regular.woff2) format('woff2');}
@font-face {font-family: 'Lato'; font-style: normal; font-weight: 700; src: url(../fonts/lato-bold.woff2) format('woff2');}
@font-face {font-family: 'Roboto', sans-serif; font-style: normal; font-weight: 400; src: url(../fonts/roboto-regular.woff2) format('woff2');}
@font-face {font-family: 'Roboto', sans-serif; font-style: normal; font-weight: 700; src: url(../fonts/roboto-bold.woff2) format('woff2');}

.LoraMedium {font-family: 'Lora', serif; font-weight: 500;}
.RobotoRegular {font-family: 'Roboto', sans-serif; font-weight: 400;}
.RobotoBold {font-family: 'Roboto', sans-serif; font-weight: 700;}

/*
    ImageViewer v 1.1.0
    Author: Sudhanshu Yadav
    Copyright (c) 2015 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license.
    Demo on: http://ignitersworld.com/lab/imageViewer.html
*/

/***** image viewer css *****/
#iv-container {position: fixed; background: #0d0d0d; width: 100%; height: 100%; top: 0; left: 0; display: none; z-index: 1000;}
.iv-container {overflow: hidden;}
.iv-close {width: 32px; height: 32px; position: absolute; right: 20px; top: 20px; cursor: pointer; text-align: center; overflow: hidden; text-shadow: 0px 0px 3px #6d6d6d; -webkit-transition: all ease 200ms; -moz-transition: all ease 200ms; -o-transition: all ease 200ms; transition: all ease 200ms;}
.iv-close:after, .iv-close:before {content: ""; height: 4px; width: 32px; background: #FFF; position: absolute; left: 0; top: 50%; margin-top: -2px;}
.iv-close:before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
.iv-close:after {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
.iv-close:hover {-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg);}

/***** snap view css *****/
.iv-snap-view {width: 150px; height: 150px; position: absolute; top: 20px; left: 20px; border: 1px solid #666; background: black; z-index: 100; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-transition: all ease 400ms; -moz-transition: all ease 400ms; -o-transition: all ease 400ms; transition: all ease 400ms; opacity: 0;}
.iv-snap-image-wrap {display: inline-block; position: absolute; max-width: 150px; max-height: 150px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); overflow: hidden;}
.iv-snap-image {position: relative; max-width: none;}
.iv-snap-handle {position: absolute; border: 1px solid #ccc; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5);}

/*** zoom slider ***/
.iv-zoom-slider {width: 100%; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; border: 1px solid #666; border-top: 0; background: rgba(204, 204, 204, 0.1); height: 15px; position: absolute; top: 150px; left: -1px;}
.iv-zoom-handle {width: 20px; height: 15px; background: #ccc; position: absolute;}

/**** snap view css end *****/
.iv-image-view {position: absolute; height: 100%; width: 100%;}
.iv-image-wrap {display: inline-block;}
.iv-image-wrap:active {cursor: move;}
.iv-large-image {max-width: 100%; max-height: 100%; position: absolute; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}

/****** CSS loader by http://projects.lukehaas.me/css-loaders/ *****/
.iv-loader {top: 50%; left: 50%; border-radius: 50%; width: 32px; height: 32px; z-index: 100; margin-top: -16px; margin-left: -16px; font-size: 5px; position: absolute; text-indent: -9999em; border-top: 1.1em solid rgba(255, 255, 255, 0.2); border-right: 1.1em solid rgba(255, 255, 255, 0.2); border-bottom: 1.1em solid rgba(255, 255, 255, 0.2); border-left: 1.1em solid #ffffff; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear;}
.iv-loader:after {width: 10em; height: 10em; border-radius: 50%;}

@-webkit-keyframes load8 {
    0% {-webkit-transform: rotate(0deg); transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg); transform: rotate(360deg);}
}
@keyframes load8 {
    0% {-webkit-transform: rotate(0deg); transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg); transform: rotate(360deg);}
}
@media screen and (max-width: 767px) {
    .iv-snap-view {z-index: -1; visibility: hidden;}
}

/* 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;}
fieldset, img {border: 0 none;}
dl, ul, ol, menu, li {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
input, select, textarea, button {font-size: 100%; vertical-align: middle;}
button {border: 0 none; background-color: transparent; cursor: pointer; outline: none;}
table {border-collapse: collapse; border-spacing: 0;}
body {-webkit-text-size-adjust: none;}

/* 뷰표트 변환시 폰트크기 자동확대 방지 */
input[type='text'], input[type='password'], input[type='submit'], input[type='search'] {-webkit-appearance: none; border-radius: 0;}
input:checked[type='checkbox'] {background-color: #666; -webkit-appearance: checkbox;}
button, input[type='button'], input[type='submit'], input[type='reset'], input[type='file'] {-webkit-appearance: button; border-radius: 0;}
input[type='search']::-webkit-search-cancel-button {-webkit-appearance: none;}
body, th, td, input, select, textarea, button {font-size: 15px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; height: 100%; color: #333;}
h1, h2, h3, h4, h5, h6 {font-size: 1em;}
a {text-decoration: none; color: #333;}
a:active, a:hover {text-decoration: none; color: #333;}
a:focus {outline: none;}
img {max-width: 100%; vertical-align: top;}
* {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
body {overflow-x: hidden; overflow-y: auto;}

/* Slider */
.slick-slider {position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -ms-touch-action: pan-y; touch-action: pan-y;}
.slick-list {position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus {outline: none;}
.slick-list.dragging {cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.slick-track {position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto;}
.slick-track:before, .slick-track:after {display: table; content: '';}
.slick-track:after {clear: both;}
.slick-loading .slick-track {visibility: hidden;}
.slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide {float: right;}
.slick-slide img {display: block;}
.slick-slide.slick-loading img {display: none;}
.slick-slide.dragging img {pointer-events: none;}
.slick-initialized .slick-slide {display: block;}
.slick-loading .slick-slide {visibility: hidden;}
.slick-vertical .slick-slide {display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden {display: none;}
.slick-prev, .slick-next {font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {color: transparent; outline: none; background: transparent;}
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {opacity: 1;}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {opacity: .25;}
.slick-prev:before, .slick-next:before {font-family: 'slick'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.slick-prev {left: -25px;}
[dir='rtl'] .slick-prev {right: -25px; left: auto;}
.slick-prev:before {content: '←';}
[dir='rtl'] .slick-prev:before {content: '→';}
.slick-next {right: -25px;}
[dir='rtl'] .slick-next {right: auto; left: -25px;}
.slick-next:before {content: '→';}
[dir='rtl'] .slick-next:before {content: '←';}
.slick-dots {position: absolute; top: 0; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; margin-top: 61.5%;}
.slick-dots li {position: relative; display: inline-block; width: 15px; height: 2px; margin: 0 3px; padding: 0; cursor: pointer; background-color: rgba(128, 128, 128, 0.8); vertical-align: middle;}
.slick-dots li button {font-size: 0; line-height: 0; display: block; width: 10px; height: 10px; padding: 0; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent;}
.slick-dots li.slick-active {background-color: rgba(10, 147, 84, 0.8);}

/* common CSS */
#header {padding: 15px 0; height: 68px; position: fixed; background-color: #fff; border-bottom: 1px solid #dfdfdf; top: 0; left: 0; width: 100%; z-index: 111; text-align: center;}
#header p {font-family: OpenSans; font-weight: normal; color: #989898; font-size: 14px; padding-top: 5px;}
#header h1 img {width: 170px; vertical-align: middle;}
#btn_menu {position: absolute; top: 25px; left: 15px; width: 23px; height: 19px;}
#btn_setting {position: absolute; top: 23px; right: 15px; width: 23px; height: 23px;}
#container {margin-top: 68px; background-color: #f7f7f7;}
.section {background-color: #fff; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; padding-bottom: 15px; margin-bottom: 5px;}
.top_section {border-top: none; position: relative; padding-bottom: 0;}
.top_section article a:focus {outline: none;}
#auto_control {width: 15px; height: 15px;}
#auto_control.stop {background: url('../images/btn_pause.png') center no-repeat; background-size: contain;}
#auto_control.play {background: url('../images/btn_play.png') center no-repeat; background-size: contain;}
.articlt_img {position: relative;}
.article .headline {padding: 10px 10px 5px 10px; font-size: 1.4em; font-family: 'Lora', serif; font-weight: 600; line-height: 1.4;}
.article .headline_kor {padding: 10px 10px 5px 10px; font-size: 1.4em; font-family: Crimson, 'Crimson Text'; font-weight: bold; line-height: 1.1;}

/* 2020-01-31 padding 0 10px -> 0 10 10px 로 조정*/
.article .lead {width: 100%; padding: 0 10px; font-size: 1em; color: #666; font-family: Lato; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 5; -webkit-box-orient: vertical; display: -webkit-box; word-wrap: normal; max-height: 7.5em;}
.list_article {padding: 0px 10px 20px 20px;}
.list_article li {padding: 1px 0;}
.list_article li:first-child {padding-top: 15px;}
.list_article li a {display: block; padding-left: 20px; font-size: 1.2em; color: #151112; background: url('../images/icon_link_new.png') 0 3px no-repeat; background-size: 12px 12px; font-family: Crimson, 'Crimson Text'; font-weight: bold;}
.category {padding: 15px 10px 5px 10px; color: #0a9354; font-size: 14px; font-family: OpenSans; font-weight: bold;}
.category a {color: #0a9354;}
.section_nav {padding: 10px;}
.nav {overflow: hidden; border-top: 1px solid #d8d8d8; border-left: 1px solid #d8d8d8; background-color: #fff;}
.nav li {width: 25%; float: left; border-right: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8;}
.nav li a {display: block; text-align: center; color: #8d8d8d; font-size: 13px; height: 40px; line-height: 40px; font-family: Lato; font-weight: bold;}
.nav2 {overflow: hidden; border-top: 0px solid #d8d8d8; border-left: 1px solid #d8d8d8; background-color: #fff;}
.nav2 li {width: 50%; float: left; border-right: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8;}
.nav2 li a {display: block; text-align: center; color: #8d8d8d; font-size: 13px; height: 40px; line-height: 40px; font-family: Lato; font-weight: bold;}
.section_category {position: relative; padding: 15px 10px 10px 10px;}
.section_category h2 {font-family: OpenSans; font-size: 20px; font-weight: bold; color: #0a9354;}
.section_category h2 a {color: #0a9354;}
.section_category>a {position: absolute; top: 20px; right: 10px; font-size: 14px; font-family: Lato; color: #7b7b7b;}
.curation_section {background-color: #fff; margin-bottom: 5px; border-bottom: 1px solid #e2e2e2;}
.article_img {position: relative;}
.article_img .img_caption {padding: 20px 10px 10px 10px; color: #fff; font-size: 15px; font-family: 'Lora', serif; background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)); position: absolute; bottom: 0; left: 0; width: 100%; text-align: left; line-height: 1.1; font-weight: 600;}
.atc_inv li {border-bottom: 1px solid #e2e2e2; padding: 10px;}
.atc_inv li:last-child {border-bottom: none;}
.atc_pck {display: table; width: 100%; height: 100%;}
.atc_pck .atc_txt {display: table-cell; vertical-align: middle; font-family: 'Lora', serif; font-weight: 600;}
.atc_pck .atc_thumb {width: 47%; height: 47%; display: table-cell; vertical-align: middle; margin-right: 10px; padding-right: 15px; max-width: 200px;}
.atc_pck .atc_thumb img {width: 100%;}
.curation_section .atc_pck .atc_thumb {padding-left: 0px; padding-right: 10px;}
.atc_pck .atc_txt .hd {font-family: Crimson, 'Crimson Text'; font-size: 1.1em; font-weight: bold; color: #000;}
.atc_pck .atc_txt .hdk {font-family: Crimson, 'Crimson Text'; font-size: 1.1em; font-weight: bold; color: #000;}
.atc_pck .atc_thumb::after {content: ''; clear: both; display: table;}
.h_tit {position: absolute; margin: auto; top: 0; left: 0; right: 0; bottom: 0;}
.footer {background-color: #272727; text-align: center;}
.footer .go_desk {padding: 12px 0; border-bottom: 1px solid #383838;}
.footer .go_desk a {font-family: Lato; font-size: 13px; color: #bdbdbd; padding-left: 20px; background: url('../images/icon_desktop.png') 0 center no-repeat; background-size: 15px;}
.footer .dn_app {overflow: hidden; border-bottom: 1px solid #383838;}
.footer .dn_app li {display: inline-block; padding: 10px 0;}
.footer .dn_app li a {display: inline-block; padding: 0 10px; font-family: Lato; font-size: 13px; color: #bdbdbd;}
.footer .dn_app li:last-child a {border-left: 1px solid #383838; padding-left: 15px;}
.footer .copyright {font-family: Lato; font-size: 12px; color: #bdbdbd; padding: 15px 0 25px 0;}
.tool_btn_box #go_top {display: none; position: fixed; bottom: 65px; right: 10px; width: 45px; height: 45px; border: 1px solid #999; background-color: rgba(255, 255, 255, 0.5); text-align: center; border-radius: 5px; z-index: 111;}
.tool_btn_box #go_top img {margin-top: 10px; height: 25px;}
.tool_btn_box #news_letter {display: none; position: fixed; bottom: 65px; left: 10px; width: 45px; height: 45px; border: 1px solid #076e3f; background-color: rgba(10, 147, 84, 0.8); text-align: center; border-radius: 5px;}
.tool_btn_box #news_letter span {display: block; font-family: OpenSans; font-style: italic; font-size: 10px; color: #fff; line-height: 1;}
.tool_btn_box #news_letter .newsletter_1 {font-size: 12px; padding-top: 10px;}
#bg_overlay {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); z-index: 222;}
#side_menu_wrap {position: fixed; top: 0; left: -320px; width: 320px; background-color: #f0f0f0; z-index: 333; top: 0%; bottom: 0%;}
#side_menu {overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%;}
.side_header {text-align: center; padding: 20px 0; height: 58px; background-color: #0a9354; position: relative;}
.side_header a img {width: 150px; vertical-align: middle;}
.side_header>button {position: absolute; top: 20px; right: 15px; width: 21px; height: 21px;}
.search_box {margin: 10px; border: 1px solid #d6d6d6; height: 40px; background-color: #fff; position: relative;}
.search_box>input {height: 38px; border: none; width: 100%; padding-left: 10px; padding-right: 40px; font-family: OpenSans; font-size: 16px; color: #666; font-weight: bold;}
.search_box>a {position: absolute; top: 8px; right: 5px; width: 22px; height: 22px;}
.side_nav {background-color: #fff; border-top: 1px solid #d8d8d8;}
.side_nav>li {padding: 12px; border-bottom: 1px solid #c1c1c1;}
.side_nav>li>a {display: block; font-family: OpenSans; font-size: 17px; color: #000; font-weight: bold; letter-spacing: -0.5px; background: url('../images/icon_arrL.png') right center no-repeat; background-size: 11px 20px;}
#settings_wrap {position: fixed; top: 0; right: -320px; width: 320px; background-color: #f0f0f0; z-index: 333; top: 0%; bottom: 0%;}
#settings {overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%;}
.settings_header {text-align: center; height: 58px; background-color: #0a9354; position: relative;}
.settings_header h3 {font-family: Lato; font-size: 21px; font-weight: bold; letter-spacing: -0.5px; text-align: center; color: #fff; line-height: 58px;}
.settings_header>button {position: absolute; top: 20px; right: 15px; width: 21px; height: 21px;}
.settings_apply {height: 60px; position: relative; border-bottom: 1px solid #d8d8d8;}
.settings_apply p {font-family: OpenSans; font-size: 20px; font-weight: bold; color: #000; padding-left: 10px; line-height: 60px;}
.settings_apply button {position: absolute; top: 15px; right: 15px; width: 80px; height: 30px; color: #fff; font-family: OpenSans; font-size: 16px; line-height: 30px; background-color: #0a9354;}
#cur_sel {background-color: #fff;}
#cur_sel li {padding: 12px 12px 12px 45px; font-family: OpenSans; font-size: 17px; font-weight: bold; letter-spacing: -0.5px; border-bottom: 1px solid #c1c1c1; background: url('../images/mark_minus.png') 10px center no-repeat; background-size: 25px 25px; cursor: pointer;}
#cur_not li {padding: 12px 12px 12px 45px; font-family: OpenSans; font-size: 17px; font-weight: bold; letter-spacing: -0.5px; border-bottom: 1px solid #c1c1c1; background: url('../images/mark_plus.png') 10px center no-repeat; background-size: 25px 25px; cursor: pointer;}
.setting_fsize {height: 50px; background-color: #fff; position: relative;}
.setting_fsize p {padding-left: 15px; font-family: OpenSans; font-size: 20px; font-weight: bold; line-height: 50px; color: #000;}
#set_fsize {position: absolute; top: 10px; right: 15px; overflow: hidden; border: 1px solid #e6e6e6; font-family: OpenSans;}
#set_fsize li {float: left; width: 30px; height: 30px; text-align: center; line-height: 30px; border-left: 1px solid #e6e6e6; color: #cecece; font-size: 20px; font-weight: bold;}
#set_fsize li:first-child {border-left: none;}
#set_fsize li.selected {background-color: #0a9354; color: #fff;}
#photoSection {background-color: #fff;}
#photoSection .photo_header {position: relative; height: 30px;}
#photoSection .photo_header h2 {display: inline-block; padding: 0 15px; background-color: #0a9354; color: #fff; font-style: OpenSans; font-weight: bold; font-size: 20px; line-height: 30px;}
#photoSection .photo_header h2 a {color: #fff;}
#photoSection .photo_header>a {position: absolute; top: 10px; right: 10px; font-size: 14px; font-family: Lato; color: #7b7b7b;}
#photoSection .photo_list {padding: 10px 0;}
#photoSection .photo_list .grid-item {width: 50%; float: left; padding: 2px;}
.photo_img {display: block; position: relative;}
.photo_img img {width: 100%;}
.photo_img .photo_caption {padding: 20px 10px 10px 10px; color: #fff; font-size: 14px; font-family: 'Lora', serif; background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)); position: absolute; bottom: 0; left: 0; width: 100%; text-align: left; line-height: 1.2; font-weight: 600;}
.btn_more_box {text-align: center; height: 45px; border-bottom: 1px solid #d8d8d8; border-top: 1px solid #d8d8d8; background-color: #fff; margin-top: 5px;}
.main_more_story {margin-bottom: 0; background-color: #5e5e5e; padding-bottom: 0;}
.main_more_story .article_img img {margin-bottom: 0;}
.btn_more_box button {padding: 0 50px; font-family: Lato; color: #1d1d1d; font-size: 16px; font-weight: bold; line-height: 45px;}
.main_more_story .article .headline {padding: 0 10px 5px 10px;}
.main_more_story .article .headline_kor {padding: 0 10px 5px 10px;}
#main_top_area .main_more_story .brick {width: 100%; margin: 0; float: none; background-color: #fff; margin-bottom: 1px; border-top: 1px solid #5e5e5e; border-bottom: 1px solid #5e5e5e;}

/* article */
#container.article_container { background-color: #fff; }
.article_header { padding: 15px 10px; }
.article_header .hdv { font-family: 'Lora', serif; font-weight: bold; color: #000; font-size: 22px; line-height: 1.2; padding-bottom: 20px; }
.article_header .hdvk { font-family: Crimson, 'Crimson Text'; font-weight: bold; color: #000; font-size: 22px; line-height: 1.1; padding-bottom: 20px; }
.article_info { overflow: hidden; padding-bottom: 10px; } 
.article_info span { font-size: 14px; font-family: Lato; }
.article_info .category { color: #0a9354; padding: 10px 0; }
.article_info .date { color: #a0a0a0; float: right; }

.tool_box { padding-bottom: 15px;}
.tool_box a { display: inline-block; width: 34px; }
.tool_box .btn_listen { display: block; float: right; height: 30px; border-radius: 5px; border: 1px solid #dfdfdf; text-align: center; padding: 0 5px 0 15px; }
.tool_box button span { font-family: Arial; background: url(../images/icon_speaker.png) 0 0 no-repeat; background-size: auto 15px; padding-left: 15px; color: #000; }
.tool_box #webtalks_btn_listen { margin-top: 6px;}

.sns_tts {display:block; height: 35px; }
.sns_area {float:left; text-align:left; width:70%; }

.article_view { padding: 0 10px; font-family: Crimson, 'Crimson Text'; font-size: 1.23em; color: #444; line-height: 1.3;}
.article_img { text-align: center; position: relative; }
.article_img img { width: 100%;}
.top_section .article_img { min-height: 20px; padding-bottom: 10px; }

/* section */
.section_title {height: 56px; text-align: center; background-color: #fff;}
.section_title h2 {font-family: Lato; font-size: 22px; font-weight: bold; color: #171214; line-height: 56px;}
.section_top_article {background-color: #fff; margin-bottom: 5px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; padding-bottom: 10px;}
.section_more_story {background-color: #fff; border-bottom: 1px solid #d8d8d8; border-top: 1px solid #e2e2e2;}
.section_more_story li {border-top: 1px solid #e2e2e2; padding: 10px;}
.section_more_story li:first-child {border-top: none;}
.section_mrs {margin-top: 5px; background-color: #fff; padding: 20px 10px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8;}
.section_mrs>h2 {font-family: OpenSans; font-size: 15px; font-weight: bold; color: #0a9354; padding-bottom: 10px;}
.list_mrs {border-top: 1px solid #aeaeae;}
.list_mrs li {border-top: 1px dashed #bababa; padding: 10px 0; display: table; width: 100%; height: 100%;}
.list_mrs li:first-child {border-top: none;}
.list_mrs li a {display: table-cell; vertical-align: middle; position: relative;}
.list_mrs li a .rank_mrs {display: block; position: absolute; width: 35px; height: 16px; top: 50%; left: 0; font-family: OpenSans; font-weight: bold; font-size: 16px; line-height:16px; text-align: center; margin-top: -8px; border-right: 1px solid #b6b6b6; color: #a9a9a9;}
.list_mrs li a .rank_mrs_top3 {color: #0a9354; border-right: 1px solid #0a9354;}
.list_mrs li a h3 {font-family: 'Lora', serif; font-size: 1.1em; font-weight: 600; color: #000; padding-left: 47px; line-height: 1.3;}
.ad_banner {padding: 10px; background-color: #fff; border-top: 1px solid #d8d8d8; text-align: center;}
.mrs_conts {padding: 0 10px 20px 10px; background-color: #fff; border-bottom: 1px solid #d8d8d8;}

@media (min-width: 480px) {
    .section_more_story {background-color: #f0f0f0; border-top: none; overflow: hidden;}
    .section_more_story .brick {width: 49.7%; float: left; background-color: #fff;}
    .section_photos {overflow: hidden;}
    .btn_more_box {border-left: 1px solid #e7e7e7;}
}

/* black theme */
.black_theme #header {background-color: #262727; border-bottom-color: #333;}
.black_theme #container {background-color: #000;}
.black_theme .section_title {background-color: #262727;}
.black_theme .section_title h2 {color: #fff;}
.black_theme .section_top_article {background-color: #000; border-top: none; border-bottom: none; padding-bottom: 0;}
.black_theme .article .headline {color: #fff; background-color: #262727;}
.black_theme .article .headline_kor {color: #fff; background-color: #262727;}
.black_theme .btn_more_box {background-color: #262727; border-bottom-color: #000; border-left-color: #333;}
.black_theme .btn_more_box button {color: #fff;}
.black_theme .section_more_story {background-color: #000; border-top-color: #000; border-bottom-color: #000; border-left-color: #262727;}
.black_theme .section_more_story li {border-top-color: #666;}
.black_theme .section_more_story li.brick {background-color: #262727;}
.black_theme .atc_pck .atc_txt h3 {color: #fff;}
.black_theme .section_mrs {background-color: #262727; border-top-color: #000; border-bottom-color: #000;}
.black_theme .list_mrs {border-top-color: #666; border-bottom-color: #666;}
.black_theme .list_mrs li {border-top-color: #333;}
.black_theme .list_mrs li a h3 {color: #fff;}
.black_theme .nav {background-color: #444; border-top-color: #999; border-left-color: #999;}
.black_theme .nav li {border-bottom-color: #999; border-right-color: #999;}
.black_theme .nav li a {color: #fff;}
.black_theme .nav2 {background-color: #444; border-top-color: #999; border-left-color: #999;}
.black_theme .nav2 li {border-bottom-color: #999; border-right-color: #999;}
.black_theme .nav2 li a {color: #fff;}
.black_theme .reply_facebook {background-color: #fff;}
.black_theme .article_header {background-color: #262727;}
.black_theme .article_header h2 {color: #fff;}
.black_theme .tool_box {border-bottom-color: #666;}
.black_theme .tool_box .btn_listen {background-color: #fff;}
.black_theme .article_view {background-color: #262727; padding-bottom: 5px; color: #f2f2f2;}
.black_theme .article_view .article_img_caption {background-color: #444; color: #fff;}
.black_theme .article_view p {color: #f2f2f2;}
.black_theme .article_view table {color: #f2f2f2;}
.black_theme .article_view a {color: #f2f2f2;}
.black_theme .reporter {background-color: #262727;}
.black_theme .reporter .reporter_name {color: #f2f2f2;}
.black_theme .article_container .article_link {background-color: #262727;}
.black_theme .article_link li a {color: #f2f2f2;}
.black_theme .ad_banner {background-color: #272727; border-top-color: #333;}
.black_theme .article .lead {color: rgb(212, 212, 212); background-color: #262727;}