@charset "utf-8";

/* -----------------------------------------------------------------------------------------------
	공통 컨텐츠
--------------------------------------------------------------------------------------------------*/
/* 레이아웃 */
#main.sub-page {}
#main.sub-page .sub-title-wrap { border-bottom:2px solid #ccc; height:50px; width:100%; position:relative; }
#main.sub-page .sub-title-wrap h2.sub-title { font-size:28px; font-weight:400; color:#657f87; line-height:50px;}
#main.sub-page .sub-title-wrap .sub-location { position:absolute; right:0; top:20px;  }
#main.sub-page .sub-title-wrap .sub-location ul:after { display:block; content:''; clear:both; }
#main.sub-page .sub-title-wrap .sub-location ul li { display:block; float:left; margin-left:10px; }
#main.sub-page .sub-title-wrap .sub-location ul li:before { content:'>'; display:inline-block; color:#999; margin-right:10px;  }
#main.sub-page .sub-title-wrap .sub-location ul li:first-child:before { display:none;}
#main.sub-page .sub-title-wrap .sub-location ul li a { font-size:13px; color:#999; display:inline-block; }
#main.sub-page .sub-container {  }



/* -----------------------------------------------------------------------------------------------
	기사 list 페이지
--------------------------------------------------------------------------------------------------*/
#article-list-page {}

