/*for index.html version.3
Copyright(c) 2024-2025 宗教法人 日本基督教団 西那須野教会
*/

/*
** Modified /css/index.css
** 2025.5.14	Nesting
*/

/*Fonts*/
.m-plus-rounded-1c{
	font-family:"M PLUS Rounded 1c", sans-serif;
/*	font-weight:400;	*/
	font-style:normal;
}
.weight-light{font-weight:300;}
.weight-regular{font-weight:400;}
.weight-medium{font-weight:500;}
.weight-bold{font-weight:700;}

body{
	font-family:"M PLUS Rounded 1c", sans-serif;
	font-weight:400;
	background:#fff url("/img/wallppr038.png");
}
body > *{ margin:0 auto; }

#Logo{
	display:flex;
	justify-content:center;
	align-items:center;
	width:930px;
	padding:8px 0;
	margin:0 auto;
	color:#fff;
	background:#31672b;

	& :is(span:nth-child(1),span:nth-child(4)){font-size:300%;}
	& span{
		&:nth-child(3){display:none;}
		&:last-child{
			position:absolute;
			top:calc(8px + .1em);
			right:calc((100% - 930px) / 2 + 1em);
			font-family:sans-serif;
			font-weight:normal;
			font-size:.8em;
		}
		&:last-child a:any-link{
			color:white;
			text-decoration:none;
		}
	}
}

#MMenu{
	display:flex;
	flex-direction:row;
	width:930px;
	margin:6px auto 0;
	font-size:1.3rem;
	font-weight:bold;

	& div{
		flex:1 1 auto;	/*autoを入れないと同じ幅になる*/
		margin-right:.6%;
		background:linear-gradient(#eef6d7,#b4da45,#c5e173);
		border:1px outset skyblue;
		text-align:center;

		&:last-child{margin-right:0;}
	}
	& a{
		display:block;
		padding:10px 0;
	}
	& :is(a:hover,a:focus){text-decoration:underline;}
}

/*Global*/
a:any-link{
	color:#222;
	text-decoration:none;
}

/*Each*/
#Notice-2{display:none}
#Guidance{padding-bottom:1em;}
#G-Title{
	line-height:2.5em;
	font-size:200%;
}
#G-Subject{font-size:150%;}
#G-Subtitle{
	line-height:1.7em;
	font-size:110%;
}
#G-Scripture,
#Mo-Scripture{
	line-height:1.5em;
	font-size:1.1em;
}
.S-Source{
	margin-top:-.4em;
	padding-right:2em;
	text-align:right;
	font-size:.8em;
	font-style:italic;
}
#Adr-Zip{font-size:80%;}
#Adr-Main{font-size:120%:}
#Adr-Tel{
	font-size:80%;

	& a[href^="tel:"]{pointer-events:none;}
}
#Copy{
	color:#444;
	text-align:center;
	font-size:.8em;
}

div.whiteBack{
	background-color:rgba(255,255,255,.6);
	border:2px solid white;

	& a:any-link{
		color:#06C;
		text-decoration:underline;
	}
}

#LatestMsg{
	line-height:1.6;
	margin:1em;
	padding:.3em 1em 1em;

	& > div{margin-bottom:.5em;}
}

#Schedule{
	margin:0 1em;
	padding:.3em 1em 1em;
	text-align:left;

	& > div:first-child{
		margin-bottom:.5em;
		font-weight:bold;
	}
	& > div:last-child{margin-top:.5em;}
}

#Events{
	line-height:1.3;
	margin:1em;
	padding:.3em 1em 1em;
/*	text-align:left;*/

	& > div:first-child{
		margin-bottom:.5em;
		font-weight:bold;
	}
}

#G-Submenu{
	& > a{
		display:block;
		width:95%;
		margin:3px auto 7px;
		padding:.6em 0;
		background:#31672b;
		color:#eee;
		line-height:1.25;
		font-size:1.1rem;
		text-align:center;
	}
	& > :is(a:hover,a:focus){text-decoration:underline;}
	& > div{text-align:center;}
}

