@charset "UTF-8";


/* --------------------
header
-------------------- */

header{
	background:#fff;
	width:100%;
	min-width:1024px;
	border-bottom:1px solid #004899;
	position:fixed;
	top:0;
	left:0;
	z-index:1000;
}

header > .inner{
	background:#fff;
	width:800px;
	margin:0 auto;
	padding:18px 0;
}

nav ul li{
	width:159px;
	padding:5px;
	text-align:center;
	border-left:1px solid #004899;
}
nav ul li:last-of-type{
	border-right:1px solid #004899;
}

nav ul li a{
	width:90%;
	margin:0 auto;
	padding:5px;
	display:block;
	font-size:2.0rem;
}
nav ul li a:hover{
	background:#e6eaf2;
	text-decoration:none;
}
nav ul li a p{
	margin:0 0 4px;
	color:#004899;
	font-weight:700;
}
nav ul li a img{
	width:13px;
	height:auto;
}
nav ul li a:hover img{
	opacity:1;
}

.menuBtn{
	width:34px;
	height:36px;
	display:none;
	position:absolute;
	top:15px;
	right:15px;
	cursor:pointer;
	z-index:110;
}


@media only screen and (max-width:1023px){

	header{
		min-width:100%;
		border-bottom:none;
	}

	header > .inner{
		width:100%;
		padding:0;
	}

	.menuBtn{
		background:#fff;
		display:block;
		padding:6px;
		border:1px solid #004899;
	}
	.menuBtn span{
		background:#004899;
		width:30px;
		height:4px;
		margin:0 auto;
		display:block;
		position:absolute;
		left:8px;
		-webkit-transition:.35s ease-in-out;
		-moz-transition:.35s ease-in-out;
		transition:.35s ease-in-out;
	 }
	.menuBtn span:nth-child(1) {
		top:11px;
	}
	.menuBtn span:nth-child(2) {
		top:22px;
	}
	.menuBtn span:nth-child(3) {
		top:33px;
	}

	.open .menuBtn span:nth-child(1) {
		top:22px;
		-webkit-transform:rotate(315deg);
		-moz-transform:rotate(315deg);
		transform:rotate(315deg);
	}
	.open .menuBtn span:nth-child(2) {
		width:0;
		left:50%;
	}
	.open .menuBtn span:nth-child(3) {
		top:22px;
		-webkit-transform:rotate(-315deg);
		-moz-transform:rotate(-315deg);
		transform:rotate(-315deg);
	}

	nav{
		position:absolute;
		top:-1000px;
		width:100%;
		-webkit-transition:.5s ease-in-out;
		-moz-transition:.5s ease-in-out;
		transition:.5s ease-in-out;
	}
	.open nav {
		background:#004899;
		width:100%;
		height:100vh;
		margin:0;
		display:block;
		position:fixed;
		top:0;
		left:0;
	}

	nav{
		width:100%;
		padding:0;
	}

	nav ul{
		margin:100px 0 0;
		display:block;
		flex-wrap:wrap;
		-webkit-flex-wrap:wrap;
		text-align:left;
	}
	nav ul li{
		background:#fff;
		width:100%;
		padding:0;
		display:block;
		position:relative;
		border-right:none;
		border-top:1px solid #004899;
	}
	nav ul li:last-of-type{
		border-bottom:1px solid #004899;
	}

	nav ul li a{
		padding:20px;
	}
	nav ul li a::after{
		content:"";
		background:url(../img/icon_sp_arrow.svg) no-repeat;
		width:30px;
		height:30px;
		position:absolute;
		top:0;
		right:20px;
		bottom:0;
		margin:auto;
	}
	nav ul li a:hover{
		background:none;
	}

	nav ul li a p{
		color:#000;
	}

}



@media screen and (min-width:737px) and (max-width:1023px){

	.menuBtn{
		padding:10px;
	}
	.menuBtn span{
		width:65%;
		left:10px;
	 }
	.menuBtn span:nth-child(1) {
		top:15px;
	}
	.menuBtn span:nth-child(2) {
		top:26px;
	}
	.menuBtn span:nth-child(3) {
		top:37px;
	}

	.open .menuBtn span:nth-child(1) {
		top:26px;
	}
	.open .menuBtn span:nth-child(3) {
		top:26px;
	}

}


@media only screen and (max-width:736px){}



/* --------------------
main
-------------------- */


/* --------------------
mainVisual
-------------------- */

.mainVisual{
	background:#004899;
	width:100%;
	min-width:1024px;
	margin:100px auto 0;
	padding:0 0 100px;
}
.mainVisual img{
	width:100%;
	height:auto;
}

