@charset "utf-8";
/**
 * Seoul Real-Estate Portal
 *
 * @author Calliopus
 */
 

/* Shortcut */

.wrap {position: relative; width: 1280px; margin: 0 auto;}

.none {display: block; visibility: hidden; width: 0; height: 0; line-height: 0; font-size: 0;}



/* Shortcut : Float */

.float:after {content: ""; display: block; clear: both;}

.float > * {float: left;}
.float > .right {float: right;}


/* Page */

body {min-width: 1280px; line-height: 1.5; font-family: 'Noto Sans KR', 'Malgun Gothic', sans-serif; font-size: 15px; font-weight: 300; color: #787a84; letter-spacing: -0.5px;}



/* Skip Navigation */

#skip {position: fixed; top: 0; left: 0; width: 100%; height: 0; background: #1c2238; overflow: hidden; z-index: 200; text-align: center; line-height: 0; font-size: 0; color: #fff;}
#skip.on {height: auto; overflow: auto;}

#skip a {display: block; line-height: 2.5; font-size: 16px; text-decoration: none;}


/* Header */

header {border-bottom: solid 2px #3872dc; text-align: center; line-height: 0; font-size: 0;}
header .wrap {/* width: auto; min-width: 1280px; max-width: 1600px; */ height: 80px;}

header .logo {position: absolute; top: 14px; left: 0;}
header .logo a {width: 177px; height: 51px; background: url(../images/header/imgLogo.png) no-repeat 50%; vertical-align: top;}
header .logo span {margin-left: 10px; padding-top: 16px; vertical-align: top; line-height: 1; font-size: 18px; font-weight: 700; color: #3872dc;}

header .gnb {white-space: nowrap; text-align: center;}
header .gnb,
header .gnb > li {display: inline-block;}
header .gnb > li {position: relative; vertical-align: top;}
header .gnb > li > a {display: block; box-sizing: border-box; height: 80px; padding: 24px 20px; line-height: 1.5; font-size: 20px; font-weight: 500; color: #1c2238; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; -o-transition: color 0.3s; transition: color 0.3s;}
header .gnb > li > a:after {content: ""; display: block; width: 0; height: 2px; background: #3872dc; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; -o-transition: width 0.3s; transition: width 0.3s;}

header .gnb ul.depth2 {display: none; position: absolute; top: 80px; left: 0; padding: 15px 20px 12px; border: solid 1px #c7cdd7; border-top: solid 2px #3872dc; background: #fff; box-shadow: 2px 2px 2px #c7cdd7; text-align: left;}
header .gnb ul.depth2 li a {display: block; line-height: 2.5; font-size: 15px; font-weight: 400; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; -o-transition: color 0.3s; transition: color 0.3s;}
header .gnb ul.depth2 li a:hover,
header .gnb ul.depth2 li a:focus {color: #000;}

header .gnb > li:hover,
header .gnb > li:focus {z-index: 100;}
header .gnb > li:hover > a,
header .gnb > li:focus > a {color: #3872dc;}
header .gnb > li:hover > a:after,
header .gnb > li:focus > a:after {width: 100%;}
header .gnb > li:hover > ul.depth2,
header .gnb > li:focus > ul.depth2 {display: block;}

header .textsize {position: absolute; top: 28px; right: 100px; line-height: 0; font-size: 0;}
header .textsize span.label {margin-right: 10px; line-height: 1; font-size: 16px; font-weight: 500;}

header .textsize a {width: 18px; height: 18px; border: solid 2px #d2d2d2; background-repeat: no-repeat; background-position: 50%; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;}
header .textsize a.plus {background-image: url(../images/header/icnSizePlus.png);}
header .textsize a.minus {margin-left: 2px; background-image: url(../images/header/icnSizeMinus.png);}

header .textsize a:hover {border-color: #3872dc;}
header .textsize a.plus:hover {background-image: url(../images/header/icnSizePlusOn.png);}
header .textsize a.minus:hover {background-image: url(../images/header/icnSizeMinusOn.png);}

header .func {position: absolute; top: 28px; right: 0;}
header .func a {display: block;}
header .func a.menu {padding-right: 33px; background: url(../images/header/icnMenu.png) no-repeat 100% 50%; line-height: 22px; font-size: 16px; font-weight: 500;}
header .func a.menu:hover {background-image: url(../images/header/icnMenuOn.png); color: #3872dc;}
header .func a.search {display: none;}

header .sitemap {display: none; box-sizing: border-box; position: absolute; top: 82px; left: 0; width: 100%; height: 300px; border: solid 1px #c7cdd7; border-top: 0; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25); z-index: 100;}

header .sitemap .depth1 {}
header .sitemap .depth1 > li {}
header .sitemap .depth1 > li > a {}

header .sitemap .depth2 {}
header .sitemap .depth2 > li {}
header .sitemap .depth2 > li > a {}

header .sitemap .sitemap-bottom {box-sizing: border-box; position: absolute; bottom: 0; left: 0; width: 100%; padding: 12px 20px; text-align: left;}

header .sitemap .sitemap-bottom a {box-sizing: border-box; position: relative; min-width: 38px; height: 38px; margin-left: 8px; padding: 0 15px; border: solid 1px #c7cdd7; border-radius: 4px; background: #fff; line-height: 36px; font-size: 13px; color: #000; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;}
header .sitemap .sitemap-bottom a:hover {border-color: #3872dc; background: #3872dc; color: #fff;}
header .sitemap .sitemap-bottom a:first-child {margin-left: 0;}

header .sitemap .sitemap-bottom a.quick {padding-left: 48px;}
header .sitemap .sitemap-bottom a.quick:before {content: ""; display: block; position: absolute; top: 6px; left: 15px; width: 24px; height: 24px; background: url(../images/header/icnNavQuick.png) no-repeat 0 50%; -webkit-transition: background-position 0.3s; -moz-transition: background-position 0.3s; -o-transition: background-position 0.3s; transition: background-position 0.3s;}
header .sitemap .sitemap-bottom a.quick:hover:before {background-position: 100% 50%;}

header .sitemap .sitemap-bottom a.close {position: absolute; top: 12px; right: 12px; border: 0; background: url(../images/header/icnNavClose.png) no-repeat 50%; line-height: 0; font-size: 0;}
header .sitemap .sitemap-bottom a.close:hover {opacity: 0.25; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";}


header.hold-mobile {border-bottom: solid 2px #3262b9;}
header.hold-mobile .wrap {/* min-width: 750px; max-width: 750px; */ min-width: 0; max-width: 100%;}

header.hold-mobile .logo {display: inline-block; position: static; padding: 14px 0 15px;}
header.hold-mobile .gnb {display: none;}
header.hold-mobile .textsize {display: none;}

header.hold-mobile .func {top: 0; left: 0; right: auto; width: 100%;}
header.hold-mobile .func a {position: absolute; top: 0; width: 80px; height: 80px;}
header.hold-mobile .func a.menu {left: 0; background: url(../images/header/icnMenuM.png) no-repeat 50%; padding: 0; line-height: 0; font-size: 0;}
header.hold-mobile .func a.menu:hover {background-image: url(../images/header/icnMenuMOn.png);}
header.hold-mobile .func a.search {display: block; right: 0; background: url(../images/header/icnSearchM.png) no-repeat 50%;}
header.hold-mobile .func a.search:hover {background-image: url(../images/header/icnSearchMOn.png);}


/* Container */

#container.sub {padding-bottom: 148px;}
#container.sub .wrap:after {content: ""; display: block; clear: both;}

#lnb {float: left; width: 265px; padding-top: 100px;}

#lnb ul.depth2 {border-top: solid 2px #3872dc;}
#lnb ul.depth2 > li {border-bottom: solid 1px #c7cdd7;}
#lnb ul.depth2 > li > a {display: block; padding: 14px 45px 14px 20px; background: #fff url(../images/common/icnMoreLnb.png) no-repeat 230px 17px; line-height: 1.2; font-size: 19px; font-weight: 400; color: #000; letter-spacing: -1px; -webkit-transition: background-color 0.3s; -moz-transition: background-color 0.3s; -o-transition: background-color 0.3s; transition: background-color 0.3s;}
#lnb ul.depth2 > li > a:hover,
#lnb ul.depth2 > li > a:focus {background-color: #e8ebf0;}

#lnb ul.depth2 > li.on > a {background-color: #5b5d66 !important; color: #fff;}
#lnb ul.depth2 > li.on > ul.depth3 {display: block;}

#lnb ul.depth3 {display: none; background: #e9ebef;}
#lnb ul.depth3:before,
#lnb ul.depth3:after {content: ""; display: block; height: 16px;}
#lnb ul.depth3 > li > a {display: block; padding: 6px 20px 6px 30px; background: url(../images/common/objBullet2.png) no-repeat 22px 14px; line-height: 1.2; font-size: 15px; font-weight: 400; color: #454647; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; -o-transition: color 0.3s; transition: color 0.3s;}
#lnb ul.depth3 > li > a:hover,
#lnb ul.depth3 > li > a:focus,
#lnb ul.depth3 > li.on > a {color: #3872dc;}

#content {position: relative; width: 956px; padding-top: 100px; margin-left: 10px;}



/* Content Area */

.page-head {position: absolute; top: 30px; left: 0; width: 100%; height: 50px; border-bottom: solid 1px #e1e4e6;}

.page-title {line-height: 1; font-size: 32px; font-weight: 300; color: #1c2238;}

.page-loca {position: absolute; top: 18px; right: 0; line-height: 1; font-size: 14px; font-weight: 400;}
.page-loca:after {content: ""; display: block; clear: both;}
.page-loca li {float: left; padding-left: 22px; background: url(../images/common/objDivLoca.png) no-repeat 10px 3px;}
.page-loca li:first-child {padding-left: 0; background: none;}
.page-loca li a {vertical-align: top;}



/* Footer */

footer {background: #797c87; line-height: 0; font-size: 0; clear: both;}
footer .wrap {box-sizing: border-box; /* width: auto; min-width: 1280px; max-width: 1600px; */ height: 104px; padding: 29px 0 0 192px;}

footer .logo {position: absolute; top: 30px; left: 0; width: 159px; height: 46px; background: url(../images/footer/imgLogo.png) no-repeat 50%;}
footer .info {line-height: 1.5; font-size: 16px; color: #fff;}
footer .mark-access {position: absolute; top: 28px; right: 0; width: 80px; height: 57px; background: url(../images/footer/imgMarkAccess.png) no-repeat 50%;}

footer .sns {position: absolute; top: 35px; right: 106px;}
footer .sns:after {content: ""; display: block; clear: both;}
footer .sns li {float: left; margin-left: 5px;}
footer .sns li:first-child {margin-left: 0;}
footer .sns li a {width: 39px; height: 39px; background-repeat: no-repeat; background-position: 50%;}

footer .sns li.i1 a {background-image: url(../images/footer/btnSns1.png);}
footer .sns li.i2 a {background-image: url(../images/footer/btnSns2.png);}
footer .sns li.i3 a {background-image: url(../images/footer/btnSns3.png);}
footer .sns li.i4 a {background-image: url(../images/footer/btnSns4.png);}
footer .sns li.i5 a {background-image: url(../images/footer/btnSns5.png);}



/* Form Elements & Buttons I */

input.basic,
select.basic,
textarea.basic {box-sizing: border-box; width: 200px; height: 38px; padding: 6px 10px; border: solid 1px #c2c4c9; background: #fff; line-height: 24px; font-size: 15px; color: #606473; letter-spacing: inherit;}
select.basic {background: #fff url(../images/common/objSelect.png) no-repeat 100% 50%;}
textarea.basic {height: 140px;}

input.basic.full,
select.basic.full,
textarea.basic {width: 100%;}

ul.tab {border-bottom: solid 3px #3872dc; overflow: hidden; white-space: nowrap; line-height: 0; font-size: 0;}
ul.tab li {display: inline-block; box-sizing: border-box; width: 50%; height: 51px; background: #fff; overflow: hidden; border: solid 1px #ccc; border-left-width: 0; border-bottom: 0; vertical-align: top; white-space: normal; text-align: center; line-height: 1.2; font-size: 16px; font-weight: 400; color: #1c2238; -webkit-transition: border-color 0.3s, background-color 0.3s, color 0.3s; -moz-transition: border-color 0.3s, background-color 0.3s, color 0.3s; -o-transition: border-color 0.3s, background-color 0.3s, color 0.3s; transition: border-color 0.3s, background-color 0.3s, color 0.3s;}
ul.tab li:first-child {border-left-width: 1px;}
ul.tab li:hover,
ul.tab li:focus,
ul.tab li.on {border-color: #2d5bb0; background-color: #3872dc; color: #fff;}
ul.tab li a {display: table; box-sizing: border-box; width: 100%; padding: 6px 0;}
ul.tab li a span {display: table-cell; height: 38px;}

ul.tab.unit3 li {width: 33.33%;}
ul.tab.unit4 li {width: 25%;}
ul.tab.unit5 li {width: 20%;}
ul.tab.unit6 li {width: 16.66%;}
ul.tab.unit7 li {width: 14.28%;}
ul.tab.unit8 li {width: 12.5%;}
ul.tab.unit9 li {width: 11.11%;}
ul.tab.unit10 li {width: 10%;}

.btn,
.btn2,
.btn3 {margin-bottom: 0.25em; margin-right: 2px; padding: 0.45em 1.4em; border-style: solid; border-width: 1px; border-radius: 3px; vertical-align: middle; line-height: 1.5; font-size: 0.88em; font-weight: 400; -webkit-transition: border-color 0.3s, background 0.3s, color 0.3s; -moz-transition: border-color 0.3s, background 0.3s, color 0.3s; -o-transition: border-color 0.3s, background 0.3s, color 0.3s; transition: border-color 0.3s, background 0.3s, color 0.3s;}

.btn.large,
.btn2.large,
.btn3.large {font-size: 1em;}
.btn.xlarge,
.btn2.xlarge,
.btn3.xlarge {font-size: 1.25em;}

.btn {border-color: #99a3b5; background: #99a3b5; color: #fff;}
.btn.dark {border-color: #5b5d66; background: #5b5d66;}
.btn.color {border-color: #3872dc; background: #3872dc;}

.btn2 {border-color: #787a84; background: #fff; color: #787a84;}
.btn2.dark {border-color: #1c2238; color: #1c2238;}
.btn2.color {border-color: #3872dc; color: #3872dc;}

.btn3 {border-color: #bbb; background: #ddd; background: #ddd linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); box-shadow: 0 1px 0 rgba(0, 0, 0, .2), 0 2px 2px -1px rgba(0, 0, 0, .4), 0 1px 0 rgba(255, 255, 255, .2) inset; color: #787a84; text-shadow: 0 1px 0 rgba(255,255,255, .9);}

.btn:hover,
.btn:focus {border-color: #3872dc; background: #3872dc;}
.btn2:hover,
.btn2:focus {border-color: #3872dc; color: #3872dc;}
.btn3:hover,
.btn3:focus {border-color: #3872dc; background-color: #fff; color: #3872dc;}



/* Basic Style */

.title-l {margin: 1.6em 0 0.8em; line-height: 1.1; font-size: 2.5em; font-weight: 300; color: #1c2238; text-indent: -3px;}
.title-l:after {content: ""; display: block; width: 30px; height: 2px; margin-top: 0.8em; background: #1c2238;}
.title-m {margin: 1.25em 0 0.65em; line-height: 1.1; font-size: 2em; font-weight: 300; color: #1c2238; text-indent: -2px;}
.title-s {margin: 1.25em 0 0.65em; padding-left: 10px; background: url(../images/common/objBullet1.png) no-repeat 0 50%; line-height: 1.2; font-size: 1.5em; font-weight: 500; color: #3262b9;}

.title-l:first-child,
.title-m:first-child,
.title-s:first-child {margin-top: 0;}

section.basic {margin: 1.88em 0 1.25em;}
section.basic:first-child {margin-top: 0;}
section.basic.float > * {width: 468px;}

section.basic h1.title {padding-left: 10px; background: url(../images/common/objBullet1.png) no-repeat 0 50%; line-height: 1.2; font-size: 1.5em; font-weight: 500; color: #3262b9;}
section.basic h1.title + * {margin-top: 1em;}

p.basic,
ul.basic {margin: 1em 0;}
p.basic:first-child,
ul.basic:first-child {margin-top: 0;}
p.basic em,
ul.basic em {color: #da785e;}

p.basic.large {font-size: 1.25em;}
p.basic.thick {font-weight: 400; color: #1c2238;}

p.basic.left {text-align: left;}
p.basic.center {text-align: center;}
p.basic.right {text-align: right;}

ul.basic li {margin: 0.5em 0; padding-left: 12px; background: url(../images/common/objBullet3.png) no-repeat 0 0.9em;}
ul.basic li.thick {font-weight: 400; color: #1c2238;}
ul.basic li.large {font-size: 1.25em;}

table.only-pc {display: table;}
table.only-mobile {display: none;}

table.basic {margin: 1.25em 0; border-bottom: solid 1px #c7cdd7; border-right: solid 1px #c7cdd7;}
table.basic:first-child {margin-top: 0;}
table.basic:last-child {margin-bottom: 0;}

table.basic th,
table.basic td {height: 37px; padding: 3px 20px; border-top: solid 1px #c7cdd7; border-left: solid 1px #c7cdd7;}
table.basic th {background: #e8ebf0; font-weight: 400; color: #1c2238;}

table.basic.left,
table.basic th.left,
table.basic td.left {text-align: left;}
table.basic.center,
table.basic th.center,
table.basic td.center {text-align: center;}
table.basic.right,
table.basic th.right,
table.basic td.right {text-align: right;}

table.basic th.tight,
table.basic td.tight {padding: 0;}
table.basic th.loose,
table.basic td.loose {padding: 20px 40px;}

table.basic input.basic,
table.basic select.basic,
table.basic textarea.basic {line-height: 19px; font-weight: 300;}
table.basic input.basic,
table.basic select.basic {height: 37px;}

table.basic.alt {border: 0; border-top: solid 1px #1c2238; border-bottom: solid 1px #1c2238;}
table.basic.alt th,
table.basic.alt td {border: 0; border-bottom: solid 1px #c7cdd7;}
table.basic.alt th {background: #5b5d66; color: #fff;}
table.basic.alt tr:last-child th,
table.basic.alt tr:last-child td {border-bottom: 0;}



/* Markup Package I : Search, Tip, etc. */

.func-top {margin-bottom: 1.6em; padding-bottom: 1.6em; border-bottom: solid 1px #e1e4e6;}

.box-tip {position: relative; padding: 15px 15px 10px; padding-left: 136px; border: solid 1px #c7cdd7; background: #f6f7f9;}
.box-tip-label {position: absolute; top: 10px; left: 26px; font-size: 1.43em; color: #1c2238;}

.box-tip-list {font-size: 0.9em;}
.box-tip-list li {margin-top: 4px; padding-left: 12px; background: url(../images/common/objBullet3.png) no-repeat 0 50%; color: #5d6172;}
.box-tip-list li:first-child {margin-top: 0 !important;}
.box-tip-list li em {font-weight: 500;}

.box-tip-button {margin: 10px 0 0 12px;}
.box-tip-button > * {margin-bottom: 10px;}

.box-search {position: relative; padding: 10px 18px 25px; border: solid 1px #c7cdd7; background: #e8ebf0;}
.box-search:after {content: ""; display: block; clear: both;}
.box-tip + .box-search,
.box-search + .box-search {border-top: 0;}

.box-search-label {display: block; margin-bottom: 0.45em; font-size: 1.5em; color: #1c2238;}

.box-search-line {float: left; white-space: nowrap; line-height: 0; font-size: 0;}
.box-search-line .hyphen {display: inline-block; width: 7px; height: 1px; margin-left: 10px; background: url(../images/common/objHyphen.png) no-repeat;}

.box-search-line select {width: 131px; margin-left: 10px;}
.box-search-line select:first-child {margin-left: 0;}
.box-search-line input[type="text"],
.box-search-line input[type="search"],
.box-search-line input.basic.search {width: 131px; margin-left: 10px;}
.box-search-line input[type="text"]:first-child,
.box-search-line input[type="search"]:first-child,
.box-search-line input.basic.search:first-child {margin-left: 0;}

.box-search-line.i2 {margin-left: 14px; padding-left: 14px; border-left: solid 1px #bfc3cb;}
.box-search-line.i2 select {width: 100px;}

.box-search input[type="button"] {bottom: 25px; right: 17px; width: 67px; height: 38px; border: 0; background: #676b7a; font-size: 16px; font-weight: 300; color: #fff; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
.box-search input[type="button"]:hover,
.box-search input[type="button"]:focus {background: #3872dc;}

.box-search.tiny {width: 30%; margin: 1.6em auto 0; padding: 15px 30px; padding-right: 105px; border-top: solid 1px #c7cdd7;}
.box-search.tiny .box-search-label {display: none;}
.box-search.tiny .box-search-line {float: none;}
.box-search.tiny input[type="text"],
.box-search.tiny input[type="search"] {box-sizing: border-box; width: 100%; margin: 0;}
.box-search.tiny input[type="button"] {bottom: 15px; right: 30px;}

.map-legend li {margin-top: 10px;}
.map-legend li:first-child {margin-top: 0;}
.map-legend li .mark {width: 27px; height: 19px; margin-right: 10px; border: solid 3px #1c2238; border-radius: 3px; line-height: 0; font-size: 0;}
.map-legend li .text {line-height: 1.2;}



/* Keyword Search : Predict */

.pack-search {position: relative;}

.pack-search ul.predict {display: none; box-sizing: border-box; position: absolute; top: 42px; left: 0; width: 100%; border: solid 1px #c2c4c9; border-top: 0; background: #fff; z-index: 10; line-height: 1; font-size: 13px;}
.pack-search ul.predict li {border-top: solid 1px #f2f2f2;}
.pack-search ul.predict li:first-child {border-top: 0;}
.pack-search ul.predict li a {display: block; padding: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: background 0.2s; -moz-transition: background 0.2s; -o-transition: background 0.2s; transition: background 0.2s;}
.pack-search ul.predict li a:hover {background: #f2f2f2;}
.pack-search ul.predict li a em {font-weight: 400; color: #c2001f;}

.pack-search.on ul.predict {display: block;}


/* Map Service [OLD] */

#container.map {position: relative; overflow: hidden;}

#container.map .area-map {width: 100%; height: 100%;}

#container.map .area-map .marker {width: 48px; height: 48px; border: 0; background: url(../images/map/icnMarker.png) no-repeat 50%;}

#container.map .area-info {height: 100%; z-index: 10;}
#container.map .area-info:after {content: ""; display: block; clear: both;}

#container.map .area-info,
#container.map .area-info .outer,
#container.map .area-info .inner {height: inherit;}
#container.map .area-info {position: absolute; top: 0; left: 0; padding-right: 13px; font-size: 13px; color: #333;}
#container.map .area-info .outer {width: 0; border-right: solid 1px #1c2238; overflow: hidden;}
#container.map .area-info .inner {position: relative; width: 430px; background: #fff;}

#container.map .area-info a.show {box-sizing: border-box; position: absolute; top: 50%; right: 0; width: 14px; height: 65px; padding: 29px 0; border: solid 1px #444; border-left: 0; border-radius: 0 3px 3px 0; background: #fff;}
#container.map .area-info a.show:before {content: ""; display: block; width: 4px; height: 7px; margin: 0 auto; background: #fff url(../images/map/icnInfoShow.png) no-repeat 100% 0;}

#container.map .area-info.on .outer {width: 430px;}
#container.map .area-info.on a.show:before {background-position: 0 0;}

#container.map .area-info .info-nav {display: none; position: absolute; top: 0; left: 0; width: 70px; height: 100%; background: #252525; text-align: center; line-height: 1.2; font-size: 13px; color: #fff;}
#container.map .area-info .info-nav li {display: block; border-bottom: solid 1px #353535;}
#container.map .area-info .info-nav li a {display: table; width: 100%; height: 70px; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
#container.map .area-info .info-nav li a span {display: table-cell;}
#container.map .area-info .info-nav li a:hover,
#container.map .area-info .info-nav li.on a {background: #3872dc;}
#container.map .area-info .info-nav li.only-pc {display: block;}
#container.map .area-info .info-nav li.only-mobile {display: none;}

#container.map .area-info .info-body {box-sizing: border-box; position: absolute; top: 0; left: 0; width: 430px; height: 100%; padding: 10px 15px; background: #fff; background: rgba(255, 255, 255, 0.8); color: #000; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
#container.map .area-info .info-body:hover {background: #fff;}

#container.map .area-info .info-search-tab {border-bottom: solid 1px #c2001f; line-height: 1.2; font-size: 13px;}
#container.map .area-info .info-search-tab:after {content: ""; display: block; clear: both;}
#container.map .area-info .info-search-tab li {float: left;}
#container.map .area-info .info-search-tab li a {display: block; padding: 7px 15px; -webkit-transition: background 0.3s, color 0.3s; -moz-transition: background 0.3s, color 0.3s; -o-transition: background 0.3s, color 0.3s; transition: background 0.3s, color 0.3s;}
#container.map .area-info .info-search-tab li a:hover,
#container.map .area-info .info-search-tab li.on a {background: #c2001f; color: #fff;}

#container.map .area-info .info-search-input {display: none; position: relative; min-height: 65px; padding: 15px; padding-right: 85px; border: solid 1px #e8e8e8; border-top: 0; background: #fff; box-shadow: 2px 2px 2px #999; line-height: 0; font-size: 0;}
#container.map .area-info .info-search-input.on {display: block;}

#container.map .area-info .info-search-input .bot {margin-top: 5px;}
#container.map .area-info .info-search-input .text {vertical-align: middle; line-height: 1.2; font-size: 13px;}

#container.map .area-info .info-search-input input.basic,
#container.map .area-info .info-search-input select.basic {width: 30%; height: 30px; padding-top: 6px; padding-bottom: 6px; line-height: 16px; font-size: 13px; font-weight: 300; -webkit-transition: border-color 0.3s; -moz-transition: border-color 0.3s; -o-transition: border-color 0.3s; transition: border-color 0.3s;}
#container.map .area-info .info-search-input input.basic:hover,
#container.map .area-info .info-search-input select.basic:hover,
#container.map .area-info .info-search-input input.basic:focus,
#container.map .area-info .info-search-input select.basic:focus {border-color: #3872dc;}
#container.map .area-info .info-search-input input[type="submit"] {position: absolute; top: 15px; right: 15px; width: 65px; height: 65px; border: 0; background: #308027; font-size: 14px; font-weight: 300; color: #fff; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
#container.map .area-info .info-search-input input[type="submit"]:hover {background: #3872dc;}

#container.map .area-info .info-search-input.type-keyword {height: 40px;}
#container.map .area-info .info-search-input.type-keyword .pack-search ul.predict {top: 40px;}

#container.map .area-info .info-search-input.type-keyword input.basic {width: 100%; height: 40px; padding-top: 8px; padding-bottom: 8px; line-height: 22px; font-size: 14px;}
#container.map .area-info .info-search-input.type-keyword .text {margin-top: 5px;}
#container.map .area-info .info-search-input.type-keyword input[type="submit"] {height: 40px;}

#container.map .area-info .info-search-input.type-lot .top select.basic {width: 146px; margin-left: 5px;}
#container.map .area-info .info-search-input.type-lot .top select.basic:first-child {width: 147px; margin-left: 0;}

#container.map .area-info .info-search-input.type-lot .bot input.basic {width: 90px;}
#container.map .area-info .info-search-input.type-lot .bot .text.hyphen {margin: 0 5px; font-size: 15px;}
#container.map .area-info .info-search-input.type-lot .bot label {display: inline-block; margin-left: 15px;}

#container.map .area-info .info-search-input.type-street .top select.basic {width: 146px; margin-left: 5px;}
#container.map .area-info .info-search-input.type-street .top select.basic:first-child {width: 147px; margin-left: 0;}

#container.map .area-info .info-search-input.type-street .bot select.basic {width: 70px; margin-left: 5px;}
#container.map .area-info .info-search-input.type-street .bot select.basic:first-child {width: 147px; margin-left: 0;}
#container.map .area-info .info-search-input.type-street .bot select.basic:last-child {width: 71px;}

#container.map .area-info .info-tab {margin: 15px 0; border-bottom: solid 1px #3872dc; text-align: center; font-size: 14px;}
#container.map .area-info .info-tab:after {content: ""; display: block; clear: both;}
#container.map .area-info .info-tab > li {float: left; display: table; width: 133px}
#container.map .area-info .info-tab > li:first-child,
#container.map .area-info .info-tab > li:first-child + li + li + li {width: 134px;}
#container.map .area-info .info-tab > li > a {display: table-cell; height: 40px; border: solid 1px #c7cdd7; border-bottom: 0; border-right: 0; background: #fff; line-height: 1.2; -webkit-transition: border 0.3s, background 0.3s, color 0.3s; -moz-transition: border 0.3s, background 0.3s, color 0.3s; -o-transition: border 0.3s, background 0.3s, color 0.3s; transition: border 0.3s, background 0.3s, color 0.3s;}
#container.map .area-info .info-tab > li:first-child + li + li > a,
#container.map .area-info .info-tab > li:last-child > a {border-right: solid 1px #c7cdd7;}
#container.map .area-info .info-tab > li:hover > a,
#container.map .area-info .info-tab > li.on > a {border-color: #3872dc; background: #3872dc; color: #fff;}
#container.map .area-info .info-tab > li:hover + li > a,
#container.map .area-info .info-tab > li.on + li > a {border-left-color: #3872dc;}
#container.map .area-info .info-tab + .info-list {padding-top: 0;}

#container.map .area-info .info-list {padding: 15px 0 30px; font-size: 14px;}
#container.map .area-info .info-list .btn.more {box-sizing: border-box; width: 100%; margin-bottom: 0; text-align: center; font-size: 14px;}

#container.map .area-info .info-list-head:after {content: ""; display: block; clear: both;}
#container.map .area-info .info-list-head .count {float: left; padding-top: 9px;}
#container.map .area-info .info-list-head .count em {font-weight: 500; color: #da785e;}
#container.map .area-info .info-list-head .option {float: right;}
#container.map .area-info .info-list-head .option select {width: 100px; height: 30px; padding-top: 6px; padding-bottom: 6px; line-height: 16px; font-size: 13px; font-weight: 300;}

#container.map .area-info .info-list-body {margin: 10px 0 15px; border-top: solid 1px #c7cdd7; background: rgba(255, 255, 255, 0.5);}
#container.map .area-info .info-list-body > li {position: relative; border-bottom: solid 1px #c7cdd7;}
#container.map .area-info .info-list-body > li > a {display: block; padding: 10px 15px; padding-right: 100px; -webkit-transition: background 0.3s, color 0.3s; -moz-transition: background 0.3s, color 0.3s; -o-transition: background 0.3s, color 0.3s; transition: background 0.3s, color 0.3s;}
#container.map .area-info .info-list-body > li > a:hover {background: #e8ebf0; color: #000;}

#container.map .area-info .info-list-body .data-pack {position: relative; margin-top: 2px; padding-left: 50px;}
#container.map .area-info .info-list-body .data-pack:first-child {margin-top: 0;}
#container.map .area-info .info-list-body .data-pack .label {position: absolute; top: 0; left: 0; color: #da785e;}
#container.map .area-info .info-list-body .data-pack .data {display: block;}

#container.map .area-info .info-list-body .data-button {position: absolute; top: 10px; right: 15px;}
#container.map .area-info .info-list-body .data-button a {display: block; margin: 0; margin-top: 4px; padding: 5px 10px; font-size: 13px;}
#container.map .area-info .info-list-body .data-button a:first-child {margin-top: 0;}

#container.map .area-info .info-cont {font-size: 13px;}
#container.map .area-info .info-cont table.basic th,
#container.map .area-info .info-cont table.basic td {padding-left: 10px; padding-right: 10px; background: #fff;}
#container.map .area-info .info-cont table.basic th.tight,
#container.map .area-info .info-cont table.basic td.tight {padding: 0;}

#container.map .area-func {box-sizing: border-box; position: absolute; top: 0; right: 0; width: calc(100% - 430px); height: 30px; padding: 0 15px; border-left: solid 1px #bbb; border-bottom: solid 1px #bbb; background: #ddd; background: #ddd linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); box-shadow: 0 1px 0 rgba(0, 0, 0, .2), 0 2px 2px -1px rgba(0, 0, 0, .4), 0 1px 0 rgba(255, 255, 255, .2) inset; z-index: 10; line-height: 0; font-size: 0; color: #787a84;}
#container.map .area-func:after {content: ""; display: block; clear: both;}

#container.map .area-func .func-current {float: left;}
#container.map .area-func .func-current > a {display: block; padding-right: 25px; background: url(../images/common/objSelect.png) no-repeat 100% 50%; line-height: 30px; font-size: 13px; color: #000; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);}

#container.map .area-func .func-switch {float: right;}
#container.map .area-func .func-switch:after {content: ""; display: block; clear: both;}

#container.map .area-func .func-switch li {float: left; margin-left: 10px;}
#container.map .area-func .func-switch li:first-child {margin-left: 0;}
#container.map .area-func .func-switch li a {line-height: 30px; font-size: 13px; font-weight: 700; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);}
#container.map .area-func .func-switch li a:hover,
#container.map .area-func .func-switch li.on a {color: #3872dc;}

#container.map .area-func .func-layer {position: absolute; top: 45px; right: 15px; width: 145px; border-radius: 4px; background: #fff; background: rgba(255, 255, 255, 0.8); overflow: hidden; z-index: 10; line-height: 1; font-size: 13px; color: #000; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
#container.map .area-func .func-layer:hover {background: #fff;}

#container.map .area-func .func-layer .label {padding: 8px 12px; background: #3872dc; color: #fff;}

#container.map .area-func .func-layer .list {padding: 6px 12px;}
#container.map .area-func .func-layer .list li a {display: block; padding: 6px 0; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; -o-transition: color 0.3s; transition: color 0.3s;}
#container.map .area-func .func-layer .list li a:hover {color: #3872dc;}
#container.map .area-func .func-layer .list li.on a {background: url(../images/map/icnCheck.png) no-repeat 100% 50%;}

#container.map .area-func .func-etc {position: absolute; top: 45px; right: 15px; width: 30px; height: 320px; background: url(../images/temp/icnMapFunc.png) no-repeat;}

#container.map .area-func .func-layer.etc {top: 250px;}
#container.map .area-func .func-layer.etc .list {padding: 6px 10px; text-align: center;}
#container.map .area-func .func-layer.etc .list:after {content: ""; display: block; clear: both;}
#container.map .area-func .func-layer.etc .list li {float: left; width: 25px; padding: 0;}



/* Markup Package II : Search Form (2018-08-07) */

.box-search2 {position: relative; margin-top: 15px; padding: 5px 0 15px 25px; border: solid 1px #c7cdd7; background: #e8ebf0; line-height: 0; font-size: 0;}
.box-search2:first-child {margin-top: 0;}
.box-search2:after {content: ""; display: block; clear: both;}

.box-search2-option {float: left; position: relative; padding: 10px 25px 0 85px;}
.box-search2-option dt {position: absolute; top: 10px; left: 0; white-space: nowrap; line-height: 38px; font-size: 16px; font-weight: 500; color: #676b7a;}
.box-search2-option dd {min-height: 38px;}

.box-search2-option dd.float > div {margin-right: 5px;}

.box-search2-option dd.only-pc {display: block;}
.box-search2-option dd.only-mobile {display: none;}

.box-search2-option input.basic,
.box-search2-option select.basic {width: 120px; margin-left: 5px;}
.box-search2-option input.basic:first-child,
.box-search2-option select.basic:first-child {margin-left: 0;}
.box-search2-option input.basic.short,
.box-search2-option select.basic.short {width: 60px;}
.box-search2-option input.basic.long,
.box-search2-option select.basic.long {width: 180px;}
.box-search2-option input.basic.xlong,
.box-search2-option select.basic.xlong {width: 300px;}

.box-search2-option span.text {margin: 0 5px; line-height: 1.2; font-size: 15px;}
.box-search2-option span.text.label {margin: 0 10px; font-weight: 400; color: #1c2238;}

.box-search2-option span.check {margin-left: 15px;}
.box-search2-option span.check:first-child {margin-left: 0;}
.box-search2-option span.check label {margin-left: 5px; line-height: 38px; font-size: 16px; color: #1c2238; letter-spacing: -1px;}
.box-search2-option span.check label:first-child {margin-left: 0;}

.box-search2-button {float: right; padding: 10px 25px 0 0;}
.box-search2-button input[type="button"] {width: 67px; height: 38px; margin-left: 5px; border: 0; background: #676b7a; font-size: 15px; font-weight: 300; color: #fff; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
.box-search2-button input[type="button"]:first-child {margin-left: 0;}
.box-search2-button input[type="button"]:hover,
.box-search2-button input[type="button"].on {background: #3872dc;}
.box-search2-button input[type="button"].long {width: 100px;}
.box-search2-button input[type="button"].xlong {width: 134px;}



/* Markup Package II : Additional Icon (2018-08-07) */

.i-inf,
.i-hlp {min-height: 36px; padding-left: 42px; white-space: nowrap; font-size: 1.2em; font-weight: 500; color: #3872dc;}
.i-inf {background: url(../images/common/iInf.png) no-repeat 0 50%;}
.i-hlp {background: url(../images/common/iHlp.png) no-repeat 0 50%;}

.i-sqr,
.i-dot {white-space: nowrap; font-size: 1em; font-weight: 500;}
.i-sqr {min-height: 24px; padding-left: 34px; background: url(../images/common/iSqr.png) no-repeat 0 50%; color: #da785e;}
.i-dot {min-height: 6px; padding-left: 16px; background: url(../images/common/iDot.png) no-repeat 0 50%; color: #5b5d66;}

i.i-inf,
i.i-hlp,
i.i-sqr,
i.i-dot {display: inline-block; margin-right: 10px; padding-left: 0 !important; vertical-align: middle; line-height: 0 !important; font-size: 0 !important;}

i.i-inf {width: 32px;}
i.i-hlp {width: 32px;}
i.i-sqr {width: 24px;}
i.i-dot {width: 6px;}


/* Map Service : Type A */

.map-alone {position: relative;}

.map-alone .header {position: relative; padding: 11px 18px; border-bottom: solid 1px #1c2238; background: #fff; z-index: 10;}
.map-alone .header:after {content: ""; display: block; clear: both;}

.map-alone .header > .left {float: left;}
.map-alone .header > .right {float: right;}
.map-alone .header > .left:after,
.map-alone .header > .right:after {content: ""; display: block; clear: both;}
.map-alone .header > .left > *,
.map-alone .header > .right > * {float: left;}

.map-alone .header .logo > span {margin-left: 5px; line-height: 38px; font-size: 15px; font-weight: 500; color: #1c2238; -webkit-transition: color 0.2s; -moz-transition: color 0.2s; -o-transition: color 0.2s; transition: color 0.2s;}
.map-alone .header .logo:hover > span {color: #3872dc;}

.map-alone .header .search {margin-left: 15px;}
.map-alone .header .search:first-child {margin-left: 0;}

.map-alone .header .search .pack-search:after {content: ""; display: block; clear: both;}
.map-alone .header .search .pack-search ul.predict {top: 38px; width: 300px;}

.map-alone .header .search .pack-search input.basic {float: left; width: 250px; border-right: 0;}
.map-alone .header .search .pack-search input.submit {width: 50px; height: 38px; border: solid 1px #c2c4c9; background: url(../images/map/icnSearch2.png) no-repeat 50%; line-height: 0; font-size: 0; -webkit-transition: border 0.2s, background 0.2s; -moz-transition: border 0.2s, background 0.2s; -o-transition: border 0.2s, background 0.2s; transition: border 0.2s, background 0.2s;}
.map-alone .header .search .pack-search input.basic:focus + input.submit,
.map-alone .header .search .pack-search input.submit:hover {border-color: #4e89f0; background-image: url(../images/map/icnSearch2On.png);}

.map-alone .header .fullscreen {width: 24px; height: 24px; margin: 7px 0 7px 15px; background: url(../images/map/icnFullscreen.png) no-repeat -12px -12px;}
.map-alone .header .fullscreen:first-child {margin-left: 0;}
.map-alone .header .fullscreen:hover {background-position: -48px -12px;}

.map-alone .header .fullscreen.off {background-position: -12px -48px;}
.map-alone .header .fullscreen.off:hover {background-position: -48px -48px;}

.map-alone .container {position: relative;}

.map-alone .container .area-map {height: inherit;}

.map-alone .container .area-info,
.map-alone .container .area-info .outer,
.map-alone .container .area-info .inner {height: inherit;}
.map-alone .container .area-info {position: absolute; top: 0; left: 0; padding-right: 13px; font-size: 13px; color: #333;}
.map-alone .container .area-info .outer {width: 0; border-right: solid 1px #1c2238; overflow: hidden;}
.map-alone .container .area-info .inner {width: 420px; background: #fff; overflow-y: scroll;}

.map-alone .container .area-info a.show {box-sizing: border-box; position: absolute; top: 50%; right: 0; width: 14px; height: 65px; padding: 29px 0; border: solid 1px #444; border-left: 0; border-radius: 0 3px 3px 0; background: #fff;}
.map-alone .container .area-info a.show:before {content: ""; display: block; width: 4px; height: 7px; margin: 0 auto; background: #fff url(../images/map/icnInfoShow.png) no-repeat 100% 0;}

.map-alone .container .area-info.on .outer {width: 420px;}
.map-alone .container .area-info.on a.show:before {background-position: 0 0;}

.map-alone .container .area-info .info-nav {border-bottom: solid 1px #1c2238; background: url(../images/map/bgInfoNav.png) repeat-x; white-space: nowrap; line-height: 0; font-size: 0;}
.map-alone .container .area-info .info-nav li {display: inline-block;}
.map-alone .container .area-info .info-nav li a {display: block; text-align: center; line-height: 32px; font-size: 13px; font-weight: 400; color: #fff; -webkit-transition: background 0.2s; -moz-transition: background 0.2s; -o-transition: background 0.2s; transition: background 0.2s;}
.map-alone .container .area-info .info-nav li a:hover,
.map-alone .container .area-info .info-nav li.on a {background: #3872dc;}

.map-alone .container .area-info .info-nav li.i1,
.map-alone .container .area-info .info-nav li.i2,
.map-alone .container .area-info .info-nav li.i3 {width: 66px;}
.map-alone .container .area-info .info-nav li.i4,
.map-alone .container .area-info .info-nav li.i5 {width: 102px;}

.map-alone .container .area-info .info-list {padding-bottom: 20px;}

.map-alone .container .area-info .info-list-tab {height: 28px; padding: 6px 10px 0; border-bottom: solid 1px #c6c4d1; background: #f0f0f7; font-size: 13px;}
.map-alone .container .area-info .info-list-tab:after {content: ""; display: block; clear: both;}
.map-alone .container .area-info .info-list-tab li {float: left; box-sizing: border-box;}
.map-alone .container .area-info .info-list-tab li a {display: block; padding: 7px 15px; line-height: 1; color: #444; -webkit-transition: color 0.2s; -moz-transition: color 0.2s; -o-transition: color 0.2s; transition: color 0.2s;}
.map-alone .container .area-info .info-list-tab li a:hover {color: #3872dc;}

.map-alone .container .area-info .info-list-tab li.on {border: solid 1px #c6c4d1; border-bottom-color: #fff; background: #fff;}
.map-alone .container .area-info .info-list-tab li.on a {font-weight: 500; color: #000;}

.map-alone .container .area-info .info-list-keyword {padding: 10px 15px;}
.map-alone .container .area-info .info-list-keyword em {font-weight: 500; color: #c2001f;}

.map-alone .container .area-info .info-list-head {padding: 9px 15px; border-top: solid 1px #d2d2d2; background: #f8f8fc; line-height: 0; font-size: 0;}
.map-alone .container .area-info .info-list-head > * {line-height: 1;}
.map-alone .container .area-info .info-list-head .type {font-size: 15px; font-weight: 500;}
.map-alone .container .area-info .info-list-head .count {margin-left: 5px; font-size: 12px; color: #666;}
.map-alone .container .area-info .info-list-head .count em {font-weight: 700; color: #3872dc;}

.map-alone .container .area-info .info-list-body {border-top: solid 1px #f0f0f5;}
.map-alone .container .area-info .info-list-body > li {position: relative; border-bottom: solid 1px #f0f0f5;}
.map-alone .container .area-info .info-list-body > li > a {display: block; padding: 10px 15px; padding-right: 100px;}

.map-alone .container .area-info .info-list-body .data-pack {position: relative; margin-top: 2px; padding-left: 50px;}
.map-alone .container .area-info .info-list-body .data-pack:first-child {margin-top: 0;}
.map-alone .container .area-info .info-list-body .data-pack .label {position: absolute; top: 0; left: 0; color: #da785e;}
.map-alone .container .area-info .info-list-body .data-pack .label,
.map-alone .container .area-info .info-list-body .data-pack .data {display: block;}
.map-alone .container .area-info .info-list-body .data-pack .data em {font-weight: 500; color: #c2001f;}

.map-alone .container .area-info .info-list-body .data-button {position: absolute; top: 10px; right: 15px;}
.map-alone .container .area-info .info-list-body .data-button a {display: block; margin: 0; margin-top: 3px; padding: 4px 10px; font-size: 13px;}
.map-alone .container .area-info .info-list-body .data-button a:first-child {margin-top: 0;}

.map-alone .container .area-info .info-list-foot {padding: 10px 15px; text-align: right;}
.map-alone .container .area-info .info-list-foot a {vertical-align: top; color: #3872dc;}

.map-alone .area-func {box-sizing: border-box;position: absolute;top: 0;right: 0;width: calc(100% - 420px);height: 33px;padding: 0 15px;border-left: solid 1px #bbb;border-bottom: solid 1px #bbb;background: #fff;z-index: 1;line-height: 0;font-size: 0;color: #787a84;}
.map-alone .area-func:after {content: ""; display: block; clear: both;}

.map-alone .area-func .func-current {float: left;padding-left: 22px;background: url(../images/map/icnLoca.png) no-repeat 0 8px;}
.map-alone .area-func .func-current > a {position:relative;padding-right: 17px;line-height: 31px;font-size: 13px;color: #333;text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);}
.map-alone .area-func .func-current > a:after {content: ""; display: block; position: absolute; top: 12px; right: 5px; width: 5px; height: 9px; background: url(../images/common/objDivLoca.png) no-repeat 50%;}
.map-alone .area-func .func-current > a:last-child:after {background: none;}

.map-alone .area-func .func-switch {float: right;}
.map-alone .area-func .func-switch:after {content: ""; display: block; clear: both;}

.map-alone .area-func .func-switch li {float: left; margin-left: 10px;}
.map-alone .area-func .func-switch li:first-child {margin-left: 0;}
.map-alone .area-func .func-switch li a {line-height: 30px; font-size: 13px; font-weight: 700; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);}
.map-alone .area-func .func-switch li a:hover,
.map-alone .area-func .func-switch li.on a {color: #3872dc;}

.map-alone .area-func .func-layer {position: absolute; top: 45px; right: 15px; width: 145px; border-radius: 4px; background: #fff; background: rgba(255, 255, 255, 0.8); overflow: hidden; z-index: 10; line-height: 1; font-size: 13px; color: #000; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -o-transition: background 0.3s; transition: background 0.3s;}
.map-alone .area-func .func-layer:hover {background: #fff;}

.map-alone .area-func .func-layer .label {padding: 8px 12px; background: #3872dc; color: #fff;}

.map-alone .area-func .func-layer .list {padding: 6px 12px;}
.map-alone .area-func .func-layer .list li a {display: block; padding: 6px 0; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; -o-transition: color 0.3s; transition: color 0.3s;}
.map-alone .area-func .func-layer .list li a:hover {color: #3872dc;}
.map-alone .area-func .func-layer .list li.on a {background: url(../images/map/icnCheck.png) no-repeat 100% 50%;}

.map-alone .area-func .func-layer.etc {top: 250px;}
.map-alone .area-func .func-layer.etc .list {padding: 6px 10px; text-align: center;}
.map-alone .area-func .func-layer.etc .list:after {content: ""; display: block; clear: both;}
.map-alone .area-func .func-layer.etc .list li {float: left; width: 25px; padding: 0;}

.map-alone.fullscreen .header {height: 0; padding: 0; border: 0;}
.map-alone.fullscreen .header .left > *,
.map-alone.fullscreen .header .right > * {display: none;}

.map-alone.fullscreen .header a.fullscreen {display: block; position: absolute; top: 6px; right: 6px; padding: 12px; margin: 0; background-color: #000; background-color: rgba(0, 0, 0, 0.5); background-position: -72px 0;}
.map-alone.fullscreen .header a.fullscreen.off {background-position: -72px -36px;}

.map-alone.fullscreen .container .area-info,
.map-alone.fullscreen .container .area-func {display: none;}


/* 2018-09-20 */

#container.map .func-popup {position: absolute; top: 60px; left: 30px; border: solid 4px #72a6de; border-radius: 3px; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);}

#container.map .func-popup-head {position: relative; height: 22px; padding-bottom: 4px; background: #72a6de;}
#container.map .func-popup-head .label {padding: 0 4px; line-height: 22px; font-size: 13px; font-weight: 500; color: #fff;}

#container.map .func-popup-head .close {position: absolute; top: 1px; right: 4px;}
#container.map .func-popup-head .close button {width: 20px; height: 20px; margin-left: 2px; border: solid 1px #999; border-radius: 3px; background: #fff; background-repeat: no-repeat; background-position: 50%; outline: 0; line-height: 0; font-size: 0;}
#container.map .func-popup-head .close button:first-child {margin-left: 0;}
#container.map .func-popup-head .close button.minify {background-image: url(../images/map/icnPopupMinify.png);}
#container.map .func-popup-head .close button.remove {background-image: url(../images/map/icnPopupRemove.png);}

#container.map .func-popup-body {padding: 10px; line-height: 1.5; font-size: 12px; color: #000; overflow: auto;}

#container.map .func-popup table.basic {margin: 5px 0;}
#container.map .func-popup table.basic th,
#container.map .func-popup table.basic td {height: auto; padding: 5px 10px;}
#container.map .func-popup table.basic th.tight,
#container.map .func-popup table.basic td.tight {padding: 0;}

#container.map .popup-search {position: relative; margin-bottom: 15px; padding: 12px; border: solid 2px #72a6de; border-radius: 3px;}
#container.map .popup-search-button {position: absolute; bottom: 8px; right: 10px; font-size: 15px;}

#container.map .popup-search span.check {margin-left: 10px;}
#container.map .popup-search span.check:first-child {margin-left: 0;}
#container.map .popup-search span.check input {margin-bottom: -2px;}

#container.map .popup-search input.basic,
#container.map .popup-search select.basic {height: 30px; padding: 5px 10px; line-height: 18px; font-size: 13px;}


/* Map Service Mobile (2018-10-04) */

#container.map .mobile-ui {height: inherit; font-size: 20px; letter-spacing: -1px;}
#container.map .mobile-ui button {box-sizing: border-box; border: 0; outline: 0; letter-spacing: inherit; cursor: pointer;}

#container.map .mobile-ui .page {display: none; position: absolute; top: 0; left: 0; width: 100%; height: inherit; overflow-y: auto; font-weight: 400; z-index: 20; -webkit-overflow-scrolling: touch;}
#container.map .mobile-ui .page.on {display: block; background: #e9ecef;}

#container.map .mobile-ui .page > .close {display: none; position: absolute; top: 15px; left: 10px; width: 70px; height: 70px; background: url(../images/map_m/btnClose.png) no-repeat 50%;}
#container.map .mobile-ui .page.on > .close {display: block;}

#container.map .mobile-ui .page > .head {min-height: 70px; padding: 15px; padding-left: 90px; border-bottom: solid 2px #3262b9; background: #3262b9;}
#container.map .mobile-ui .page > .head .title {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 65px; font-size: 40px; font-weight: 500; color: #fff; letter-spacing: -3px;}

#container.map .mobile-ui .page .btn-foot {margin: 20px;}

#container.map .mobile-ui .page .btn {box-sizing: border-box; height: 70px; margin: 0 0 0 15px; padding: 0 50px; line-height: 70px; font-size: 24px; color: #fff;}
#container.map .mobile-ui .page .btn:first-child {margin-left: 0;}
#container.map .mobile-ui .page .btn.full {width: 100%; margin: 0;}

#container.map .mobile-ui .page.search > .body {display: none;}

#container.map .mobile-ui .search-form {padding: 15px; background: #fff; background: rgba(255, 255, 255, 0.9); line-height: 0; font-size: 0;}
#container.map .mobile-ui .search-form input.keyword {box-sizing: border-box; width: 100%; height: 70px; padding: 18px 20px; padding-right: 70px; border: solid 2px #c2c2c2; border-radius: 5px; background: #fff; vertical-align: top; line-height: 30px; font-size: 24px; color: #333; letter-spacing: -1px;}
#container.map .mobile-ui .search-form input.submit {position: absolute; top: 15px; right: 15px; width: 70px; height: 70px; border: 0; background: url(../images/map_m/btnSearch.png) no-repeat 50%; z-index: 15;}

#container.map .mobile-ui .search-predict {margin: 0; background: #fff;}
#container.map .mobile-ui .search-predict > li {border-top: solid 1px #e1e4e7;}
#container.map .mobile-ui .search-predict > li:first-child {border-top: 0;}
#container.map .mobile-ui .search-predict > li > a {display: block; padding: 0 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 70px; font-size: 24px; color: #333;}
#container.map .mobile-ui .search-predict > li > a > em {color: #c2001f;}

#container.map .mobile-ui .search-log {margin: 20px;}

#container.map .mobile-ui .search-log-list {background: #fff; line-height: 1.2; font-size: 24px;}
#container.map .mobile-ui .search-log-list > li {position: relative; padding-right: 140px; border-top: solid 1px #e1e4e7;}
#container.map .mobile-ui .search-log-list > li:first-child {border-top: 0;}

#container.map .mobile-ui .search-log-list .keyword {display: block; height: 60px; padding: 0 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 60px; color: #333;}
#container.map .mobile-ui .search-log-list .date {position: absolute; top: 0; right: 70px; line-height: 60px;}
#container.map .mobile-ui .search-log-list .delete {position: absolute; top: 0; right: 0; width: 60px; height: 60px; background: url(../images/map_m/btnCloseS.png) no-repeat 50%;}

#container.map .mobile-ui .search-log-foot {padding: 12px 15px; border-top: solid 1px #e1e4e7; background: #fafbfb; text-align: right;}
#container.map .mobile-ui .search-log-foot button {margin-left: 5px; padding: 6px 15px; border: solid 2px #a4a8ae; border-radius: 5px; background: #fff; line-height: 24px; font-size: 18px; color: #666;}
#container.map .mobile-ui .search-log-foot button:first-child {margin-left: 0;}

#container.map .mobile-ui .search-log-empty {margin: 15px; padding: 120px 0; background: #fff; text-align: center; font-size: 24px; color: #666;}

#container.map .mobile-ui .search-result {box-sizing: border-box; padding: 25px 20px;}

#container.map .mobile-ui .search-result .title {margin-bottom: 15px; line-height: 1.2; font-size: 36px; font-weight: 500; color: #555; letter-spacing: -2px;}
#container.map .mobile-ui .search-result .title em {color: #c2001f;}

#container.map .mobile-ui .search-result .list-top {margin-bottom: 15px; font-size: 22px;}
#container.map .mobile-ui .search-result .list-top:after {content: ""; display: block; clear: both;}

#container.map .mobile-ui .search-result .list-top .count {float: left; line-height: 45px; color: #555;}
#container.map .mobile-ui .search-result .list-top .count em {color: #c2001f;}

#container.map .mobile-ui .search-result .list-top .sort {float: right;}
#container.map .mobile-ui .search-result .list-top .sort:after {content: ""; display: block; clear: both;}
#container.map .mobile-ui .search-result .list-top .sort li {float: left; margin-left: 5px;}
#container.map .mobile-ui .search-result .list-top .sort li:first-child {margin-left: 0;}
#container.map .mobile-ui .search-result .list-top .sort li button {height: 45px; padding: 0 15px; border-radius: 5px; background: #ccc; vertical-align: top; font-size: 22px; font-weight: 500; color: #999;}
#container.map .mobile-ui .search-result .list-top .sort li.on button {background: #3262b9; color: #fff;}

#container.map .mobile-ui .search-result .list > li {margin-top: 10px; padding-top: 20px; border: solid 2px #e1e4e7; background: #fff;}
#container.map .mobile-ui .search-result .list > li:first-child {margin-top: 0;}

#container.map .mobile-ui .search-result .list .data-pack {position: relative; padding: 0 20px; padding-left: 100px; line-height: 1.3; font-size: 22px;}
#container.map .mobile-ui .search-result .list .data-pack + .data-pack {margin-top: 15px;}

#container.map .mobile-ui .search-result .list .data-pack > span {display: block;}
#container.map .mobile-ui .search-result .list .data-pack > span.label {position: absolute; top: 0; left: 20px; font-weight: 500; color: #da785e;}
#container.map .mobile-ui .search-result .list .data-pack > span.data {color: #777;}
#container.map .mobile-ui .search-result .list .data-pack > span.data em {color: #c2001f;}

#container.map .mobile-ui .search-result .list .data-button {margin-top: 20px; border-top: solid 2px #e8e9eb; background: #f7f7f9; line-height: 0; font-size: 0; white-space: nowrap;}
#container.map .mobile-ui .search-result .list .data-button button {box-sizing: border-box; width: 33.33%; height: 60px; border-right: solid 2px #e8e9eb; font-size: 24px; color: #555; letter-spacing: -1.5px;}
#container.map .mobile-ui .search-result .list .data-button button + button + button {border-right: 0;}

#container.map .mobile-ui .search-result .more {width: 100%; height: 60px; margin-top: 15px; border-radius: 5px; background: #99a3b5; font-size: 24px; color: #fff;}

#container.map .mobile-ui .page.search.on .search-form {padding-left: 90px; border-bottom: solid 2px #3262b9; background: #3262b9;}
#container.map .mobile-ui .page.search.on .search-form input.keyword {border-color: #fff;}

#container.map .mobile-ui .page.search.on > .body {display: block;}

#container.map .mobile-ui .func {position: absolute; z-index: 10; line-height: 0; font-size: 0;}
#container.map .mobile-ui .func button {width: 70px; height: 70px; margin-left: 5px; background-color: #fff; border-radius: 10px; background-repeat: no-repeat; background-position: 50%; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);}
#container.map .mobile-ui .func button:first-child {margin-left: 0;}

#container.map .mobile-ui .func-gps {top: 120px; left: 20px;}
#container.map .mobile-ui .func-layer {top: 120px; right: 20px;}
#container.map .mobile-ui .func-zoom {bottom: 20px; right: 20px;}
#container.map .mobile-ui .func-zoom button {width: 50px; height: 50px; border-radius: 5px;}

#container.map .mobile-ui .func button.gps {background-image: url(../images/map_m/btnFuncGps.png);}
#container.map .mobile-ui .func button.layer {background-image: url(../images/map_m/btnFuncLayer.png);}
#container.map .mobile-ui .func button.layer2 {background-image: url(../images/map_m/btnFuncLayer2.png);}
#container.map .mobile-ui .func button.zoom-in {background-image: url(../images/map_m/btnFuncZoomIn.png);}
#container.map .mobile-ui .func button.zoom-out {background-image: url(../images/map_m/btnFuncZoomOut.png);}

#container.map .mobile-ui .layer-list {margin: 0; background: #fff;}
#container.map .mobile-ui .layer-list li {border-top: solid 1px #e1e4e7;}
#container.map .mobile-ui .layer-list li:first-child {border-top: 0;}

#container.map .mobile-ui .layer-list li label {display: block; position: relative; padding: 0 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 70px; font-size: 24px; color: #aaa; cursor: pointer; -webkit-transition: color 0.2s; -moz-transition: color 0.2s; -o-transition: color 0.2s; transition: color 0.2s;}
#container.map .mobile-ui .layer-list li label:after {content: ""; display: block; position: absolute; top: 0; right: 20px; width: 30px; height: 70px; -webkit-transition: background-image 0.2s; -moz-transition: background-image 0.2s; -o-transition: background-image 0.2s; transition: background-image 0.2s;}
#container.map .mobile-ui .layer-list li input[type="checkbox"],
#container.map .mobile-ui .layer-list li input[type="radio"] {display: none;}
#container.map .mobile-ui .layer-list li input[type="checkbox"]:checked + label,
#container.map .mobile-ui .layer-list li input[type="radio"]:checked + label {color: #000;}
#container.map .mobile-ui .layer-list li input[type="checkbox"]:checked + label:after,
#container.map .mobile-ui .layer-list li input[type="radio"]:checked + label:after {background: url(../images/map_m/icnCheck.png) no-repeat 50%;}

#container.map .mobile-ui.has-result .search-result {position: absolute; bottom: 0; left: 0; width: 100%; height: 330px; border-top: solid 2px #3262b9; background: #e9ecef; z-index: 15; overflow-y: auto; -webkit-overflow-scrolling: touch;}
#container.map .mobile-ui.has-result .func-zoom {bottom: 350px;}

	/* 2018-10-04 23:00 */
	
	#container.map .mobile-ui .page.search .search-form {display: none;}
	#container.map .mobile-ui .page.search.on .search-form {display: block;}

	#container.map .mobile-ui .func-gps,
	#container.map .mobile-ui .func-layer {top: 20px;}




/* 2018-10-19 */

#container.map .mobile-ui .func-popup {position: static; padding: 25px 20px; border: 0; box-shadow: none; line-height: 1.3; font-size: 22px; color: #777;}

#container.map .mobile-ui .func-popup table.basic {margin: 25px 0; font-size: 20px;}
#container.map .mobile-ui .func-popup table.basic th,
#container.map .mobile-ui .func-popup table.basic td {height: auto; padding: 15px 20px;}
#container.map .mobile-ui .func-popup table.basic th.tight,
#container.map .mobile-ui .func-popup table.basic td.tight {padding: 0;}

#container.map .mobile-ui .func-popup input[type="checkbox"],
#container.map .mobile-ui .func-popup input[type="radio"] {display: inline-block; width: 24px; height: 24px; margin-right: 3px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
#container.map .mobile-ui .func-popup input[type="checkbox"] {background: url(../images/map_m/icnCheck2.png) no-repeat 0% 50%;}
#container.map .mobile-ui .func-popup input[type="radio"] {background: url(../images/map_m/icnCheck2Radio.png) no-repeat 0% 50%;}
#container.map .mobile-ui .func-popup input[type="checkbox"]:checked,
#container.map .mobile-ui .func-popup input[type="radio"]:checked {background-position: 100% 50%;}

#container.map .mobile-ui .func-popup label input[type="checkbox"],
#container.map .mobile-ui .func-popup label input[type="radio"] {margin-top: -4px;}

#container.map .mobile-ui .func-popup .btn-foot {margin-left: 0; margin-right: 0;}

#container.map .mobile-ui .popup-search {padding: 20px; border-width: 3px;}
#container.map .mobile-ui .popup-search-button {position: static; margin-top: 20px;}
#container.map .mobile-ui .popup-search-button .btn {width: 100%; height: 50px; border: 0; background: #3262b9; line-height: 50px; font-size: 20px;}

#container.map .mobile-ui .popup-search span.check {margin-left: 15px; vertical-align: top; line-height: 1;}
#container.map .mobile-ui .popup-search span.check:first-child {margin-left: 0;}

#container.map .mobile-ui .popup-search input.basic,
#container.map .mobile-ui .popup-search select.basic {height: 50px; padding: 9px 15px; border-width: 2px; line-height: 1.3; font-size: 22px; font-weight: 400;}