@charset "utf-8";

/* font
================================================== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Sans:wght@100..900&display=swap');

/* reset
================================================== */
*:where(:not(html,iframe,canvas,img,svg,video,audio):not(svg *,symbol *)){all:unset;display:revert;}
*,*::before,*::after{box-sizing:border-box;}
html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;}
a,button{cursor:revert;}
ol,ul,menu,summary{list-style:none;}
ol{counter-reset:revert;}
img{max-inline-size:100%;max-block-size:100%;}
table{border-collapse:collapse;}
input,textarea{-webkit-user-select:auto;}
textarea{white-space:revert;}
meter{-webkit-appearance:revert;appearance:revert;}
:where(pre){all:revert;box-sizing:border-box;}
::placeholder{color:unset;}
:where([hidden]){display:none;}
:where([contenteditable]:not([contenteditable="false"])){-moz-user-modify:read-write;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space;-webkit-user-select:auto;}
:where([draggable="true"]){-webkit-user-drag:element;}
:where(dialog:modal){all:revert;box-sizing:border-box;}
::-webkit-details-marker{display:none;}

/* addition
-------------------------------------------------- */
body{position:relative;width:100%;font-size:min(2vw,20px);line-height:1.6;color:#000;font-family:'Noto Sans','Noto Sans JP',sans-serif;font-weight:600;font-feature-settings:'palt';letter-spacing:0.035em;background:#FEFEF4;}
footer,header,main,picture{display:block;}
img{vertical-align:top;}
a{color:#000;vertical-align:bottom;background:transparent;}
@media screen and (max-width:800px){
	body{
		font-size:min(4vw,16px);
	}
}


/* 映像研には手を出すな！
================================================== */
html,body{
	height:100%;
}

/* header
================================================== */
@scope(index){
	
}
@media screen and (max-width:800px){
	@scope(index){
		
	}
}
@media (any-hover:hover){
	
}

/* footer
================================================== */
@scope(footer){
	:scope{
		position:sticky;
		top:100vh;
		display:grid;
		place-items:center;
		width:100%;
		height:min(8.2vw,82px);
		color:#FFF;
		text-align:center;
		background:#000;
	}
	.copyright{
		padding-block-start:min(0.1vw,1px);
		font-size:min(1.2vw,12px);
		font-weight:400;
	}
}
@media screen and (max-width:800px){
	@scope(footer){
		:scope{
			height:min(18.25vw,67px);
		}
		.copyright{
			font-size:min(2.75vw,11px);
		}
	}
}

/* nav
================================================== */
@scope(nav){
	:scope{
		background:#FFE900;
	}
	ul{
		display:grid;
		grid-template-columns:repeat(4,min(21vw,210px));
		width:fit-content;
		margin-inline:auto;
	}
	a{
		display:grid;
		place-items:center;
		height:min(6.9vw,73px);
		font-size:min(2.2vw,22px);
		line-height:1.25;
		font-weight:800;
		transition:color 0.5s,background 0.5s;
	}
	.disabled{
		opacity:0.4;
		pointer-events:none;
	}
}
@media screen and (max-width:800px){
	@scope(nav){
		ul{
			grid-template-columns:repeat(4,1fr);
			width:100%;
			padding-inline:12px;
		}
		a{
			height:min(14.25vw,57px);
			font-size:min(4.25vw,17px);
		}
	}
}
@media (any-hover:hover){
	@scope(nav){
		a:hover{
			color:#FFE900;
			background:#000;
		}
	}
}

/* main
================================================== */
@scope(main){
:scope{
	padding-block:min(6.8vw,68px) min(15.8vw,158px);
}
	.contents{
		max-width:1080px;
		margin-inline:auto;
		padding-inline:min(3vw,30px);
	}
	.contents+.contents{
		margin-block-start:min(11.6vw,116px);
	}
	.title{
		font-size:min(5.4vw,54px);
		font-weight:900;
		text-align:center;
		text-shadow:4px 4px 0 #FFE900;
	}
	.content{
		position:relative;
		padding:min(6vw,60px) min(4vw,40px);
		border:3px solid #000;
		background:#FFF;
		box-shadow:8px 8px 0 #000;
	}
	.content+.content{
		margin-block-start:min(6.5vw,65px);
	}
	.title+.content{
		margin-block-start:min(3.9vw,39px);
	}
	.message{
		padding:min(5.9vw,59px) min(4vw,40px) min(5.8vw,58px);
		text-align:center;
		border:3px solid #000;
		background:#FFF;
		box-shadow:8px 8px 0 #000;
	}
	.title+.message{
		margin-block-start:min(3.9vw,39px);
	}
	.heading{
		position:absolute;
		top:max(-2.8vw,-28px);
		left:max(-1.8vw,-18px);
		display:grid;
		place-items:center;
		width:min(29vw,290px);
		height:min(5.3vw,53px);
		font-size:min(2.4vw,24px);
		color:#FFF;
		font-weight:700;
		background:#000;
	}
	.table li{
		position:relative;
	}
	.table>li:not(:first-child){
		margin-block-start:min(3vw,30px);
		padding-block-start:min(calc(3vw + 3px),33px);
	}
	.table>li:not(:first-child)::before{
		position:absolute;
		top:0;
		left:0;
		display:block;
		width:100%;
		height:3px;
		background-image:linear-gradient(to right,#000,#000 3px,transparent 3px,transparent 6px);
		background-size:6px 3px;
		background-repeat:repeat-x;
		content:'';
	}
	.details{
		display:grid;
		grid-template-columns:min(21vw,210px) 1fr;
		gap:min(5.75vw,26px) min(2.5vw,25px);
	}
	.item{
		display:grid;
		place-items:center;
		width:min(21vw,210px);
		height:min(4.9vw,49px);
		border-radius:25px;
		background:#FFE900;
	}
	.text{
		padding-block-start:min(0.9vw,9px);
	}
	.list{
		display:grid;
		grid-auto-flow:row;
		row-gap:min(0.5vw,5px);
	}
	.list li{
		position:relative;
		padding-inline-start:min(2vw,20px);
	}
	.disc li::before{
		position:absolute;
		top:min(0.8vw,8px);
		left:0;
		display:block;
		width:min(1.5vw,15px);
		height:min(1.5vw,15px);
		border-radius:50%;
		background:#000;
		content:'';
	}
	.reference li::before{
		position:absolute;
		top:0;
		left:0;
		display:block;
		width:1em;
		height:calc(1em*1.6);
		text-align:center;
		background:none;
		content:'\203B';
	}
}
@media screen and (max-width:800px){
	@scope(main){
		:scope{
			padding-block:min(15.75vw,63px) min(33.75vw,135px);
		}
		.contents{
			padding-inline:12px;
		}
		.contents+.contents{
			margin-block-start:min(25vw,96px);
		}
		.title{
			font-size:min(10vw,40px);
		}
		.content{
			padding:min(12.5vw,50px) min(4.5vw,18px);
		}
		.content+.content{
			margin-block-start:min(14.5vw,58px);
		}
		.title+.content{
			margin-block-start:min(9.25vw,37px);
		}
		.message{
			padding:min(11.5vw,46px) min(4.5vw,18px) min(11.25vw,45px);
		}
		.title+.message{
			margin-block-start:min(9.25vw,37px);
		}
		.heading{
			top:max(-5.75vw,-23px);
			left:max(-2.75vw,-11px);
			width:min(58vw,232px);
			height:min(10.75vw,43px);
			font-size:min(4.75vw,19px);
			border-radius:3px;
		}
		.table>li:not(:first-child){
			margin-block-start:min(7.5vw,30px);
			padding-block-start:min(calc(7.5vw + 2px),32px);
		}
		.table>li:not(:first-child)::before{
			height:2px;
			background-image:linear-gradient(to right,#000,#000 2px,transparent 2px,transparent 4px);
			background-size:4px 2px;
		}
		.details{
			grid-template-columns:auto;
		}
		.item{
			width:100%;
			height:min(10vw,40px);
			padding-block-start:min(0.25vw,1px);
			border-radius:3px;
		}
		.text{
			padding-block:0;
		}
		.list{
			row-gap:min(1.25vw,5px);
			padding-block-end:0;
		}
		.list li{
			padding-inline-start:min(4vw,16px);
		}
		.disc li::before{
			top:min(1.5vw,6px);
			width:min(3vw,12px);
			height:min(3vw,12px);
		}
	}
}
@scope(#overview){
	.table li:first-child .text{
		padding-block-end:min(0.8vw,8px);
	}
	.map{
		margin-block-start:min(3.3vw,33px);
	}
	.map iframe{
		width:100%;
		height:auto;
		vertical-align:bottom;
		aspect-ratio:699/220;
	}
	.list{
		margin-block-start:min(2.7vw,27px);
	}
	.organizer{
		display:flex;
		justify-content:center;
		column-gap:min(2.5vw,25px);
		margin-block-start:min(5.3vw,53px);
		padding-block:min(4.9vw,49px) min(4.8vw,48px);
		border:1px solid #000;
	}
	.organizer span{
		display:inline-block;
	}
}
@media screen and (max-width:800px){
	@scope(#overview){
		.table>li:nth-of-type(2){
			margin-block-start:min(6.25vw,25px);
		}
		.table li:first-child .text{
			padding-block-end:0;
		}
		.map{
			margin-block-start:min(6vw,24px);
		}
		.map iframe{
			aspect-ratio:3/2;
		}
		.list{
			margin-block-start:min(5vw,20px);
		}
		.organizer{
			flex-direction:column;
			align-items:center;
			row-gap:min(3.25vw,13px);
			margin-block-start:min(11vw,44px);
			padding:min(7.75vw,31px) min(5vw,20px) min(7.25vw,29px);
			text-align:center;
		}
		.organizer dt{
			width:fit-content;
			text-decoration:#000 underline solid 1px;
			text-underline-offset:min(1.25vw,5px);
		}
	}
}
@media screen and (max-width:500px){
	@scope(#overview){
		.map iframe{
			aspect-ratio:1;
		}
	}
}
@scope(#ticket){
	.text{
		padding-block-start:min(0.8vw,8px);
	}
	.text:has(span){
		display:grid;
		grid-auto-flow:column;
		width:fit-content;
	}
	.text span{
		align-self:end;
		display:block;
		padding-block-end:2px;
		font-size:min(1.4vw,14px);
	}
	.link{
		margin-block-start:min(0.5vw,5px);
	}
	.link a{
		color:#0B54D7;
		text-decoration:#0B54D7 underline solid 1px;
		text-underline-offset:2px;
		transition:text-decoration-color 0.5s;
	}
	.reference{
		margin-block-start:min(1.3vw,13px);
		font-size:min(1.5vw,15px);
	}
	.precautions{
		margin-block-start:min(5.6vw,56px);
		padding:min(4.9vw,49px) min(4vw,40px) min(4.8vw,48px);
		border:1px solid #000;
	}
	.precautions dt{
		width:fit-content;
		margin:0 auto min(3.8vw,38px);
		text-decoration:color-mix(in srgb,#FFE900,#000 10%) underline solid 6px;
		text-underline-offset:min(0.7vw,7px);
	}
	.category{
		display:grid;
		place-items:center;
		height:min(4.9vw,49px);
		margin-block-end:min(3vw,30px);
		padding-block-start:1px;
		background:color-mix(in srgb,#FFE900,#000 10%);
	}
	.table+.category{
		margin-block-start:min(6vw,60px);
	}
}
@media screen and (max-width:800px){
	@scope(#ticket){
		#schedule{
			padding-block-end:min(11vw,44px);
		}
		.table>li:not(:first-child){
			margin-block-start:min(6.25vw,25px);
		}
		.text{
			padding-block:0;
		}
		.text span{
			font-size:min(3vw,12px);
		}
		.link{
			margin-block-start:min(1.25vw,5px);
		}
		.reference{
			margin-block-start:min(2.75vw,11px);
			font-size:min(3.25vw,13px);
		}
		.precautions{
			margin-block-start:min(11.5vw,46px);
			padding:min(7.75vw,31px) min(5vw,20px) min(7.25vw,29px);
		}
		.precautions dt{
			margin-block-end:min(6vw,24px);
			text-decoration-thickness:5px;
			text-underline-offset:min(0.7vw,7px);
		}
		.category{
			height:min(10vw,40px);
			margin-block-end:1px;
			border-radius:3px;
		}
		.table+.category{
			margin-block-start:min(11.25vw,45px);
		}
	}
}
@media (any-hover:hover){
	@scope(#ticket){
		.link a:hover{
			text-decoration-color:transparent;
		}
	}
}