@charset "UTF-8"; 

/*
* 기본 UI 영역(스마트폰 포함)
*/

#wrap { max-width:768px; min-width:320px; margin:0 auto; }
#accessibility { display:none; }
#header { position:fixed; z-index:10; left:0; top:0; right:0; padding:0px 0 15px; background:url(/img/common/bg-header.png) 50% 0 no-repeat; }
#header,
#header a { color:#fff; }
#header .inner { position:relative; max-width:100%; min-width:100%; margin:0 auto; min-height: 59px; }
#header .inner:after { content:""; display:block; clear:both; }
#header .inner h1 { z-index:2; margin:0 auto; width:160px; }
#header .inner h1 a { display:block; width:130px; height:59px; padding-left:40px; font-weight:200; font-size:12px; line-height:59px; background:url(/img/common/logo-h1.png) left center no-repeat; background-size:30px 28px; }

#header .inner .mobile_m_intro { position: relative; padding: 10px 0px 10px 10px; width: 100%; border-bottom: 1px solid #999999; display:block; z-index:5; }
#header .inner .mobile_m_intro ul:after { content: ""; display: block; clear: both; }
#header .inner .mobile_m_intro ul li { display: inline-block; white-space: nowrap; position: relative; height: 22px; line-height: 22px; font-size: 13px; padding-left: 20px; }
#header .inner .mobile_m_intro ul li a { width:auto; padding:0px 3px; font-size:13px; padding-left:7px; display: inline-block; white-space: nowrap; position: relative; height: 26px; line-height: 26px; }
#header .inner .mobile_m_intro ul li a.home { background: url(/img/common/icon-home.png) left 5px no-repeat; padding-left: 17px }
#header .inner .mobile_m_intro ul li a ~ a:after { content: ""; position: absolute; left: 0; top: 50%; margin-top: -6px; height: 10px; border-left: 1px solid #b9b9b9 }


#header .inner div.links {float:right; position:absolute; z-index:2; margin-right:20px;top: -2px;right: 0; display:none;}
#header .inner div.links ul{width: 326px;}
#header .inner div.links ul li{display: block;float: left;text-indent: 0;position: relative}
#header .inner div.links ul li ~ li:after {content:""; position:absolute; left:0; top:50%; margin-top:-6px; height:10px; border-left:1px solid #b9b9b9}
#header .inner div.links ul li a {display: block;padding: 7px 5px 5px 5px}
#header .inner div.links ul li a.home {background: url(/img/common/icon-home.png) left no-repeat;padding-left: 17px}
#header .inner div.links ul li a.window {background: url(/img/common/icon-new-window.gif) right 9px no-repeat;padding-right: 15px}
#header .inner div.links ul li a span{display: block;border-right:1px solid #ccc; height: 12px;padding-right: 5px}
#header .inner div.links ul li a.last{padding-top: 5px; font-size: 16px}
#header .inner div.links ul li a.last span{display: block;font-size:16px;height: 12px;padding-right: 5px;border:0px}

#header .inner div.links > *{float:left; text-indent:-9999px}
#header .inner div.links .dev {width:82px; height:22px; border-bottom:4px solid #fff; background:url(/img/common/txt-devs.png) 50% 0 no-repeat}
#header .inner div.links .eng {width:56px; margin-right:15px;text-indent: 0px;height: 26px;line-height: 26px}
#header .inner div.links .eng span {display:block; height:26px; background:#fff url(/img/common/txt-eng.gif) 50% 50% no-repeat; border-radius:50%}
.no-rgba #header div.inner .links .eng span {background-color:transparent}
#header .inner div.links .search {width:50px; height:26px; margin-right:30px; background:url(/img/common/btn-search.png) 50% 50% no-repeat}
#header .inner div.links .search.open {background:url(/img/common/btn-close-search.png) 50% 50% no-repeat}
#header .inner div.links .search.hidden {display:none}

