@charset "UTF-8";
/*******

wrap,  container, footer, leftmenu 등 해당되는 레이아웃을 지정합니다.

*******/





/*main*/

#header {position:relative; max-width:640px; }
#header .topmenu {position:relative; width:100%; height:100px;}
#header .top-left {position:absolute; left:25px; top:28px;}
#header .top-right {position:absolute; right:25px; top:28px;}
#header .logo {position:absolute; left:155px; top:20px;}

/*nav*/
.m_menu {display:none;position:absolute; top:0; right:0; z-index:9999; width:460px;}
.m_menu .nav-top {background:#666678; padding:20px 40px;}
.m_menu .nav-top .nav-tit {color:#feffff; font-size:18px; font-weight:600; margin-bottom:20px;}
.m_menu .nav-top .btn-x {position:absolute; right:40px; top:18px; width:22px;}
.m_menu .nav-top .nav-info a {display:block; background:#f0f0f0; color:#033436; font-size:14px; padding:10px 0; text-align:center; border-radius:5px; font-weight:600;}
.m_menu .m-nav span {display:block; width:100%; background:#fff; color:#666666; font-size:15px; padding:20px 20px; text-indent:20px; font-weight:600; border-bottom:1px solid #cccccc;
background-repeat:no-repeat; background-position:90% 50%; background-size:13px;}
.m_menu .m-nav .sub_menu {display:none;background:#f0f0f0; text-indent:40px; padding:5px 0; color:#f0f0f0; }
.m_menu .m-nav .sub_menu li a {display:block; padding:5px 0; color:#666; font-size:12px;}
.m_menu .m-nav .mm01 span {background-image:url(../../images/img_off.png);}
.m_menu .m-nav .mm02 span {background-image:url(../../images/img_off.png);}
.m_menu .m-nav .mm03 span {background-image:url(../../images/img_off.png);}
.m_menu .m-nav .mm04 span {background-image:url(../../images/img_off.png);}

.m_menu .m-nav .mm01 span:hover {background-image:url(../../images/img_on.png);}
.m_menu .m-nav .mm02 span:hover {background-image:url(../../images/img_on.png);}
.m_menu .m-nav .mm03 span:hover {background-image:url(../../images/img_on.png);}
.m_menu .m-nav .mm04 span:hover {background-image:url(../../images/img_on.png);}


.sub-listbox {overflow:hidden; border-bottom:1px solid #ccc; border-top:1px solid #ccc; box-sizing:border-box; background:#f1f1f1; margin-bottom:20px;}
.sub-listbox li {float:left; margin:0 0 0 15px; padding:10px 0;  }
.sub-listbox li a {font-size:16px; color:#333; font-weight:600;}
.sub-listbox li.on a{color:#144579;}







#container:after {content: ''; display: block; clear: both}
#content {padding:10px;}
#content2 {padding:30px 10px 0 10px; margin-top:10px; border-top:1px solid #bbb;}
.main-box {overflow:hidden; }
.m-box .m-list {float:left; width:32.5%;}
.m-box .m-lsit a {display:block;}
.m-box .m-list01 a {display:block;}
.m-box .m-list a:nth-child(2) {padding-top:1.8%;}
.m-box .m-list02 {float:right; width:67%;}
.m-box .m-list03 {width:100%;}
.m-list03 ul {padding-top:0.8%;}

.m-box .m-list03 li {float:left; width:33.05%;padding-left:0.5%;}
.m-box .m-list03 li:first-child {width:32.5%; padding-left:0;}

.main-notice {position:relative; margin-top:30px;}
.main-notice .main-title {width:100%; color:#000; font-size:20px; margin-bottom:5px; font-weight:600;}
.main-notice .btn-notice {position:absolute; right:10px; top:14px; width:10px;}
.main-notice .notice-list li {position:relative;border-bottom:1px solid #ddd; box-sizing:border-box; padding:10px 0;padding-right:90px;}
.main-notice .notice-list li a {display:block;font-size:14px; color:#666;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.main-notice .notice-list li:last-child {border-bottom:none;}
.main-notice .notice-list .dat {position:absolute;top:10px;right:10px;color:#999; font-size:14px;}

.m-bottom {margin-top:30px;}


#footerwrap {width:100%;}
#footer {width:100%; background:#e5e5e5; text-align:center;}
#footer .f-logo {font-size:20px; color:#646464; padding-top:28px; font-weight:600;}
#footer .copy {font-size:12px; color:#646464; font-weight:600; padding-top:5px;}


.m-list02 .bx-wrapper img {width:100%;}
.bx-wrapper {margin:0 auto;}
.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active {display:none}
.bx-wrapper .bx-controls-auto .bx-stop {display:none;}
.bx-wrapper .bx-controls-direction a {display:none;}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager { bottom:20px; text-align:center;}
.bx-wrapper .bx-pager.bx-default-pager a{width:13px; height:13px; border-radius:50%; border:2px solid #fff; box-sizing:border-box; background:none;}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {width:13px; height:13px; background:#fff; border-radius:50%;}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {left:50%; margin-left:-25px; bottom:15px;}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {display:none;}


/*sub01*/
.sub_tit{margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #ccc; font-weight:600; font-size:18px; text-align:center;}
.sub-con {text-align:center; font-size:18px; padding-top:20px; border-top:1px solid #bbb; box-sizing:border-box;}
.sub-con h3 {margin:0 20px; padding-bottom:10px;}