@charset "UTF-8";
/*------------------------------------------------------------
	ADA 2026 — new XD exports, no gaps, aligned layout
------------------------------------------------------------*/
#main.ada26 {
	position: relative;
	margin: 0;
	padding: 0;
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: #1a1a1a;
	background: #fff;
	overflow: clip;
}
#main.ada26 *,
#main.ada26 *::before,
#main.ada26 *::after { box-sizing: border-box; }
#main.ada26 img {
	max-width: 100%;
	height: auto;
	display: block;
	vertical-align: top;
	margin: 0;
	padding: 0;
}

/* PC/SP */
@media all and (min-width: 751px) {
	#main.ada26 .sp { display: none !important; }
	.judgeModal .sp { display: none !important; }
}
@media all and (max-width: 750px) {
	#main.ada26 .pc { display: none !important; }
	.judgeModal .pc { display: none !important; }
}

/* Every section: zero margin/padding/border
   IMPORTANT: override common_site/css/common.css which has
   .sec { border-bottom: 1px solid #e8e8e8; margin-bottom: 60px; } */
#main.ada26 .sec {
	position: relative;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-bottom: 0 !important;
	font-size: 0;
	line-height: 0;
	display: block;
	overflow: hidden;
}
/* Explicit section backgrounds so any sub-pixel gap shows matching color */
#main.ada26 .sec-about,
#main.ada26 .sec-awards,
#main.ada26 .sec-result,
#main.ada26 .sec-archives { background: #18181a !important; }
#main.ada26 .sec-judge { background: #f0f0eb !important; }
#main.ada26 .sec-entry { background: #dcdad3 !important; }
#main.ada26 .sec-archive-bk { background: #c8c8c8 !important; }
#main.ada26 .sec-kiyaku { background: #fff !important; }
#main.ada26 .sec-mv { background: #fff !important; }
/* Forcing image to cover last pixel of section */
#main.ada26 .sec-awards img.bgImg,
#main.ada26 .sec-about img.bgImg,
#main.ada26 .sec-result img.bgImg,
#main.ada26 .sec-archives img.bgImg,
#main.ada26 .sec-archive-bk img.bgImg {
	margin-bottom: -2px;
}
/* Image fills section to prevent sub-pixel gaps */
#main.ada26 .sec > img.bgImg {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	outline: 0 !important;
	vertical-align: top;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
}
#main.ada26 .sec > img.bgImg {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

/* ===== MV (1920x1080 → cut top 200 = 1920x880 aspect) ===== */
#main.ada26 .sec-mv {
	width: 100%;
	aspect-ratio: 1920 / 880;
	background: #fff;
	position: relative;
	overflow: hidden;
}
#main.ada26 .sec-mv .mv-inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	width: 31vw;
	max-width: 600px;
	line-height: 1.3;
	text-align: center;
}
#main.ada26 .sec-mv .fvImg {
	width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}
/* Floating ENTRY badge — fixed from top of page, hidden after RESULT */
.entryBadge.floating {
	position: fixed;
	top: 90px;
	right: 40px;
	width: 140px;
	height: 140px;
	z-index: 200;
	display: block;
	transition: opacity .4s ease, visibility .4s ease;
	pointer-events: auto;
}
.entryBadge.floating img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}
.entryBadge.floating:hover { opacity: 0.88; }
/* Hide when scrolled past RESULT section */
.entryBadge.floating.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
@media all and (min-width: 1200px) {
	.entryBadge.floating {
		top: 110px;
		right: 60px;
		width: 180px;
		height: 180px;
	}
}
@media all and (max-width: 750px) {
	.entryBadge.floating {
		top: 68px;
		right: 18px;
		width: 100px;
		height: 100px;
	}
}

/* MV nanamepc decoration overlay */
#main.ada26 .sec-mv .nanamepc-mv,
#main.ada26 .sec-mv .nanamesp-mv {
	position: absolute;
	pointer-events: none;
	z-index: 1;
}
@media all and (min-width: 751px) {
	#main.ada26 .sec-mv .nanamepc-mv {
		right: -5%;
		bottom: 0;
		width: 30%;
		height: auto;
		opacity: 0.9;
	}
}
@media all and (max-width: 750px) {
	#main.ada26 .sec-mv .nanamesp-mv {
		right: -10%;
		bottom: 2%;
		width: 60%;
		height: auto;
		opacity: 0.9;
	}
}

/* SP MV */
@media all and (max-width: 750px) {
	#main.ada26 .sec-mv {
		aspect-ratio: 1080 / 1720;
	}
	#main.ada26 .sec-mv .mv-inner {
		width: 60vw;
		max-width: none;
	}
	#main.ada26 .sec-mv .fvImg {
		width: 100%;
	}
	#main.ada26 .sec-mv .entryBadge {
		top: 3.5%;
		right: 4%;
		width: 20%;
	}
}

