@charset "utf-8";

/* ================================================================
	サイト共通
================================================================ */

:root {
	--pixel-width-sp: 428px;
	--pixel-width-pc: 1500px;
	--pixel-height-margin-sp: 16.8%;
	--pixel-height-margin-pc: 5%;
	--color-green:	#00652F;
	--color-green-l:	#F0F4F1;
	--color-white:	#FFFFFF;
	--color-gray:	#707070;
	--color-gray-l:	#EFEFEF;
	--color-abema:	#092813;
	--color-black:	#000000;
	--color-jet:		#000000;
}

/* ----------------------------------------------------------------
	レイアウト基礎
---------------------------------------------------------------- */

html { 
	font-size: 1px;		/* for using REM units */
}
body {
	font-family: "Noto Sans JP", sans-serif;
	font-size: 3.27vw;
	line-height: 2em; 
	color: var(--color-black);
	text-align: justify;
	text-justify: inter-ideograph;
	text-shadow: 0 0 0.2em var(--color-white), 0 0 0.5em var(--color-white);
	-webkit-print-color-adjust: exact;
	/* -webkit-font-smoothing: antialiased; */
}

#container {
	width: 100%;
	/* overflow: hidden; */
	position: relative;
}
#contents {
	position:relative;
	background: rgba(255,255,255,0.92);
	z-index: 2;
}
section {
	width: 80%;
	margin: 0 auto;
	padding: var(--pixel-height-margin-sp) 0;
}

@media print, screen and (min-width:429px)
{
	body {
		min-width: var(--pixel-width-pc);
		font-size: 15rem;
	}
	#container {
		width: 100%;
		min-width: var(--pixel-width-pc);
		margin: 0 auto;
		/* box-shadow: 0 0 100rem rgba(0,0,0,0.2); */
	}
	section {
		padding: var(--pixel-height-margin-pc) 0;
/*
		padding-top: calc( var(--pixel-height-margin-pc) * 2 );
		margin-top: calc( var(--pixel-height-margin-pc) * (-1) );
*/
	}
}
@media print, screen and (min-width:1501px)
{
	body {
		font-size: 1vw;
	}
}


/* ----------------------------------------------------------------
	テキスト基礎
---------------------------------------------------------------- */

.small { font-size: 0.8em; }
.large { font-size: 1.25em; }
.bold { font-weight: bold; }

h2 {
	display: block;
	color: var(--color-green);
	font-family: 'Oswald', sans-serif;
	font-size: 4.29em;
	line-height: 1em;
	text-align: center;
	margin: 30rem auto;
}
h2 span {
	display: block;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: bold;
	font-size: 12rem;
	line-height: 3em;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
}
@media only screen and (min-width:429px)
{
	h2 {
		font-size: 6em;
	}
	h2 span {
		font-size: 0.15em;
	}
}

a {
	color: var(--color-black);
	text-decoration: none;
	cursor: pointer;
	transition: opacity 0.4s;
}
a:hover {
	text-decoration: underline;
	opacity: 0.8;
}
br.no-pc {
	display: inline;
}
br.no-sp {
	display: none;
}
@media only screen and (min-width:429px)
{
	a.tel {
		pointer-events: none;
	}
	br.no-pc {
		display: none;
	}
	br.no-sp {
		display: inline;
	}
}


/* ================================================================
	ヘッダー
================================================================ */

header {
	width: 100%;
	height: auto;
	padding: 0;
	position: fixed;
	top: 0;
	z-index: 999;
	overflow: visible;
}
@media only screen and (min-width:429px)
{
	header {
		display: none;
	}
}
@media only screen and (max-width:428px)
{
}

/* ----------------------------------------------------------------
	ヘッダーメニュー
---------------------------------------------------------------- */

nav {
	width: 100%;
	display: flex;
	justify-content: end;
	backface-visibility: hidden;
}

nav ul.menu {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: center;
	background: rgba(255,255,255,0.9);
	border-left: solid 1px var(--color-white);
	border-right: solid 1px var(--color-white);
	text-shadow: 0 0 0.5em var(--color-white);
	position: absolute;
	top: 0;
	right: 0;
	z-index: 980;
	display: none;
	width: calc(100% - 8vw);
	margin: 0 4vw;
}
nav ul.menu li.title img {
	width: 180rem;
		width: 170rem;
		padding: 10rem 0;
	margin: 54rem auto 40rem auto;
	margin: 5.8vh auto 4.3vh auto;
}
nav ul.menu li.link {
	width: 70%;
	margin: 0 auto;
}
nav ul.menu li.link ul {
	display: flex;
	flex-direction: column;
	margin: 0 auto;
	border-top: solid 1px var(--color-abema);
}
nav ul.menu li.link ul li {
	width: 100%;
	font-size: 15rem;
	font-weight: bold;
	line-height: 1.5em;
	text-align: center;
	padding: 10rem 0;
	padding: 1.4vh 0;
	border-bottom: solid 1px var(--color-abema);
}
nav ul.menu li.link ul li a {
	display: block;
	text-decoration: none;
	white-space: nowrap;
	color: var(--color-green);
	transition: 0.1s;
}
nav ul.menu li.link ul li a:hover {
	background: var(--color-white);
	box-shadow: 0 0 0.7vh var(--color-white), 0 0 1.4vh var(--color-white), 0 0 2.8vh var(--color-white), 0 0 4.2vh var(--color-white);
	opacity: 1;
}
nav ul.menu li.info {
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 36rem;
	bottom: 3.9vh;
		position: relative;
		bottom: auto;
		margin-top: 8.4vh;
}
nav ul.menu li.info img {
	height: 100rem;
}
nav ul.menu li.info div {
	display: inline-block;
	text-align: left;
	margin-top: 50rem;
	margin-top: 5.4vh;
	margin-top: 4.2vh;
		margin-top: 2.1vh;
}


