@charset "UTF-8";

html, body {
/* 	font-family:'GmarketSans', sans-serif; */
}
/*버튼*/
button {
/* 	font-family:'GmarketSans', sans-serif; */
	cursor:pointer;
}
.btnQuestion {
	position:relative;
	width:24px;
	height:24px;
	background:#005b99;
	color:#fff;
	border-radius:50%;
}
.btnQuestion:before {
	content:"?";
	position:absolute;
	top:55%;
	left:50%;
	transform:translate(-50%, -50%);
	color:#fff;
	font-size:16px;
	font-weight:bold;
}

/*팝업*/
.dim {
	position:fixed;
	top:50%;
	left:50%;
	width:100vw;
	height:100vh;
	background:rgba(0, 0, 0, .3);
	transform:translate(-50%, -50%);
	-webkit-backdrop-filter:blur(4px);
	backdrop-filter:blur(4px);
	z-index:7;
	display:none;
}
.popWrap {
	max-width:1200px;
	width:100%;
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	box-shadow:0 0 15px rgba(0, 0, 0, .15);
	z-index:8;
}
.popWrap .popHeader {
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:1rem;
	background:#39444A;
}
.popWrap .popHeader h4 {
	color:#fff;
	font-size:18px;
}
.popWrap .popHeader .btnCls {
	position:relative;
	width:30px;
	height:30px;
	background:#262B2E;
	border-radius:50%;
}
.popWrap .popHeader .btnCls:before {
	content:"X";
	position:absolute;
	display:block;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%) scaleY(.7);
	color:#fff;
	font-size:18px;
}
.popWrap .popBody {
	background:#fff;
	padding:1rem;
}

/*테이블*/
.listTable {
	width:100%;
	font-size:14px;
}
.listTable thead {
	border-top:1px solid #A4CBE5;
	border-bottom:1px solid #A4CBE5;
}
.listTable thead th {
	background:#EAF5FF;
	padding:0.75rem 0.5rem;
	font-weight:normal;
}
.listTable tbody tr {
	border-bottom:1px solid #ccc;
}
.listTable tbody td {
	padding:0.75rem 0.5rem;
	text-align:center;
}
.listTable th:not(:last-child),
.listTable td:not(:last-child) {
	border-right:1px dashed #ccc;
}

