@charset "utf-8";

/* ================ Icon Font ================= */
@font-face {
	font-family: 'icomoon';
	src: url('../font/icomoon.eot');
	src: url('../font/icomoon.eot?#iefix') format('embedded-opentype'),
		url('../font/icomoon.woff') format('woff'),
		url('../font/icomoon.ttf') format('truetype'),
		url('../font/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* ================ Reset ================= */
body {
	margin:0;
	padding: 0;
	-webkit-text-size-adjust: none;
	font-family: 'icomoon', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', Arial, Helvetica, Verdana, sans-serif;
	letter-spacing: -0.001em;
	position: static;
	color: #333;
	line-height: 1.5;
}
img{
	vertical-align: bottom;
	border: 0;
}
h1, h2, h3, h4, h5, h6, p{
	margin: 0;
	padding: 0;
}
article,aside,details,figcaption,figure,dl,dt,dd,
footer,header,hgroup,menu,nav,section {
	display:block;
	margin: 0;
	padding: 0;
}
ol,ul,li {
	list-style:none;
	padding:0;
	margin: 0;
}
input, select {
	vertical-align:middle;
}

a {
	-webkit-tap-highlight-color:transparent;
	-webkit-tap-highlight-color:rgba( 100, 100, 100, 0.5 );
	text-decoration: none;
	color: #333;
}

/* ================ Style ================= */
html,body{
	width: 100%;
	height: 100%;
	min-width: 100%;
	position: relative;
	top: 0;
	left: 0;
}

header{
	width: 100%;
	padding: 20px;
	background-color: #fff;
	box-sizing: border-box;
}
header h1 {
	width: 100%;
	margin: 0 auto;
	background-color: #fff;
}

footer{
	width: 100%;
	padding: 20px 0;
	background-color: #F6F6F6;
}
footer #f_box{
	width: 100%;
	margin: 0 auto;
}
footer #f_box p {
	font-size: 12px;
	text-align: center;
}



#wrapper nav{
	width: 100%;
	height: 35px;
	padding: 15px 0 0;
	position: fixed;
	top: 51px;
	left: 0;
	z-index: 90;
}
#wrapper nav ul {
	overflow: hidden;
	width: 96%;
	margin: 0 auto;
}
#wrapper nav ul li {
	color: #fff;
	font-weight: bold;
	font-size: 0.7rem;
	float: left;
}
#wrapper nav ul li a {
	color: #fff;
}
#wrapper nav ul li a:hover {
	color: #99cc00;
	background-color: #fff;
}
#wrapper nav ul li.backtop {
	display: none;
}


#wrapper nav{
	background: url(../images/bg_localnav.png) top left repeat-x;
	background-size: contain;
}

#wrapper nav ul li.current {
	background: url(../images/bg_message.png) top left no-repeat;
	padding: 0 0 0 20px;
	margin: 0 10px 0 0;
}

#wrapper {
	width: 90%;
	padding: 70px 0 0;
	margin: 0 auto 70px;
	text-align: center;
}
#wrapper .primary {
	width: 100%;
	margin: 0 auto 140px;
	overflow: hidden;
}





/* archive */
#wrapper .archive {
	overflow: hidden;
	box-sizing: border-box;
	margin: 0 0 5%;
}
#wrapper .archive dt a {
	display: block;
	overflow: hidden;

	font-size: 12px;
	font-weight: bold;
	line-height: 3em;
	text-align: left;

	background-color: #fff;
	border: 1px solid #ccc;

	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;

	transition: all .3s;
}
#wrapper .archive dt a:before {
	display: block;
	float: left;
	content: '\f0a3';
	font-size: 14px;
	font-size: 1.4rem;
	padding: 0 20px;
	margin: 0 10px 0 0;
	border-right: 1px solid #ccc;
}


#wrapper .archive dt a.active {
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}
#wrapper .archive dt a.active:before {
	content: '\e605';
	padding: 0px 16px;
}

#wrapper .archive dd {
	margin: 0;
	padding: 0;
	display: none;
}
#wrapper .archive dd a {
	display: block;
	margin: 0;
	padding: 20px 20px 20px 15px;
	text-align: left;

	font-size: 12px;
	font-weight: bold;
	line-height: 1.2;

	background-color: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;

	transition: all .3s;
}
#wrapper .archive dd a.last-child {
	-moz-border-radius: 0px 0px 5px 5px;
	-webkit-border-radius: 0px 0px 5px 5px;
	border-radius: 0px 0px 5px 5px;
}
#wrapper .archive dd a.current {
	background-color: #86be11;
	color: #fff;
}


#wrapper .archive-link h5 {
	margin: 0 auto 4%;
	text-align: center;
	display: table;
}

#wrapper .archive-link h5 img {
	width: 100%;
	padding: 0 3%;
}
#wrapper .archive-link ul {
	overflow: hidden;
	margin: 0 0 10%;
}
#wrapper .archive-link ul li.link-box {
	float: left;
	margin: 0 0 24px;
	background-color: #fff;
	border: 2px dotted #86be11;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px!important;
	transition: all .2s;
}
#wrapper .archive-link ul li.link-box:nth-child(2n) {
	margin-right: 0;
}
#wrapper .archive-link ul li.link-box a {
	display: block;
	padding: 15px;
	text-align: left;
	font-size: 0.9rem;
	position: relative;
	top: 0;
	left: 0;
}
#wrapper .archive-link ul li.link-box .image {
	margin: 0 0 13px;
	width: 100%;
}
#wrapper .archive-link ul li.link-box dl dt {
	font-weight: bold;
	line-height: 2;
	font-size: 12px;
	height: auto;
}
#wrapper .archive-link ul li.link-box dl dt:before {
	content: '\f078';
	margin: 0 5px 0 0;
	color: #86be11;
}


#footer {
	width: 100%;
	height: 50px;
	background: url(../images/bg_footer.png) top left repeat-x;
	background-size: auto 50px;
	position: relative;
	top: 0;
	left: 0;
	z-index: 100;
}
#footer .inner {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	padding: 14px 0 0 0;
}
#footer .notice {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
}

#footer .copy {
	text-align: center;
	color: #fff;
	font-size: 0.7rem;
}
#footer .pagetop {
	display: block;
	width: 60px;
	height: 48px;
	padding-top: 12px;
	background-color: #fff;
	border: 4px solid;
	border-color: rgba( 134, 190, 17, 1);

	overflow: hidden;

	-moz-border-radius: 68px;
	-webkit-border-radius: 68px;
	-ms-border-radius: 68px;
	text-align: center;
	color: #86be11;
	font-weight: bold;
	font-size: 0.9rem;

	position: absolute;
	left: 50%;
	bottom: 70px;
	margin-left: -34px;
}

#footer .pagetop img {
	width: 26px;
}