@charset "UTF-8";

/*common
----------------------------------------------------------------*/
a {	text-decoration: none; transition: 0.3s; }
a:link { color: #cdff00; }
a:visited { color: #cdff00; }
a:hover { color: #293d00; text-decoration: underline;}
a:active { color: #cdff00; }
::selection { background: #d1e78e;  color: #51760e;}
::-moz-selection {  background: #d1e78e; color: #51760e;}
html{
	position: relative;
	transition: 0.3s;
	scroll-behavior: smooth;
}
body {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	height:100%;
	color:#fff;
	}

/*camvas
----------------------------------------------------------------*/
#particles-js{ width: 100%; height:100%; position: absolute; top:0; left: 0; z-index: -2;}
canvas{ background: #79894d; width: 100%; height:100%; position: absolute; top:0; left: 0; z-index: -2;}

/*header
----------------------------------------------------------------*/
#header{ background: rgba(41, 62, 0, 0.7); position: relative; z-index: 3; margin-bottom: 3em;}
h1 { font-family: 'Train One', cursive; display: block; margin: 0; font-size:150%;}
h1 span{ font-family: 'M PLUS Rounded 1c', sans-serif; font-size:50%; padding: 0 0 0 2em;}
h1::after{
	vertical-align: middle;
	display: inline-block;
	content: '';
	background: url(../images/icon_kao.png) center center no-repeat;
	background-size: contain;
	padding-left: 1em;
	width: 2em;
	height: 0.7em;
	margin-top: -0.1em;
}
.header_inner{ width: 80%; max-width: 1400px; margin: auto; padding:2% 0; line-height: 1.5; display: flex; align-items: center;}
nav{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	flex-wrap: nowrap;
	margin-left: 1em;
	font-weight: 900;
}
nav a{ display: inline-block; padding: 1em 0 1em 1em;}
nav a:hover{color: #fff; text-decoration: none;}
nav a::before{
	display: inline-block;
	content: '|';
	padding: 0 1em 0 0;
	color: #fff;
	font-weight: 100;
}
nav::after{
	display: inline-block;
	content: '|';
	padding: 0 0 0 1em;
	color: #fff;
	font-weight: 100;
}
@media(max-width:852px){
	nav{ font-size: 2vw;}
	h1{
		line-height: 1;
		font-size: 2.2vw;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: nowrap;
	}
}

/*article
----------------------------------------------------------------*/
article{ padding-bottom: 8em;}

/*section
----------------------------------------------------------------*/
h2{ font-size: 120%; line-height: 1.5;}
h2:first-letter{ font-size: 200%;}
section{ width: 80%; max-width: 1400px; margin: 0 auto 3em auto; line-height: 2; z-index: 2; position: relative;}
section:last-child{ margin: 0 auto 0 auto;}
section div{line-height: 1.5; margin-bottom: 1em;}
section div img{width:100%; margin-top:1em;}

/*footer
----------------------------------------------------------------*/
#footer {
	width:100%;
	text-align: center;
    background: rgba(41, 62, 0, 0.5);
	}

#copyright {
	margin:auto;
	padding: 3em;
	font-size: 10px;
	line-height:1;
	}

/*content
----------------------------------------------------------------*/
.about img{width:100%; margin-top:1em;}
.lineup{
	display: flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
.lineup li{
	width: 49.9%;
	margin: 0 0 2px 0;
}
.lineup img{
	width: 100%;
}
.news li span{
	color: #d1e78e;
}
.news li a,.news li span{
	display: inline-block;
	margin-left: 1em;
}
@media(max-width:1014px){
	.news li{
		margin: 0 0 1em 0;
	}
	.news li a,.news li span{
		margin-left: 1.8em;
		display: block;
		line-height: 1.5;
	}	
}

/* slide toggle */
.tgl{display: flex; align-items: center; color: #cdff00; transition: 0.3s;}
.tgl:hover{cursor: pointer; color: #fff;}
.tgl i{ margin-right: 0.7em;}
.tgl_txt{ display: inline-block; width: 90%;}
.tgt{ display: none; margin-bottom: 3em;}
@media(max-width:852px){
.tgl{ align-items: flex-start;}
}

/*ICON
----------------------------------------------------------------*/
/* 外部リンク */
.gg-external {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	transform: scale(var(--ggs,1));
	width: 12px;
	height: 12px;
	box-shadow:
	-2px 2px 0 0,
	-4px -4px 0 -2px,
	4px 4px 0 -2px;
	margin-top: 1px;
	margin-right: 1em;
}
.gg-external::after,
.gg-external::before {
	content: "";
	display: block;
	box-sizing: border-box;
	position: absolute;
	right: -4px
}
.gg-external::before {
	background: currentColor;
	transform: rotate(-45deg);
	width: 12px;
	height: 2px;
	top: 1px
}
.gg-external::after {
	width: 8px;
	height: 8px;
	border-right: 2px solid;
	border-top: 2px solid;
	top: -4px
}
/* リンクナシ */
.gg-nolink {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	transform: scale(var(--ggs,1));
	width: 12px;
	height: 12px;
	box-shadow:
	-2px 2px 0 0,
	-4px -4px 0 -2px,
	4px 4px 0 -2px;
	margin-top: 1px;
	margin-right: 1em;
}
.gg-nolink::after,
.gg-nolink::before {
	content: "";
	display: block;
	box-sizing: border-box;
	position: absolute;
	right: -2px
}
.gg-nolink::after {
	width: 8px;
	height: 8px;
	border-right: 2px solid;
	border-top: 2px solid;
	top: -2px
} 
/* slide toggle */
/* add */
.gg-add-r {
  color: #fff;
  box-sizing: border-box;
  position: relative;
  display: block;
  width: 22px;
  height: 22px;
  border: 2px solid;
  transform: scale(var(--ggs, 1));
  border-radius: 4px;
}
.gg-add-r::after,
.gg-add-r::before {
  content: "";
  display: block;
  box-sizing: border-box;
  position: absolute;
  width: 10px;
  height: 2px;
  background: currentColor;
  border-radius: 5px;
  top: 8px;
  left: 4px;
}
.gg-add-r::after {
  width: 2px;
  height: 10px;
  top: 4px;
  left: 8px;
}
/* remove */
.gg-remove-r {
  color: #fff;
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  transform: scale(var(--ggs, 1));
  width: 22px;
  height: 22px;
  border: 2px solid;
  border-radius: 4px;
}
.gg-remove-r::before {
  content: "";
  display: block;
  box-sizing: border-box;
  position: absolute;
  width: 10px;
  height: 2px;
  background: currentColor;
  border-radius: 5px;
  top: 8px;
  left: 4px;
}