@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
:root {
	--box-bg-color: #fff;
}



@media (min-width:481px) {
	.sponly {
		display: none;
	}
}


html { 
	font-size: 62.5%;
}
body {
	margin: 0;
	padding: 0;
	font-family: 'Noto Sans JP', sans-serif;
	color: #1a1a1a;
	font-size: calc(1.4em + 0.25vw);
	background-color: #fff;
	position: relative;
}
@media (min-width:1200px) {
	body {font-size: 17px;}
}
@media (max-width:320px) {
	body {font-size: 14px;}
}
a {
	text-decoration: none;
	/*color: #e60012;*/
	color: #0068b7;
}




#parallax {
	position: relative;
}
#parallax_img {
	position: fixed;
	z-index: -1;
	top: 0;
    background-position: center top;
    background-repeat: no-repeat;
    background-image: url("../img/bg.jpg");
	/*opacity: .2;*/
}
@media (orientation:portrait) {
	/*縦長*/
	#parallax_img {
 		width: 100vw;
		height: 200vh;
    	background-size: auto 100%;
	}
}
@media (orientation:portrait) and (min-width:1000px) {
	/*縦長*/
	#parallax_img {
 		width: calc(100vw - 200px);
	}
}
@media (orientation: landscape) {
	/*横長*/
	#parallax_img {
 		width: 100vw;
		height: calc(45 / 35 * 100vw);
    	background-size: auto 100%;
	}
}
@media (orientation: landscape) and (min-width:1000px) {
	/*横長*/
	#parallax_img {
 		width: calc(100vw - 200px);
	}
}
#container {
	position: relative;
	/*width: calc(89.72vw);*/
	padding: 5.34vw 5.34vw 70px;
}
@media (max-width:999px) {
	button.lity-close {
		background-color: #000;
		transition: .3s all;
	}
	.lity-content {
		background-color: rgba(0,0,0,1);
	}
	#nav {
		padding: 10vw;
	}
	#nav .wrap ul:not(.social) {
		margin-bottom: 60px;
	}
	#nav .wrap ul:not(.social) li {
		margin-bottom: 15px;
	}
	#nav .wrap ul:not(.social) li a {
		text-align: center;
	}
	#nav .wrap ul:not(.social) li a .en {
		font-family: elevon, sans-serif;
		font-weight: 600;
		text-decoration: none;
		font-size: min(50px, 10vw);
		color: #fff;
	}
	#nav .wrap ul:not(.social) li a .jp {
		text-decoration: none;
		display: block;
		font-size: min(20px, 4vw);
		margin-top: -.8em;
		color: #fff;
	}
	#nav .wrap ul.social {
		display: flex;
		justify-content: center;
	}
	#nav .wrap ul.social li {
		width: 40px;
		height: 40px;
		margin: 0 10px;
	}
	#nav .wrap ul.social li .btn {
		padding: 5px;
	}
	#nav .wrap ul.social li .btn.fb {
		padding: 0;
	}
}
@media (max-width:599px) {
	.btnbox {
		position: fixed;
		right: 0;
		top: 0;
		will-change: transform;
		z-index: 100;
	}
}
@media (min-width:600px) {
	#container {
		/*width: calc(100% - 100px);*/
		padding: 50px;
	}
	.btnbox {
		position: fixed;
		right: 0;
		top: 0;
		will-change: transform;
	}
}
@media (min-width:1000px) {
	#container {
		width: calc(100% - 200px);
		padding: 50px;
	}
	.btnbox {
		display: none;
	}
	#nav.lity-hide {
		display: block;
	}
	#nav {
		position: fixed;
		top: 0;
		right: 0;
		height: 100vh;
		width: 200px;
		background-color: #1a1a1a;
		will-change: transform;
	}
	#nav .wrap {
		position: relative;
		height: 100vh;
	}
	#nav .wrap ul {
		padding-top: 100px;
	}
	#nav .wrap ul:not(.social) li {
		margin-bottom: 30px;
		margin-left: 20px;
		position: relative;
	}
	#nav .wrap ul:not(.social) li a {
		text-decoration: none;
	}
	#nav .wrap ul:not(.social) li a p {
		transition: .3s all;
	}
	#nav .wrap ul:not(.social) li a .en {
		font-family: elevon, sans-serif;
		font-weight: 600;
		text-decoration: none;
		font-size: 20px;
		color: #fff;
		position: relative;
		display: inline-block;
	}
	#nav .wrap ul:not(.social) li.now a .en::before {
		content: "";
		display: block;
		width: calc(100% + 20px);
		height: 1px;
		position: absolute;
		background-color: #fff;
		left: -20px;
		bottom: 0;
	}
	#nav .wrap ul:not(.social) li a .jp {
		text-decoration: none;
		display: block;
		font-size: 14px;
		color: #fff;
	}
	#nav .wrap ul:not(.social) li a:hover .en,
	#nav .wrap ul:not(.social) li a:hover .jp {
		color: #f39800;
	}
	#nav .wrap ul.social {
		position: absolute;
		bottom: 30px;
		display: flex;
		padding: 0 20px;
	}
	#nav .wrap ul.social li {
	}
}




#header .ct,
#main .ct {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}
#header .ct > h1 {
	width: 26%;
	max-height: 100px;
}
#header .contentstitle {
	text-align: center;
}
@media (max-width:480px) {
	#header .contentstitle {
		padding-top: 30px;
	}
}
#header .contentstitle h1,
#main h2 {
	font-family: elevon, sans-serif;
	font-weight: 600;
	font-size: min(270%, 10vw);
	color: #0068b7;
}
#header .contentstitle p {
	font-weight: 500;
}
#main h2 span {
	font-weight: 500;
	font-size: calc(100 / 320 * 100%);
	display: inline-block;
	padding-left: 1em;
}
#main .titlebox {
	display: flex;
	align-items: flex-end;
	line-height: 1;
	margin-bottom: 15px;
}
#main .titlebox p {
	display: inline-block;
	padding-bottom: 7px;
	padding-left: 15px;
	color: #1a1a1a;
}



