/* == base == */

h2{
	margin:32px 0 0;
}

h3{
	margin:0;
}

ul{
	margin:0;
	list-style-type:circle;
}

article{
	display:flex;
    flex-flow:column;
    gap:32px;
}

article.gap-large{
	gap:64px;
}

section{
}

p{
	margin:0;
}

hr{
	border-top:1px solid #c0c0c0;
	border-left:none;
}

/* == parts == */

div.image{
}

div.image img{
	display:block;
	max-width:100%;
	margin:0 auto;
}

div.image-top{
	background-color:#505050;
}

div.image-top img{
	display:block;
	max-width:100%;
	margin:0 auto;
}

div.div-button{
	display:inline-block;
	height:2.5em;
	padding:0 1em;
	border:1px solid #808080;
	border-radius:1.25em;
	line-height:2.5em;
	text-align:center;
	font-size:90%;
	user-select:none;
}

div.div-button:hover{
	background-color:#e8e8e8;
	cursor:pointer;
}

a.a-button{
	display:inline-block;
	height:2.5em;
	padding:0 1em;
	border:1px solid #808080;
	border-radius:1.25em;
	line-height:2.5em;
	text-align:center;
	font-size:90%;
	user-select:none;
	color:#000000;
}

div.image-link a{
	display: inline-block;
	max-width: 100%;
}

div.image-link img{
	display: block;
	max-width: 100%;
}

div.image-link img:hover{
	filter: brightness(90%);
}

a.a-button:hover{
	background-color:#e8e8e8;
	cursor:pointer;
	text-decoration:none;
}

p.image-title{
	text-align:center;
}

p.note-center{
	text-align:center;
}

span.item-name{
	font-weight:bold;
}

ul.link-list{
	padding:0;
	border-top:1px solid #c0c0c0;
	border-left:1px solid #c0c0c0;
	border-right:1px solid #c0c0c0;
	list-style-type:none;
}

ul.link-list li{
	border-bottom:1px solid #c0c0c0;
}

ul.link-list li.click-event{
	padding:8px 8px 6px;
}

ul.link-list li.click-event:hover{
	background-color:#e8e8e8;
	cursor:pointer;
}

ul.link-list a{
	text-decoration:none;
	display:flex;
	padding:8px 8px 6px;
}

ul.link-list a:hover{
	text-decoration:none;
	background-color:#e8e8e8;
}

ul.link-list a:link{
	color:#103070;
}

ul.link-list p{
	padding:8px 8px 6px;
}

ul.link-list img{
	margin:8px 8px;
}

/* == body == */

body{
	margin:0;
	background-color:#f4f4f4;
	font-family:sans-serif;
}

.wrapper{
	margin:0;
}

header{
	margin:0 auto;
	padding:0px;
}

footer{
	margin:32px 0;
	font-size:small;
	text-align:center;
	color:#808080;
}

footer a:link{
	color:#808080;
}

footer a:visited{
	color:#808080;
}

footer nav.footer-menu{
	margin-bottom:16px;
}

footer .adsense{
	display:inline-block;
	margin:64px auto 32px;
}

footer .copyright{
}

/* == header == */

.wrapper-main-menu{
	background-color:#ffffff;
	border-bottom:1px solid #c0c0c0;
}

nav.main-menu{
	max-width:832px;
	margin:0 auto;
}

h1.main-menu-home{
	margin:0;
}

h1.main-menu-home img{
	max-width:100%;
}

ul.main-menu-list{
	margin:0;
	padding:0;
	list-style: none;
}

ul.main-menu-list li a{
	display:block;
	color:#000000;
}

ul.main-menu-list li a:hover{
	text-decoration:none;
	background-color:#e8e8e8;
}

#main-menu-hb:hover{
	text-decoration:none;
	background-color:#e8e8e8;
	cursor:pointer;
	user-select:none;
}

ul.hamburger-menu{
	position:absolute;
	background-color:#ffffff;
	border:1px solid #c0c0c0;
	margin:0;
	padding:0;
	list-style: none;
}

ul.hamburger-menu li.border{
	border-top:1px solid #e8e8e8;
}

