@charset "UTF-8";


/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////// TOP /////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#top
{
	width: 100%;
	height: 100%;
	position:sticky;
	top: 0;
	background-color: rgb(255, 200, 188);
}

#top > div,
#top > h1,
#top > h2
{
	position:absolute;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: 50%;
}

#top_1,
#top_2,
#top_3,
#top_4
{
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}


#top_1,
#top_2
{
	filter: drop-shadow(0 .25vw .25vw rgb(255, 200, 188)) drop-shadow(0 -.25vw .25vw rgb(255, 200, 188)) drop-shadow(.25vw 0 .25vw rgb(255, 200, 188)) drop-shadow(-.25vw 0 .25vw rgb(255, 200, 188));
}

#top_bg
{
	aspect-ratio: 2500 / 2044;
	top: 0;
	right: min(45%, calc(80vh * 125 / 910 + 4%));
	width: min(70%, calc(80vh * 2500 / 2044));
	background-image: url(../_img/teaser_v2/bg.webp);
}

#top_1
{
	aspect-ratio:125 / 910;
	width: min(30vw, calc(94vh * 125 / 910));
	top: 2vh;
	right: 2vw;
	background-image: url(../_img/teaser_v2/top_l_1.svg?20260119);

	transition-delay: 1.5s;
}

#top_2
{
	aspect-ratio:1180 / 150;
	width: min(80vw, calc(12vh * 1180 / 150));
	bottom: 2vw;
	left: 2vw;
	background-image: url(../_img/teaser_v2/top_2.svg);
	
	transition-delay: 1.25s;
}

#top_3
{
	aspect-ratio:2000 / 1222;
	width: min(70%, calc(80vh * 2000 / 1222));
	top: 0vw;
	left: 0vw;
	background-image: url(../_img/teaser_v2/logo.webp);
	
	transition-delay: 0.75s;
}


/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// 開催概要 //////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#foreword
{
	padding-top: max(3rem, 5vw);
	padding-bottom: max(3rem, 5vw);
}

#foreword .title
{
	font-size: clamp(1.5rem, 5vw, 3rem);
	margin-bottom: 1em;
}

#foreword .title h1
{
	font-size: 1em;
	display: flex;
	flex-wrap: wrap;
}

#foreword .title p
{
	font-size: .8em;
}

#foreword .copy
{
	font-size: clamp(1.1rem, 2vw, 1.5rem);
}

#foreword .copy > div + div
{
	margin-top: .5em;
}

#foreword .writer
{
	text-align:right;
	margin-top:2em;
	font-size: .8em;
}

#overview
{
	border-top: 1px solid;
	padding-top: 4em;
	margin-top: 4em;
	font-size: clamp(1rem, 2vw, 1.2rem);
}

#overview p
{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
}

#overview p + p
{
	margin-top: .5em;
}

#overview p > span
{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
}

#overview p > span:nth-of-type(1)
{
	font-size: .9em;
}

#overview p > span > span + span
{
	font-size: max(.9em, .8rem);
}

#overview p > span:nth-of-type(1):after
{
	content: "｜";
}

/**********************************************************************/
/******************************* NEWS *********************************/
/**********************************************************************/

#news
{
	padding: 0 1rem;
}

#news .sec_title
{
	display: flex;
	flex-direction: column;
	align-items: center;
}

#news .sec_title > a
{
	font-size: .8rem;
	padding: .25em 1em;
}

#news > div
{
	padding-top: 2rem;
	padding-bottom: 2rem;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	background-color: rgb(255, 255, 255);
	border-radius: .5em;
}

#news .cont
{
	width:calc(100% - max(10vw, 7rem));
}

#news table
{
	width: 100%;
}