.mainVisual .lead{
	margin:100px auto 0;
	text-align:center;
}
.mainVisual .lead .ttl{
	background:linear-gradient(90deg, #5bff36 15%, #06b1ff 65%);
	color:transparent;
	-webkit-background-clip:text;
	background-clip:text;
	-webkit-text-fill-color:transparent;
	text-fill-color:transparent;

	margin:0 0 50px;
	font-size:4.0rem;
	font-weight:700;
}
.mainVisual .lead .txt{
	font-size:2.0rem;
	font-weight:400;
	color:#fff;
	line-height:1.6;
}
.mainVisual .lead span{
	letter-spacing:-0.2em;
}


@media only screen and (max-width:1023px){

	.mainVisual{
		min-width:100%;
		margin:0 auto;
		padding:0 0 60px;
	}

	.mainVisual .lead{
		margin:60px auto 0;
	}
	.mainVisual .lead .ttl{
		font-size:2.8rem;
	}
	.mainVisual .lead .txt{
		width:90%;
		margin:0 auto;
		font-size:1.7rem;
		line-height:1.7;
	}

}


@media screen and (min-width:737px) and (max-width:1023px){

	.mainVisual .lead .ttl{
		font-size:3.5rem;
		font-size:clamp(3.0rem, 3.42vw, 3.5rem);
	}
	.mainVisual .lead .txt{
		width:80%;
		font-size:1.8rem;
		line-height:1.8;
	}

}



/* --------------------
block common
-------------------- */

.block_wrap{
	background:#fff;
	width:100%;
	min-width:1024px;
	padding:100px 0;
	box-sizing:border-box;
}
.bg_lbl{
	background:#e6eaf2;
}

.block_wrap .inner{
	width:800px;
	margin:0 auto;
}

.block_wrap .ttl{
	margin:0 0 100px;
}

.block_wrap h2,
.block_wrap h3{
	position:relative;
	font-weight:700;
	color:#004899;
	text-align:center;
	line-height:1;
}
.block_wrap h2{
	margin:50px 0 0;
	font-size:3.6rem;
	z-index:10;
}
.block_wrap h2::after{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	font-family:"League Gothic", sans-serif;
	font-size:18.0rem;
	color:#e6eaf2;
	white-space:nowrap;
	z-index:-1;
}

.block_wrap h2 span{
	margin:10px 0 0;
	display:block;
	font-size:2.4rem;
}

.block_wrap .subttl{
	margin:60px auto 30px;
	text-align:center;
}
.block_wrap h3{
	padding:0 30px 4px;
	display:inline;
	font-size:2.8rem;
	background:linear-gradient(transparent 55%, #e6eaf2 50%);
}

.block_wrap .box{
	background:#fff;
	padding:50px;
	border:1px solid #004899;
	border-radius:30px;
}
.block_wrap .box p{
	line-height:1.6;
}

.block_wrap table{
	width:100%;
	border:1px solid #004899;
	vertical-align:middle;
}
.block_wrap th{
	background:#004899;
	padding:18px;
	font-weight:700;
	color:#fff;
	text-align:center;
	border:1px solid #004899;
}
.block_wrap td{
	padding:18px;
	border:1px solid #004899;
}
.block_wrap td span{
	margin:10px 0 0;
}
/*.block_wrap td .date_pd{
	margin:0;
	padding:0 0 0 4.8em;
	display:block;
}*/

.block_wrap .tbL th{
	border-bottom:1px solid #fff;
}
.block_wrap .tbL tr:last-of-type th{
	border-bottom:1px solid #004899;
}

.block_wrap .tbT th{
	border-right:1px solid #fff;
}
.block_wrap .tbT th:last-of-type{
	border-right:1px solid #004899;
}

.block_wrap .note{
	font-size:1.5rem;
}
.block_wrap .note .li_asterisk{
	margin:40px 0 0;
}

.block_wrap .note .li_asterisk li{
	padding:0 0 0 1.5rem;
	position:relative;
}
.block_wrap .note .li_asterisk li::before{
	content:'※';
	position:absolute;
	left:0;
	font-size:1.5rem;
}

.block_wrap .li_disc{
	list-style-type:disc;
	padding:0 0 0 20px;
}
.block_wrap .li_disc dt,
.block_wrap .li_disc dd{
	display:inline;
	line-height:1.6;
}
.block_wrap .li_disc dt{
	padding:0 20px 0 0;
	font-weight:700;
}

.block_wrap .li_decimal{
	list-style-type:decimal;
	padding:0 0 0 20px;
}

.block_wrap .note .li_asterisk li,
.block_wrap .li_disc li,
.block_wrap .li_decimal li{
	margin:0 0 20px;
	line-height:1.6;
}
.block_wrap .note .li_asterisk li:last-of-type,
.block_wrap .li_disc li:last-of-type,
.block_wrap .li_decimal li:last-of-type{
	margin:0;
}


@media only screen and (max-width:1023px){

	.block_wrap{
		min-width:100%;
		padding:60px 0;
	}

	.block_wrap .inner{
		width:90%;
	}

	.block_wrap .ttl{
		margin:0 0 60px;
	}

	.block_wrap h2{
		margin:25px 0 0;
		font-size:3.0rem;
	}
	.block_wrap h2::after{
		font-size:10.0rem;
	}

	.block_wrap h2 span{
		font-size:2.0rem;
	}

	.block_wrap h3{
		font-size:2.4rem;
	}

	.block_wrap .box{
		padding:20px;
		border-radius:20px;
	}

	.block_wrap .tb_sp_scroll{
		padding:0 0 15px;
		overflow:scroll;
	}
	.block_wrap .tb_scroll_txt{
		margin:0 0 20px;
		font-size:1.5rem;
		font-weight:700;
	}
	.block_wrap .tb_sp_scroll table{
		width:800px;
	}

	.block_wrap table{
		border:none;
	}
	.block_wrap table.tb_sp,
	.block_wrap .tb_sp tbody,
	.block_wrap .tb_sp tr,
	.block_wrap .tb_sp td,
	.block_wrap .tb_sp th{
		width:100%;
		display:block;
		box-sizing:border-box;
	}
	.block_wrap th{
		padding:14px;
	}

	.block_wrap .tbL th{
		border-bottom:none;
	}
	.block_wrap .tbL tr:last-of-type th{
		border-bottom:none;
	}

	.block_wrap .tbT th{
		border-right:none;
	}
	.block_wrap .tbT th:last-of-type{
		border-right:none;
	}

	.block_wrap .tb_sp_scroll th{
		border-bottom:1px solid #fff;
	}
	.block_wrap .tb_sp_scroll tr:last-of-type th{
		border-bottom:1px solid #004899;
	}

	.block_wrap .tb_sp_scroll th{
		border-right:1px solid #fff;
	}
	.block_wrap .tb_sp_scroll th:last-of-type{
		border-right:1px solid #004899;
	}

	.block_wrap .note .li_asterisk{
		margin:20px 0 0;
	}
	.block_wrap .li_disc dt,
	.block_wrap .li_disc dd{
		display:block;
	}
	.block_wrap .li_disc dt{
		padding:0 0 5px;
	}


}


@media screen and (min-width:737px) and (max-width:1023px){

	.block_wrap .inner{
		width:80%;
	}

	.block_wrap .ttl{
		margin:0 0 80px;
	}
	.block_wrap h2{
		font-size:3.3rem;
	}
	.block_wrap h2::after{
		font-size:12.0rem;
	}

	.block_wrap .box{
		padding:35px;
		border-radius:30px;
	}

	.block_wrap .tb_sp_scroll table{
		width:100%;
		min-width:800px;
	}

}


@media only screen and (max-width:736px){}




/* --------------------
outline
-------------------- */

#outline h2::after{
	content:'OUTLINE';
}


@media only screen and (max-width:1023px){}


@media only screen and (max-width:736px){}



/* --------------------
guidelines
-------------------- */

#guidelines h2::after{
	content:'GUIDELINES';
	color:#fff;
}


