@charset "UTF-8";
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Author : 사하구청
/* Date : 2016-08-01 ~
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 메인 공통
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@charset "utf-8";

body { background:url(/news/images/main/bg_main.jpg) center top no-repeat; } 

.main_contents { position: relative; }

.top_contents { height: 640px; padding-top: 53px; }

/*상단 왼쪽 콘텐츠*/
.left_contents { left: 0px; width: 299px; }
.left_contents .current { margin-bottom: 95px; line-height: 47px; font-size: 16px; color: #fff; }
.left_contents .select_list { position: absolute; left: 0; z-index: 100; }
.left_contents .select_list button#btn_curr { display:block; width: 209px; height:33px; padding:0 20px 0 20px; border: 1px solid #aeaeae; color:#545454; font-size: 13px; font-weight:700; line-height:33px; text-transform:uppercase; text-align: left; background:#f7ff9a }
.left_contents .select_list button#btn_lang_main { display:block; width: 209px; height:33px; padding:0 20px 0 20px; border: 1px solid #aeaeae; color:#545454; font-size: 13px; font-weight:700; line-height:33px; text-transform:uppercase; text-align: left; background:#fff url(/news/images/layout/btn_select_list.gif) no-repeat 177px 50%; }
.left_contents .select_list button:hover, .select_list button:active, .select_list button:focus { color: #000; }
.left_contents .select_list ul { display:none; background:#747474; }
.left_contents .select_list li a {display:block; padding-left: 20px; height:29px; line-height:29px; border-top: 1px solid #888; color:#fff}
.left_contents .select_list li:first-child a { color:#FFFFCC; text-transform:uppercase}
/*pdf보기*/
.left_contents .btn_pdf { display: block; width: 188px; height: 47px; line-height: 47px; padding-left: 20px; background: #C14343 url(/news/images/main/icon_pdf.png) 170px 50% no-repeat; color: #fff; font-size: 16px; }
/*e-book보기*/
.left_contents .btn_ebook { display: block; width: 188px; height: 47px; line-height: 47px; padding-left: 20px; margin-top: 4px; background: #3553a9 url(/news/images/main/icon_ebook.png) 170px 50% no-repeat; color: #fff; font-size: 16px; }
/*소셜sns 버튼*/
.left_contents .btn_sns { margin-top: 4px;}
.left_contents .btn_sns li { float: left; margin-right: 4px; }
/*바로가기 퀵링크 */
.quick_link { clear: both; display: block; width: 209px; margin-top: 180px; }
.quick_link li { height: 30px; padding: 30px 0; line-height: 18px; }
.quick_link li:FIRST-CHILD { border-bottom: 1px solid #e1e1e1; }
.quick_link li a { display: block; font-size: 14px; color: #666; text-decoration:none;}
.quick_link li a.photo { background: url(/news/images/main/icon_board.png) 170px 50% no-repeat; }
.quick_link li a.event { background: url(/news/images/main/icon_calendar.png) 170px 50% no-repeat; }

/*메인 게시판*/
.main_news { position: absolute; right: 0; top: 53px; width: 900px; }
.main_news .title_area { position: absolute; width: 100%; height: 195px; margin-top: -195px; background: url(/news/images/main/bg_main_news.png) center top repeat-x; }
.main_news .title_area a { display: block; color: #fff; padding: 20px 42px; }
.main_news .title_area a .title_sub { font-size: 16px; line-height: 16px; }
.main_news .title_area a .title_main { font-size: 30px; }
.main_news img { width:900px; height:598px;}

/*사하구정 */
.saha_board { position: relative; height: 460px; border-top: 1px solid #555;  }
.saha_board h2 { margin: 20px 0 10px 5px; font-size: 28px; }
.saha_board .more { position: absolute; right: 0; top: 30px; padding-right: 15px; color: #888; background: url(/news/images/main/btn_more.gif) right 50% no-repeat; }
.saha_board ul.saha_list { width: 110%; }
.saha_board ul.saha_list li { float: left; margin-right: 28px; }
.saha_board ul.saha_list .img_area img { width: 276px; height: 192px; } 
.saha_board ul.saha_list .text_area { width: 274px; height: 140px; border: 1px solid #d5d5d5; border-width: 0px 1px 1px 1px; }
.saha_board ul.saha_list .text_area .title { display: block; padding: 18px 20px 0 20px; font-size: 16px; font-weight: bold; }
.saha_board ul.saha_list .text_area .text { display: block; padding: 5px 20px 0 20px; line-height: 18px; color: #777;  }
.saha_board ul.saha_list .text_area .like { float: left; padding: 15px 0px 0 40px; line-height: 16px; color: #888; font-size: 12px; background: url(/news/images/main/icon_like.gif) 20px 15px no-repeat; }
.saha_board ul.saha_list .text_area .eye { float: left; padding: 15px 5px 0 35px; line-height: 16px; color: #888; font-size: 12px; background: url(/news/images/main/icon_eye.gif) 15px 15px no-repeat; }
.saha_board ul.saha_list .text_area .share { float: left; padding: 10px 5px 0 10px; }
.saha_board ul.saha_list .text_area .date { float: right; padding: 15px 20px 0 20px; line-height: 16px; color: #888; font-size: 12px; }

/*중간 영역 게시판 */
.middle_board { position: relative; width: 110%; height: 480px; }
/*문화생활*/
.middle_board .art { position: relative; float: left; width: 380px; margin-right: 23px; border-top: 1px solid #555; }
.middle_board .art h2 { margin: 12px 0 10px 5px; font-size: 28px;}
.middle_board .art  .more { position: absolute; right: 0; top: 30px; padding-right: 15px; color: #888; background: url(/news/images/main/btn_more.gif) right 50% no-repeat; }
.middle_board .art ul.art_list { }
.middle_board .art ul.art_list li { height: 100px; padding: 0px 0 20px 0; }
.middle_board .art ul.art_list .img_area { float: left; width: 148px; }
.middle_board .art ul.art_list .img_area img{ width: 128px; height: 88px; }
.middle_board .art ul.art_list .text_area .title { display: block; font-size: 15px; font-weight: bold; overflow:hidden; text-overflow:ellipsis; word-wrap:normal; white-space:nowrap; }
.middle_board .art ul.art_list .text_area .text { display: block; line-height: 18px; color: #777; margin-bottom: 5px; }
.middle_board .art ul.art_list .text_area .date { line-height: 16px; color: #888; font-size: 12px; }

/*사하인*/
.middle_board .people { position: relative; float: left; width: 380px; margin-right: 23px; border-top: 1px solid #555; }
.middle_board .people h2 { margin: 12px 0 10px 5px; font-size: 28px;}
.middle_board .people .more { position: absolute; right: 0; top: 30px; padding-right: 15px; color: #888; background: url(/news/images/main/btn_more.gif) right 50% no-repeat; }
.middle_board .people ul.people_list { }
.middle_board .people ul.people_list li { height: 100px; padding: 0px 0 20px 0; }
.middle_board .people ul.people_list .img_area { float: left; width: 148px; }
.middle_board .people ul.people_list .img_area img{ width: 128px; height: 88px; }
.middle_board .people ul.people_list .text_area .title { display: block; font-size: 15px; font-weight: bold; overflow:hidden; text-overflow:ellipsis; word-wrap:normal; white-space:nowrap; }
.middle_board .people ul.people_list .text_area .text { display: block; line-height: 18px; color: #777; margin-bottom: 5px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:36px;}
.middle_board .people ul.people_list .text_area .date { line-height: 16px; color: #888; font-size: 12px; }

/*사하생활*/
.middle_board .life { position: relative; float: left; width: 380px; margin-right: 23px; border-top: 1px solid #555; }
.middle_board .life h2 { margin: 12px 0 10px 5px; font-size: 28px;}
.middle_board .life  .more { position: absolute; right: 0; top: 30px; padding-right: 15px; color: #888; background: url(/news/images/main/btn_more.gif) right 50% no-repeat; }
.middle_board .life ul.life_list { }
.middle_board .life ul.life_list li { height: 100px; padding: 0px 0 20px 0; }
.middle_board .life ul.life_list .img_area { float: left; width: 148px; }
.middle_board .life ul.life_list .img_area img{ width: 128px; height: 88px; }
.middle_board .life ul.life_list .text_area .title { display: block; font-size: 15px; font-weight: bold; overflow:hidden; text-overflow:ellipsis; word-wrap:normal; white-space:nowrap; }
.middle_board .life ul.life_list .text_area .text { display: block; line-height: 18px; color: #777; margin-bottom: 5px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:36px;}
.middle_board .life ul.life_list .text_area .date { display: block line-height: 16px; color: #888; font-size: 12px; }

/*하단 영역 게시판 */
.bottom_board { position: relative; width: 100%; height: 380px; overflow: hidden; }
.bottom_board .info { position: relative; float: left; width: 50%; height: 315px; overflow: hidden; background-color: #d2d2d2; }
.bottom_board .info h2 { padding: 33px 0 0px 32px; font-size: 25px; line-height: 25px; }
.bottom_board .info .ctr_btn { position: absolute; right: 36px; top: 30px; }
.bottom_board .info .info_list li { display: inline-block; width: 590px; height: 235px; }
.bottom_board .info .info_list .img_area { float: left; width: 305px; padding: 30px 0 0 33px; }
.bottom_board .info .info_list .img_area img { width: 276px; height: 192px; }
.bottom_board .info .info_list .text_area { float: left; width: 225px; padding: 30px 0 0 0px; }
.bottom_board .info .info_list .text_area .title { display: block; width: 230px; height: 35px; font-size: 21px; font-weight: bold;  }
.bottom_board .info .info_list .text_area .text { display: block; width: 230px; height: 65px; padding:20px 0 25px; line-height:18px; color:#777; }
.bottom_board .info .info_list .text_area .date { display: block; padding-top: 15px; line-height: 16px; color: #888; font-size: 12px; }

.bottom_board .special { position: relative; float: left; width: 50%; height: 315px; overflow: hidden; background-color: #767676; }
.bottom_board .special h2 { padding: 33px 0 0px 32px; font-size: 25px; line-height: 25px; color: #fff; }
.bottom_board .special .ctr_btn { position: absolute; right: 36px; top: 30px; }
.bottom_board .special  .special_list li { display: inline-block; width: 590px; height: 235px; }
.bottom_board .special .img_area { float: left; width: 305px; padding: 30px 0 0 33px; }
.bottom_board .special .img_area img { width: 276px; height: 192px; }
.bottom_board .special .text_area { float: left; width: 225px; padding: 30px 0 0 0px; }
.bottom_board .special .text_area .title { display: block; width: 230px; height: 35px;  font-size: 21px; font-weight: bold; color: #fff; }
.bottom_board .special .text_area .text { display: block; width: 230px; height: 65px;  padding: 20px 0 25px; line-height: 18px; color: #fff; }
.bottom_board .special .text_area .date { display: block; padding-top: 15px; line-height: 16px; color: #c5c5c5; font-size: 12px; }