@charset "utf-8";


@font-face {
	font-family: 'LINE';
	src: url('../webfonts/LINESeedJP_OTF_Eb.woff') format('woff'),
			 url('../webfonts/LINESeedJP_OTF_Eb.ptf') format('opentype');
	font-weight: 700;
	font-style: normal;
}
@font-face {
	font-family: 'LINE';
	src: url('../webfonts/LINESeedJP_OTF_Rg.woff') format('woff'),
			 url('../webfonts/LINESeedJP_OTF_Rg.otf') format('opentype');
	font-weight: 400;
	font-style: normal;
}

/*//////////////////////////////////////////////////////////

	 1: Application all
	 2: Layout & Decoration

//////////////////////////////////////////////////////////*/

/*=========================================================

	Application all

==========================================================*/

html,body{
	margin: 0;
	padding: 0;
}
html{-webkit-text-size-adjust: 100%;}

body{
	text-align: center;
	font-family: 'LINE';
	font-weight: 400;
	line-height: 1.5;
	font-size: 15px;
	color: #142346;
	width: 100%;
}

a{
	transition: all .3s;
	text-decoration: none;
	position: relative;
	display: inline-block;
	-webkit-tap-highlight-color: rgba(0,172,193,0.5);
	color: #00acc1;
}

img{
	vertical-align: middle;
	max-width: 100%;
	height: auto;
	border: 0;
}

h1,h2,h3,h4,h5,h6{
	font-weight: 700;
	font-size: 15px;
	margin: 0;
}

table{
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	border-spacing: 0;
	border: 0;
}
th,td{
	box-sizing: border-box;
	text-align: left;
	vertical-align: top;
	font-weight: 400;
	padding: 0;
	margin: 0;
}

ul,ol{
	list-style-position: outside;
	padding: 0;
	margin: 0 0 0 20px;
}

form,fieldset,p,dl,dd{
	padding: 0;
	margin: 0;
	border: 0;
}

input,select,textarea{
	box-sizing: border-box;
	font-family: 'LINE';
	font-weight: 500;
	font-size: 16px;
	color: #142346;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid #ccc;
}
input,button{line-height: 1;}
button:hover{
	cursor: pointer;
}

select {
	position: relative;
	color: #142346;
	height: 40px;
	padding: 0 16px 0 10px;
	border: none;
	border-radius: 10px;
	border: 1px solid #ccc;
	background: #fff;
}

hr{
	display: none;
	clear: both;
	height: 1px;
	padding: 0;
	margin: 0;
	border: 0;
}

strong,b{
	font-weight: 700;
}

address,em{
	font-style: normal;
}

::selection {
	color:#fff;
	background: #3949ab;
}
::-moz-selection {
	color:#fff;
	background: #3949ab;
}


@media screen and (min-width: 737px){ /* PC */
	.brsp,
	.space-sp{
		display: none;
	}
	
	a[href^="tel:"]{
		pointer-events: none;
		text-decoration: none;
	}
}
@media screen and (max-width: 736px){ /* SP */
	.brpc,
	.space-pc{
		display: none;
	}
}



/*=========================================================

	Layout & Decoration

==========================================================*/

/*	Header
***********************************************************/

#header{
	height: 60px;
	padding: 30px 0;
}
#header img{
	width: auto;
	height: 60px;
	max-width: none;
}

#index #header{
	display: none;
}

@media screen and (min-width: 737px){ /* PC */
	
}

@media screen and (max-width: 736px){ /* SP */
	
}



/*	Contents
***********************************************************/

.layout{
	
}

#mainimage{
	width: 100%;
	margin-top: 30px;
}
#mainimage h2{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 250%;
	margin-bottom: 30px;
}
#mainimage h2 img{
	width: 135px;
}
#mainimage ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 15px;
	list-style: none;
	margin: 15px 0 0 0;
}
#mainimage ul li{
	width: 300px;
}
#mainimage ul li a{
	display: block;
	line-height: 60px;
	font-size: 120%;
	color: #fff;
	border-radius: 32px;
	border: 2px solid #fc5c6c;
	background: #fc5c6c;
}
#mainimage ul li a:hover{
	color: #fc5c6c;
	background: #fff;
}

#user2{
	margin: 0px;
}

#event,
#user,
#index-faq-wrap{
	margin-top: 80px;
}
#event h2,
#user h2,
#index-faq-wrap h2{
	font-size: 230%;
	color: #fc5c6c;
	margin-bottom: 30px;
}
#event .event-wrap{
	margin-bottom: 30px;
}
#event .event-wrap .event-list{
	overflow: hidden;
}
#event .event-wrap .event-list .event-photo{
	overflow: hidden;
	width: 100%;
	height: 230px;
	margin-bottom: 15px;
}
#event .event-wrap .event-list .event-photo img{
	filter: blur(9px);
	object-fit: cover;
	max-width: none;
	width: 100%;
	height: 100%;
}
#event .event-wrap .event-list .event-date{
	filter: blur(3px);
}

#event .other-event{
	display: inline-block;
	line-height: 50px;
	color: #fff;
	padding: 0 50px;
	border-radius: 25px;
	background: linear-gradient(to right, #fc5f6c 0%, #ffcf7d 100%);
}
#event .other-event:hover{
	opacity: 0.7;
}

#user ul.registrant-list{
	list-style: none;
	margin: 0 -15px 0 0;
}
#user ul.registrant-list li{
	margin-right: 15px;
}
#user ul.registrant-list li .registrant-user-icon{
	overflow: hidden;
	aspect-ratio: 3 / 3;
	width: 100%;
	border-radius: 50%;
	margin-bottom: 10px;
}
#user ul.registrant-list li .registrant-user-icon img{
	filter: blur(9px);
	object-fit: cover;
	max-width: none;
	width: 100%;
	height: 100%;
}
#user ul.registrant-list li .registrant-user-detail{
	filter: blur(3px);
}