@media only screen and (max-width:1023px){}


@media only screen and (max-width:736px){}



/* --------------------
program
-------------------- */

#program h2::after{
	content:'PROGRAM';
}

.timetable dl{
	padding:20px 80px;
	border-top:1px solid #004899;
}
.timetable dl:last-of-type{
	border-bottom:1px solid #004899;
}
.timetable dt{
	width:150px;
	font-family:"League Gothic", sans-serif;
	font-size:6.0rem;
	color:#7bc379;
}
.timetable dd{
	width:500px;
	font-weight:700;
	line-height:1.6;
}



@media only screen and (max-width:1023px){

	#program h2{
		margin:0;
	}
	.block_wrap h2 span{
		margin:5px 0 0;
	}

	.timetable dl{
		padding:20px 25px;
		border-top:1px solid #004899;
	}
	.timetable dt{
		width:35%;
		font-size:5.2rem;
	}
	.timetable dd{
		width:65%;
	}

}

@media screen and (min-width:737px) and (max-width:1023px){

	.timetable dl{
		padding:20px 10%;
	}
	.timetable dt{
		width:25%;
	}
	.timetable dd{
		width:75%;
	}

}


@media only screen and (max-width:736px){}



/* --------------------
notice
-------------------- */

#notice{
	position:relative;
	overflow:hidden;
	z-index:10;
}
#notice:after{
	content:'';
	background:url(../img/bg_ball.svg) no-repeat right top / 950px;
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	top:-50px;
	right:-250px;
	z-index:-100;
}