ul.hamburger-menu a{
	display:block;
	height:52px;
	line-height:52px;
	padding:0 16px;
	color:#000000;
}

ul.hamburger-menu a:hover{
	text-decoration:none;
	background-color:#e8e8e8;
}

@media(min-width:620px){
	nav.main-menu{
		display:flex;
		justify-content:space-between;
		align-items:center;
		height:56px;
	}
	
	h1.main-menu-home{
		width:160px;
		padding:2px 16px 0;
	}
	
	ul.main-menu-list{
		flex-grow:1;
		display:flex;
		justify-content:flex-end;
	}
	
	ul.main-menu-list li.selected{
/*
		padding:2px 16px 0;
		line-height:54px;
*/
		font-size:16px;
		font-weight:bold;
	}
	
	ul.main-menu-list li a{
		padding:2px 16px 0;
		line-height:54px;
		font-size:15px;
	}
	
	#main-menu-hb{
		padding:2px 16px 0;
		line-height:54px;
		font-size:20px;
	}
	
}

@media(max-width:619px){
	nav.main-menu{
		display:grid;
		grid-template-columns:44px 1fr 44px;
		grid-template-rows:44px 44px;
	}
	
	h1.main-menu-home{
		grid-column:2;
		grid-row:1;
		width:160px;
		margin:0 auto;
		padding:6px 12px;
	}
	
	ul.main-menu-list{
		grid-column:1/4;
		grid-row:2;
		display:flex;
		justify-content:space-between;
	}
	
	.main-menu-hamburger{
		grid-column:3;
		grid-row:1;
	}
	
	#main-menu-hb{
		padding-top:2px;
		line-height:42px;
		font-size:20px;
		text-align:center;
	}
	
	ul.main-menu-list li{
		flex-grow:1;
	}
	
	ul.main-menu-list li.selected{
		padding-top:2px;
		line-height:42px;
		font-size:16px;
		text-align:center;
		font-weight:bold;
	}
	
	ul.main-menu-list li a{
		padding-top:2px;
		line-height:42px;
		font-size:15px;
		text-align:center;
	}
}

@media(max-width:359px){
	ul.main-menu-list li.selected{
		font-size:13px;
	}
	
	ul.main-menu-list li a{
		font-size:13px;
	}
}

/* ==== */

.main-inner{
	max-width:800px;
	margin:24px auto 0;
}

.main-inner-narrow{
	max-width:720px;
	margin:24px auto 0;
}

.main-inner.no-margin, .main-inner-narrow.no-margin{
	margin-top:0;
}

@media(max-width:374px){
	.main-inner{
		padding:0px 8px;
	}
	
	.main-inner-narrow{
		padding:0px 8px;
	}
}

@media(min-width:375px) and (max-width:479px){
	.main-inner{
		padding:0px 12px;
	}
	
	.main-inner-narrow{
		padding:0px 12px;
	}
}

@media(min-width:480px){
	.main-inner{
		padding:0px 16px;
	}
	
	.main-inner-narrow{
		padding:0 16px;
	}
}

/* ==== */

.main-inner-sep-narrow{
	max-width:720px;
	margin:0 auto;
}

.main-inner-sep-narrow article{
	padding-top:16px;
    gap:16px;
}

.main-inner-sep-narrow section{
	background-color:#fafafa;
	border:1px solid #c0c0c0;
	border-radius:4px;
}

@media(max-width:374px){
	.main-inner-sep-narrow{
		padding:0px 8px;
	}
	.main-inner-sep-narrow section{
		padding:8px;
	}
}

@media(min-width:375px) and (max-width:479px){
	.main-inner-sep-narrow{
		padding:0px 12px;
	}
	.main-inner-sep-narrow section{
		padding:12px;
	}
}

@media(min-width:480px){
	.main-inner-sep-narrow{
		padding:0 16px;
	}
	.main-inner-sep-narrow section{
		padding:16px;
	}
}

/* == ad == */

.ad_bar_nztk { width: 320px; height: 100px; }
@media(min-width: 500px) { .ad_bar_nztk { width: 468px; height: 60px; } }
@media(min-width: 800px) { .ad_bar_nztk { width: 728px; height: 90px; } }