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


/* ---------------------------------------------------------------------------------------------

　   スマホメニュー

--------------------------------------------------------------------------------------------- */

/* -------------

　 　ハンバーガー ボタン

---------------- */
.openbtn{
	position:fixed;
	top:25px!important;
	right: 4%;
    width: 62px;
    height:62px;
	cursor: pointer;
	z-index: 99999;
	}

/*×に変化*/	
.openbtn span{
    display: inline-block;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 1px;
	background-color: #50be50;
  	width: 100%;
	}
/*線の位置*/
.openbtn span:nth-of-type(1) {
	top:15px;
	}
.openbtn span:nth-of-type(2) {
	top:28px;
	}

/*ボタン アクティブ時*/
.openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    -webkit-transform: translateY(6px) rotate(-22.5deg);
    -ms-transform: translateY(6px) rotate(-22.5deg);
    -o-transform: translateY(6px) rotate(-22.5deg);
    transform: translateY(6px) rotate(-22.5deg);
	}
.openbtn.active span:nth-of-type(2){
	display: block;
    top: 30px;
    left: 18px;
    -webkit-transform: translateY(-6px) rotate(22.5deg);
    -ms-transform: translateY(-6px) rotate(22.5deg);
    -o-transform: translateY(-6px) rotate(22.5deg);
    transform: translateY(-6px) rotate(22.5deg);
	}

    @media only screen and (max-width: 1020px) {}
	@media only screen and (max-width: 900px) {
		.openbtn{
			position:fixed;
			right: 6%;
			}
		}
	@media only screen and (max-width: 767px) {}
    @media only screen and (max-width: 600px) {
		.openbtn{
			position:fixed;
			top:15px!important;
			right: 7%;
			}
		}
	@media only screen and (max-width: 480px) {
		.openbtn{
			position:fixed;
			top:12px!important;
			right: 7%;
			}
		}
    @media only screen and (max-width: 320px) {}











/* -------------

　 　PC用ナビメニュー

---------------- */

#gNav{
	height: 90px;
	width:100%;
	transition: 0.75s;
	}
#gNav ul.nav {
	position:absolute;
    top:0;
    /*right: 10%;*/
	right: 15%;
	list-style: none;
	display: flex;
	align-content: center;
	margin: 1rem 0 0 0;
	}
#gNav li {
	position: relative;
	}
#gNav ul.nav > li {
	margin-right: 2.75rem;
	}
#gNav ul.nav > li:last-child {
	margin-right: 0;
	}
#gNav ul.nav > li > a {
	color: #777;
	line-height: 110%;
	text-decoration: none;
	text-align: center;
	transition: .3s;
	}

#gNav ul.nav > li > a .icon{
	width: 100%;
	max-width: 48px;
	height: auto;
	max-height: 34px;
	margin: 0 auto 0.6rem auto;
	transition: .3s;
	}
#gNav ul.nav > li > a .icon img{
	width: 100%;
	height: auto;
	}
#gNav ul.nav > li > a .jp{
	display: block;
	font-size: 0.95rem;
	font-weight: bold;
	transition: .3s;
	}
#gNav ul.nav > li > a .en{
	display: none;
	font-size: 0.5rem;
	letter-spacing: 2px;
	}

#gNav ul.nav > li > a:hover .icon,
#gNav ul.nav > li > a:hover .jp{
	transform: scale(1.2, 1.2);
	}






#gNav .sub-menu {
    visibility: hidden;
    opacity: 0;
    z-index: 100;
    display: block;
    position: absolute;
    top: 74px!important;
    left: 50%;
    margin-left: -140px;
    width: 200px;
	text-align: center;
    -webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
    transition: all .2s ease;
	}
#gNav .sub-menu a {
    display: block;
    padding: 14px 10px;
    line-height: 1.2em;
	border: none;
	border-radius: 0;
	background: #fff;
	color: #487f4b!important;
	text-decoration: none;
	}
#gNav .sub-menu a:hover {
    background: #eee;
	}
#gNav .sub-menu li {
	border-bottom: solid 1px #eee;
	}
#gNav .sub-menu li:last-child {
	border-bottom: none;
	}
#gNav .sub-menu a:hover:after {
    content: none;
	}
#gNav .sub-menu li {
    display: block;
    font-size: 14px;
    padding: 0;
    margin: 0;
	}
#gNav .sub-menu li:last-child {
    border-bottom: none;
	}
#gNav ul > li:hover {
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
	}

#gNav li:hover ul.sub-menu {
    top: 100px;
    visibility: visible;
    opacity: 1;
    z-index: 101;
	}
#gNav li ul li:after {
    content: none;
	}
#gNav li:hover ul.sub-menu a {
    color: #487f4b;
	text-decoration: none;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	}
	@media only screen and (max-width: 1020px) {
		#gNav ul.nav {
			display: none;
			}
		}
	@media only screen and (max-width: 480px) {
		#gNav{
			height: 60px;
			}
		}
	@media only screen and (max-width: 320px) {
		#gNav{
			height: 54px;
			}
		}





/*snsアイコン 2025年5月追記*/
#gNav .nav_sns___wrap{
	position: absolute;
	top: 1.9rem;
	right: 10%;
	}
#gNav .nav_sns___wrap a{
	color: #50be50;
	transition: .3s;
	}
#gNav .nav_sns___wrap a:hover{
	opacity: .6;
	}
#gNav .nav_sns___wrap i{
	font-size: 2rem;
	font-weight: normal;
	}
	@media only screen and (max-width: 1020px) {
		#gNav .nav_sns___wrap{
			display: none;
			}
		}





/*　全体　*/
#g-nav{
    position:fixed;
    z-index: -1;
	top:0;
	width:100%;
    height: 100vh;
	background: #fff;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	overflow: hidden;
	opacity: 0;

	}
