* {
	box-sizing:border-box
}

html {
	background:#06183c
}

body {
	margin:0;
	padding:0;
	background:#06183c;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Malgun Gothic",sans-serif
}

button,input {
	font:inherit
}

[hidden] {
	display:none!important
}

.invitation {
	width:100%;
	max-width:800px;
	margin:0 auto;
	overflow:hidden
}

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

.imagemap>img {
	display:block;
	width:100%;
	height:auto
}

.hit-area {
	display:block;
	position:absolute;
	cursor:pointer;
	-webkit-tap-highlight-color:transparent;
	background:transparent;
	border:0;
	padding:0
}

.hit-area:focus-visible {
	outline:3px solid #fff;
	outline-offset:3px;
	border-radius:5px
}

.mlink01,.mlink02,.mlink03,.mlink04 {
	left:50%;
	transform:translateX(-50%);
	width:56%;
	height:6.45%
}

.mlink01 {
	top:43.2%
}

.mlink02 {
	top:51.4%
}

.mlink03 {
	top:59.6%
}

.mlink04 {
	top:67.8%
}

.map-link {
	left:50%;
	transform:translateX(-50%);
	top:32.15%;
	width:78.5%;
	height:20%
}

.home-button {
	position:fixed;
	top:max(14px,env(safe-area-inset-top));
	right:14px;
	width:43px;
	height:43px;
	border:1px solid #a0dfff70;
	border-radius:50%;
	background:#062455df;
	z-index:30;
	display:grid;
	place-items:center;
	box-shadow:0 3px 15px #0004
}

.home-button svg {
	width:23px;
	height:23px;
	fill:none;
	stroke:#fff;
	stroke-width:1.8;
	stroke-linecap:round;
	stroke-linejoin:round
}

.home-button:focus-visible {
	outline:3px solid #7cd5ff;
	outline-offset:3px
}

/* menu04.png 원본 좌표(1280×3392). 문구·입력·버튼은 이 페이지 CSS에서 바로 조정합니다. */
#seat_number {
	position:absolute;
	top:25.1%;
	left:18.45%;
	width:53.95%;
	height:2.38%;
	padding:0 3%;
	border:0;
	border-radius:4px 0 0 4px;
	background:#fff;
	color:#182a4a;
	z-index:4;
	font-size:clamp(13px,3.45vw,27px);
	line-height:1.3
}

#seat_number::placeholder {
	color:#8eaada;
	opacity:1
}

#seat_number:focus {
	outline:2px solid #42b9ff;
	outline-offset:-2px
}

.seat-button {
	top:24.95%;
	left:72.3%;
	width:9.5%;
	height:2.65%;
	z-index:5
}

.seat-button:disabled {
	cursor:wait;
	background:#0d326850
}

.seat-map {
	position:absolute;
	bottom:0;
	left:50%;
	transform:translateX(-50%);
	width:100%;
	height:auto;
	z-index:2
}

.seat-result {
	position:absolute;
	top:29.42%;
	left:49.5%;
	transform:translateX(-50%);
	width:45.75%;
	height:2.83%;
	z-index:3;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:.2em;
	border:1px solid #3e71a7;
	border-radius:clamp(5px,1.1vw,9px) clamp(5px,1.1vw,9px) 0 0;
	background:linear-gradient(116deg,#09234c,#093773 56%,#092448 78%,#163963);
	color:white;
	font-weight:600;
	font-size:clamp(14px,3.7vw,29.5px);
	white-space:nowrap
}

.seat-result strong {
	font:inherit
}

.seat-message {
	position:absolute;
	top:27.48%;
	left:50%;
	transform:translateX(-50%);
	width:78%;
	margin:0;
	z-index:5;
	color:#afd6ff;
	font-size:clamp(10px,2.7vw,18px);
	line-height:1.4;
	text-align:center;
	overflow-wrap:anywhere
}

.seat-message.error {
	color:#ffd1b9
}

.modal {
	position:fixed;
	inset:0;
	z-index:60;
	background:#0009;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:22px
}

.modal-panel {
	position:relative;
	width:100%;
	max-width:440px;
	max-height:80vh;
	overflow:auto;
	background:#fff;
	border-radius:18px;
	padding:28px 24px;
	box-shadow:0 20px 90px #0006;
	color:#142e50
}

.modal-eyebrow {
	font-size:12px;
	font-weight:700;
	color:#2975c9
}

.modal-panel h2 {
	font-size:22px;
	margin:9px 0 12px
}

.modal-panel p {
	color:#6a7889;
	font-size:14px;
	line-height:1.6
}

.modal-close {
	position:absolute;
	right:12px;
	top:10px;
	border:0;
	background:transparent;
	color:#526881;
	cursor:pointer;
	font-size:28px;
	line-height:1;
	width:32px;
	height:32px
}

.person-options {
	display:flex;
	flex-direction:column;
	gap:9px;
	margin-top:22px
}

.person-option {
	text-align:left;
	cursor:pointer;
	background:#eef5ff;
	border:1px solid #c8def9;
	color:#164d92;
	border-radius:10px;
	padding:15px;
	font-size:16px;
	font-weight:600
}

.person-option small {
	display:block;
	font-size:12px;
	font-weight:400;
	color:#6680a0;
	margin-top:4px
}

.noscript {
	color:white;
	text-align:center;
	padding:16px
}

.sr-only {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0
}

@media(min-width:830px) {
	.home-button {
		right:calc((100vw - 800px)/2 + 14px)
	}
}