/* ----------------------------------------------------------------
	閉じるボタン
---------------------------------------------------------------- */

#nav_icon {
	display: none;
	width: 36px;
	height: 24px;
	position: relative;
	cursor: pointer;
	top: 5vw;
	right: 5vw;
	margin-bottom: 2px;
	filter: brightness(1) invert(0);
	transition: filter 1s;
	height: 17px;
}
#nav_icon span {
	background: var(--color-abema);
	box-shadow: 0 0 4px var(--color-white);
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
		height: 3px;
}
#nav_icon span:nth-of-type(1) {
	top: 0;
}
#nav_icon span:nth-of-type(2) {
	top: 10px;
	top: 7px;
}
#nav_icon span:nth-of-type(3) {
	bottom: 0;
}
#nav_icon.active {
	filter: brightness(1) invert(0);
}
#nav_icon.active span {
	background: var(--color-abema);
	box-shadow: none;
}
#nav_icon.active span:nth-of-type(1) {
	-webkit-transform: translateY(10px) rotate(-30deg);
	transform: translateY(10px) rotate(-30deg);
	-webkit-transform: translateY(7px) rotate(-30deg);
	transform: translateY(7px) rotate(-30deg);
}
#nav_icon.active span:nth-of-type(2) {
	opacity: 0;
	left: 4vw;
}
#nav_icon.active span:nth-of-type(3) {
	-webkit-transform: translateY(-10px) rotate(30deg);
	transform: translateY(-10px) rotate(30deg);
	-webkit-transform: translateY(-7px) rotate(30deg);
	transform: translateY(-7px) rotate(30deg);
}
/* @media only screen and (max-width:428px)
{ */
	#nav_icon, #nav_icon span {
		/* display: inline-block; */	/* ちらつき防止（Javascriptで表示） */
		transition: all .4s;
		box-sizing: border-box;
		z-index: 999;
	}
/* } */



/* ================================================================
	コンテンツ
================================================================ */

#contents {
	width: 100%;
	padding: 0 0;
	min-height: 50vh;
}
@media only screen and (max-width:428px)
{
	#contents {
	}
}



/* ================================================================
	フッター
================================================================ */

footer {
	width: 80%;
	padding: 26rem 10%;
	background: var(--color-white);
	/* margin-bottom: 160rem;		 ヘッダーメニュー */
	position: relative;
	z-index: 2;
	background: rgba(255,255,255,0.92);
	background: none;
}
footer ul {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding: 4em 0 2em 0;
}
footer ul li {
	margin-right: 1.5em;
}
footer ul li:first-child {
	margin-right: 3.5em;
	position: relative;
}
footer ul li:first-child::after {
	content: '';
	display: block;
	width: 0rem;
	height: 0rem;
	border: solid 0.35em transparent;
	border-left: solid 0.56em var(--color-gray);
	opacity: 0.5;
	position: absolute;
	top: 0.72em;	/* 2/2 - 0.35 */
	right: -2.31em;	/* 3.5/2 + 0.56 */
}
footer ul li a {
	text-decoration: underline;
}
footer ul li a:hover {
	text-decoration: none;
}
footer dl {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 100rem;
}
footer dl dt img {
	width: 160rem;
	margin-right: 34rem;
}
footer small {
	display: block;
	text-align: center;
	margin-top: 4em;
}
@media only screen and (max-width:428px)
{
	footer {
		width: 86%;
		padding: 26rem 7%;
		margin-bottom: 0;
	}
	footer ul {
		padding-top: 0;
	}
	footer dl {
		flex-direction: column;
		margin-top: 75rem;
	}
	footer dl dt img {
		margin-right: 0;
	}
	footer dl dd {
		text-align: center;
		margin-top: 14%;
		margin-top: 3.7em;
	}
	footer small {
		margin-top: 2em;
	}
}

/* ----------------------------------------------------------------
	TOPへ
---------------------------------------------------------------- */

#totop {
	display: block;
	width: 36px;
	height: 36px;
	border-radius: 100%;
	border: solid 1px var(--color-abema);
	background: rgba(255,255,255,0.5);
	opacity: 1.0;
	position: fixed;
	bottom: 5vw;
	right: 5vw;
	z-index: 999;
	transition: none;
}
#totop::after {
	content: '';
	display: block;
	width: 15%;
	height: 15%;
	border-top: solid 2px var(--color-abema);
	border-right: solid 2px var(--color-abema);
	transform: rotate(-45deg);
	position: absolute;
	top: 8%;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
#totop:hover {
	opacity: 0.8;
}
@media only screen and (min-width:429px)
{
	#totop {
		width: 3.6vw;
		height: 3.6vw;
		min-width: 54rem;
		min-height: 54rem;
		bottom: 3vw;
		right: 4vw;
	}
}