.finish-loading{position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:999999; display:none;}
.modal-loading{position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:10000; }
.loading {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(155,155,155,.3);
  border-radius: 50%;
  border-top-color: #ffffff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
  position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px;

}

.loading2 {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(155,155,155,.3);
  border-radius: 50%;
  border-top-color: #2d3b46;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
  position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px;

}


@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}


.content-modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:99998; background:#000; background:rgba(0,0,0,0.8);}
.content-modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.content-modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.content-modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.content-modal-inner-content{text-align:left;}
/* modal layer content */
.content-modal-content{position:relative; width:50%; max-width:100%; margin:20px auto; background-color:#fff; }
.content-modal-content h2{height:60px; line-height:60px; font-size:18px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#2368ab; color:#fff; font-family:'GmarketSansBold', sans-serif;}
.content-modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; }
.content-modal-close-btn i{font-size:38px; color:#ffffff;}
.content-modal-close-btn i:hover {color:#fff}
.content-inner-box{padding:3px; }
.content-inner{padding:3px; height:85dvh; overflow-y:auto; overflow-x:hidden; border:none; text-align:center; }


.review-modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:99998; background:#000; background:rgba(0,0,0,0.8);}
.review-modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.review-modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.review-modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.review-modal-inner-content{text-align:left;}
/* modal layer content */
.review-modal-content{position:relative; width:70%; max-width:100%; margin:20px auto; background-color:#fff; }
.review-modal-content h2{height:60px; line-height:60px; font-size:18px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#2368ab; color:#fff; font-family:'GmarketSansBold', sans-serif;}
.review-modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; }
.review-modal-close-btn i{font-size:38px; color:#ffffff;}
.review-modal-close-btn i:hover {color:#fff}

.review-modal-write-btn{position:absolute; top:5px; left:10px; color:#fff; }

.review-inner-box{padding:3px; }
.review-inner{padding:3px; height:85dvh; overflow-y:auto; overflow-x:hidden; border:none; text-align:center; }




.solution-modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:99997; background:#000; background:rgba(0,0,0,0.8);}
.solution-modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.solution-modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.solution-modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.solution-modal-inner-content{text-align:left;}
/* modal layer content */
.solution-modal-content{position:relative; width:70%; max-width:100%; margin:20px auto; background-color:#fff; }
.solution-modal-content h2{height:60px; line-height:60px; font-size:18px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#2368ab; color:#fff; font-family:'GmarketSansBold', sans-serif;}
.solution-modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; }
.solution-modal-close-btn i{font-size:38px; color:#ffffff;}
.solution-modal-close-btn i:hover {color:#fff}
.solution-modal-write-btn{position:absolute; top:5px; left:10px; color:#fff; }
.solution-inner-box{padding:3px; }
.solution-inner{padding:3px; height:85dvh; overflow-y:auto; overflow-x:hidden; border:none; text-align:center; }



.security-map-tab-wrap {
	display: flex;
	gap: 8px;
	margin-bottom: 16px;
	overflow-x: auto;
	padding-bottom: 4px;
}

.security-map-tab {
	flex: 0 0 auto;
	padding: 10px 18px;
	border-radius: 999px;
	background: #e5e7eb;
	color: #374151;
	font-size: 14px;
	font-weight: 700;
	transition: all .2s ease;
}

.security-map-tab:hover {
	background: #d1d5db;
}

.security-map-tab.active {
	background: #2563eb;
	color: #fff;
	box-shadow: 0 6px 16px rgba(37, 99, 235, .25);
}

.security-map-content-wrap {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 18px;
	box-shadow: 0 12px 30px rgba(0,0,0,.08);
	padding: 18px;
}

.security-map-content {
	display: none;
}

.security-map-content.active {
	display: block;
}

.security-map-image-box {
	width: 100%;
	overflow-x: auto;
	border-radius: 14px;
	background: #f9fafb;
}

.security-map-image-box img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 14px;
}


.security-map-stage {
	position: relative;
	width: 100%;
}

.security-map-stage img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 14px;
}

.map-hotspot {
	position: absolute;
	z-index: 10;
	display: block;
	border: 2px solid transparent;
	border-radius: 8px;
	background: rgba(37, 99, 235, 0);
	cursor: pointer;
	transition: all .2s ease;
}

.map-hotspot:hover {
	border-color: rgba(37, 99, 235, .9);
	background: rgba(37, 99, 235, .12);
}

.map-hotspot span {
	display: none;
	position: absolute;
	left: 50%;
	top: -34px;
	transform: translateX(-50%);
	white-space: nowrap;
	padding: 6px 10px;
	border-radius: 8px;
	background: #111827;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
}

.map-hotspot:hover span {
	display: block;
}

/*
.map-hotspot {
	position: absolute;
	z-index: 10;
	display: block;
	border: 2px solid rgba(239, 68, 68, .75); 
	border-radius: 8px;
	background: rgba(239, 68, 68, .12); 
	cursor: pointer;
	transition: all .2s ease;
	line-height: normal;
}


.map-hotspot:hover span {
	display: block;
}


.map-hotspot:hover {
	border-color: rgba(37, 99, 235, .95);
	background: rgba(37, 99, 235, .18);
}

.map-hotspot span {
	display: block;
	position: absolute;
	left: 50%;
	top: -32px;
	transform: translateX(-50%);
	white-space: nowrap;
	padding: 5px 9px;
	border-radius: 7px;
	background: #111827;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	pointer-events: none;
}
*/

@media (max-width: 768px) {
	.security-map-stage {
		min-width: 900px;
	}
}

@media (max-width: 768px) {
	.security-map-content-wrap {
		padding: 10px;
		border-radius: 14px;
	}

	.security-map-image-box img {
		min-width: 900px;
		max-width: none;
	}
}


@media (max-width: 768px) {
    .content-modal-content {
        width: 95%;
    }

	.review-modal-content {
        width: 95%;
    }

	.solution-modal-content {
        width: 95%;
    }
	

}


.scrollbar-custom::-webkit-scrollbar {
  width: 8px; /* 스크롤바 너비 */
  height:5px;
}

.scrollbar-custom::-webkit-scrollbar-thumb {
  background-color: #4b5563; /* 스크롤바 손잡이 색상 */
  border-radius: 10px; /* 손잡이 둥글게 */
}

.scrollbar-custom::-webkit-scrollbar-track {
  background-color: #f3f4f6; /* 스크롤바 트랙 색상 */
}