@charset "UTF-8";

*{
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: black;
}

body{
    font-family: "Noto Sans KR", Sans-serif;
    font-size: 13px;
    line-height: 20px;
   	color: #333;

}
ul, ol{
    list-style: none;
}

img{
    vertical-align: top;
    border: 0;
}

a{
    text-decoration: none;
}
/* .img{ */
/* 	width: 1200px; */
/* } */
#wrap{
	margin: 0 auto;
}

/* #main_container{ */
/* 	height: 110vh; */
/* } */

.banner-img{
	margin-top: 70px;
	width: 100%;
	height: 100%;
	background-image: linear-gradient( rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ), url(../images/배너.jpg);
	 background-size: cover;
	 background-repeat: no-repeat;
	 background-position: center;
}

.background-banner-box{
	display: flex;
	width: 1200px;
	height: 100%;
	margin: 0 auto;
}

.background-banner-text{
	margin: 50px 0;
	display: inline-grid;
	vertical-align: middle;
}

.background-banner-title{
	font-size: 24px;
	font-weight: bold;
	color: white;
}

.background-banner-detail{
	font-size: 16px;
	color: white;
}

#container{
	width: 1200px;
    margin: 70px auto;
    position: relative; 
}

.top{
	width: 100%;
	height: 105px;
	display: flex;
	justify-content: space-between;
}

.tleft{
	display: flex;
	align-items: center;
	justify-content: space-around;
	width: 20%;
	height: auto;
	border-bottom: 1px solid #ddd;
}

.tleft p{
	font-size: 34px;
	color: #005C9E;
	font-weight: 700;
}

.tright{
	width: 80%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 20px;
	border-left: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.trleft{
	font-size: 34px;
	text-align: center;
	line-height: 0.8em;
}

.bottom{
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
}

.bleft{
	width: 20%;
	height: auto;
	padding-top: 10px;
}

.blleft{
	width: 100%;
	height: 46px;
	background-color: #0070C0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.blleft p{
	margin: 0; 
	text-align: center;
	font-size: 16px;
	color: #fff;
}

.bright{
	width: 80%;
	border-left: 1px solid #ddd;
	padding: 30px 20px 0;
/* 	margin-left: -2px; */
}

/* 게시판 */
.search_area {padding:30px;margin-bottom:30px;border-radius:5px; display:flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.search_area select {padding:5px;font-size: 12px;height: 30px; border-radius: 0; line-height: 16px; border-color:#d5d5d5;}
.search_area .searchInput {border-radius: 0; line-height: 0; margin-left: 2px; height: 30px;font-size: 12px;}
.search_area .form-group {margin-right: 30px !important;margin-bottom: 0px !important; padding:4px; display: grid; grid-template-columns: 1fr 3fr;}
.search_area .form-group label{min-width:66px; padding-right:5px; line-height: 24px;}

.search_area .title{float:left;  margin:3px 8px;}
.search_area .group{float:left;}
.search_area a:hover{color:#fff; background:#576279;}
.search_area .btn_search{height:30px; line-height: 10px;}
.search_area .form_block{width:100%; overflow: hidden;}

.search_area .tui-datepicker {z-index:1; border-color:#d5d5d5; width: 276px;}
.tui-calendar .tui-calendar-btn-prev-month {background:#fff;}
.tui-calendar .tui-calendar-btn-next-month {background:#fff;}

/* btn */
.btn_wrap{overflow:hidden; margin:20px 0;}
.btn_wrap .btn_right{float:right;}
.btn_wrap .btn_center{text-align:center;}
.btn_wrap a,
.btn_wrap .btn{padding:6px 10px; border-radius:3px;min-width:80px; display: inline-block;text-align:center; color:#fff;}
.btn_c1 {background:#0081dd;}
.btn_c2 {background:#0e5bc0;}
.btn_c3 {background:#6d7e91;}
.btn_c4 {background:#ff125a;}

.btn{background: #0070C0; padding:4px 10px; color:#fff;}
.btn:hover,.btn_wrap a:hover{background:#0070C0; color:#fff;}

@media (min-width: 768px){
	.background-banner-box, #container {
	    width: 750px;
	}
	.banner-img{
		height: 165px;
	}
}
@media (min-width: 992px) {
	.background-banner-box, #container {
	    width: 970px;
	}
	.banner-img{
		height: 200px;
	}
}
@media (min-width: 1200px) {
	.background-banner-box, #container {
	    width: 1170px;
	}
	.banner-img{
		height: 245px;
	}
}

#fileName {
	margin-top: 10px;
	magin-left: 10px;
}

#file_download {
	cursor: pointer;
}