* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
	background: #fff;
	color: #000;
	font-size: 16px;
	line-height: 1.4;
}

video, img {width:100%;}

.imagemap { position:relative; width:100% }

#container { width:100%; max-width:1080px; margin:0 auto; }
.contents { margin-top:50px; padding-bottom:50px; }

.videoxy {
    position: absolute;
    top: 2.85%;
    left: 1.6%;
    width: 76.3%;
    height: auto;
}

.pdf-down {
    position: absolute;
    top: 13.4%;
    left: 81.2%;
    width: 17.4%;
    height: 1.9%;
    cursor: pointer;
}

.call {
    position: absolute;
    top: 20.5%;
    left: 81.2%;
    width: 17.4%;
    height: 8.7%;
    cursor: pointer;
}

#image01 {
    position: absolute;
    top: 48.35%;
    left: 4.1%;
    width: 37.6%;
    height: 16.4%;
	cursor: pointer;
}

#image02 {
    position: absolute;
    top: 48.35%;
    left: 50.1%;
    width: 37.6%;
    height: 16.4%;
	cursor: pointer;
}

#image03 {
	position: absolute;
    top: 78.35%;
    left: 4.1%;
    width: 37.6%;
    height: 12.7%;
	cursor: pointer;
}

#image04 {
	position: absolute;
    top: 78.35%;
    left: 50.1%;
    width: 37.6%;
    height: 12.7%;
	cursor: pointer;
}

/* ===== Layer Popup (LIVEHUB) ===== */
.lh-modal {
	display: none;
	position: fixed;
	z-index: 9999;
	inset: 0;
}
.lh-modal.is-open { display: block; }

.lh-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.8); /* black + opacity 0.8 */
}

.lh-dialog {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center; /* 상하 중앙 */
	justify-content: center; /* 좌우 중앙 */
	padding: 3vh 3vw;
}

.lh-content {
	position: relative;
	width: 90vw; /* 화면 넓이 90% */
	max-width: 1600px;
	background: transparent; /* 이미지만 띄우고 배경 없음 */
	display: flex;
	flex-direction: column;
	align-items: center;
}

.lh-content img {
	display: block;
	width: 90vw; /* 요구사항: 가로 90% */
	height: auto;
	max-height: 75vh; /* 설명 영역 고려해서 세로 제한 */
	object-fit: contain;
	background: #000; /* 이미지 투명 영역 대비 */
}

.lh-desc {
	margin-top: 10px;
	color: #fff;
	font-size: 14px;
	line-height: 1.5;
	text-align: center;
	word-break: keep-all;
}

.lh-close {
	position: absolute;
	top: -12px; /* 이미지 상단 바깥쪽 느낌 */
	right: -12px;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background: rgba(0,0,0,0.7);
	color: #fff;
	font-size: 20px;
	line-height: 36px;
	text-align: center;
	cursor: pointer;
}

@media (max-width: 767px){
	.lh-content img {
		max-height: 65vh;
	}
	.lh-close {
		top: -10px;
		right: -10px;
		width: 32px;
		height: 32px;
		line-height: 32px;
		font-size: 18px;
	}
}