#Inner{width:165px;}
#Outer{padding-right:8px;}

/*
** Grid
*/

#Contents{
	width:923px;
	margin:5px auto 0;
	padding:2px;
	display:grid;
	grid-template-columns:125px 1fr 185px;
	gap:2px;
	border:1px solid Black;
	background-color:#ffc;
}

#Contents > div,#Contents > nav{
	border: 1px solid Black;
	text-align:center;
}

#C-Notice{
	grid-column:1/2;
	padding-top:.5em;
	background-color:#31672b;
	color:white;
	font-size:1.3em;
}
#Guidance{
	grid-column:2/3;
	padding-bottom:1em;
	background-color:#ffc;
}
#G-Submenu{
	grid-column:3/4;
	background-color:#ffc;
}

#Address{
	grid-column:1/4;
	padding:1rem 0;
	line-height:1.2;
	background-color:#31672b;
	font-size:1.3rem;
	font-style:normal;
	color:white;
	text-align:center;
}

/*
** Respansible
*/

/*幅 960px 以下 (Tablet)*/
@media screen and (max-width:960px){
	#Logo,#MMenu{width:100%}
	#Logo span:last-child{right:calc(8px + .5em);}
	#Contents{
		width:calc(100% - 7px);
		grid-template-columns:3em 1fr 185px;
	}
	#Logo span:nth-child(1){font-size:260%;}
	#Logo span:nth-child(4){font-size:280%;}
	#MMenu{font-size:125%;}
	#G-Submenu div a{font-size:1.05rem}
	#Notice-1{display:none;}
	#Notice-2{display:inline-block;}
}
@media screen and (max-width:810px){
	#Logo span:nth-child(1){font-size:240%;}
	#Logo span:nth-child(4){font-size:260%;}
	#MMenu2,#MMenu{font-size:110%;}
	#Contents{font-size:.9em;}
	#Adr-Tel span{display:none;}
	#Adr-Tel a{display:inline-block;}
}
@media screen and (max-width:760px){
	#Contents{font-size:.83em}
}
@media screen and (max-width:710px){
	#Logo span:nth-child(1){font-size:180%;}
	#Logo span:nth-child(4){font-size:250%;}
	#MMenu{font-size:100%;}
	#C-Notice{display:none;}
	#Guidance{grid-column:1/3;}
	#Inner{width:150px;}
	#Outer{padding-right:11px; width:160px;}
	#C-Notice{display:none;}
	#Address{font-size:1.2rem;}
}
@media screen and (max-width:665px){
	#MMenu{font-size:88%;}
	#Guidance{grid-column:1/4;}
	#G-Submenu{
		grid-column:1/4;
		padding-bottom:.8em;
	}
	#G-Submenu > a{
		width:80%;
		margin:.8em auto;
		padding:.4em 0;
		background:url(/timg/WhiteArrow.png) no-repeat right 10px bottom 50%, #31672b;
	}
	#G-Submenu > a br,#G-Submenu > div br{display:none;}
	#Inner{height:110px;}
	#Outer{height:115px;}
	#Address{font-size:1rem;}
}

/*幅 500px 以下 (Smart Phone)*/
@media screen and (max-width:500px){
	body{background-image:none;}
	#Logo span:nth-child(1){font-size:155%;}
	#Logo span:nth-child(2){display:none;}
	#Logo span:nth-child(3){display:inline-block;}
	#Logo span:nth-child(4){font-size:218%;}
	#MMenu{
		flex-direction:column;
		background:white center / contain url(/next/img/nasu-t.png) no-repeat;
	}
	#MMenu div{
		margin-right:0;
		background:none;
		border:none;
		text-align:left;
	}
	#MMenu a{padding-left:2em;}
	#Contents{font-size:.75em;}
	#Address{font-size:.78rem;line-height:1.8}
	#Adr-Tel a[href^="tel:"]{pointer-events:auto;}
}
@media screen and (max-width:420px){
	#Logo span:nth-child(1){font-size:140%;}
	#Logo span:nth-child(4){font-size:195%;}
}