#news .cont a.news
{
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap:wrap;
	
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

#news td
{
	padding: .5em 0;
}

#news tr + tr td
{
	border-top: 1px solid rgb(240, 240, 240);
}
#news .cont .date
{
	font-size: .9em;
	margin-right: 1em;
	transform: translateY(.2em);
	white-space: nowrap;
}

#news .cont .date span:nth-of-type(1):after
{
	content:"|";
	padding: 0 .5em;
}

#news .cont .title
{
	font-size: 1rem;
	flex-grow: 1;
	display:flex;
	justify-content: space-between;
	align-items:flex-end;
	flex-wrap:nowrap;
}

#news .cont .news .title:after
{
	font-family: f-icons;
	font-weight: 400;
	font-size: 1.1em;
	content: "\f198";
	transform: translateX(-.5em);
	transition: all .3s ease;
	margin-left: 1em;
}

body:not(.touch) #news .cont a.news:hover .title:after
{
	transform: translateX(0);
}

/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// 公募内容 //////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#koubo
{
	margin-top: max(3rem, 5vw);
	padding-bottom: max(3rem, 5vw);
	background-color: rgb(255, 255, 255);
}

#koubo figure
{
	width: 100%;
	height: calc(100vw * 2 / 5);
}

#koubo figure img
{
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit:cover;
	object-position: 50% 100%;
}

#koubo figure h2
{
	display: inline-block;
	font-size: clamp(1.2rem, 3vw, 2rem);
	padding: .5em 1em;
	top: 1em;
	background-color: rgb(255, 255, 255);
}

#koubo .copy
{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	margin-top: -1vw;
}

#koubo .copy > div
{
	writing-mode: tb;
	font-size: clamp(1.2rem, 5vw, 1.7rem);
	margin-bottom: 5em;
}

#koubo .copy h2
{
	transform: translateY(-1em);
	font-size: 2em;
	margin-left: .5em;
}

#koubo .copy p._1 + p._1,
#koubo .copy p._3
{
	margin-right: .5em;
}

#koubo .copy p._1,
#koubo .copy p._2,
#koubo .copy p._3
{
	transform: translateY(1em);
}

#koubo .body,
#koubo .link
{
	font-size: clamp(1.1rem, 3vw, 1.5rem);
}

#koubo .body
{
	margin-bottom: 2em;
}

#koubo .link > a > span > span
{
	font-size: max(.8rem, .7em);
}

#koubo .link > p
{
	font-size: .9em;
	margin-bottom: 1em;
}

/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// 開催目的 //////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#purpose
{
	padding-top: max(3rem, 5vw);
	padding-bottom: max(3rem, 5vw);
	font-size: clamp(1.1rem, 3vw, 1.3rem);
}

#purpose .sec + .sec
{
	margin-top: 1em;
}

/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// 開催エリア //////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#area
{
	padding-top: max(3rem, 5vw);
	padding-bottom: max(3rem, 5vw);
	font-size: clamp(1.1rem, 3vw, 1.3rem);
}

#area h3
{
	margin-bottom: 1em;
}

#area figure
{
	width: 100%;
	max-width: 1100px;
	aspect-ratio: 700 / 375;
	background-image: url(../_img/teaser_v2/area_l.svg);
	background-size: cover;
}

/*//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////// 南飛騨 ////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/

#minamihida-artdiscovery
{
	padding-top: max(3rem, 5vw);
	padding-bottom: max(3rem, 5vw);
	font-size: clamp(1.1rem, 3vw, 1.3rem);
}

#minamihida-artdiscovery .minamihida_logo
{
	width: 100%;
	max-width: 20rem;
}
#minamihida-artdiscovery .minamihida_logo > img
{
	width: 100%;
	height: auto;
	margin-bottom: 1em;
}

#minamihida-artdiscovery .link
{
	width: 100%;
	margin-bottom: 2em;
}

#minamihida-artdiscovery .overview p
{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
}

#minamihida-artdiscovery .overview p + p
{
	margin-top: .5em;
}

#minamihida-artdiscovery .overview p span:nth-of-type(1)
{
	font-size: max(.8em, .9rem);
	white-space: nowrap;
}

#minamihida-artdiscovery .overview p span:nth-of-type(1):after
{
	content: "｜";
}

#minamihida-artdiscovery h3
{
	margin-bottom: 1em;
}

#minamihida-artdiscovery h3 .credit
{
	margin-left: 2em;
	font-size: max(.5em, .8rem);
}

#minamihida-artdiscovery .photo_wrapper
{
	padding: max(4rem, 4vw) 0 max(2rem, 3vw);
}

#minamihida-artdiscovery .photo_wrapper + .photo_wrapper
{
	padding-top: 0;
}

#minamihida-artdiscovery .photo
{
	display: flex;
	flex-wrap: wrap;
	margin: -1rem;
}

#minamihida-artdiscovery .photo figure
{
	width: calc(100% / 3 - 2rem);
	margin: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}

#minamihida-artdiscovery .photo figure img
{
	width: 100%;
	height: auto;
}

#minamihida-artdiscovery figcaption
{
	margin-top: 1em;
	font-size: max(.5em, .8rem);
}


/*//////////////////////////////////////////////////////////////////////////////////
///////////////////////////////// MEDIA SCREEN ////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////*/


@media screen and (orientation: portrait)
{
	#top_bg
	{
		aspect-ratio: 2500 / 2044;
		top: auto;
		bottom: min(calc(700px * 185 / 700 + 2vh + calc(100% - 4vw) * 150 / 1180), calc(96vw * 185 / 700 + 2vh + calc(100% - 4vw) * 150 / 1180));
		right: 0;
		width: min(100%, calc(50vh * 2500 / 2044));
		background-image: url(../_img/teaser_v2/bg.webp);
	}
	
	#top_1
	{
		aspect-ratio:700 / 185;
		width: min(700px, calc(100% - 4vw));
		bottom: 2vh;
		left: 2vw;
		right: auto;
		top: auto;
		background-image: url(../_img/teaser_v2/top_p_1.svg?20260119);
	}
	
	#top_2
	{
		width: calc(100% - 4vw);
		bottom: min(calc(700px * 185 / 700 + 4vh), calc(96vw * 185 / 700 + 4vh));
	}
	
	#top_3
	{
		aspect-ratio:2000 / 1222;
		width: min(100%, calc(50vh * 2000 / 1222));
	}
}

@media screen and (max-width: 900px)
{
	#news > div
	{
		flex-direction: column;
		align-items: flex-start;
	}
	#news .sec_title
	{
		flex-direction:row;
		flex-wrap: wrap;
		margin-bottom: 1rem;
	}
	
	#news .sec_title > h2
	{
		margin-right: 1em;
	}
	
	#news .cont
	{
		width:100%;
	}
	
	#minamihida-artdiscovery .photo figure
	{
		width: calc(100% / 2 - 2rem);
	}
}

@media screen and (max-width: 800px)
{
	#area figure
	{
		margin: 0 auto;
		max-width: 300px;
		aspect-ratio: 350 / 1550;
		background-image: url(../_img/teaser_v2/area_p.svg);
	}
}

@media screen and (max-width: 650px)
{
	#news td
	{
		display: block;
		width: 100%;
		border
		padding: .5em 0;
	}

	#news tr + tr td
	{
		border-top-width: 0px;
	}
	
	#news td:nth-of-type(1)
	{
		border-top: 1px solid rgb(240, 240, 240);
		padding-bottom: 0;
	}
	#news td:nth-of-type(2)
	{
		padding-bottom: .5em;
	}

	#minamihida-artdiscovery .photo figure
	{
		width: calc(100% / 1 - 2rem);
	}
}

@media screen and (max-width: 500px)
{
	#koubo figure
	{
		height: calc(100vw * 2 / 3);
	}
}