html, body {display:block; margin:0; padding:0; touch-action: none;}
.content-wrap {width:100%; height:100vh; margin:0; padding:0; position:relative; z-index:1; overflow-y:auto;}
#run-map-config, #map {width:100%; height:100%;height: calc(var(--vh, 1vh) * 100); z-index:1; margin:0; padding:0;}



.bsAlert {width:80%; height:auto; top:50%; left:50%; transform:translate(-50%, -50%); z-index:9999;}
.history-preview-img {width:100%; height:auto; background-color:rgba(0,0,0,0.5);}

#tabbar {}
#tabbar ul {position:relative; display:flex; justify-content:space-evenly; align-items:center; list-style:none; margin:0; padding:0; height:100%;}
#tabbar ul li {position:relative; width:calc(100% / 3); height:100%; list-style:none; margin:0; padding:0; }
#tabbar ul li a {position:relative; display:block; color:#fff; width:100%; height:100%;}
#tabbar ul li a span {position:absolute; width:auto; height:auto; left:50%; top:50%; transform:translate(-50%, -50%); white-space:nowrap; font-size:0.5em; text-align:center;}
#tabbar ul li.active a span {width:auto; height:80%; aspect-ratio:1/1; background:rgba(255,255,255,0.2); display:flex; flex-direction:column; justify-content:center; align-items:center;}
#tabbar ul li.round a span {position:absolute; width:auto; height:100%; background:#dc3545; aspect-ratio:1/1; border-radius:50rem; left:50%; top:20%; transform:translate(-50%, -50%); white-space:nowrap; font-size:0.5em; outline:7px solid rgba(220,53,69,0.3); display:flex; flex-direction:column; justify-content:center; align-items:center;}
#tabbar ul li.round a span svg {display:block;}
#tabbar ul li.active a span br,
#tabbar ul li.round a span br {display:none;}
#tabbar ul li.round.active a span {animation-name: running; animation-duration: 0.8s; animation-iteration-count: infinite; border:1px solid rgba(255,255,255,0.7)}
#tabbar ul li a span svg {width:20px; height:20px; }
@keyframes running {
  0% {outline: 1px solid rgba(220,53,69,1);}
  100% {outline: 10px solid rgba(220,53,69,0.0);}
}

/* 메인*/
.mainSwiper {margin: 0 auto; width: 100%; height: 100%; overflow:hidden; }
.mainSwiper .swiper-slide {display: flex; align-items: center; justify-content: center;}
.swiper-slide img {width:100%; height:100%; object-fit: cover; }

/* 러닝 페이지 */
#runningInfo {position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); border:1px solid #ccc; border-radius:5px; background:rgba(255,255,255,0.7); width:90%; height:auto; z-index:5000; padding:1em; font-size:1.25em;}
#runningInfo span {font-weight:700;}
#runningInfo span.t {display:inline-block; width:3em; font-weight:400;}