#user2 ul.registrant-list2{
	list-style: none;
	margin: 0 -15px 0 0;
	display: flex;
}
#user2 ul.registrant-list2 li{
	margin-right: 0px;
	display: inline;
}
#user2 ul.registrant-list2 li .registrant-user-icon2{
	overflow: hidden;
	aspect-ratio: 3 / 3;
	width: 100%;
	border-radius: 50%;
	margin-bottom: 10px;
}
#user2 ul.registrant-list2 li .registrant-user-icon2 img{
	object-fit: cover;
	max-width: none;
	width: 100%;
	height: 100%;
}

#user2 ul.registrant-list2 li .registrant-comment2{
	text-align: center;
}

#index-faq-wrap .index-faq{
	overflow: hidden;
	text-align: left;
	border-radius: 20px;
	box-shadow: 0 0 7px #ead8d6;
	background: #fff;
}
#index-faq-wrap .index-faq ~ .index-faq{
	margin-top: 30px;
}
#index-faq-wrap .index-faq h3{
	font-size: 150%;
	padding: 25px;
	background: #fff5f4;
}
#index-faq-wrap .index-faq p{
	padding: 25px;
}

.pagetitle{
	font-size: 230%;
	color: #fc5c6c;
}

ul.clumb{
	list-style: none;
	text-align: left;
	font-size: 80%;
	color: #777;
	margin: 30px auto 50px auto;
}
ul.clumb li{
	display: inline-block;
}
ul.clumb li:not(:last-child)::after{
	content: '>';
	display: inline-block;
	margin: 0 5px 0 10px;
}

@media screen and (min-width: 737px){ /* PC */
	.layout{
		width: 1000px;
		margin: auto;
	}
	
	#mainimage{
		background: url('../picture/back_mainimage-pc.webp') 50% 0 no-repeat;
	}
	#mainimage h2{
		height: 539px;
	}
	
	#event .event-wrap{
		margin-right: -30px;
	}
	#event .event-wrap .event-list{
		margin-right: 30px;
	}
	
	ul.clumb{
		width: 1000px;
	}
}

@media screen and (max-width: 736px){ /* SP */
	.layout{
		padding: 0 15px;
	}
	
	#mainimage{
		background: url('../picture/back_mainimage-sp.webp') 50% 0 no-repeat;
		background-size: 95% auto;
	}
	#mainimage h2{
		aspect-ratio: 3 / 2.7;
		font-size: 150%;
		width: 100%;
	}
	#mainimage p,
	#mainimage ul{
		padding: 0 15px;
	}
	#mainimage ul li{
		width: 100%;
	}
	
	ul.clumb{
		text-align: center;
		padding: 0 15px;
	}
}



/*	Footer
***********************************************************/

#footer{
	margin-top: 80px;
}

#footer ul.footer-nav{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 15px;
	list-style: none;
	margin: 0 0 30px 0;
}

#start{
	position: fixed;
	left: 0;
	right: 0;
	z-index: 1000;
	text-align: center;
	margin: auto;
}
#start span{
	box-sizing: border-box;
	display: inline-block;
	width: 1000px;
	padding: 4px;
	border-radius: 29px;
	background: linear-gradient(to right, #bf0d77 0%, #4d1c85 100%);
}
#start a{
	display: block;
	line-height: 50px;
	font-weight: 700;
	color: #142346;
	margin: auto;
	border-radius: 25px;
	background: #fff;
}
#start a:hover{
	color: #fff;
	background: linear-gradient(to right, #bf0d77 0%, #4d1c85 100%);
}

.copyright{
	color: #fff;
	padding: 15px 15px 105px 15px;
	background: #142346;
}

@media screen and (min-width: 737px){ /* PC */
	
}

@media screen and (max-width: 736px){ /* SP */
	#footer ul.footer-nav li{
		width: 100%;
	}
	
	#start span{
		width: calc(100% - 30px);
	}
}



/*	contact
***********************************************************/

form.contact{
	margin-top: 15px;
}
form.contact table th,
form.contact table td{
	padding: 15px 0;
}

form.contact table th span.require{
	font-size: 80%;
	color: #e91e63;
}

form.contact table td textarea{
	width: 100%;
}

.button{
	margin-top: 30px;
}
.button button{
	display: inline-block;
	line-height: 50px;
	font-size: 110%;
	color: #fff;
	padding: 0 50px;
	border: 0;
	border-radius: 25px;
	background: #039be5;
}
.button button:hover{
	cursor: pointer;
	opacity: 0.7;
}

.button button#reset{
	background: #555;
}

.contact-comp{
	min-height: 500px;
}
.contact-comp h3{
	font-size: 130%;
	margin-bottom: 30px;
}

@media screen and (min-width: 737px){ /* PC */
	form.contact table th{
		width: 250px;
	}
}

@media screen and (max-width: 736px){ /* SP */
	form.contact table th,
	form.contact table td{
		display: block;
	}
	form.contact table th{
		padding-bottom: 0;
	}
}



/*	term & privacy
***********************************************************/

#term,
#privacy{
	text-align: left;
}

#term ul,
#privacy ul{
	list-style: none;
	margin: 0;
}
#term ul > li,
#privacy ul > li{
	margin-top: 30px;
}

#term ul > li h3,
#privacy ul > li h3{
	font-size: 120%;
}

#term ul > li ol li ~ li{
	margin-top: 15px;
}

#term ul + p{
	text-align: right;
	font-size: 90%;
	color: #777;
	margin-top: 30px;
}

@media screen and (min-width: 737px){ /* PC */
	
}

@media screen and (max-width: 736px){ /* SP */
	
}