/*기타*/
.mosq {
	position:relative;
	max-width:1400px;
	width:100%;
	height:100%;
	margin:0 auto;
}
.mosq .mosqHeader {
	position:relative;
	display:flex;
	align-items:center;
	justify-content:space-between;
	background:#39444A;
	font-size:0;
	box-shadow:0 4px 4px rgba(0, 0, 0, .15);
	z-index:2;
}
.mosq .mosqHeader .sbjtBox {
	display:inline-flex;
	align-items:center;
	background:#0090F1;
	padding:1rem 1.5rem;
}
.mosq .mosqHeader h3 {
	color:#fff;
	font-size:20px;
}
.mosq .mosqHeader .utilBox {
	display:flex;
	align-items:center;
	font-size:14px;
}
.mosq .mosqHeader  p.Headerdesc {
	display:flex;
	align-items:center;
	margin-right:0.5rem;
	font-size:14px;
	padding:0.5rem 1rem 0.4rem 1rem;
	background:#262B2E;
	border-radius:25px;
}
.mosq .mosqHeader  p.Headerdesc span:first-of-type {
	display:block;
	margin-right:0.5rem;
	color:rgba(255, 255, 255, 0.9);
}
.mosq .mosqHeader  p.Headerdesc span:last-of-type {
	color:rgba(255, 255, 255, 0.7);
}
.mosq .mosqHeader .utilBox .selectBoxY {
	position:relative;
	width:100px;
	min-height:30px;
	margin-right:0.5rem;
	border-radius:30px;
	overflow:hidden;
}
.mosq .mosqHeader .utilBox .selectBoxY.active {
	overflow:visible;
}
.mosq .mosqHeader .utilBox .selectBoxY ul.selectYear {
	position:absolute;
	top:0;
	left:0;
	max-height:30px;
	overflow:hidden;
	cursor:pointer;
	z-index:2;
}
.mosq .mosqHeader .utilBox .selectBoxY.active ul.selectYear {
	max-height:100rem;
	border-radius:15px;
}
.mosq .mosqHeader .utilBox .selectBoxY ul.selectYear:after {
	content:"";
	position:absolute;
	top:11.5px;
	right:1rem;
	width:9px;
	height:9px;
	background:url(/images/sp/whiteColor/iconDownArrow.svg) no-repeat center center / contain;
	transition:all .15s linear;
}
.mosq .mosqHeader .utilBox .selectBoxY.active ul.selectYear:after {
	transform:rotate(180deg);
}
.mosq .mosqHeader .utilBox .selectBoxY ul.selectYear > li {
	background:#262B2E;
	width:100px;
	height:30px;
	padding-right:1rem;
	font-size:14px;
	color:#fff;
	text-align:center;
	line-height:30px;
}
.mosq .mosqHeader .utilBox .selectBoxY.active ul.selectYear > li:hover {
	color:#FFDF6E;
}
.mosq .mosqHeader .utilBox .btnReport {
	position:relative;
	background:#262B2E;
	width:100px;
	height:30px;
	margin-right:1.5rem;
	padding-right:1rem;
	font-size:14px;
	color:#fff;
	text-align:center;
	line-height:30px;
	border-radius:30px;
	cursor:pointer;
}
.mosq .mosqHeader .utilBox .btnReport:after {
	content:"";
	position:absolute;
	top:50%;
	right:0.75rem;
	transform:translateY(-50%);
	width:13px;
	height:13px;
	background:url(/images/sp/iconDown.png) no-repeat center center / contain;
}
.mosq .mosqBody {
	position:relative;
	height:calc(100vh - 200px);
}
.mosq .mosqBody .mapCont {
	position:relative;
	background:#f2f3f5;
	min-height:calc(100vh - 200px);
	height:100%;
}
.mosq .mosqBody .mapCont #vMap {
	height:100%;
}
.mosq .mosqBody .mapCont .mapSpot {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
}
.mosq .mosqBody .mapCont .mapSpot .spot {
	position:relative;
	width:12px;
	height:12px;
	background:red;
	border-radius:50%;
}
.mosq .mosqBody .legend {
	position:absolute;
	bottom:1rem;
	left:1rem;
	width:185px;
	box-shadow:0 0 15px rgba(0, 0, 0, .15);
	z-index: 999;
}
.mosq .mosqBody .legend p {
	background:#39444A;
	color:#fff;
	padding:0.35rem 0;
	text-align:center;
}
.mosq .mosqBody .legend ul {
	background:rgba(255, 255, 255, .6);
	-webkit-backdrop-filter:blur(4px);
	backdrop-filter:blur(4px);
	padding:0.5rem;
}
.mosq .mosqBody .legend ul li {
	position:relative;
	padding:0.25rem 0.5rem 0.25rem 1.25rem;
	font-size:14px;
}
.mosq .mosqBody .legend ul li:before {
	content:"";
	display:inline-block;
	position:absolute;
	top:calc(50% - 7px);
	left:0;
	width:14px;
	height:14px;
	background:#FF2D2D;
	border-radius:50%;
	border-width: 2px;
	border-color: rgba(0,0,0,0.4);
	border-style: solid;
}
.mosq .mosqBody .legend ul li:nth-child(2):before {
	background:#FF8585;
}
.mosq .mosqBody .legend ul li:nth-child(3):before {
	background:#FFA3A3;
}
.mosq .mosqBody .legend ul li:nth-child(4):before {
	background:#FFD5D5;
}
.mosq .mosqBody .spotDesc {
	position:absolute;
	width:360px;
	bottom:0.5rem;
	left:calc(100% - 0.5rem);
	box-shadow:0 0 15px rgba(0, 0, 0, .15);
	display:none;
}
.mosq .mosqBody .mapCont .mapSpot:hover .spot + .spotDesc {
	display:block;
}
.mosq .mosqBody .spotHeader {
	display:flex;
	align-items:center;
	background:#39444A;
	padding:0.5rem 1rem;
}
.mosq .mosqBody .spotHeader .circle {
	width:16px;
	height:16px;
	background:#FF2D2D;
	margin-right:0.5rem;
	border-radius:50%;
}
.mosq .mosqBody .spotHeader h4 {
	color:#fff;
	font-weight:normal;
}
.mosq .mosqBody .spotBody {
	background:#fff;
	padding:1rem;
}
.mosq .mosqBody .spotBody .valueBox {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	align-items:center;
	width:100%;
}
.mosq .mosqBody .spotBody .valueBox li {
	width:48%;
	margin-bottom:0.5rem;
	padding:0.5rem 0;
}
.mosq .mosqBody .spotBody .valueBox li.title {
	background:#f2f3f5;
	font-size:14px;
	text-align:center;
	border-radius:30px;
}
.mosq .mosqBody .spotBody .valueBox li.value {
	position:relative;
	font-weight:bold;
}
.mosq .mosqBody .spotBody .valueBox li.value:not(:last-child):after {
	content:"";
	position:absolute;
	display:block;
	width:100%;
	height:1px;
	border-bottom:1px dashed #ccc;
	bottom:-0.25rem;
	left:0;
}
.mosq .mosqBody .spotBody .valueBox li.value span {
	position:relative;
}
.mosq .mosqBody .spotBody .valueBox li.value span.up,
.mosq .mosqBody .spotBody .valueBox li.value span.down {
	padding-left:1rem;
}

