@charset "utf-8";


/* 레이아웃 */
#gaonwrap { min-width:1400px; width:100%; }

#top { position:relative; min-width:1400px; width:100%; border-bottom:1px solid #ddd; background:url(/images/common/top_bg.gif) repeat-x; }
	#toparea { position:relative; width:1400px; height:165px; margin:0 auto; overflow:visible; } 
	
#container { position:relative; min-width:1400px; width:100%; z-index:2; }
	
	#cont1 { position:relative; width:100%; border-bottom:1px solid #eee; padding:20px 0; box-sizing:border-box; background:#fafafa; }
	#cont2 { width:100%; padding:60px 0; margin:0 auto; }
	#cont3 { position:relative; width:100%; background:#faf8ec; }	
	#cont4 { position:relative; width:100%; padding:60px 0; background:#faf8ec; }
		.containerarea { width:1400px; margin:0 auto; }
	
		
#bottom { width:100%; border-top:1px solid #ddd; z-index:4; }
	#bottomarea { position:relative; width:1400px; padding:35px 0 70px 0; margin:0 auto; z-index:5; }


@media (min-width:1281px) and (max-width:1400px){
	#gaonwrap { min-width:100%; width:100%; }

	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid #ddd; background:url(/images/common/top_bg.gif) repeat-x; }
		#toparea { position:relative; width:100%; height:165px; margin:0 auto; overflow:visible; } 
		
	#container { position:relative; min-width:100%; width:100%; z-index:2; margin-bottom:0px;  }
		
		#cont1 { position:relative; width:100%; padding:20px 0; background:#fafafa; }
		#cont2 { width:100%; padding:40px 15px; margin:0 auto; }
		#cont3 { position:relative; width:100%; padding:50px 15px 100px 15px; background:#faf8ec; }	
		#cont4 { position:relative; width:100%; padding:0 15px 92px 15px; background:#faf8ec; }		
			.containerarea { width:100%; margin:0 auto; }
		
			
	#bottom { width:100%; border-top:1px solid #ddd; z-index:4; }
		#bottomarea { position:relative; width:100%; padding:35px 30px 70px 30px; margin:0 auto; z-index:5; }
}


@media (min-width:1025px) and (max-width:1280px){
	html, body, #gaonwrap { min-width:100%; width:100%; }		
	
	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid #ddd; background:url(/images/common/top_bg.gif) repeat-x; }
		#toparea { position:relative; width:100%; height:165px; margin:0 auto; overflow:visible; }	
		
	#container { position:relative; min-width:100%; width:100%; z-index:2; margin-bottom:0px;  }
		
		#cont1 { position:relative; width:100%; padding:30px 15px; background:#fafafa; }
		#cont2 { width:100%; padding:50px 15px; margin:0 auto; }
		#cont3 { position:relative; width:100%; padding:50px 15px 100px 15px; background:#faf8ec; }	
		#cont4 { position:relative; width:100%; padding:0 15px 92px 15px; background:#faf8ec; }		
			.containerarea { width:100%; margin:0 auto; }
	
		
	#bottom { width:100%; border-top:1px solid #ddd; z-index:4; }
		#bottomarea { position:relative; width:100%; padding:35px 30px 70px 30px; margin:0 auto; z-index:5; }
}


@media (min-width:769px) and (max-width:1024px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid #ddd; background:#fff; }
		#toparea { position:relative; width:100%; height:90px; margin:0 auto; overflow:visible; } 
		
	#container { position:relative; min-width:100%; width:100%; z-index:2; margin-bottom:0px;  }
	
		#cont1 { position:relative; width:100%; padding:30px; background:#fafafa; }
		#cont2 { width:100%; padding:30px; margin:0 auto; }
		#cont3 { position:relative; width:100%; padding:30px; background:none; }	
		#cont4 { position:relative; width:100%; padding:30px; background:#faf8ec; }		
			.containerarea { width:100%; margin:0 auto; }
	
		
	#bottom { width:100%; border-top:1px solid #ddd; z-index:4; }
		#bottomarea { position:relative; width:100%; padding:35px 30px 70px 30px; margin:0 auto; z-index:5; }
}


@media (max-width:768px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid #ddd; background:#fff; }
		#toparea { position:relative; width:100%; height:70px; margin:0 auto; overflow:visible; }
		
	#container { position:relative; min-width:100%; width:100%; z-index:2; margin-bottom:0px;  }
	
		#cont1 { position:relative; width:100%; padding:30px 15px 24px 15px; background:#fafafa; }
		#cont2 { width:100%; padding:30px 15px; margin:0 auto; }
		#cont3 { position:relative; width:100%; padding:30px 15px;  background:none; }	
		#cont4 { position:relative; width:100%; padding:30px 15px; background:#faf8ec; }		
			.containerarea { width:100%; margin:0 auto; }
	
			
	#bottom { width:100%; border-top:1px solid #ddd; z-index:4; }
		#bottomarea { position:relative; width:100%; padding:25px 15px 70px 15px; margin:0 auto; z-index:5; }
}