.gnb_open { z-index:5; width: 39px; height: 46px; content: "메뉴"; display: block; background: url(/img/common/btn-menu-mobile.png) center center no-repeat; position: absolute; margin-top:10px; left: 10px; text-indent: -9999em; }
#gnb { width: 100%; height:100%; padding: 0; margin: 0; position: fixed; left: -100%; top: 0; background-color: rgba(70,70,70,.5); z-index: 9999; display:none; }
#gnb.on { left:0px; display:block; }

#gnb h2 { position:absolute; left:-999em; }
#gnb .contain { position:relative; padding:0px; }
#gnb .contain .line { position:absolute; z-index:3; left:0; top:49px; right:0; border-top:1px solid #363636; opacity:0; }
#gnb .contain .cover { position:absolute; left:0; top:-55px; right:0; bottom:0; background:#000; opacity:0; }
#gnb .contain > ul { position:relative; z-index:5; display:inline-block; width:100%; }
#gnb .contain > ul:after { content:""; display:block; clear:both; }
#gnb .contain > ul > li { float:none; border-bottom:1px solid #999999; display:none; }
#gnb .contain > ul > li.mobileV { display:list-item; }
#gnb .contain > ul > li.new_win { background: url(/img/common/icon-new-window.gif) center right 25px no-repeat; }
#gnb .contain > ul > li.subMenuOn { padding-bottom:0px; }
#gnb .contain > ul > li > span,
#gnb .contain > ul > li > a { display:inline-block; white-space:nowrap; position:relative; height:26px; line-height:26px; font-size:16px; width: calc(100% - 30px); padding:10px 0; padding-left: 30px; }
#gnb .contain > ul > li.subMenuOff > a { background: url(/img/common/icon-sub-menu-plus.gif) center right 20px/14px no-repeat; }
#gnb .contain > ul > li.subMenuOn > a { background: url(/img/common/icon-sub-menu-minus.gif) center right 20px/14px no-repeat; }

#gnb .contain > ul > li > ul { display:none; }
#gnb .contain > ul > li.subMenuOn > ul { display:block; }
#gnb .contain > ul > li > ul > li { position:relative; border-top:1px solid #7d7d7d; background:rgba(120, 120, 120, 0.7); }
#gnb .contain > ul > li > ul > li.window { background: url(/img/common/icon-new-window.gif) right 22px center no-repeat; background-color:rgba(120, 120, 120, 0.7); padding-right: 15px; }
#gnb .contain > ul > li > ul > li.onlyPcV { display:none; }
#gnb .contain > ul > li > ul > li.onlyMobileV { display:list-item; }
#gnb .contain > ul > li > ul > li:before { content: ''; position: absolute; left: 35px; top: 18px; width: 3px; height: 3px; display: block; background-color: #ffffff; border-radius: 10px; }
#gnb .contain > ul > li > ul > li > a { display:inline-block; width:205px; height:26px; line-height:26px; font-size:12px; padding:8px 0px; padding-left:45px; }

#gnb .gnb_close { width: 19px; height: 19px; margin-left: -100%; position: absolute; left: 270px; top: 0; text-indent: -99999px; padding: 13px 13px; background: url(/img/common/btn-close-mobile.png) no-repeat center center; transition: margin .3s; }

#gnb.on .contain { width: 100%; max-width: 270px; height: 100%; background: rgba(40,40,40,.7); overflow-y: auto; transition: margin .3s; }
#gnb.on .gnb_close { margin-left:0px; }

/*통합검색창*/
#header .search-header { position:relative; z-index:1; clear:both; width:auto; margin:0 auto; margin-right:0px; padding-left:53px; text-align:right; }
#header .search-header .search-global { display:none; width:95%; padding-top:15px; margin-bottom:-9px; }
#header .search-header.open .search-global { display:block; }
#header .search-header .result { clear:both; padding-top:15px; margin-bottom:-9px; font-size:13px; padding-right:6%; }
#header .search-header .result p { line-height: 18px; }
#header .search-header .result p span.pcView { display:none; }
#header .search-header .search-global .autoCompleteChk { font-size:10px; padding-top: 5px; float: left; }
#header .search-header .search-global .autoCompleteChk span { vertical-align: middle; }