/* ===== JUDGE — hit-areas over 3 portraits ===== */
#main.ada26 .sec-judge .judgeHit {
	position: absolute;
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	outline: none;
	z-index: 5;
}
#main.ada26 .sec-judge .judgeHit:focus-visible {
	outline: 2px solid rgba(0,0,0,0.3);
	outline-offset: 2px;
}
@media all and (min-width: 751px) {
	#main.ada26 .sec-judge .judgeHit {
		top: 17%;
		width: 13%;
		height: 48%;
	}
	#main.ada26 .sec-judge .judge1 { left: 34%; }
	#main.ada26 .sec-judge .judge2 { left: 54.5%; }
	#main.ada26 .sec-judge .judge3 { left: 75%; }
}
@media all and (max-width: 750px) {
	#main.ada26 .sec-judge .judgeHit {
		left: 25%;
		width: 50%;
		height: 20%;
	}
	#main.ada26 .sec-judge .judge1 { top: 15%; }
	#main.ada26 .sec-judge .judge2 { top: 40%; }
	#main.ada26 .sec-judge .judge3 { top: 65%; }
}

/* ===== ENTRY — entry_pc_form as clickable button overlay ===== */
#main.ada26 .sec-entry { position: relative; }
#main.ada26 .sec-entry .entryFormLink {
	position: absolute;
	z-index: 5;
	display: block;
	line-height: 0;
	transition: opacity .2s;
}
#main.ada26 .sec-entry .entryFormLink:hover { opacity: 0.85; }
#main.ada26 .sec-entry .entryFormLink img {
	width: 100%;
	height: auto;
	display: block;
}
@media all and (min-width: 751px) {
	/* PC: entry_pc_form button - upper-right inside white card (natural size 386x110) */
	#main.ada26 .sec-entry .entryFormLink {
		left: 66%;
		top: 58%;
		width: 18%;
		max-width: 386px;
	}
}
@media all and (max-width: 750px) {
	/* SP: entry_sp_form button - centered bottom of white card */
	#main.ada26 .sec-entry .entryFormLink {
		left: 50%;
		transform: translateX(-50%);
		bottom: 8%;
		width: 56%;
		max-width: 600px;
	}
}

/* ===== ARCHIVES — left title image (41.28%) + 3 clickable banners overlay right 58.72% ===== */
#main.ada26 .sec-archives {
	position: relative;
	background: #1a1a1c;
	overflow: hidden;
}
@media all and (min-width: 751px) {
	/* PC: archive_pc.webp is left-only title (1584x2162), constrained to left 41.28% */
	#main.ada26 .sec-archives > img.bgImg.pc {
		width: 41.28%;
		height: auto;
		display: block;
		margin: 0 !important;
	}
}
#main.ada26 .sec-archives .archiveList {
	position: absolute;
	inset: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	z-index: 3;
}
@media all and (min-width: 751px) {
	#main.ada26 .sec-archives .archiveList {
		left: 41.28%;
		right: 0;
		top: 0;
		bottom: 0;
	}
	#main.ada26 .sec-archives .archiveList li {
		flex: 1 1 0;
		position: relative;
		line-height: 0;
		min-width: 0;
	}
	#main.ada26 .sec-archives .archiveList a {
		display: block;
		width: 100%;
		height: 100%;
	}
	#main.ada26 .sec-archives .archiveList img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		display: block;
	}
	#main.ada26 .sec-archives .archiveList a:hover img { opacity: 0.88; }
}
@media all and (max-width: 750px) {
	#main.ada26 .sec-archives .archiveList {
		position: static;
		flex-direction: column;
		gap: 0;
	}
	#main.ada26 .sec-archives .archiveList li { width: 100%; line-height: 0; }
	#main.ada26 .sec-archives .archiveList img {
		width: 100%; height: auto; display: block;
	}
}

/* ===== Judge Modal ===== */
.judgeModal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
}
.judgeModal.is-open { display: flex; }
.judgeModal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.82);
	cursor: pointer;
}
.judgeModal__box {
	position: relative;
	z-index: 2;
	max-width: 1080px;
	max-height: 90svh;
	width: 100%;
	overflow: auto;
	background: #fff;
}
/* Close button: visually hidden but clickable as a top-right invisible hit area */
.judgeModal__close {
	position: absolute;
	top: 0;
	right: 0;
	width: 80px;
	height: 80px;
	border: 0;
	background: transparent;
	color: transparent;
	font-size: 0;
	line-height: 0;
	padding: 0;
	margin: 0;
	overflow: hidden;
	cursor: pointer;
	z-index: 10;
}
.judgeModal__close:focus-visible {
	outline: 2px solid rgba(0,0,0,0.4);
	outline-offset: -2px;
}
@media all and (max-width: 750px) {
	.judgeModal__close { width: 56px; height: 56px; }
}
.judgeModal__imgs img {
	display: none;
	width: 100%;
	height: auto;
}
.judgeModal[data-active="1"] .popup1.pc,
.judgeModal[data-active="1"] .popup1.sp { display: block; }
.judgeModal[data-active="2"] .popup2.pc,
.judgeModal[data-active="2"] .popup2.sp { display: block; }
.judgeModal[data-active="3"] .popup3.pc,
.judgeModal[data-active="3"] .popup3.sp { display: block; }

body.modal-open { overflow: hidden; }

@media all and (max-width: 750px) {
	.judgeModal { padding: 30px 12px; }
}