#g-nav.panelactive{
	opacity: 1;
	z-index:9999;
	}

/*ナビの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    position: fixed;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
	}
	@media only screen and (max-width: 800px) {}
	@media only screen and (max-width: 400px) {}




/*ロゴマーク*/
.g_ttl{
	width: 50%;
	max-width: 180px;
	height: auto;
	max-height: 151.998px;
	margin: 5.5rem auto 3rem auto;
	}

.g_ttl a{
	display: block;
	/*color: #fff;*/
	margin: 0 auto;
	transition: all .2s ease;
	}
.g_ttl a:hover{
	opacity: .6;
	}
.g_ttl img{
	width: 100%;
	height: auto;
	}

	@media only screen and ( max-width : 800px ) {}
	@media only screen and ( max-width : 640px ) {}
	@media only screen and ( max-width : 480px ) {
		/*ロゴマーク*/
		.g_ttl{
			margin: 4.5rem auto 2rem auto;
			}
		}
	@media only screen and ( max-width : 360px ) {}







/* -------------

　 　メニュー 一覧

---------------- */

/*-- 囲み --*/
.nav_wrap{
	display: flex;
	justify-content: space-between;
	width: 88%;
	margin: 2rem auto 0 auto;
	}

/*左 メニュー*/
.nav_wrap__sub{
	color: #555;
	width: 66%;
	}
/*右 連絡先*/
.nav_wrap__sub:last-child{
	width: 34%;
	}

.nav_wrap__sub a{
	color: #555;
	}

/*見出し*/
.nav_wrap__sub h3{
	color: #50be50;
	font-size: 150%;
	margin-bottom: 1rem;
	}
/*内容 囲み*/
.nav_wrap__sub .inner{
	display: flex;
	justify-content: space-between;
	}

/*メニュー ul（親階層）*/
.sub_nav{
	width: 50%;
	}
.sub_nav > li{
	list-style: none;
	font-size: 105%;
	line-height: 110%;
	margin-bottom: 1.35rem;
	}
.sub_nav > li::before{
	content: url("../img/arrow01.svg");
	display: inline-block;
	width: 8px;
	height: 7px;
	margin-right: 0.5rem;
	position: relative;
	top: -3px;
	left: 0;
	transition: .2s;
	}
.sub_nav > li:hover::before{
	opacity: 0;
	left: 1rem;
	}

/*メニュー（子階層）*/
.sub_nav > li > ul{}
.sub_nav > li > ul > li{
	list-style: none;
	font-size: 80%;
	line-height: 120%;
	margin-top: 1rem;
	margin-left: 1rem;
	}
.sub_nav > li > ul > li::before{
	content: '-';
	display: inline-block;
	margin-right: 0.5rem;
	}


/*contact*/

/*右 全体囲み*/
.nav_wrap__sub .address{
	border-left: solid 1px #50be50;
	padding-left: 2rem;
	}

/*連絡先 囲み*/
.nav_wrap__sub .add__tx{
	margin-bottom: 2rem;
	}
/*社名*/
.nav_wrap__sub .add__tx .ttl{
	font-size: 130%;
	margin: 0 0 0.5rem 0;
	}
/*住所・受付時間*/
.nav_wrap__sub .add__tx .tx{
	font-size: 80%;
	line-height: 150%;
	}

/*フォームページへのリンク*/
.nav_wrap__sub .add__form{}
.nav_wrap__sub .add__form ul{
	width: 100%;
	}

/* コピーライト */
#g-nav .cpright{
	width: 100%;
	margin: 3rem auto 0 auto;
	}
#g-nav .cpright small{
	font-size:70%;
	}

/* sns */
.add__sns{
	width: 88%;
	margin: 1rem auto 0 auto;
	display: flex;
	justify-content: flex-start;
	}
.add__sns a{
	color: #50be50;
	margin-right: 1rem;
    }
.add__sns i{
	font-size:180%;
	font-weight: normal;
	line-height: 100%;
    }


	@media only screen and (max-width: 840px) {
		.sub_nav > li{
			font-size: 100%;
			}
		}
	@media only screen and (max-width: 767px) {
		/*-- 囲み --*/
		.nav_wrap{
			display: block;
			justify-content:flex-start;
			width: 88%;
			margin: 2rem auto 0 auto;
			}
		/*左 メニュー*/
		.nav_wrap__sub{
			width: 100%;
			}
		/*右 連絡先*/
		.nav_wrap__sub:last-child{
			width: 100%;
			margin-top: 2rem
			}
		/*メニュー ul（親階層）*/
		.sub_nav{
			width: 100%;
			}
		/*右 全体囲み*/
		.nav_wrap__sub .address{
			border-left: none;
			padding-left: 0;
			}
		/*住所・受付時間*/
		.nav_wrap__sub .add__tx .tx br{
			display: none;
			}
		}
	@media only screen and (max-width: 600px) {
		/*-- 囲み --*/
		.nav_wrap{
			margin: 1rem auto 0 auto;
			}
		.sub_nav > li{
			line-height: 110%;
			margin-bottom: 1rem;
			}
		.sub_nav > li::before{
			margin-right: 0.2rem;
			}
		.sub_nav > li > ul > li{
			line-height: 110%;
			margin-top: 0.7rem;
			margin-left: 0.5rem;
			}
		.sub_nav > li > ul > li::before{
			margin-right: 0.1rem;
			}
		/*右 連絡先*/
		.nav_wrap__sub:last-child{
			margin-top: 0;
			}
		}
	@media only screen and (max-width: 540px) {}
	@media only screen and (max-width: 480px) {}
	@media only screen and (max-width: 360px) {}
	@media only screen and (max-width: 260px) {}