/*검색이력조회 */
#header .search-header .search-global .searchHistOn { font-size: 10px; padding-top: 7px; float: left;  margin-right: 6px;}
#header .search-header .search-global .searchHistOn > a { vertical-align: middle; padding-right: 3px;}

.search-global .wrap { display:block; position:relative; padding-right:30px; }
.search-global .wrap input[type="text"] { display:block; width:100%; height:40px; line-height:30px; background:#fff; border:0px none; padding:0 0 0 15px; font-size:12px; font-weight: bold; }
.search-global .wrap input[type="button"] { position:absolute; right:0; bottom:0; width:33px; height:40px; background:#1a69b2 url(/img/common/btn-search-form.gif) 50% 50% no-repeat; border:0 none; text-indent:-9999px; background-size:15px; }
.search-global { display:block; position:relative; }

/*통합검색창-메인, 주소검색창 제외한 나머지 페이지*/
#header #topSeaechAddress.search-header .search-global { display:block; }

/* 도로명주소 상세검색창 */
.search-header .searchDefTbl{ position:absolute; left:0; top:82px; width:100%; background-color:#6B6B6B; padding:45px 0 0 0; display:none; z-index:10; }
.search-header .searchDefTbl .detail-tbl{ border-top:1px solid #8D8D8D; border-bottom:1px solid #8D8D8D; width:100%; }
.search-header .searchDefTbl .detail-tbl .searchType th,
.search-header .searchDefTbl .detail-tbl .searchType td{ border-bottom:1px dashed #8D8D8D; padding:11px 0 10px; }
.search-header .searchDefTbl .btnGroup{ margin:30px auto 45px; }
.tbl-input-list{ overflow:hidden; }
.tbl-input-list li{ float:left; margin:0 10px 0; vertical-align:middle; line-height:15px; }
.tbl-input-list li input{ margin:0 5px 0 0; border:none; background:transparent; line-height:15px; height:15px; }
.tbl-input-list li label{ color:#fff; cursor:pointer; }
.search-header .searchDefTbl .detail-tbl th{ text-align:left; color:#fff; padding-top:20px; line-height:32px; }
.search-header .searchDefTbl .detail-tbl td{ padding-top:20px; }
.search-header .searchDefTbl .detail-tbl .last th,
.search-header .searchDefTbl .detail-tbl .last td{ padding-bottom:19px; }

.srch-tbl tbody tr td.align-left{ padding:0 0 0 33px; }
.srch-tbl tbody tr td.align-left p{ padding:0; display:inline-block; vertical-align:middle; line-height:20px; font-size:13px; }
.srch-tbl tbody tr td.align-left .spot{ display:inline-block; vertical-align:middle; width:20px; height:20px; line-height:20px; padding:0 0 0 4px; }
.srch-tbl tbody tr td.align-left .spot a{ display:block; width:20px; height:20px; line-height:999; overflow:hidden; background:url('/img/bt_place_small.gif') no-repeat 0 2px; }
.srch-tbl tbody tr td span a{ display:block; margin:0 auto; }
.srch-tbl tbody tr td span .more-row{ display:block; width:50px; height:26px; line-height:26px; color:#fff; font-weight:bold; background:#666 url('/img/ico_more_plus.gif') no-repeat 10px 50%; padding:0 0 0 15px; }
.srch-tbl tbody tr td span .close-row{ display:none; width:15px; height:26px; background:url('/img/btn_close_tblrow.gif') no-repeat 50% 5px; line-height:999; overflow:hidden; }
.srch-tbl tbody tr.show{ display:none; }
.srch-tbl tbody tr.show td{ border-top:none !important; background-color:#f7f7f7; padding:0; border-bottom:none; }
.srch-tbl tbody tr.show td div{ margin:0 25px 0 55px; padding:11px 0 13px; text-align:left; position:relative; }
.srch-tbl tbody tr.show td div p{ color:#1468c2; line-height:20px; font-weight:bold; font-size:13px; }
.srch-tbl tbody tr.on td{ background-color:#f7f7f7; font-weight:bold; }
.srch-tbl tbody tr.on td span .more-row{ display:none; }
.srch-tbl tbody tr.on td span .close-row{ display:block; }
.tableTypes .w568{ width:548px !important; }
.tableTypes .w368{ width:400px !important; }
.tableTypes .chk82{ width:52px !important; text-align:left !important; }
.tableTypes .chk82 input{ width:auto !important; margin:0 5px 0 0; padding:0; height:32px !important; line-height:32px !important; }
.tableTypes .w92{ width:72px !important; }
.tableTypes .bunji{ overflow:hidden; width:230px !important; }
.tableTypes .bunji input{ width:72px !important; }
.tableTypes .bunji input,.tableTypes .bunji  span.dash{ float:left; }
.tableTypes .bunji span.dash{ width:10px; line-height:32px; height:32px; text-align:center; }
.searchDefTbl .detail-tbl .sbHolder{ width:278px; height:30px; border:1px solid #0754a6; }
.searchDefTbl .detail-tbl .sbOptions{ width:278px; border:1px solid #0754a6; top:30px; }
.searchDefTbl .detail-tbl .sbOptions a{ line-height:30px; }
.searchDefTbl .detail-tbl .sbToggle{ background-position:95% -112px; }
.searchDefTbl .detail-tbl .sbToggle:hover{ background-position:95% -163px; }
.searchDefTbl .detail-tbl .sbToggleOpen,
.searchDefTbl .detail-tbl .sbToggleOpen:hover{ background-position:95% -63px; }
.searchDefTbl .detail-tbl .roadName .select-ui{ float:left; margin:0 10px 0 0; }
.searchDefTbl .detail-tbl .roadName .select-ui.last{ margin:0; }
.searchDefTbl .detail-tbl .roadName .select-ui .sbSelector{ line-height:32px; }
.searchDefTbl .detail-tbl .roadName:after{ content:''; clear:both; display:block; overflow:hidden; }
.searchDefTbl .detail-tbl .bdNum{ color:#fff; }
.searchDefTbl .detail-tbl .bdNum input{ width:100px; line-height:30px; height:30px; border:1px solid #555; display:block; float:left; }
.searchDefTbl .detail-tbl .bdNum span{ display:block; float:left; width:10px; text-align:center; line-height:30px; height:30px; }
.select-ui.left{ text-align: left; }
.btnGroup{ position:relative; margin:15px auto 15px; overflow:hidden; min-height:29px; }
.btnList{ float:right; text-align:right; }
.btnList:after{ content:''; clear:both; display:block; overflow:hidden; }
.btnList li{ display:inline-block; margin:0 0 0 7px; vertical-align:top; }
.btnList li a{ font-size:15px; padding:8px 24px; font-weight:bold; display:block; }
.btnList li.yellow a{ color:#333; background-color:#fece00; }
.btnList li.gray a{ color:#333; background-color:#ccc; }
.btnList li.dark a{ color:#fff; background-color:#555; }
.btnList.btnCenter{ float:none; text-align:center; }

#content{outline: none;}
#content[class*="section-"] { width:95%; margin:0 auto; padding:0px; }
#contentQA[class*="section-"] { width:95%; margin:0 auto; padding:40px 0 80px; }

#footer {position:relative; z-index:5; background:#f0f0f0; padding:20px 0}		
#footer .inner {position:relative; width:100%; margin:0 auto; font-size:10px; color:#333; padding:0 15px;}
#footer .inner .info_mobile {position:relative; padding-left:0px; text-align:center; }
#footer .inner .info_mobile a {color:#333}
#footer .inner .info_mobile p ~ p {margin-top:5px}

#footer .inner .info { display:none; }
#footer .inner .etc { display:none; }

#footer .inner .info { position:relative; padding-left:183px; }
#footer .inner .info a { color:#333; }
#footer .inner .info h2 { position:absolute; left:0; top:42%; margin-top:-15px; }
#footer .inner .info h2 a { display:block; height:50px; width:148px; background:url(/img/common/logo-mois.gif) no-repeat; text-indent:-9999px; }
/* #footer .inner .info ul ~ ul { margin-top:17px; } */
#footer .inner .info ul:after { content:""; display:block; clear:both; }
#footer .inner .info ul li,
#footer .inner .info ul li a { float:left; height: 25px; line-height: 25px; }
#footer .inner .info ul li ~ li { position:relative; margin-left:16px; padding-left:17px; }
#footer .inner .info ul li ~ li:after { content:""; position:absolute; left:0; top:50%; margin-top:-5px; height:11px; border-left:1px solid #b9b9b9; }
#footer .inner .info ul li em { padding:0 3px; font-size:13px; font-style:normal; }
#footer .inner .info p { margin-top:12px; }

#footer .inner .etc .links { position:absolute; right:0; bottom:21px; }
#footer .inner .etc .links a ~ a { margin-left:22px; }
#footer .inner .etcInfo{ width: 100%; display: inline-block; }
#footer .inner .etcInfo .left{ width: 56%; float: left; }
#footer .inner .etcInfo .right{ width: 44%; float: right; }
#footer .inner .etcInfo .right ul li:after { border:0; }
#footer .inner .etcInfo .right ul li:first-child { width: 50px; }

#footer .inner .quick > a { display:block; width:90px; cursor:pointer; height:25px; line-height:25px; color:#000; background: url(/img/common/icon-btn-plus.gif) 88% 37% no-repeat; }
#footer .inner .quick ul { background:#999; position:absolute; height:150px; right:0; left:0; bottom:100%; width:120px; display:none; overflow-y:scroll; overflow-x:hidden; }
body#ie9 #footer .inner .quick ul { width: 137px; }
#footer .inner .quick ul li { margin: 0; padding: 0; display: block; width: 100%; }
#footer .inner .quick ul li a { display:block; padding:0 0 0 15px; line-height:25px; color:#fff; font-size:12px; width: 88%; }
#footer .inner .quick ul li a:hover,
#footer .inner .quick ul li a:focus { background:#666; }
#footer .inner .quick ul li ~ li:after{ content:""; border: 0; }
#footer .inner .quick ul li ~ li{ margin: 0; padding: 0; }


/*
* 태블릿 전용 UI 영역
*/
@media screen and (min-width:768px) { 
	#wrap { max-width:1024px; min-width:768px; margin:0 auto; }
	#header { padding:0px 0 20px; }
	#header .inner { min-height:80px; }
	
	.gnb_open { width: 75px; height: 75px; background-size: 38px 28px; margin-top:10px; }
	.search-global .wrap { padding-right: 60px; }
	.search-global .wrap input[type="text"] { height: 60px; border: 0 none; line-height: 60px; padding: 0 0 0 25px; font-size: 20px; }
	.search-global .wrap input[type="button"] { width: 60px; height: 60px; background-size: 25px; }
	
	#header .search-header { padding-left:90px; }
	#header .search-header .search-global .autoCompleteChk { font-size:13px; }
	#header .search-header .search-global .searchHistOn { font-size:13px;  padding-top: 5px; margin-right:5px; }
	#header .search-header .result { padding-top:18px; font-size:16px; }
	#header .search-header .result p { line-height: 20px; }
	
	#footer .inner { font-size: 15px; }
}


/*
* PC 전용 UI 영역
*/
@media screen and (min-width:1025px) { 
	
	#wrap { max-width:100%; min-width:1025px; margin:0 auto; }
	#accessibility { display:block; position:absolute; left:0; top:0; width:100%;  z-index:20; height:30px; overflow:hidden; }
	#accessibility a { position:absolute; left:0; top:-1000px; width:100%; height:100%; line-height:30px; text-align:center; color:#fff; background:#000; }
	#accessibility a:focus { top:0; }	
	
	#header { padding:55px 0 49px; }
	#header .inner { max-width:1200px; min-width:1000px; min-height: auto; }
	#header .inner .mobile_m_intro { display:none; }
	#header .inner div.links { display:block; }
	
	.gnb_open { display:none; }
	#gnb { width: auto; height: auto; position: absolute; z-index: 1; left: 0; top: -2px; right: 0; background: none; display: block; }
	#gnb .contain { padding:0 0 0 25px; }
	#gnb .contain .line { display:none; }
	#gnb .contain .cover { display:none; }
	#gnb .contain > ul { width:auto; }
	#gnb .contain > ul > li { float: left; padding: 0px; padding-left: 15px; border: 0px; }
	#gnb .contain > ul > li.mobileV { display:none; }
	#gnb .contain > ul > li.pcV { display:list-item; }
	#gnb .contain > ul > li ~ li { margin-left:20px; }
	#gnb .contain > ul > li.subMenuOff > a { background:none; }
	#gnb .contain > ul > li.subMenuOn > a { background:none; }
	#gnb .contain > ul > li > span, #gnb .contain > ul > li > a { padding:0px; width: auto; }
	#gnb .contain > ul > li > ul { margin-left:-15px; padding-top: 33px; margin-top: 10px; padding-bottom: 20px; margin-bottom: 0px; }
	#gnb .contain > ul > li > ul > li { position:static; padding:0px; border:0; background:none; }
	#gnb .contain > ul > li > ul > li.window { background:none; }
	#gnb .contain > ul > li > ul > li.onlyPcV { display:list-item; }
	#gnb .contain > ul > li > ul > li.onlyMobileV { display:none; }
	#gnb .contain > ul > li > ul > li:before { content:none; }
	#gnb .contain > ul > li > ul > li > a { padding:0 15px; width:auto; }
	#gnb .contain > ul > li > ul > li.active > a { background:#186bb9; border-radius:3px; }
	#gnb.open .contain > ul > li.active > a:after { content:""; position:absolute; z-index:4; left:0; bottom:-24px; right:0; border-bottom:2px solid #186bb9; }
	#gnb .gnb_close { display:none; }
	.search-global .wrap { padding-right: 74px; }
	.search-global .wrap input[type="text"] { height: 74px; border: 0 none; line-height: 74px; padding: 0 0 0 20px; font-size: 19px; }
	.search-global .wrap input[type="button"] { width: 74px; height: 74px; background-size: auto; }
	
	#header .search-header { width:720px; text-align:center; padding-left: 0px; margin: 0 auto; }
	#header .search-header .search-global { width:720px; padding-top:50px; }
	#header .search-header .result { font-size:20px; padding:0px; padding-top:30px; text-align: right; }
	#header .search-header .result p { text-align:center; line-height: 25px; }
	#header .search-header .result p span.pcView { display:inline; }
	
	/*통합검색창-메인, 주소검색창 제외한 나머지 페이지*/
	#header #topSeaechAddress.search-header .search-global { display:none; }	
	
	#content[class*="section-"] {width:960px; margin:0 auto; padding:40px 0 40px}
	
	
	/*도로명주소 도움센터(Q&A) 글쓰기 페이지-시작*/
	
	#contentQA[class*="section-"] { width:960px; }
	
	/*도로명주소 도움센터(Q&A) 글쓰기 페이지-끝*/
	
	#footer {position:relative; z-index:5; background:#f0f0f0; padding:30px 0}		
	#footer .inner {position:relative; width:1000px; margin:0 auto; font-size:12px; color:#333; padding:0;}
	#footer .inner .info_mobile { display:none; }
	#footer .inner .info { display:block; }
	#footer .inner .etc { display:block; }
}