/* 타이틀 */
#top h1.title { position:absolute; left:0; top:75px; }

@media (min-width:1281px) and (max-width:1400px){
	#top h1.title { left:15px; }
}


@media (min-width:1025px) and (max-width:1280px){
	#top h1.title { left:15px; }
}


@media (min-width:769px) and (max-width:1024px){
	#top h1.title { left:calc(50% - 107px); top:15px; text-align:center; margin:0; }
	#top h1.title img { height:60px; }
	
	.sidenav h1 img { height:40px; } 
}

@media (max-width:768px){
	#top h1.title { left:calc(50% - 75px); top:15px; text-align:center; margin:0; }
	#top h1.title img { height:40px; }
	
	.sidenav h1 img { height:40px; } 
}



/* 메인 메뉴 */
#menu { position:absolute; right:0; top:97px; }
#topMenu { position:relative; overflow:visible !important; }

#topMenu > li { position:relative; float:left; text-align:center; display:inline-block; }

#topMenu > li > a:link,
#topMenu > li > a:visited { height:120px; vertical-align:top; padding:0 80px; color:#222; font-size:130%; font-family:esamanru-Medium, "이사만루 미디엄"; letter-spacing:-1px; display:block; }
#topMenu > li > a:active,
#topMenu > li > a:focus,
#topMenu > li > a:hover,
#topMenu > li > a.select { color:#25479e;  }


@media (min-width:1025px) and (max-width:1280px){
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:0 50px; }
}


@media (max-width:1024px){
	#menu { display:none; } 
}
	


/* 서브메뉴 표시 */
#topMenu > li > ul { position:absolute; left:0; top:67px; width:100%; height:217px; padding:10px 0 0 0px; border-left: 1px solid #eee; display:none; clear:both; z-index:1003;   }
#topMenu > li > ul > li { position:relative; width:100%; padding:3px 10px 4px 10px;  text-align:left; display:block; }
#topMenu > li > ul:last-child { border-right: 1px solid #eee;}

#topMenu > li > ul > li > a:link,
#topMenu > li > ul > li > a:visited { width:100%; height:auto; padding:0; background:none; color:#333; border:0; line-height:1.3; text-decoration:none; font-family:NotoSans-DemiLight, "본고딕 데미라이트"; font-size:90%; margin:0; letter-spacing:-1px;  }
#topMenu > li > ul > li > a:active,
#topMenu > li > ul > li > a:hover,
#topMenu > li > ul > li > a:focus,
#topMenu > li > ul > li > a.select { clear:both; color:#ff8400; font-weight:bold; }

#topMenu > li > ul > li > a.st { letter-spacing:-2px; }

.submenu { display:none; overflow:hidden; }

