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

.sns-base-pc {
	height: 35px;
	position: fixed;
	left: 20px;
	top: 20px;
	width: 70px;
	z-index: 99;
	display: flex;
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
}
.sns-naka-pc {
	height: 35px;
	width: 35px;
}
.sns-naka-pc img {
	height: auto;
	width: 80%;
}
/*-----------------------------*/
/*menu0001
/*-----------------------------*/

.sp-menu-box1 {
	display: none;
}
.sp-menu-box1.fixed {
}
.sp-menu-box1.hide {
}
/*sns*/

.sns-base {
}
.sns-naka {
}
.sns-naka img {
}
/*menu*/


.menu {
}
.menu__line {
}
.menu__line--center {
}
.menu__line--bottom {
}
.menu__line--top.active {
}
.menu__line--center.active {
}
.menu__line--bottom.active {
}
/*-----------------------------*/
/*menu0002
/*-----------------------------*/

.sp-menu-box2 {
	display: none;
}
.sp-menu-box2.fixed {
}
.sp-menu-box2.show {
}
.title-head {
	display: none;
}
.title-head img {
}
.menu002 {
}
.menu__line2 {
}
.menu__line--center2 {
}
.menu__line--bottom2 {
}
.menu__line--top2.active {
}
.menu__line--center2.active {
}
.menu__line--bottom2.active {
}
/*gnav*/
.gnav {
	display: none;
	height: 100%;
	position: fixed;
	width: 100%;
	z-index: 97;
	background-image: url(../img/black-bk.png);
	background-repeat: repeat;
}
.gnav__wrap {
	align-items: center;
	display: flex;
	height: 100%;
	justify-content: center;
	position: absolute;
	width: 100%;
}
.gnav__menu__item {
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
	text-align: center;
}
.gnav__menu__item a {
	color: #fff;
	font-size: 20px;
	font-weight: 200;
	text-decoration: none;
	transition: .5s;
	letter-spacing: 0.15em;
}
.gnav__menu__item a:hover {
	color: #666;
}
.g-sns-box {
	display: flex;
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	text-align: left;
	height: 40px;
	width: 80%;
	margin-right: auto;
	margin-left: auto;
}
.g-sns-box-naka {
	width: 80px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 30px;
	text-align: left;
}
.g-sns-box-naka img {
	height: 40px;
	width: auto;
}

