/*----- nav -----*/
.nav_area{
	box-sizing:border-box;
	padding:20px 10px;
	width:230px;
	 background: rgba(50,116,186,.4); 
	/*background: linear-gradient(rgb(204,193,183) 0%, rgba(204,193,183,0.8) 100%);*/
	/* opacity: 0.8; */
	box-shadow: 0 0 5px rgb(0 0 0 / 30%);
}
nav{
	margin-bottom:30px;
	opacity: 1;
}
nav ul.main{
	box-sizing:border-box;
	margin:0;
	padding:0;
	width:100%;
}
nav ul.main li{
	margin-bottom:5px;
	list-style:none;
	box-shadow: 0 0 5px rgb(0 0 0 / 30%);
}
nav ul.main li:last-child{
	margin-bottom:0;
}
nav ul.main li a{
	position:relative;
	box-sizing:border-box;
	display:block;
	padding:.7em .2em .7em 1em;
	background-color:rgb(255,255,255);
	background:url(../img/common_deco02.svg) left .2rem center no-repeat rgb(255,255,255);
	background-position: 4px center,center;
	font-size:.937rem;
	font-weight:600;
	color: rgb(60,60,60);
	line-height:1.4;
	letter-spacing: -.03rem;
	text-decoration:none;
	transition:.2s ease-out;
	transition-property:background,border,color,box-shadow;
}



/*新規ページを作成したら↓に新規ページのクラス名を追加
　例） .（クラス名）　nav ul.main li a.(クラス名)*/
.home nav ul.main li a.home,
.message nav ul.main li a.message,
.overview nav ul.main li a.overview,
.program nav ul.main li a.program,
.cfa nav ul.main li a.cfa,
.registration nav ul.main li a.registration,
.participant nav ul.main li a.participant,
.performer nav ul.main li a.performer,
.access nav ul.main li a.access,
.sponsor nav ul.main li a.sponsor,

nav ul.main li a.current,
nav ul.main li a:hover{
	background-image:url(../img/common_deco01.svg);
	background-color:rgb(29,32,135);
	background-position:200px center,center;
	color:rgb(255, 255, 255);
}

nav ul.main li a.close{
	background-image:none;
	background-color:rgb(206,210,213);
	color:rgb(255,255,255);
}
nav ul.main li a.emphasis{
	background-image:none;
	background-color:rgb(29,32,135);
	box-shadow:0 0 4px rgba(0,0,0,.3);
	color:rgb(255,255,255);
}
nav ul.main li a.new::after{
	content:"NEW";
	font-size:.875rem;
	font-weight:700;
	color:rgb(250,80,80);
}
.nav_area .period{
	margin:15px auto;
	line-height:1.5;
	border:solid 2px rgb(207,0,14);
	border-radius:5px;
	text-align:center;
}
.nav_area .period .title{
	box-sizing:border-box;
	margin:0;
	padding:.4em .8em;
	background:rgb(234,56,27);
	color:rgb(255,255,255);
	font-size:.875rem;
	font-weight:500;
}
.nav_area .period .date{
	box-sizing:border-box;
	margin:0;
	padding:.6em .8em;
	background:rgb(255,255,255);
	color:inherit;
	font-size:.875rem;
	font-weight:700;
}
.nav_area .period .date .arrow{
	display:inline-block;
	border-width:.45em 0 .45em .8em;
	border-color:rgba(234,56,27,0) rgba(234,56,27,0) rgba(234,56,27,0) rgba(234,56,27,1);
	border-style:solid;
	vertical-align:-10%;
}
nav ul.banner{
	box-sizing:border-box;
	margin:10px 0 0;
	padding:0;
	width:100%;
}
nav ul.banner li{
	margin-bottom:4px;
	list-style:none;
}
nav ul.banner li:last-child{
	margin-bottom:0;
}
nav ul.banner li a{
	box-sizing:border-box;
	display:block;
	padding:0;
	background:none;
	border:none;
	box-shadow:0 0 4px rgb(0,0,0,.3);
	font-size:.812rem;
	text-decoration:none;
	text-align:center;
	transition:.2s ease-out;
	transition-property:opacity;
}
nav ul.banner li a img{
	width:100%;
	vertical-align:bottom;
}
	nav ul.banner li a:hover,
	nav ul.banner li a.current{
		opacity:.5;
	}
iframe {
    width: 210px;
		margin-top: 10px;
}

nav ul li a.external::after{
	content:"";
	display:inline-block;
	background:url(../img/icon_external_white.svg) center center no-repeat;
	background-size:cover;
	width:.8em;
	height:.8em;
	margin-left:.5em;
	transition:background .2s ease-out;
}
	nav ul li a.external:hover::after{
		content:"";
		display:inline-block;
		background:url(../img/icon_external_black.svg) center center no-repeat;
		background-size:cover;
	}