.menubox { position:absolute; left:0; top:164px; width:100%; height:220px; border-top:1px solid #ddd; border-bottom:3px solid #ff8400; background:#fff; display:none; z-index:10; }




@media (min-width:1153px) and (max-width:1280px){
	#topMenu > li > ul { height:390px; }	
	.menubox { height:393px; }
}


@media (min-width:1025px) and (max-width:1152px){
	#topMenu > li > ul { height:450px; }	
	.menubox { height:453px; }
}


@media (max-width:1024px){
	.topMenu,
	.menubox { display:none; } 	
	.menubox { width:0; height:0; border:0; line-height:0; }
}	
	


/* 의안검색 */
.mSearch { width:100%; padding:0 20px; box-sizing:border-box; overflow:hidden; }

.mSearch .mSearchLeft { float:left; margin-right:35px; }
.mSearch h1 { font-family:esamanru-Medium, "이사만루 미디엄"; color:#111; font-size:170%; }

.mSearch .mSearchRight { float:left; width:calc(100% - 238px); margin-top:3px; }
.mSearch .mSearchRight ul { width:100%; }
.mSearch .mSearchRight ul li { float:left; width:120px; margin-right:10px; }
.mSearch .mSearchRight ul li:nth-child(4) { width:calc(100% - 500px); }
.mSearch .mSearchRight ul li select { width:100%; height:50px; line-height:50px; padding:0 10px; color:#888; }
.mSearch .mSearchRight ul li input { width:100%; height:50px; line-height:50px; border:1px solid #ccc; padding-left:10px; box-sizing:border-box; }
.mSearch .mSearchRight ul li input placeholder { color:#888; }

.mSearch .mSearchRight ul li:last-child { width:100px; height:50px; line-height:50px; text-align:center; margin-right:0; }

.mSearch .mSearchRight ul li:last-child a:link,
.mSearch .mSearchRight ul li:last-child a:visited { width:100%; height:100%; font-family:esamanru-Medium, "이사만루 미디엄"; font-size:110%; background:#5c74c3; color:#fff; display:block; transition:0.3s; }
.mSearch .mSearchRight ul li:last-child a:active,
.mSearch .mSearchRight ul li:last-child a:focus,
.mSearch .mSearchRight ul li:last-child a:hover { background:#3b5ac1; }



@media (min-width:1025px) and (max-width:1280px){
	.mSearch { padding:0; }
}

@media (min-width:769px) and (max-width:1024px){
	.mSearch { padding:0; }
	.mSearch .mSearchLeft { float:none; margin-right:0; }
	.mSearch h1 { font-family:esamanru-Medium, "이사만루 미디엄"; color:#111; font-size:170%; display:inline-block; }
	.mSearch p { display:inline-block; }

	.mSearch .mSearchRight { float:none; width:100%;  margin-top:10px; }
}

@media (max-width:768px){
	.mSearch { padding:0; }
	.mSearch .mSearchLeft { float:none; margin-right:0; }
	.mSearch h1 { font-family:esamanru-Medium, "이사만루 미디엄"; color:#111; font-size:170%; display:inline-block; }
	.mSearch p { display:inline-block; }

	.mSearch .mSearchRight { float:none; width:100%;  margin-top:10px; }
	.mSearch .mSearchRight ul li:first-child { float:left; width:calc(50% - 5px); margin:0 5px 10px 0; }
	.mSearch .mSearchRight ul li:nth-child(2) { float:left; width:calc(50% - 5px); margin:0 0 10px 5px; }
	.mSearch .mSearchRight ul li:nth-child(n+3) { width:100%; margin:0 0 10px 0; }

}




/* 메인비주얼 */
.mVisible { position:relative; width:100%; padding:0 60px; box-sizing:border-box; }
.mVisible .mVisibleTxt { float:left; padding-top:40px; }
.mVisible .mVisibleTxt h1 { font-family:esamanru-Medium, "이사만루 미디엄"; color:#111; font-size:250%; letter-spacing:-1px; }
.mVisible .mVisibleTxt h1 span {color:#ff6c00;}
.mVisible p { font-size:120%; color:#888; }

.mVisible img { float:right; }


@media (min-width:1281px) and (max-width:1400px){
	.mVisible { position:relative; width:100%; padding:0 20px; box-sizing:border-box; }
	.mVisible .mVisibleTxt h1 { font-size:220%; }

}

@media (min-width:1025px) and (max-width:1280px){
	.mVisible { padding:0 20px; }
	.mVisible .mVisibleTxt { padding-top:20px; }
	.mVisible .mVisibleTxt h1 span { display:block; }
}

@media (min-width:769px) and (max-width:1024px){
	.mVisible { padding:0 20px; text-align:center; }
	.mVisible .mVisibleTxt { float:none; padding-top:0; margin-bottom:20px; }
	.mVisible .mVisibleTxt h1 span { display:block; }

	.mVisible img { float:none; }
}

@media (max-width:768px){
	.mVisible { padding:0; text-align:center; }
	.mVisible .mVisibleTxt { float:none; padding-top:0; margin-bottom:20px; }
	.mVisible .mVisibleTxt h1 { font-size:150%; }
	.mVisible .mVisibleTxt h1 span { display:block; }

	.mVisible .mVisibleTxt p { font-size:100%; }

	.mVisible img { float:none; }


}


/* 바로가기 */
.mQuick { width:100%; }
.mQuick ul li { float:left; width:25%; height:135px; }
.mQuick ul li:nth-child(odd) a:link,
.mQuick ul li:nth-child(odd) a:visited { width:100%; height:100%; background:#729038; color:#fff; display:block; }

.mQuick ul li:nth-child(odd) h1 { border-bottom:1px solid #9ab740; }

.mQuick ul li a { padding:35px 0 0 20px; box-sizing:border-box; }
.mQuick ul li i { float:left; height:100%; margin-right:20px; }

.mQuick ul li h1 { float:left; font-family:esamanru-Medium, "이사만루 미디엄"; font-size:130%; }
.mQuick ul li p { float:left; width:calc(100% - 110px); }


.mQuick ul li:nth-child(even) a:link,
.mQuick ul li:nth-child(even) a:visited { width:100%; height:100%; background:#9ab740; color:#fff; display:block; }

.mQuick ul li:nth-child(even) h1 { border-bottom:1px solid #729038; }



@media (min-width:1281px) and (max-width:1400px){
	.mQuick ul li a { padding:30px 0 0 15px; }
	.mQuick ul li i { margin-right:15px; }

	.mQuick ul li p { letter-spacing:-1px; }

}

@media (min-width:1025px) and (max-width:1280px){
	.mQuick ul li a { padding:15px; box-sizing:border-box; }
	.mQuick ul li i { width:65px; margin:25px 15px 0 0; }
	.mQuick ul li i img { width:100%; }

	.mQuick ul li p { width:calc(100% - 80px); font-size:95%; letter-spacing:-1px; }
}

@media (min-width:769px) and (max-width:1024px){
	.mQuick ul li { float:left; width:50%; height:135px; }

}

@media (max-width:768px){
	.mQuick ul li { float:none; width:100%; height:135px; }
	.mQuick ul li p { letter-spacing:-1px; }

}



/* 조례안처리현황 */
.billprocess { position:relative; width:100%; }
.billprocess h1 { font-family:esamanru-Medium, "이사만루 미디엄"; color:#111; font-size:170%; text-align:center; margin-bottom:30px; }
.billprocess a.mMore { position:absolute; top:7px; left:calc(50% + 100px); }

.billprocess ul { width:100%; }
.billprocess ul li { float:left; width:calc(20% - 30px); height:200px; margin-right:37.5px; }
.billprocess ul li:last-child { margin-right:0; }

.billprocess ul li a { width:100%; height:190px; border:1px solid #ddd; padding:20px 20px 0 20px; box-sizing:border-box; background:#fff; font-size:110%; color:#111; border-radius:5px; text-align:center; display:block; }

.billprocess ul li a:link .subject,
.billprocess ul li a:visited .subject { width:100%; height:2.6em; line-height:1.3em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:break-all; color:#111; font-size:110%; font-family:esamanru-Medium, "이사만루 미디엄"; margin-bottom:5px; transition:0.3s; }
.billprocess ul li a:active .subject,
.billprocess ul li a:focus .subject,
.billprocess ul li a:hover .subject { color:#ec756a; }


.billprocess ul li .hoegi,
.billprocess ul li .item1 { margin-bottom:5px; display:inline-block; }

.billprocess ul li .item2 { width:100%; display:block; margin-bottom:10px; }

.billprocess ul li .date { font-size:90%; color:#888; }


@media (min-width:769px) and (max-width:1024px){
	.billprocess .billarea { width:100%; overflow:auto; }
	.billprocess ul { width:1045px; }
}

@media (max-width:768px){
	.billprocess .billarea { width:100%; overflow:auto; }
	.billprocess ul { width:1045px; }

}

@media (max-width:480px){
	.billprocess .billarea { width:100%; overflow:hidden; }
	.billprocess ul { width:100%; }
	.billprocess ul li { float:none; width:100%; }

}


/* 하단 */
#bottom #bottomarea .bottomMenu { margin-bottom:20px; }
#bottom #bottomarea .bottomMenu ul li { float:left; padding:0; margin-right:30px; }
#bottom #bottomarea .bottomMenu ul li:last-child { margin-right:0px; }


#bottom #bottomarea .bottomMenu ul li a:link,
#bottom #bottomarea .bottomMenu ul li a:visited { color:#666; }
#bottom #bottomarea .bottomMenu ul li a:active,
#bottom #bottomarea .bottomMenu ul li a:focus,
#bottom #bottomarea .bottomMenu ul li a:hover { color:#111; }

#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:link,
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:visited { color:#ff8a00; }
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:active,
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:focus,
#bottom #bottomarea .bottomMenu ul li:nth-child(1) a:hover { color:#5faf00; }


#bottom #bottomarea address { margin:0 0 10px 0; }
#bottom #bottomarea address span { margin-right:20px; }

#bottom #bottomarea .copyright { font-size:90%; font-family:Arial, Helvetica, sans-serif; } 

#bottom .topbtn { position:absolute; right:0; bottom:5px; z-index:100001; }


@media (max-width:425px){
	#bottom #bottomarea .bottomMenu ul li { margin-right:10px; }
	#bottom #bottomarea .bottomMenu ul li a:link,
	#bottom #bottomarea .bottomMenu ul li a:visited { font-size:90%; }
	
}