#notice h2::after{
	content:'NOTICE';
	color:#fff;
}

#notice h3{
	background:none;
	margin:60px 0 30px;
	padding:0;
	display:block;
	font-size:1.8rem;
	font-weight:700;
	color:#000;
	text-align:center;
}

#notice .btn_area{
	margin:40px 0 0;
	text-align:center;
}
#notice .btn_area p{
	margin:0 0 30px;
	font-size:1.6rem;
}
#notice .btn_area a{
	background:#004899;
	width:500px;
	height:100px;
	margin:0 auto;
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	font-size:3.6rem;
	font-weight:700;
	color:#fff;
	line-height:1;
	letter-spacing:0.4em;
	border-radius:50px;

	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
#notice .btn_area a::after{
	content:"";
	background:url(../img/icon_arrow_wh.svg) no-repeat;
	width:15px;
	height:25px;
	position:absolute;
	top:50%;
	right:5%;
	transform:translate(-50%, -50%);
}
#notice .btn_area a:hover{
	opacity:0.4;
	text-decoration:none;
}



@media only screen and (max-width:1023px){

	#notice:after{
		background:url(../img/bg_ball.svg) no-repeat right top / 100%;
		top:-30px;
		right:-130px;
	}

	#notice .btn_area p{
		margin:0 0 15px;
	}
	#notice .btn_area a{
		width:90%;
		height:80px;
		font-size:3.0rem;
		border-radius:40px;
	}

}


@media only screen and (max-width:736px){

	#notice .box{
		padding:20px 20px 30px;
	}

}



/* --------------------
sponsor
-------------------- */

#sponsor{
	padding:60px 0 30px;
}

#sponsor .ttl{
	margin:0;
}
#sponsor .inner div:nth-child(3){
	margin:60px 0 0;
}
#sponsor .ttl p{
	font-size:2.0rem;
	font-weight:700;
	color:#004899;
	text-align:center;
	line-height:1;
}

#sponsor .bnr_area{
	display:flex;
	justify-content:center;
	align-items:center;
}
#sponsor .bnr_area a{
	display:block;
}

#sponsor .inner div:nth-child(4) a:nth-of-type(1),
#sponsor .inner div:nth-child(4) a:nth-of-type(2){
	margin:0 10px 0 0;
}


@media only screen and (max-width:1023px){

	#sponsor .bnr_area{
		width:90%;
		margin:0 auto;
	}
	#sponsor .bnr_area a{
		display:block;
	}

	#sponsor .bnr_area img{
		width:100%;
		height:auto;
	}

}


@media only screen and (max-width:736px){}



/* --------------------
contact
-------------------- */

#contact h2::after{
	content:'CONTACT';
	color:#fff;
}

#contact .box dl{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
#contact .box dt,
#contact .box dd{
}
#contact .box dt{
	width:220px;
	padding:20px 30px 20px 0;
	font-weight:700;
	line-height:1.6;
}
#contact .box dd{
	width:480px;
	padding:20px 0 20px 30px;
	border-left:1px solid #004899;
}
#contact .box dd p{
	margin:15px 0 0;
	font-size:1.5rem;
	line-height:1.6;
}



@media only screen and (max-width:1023px){

	#contact .box dl{
		flex-wrap:wrap;
		-webkit-flex-wrap:wrap;
	}
	#contact .box dt{
		width:100%;
		padding:0 15px 20px;
		text-align:center;
	}
	#contact .box dd{
		width:100%;
		padding:20px 15px 0;
		line-height:1.6;
		border-left:none;
		border-top:1px solid #004899;
	}

}


@media only screen and (max-width:736px){}



/* --------------------
footer
-------------------- */

footer{
	background:#004899;
	padding:30px 20px;
	color:#fff;
}
footer p{
	font-size:1.2rem;
	text-align:center;
}

.pagetop{
	position:fixed;
	bottom:30px;
	right:30px;
	z-index:500;
}
.pagetop a{
	width:55px;
	height:55px;
	display:block;
}
.pagetop a img{
	width:100%;
	height:auto;
}



@media only screen and (max-width:1023px){

	.pagetop{
		bottom:25px;
		right:15px;
	}
	.pagetop a:hover img{
		opacity:1;
	}

}


@media only screen and (max-width:736px){

	footer{
		padding:20px 10px;
	}

	.pagetop{
		bottom:35px;
		right:15px;
	}

}