* {
		margin: 0px;
		padding: 0px;
}

.clearfix:after,
header:after,
main:after,
footer:after {
		content: " ";
		display: block;
		clear: both;
}

a {
	text-decoration: none;
	word-wrap:break-word;
}

body {
	font-family: 'Noto Serif JP', sans-serif;
	text-align: center;
	background: #FFFFFF;
	color: #222222;
	font-size: 14px;
	margin: 0px auto;
}

main {
	text-align: left;
	line-height: 150%;
}

.r { text-align: right; }
.c { text-align: center; }
.l { text-align: left; }

#topTopBtn {
	visibility: hidden;
	position: fixed;
	z-index: 99;
	color: rgba(0, 0, 0, 0.5);
	background: rgba(204, 204, 0, 0.75);
	border: 2px solid rgba(204, 204, 0, 1.00);
	border-radius: 50%;
}

#topTopBtn:focus,
button:focus {
	outline: none;
}

#topTopBtn.show {
	animation: show .25s linear 0s;
}

#topTopBtn.hide {
	animation: hide .01s linear 0s;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* pc */
@media all and (min-width: 769px) {
	body {
		width: 1000px;
	}

	header {
		width: 100%;
		height : 160px;
	}
	header a {
		color: #222222;
	}
	
	header h1 {
		width: 50%;
		height: 120px;
		float: left;
		text-align: left;
	}
	
	header h1 a { 
		margin: 0px auto;
		height: 110px;
	}
	
	header h1 a span:nth-of-type(1) {
		display: block;
		font-size: 12px;
		font-weight: normal;
		text-align: center;
		line-height: 40px;
		width: 251px;
		height: 40px;
	}
	
	header h1 a span:nth-of-type(2) {
		display: block;
		width: 251px;
		height: 70px;
		text-indent: -9999px;
		background-image: url(/rsrc/logo.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: auto 66px;
	}
	
	header nav:nth-of-type(1) {
		width: 50%;
		height: 120px;
		float: left;
		text-align: right;
	}
	
	header nav:nth-of-type(1) ul {
		margin: 20px 20px 0px 0px;
	}
	
	header nav:nth-of-type(1) ul li {
		display: inline;
	}
	
	header nav:nth-of-type(1) ul li:after {
		content: "|";
		display: inline-block;
		padding: 0 10px;
	}
	
	header nav:nth-of-type(1) ul li:last-child::after{
		display: none;
	}
	
	header nav:nth-of-type(1) ol {
		margin: 15px 20px 0px 0px;
	}
	
	header nav dl,
	header nav ul,
	header nav ol {
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	
	header nav:nth-of-type(2) dl {
		width: 100%;
		height: 40px;
	}
	
	header nav:nth-of-type(2) dl dt { 
		display: none;
	}
	
	header nav:nth-of-type(2) dl dd,
	header nav:nth-of-type(2) dl dd ul {
		width: 100%;
		height: 40px;
	}
	
	header nav:nth-of-type(2) dl dd ul li {
		width: 25%;
		height: 40px;
		float: left;
	}
	
	header nav:nth-of-type(2) dl dd ul li:nth-child(odd) {
		background: #cccc00;
	}
	
	header nav:nth-of-type(2) dl dd ul li:nth-child(even) {
		background: #999900;
	}
	
	header nav:nth-of-type(2) dl dd ul li.spmenur {
		display: none;
	}
	
	header nav:nth-of-type(2) dl dd ul li a {
		display: block;
		text-align: center;
		width: 100%;
		height: 40px;
		line-height: 40px;
		color: #FFFFFF;
	}
	
	header nav:nth-of-type(2) dl dd ul li a:hover {
		color: #000000;
	}
	
	main {
		width: 100%;
		margin: 0px auto;
	}
	
	footer {
		margin-top: 50px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		font-size: 12px;
	}
	
	#topTopBtn {
		width: 56px;
		height: 56px;
		right: 20px;
		bottom: 20px;
		font-size: 24px;
		transition: background-color 0.25s;
	}
	
	#topTopBtn:hover	{
		background: rgba(64, 64, 0, 0.75);
		color: rgba(235, 235, 235, 0.90);
	}
	
	@keyframes show{
		from { opacity: 0; bottom:   0px; }
		to {   opacity: 1; bottom:  20px; }
	}
	
	@keyframes hide{
		from { opacity: 1; bottom:  20px; }
		to {   opacity: 0; bottom:   0px; }
	}
}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* sp */
@media all and (max-width: 768px) {
	
	header {
		width: 100%;
		height : 120px;
	}
	header a {
		color: #222222;
	}
	
	header h1 {
		width: calc(100% - 60px);
		height: 120px;
		float: left;
		/* margin-right: 60px; */
	}
	
	header h1 a { 
		margin: 0px auto;
		height: 110px;
	}
	
	header h1 a span:nth-of-type(1) {
		display: block;
		text-align: center;
		font-size: 12px;
		font-weight: normal;
		line-height: 40px;
		height: 40px;
	}
	
	header h1 a span:nth-of-type(2) {
		display: block;
		height: 70px;
		text-indent: -9999px;
		background-image: url(/rsrc/logo.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: auto 66px;
	}
	
	header nav:nth-of-type(1) {
		display: none;
	}
	
	header nav:nth-of-type(2) {
		width: 100%;
		line-height: 26px;
	}
	
	header nav:nth-of-type(2) dl {
		position: relative;
	}
	
	header nav:nth-of-type(2) dl dt {
		display: block;
		background-image: url("/rsrc/menus.svg");
		width: 50px;
		height: 50px;
		float: right;
		margin-top: 35px;
		margin-right: 5px;
		text-indent: -9999px;
	}
	
	header nav:nth-of-type(2) dl dd ul {
		position: absolute;
		z-index: 3;
		top: 120px;
		width: 100%;
		background: rgba(255, 255, 255, 0.85);
		opacity: 0;
		margin: 0;
		padding: 0px;
		left: 100%;
		display: none;
	}
	
	header nav:nth-of-type(2) dl dd ul li {
		list-style-type: none;
		background: rgba(204, 204, 0, 0.65);
		padding: 10px 0px;
	}
	
	header nav:nth-of-type(2) dl dd ul li:first-of-type {
		padding-top: 20px;
	}
	
	header nav:nth-of-type(2) dl dd ul li:last-of-type {
		padding-bottom: 20px;
	}
	
	header nav:nth-of-type(2) dl dd ul li a {
		color: #000000;
	}
	
	main {
		width: 100%;
	}
	
	footer {
		margin-top: 50px;
		height: 30px;
		line-height: 30px;
		text-align: center;
		font-size: 12px;
	}
	
	#topTopBtn {
		width: 42px;
		height: 42px;
		right: 10px;
		bottom: 10px;
		font-size: 18px;
	}
	
	@keyframes show{
		from { opacity: 0; bottom:   0px; }
		to {   opacity: 1; bottom:  10px; }
	}
	
	@keyframes hide{
		from { opacity: 1; bottom:  10px; }
		to {   opacity: 0; bottom:   0px; }
	}
}