/*
	各ページの共通CSS

	2025.2.19	Version.3
	2025.5.14	Nesting
*/

/*Google Fonts*/
.m-plus-rounded-1c-regular {font-family: "M PLUS Rounded 1c", serif;font-weight: 400;font-style: normal;}
.noto-sans-jp-400 {	font-family: "Noto Sans JP", serif;font-optical-sizing: auto;font-weight: 400;font-style: normal;}
.noto-serif-jp-400 {font-family: "Noto Serif JP", serif;font-optical-sizing: auto;	font-weight: 400;font-style: normal;}
.mochiy-pop-p-one-regular {font-family: "Mochiy Pop P One", serif;font-weight: 400;font-style: normal;}

body{
	background-color:#ffffe1;
	font-family: "M PLUS Rounded 1c", serif;
	font-weight: 400;
	font-style: normal;
}

/*Global*/

#MMenu a:any-link{
	color:black;
	text-decoration:none;
}
#SMenu a:any-link{
	color:white;
	text-decoration:none;
}

#Top{}
#Logo{
	display:block;
	width:925px;
	margin:0 auto;
	padding:.4em 0 1.5em;
	background:no-repeat bottom .3em center url("/img/EnLogo100.png") #31672B;
	color:white;
	font-size:1.75em;
	font-weight:700;
	text-align:center;
}
#logo1{font-size:1em}
#logo2{}
#logo3{font-size:.8em}

#MMenu{
	width:925px;
	margin:6px auto 0;
	display:flex;
	align-items:center;
	justify-content: space-between;
	font-size:1.15rem;
	font-weight:700;

	& a{
		display:block;
		flex:1 1 auto;	/*autoを入れないと同じ幅になる*/
		padding:6px 0;
		background:linear-gradient(#eef6d7,#b4da45,#c5e173);
		border:1px outset skyblue;
		text-align:center;

		&:not(:last-child){margin-right:.6%;}
	}
	& :is(a:hover,a:focus){text-decoration:underline;}
}

/*Grid*/
#Contents{
	width:920px;
	margin:5px auto 0;
	padding:2px;
	display:grid;
	grid-template-columns:1fr 190px;
	gap:2px;
	background-color:white;
	border:1px solid black;

	& > *{
		border:1px outset black;
		text-align:center;
	}
	& section{}
	& h1{
		margin-top:.4em;
		font-weight: 400;
		font-size:2em;
		text-align:center;
	}
}

#SMenu{
	display:flex;
	flex-direction:column;

	& a{
		display:block;
		margin:.2em;
		padding:.5em 0;
		background-color:#31672B;
		color:white;
		line-height:1.2;
		font-size:1em;
		text-align:center;
	}
	& :is(a:hover,a:focus){text-decoration:underline;}
}

#Empty{
	grid-column:1/3;
	grid-row:2;
	background-color:#600;
}
#Address{
	display:grid;
	grid-column:1/3;
	grid-row:3;
	padding:.5em 0;
	background-color:#31672B;
	color:yellow;
	font-style:normal;
	line-height:1.6;
}
#A-Tel a{color:yellow;}
#Copy{
	color:#444;
	text-align:center;
	font-size:.8em;
}

/*
** Respansible
*/

/*幅 960px 以下 (Tablet)*/
@media screen and (max-width:960px){
	#Logo,#MMenu{width:100%;}
	#Contents{
		width:calc(100% - 8px);
		text-align:left;
	}
}
@media screen and (max-width:810px){
	#MMenu{font-size:1rem;}
	#A-Tel{
		& a{display:inline-block;}
		& span{display:none;}
	}
}
@media screen and (max-width:760px){}
@media screen and (max-width:710px){
	#Logo{background-image:url(/img/EnLogo90.png);}
	#logo1,#logo3{font-size:.9em;}
}
@media screen and (max-width:665px){
	#MMenu a{font-size:.9rem}
	#Logo{background-image:url(/img/EnLogo80.png);}
	#Contents{grid-template-columns:1fr;}
	#Empty{display:none;}
	#SMenu{
		grid-row:2;
		background:#ffffe1;

		& a{
			margin:.3em 2em;
			padding-left:1em;
			background:url("/timg/WhiteArrow.png") no-repeat right 10px bottom 50%,#31672B;
			text-align:left;
			& br{display:none;}
		}
	}
	#Address{font-size:.95em;}
}
@media screen and (max-width:500px){
	#logo1{padding:10px 0; font-size:.8em;}
	#Logo{background-image:url(/img/EnLogo70.png);}
	#MMenu{
		flex-direction:column;
		background: center / contain url(/next/img/nasu-t.png) no-repeat;

		& a{
			width:90%;
			padding-left:2em;
			background:none;
			border-style:none;
			text-align:left;
		}
	}
	#Address{font-size:.85em}
}
@media screen and (max-width:470px){
	#Address{font-size:.75em}
}
