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


/*================================================
↓共通
================================================*/
html {
	font-size : 62.5%; /*←全体の文字サイズの基準を10pxにセット*/
	line-height: 1em; /*←全体の行間を1emにセット*/
	letter-spacing: 0.01em;
} 
.yumin {
	font-family: "游明朝体","Yu Mincho",YuMincho,serif;
}
/* clearfix */
#header:after,
#container:after,
#contents:after,
.clearfix:after{
	content:" ";
	display:block;
	height:0;
	line-height:0;
	clear:both;
	visibility:hidden;
}
#header,
#container,
#contents,
.clearfix{
	display:inline-block;
	min-height:1%;
}

/* Hides from IE-mac */
* html #header,
* html #container,
* html #contents,
* html .clearfix{height:1%;}

#header,
#container,
#contents,
.clearfix{display:block;}

/* リンクテキスト */
a:link,a:visited {
	text-decoration: underline;
	color: #009999;
}
/*a:hover {
	text-decoration: none;
	color: #ccc;
}*/
a.over,.over {cursor: pointer;}

/* 画像 */
img.width-max{
     width: 100%;
	 max-width: 1024px; /*←幅いっぱいの画像の最大サイズを指定*/
     height: auto;
	 margin: 0 auto;
     display:block;
}

/* 余白/フロート */
.clear{clear:both;}
.left{ float:left;  }
.right{ float:right; }
.align-c{ text-align:center; }
.align-r{ text-align:right; }
.align-l{ text-align:left; }



/*================================================
↓各デバイスでの表示切り替え
================================================*/
.sp,
.tab,
.width900min {
	display: none;
}
.pc {
	display: block;
}

@media screen and (max-width: 1024px) {
.sp,
.tab,
.width900 {
	display: none;
}
.pc {
	display: block;
}
}

@media screen and (max-width: 900px) {
.sp,
.tab {
	display: none;
}
.pc,
.width900min {
	display: block;
}
}

@media screen and (max-width: 768px) {
.sp,
.pc {
	display: none;
}
.tab,
.width900min {
	display: block;
}
}

@media screen and (max-width: 480px) {
.pc,
.tab {
	display: none;
}
.sp,
.width900min {
	display: block;
}
}


/*================================================
↓レイアウト＿全体
================================================*/
html {
	width: 100%;
	height: 100%;
}
body {
	font-size : 1.4em; /*←サイト全体の文字サイズの基準*/
	font-family: "Lato","游ゴシック体","Yu Gothic",YuGothic,"ヒラギノ角ゴ Pro",
	"Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif;
	font-weight: 500;
	color: #5b5b5b;
	background-color: #fff; 
	width: 100%;
	height:100%;
	-webkit-text-size-adjust: 100%;/*←iOS、Safari向け。PC向けサイトをスマートフォンで閲覧した時に文字サイズが大きくならないようにする。*/
}
@media screen and (max-width: 1024px) {
body {
	/*background-color:#ffff00; /*きいろ 最後には無効に！*/
	font-size : 1.3em;
}
}
@media screen and (max-width: 768px) {
body {
	/*background-color:#6C3; /*きみどり 最後には無効に！*/
	font-size : 1.25em;
}
}
@media screen and (max-width: 640px) {
body {
	/*background-color:#F39; /*きみどり 最後には無効に！*/
}
}
@media screen and (max-width: 480px) {
body {
	/*background-color:#41C9FB; /*みずいろ 最後には無効に！*/
}
}


/*================================================
↓レイアウト＿レスポンシブ対応（上下余白・サイド余白）
================================================*/
.inner-wrap { /*可変幅*/
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
}
.ajs-mg { /*可変マージン*/
	margin-bottom: 3em;
	overflow: hidden;
}

@media screen and (max-width: 1500px) {
.inner-wrap {
	padding-left: 2.5em;
	padding-right: 2.5em;
}
}
@media screen and (max-width: 800px) {
.inner-wrap {
	max-width: 900px;
	padding-left: 2.2em;
	padding-right: 2.2em;
}
}

@media screen and (max-width: 480px) {
.inner-wrap {
	padding-left: 1.2em;
	padding-right: 1.2em;
}
}


/*================================================
↓なかしま仕様
================================================*/
/*--------------------------------------------------------
↓ローディング
--------------------------------------------------------*/
#wrapper {
	opacity: 0;
}
#loader-wrap {
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	background-color: #fff;
	z-index: 9999;
}
#loader {
	text-align: center;
	position: absolute;
	width: 100px;
	height: 40px;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
#loader .loader-inner div{
	background-color: #1bbb48;
}


/*--------------------------------------------------------
↓ナビゲーション
--------------------------------------------------------*/
nav {
    background-color: rgba(27,187,72,0.9);
    display: none;
    position: fixed;
    top: 0;
	left: 0;
	width: 100%;
    height: 100%;
    z-index: 999;
}
nav .closeMenu {
    float: right;
	width: 50px;
	margin: 20px 20px 0 0;
	cursor: pointer;
}
nav .navi-inn {
	position: absolute;
	width: 450px;
	height: 450px;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
nav .navi-inn ul {
	width: 100%;
	height: 100%;
}
nav .navi-inn ul li {
	width: 24%;
	height: auto;
	margin-right: 14%;
	margin-bottom: 6%;
	display: inline-block;
	float: left;
}
nav .navi-inn ul li:nth-child(3n) {
	margin-right: 0;
}
nav .navi-inn ul li:nth-child(7),
nav .navi-inn ul li:nth-child(8),
nav .navi-inn ul li:nth-child(9) {
	margin-bottom: 0;
}
nav .navi-inn ul li img {
	width: 100%;
	height: auto;
}
@media screen and (max-width: 768px) {
nav .navi-inn {
	width: 400px;
	height: 400px;
}
}
@media screen and (max-width: 480px) {
nav .navi-inn {
	width: 300px;
	height: 300px;
}
}