/* CSS Document */
@charset "utf-8";

/* reset */
*{
	margin:0;
	padding:0;
	list-style:none;
	font-size:100%;
	/*border:none;*/
}

/* general */
html,
body{
	height:100%;
	color:#000000;
	line-height:2;
	background-color:#FFFFFF;
	font-family: "Noto Sans JP", serif;
}
img, video{
	border:none;
	vertical-align: top;
	max-width: 100%;
	height: auto;
	width :auto;　
}
/* ----------------------------- */
/* Google font */
.noto-sans-jp-<uniquifier> {
  font-family: "Noto Sans JP", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
/* -------------- link --------------- */
/* link */
a{
	color:#005D1B;
	text-decoration:none;
	font-weight: bold;
}
a:hover{
	color:#2C8701;
}
/* -------------- text --------------- */
h1{
	z-index: 999;
	width:0px;
	height:0px;
	background-image:url(../images/logo.png);
	background-repeat:no-repeat;
	padding-top:200px;
	padding-left:200px;
	position:fixed;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}
h2{
	line-height:1.2em;
	margin-bottom:30px;
	overflow:hidden;
	text-align: center;
	color:#000000;
}
h3{
	font-size:1.5em;
	text-align:center;
}
h2, h3, .clear{clear:both;}
.center{text-align:center; clear:both; width:auto; margin-bottom:30px;}
.bottom{margin-bottom:30px;}
.left{float:left; margin-right:20px;}
.clear{clear:both; margin-bottom:30px;}
.white{color:#FFF;}
.textbox{
	max-width:600px;
	margin-top:10px;
	margin-bottom:30px;
	margin-left:auto;
	margin-right:auto;
	clear:both;
}
span.komoji{font-size:0.8em;}
span.oomoji{font-size:1.4em; font-weight:bold;}
span.fontframe{border:solid 1px #000000; padding:5px; margin-right:10px;}

.whitebox{
	padding:5%;
	background-color:#FFFFFF;
	opacity: 0.9;
	filter: alpha(opacity=90);
	-ms-filter: "alpha(opacity=90)";
}
p.back{
	clear:both;
	background-color:#FFFFFF;
	font-size:0.7em;
	width:20%;
	padding:1%;
	margin-right:80%;
	text-align:center;
	border:1px solid #005D1B;
}
section, .bottom{margin-bottom:30px;}

.kadomruframe{
	clear:both;
}
.kadomruframe li{
	border:8px solid #D9CD2C;
	background-color: #FFFFFF;
	border-radius: 10px;
	text-align:center;
	margin-bottom:30px;
	margin-left:7%;
	margin-right:7%;
	padding:2%;
}
/* ------------- img ---------------- */
/* img expand */
.hoverexpandb img {
  transition: 0.5s;
}
.hoverexpand img:hover {
  -moz-transform: scale(1.1,1.1);
  -webkit-transform: scale(1.1,1.1);
  -o-transform: scale(1.1,1.1);
  -ms-transform: scale(1.1,1.1);
}

/* ------------- Frame size and BG ---------------- */
div.category_bg{
	width:100%;
	-webkit-box-shadow: 0px -5px 10px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px -5px 10px rgba(0,0,0,0.3);  
	box-shadow: 0px -5px 10px rgba(0,0,0,0.3);
}
article.category, header, footer{
	width:auto;
	margin-left:auto;
	margin-right:auto;
}
article.category{
	padding:20px;
	max-width:860px;
}
header{
	height:200px;
}
header, footer{max-width:900px;}
/* -------------- Navbar --------------- */
ul.navtop{
	margin-top:10px;
	float:right;
	overflow:hidden;
}
ul.navtop li{
	float:left;
	margin-left:30px;
}
ul.navtop li a{
	color:#000000;
}
ul.navtop li a:hover{
	color:#2C8701;
}
/* -------------- Footer --------------- */
#footer_bg{background-color: #006634;}
ul.footer_li{
	margin-top:10px;
	margin-bottom: 20px;
	float:left;
	width:20%;
	padding:2.5%;
}
ul.footer_li li{
	font-size:0.8em;
	clear:both;
	color: #FFFFFF;
}
ul.footer_li li a{
	color: #FFFFFF;
}
ul.footer_li li a:hover{
	color: #93c01f;
}
li.footertitle{font-size:0.6em; text-decoration:underline;}
p.copyright, .center{
	text-align:center;
	clear:both;
}
/* ---------------------------- PC ----------------------------- */
@media print, screen and (min-width: 769px){
/* -------------- font --------------- */
body{
	font-size:17px;
}
h2{
	font-size:2.8em;
}
/* -------------- kadomru --------------- */
.kadomruframe li{
	float:left;
	width:28%;
}
}
/* ---------------------------- Tablet ----------------------------- */
@media screen and (max-width: 768px){
/* -------------- font --------------- */
body{
	font-size:14px;
}
h2{
	font-size:2.0em;
}
/* -------------- Footer --------------- */
ul.footer_banner{
	width:100%;
	padding-top:10px;
}
/* -------------- display:none --------------- */
ul.navtop{
	display:none;
}
/* -------------- Kadomru --------------- */
.kadomruframe li{
	margin-left:7%;
	margin-right:7%;
	padding:2%;
	width:80%;
}
}