@charset "utf-8";

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: top;
    font-size: 14px;
    font-family: 'Noto Sans KR','Open Sans', verdana, NanumGothic;
    color: #000;
}

#contents {background: #f2f4f8; padding: 75px 60px;}
.inner {width:100%;max-width: 1052px;margin:0 auto; }
/* 메인배너 */
.section1 {margin-bottom: 50px;}
.main_wrap {display: flex;}
.main_baner_area {width:631px; position: relative;}
.main_baner_area .main_banner { border-radius: 30px; overflow: hidden;}

/* 공지사항 */
.bbs_tab > ul {display: flex;position: relative;background: #f2f2f2;width:256px;border-radius: 50px;margin-bottom: 20px;}
.bbs_tab > ul > li {width:50%; cursor: pointer;}
.bbs_tab > ul > li > span {box-sizing: border-box; font-size:16px;padding: 6px 10px;width: 100%; display: inline-block;text-align: center;color: #686868;}
.bbs_tab > ul > li.on > span {color: #fff; background: #2e84f5; border-radius: 50px}

.bbs_list {display: none; position: relative; }
.bbs_list.on {display: block; }
.bbs_list .more_btn {position: absolute;top: -50px;right: 0; text-decoration: none;}
.bbs_list .new {display: flex;align-items: center;}
.bbs_list .new dt{background: #313131;border-radius: 7px;width: 79px;height: 60px;margin-right:15px;text-align: center;display: flex;justify-content: center;align-items: center;flex-direction: column;}
.bbs_list .new dt > span {display:block;color:#fff;line-height: 1;}
.bbs_list .new dt > span.month  {font-size:12px}
.bbs_list .new dt > span.day  {font-size:22px}
.bbs_list .new dd{font-size: 18px;width: 100%;}
.bbs_list ul { }
.bbs_list ul > li {border-bottom:1px solid #ddd }
.bbs_list ul > li > a {display: flex;padding: 8px 0;}
.bbs_list ul > li > a > p {width:calc(100% - 60px); font-size:15px; text-overflow: ellipsis;white-space: nowrap;overflow: hidden;margin-right: 30px;text-decoration: none;}
.bbs_list ul > li > a > span {color:#9f9f9f }
.bbs_list dl > dd {width:calc(100% - 60px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}


.main_bbs {width:390px;border-radius: 30px;overflow: hidden;background: #fff;padding: 25px 30px;box-sizing: border-box;margin-left: auto;}
/* 퀵메뉴 */
.section2 {margin-bottom: 55px; }
.section2 h1.sc_title{font-size: 26px;font-weight: 700;}
.quick_wrap {position: relative;}
.quick_wrap .quick_menu {overflow: hidden;/* margin: 0 auto; */padding: 50px 0 0;}
.quick_wrap .quick_menu > ul {}
.quick_wrap .quick_menu > ul > li {top:0; transition: top 0.5s;}
.quick_wrap .quick_menu > ul > li:hover {top: -20px;}
.quick_wrap .quick_menu > ul > li:hover > a {color:#206eaf; text-decoration: none; border: 1px solid #206eaf;}
.quick_wrap .quick_menu > ul > li > a {background: #fff; border-radius: 20px; width:158px; height: 158px; font-size:16px;font-weight: 500;color: #000;text-align: center;display: flex; justify-content: center;align-items: center;flex-direction: column; border: 1px solid #ddd;}
.quick_menu > ul > li > a > i {width: 50px;height: 50px;display: block;margin: 0 auto 10px;justify-content: center;align-items: center;}
.quick_wrap .btn {position: absolute;}
.quick_wrap .quick-button-next{right: -50px;top:50%;}
.quick_wrap .quick-button-prev{left: -50px;top:50%;}

/* 홍수통제소 */
.section3 {}
.flood_wrap {display: flex;align-items: center; border:1px solid #bfc9e1;background: #e3e8f4;padding: 21px 28px;border-radius: 10px;}
.flood_wrap h2{font-size: 18px;font-weight: 500;text-align: center;padding: 0 26px;}
.flood_wrap  .flood_list {width: calc(100% - 130px);display: flex;gap: 21px;}
.flood_wrap  .flood_list button {position: relative;width: 25%;background: #fff;}
.flood_wrap  .flood_list button{font-size: 15px;cursor: pointer;border:1px solid #ddd;padding: 8px 20px;padding-right: 40px;position: relative;}
.flood_wrap  .flood_list button:hover {border-color: #206eaf; }
.flood_wrap  .flood_list button:hover:after {background: url(/images/main/icon_arrow_w.png) no-repeat #206eaf center;}
.flood_wrap  .flood_list button:after {content:"";position: absolute;right: 12px;top: 6px;width: 26px;height: 26px;border-radius: 50px;background: url(/images/main/icon_arrow.png) no-repeat #ddd center;}
.flood_wrap  .flood_list div > .list{display: none;position: absolute;width: 100%;background: #fff;left: 0;top: 100%;padding: 8px 20px;box-sizing: border-box;border: 1px solid #ddd;margin-top: -1px;}



.footer_banner {position: relative; margin: 35px auto;}
.footer_banner .banner_wrap {overflow: hidden; margin: 0 auto; }
.footer_banner .banner_wrap > ul {}
.footer_banner .banner_wrap > ul > li {background: #fff;}
.footer_banner .banner_wrap > ul > li > a {text-align: center; display: block; margin: 0 auto;}
.footer_banner .btn {position: absolute;}
.footer_banner .banner-button-next{right: -50px;top:50%;transform: translateY(-45%);}
.footer_banner .banner-button-prev{left: -50px;top:50%;transform: translateY(-45%);}

#footer {}
.copyright_wrap {border-top:1px solid #ddd}
.copyright_wrap .copyright {display: flex;align-items: center; padding: 36px 0;}
.copyright_wrap .copyright .logo {margin-right: 30px;}
.copyright_wrap .copyright .txt {}
.copyright_wrap .copyright .txt p > a {font-weight:700;margin-bottom: 5px;display: block; font-size:14px}
.copyright_wrap .copyright p {color:#6b6b6b; font-size:14px}