@charset "utf-8";

/* 요소(element) 여백 초기화  */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,
p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,
em,img,ins,kbd,q,s,samp,small,strike,strong,
sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,table,
caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,figure, 
figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,time,mark,audio,video{word-wrap:break-word;margin:0;padding:0;border:0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
legend {position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0)}
html {-webkit-text-size-adjust: none;} 

body {color:#4c4c4c; font-size:13px; font-family:'나눔고딕','NanumGothic','Nanum Gothic','맑은 고딕','Malgun Gothic','Gulim','굴림','Dotum',Sans-serif;}
a {color:#4c4c4c; text-decoration: none;}
a:hover, a:active, a:focus { color:#000; text-decoration:underline; }
img {border:0; vertical-align:top;}

ol, ul {list-style:none;}

/* 하상주차장 공통 */
.app_wrap {position:absolute;top:0;left:0;right:0;bottom:0;}
.app_left_box {position:absolute;top:0;left:0;bottom:0;width:250px;background:#fff;border-right:1px solid #ccc;z-index:100;}
.app_left_box .app_left_box_tit {width:250px;height:60px;line-height:60px;text-align:center;color:#fff;background:#252525;font-size:16px;margin-bottom:39px;}
.app_left_box ul {width:152px;padding:0 49px;}
.app_left_box ul li {margin-bottom:18px;}
.app_left_box ul li a {display:block;width:150px;height:40px;border:1px solid #bdbdbd;background:#eee;border-radius:5px;text-align:center;line-height:40px;color:#333;font-weight:bold;}
.app_left_box ul li.app_left_m_on a {background:#0569b4;border-color:#0d5995;color:#fff;}
.app_map_wrap {position:absolute;top:0;left:0;right:0;bottom:0;height:auto;background:url('../../../images/egovframework/app/app1/map2.jpg') no-repeat;background-size:cover;}
.app_map_wrap02 {position:absolute;height:auto;top:0;left:0;bottom:0;right:0;background-size:cover;}

/* 하상주차장 메인 */
.app_search_box {position:absolute;top:30px;left:50%;width:484px;height:25px;padding:9px 0 9px 16px;;margin-left:-131px;background:#fff;border:1px solid rgba(203,203,203,0.3);z-index:10;border-radius:5px;}
.app_search_box label strong {font-family:'돋움', Dotum;}
.app_search_box label input {width:293px;height:23px;padding:0 5px;border:1px solid #cbcbcb;margin-left:10px;}
.app_search_box button {width:45px;height:25px;border:1px solid #cbcbcb;background:#f7f7f7;border-radius:3px;vertical-align:top;}

/* 하상주차장 상세 */
/* .app_map_con_wrap {position:absolute;top:50px;left:50%;margin-left:-300px;width:850px;}
.app_map_view1 {width:850px;height:400px;margin-bottom:50px;} */
.app_chart_warp {position:absolute;left:251px;top:60%;bottom:0;right:0;border-top:1px solid #ccc;z-index:10;background:#fff;}

/* 나의물정보 */
.app_wrap02 {position:absolute;top:0;left:0;right:0;bottom:0; overflow:hidden;}
.app_topMenu ul li p {font-size:11px; padding-top:10px; color:#666666;}
.app_topMenu ul li img {padding-top:8px;}
.app_topMenu ul li:last-child {/*display:none;border-right:0px; */}
.app_search_box02 {position:absolute;top:120px;left:50%;width:300px;height:auto;padding:5px 0 5px 10px;;margin-left:-152px;background:#fff;border:1px solid rgba(203,203,203,0.3);z-index:10;border-radius:5px; }
.app_search_box02 label strong {font-family:'돋움', Dotum;}
.app_search_box02 label input {width:180px;height:23px;padding:0 5px;border:1px solid #ccc; margin-left:10px;}
.app_search_box02 button {width:45px;height:25px;border:1px solid #cbcbcb;background:#f7f7f7;border-radius:3px;vertical-align:top; border:1px solid rgba(203,203,203,0.3);}
.app_search_box03 {position:absolute;top:120px;left:50%;width:300px;height:auto;padding:5px 0 5px 10px;margin-left:-152px;background:#fff;border:1px solid rgba(203,203,203,0.3);z-index:10;border-radius:5px; height:255px;}
.app_search_box03 label strong {font-family:'돋움', Dotum;}
.app_search_box03 label input {width:180px;height:23px;padding:0 5px;border:1px solid #ccc; margin-left:10px;}
.app_search_box03 button {width:45px;height:25px;border:1px solid #cbcbcb;background:#f7f7f7;border-radius:3px;vertical-align:top; border:1px solid rgba(203,203,203,0.3);}
.app_search_box03 select{height:190px; width:280px; margin:7px 5px; text-align:center; border:1px solid #cbcbcb; font-size:11px; padding:7px; color:#999999; overflow-y:scroll;}
.app_search_box03 select option {height:16px; text-align:left;}
.inp_search {display:inline-block; height: 18px; margin:7px 0 7px 5px;}
.inp_search input {width:264px;height:23px;padding:0 7px;border:1px solid #ccc; font-size:11px; color:#999999;}
.app_input_box span {margin-bottom:3px; float:left; background:url(../../../images/egovframework/app/app1/con_left_arrow.gif) no-repeat 0 6px; padding-left:15px; padding-top:5px; margin-left:5px;}
.app_input_box label input {width:73px;height:22px;padding:0 5px;border:1px solid #cbcbcb;margin-left:5px;margin-right:2px;}
.app_input_box .unit{font-weight:normal;width:33px;display:inline-block}

/*  오른쪽 탭  */
.app_right_box {position:absolute;top:30px;right:-248px;z-index:10; width:274px;}
.app_right_box_on {position:absolute;top:30px;right:0;bottom:0; z-index:10; width:274px;}
/*
.app_right_box_arrow {float:left; width:20px; height:30px; text-align:center; background:#f7f7f7; z-index:5; border-radius:5px; padding:20px 5px 0 5px; margin-right:-5px; border:1px solid #ccc;}
.app_right_box_arrow {float:left; width:20px; height:30px; text-align:center; background:#f7f7f7; z-index:5; border-radius:0px; padding:5px 5px 5px 0px; margin-right:0px; border:1px solid #ccc;}

*/
.app_right_box_arrow {float:left; width:20px; height:30px; text-align:center; background:url(/site/gis/application/watertracking/images/open_off.png) no-repeat center; z-index:5; background-color:#f7f7f7; border-radius:0px; padding:5px 5px 5px 5px; margin-right:0px; border:1px solid #ccc;}
.app_right_box_arrow_close {float:left; width:20px; height:30px; text-align:center; background:url(/site/gis/application/watertracking/images/close_off.png) no-repeat center; z-index:5; background-color:#f7f7f7; border-radius:0px; padding:5px 5px 5px 5px; margin-right:0px; border:1px solid #ccc;}
.app_right_box_con{float:left; width:245px; height:342px; border:1px solid #ccc;z-index:10;}

/*  지하수사용영향예측  */
.app_left_box02 {position:absolute;top:0;left:0;bottom:0; width:278px;z-index:10;background:#fff;border:1px solid #d7d7d7;border-bottom:0;}
.appcont_stitle01 {width:67px; float:left; margin-top:5px; margin-bottom:5px;}
.appcont_stitle01 li span {margin:0 10px; font-size:11px;}
.appcont_stitle01 li img  {padding-top:3px;}
.appcont_stitle02 {width:180px; float:right; margin-top:13px;margin-right:8px;}
.appcont_stitle02 li{ display:inline;  }
.appcont_stitle02 li a{border-radius:5px; border:1px solid rgba(203,203,203,0.3); background-color:#0669b4; color:#fff; padding:2px 5px; letter-spacing:-2px;}
.appcont_stitle02 li img {margin-top:2px; padding-right:3px;}

.app_left_bot_con {position:absolute;bottom:0;left:0;width:278px;}
.appcont_con1 {width:258px;padding-bottom:10px;}
.appcont_con1 .app_top_box {width:268px;padding:15px 5px 7px 5px; margin-left:5px;overflow:hidden;}
.appcont_con1 .appcont_box {width:258px; background:#ddd; padding:7px 5px; margin-left:5px;}
.appcont_con1 li span {color:#000; font-weight:600;  }
.appcont_con1 li {padding-bottom:5px;}
.appcont_con1 li:first-child {text-align:right;}

.appcont_con2 {width:268px; padding:15px 5px 7px 5px; background:#f7f7f7;display:none;}
.appcont_con2 dl dt {font-size:12px;font-weight:bold;background:url(../../../images/egovframework/app/app1/con_left_arrow.gif) no-repeat 0 6px;padding-top:5px;padding-left:15px;margin-bottom:15px;}
.appcont_con2 dl.app_dl1 {padding-bottom:10px;border-bottom:1px solid #d7d7d7;}
.appcont_con2 dl.app_dl1 dd label input {vertical-align:middle}
.appcont_con2 dl.app_dl2 {padding-top:10px;}
.appcont_con2 dl.app_dl2 dd label {display:block;padding-left:20px;margin-bottom:10px;}
.appcont_con2 dl.app_dl2 dd label span {display:inline-block;width:85px;height:22px;line-height:22px;font-weight:bold;margin-right:10px;font-size:12px;}
.appcont_con2 dl.app_dl2 dd label input {width:108px;height:20px;margin-right:10px;padding:0 0 0 5px;}
.appcont_con2 dl.app_dl2 dd.apps_btn {text-align:center;padding-bottom:10px;border-bottom:1px solid #d7d7d7;}
.appcont_con2 dl.app_dl2 dd.apps_btn a {display:inline-block;width:78px;height:23px;border:1px solid #0b5797;background:#0669b4;color:#fff;line-height:23px;text-align:center;text-decoration:none;}
.appcont_con2 dl.app_dl2 dd.app_sum {padding:10px 0;}
.appcont_con2 dl.app_dl2 dd.app_sum span {display:inline-block;width:85px;height:22px;font-weight:bold;padding-left:15px;background:url(../../../images/egovframework/app/app1/con_left_arrow.gif) no-repeat 0 6px;padding-top:5px;margin-right:10px;}
.appcont_con2 dl.app_dl2 dd.app_sum input {width:108px;height:20px;margin-right:10px;padding:0 0 0 5px;}


/*  컨텐츠 탭  */
.app_left_bot_con_tab {padding-bottom:0px;height:37px;}
.appcont_tab {margin-left:-2px;}
.appcont_tab:after {position:absolute;display:block;content:"";clear:both;}
.appcont_tab li{position:relative; float:left; }
.appcont_tab li a{display:block; height:25px; padding:12px 0 0 0; font-size:13px; font-weight:bold; color:#555; background:#e6e6e6; text-align:center; }
.appcont_tab li.on a {background:#252525; color:#fff; text-decoration:none;  }
.appcont_tab li.on a span {position:absolute; bottom:-10px; left:50%; margin-left:-6px; width:13px; height:10px; background:url(../../../images/egovframework/app/app1/con_tab_arrow.gif) no-repeat; }
.mt25{margin-top:25px !important;}
.tab_layout2 li {width:50%;}

/* 체크박스 */
.checkBox {width:100%; position:relative; text-align:left;}
.checkBox input {vertical-align:middle;}
.checkBox span {margin:0 14px 3px 0; color:#666; font-size:11px;} 

/* 지하정보 돋보기 : 6월 24일 11시 40분 수정시작 */
.jiha_detail_wrap {position:absolute;width:1120px;height:600px;background:#353535}
.jiha_detail_tit {position:relative;padding:0 10px;height:36px;line-height:36px;font-size:14px;color:#fff;}
.jiha_detail_close a {position:absolute;top:11px;right:21px;display:block;font-size:16px;font-weight:bold;line-height:1;color:#fff;text-decoration:none;}
.jiha_detail_box_warp {height:564px;overflow:hidden;}
.jiha_detail_box_left {width:300px;height:564px;float:left;}
.jiha_detail_map {width:298px;height:198px;margin:0 1px;background:#fff;}
.jiha_detail_list {width:300px;height:564px;overflow:hidden;overflow-y:scroll;}
.jiha_detail_list ul li {width:268px;height:12px;line-height:12px;padding:16px 15px;border-bottom:1px solid #222;overflow:hidden;}
.jiha_detail_list ul li span {display:block;float:left;font-size:11px;height:12px;line-height:12px;}
.jiha_detail_list_check {width:12px;margin-right:10px;}
.jiha_detail_list_check input {width:13px;height:12px;margin:0;vertical-align:middle;padding:0;}
.jiha_detail_list_cate {width:35px;line-height:12px;font-weight:bold;color:#ff9016;}
.jiha_detail_list_tit {width:175px;line-height:50px;padding-left:10px;color:#fff;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;word-wrap:normal;}
.jiha_detail_box_right {width:800px;padding:9px 10px 0 10px;float:left;background:#222;}
.jiha_detail_chart {width:100%;height:515px;background:#fff;}
.jiha_detail_btn {padding:10px 0;text-align:right}
.jiha_detail_btn label {height:20px;line-height:20px;color:#fff;font-size:12px;}
.jiha_detail_btn label input {margin:0;vertical-align:middle;margin-right:10px;}
.jiha_detail_btn a {width:58px;height:18px;line-height:18px;color:#fff;font-size:12px;text-align:center;display:inline-block;border:1px solid #111;background:#333;text-decoration:none;}


#searchResult ul li{float:left;width:33.333333%;border-bottom:none! important;}
#searchResult ul li input{vertical-align:bottom;}
#checkPanel{top:160px! important;z-index:1! important;}
#searchResult  #dongResult li{width:95%;float:none;padding:3px 0;border-bottom:1px solid #000! important;}


/* 2024.07.29 좌측메뉴 가로사이즈 및  화면 100% 수정 */
.map-info-box {	
	position: relative;
	float: left;
	width: 270px;
	height: 100%;
	padding: 5px;
	background: #fff;
	box-sizing: border-box;
	border-right: 1px solid #333;
	overflow-y: auto;
	display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-wrap: nowrap;
}
.fix-box {
	/* height: calc(100% - 200px); */
	margin-bottom: 10px;
	background: #f2f2f2;
	display: flex;
	flex-direction: column;
	flex:1;
}

/* 상단 버튼 영역 */
.app_topMenu ul {display:flex;flex-wrap:nowrap;width: 100%; margin: 0 0 5px 0; padding: 0;}
.app_topMenu ul li {float: left; width: 49%}
.app_topMenu ul li .btn {
	display: flex;
	width: 100%; 	
	height: 100%; 
	min-height: 37px;
	line-height: 1.2; 	 
	font-size: 13px;
	font-weight: 600;	
	color: #fff; 
	text-align: center;
	text-decoration: none;	
	letter-spacing: -1.0px;	
	background: #0669b4;
	align-items: center;
	justify-content: center;
	box-sizing:border-box;
}

.app_topMenu ul li:first-child {margin-right: 5px}
.app_topMenu ul:after {clear: both; content:''; display: block;}

.app_topMenu ul li .btn:before {
	content: '';
	display: inline-block;
	width: 18px;
	min-width: 18px;
	height: 18px;
	margin-right: 1px;
	vertical-align: middle;
	margin:0 2px;
}
.app_topMenu ul li:nth-child(1) .btn:before {	
	background: url(/site/gis/application/watertracking/images/btn_ico01.png) no-repeat;	
}
.app_topMenu ul li:nth-child(2) .btn:before {	
	background: url(/site/gis/application/watertracking/images/btn_ico02.png) no-repeat;
	background-size: 18px 18px;	
}

/* 수원지 선택 - 라디오버튼  영역  */
.srhResult ul {	
	text-align: center;		
	background: #fff;
    border-top: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6; 
}
.srhResult ul li{
	float: left;
	width: 33%;
	padding: 7px 0;
}
.srhResult ul li input{vertical-align:bottom; background: #fff}
.srhResult  #dongResult li{
	width:95%;
	float:none;
	padding:3px 0;
	border-bottom:1px solid #000! important;
}

.srhResult ul:after {
	clear: both;
	content: '';
	display: block;
} 

/*지역명 검색 */
.srhPanel {
	display: block;
	padding: 5px 0;
	border-top: 1px solid #e6e6e6;
	background: #f7f7f7;	
}
.srhPanel label {
	display: inline-flex; 
	width: calc(100% - 60px);
	vertical-align: top;
}
.srhPanel label strong {
	display: inline-block;
	width: 64px;
	height:auto;
	min-height: 27px;
	line-height: 1;
	text-align: center;	
	/* float: left; */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.srhPanel label input[type=text] {
	display: inline-block;	
	width: calc(100% - 69px);
	height: auto;
	min-height: 27px;
	line-height: 1;
	border: 1px solid #e6e6e6;
	background: #fff;
	box-sizing: border-box;
}
.srhPanel button {
	display: inline-block;
	width: 45px;
	min-height: 27px;
	line-height: 1;
	background: #333;
	color: #fff;		
	border: none;
	cursor: pointer;
	padding:0 2px;
}

/* app-area */
.app-area {
	position: relative;
	/* height: calc(100% - 120px); */
	height: 100%;
	margin: 10px 0 0 0;
	background:#f2f2f2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 300px;
}
.app-area .app-area-title {
	margin-bottom: 5px;
	height: 25px;	
	background: #333;
	text-align: right;	
}
.app-area .app-area-title span {
	display: inline-block;
	font-size: 12px;
	color: #fff;
	padding-left: 16px;
	margin:5px 10px 0 0;
	vertical-align: top;
}
.app-area .app-area-title .i-primay {
	background: url(/site/gis/application/watertracking/images/ico_green.png) no-repeat left center;
}
.app-area .app-area-title .i-danger {
	background: url(/site/gis/application/watertracking/images/ico_red.png) no-repeat left center;
}


/* app-tracking-course */
.app-tracking-course {
	margin-bottom: 10px;
	padding: 5px 10px;	
	box-sizing: border-box;
}
.app-tracking-course h3 {
	display: inline-block;
	color: #000;
	font-size: 14px;
	min-height: 35px;
	line-height: 1.2;
}

.app-tracking-course h3 + span {
	display: inline-block;
	width: 40px;
	height: 35px;
	float: right;
	vertical-align: middle;
}
.app-tracking-course .icon-intake.i01 {
	background: url(/site/gis/application/watertracking/images/ico_g01.png) no-repeat left center;
}
.app-tracking-course .icon-intake.i02 {
	background: url(/site/gis/application/watertracking/images/ico_g02.png) no-repeat left center;
}
.app-tracking-course .icon-intake.i03 {
	background: url(/site/gis/application/watertracking/images/ico_g03.png) no-repeat left center;
}


/* table style*/
.table01 {
	margin-top: 5px;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;	
	border-top: 1px solid #333;
	background: #fff;
}
 .table01 thead tr th {	
	color: #444;
}
.table01 thead th,
.table01 tbody th,
.table01 tbody td {
	height: 24px;
	font-size: 12px;
	text-align: center;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;	
	box-sizing: border-box;
	padding: 0 0 0 3px;
	letter-spacing: -.3px;
	vertical-align: middle;
}
.table01 thead th.bd-none,
.table01 tbody td:last-child {
	border-right: 0;	
}
.table01 .txt-left {text-align: left}
.table01 thead th .i-state {
	display: inline-block;
	width: 13px;
	height: 13px;
	margin: 0px 3px 1px 0;	
	vertical-align: middle;
}
.table01 thead th .i-state.green {
	background: url(/site/gis/application/watertracking/images/ico_green.png) no-repeat left center;	
}
.table01 thead th .i-state.red {
	background: url(/site/gis/application/watertracking/images/ico_red.png) no-repeat left center;
}

/* tab style */
.tab-section .tabs-nav {
	width: 100%;
	display: flex;	
	/* justify-content: space-between; */
}
.tab-section .tabs-nav li {
	/* float: left; */
	width: 33.33%;
	box-sizing: border-box;
}
.tab-section .tabs-nav li a {
	display: flex;
	align-items: center;
    justify-content: center;
    word-break: break-word;
    min-height: 25px;
	color: #333;
	font-weight: 600;
	text-align: center;
	line-height: 1.2;	
	background: #fff;
	text-decoration: none;
	border: 1px solid #333;
	border-left: 0;	
	height:100%;
}
.tab-section .tabs-nav li a.active {
	background: #333;
	color: #fff;
}
.tab-section .tabs-nav:after {
	content: '';
	clear: both;
	display: block;	
}
.tab-section .tabs-nav li:first-child a {
	border-left: 1px solid #333;
}
.tab-section .tabs-cont {	
	padding: 5px 0 0 0;
	/*border-bottom: 1px solid #e1e1e1;*/	
	text-align: center;
	box-sizing: border-box;
}
.tabs-nav.three li {
	width: 33.33%;
}
.tab-section .tabs-nav.two li {
	width: 50%;	
}
.tab-section .tabs-nav.two li:nth-child(3) {
	display: none;
}

/* map & chart area layout */
.box-layout {
	float: left;
	width: calc(100% - 270px);	
	height: calc(100% - 168px);	
}

#mapDiv {
	position: relative !important;		
	display: block;
	width: 100%;	
	background: #f1f1f1;
	z-index:1;
}

.chartArea {	
	display: block;
	width: 100%;
	margin: 0;
	padding: 8px 0 0 0;	
	background: #fff;
		
}
.chartArea p {
	text-align: center;
	line-height: 140px;
}

/* common & etc */
.wid20 {width: 20%}
.wid30 {width: 30%}
.wid80 {width: 80%}
.wid70 {width: 70%}

.fix-scroll {
	margin-top: 5px;	
	/* height: 121px; */
	height: 150px;
	overflow: auto;
}
.fix-scroll>.table01 {margin-top: 0; border-top: 1px solid #aaa}

/* chrome */
.fix-scroll::-webkit-scrollbar {
	margin: 5px 0 0 0;	
	width: 7px;
	border-radius: 3px;
	background-color: #e1e1e1;	
}
.fix-scroll::-webkit-scrollbar-thumb {
	background-color: #aaa;
	border-radius: 3px;
	width: 5px;
} 
.fix-scroll::-webkit-scrollbar-track {
	background-color: #e2e2e2;
	border-radius: 3px;
} 

.fix-scroll::-webkit-scrollbar-button:start:decrement,
.fix-scroll::-webkit-scrollbar-button:end:increment {
	height: 0px;
} 

/* firefox */
.fix-scroll {
	scrollbar-color: #aaa #e2e2e2; 
	scrollbar-width: thin;
}
/* ie */
.fix-scroll{
	scrollbar-arrow-color: #9d9992;
	scrollbar-3dlight-color: #d4d0c8;
	scrollbar-darkshadow-color: #d4d0c8;
	scrollbar-face-color: #fff;
	scrollbar-highlight-color: #fff;
	scrollbar-shadow-color: #fff;
	scrollbar-track-color: #eae7e1;
}

/* comment */
.app-area .bot_comment {
	position: relative;
	padding: 5px 15px;
}
.app-area .comment {
	position: relative;
}
.app-area .comment li {
	display: inline-block;
	margin: 0 12px 0 0;
	font-size: 12px;
	color: #555;
}
.app-area .comment li:before {
	content: '';
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: #666;
	display: inline-block;
	margin: 5px 3px 0 0;
	vertical-align: top;
}

/* 출처 */
.app-area p.source {
	color: #555;
}


/* 다국어 : 20241216 */
:not(:lang(ko)) .app_topMenu ul li .btn {word-break:break-all;}