/* 서브 탑 뉴스 */
.sub-topnews-wrap { margin-top:10px;}
.sub-topnews-wrap .sub-topnews {}
.sub-topnews-wrap .sub-topnews:after { display:block; clear:both; content:''; }
.sub-topnews-wrap .sub-topnews .sub-topnews-box  { width:400px; float:left; border:1px solid #ccc; background:#e0e5e7; height:325px;  }
.sub-topnews-wrap .sub-topnews .sub-topnews-box:first-child { margin-right:20px; }
.sub-topnews .sub-topnews-box .thumb-img { width:398px; height:198px; background-size:cover; background-position:center center; background-repeat:no-repeat; margin-bottom:15px; }
.sub-topnews .sub-topnews-box .thumb-img a { display:block; width:100%; height:100%;}
.sub-topnews .sub-topnews-box .news-details { padding:0 10px 10px;}
.sub-topnews .sub-topnews-box dt.subject { } 
.sub-topnews .sub-topnews-box dt.subject a { font-weight:400; font-size:18px; color:#000; display: inline-block; letter-spacing:-0.05em;  } 
.sub-topnews .sub-topnews-box dd.news-text {} 
.sub-topnews .sub-topnews-box dd.news-text a { font-size:14px; color:#555; line-height:1.2em; letter-spacing:-0.05em;} 
.sub-topnews .sub-topnews-box dd.date { font-size:13px; color:#777; margin-top:5px; }

/* 기사 리스트 */
#article-list-wrap { margin-top:20px; }
#article-list-wrap .article-list-header { height:43px; border-bottom:2px solid #ccc; line-height:40px; position:relative; }
#article-list-wrap .article-list-header .article-list-title { font-size:20px; color:#111; font-weight:400;}
#article-list-wrap .article-list-header .article-list-title small { font-size:14px; color:#555; }
#article-list-wrap .article-list-header .btn-group { position:absolute; right:0; top:3px; }
#article-list-wrap .article-list-header .btn-group a { display:inline-block; width:30px; height:30px; background:url(../images/btn_type.png) no-repeat; }
#article-list-wrap .article-list-header .btn-group a.type-1 { background-position:0 0; }
#article-list-wrap .article-list-header .btn-group a.type-2 { background-position:-31px 0; }
#article-list-wrap .article-list-header .btn-group a.type-3 { background-position:-62px 0; }
#article-list-wrap .article-list-header .btn-group a.type-1:hover { background-position:0 -31px; }
#article-list-wrap .article-list-header .btn-group a.type-2:hover { background-position:-31px -31px; }
#article-list-wrap .article-list-header .btn-group a.type-3:hover { background-position:-62px -31px; }
#article-list-wrap .article-list-header .btn-group a.type-1.active { background-position:0 -62px; }
#article-list-wrap .article-list-header .btn-group a.type-2.active { background-position:-31px -62px; }
#article-list-wrap .article-list-header .btn-group a.type-3.active { background-position:-62px -62px; }
.article-list { margin-top:20px; padding-bottom:20px; border-bottom:1px solid #ccc; height:auto; overflow:hidden; margin-bottom:30px;}

/* 리스트형 */
.type-list {  }
.type-list .list-row { display:table; padding:5px 0; width:100%; vertical-align:top; }
.type-list .list-row .subject { display:table-cell; font-size:20px; color:#000;  }
.type-list .list-row .subject a { font-size:18px; color:#000; font-weight:300; }
.type-list .list-row .subject a:hover { text-decoration:underline; }
.type-list .list-row .subject small { font-size:15px; color:#777; }
.type-list .list-row .date { display:table-cell; width:220px; text-align:right; font-size:13px; color:#777;}
.type-list .article-list-content .list-row:nth-child(5n+6) { padding-top:20px; border-top:1px dotted #ccc; margin-top:20px;  }

/* 웹진형 */
.type-webzine {}
.type-webzine .list-block { padding-top:15px; border-top:1px dotted #ccc; padding-bottom:15px; height:auto; overflow:hidden; }
.type-webzine .list-block:first-child { padding-top:0; border:0; }
.type-webzine .list-block .thumb-img { width:180px; height:120px; background-position:center center; background-repeat:no-repeat; background-size:cover; margin-right:20px; float:left; display:inline-block; position:relative;}
.type-webzine .list-block .subject a { font-size:20px; color:#000; font-weight:400;}
.type-webzine .list-block .subject small { font-size:14px; color:#777; }
.type-webzine .list-block .summary { margin-top:5px; }
.type-webzine .list-block .summary a { font-size:15px; color:#444; letter-spacing:-0.05em; }
.type-webzine .list-block .summary a:hover { text-decoration:underline; }
.type-webzine .list-block .date { font-size:13px; color:#777; margin-top:5px; }

/* 타일형 */
.type-block { }
.type-block .list-block-1 { width:260px; float:left; margin-left:20px; margin-bottom:20px;}
.type-block .list-block-1:hover { background:#efefef; }
.type-block .list-block-1 .thumb-img { width:260px; height:170px;  margin-bottom:15px; }
.type-block .list-block-1 .thumb-img a { display:block; width:100%; height:100%; }
.type-block .list-block-1 .subject a { font-size:16px; color:#000; line-height:26px; display:block; }
.type-block .list-block-1 .subject small { font-size:13px; color:#777;  }
.type-block .list-block-1:nth-child(3n+1) { margin-left:0; clear:both;}
.type-block .list-block-1 .summary a { font-size:14px; color:#444; letter-spacing:-0.05em; }

/* paging */
.paging {display:block; position:relative; margin:0; padding:0; text-align:center;}
.paging a {display:inline-block; width:28px; height:28px; border:1px solid #ccc; color:#555; font-size:15px; line-height:28px; vertical-align:middle;}
.paging a:hover {background:#efefef; border-color:#ccc; }
.paging a.current {background:#118ee6; color:#fff; border:1px solid #118ee6; }
.paging button  { display:inline-block; width:28px; height:28px; border:1px solid #d7d6d6; vertical-align:middle; text-indent:-9999px; background:url(../images/pagination.png); cursor:pointer; }
.paging button.pg_first.disable {background-position:-1px -32px; cursor:default;}
.paging button.pg_prev.disable {background-position:-32px -32px; cursor:default;}
.paging button.pg_next.disable {background-position:-63px -32px; cursor:default;}
.paging button.pg_last.disable {background-position:-94px -32px; cursor:default;}
.paging button.pg_first {background-position:-1px -1px;}
.paging button.pg_prev {background-position:-32px -1px;}
.paging button.pg_next {background-position:-63px -1px;}
.paging button.pg_last {background-position:-94px -1px;}


/* -----------------------------------------------------------------------------------------------
	기사 view 페이지
--------------------------------------------------------------------------------------------------*/
#article-view-page {}
#article-view-header { border-bottom:1px solid #ccc; padding:10px 0 15px; position:relative;  }
#article-view-header .article-title { font-size:30px; color:#000; letter-spacing:-0.09em; line-height:1.2em; margin-bottom:10px; }
#article-view-header .article-info {}
#article-view-header .article-info ul { height:auto; overflow:hidden; }
#article-view-header .article-info ul li { float:left; font-size:14px; color:#777; line-height:15px; }
#article-view-header .article-info ul li:before { content:'|'; font-size:13px; color:#ccc; display:inline-block; margin-right:15px; margin-left:15px;  }
#article-view-header .article-info ul li:first-child:before { display:none;  }
#article-view-header .top-icon { position:absolute; right:0; bottom:10px;}
#article-view-header .top-icon ul li { display:block; margin-left:-1px; float:left; position:relative; }
#article-view-header .top-icon ul li button { border:1px solid #efefef; width:28px; height:28px; background:url(../images/icon_set.png); cursor:pointer;  }
#article-view-header .top-icon ul li button.icon-enlarge { background-position:-1px -1px; }
#article-view-header .top-icon ul li button.icon-reduce { background-position:-30px -1px; }
#article-view-header .top-icon ul li button.icon-print { background-position:-60px -1px; }
#article-view-header .top-icon ul li button.icon-list { background-position:-89px -1px; }
#article-view-header .top-icon ul li button.icon-share { background-position:-118px -1px; }
#article-view-header .top-icon ul li button:hover { border:1px solid #999; }
#article-view-header .sns-share { position:absolute; right:0; bottom:-60px; z-index:100;  }
#article-view-header .sns-share .sns-share-inner { position:relative; border:1px solid #ccc; background:#fff;padding:10px; width:220px; box-sizing:border-box; }
#article-view-header .sns-share .sns-close { width:15px; height:15px; background:url(../images/sns_close.png); border:0; position:absolute; top:0; right:0;  }
#article-view-header .sns-share .sns-set { height:auto; overflow:hidden; width:100%;}
#article-view-header .sns-share .sns-set li { width:50%; float:left;line-height:16px;}
#article-view-header .sns-share a { font-size:12px; color:#555;}
#article-view-header .sns-share a.facebook:before { content:url(../images/sns_face.png); display:inline-block; margin-right:3px; vertical-align:middle; }
#article-view-header .sns-share a.twitter:before { content:url(../images/sns_twitter.png); display:inline-block; margin-right:3px; vertical-align:middle; }
#article-view-header .sns-share a.kakao:before { content:url(../images/sns_kakao.png); display:inline-block; margin-right:3px; vertical-align:middle; }
#article-view-header .sns-share a.naver:before { content:url(../images/sns_naver.png); display:inline-block; margin-right:3px; vertical-align:middle; }
#article-view-page .article-contents { padding:20px 10px; min-height:400px; line-height:1.7em; color:#333; }