#main .ct {
	padding: 60px 0;
}
#main h3 {
	text-align: center;
	font-size: 160%;
	font-weight: 600;
	margin-bottom: 1em;
}



#past ul {
	width: 100%;
    display:flex;
    flex-wrap:wrap;
	margin-bottom: 0em;
	justify-content: space-between;
}
#past ul li {
	width: calc((100% - 3em) / 4);
	text-align: center;
	font-size: 60%;
	line-height: 120%;
	margin-bottom: 1em;
}
#past ul li a {
	background-color: rgba(255,255,255,1);
	display: block;
	padding: 1em;
	border-radius: 0.3em;
}
@media screen and (max-width:640px) {
	#past ul li {
		width: calc((100% - 1.5em) / 2);
	}
}
#past ul li a img {
	margin-bottom: 5px;
}



.social {
	display: flex;
	justify-content: space-between;
}
.social li {
	width: calc((100% - 40px) / 3);
}
/*ソーシャルボタン*/
.btn {
	display: block;
	line-height: 0;
	margin: 0;
	padding: 5px;
	border-radius: 3px;
	text-decoration: none;
	text-align: center;
}
.twitter{background: #55acee;}
.fb{background: #3b5998;}
.line{background: #09B701;}



#footer {
	text-align: center;
	font-size: 60%;
	color: #666;
}
#footer #link {
	margin: 0 auto 30px;
}
#footer #link ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 15px;
}
#footer #link ul li {
	margin-bottom: 5px;
}
@media(min-width: 481px){
	#footer #link {
		max-width: 1018px;
	}
	#footer #link ul {
	}
	#footer #link ul li {
		width:calc(100% / 3 - 20px);
		margin: 0 10px;
	}
}
#footer #link ul li a {
	padding: 5px 10px;
	background-color: #fff;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#footer #attention {
	margin-bottom: 15px;
}
#footer #corporatelink ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 15px;
}
#footer #corporatelink ul li a {
	color: #666;
}
@media (max-width:480px) {
	#footer #corporatelink ul {
		margin-bottom: 5px;
	}
	#footer #corporatelink ul li {
		width: 100%;
		margin-bottom: 10px;
	}
	#footer #corporatelink ul li a {
		display: block;
		width: 50%;
		margin: 0 auto;
		border: 1px solid #666;
		border-radius: 2px;
		padding: 2px 0;
		text-align: center;
		text-decoration: none;
	}
}
@media (min-width:481px) {
	#footer #corporatelink ul li {
		padding: 0 10px;
	}
	#footer #corporatelink ul li:first-child {
		border-right: 1px solid #666;
	}
	#footer #corporatelink ul li:last-child {
		border-left: 1px solid #666;
	}
	#footer #copyright {
		padding: 0 100px;
	}
}
#footer #copyright span {
	display: inline-block;
	padding: 0 5px;
}



/*ページ上へのリンク*/
#page-top {
    position: fixed;
    bottom: 20px;
    font-size: 70%;
	z-index: 400;
}
@media (max-width:899px) {
	#page-top {
	    right: 20px;
	}
}
@media (min-width:900px) {
	#page-top {
	    right: 220px;
	}
}
#page-top a {
	background-color: rgba(102,102,102,0.60);
	text-decoration: none;
	color: #fff;
	padding: 1em;
	text-align: center;
	display: block;
	border-radius: 3px;
}
#page-top a:hover {
	color: rgba(0,0,0,1.00);
	text-shadow: 0px 0px 10px rgba(255,255,255,1.00);
	text-decoration: none;
	background-color: rgba(153,153,153,0.60);
}



#ftnavi {
	max-width: 1000px;
	margin: 0 auto;
	padding: 60px 0;
}
#ftnavi ul {
	display: flex;
	justify-content: space-between;
	font-size: 80%;
}
#ftnavi ul li a,
#ftnavi ul li span {
	padding: 0 20px 2px;
	background-color: #333;
	border-radius: 3px;
	transition: .3s all;
	color: #fff;
	position: relative;
	line-height: 1;
}
#ftnavi ul li a:hover {
	color: #fc3;
}
#ftnavi ul li:first-child a,
#ftnavi ul li:first-child span{
	padding-left: 25px;
}
#ftnavi ul li:first-child:not(.home) a::before,
#ftnavi ul li:first-child span::before{
	content: '〈';
	font-size: 60%;
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}
#ftnavi ul li:last-child a,
#ftnavi ul li:last-child span{
	padding-right: 25px;
}
#ftnavi ul li:last-child:not(.home) a::after,
#ftnavi ul li:last-child span::after{
	content: '〉';
	font-size: 60%;
	position: absolute;
	right: 5px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}
#ftnavi ul li span {
	background-color: #bbb;
}

.enq_title {
	font-size: min(140%, 4.5vw);
	font-weight: bold;
	text-align: center;
	margin-bottom: 5px;
}
.enq_title span {
	display: inline-block;
}
.enq_schedule {
	font-weight: bold;
	text-align: center;
}

.bnrlink {
	display: block;
	text-align: center;
	border-radius: 5em;
	padding: 10px 0;
	background-color: #000;
	line-height: 1;
	color: #fff;
	width: 90%;
	max-width: 600px;
	margin: 15px auto;
}