.mosq .mosqBody .spotBody .valueBox li.value span:before {
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:13px;
	height:13px;
	background:transparent;
	font-size:16px;
	line-height:13px;
	transform:translateY(-50%);
}
.mosq .mosqBody .spotBody .valueBox li.value span.down:before {
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:13px;
	height:13px;
	color:transparent;
	text-indent:-9999px;
	background:url(/images/sp/stats/triDownBlue.svg) no-repeat center center / contain;
	transform:translateY(-50%);
}
.mosq .mosqBody .spotBody .valueBox li.value span.up:before {
	background:url(/images/sp/stats/triUpRed.svg) no-repeat center center / contain;
	color:transparent;
	text-indent:-9999px
}
.mosq .mosqBody .spotBody .btnLblue {
	width:100%;
	height:40px;
	background:#E6F0F8;
	margin-top:1rem;
	color:#1B79B9;
	font-size:16px;
	border-radius:40px;
	transition:all .3s linear;
	text-align:center;
	line-height:40px;	
}
.mosq .mosqBody .spotBody .btnLblue:hover {
	background:#1B79B9;
	color:#fff;
}
.mosqPop {
	display:none;
}
.mosqPop .popTab {
	display:flex;
	align-items:center;
	border-bottom:2px solid #0090F1;
}
.mosqPop .popTab li {
	position:relative;
	width:180px;
	height:45px;
	background:#f2f3f5;
	border:1px solid #ccc;
	border-bottom:none;
	color:#767676;
	text-align:center;
	line-height:45px;
	cursor:pointer;
}
.mosqPop .popTab li.active {
	background:#fff;
	color:#178AD8;
	border:2px solid #0090F1;
	border-bottom:none;
}
.mosqPop .popTab li.active:after {
	content:"";
	position:absolute;
	bottom:-5px;
	left:0;
	width:100%;
	height:6px;
	background:#fff;
}
.mosqPop .popTabCont > div[class*=cont] {
	min-height:727px;
}
.mosqPop .popTabCont > .cont1 {
	width:100%;
	padding:1rem 0;
	display:none;
	flex-wrap:wrap;
	justify-content:space-between;
}
.mosqPop .popTabCont > .cont1.active {
	display:flex;
}
.cont1 .chartBox {
	width:49%;
	margin:0.75rem 0;
	border:1px solid #ccc;
}
.chartSbjt {
	position:relative;
	top:-8px;
	display:inline-block;
	background:#fff;
	padding:0 0.75rem 0 1.75rem;
	font-weight:normal;
}
.chartSbjt:before {
	content:"";
	position:absolute;
	top:0;
	left:5px;
	width:9px;
	height:14px;
	background:#0090F1;
	border-radius:0 14px;
}
.chartSbjt:after { 
	content:"";
	position:absolute;
	top:0;
	left:14px;
	width:9px;
	height:14px;
	background:#95F100;
	border-radius:14px 0;	
}
.cont1 .chartBox form {
	display:flex;
	align-items:center;
	justify-content:flex-end;
	margin-right:1rem;
}
.cont1 .chartBox form select {
	height:35px;
	padding:0 0.75rem;
	border:1px solid #c1c1c1; 
	border-radius:5px 0 0 5px;
}
.cont1 .chartBox form button {
	width:35px;
	height:35px;
	background:url(/images/sp/iconSearchW.svg) no-repeat center center / 20px ,#178AD8;
	border-radius:0 5px 5px 0;
}
.cont1 .chartBox .chart {
	height:280px;
	padding:1rem;
}
.mosqPop .popTabCont .cont2 {
	display:none;
	padding:1rem 0;
}
.mosqPop .popTabCont .cont2.active {
	display:block;
}
.mosqPop .popTabCont .cont2 p.title {
	position:relative;
	margin-bottom:0.25rem;
	padding-left:1.25rem;
}
.mosqPop .popTabCont .cont2 p.title:before {
	content:"";
	position:absolute;
	top:43%;
	left:0;
	width:14px;
	height:14px;
	background:#FF2D2D;
	border-radius:50%;
	transform:translateY(-50%);
}
.mosqPop .popTabCont > .cont2 .tableBox {
	max-height:640px;
	overflow:auto;
}
.mosqPop .popTabCont > .cont2 .tableBox thead th {
	position:sticky;
	top:0;
	z-index:3;
}

/*로딩 스피너*/
.loading {
  position:fixed;
  top:calc(50% - 25px);
  left:calc(50% - 25px);
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 3px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
  z-index:999999;
}
.mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 99999; 
}


/*올담 탭 오류*/
.local .sub_navi {
	z-index:6;
}
.basic_tab li a {
	height:auto !important;
}

/* 올담 <h3> 오류 */
@media (min-width: 1023px) {
    .s_content h3 {
        margin: 0 !important;
    }
}
@media (min-width: 768px) {
    .s_content h3 {
        margin: 0 !important;
    }
}
.s_content h3 {
    margin: 0;
}
.s_content h3:after {
    display: none;
}