/* 画面サイズが870以下の場合に適用 */
@media only screen and (max-width: 870px) {
/*-----------------------------*/
/*menu0001
/*-----------------------------*/

.sp-menu-box1 {
	position: absolute;
	justify-content: space-between;
	height: 50px;
	width: 100%;
	position: fixed;
	top: 0px;
	display: flex;
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	z-index: 98;
	transition: .5s;
}
.sp-menu-box1.fixed {
	position: fixed;
	top: 0;
}
.sp-menu-box1.hide {
	transform: translateY(-100%);
}
/*sns*/

.sns-base {
	height: 35px;
	position: fixed;
	left: 20px;
	top: 20px;
	width: 70px;
	z-index: 99;
	display: flex;
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
}
.sns-naka {
	height: 35px;
	width: 35px;
}
.sns-naka img {
	height: auto;
	width: 80%;
}
/*menu*/


.menu {
	height: 20px;
	position: fixed;
	right: 20px;
	top: 20px;
	width: 30px;
	z-index: 99;
	display: block;
	cursor: pointer;
}
.menu__line {
	display: block;
	height: 2px;
	position: absolute;
	transition: transform .3s;
	width: 100%;
	background-color: #FFF;
}
.menu__line--center {
	top: 9px;
}
.menu__line--bottom {
	bottom: 0;
}
.menu__line--top.active {
	top: 8px;
	transform: rotate(45deg);
	background: #fff;
}
.menu__line--center.active {
	transform: scaleX(0);
	background: #fff;
}
.menu__line--bottom.active {
	bottom: 10px;
	transform: rotate(135deg);
	background: #fff;
}
/*-----------------------------*/
/*menu0002
/*-----------------------------*/

.sp-menu-box2 {
	position: absolute;
	justify-content: space-between;
	height: 50px;
	width: 100%;
	position: fixed;
	top: -50px;
	background: rgba(255,255,255,1);
	display: flex;
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	transition: .5s;
	z-index: 98;
}
.sp-menu-box2.fixed {
	position: fixed;
	top: 0;
}
.sp-menu-box2.show {
	top: 0;
}
.title-head {
	text-align: left;
	margin: 0px;
	padding: 0px;
	width: 100%;
	display: block;
}
.title-head img {
	height: 32px;
	width: auto;
	margin-left: 20px;
}
.menu002 {
	height: 20px;
	position: fixed;
	right: 20px;
	width: 30px;
	z-index: 99;
	display: block;
	cursor: pointer;
}
.menu__line2 {
	display: block;
	height: 2px;
	position: absolute;
	transition: transform .3s;
	width: 100%;
	background-color: #e8cfa0;
}
.menu__line--center2 {
	top: 9px;
}
.menu__line--bottom2 {
	bottom: 0;
}
.menu__line--top2.active {
	top: 8px;
	transform: rotate(45deg);
	background: #e8cfa0;
}
.menu__line--center2.active {
	transform: scaleX(0);
	background: #e8cfa0;
}
.menu__line--bottom2.active {
	bottom: 10px;
	transform: rotate(135deg);
	background: #e8cfa0;
}
/*-----------------------------*/
/*menu0003グリーン
/*-----------------------------*/

.sp-menu-box3 {
	position: absolute;
	justify-content: space-between;
	height: 50px;
	width: 100%;
	position: fixed;
	top: -50px;
	background: rgba(255,255,255,1);
	display: flex;
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	transition: .5s;
	z-index: 98;
}
.sp-menu-box3.fixed {
	position: fixed;
	top: 0;
}
.sp-menu-box3.show {
	top: 0;
}
.title-head {
	text-align: left;
	margin: 0px;
	padding: 0px;
	width: 100%;
}
.title-head img {
	height: 32px;
	width: auto;
	margin-left: 20px;
}
.menu003 {
	height: 20px;
	position: fixed;
	right: 20px;
	width: 30px;
	z-index: 99;
	display: block;
	cursor: pointer;
}
.menu__line3 {
	display: block;
	height: 2px;
	position: absolute;
	transition: transform .3s;
	width: 100%;
	background-color: #005321;
}
.menu__line--center3 {
	top: 9px;
}
.menu__line--bottom3 {
	bottom: 0;
}
.menu__line--top3.active {
	top: 8px;
	transform: rotate(45deg);
	background: #005321;
}
.menu__line--center3.active {
	transform: scaleX(0);
	background: #005321;
}
.menu__line--bottom3.active {
	bottom: 10px;
	transform: rotate(135deg);
	background: #005321;
}
/*gnav*/
.gnav {
	background-image: url(../img/black-bk.png);
	display: none;
	height: 100%;
	position: fixed;
	width: 100%;
}
.gnav__wrap {
	align-items: center;
	display: flex;
	height: 100%;
	justify-content: center;
	position: absolute;
	width: 100%;
}
.gnav__menu__item {
	margin: 20px 0;
	text-align: left;
}
.gnav__menu__item a {
	color: #fff;
	font-size: 1em;
	font-weight: 300;
	padding: 20px;
	text-decoration: none;
	transition: .5s;
}
.gnav__menu__item2 {
	margin: 5px 0;
	text-indent: 15px;
	text-align: left;
}
.gnav__menu__item2 a {
	color: #fff;
	font-size: 0.8em;
	font-weight: 300;
	text-decoration: none;
	transition: .5s;
	padding-top: 7px;
	padding-right: 20px;
	padding-bottom: 7px;
	padding-left: 20px;
}
.gnav__menu__item1 {
	text-indent: 15px;
	text-align: left;
	margin-top: -14px;
	margin-right: 0;
	margin-bottom: 5px;
	margin-left: 0;
}
.gnav__menu__item1 a {
	color: #fff;
	font-size: 0.8em;
	font-weight: 300;
	text-decoration: none;
	transition: .5s;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 7px;
	padding-left: 20px;
}
.gnav__menu__item a:hover, .gnav__menu__item1 a:hover, .gnav__menu__item2 a:hover {
	color: #666;
}
}


/* 画面サイズが480以下の場合に適用 */
@media only screen and (max-width: 480px) {
/*gnav*/
.gnav {
	background-image: url(../img/black-bk.png);
	display: none;
	height: 100%;
	position: fixed;
	width: 100%;
}
.gnav__wrap {
	align-items: center;
	display: flex;
	height: 100%;
	justify-content: center;
	position: absolute;
	width: 100%;
}
.gnav__menu__item {
	margin: 10px 0;
}
.gnav__menu__item a {
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	padding: 0px;
	text-decoration: none;
	transition: .5s;
}
.gnav__menu__item2 {
	margin: 3px 0;
	text-indent: 5px;
	text-align: left;
}
.gnav__menu__item2 a {
	color: #fff;
	font-size: 0.7em;
	font-weight: 600;
	text-decoration: none;
	transition: .5s;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 3px;
	padding-left: 0px;
	letter-spacing: 0.15em;
}
.gnav__menu__item1 {
	text-indent: 5px;
	text-align: left;
	margin-top: -8px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
}
.gnav__menu__item1 a {
	color: #fff;
	font-size: 0.7em;
	font-weight: 600;
	text-decoration: none;
	transition: .5s;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 3px;
	padding-left: 0px;
	letter-spacing: 0.15em;
}
.g-sns-box {
	display: flex;
	justify-content: left; /* 子要素をflexboxにより中央に配置する */
	align-items: top;  /* 子要素をflexboxにより中央に配置する */
	text-align: left;
	height: 30px;
	width: 100%;
}
.g-sns-box-naka {
	width: 100%;
	margin-right: auto;
	margin-top: 40px;
	text-align: left;
	margin-left: 0px;
}
.g-sns-box-naka img {
	height: 30px;
	width: 30px;
	margin-left: 0px;
}
}



/* 画面サイズが870以下の場合に適用 */
@media only screen and (max-width: 414px) {
}
