@charset "utf-8";
* { user-select: none; touch-action: pan-y;}
html { overflow:hidden; }
#main { opacity:0; visibility: hidden; -webkit-transition: opacity .5s; transition: opacity .5s;}
#main.active { opacity:1; visibility: visible;}
.mapArea * { user-select: none;}
.mapArea { display:block; position:absolute; left:0; top:0; width: 100%; height: 100%;  z-index:7; }
.mapArea { z-index:1; width:100%; height:100%; }
.mapArea #map { display: block; width: 100%; height: 100%; }

.popup_wrap { display: block; position: absolute; left: 50%; bottom: 0; width: 400px; height: 300px; background: white; border: 1px solid #ccc; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-transition: transform .3s; transition: transform .3s; }
.popup_wrap.on { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }

/* map control */
.leftBox { z-index: 10;}

/* autocomplete */
.js-start, .js-end { outline:none; }
.ui-widget.ui-widget-content { position: absolute; left:0; top:calc(100% - 1px); z-index: 9999; margin-top:-1px; padding: 2rem; box-sizing: border-box; background:#fff; border:1px solid #D7CCC2; border-radius: 0 0 0.4167rem 0.4167rem; }
.ui-widget.ui-widget-content li { width: 100%; padding: 0.4167rem; }
.ui-widget.ui-widget-content mark { background-color:#728D68; color:#fff; }
.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;   /* prevent horizontal scrollbar */
    overflow-x: hidden; /* add padding to account for vertical scrollbar */
    z-index:1000 !important;
}
/* 검색 */
.js-search { outline: none; }

.js-clone, .js-cloneProgram {
    position: absolute; left:-99999px;
    top:-99999px;
    overflow:hidden;
}

.parkingPop .topCont,
.toiletPop .topCont {background-image:none !important;}

/* #map { background-image:url('/img/map_back.png') !important;} */

/* tmap */
#map > div > div:nth-child(3) img { cursor:pointer; opacity: 0.9 !important}
#map > div > div:nth-child(3) span { opacity:0; visibility: hidden; }
#map > div > div:nth-child(4) { z-index: 999999 !important; opacity: 0.9; }
#map > div > div { white-space: nowrap;}
.map_distance { position: absolute; top: 12px; z-index:99999; padding: 10px;  background: #fff; border: 1px solid #ccc; white-space: nowrap; font-size: 12px; }
.map_distance .time { display: block; font-size: 20px; color:#2A59B0; }
.map_distance .time { display: block; font-size: 20px; color:#2A59B0; }
.ui-widget.ui-widget-content { z-index: 9999 !important; }


[src*=end_],
[src*=start_] { z-index: 2 !important; pointer-events:none; }


.loaderCircle {
    position: fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    z-index:99;
	background-color: rgba(0,0,0,.6);
}

.loaderCircle::after {
    content: '';
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    position: absolute;
    top: calc(50% - 20px);
    left: calc(50% - 20px);
    border-radius: 50%;
    border-top: 4px solid rgba(255, 255, 255, 1.0);
    border-left: 4px solid rgba(255, 255, 255, 1.0);
    border-right: 4px solid rgba(255, 255, 255, 0.0);
    animation: spinner .6s linear infinite;
}

@keyframes spinner {
    to {transform: rotate(360deg);}
}