body {
overflow: hidden; /* スクロールバーを非表示 */
}
::-webkit-scrollbar {
display: none; /* Webkit系ブラウザ（Chrome, Safariなど）のスクロールバーを非表示 */
}
p {
font-family: 'Zen Kaku Gothic New', sans-serif;
color: #707070;
}
.pcNone{
	display: none !important; 
}
.spNone{
	display: block !important;
}

/* scroll anime */
.c-scrolldown {
width: 3px;
height: 90px; /* using the $line-height variable */
position: absolute;
bottom: 0px;
left: 57px;

margin: 0 auto;
overflow: hidden;
}
.c-scrolldown .c-line {
width: 100%;
height: 100%;
display: block;
background: linear-gradient(to bottom, rgba(125, 181, 64, 1) 50%, rgba(255, 255, 255, 0) 50%);
background-position: 0 -60px; /* using the $line-height-abs variable */
background-size: 100% 200%;
animation: scrolldown 3.0s cubic-bezier(0.76, 0, 0.3, 1) forwards infinite;
}
@keyframes scrolldown {
0% {
background-position: 0 -90px;
}
75% {
background-position: 0 0;
}
100% {
background-position: 0 90px; /* using the $line-height variable */
}
}
.c-scrolldown2 {
width: 3px;
height: 90px; /* using the $line-height variable */
position: absolute;
bottom: 40px;
left: 50px;

margin: 0 auto;
overflow: hidden;
}
.c-scrolldown2 .c-line2 {
width: 100%;
height: 100%;
display: block;
background: linear-gradient(to bottom, rgba(46, 158, 111, 1) 50%, rgba(255, 255, 255, 0) 50%);
background-position: 0 -60px; /* using the $line-height-abs variable */
background-size: 100% 200%;
animation: scrolldown2 3.0s cubic-bezier(0.76, 0, 0.3, 1) forwards infinite;
}
@keyframes scrolldown2 {
0% {
background-position: 0 -90px;
}
75% {
background-position: 0 0;
}
100% {
background-position: 0 90px; /* using the $line-height variable */
}
}


/* OPanime */
.start {
background:#FFF9F0;
;
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 9000;
}
.start p {
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
display: none;
z-index: 9999;
width: 50%;
}

/* FADE */
.js-fade,
.js-fade2,
.js-fade3,
.js-fade4{
opacity: 0;
visibility: hidden;
transform: translateY(50px);
transition: opacity 1s,visibility 1s, transform 1s;
}
.js-fadeSec{
opacity: 0;
visibility: hidden;
transform: translateY(-50px);
transition: opacity 1s,visibility 1s, transform 1s;
}
.js-fadeAt{
opacity: 0;
visibility: hidden;
transform: translateX(50px);
transition: opacity 1s,visibility 1s, transform 1s;
}
.js-fadeMap{
opacity: 0;
visibility: hidden;
transform: translateX(-50px);
transition: opacity 1s,visibility 1s, transform 1s;
}

.inview {
opacity: 1;
visibility: visible;
transform: translateY(0px);
}

/* BASE */
body {
height: 100vh;
height: 100dvh;
background-color: #FFF9F0;
}

#wrap {
width: 100%;
height: 100vh;
}


/* header */
#heder{
width:100%;
}
#header {
position: fixed;
z-index: 100;
width: 100%;
top: 0;
left: 0;
}
.header_cont{
margin: 30px auto;
display: flex;
justify-content:space-between;
padding:0 50px ;
}



/* TOP */
#kv{
position: relative;
}
#kv .kvImg{
margin: 0  auto;
width: 50%;
min-width: 600px;
}
#kv .scroll{
position: absolute;
left: 50px;
bottom: 10px;
}
#kv .scroll img{
width: 20px;
}



/* mission */
#mission{
background-image:url(/assets/img/sec2_bg.png);
background-repeat: no-repeat;
background-size:cover;
border-radius:0 0 0 300px;
}
#mission .slide{
width: 100% !important;
max-width: 1200px;
float: none !important;
margin: 0 auto;
padding: 0 50px;
}
#mission h1{
margin-bottom: 60px;
display: flex;
align-items: center;
}
#mission h1::after {
content: "";
display: block;
margin-top: 20px;
width: 0;
height: 4px;
background-color: #7DB540;
transition: width 2s ease-out;
margin-left: 2rem;
box-shadow: 1px 1px 5px rgba(66, 110, 0,0.3);
}
#mission h1.inview::after {
width: 100%;
}
#mission .slide p {
color: #fff;
line-height: 2;
font-size: 20px;
font-weight: bold;
text-shadow: 1px 1px 5px rgba(66, 110, 0,0.5);
margin-bottom: 30px;
}
.aboutBtn{
color: #fff;
display: block;
font-size: 24px;
font-weight: bold;
text-align: right;
text-decoration: none;
position: relative;
}
.aboutBtn span{
border: solid 2px #fff;
padding: 10px 10px 10px 30px;
position: relative;
}
.aboutBtn span:before{
content: '';
display: block;
width: 16px; 
height: 16px;
background-image: url(/assets/img/arrow.svg);
background-size: contain;
background-repeat:no-repeat;
position:absolute;
top:14px;
left:10px;}

/* service */
.serviceCont{
width: 100%;
margin: 0 auto;
padding:30px 0;
}
.serviceCont .serviceTit{
margin-bottom: 70px;
}
.serviceCont .serviceTit img{
text-align: center;
margin: 0 auto;
}
.serviceCont .serviceBox{
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding:0 50px ;
}
.serviceCont .serviceBox ul{
display: flex;
justify-content: space-between;
list-style: none;
padding-left: 0;
}
.serviceCont .serviceBox ul li{
width: 30%;
}
.serviceCont .serviceBox .serviceImg{
position: relative;
}
.serviceCont .serviceBox .serviceImg img{
position: relative;
width: 100%;
}
.serviceCont .serviceBox .serviceImg::before{
content:"";
display:block;
width:60%;
height:6px;
background-color:#2E9E6F;
position:absolute;
top:0;
left:0px;
z-index: 10;
}
.serviceCont .serviceBox ul li .serviceSubTit {
position: relative;	
padding-top: 20px;
margin-top: 20px;
margin-bottom: 15px;
font-size: 20px;
font-weight: bold;
}
.serviceCont .serviceBox ul li .serviceSubTit::before{
content:"";
display:block;
width:60%;
height:6px;
background-color:#7DB540;
position:absolute;
top:0;
left:0;
}
.serviceCont .serviceBox ul li .serviceText {
font-size: 16px;
font-weight: 500;
}


/* access */
#access{
background-image:url(/assets/img/sec4_bg.png);
background-repeat: no-repeat;
background-size:cover;
border-radius:0 300px 0 0;
}
#access .slide{	
width: 100% !important;
max-width: 1200px;
float: none;
padding: 0 50px;
margin: 0 auto;
}
#access ul{
display: flex;
justify-content: space-between;
list-style: none;
padding-left:0;
}
#access ul li.accessMap{
width: 52%;
}
#access ul li.accessMap iframe{
width: 100%;
}
#access .accessCont{
width: 47%;
}

#access h1{
margin-bottom: 60px;
overflow: hidden;
}
#access h1 img{
float: right;
}
#access .slide p {
color: #fff;
line-height: 2;
font-size: 20px;
font-weight: bold;
text-align: right;
text-shadow: 1px 1px 5px rgba(66, 110, 0,0.3);
}


/* Footer */
#footer{
width: 100%;
background-color: #2E9E6F;
}
#footer .inquiry{
width: 100%;
}
#footer .inquiry{
display: flex;
justify-content: space-between;
list-style: none;
padding: 0;
}
#footer .inquiry li{
position: relative;
overflow: hidden;
width: 50%;
height:60vh;
}
#footer .inquiry .inquiryLink{
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 20;
height: 100%;
text-decoration: none;
}

#footer .inquiry li.inquiry1:after {
position: absolute;
content: "";
display: block;
width: 100%;
height:  60vh;
top: 0;
background: url(/assets/img/inquiry_img.png) no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-ms-background-size: cover;
background-size: cover;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
z-index: 1;
}
#footer .inquiry li.inquiry2:after {
position: absolute;
content: "";
display: block;
width: 100%;
height:  60vh;
top: 0;
background: url(/assets/img/inquiry_img2.png) no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-ms-background-size: cover;
background-size: cover;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
z-index: 1;
}
#footer .inquiry li.inquiry1:hover:after,
#footer .inquiry li.inquiry2:hover:after{
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
#footer .inquiry .inquiryLink .inquiryText{
color: #fff;
font-weight: bold;
font-size: 24px;
padding: 10px;
border: solid 2px #fff;
min-width: 200px;
text-align: center;
transition: all .3s ease-out;
}
#footer .inquiry li.inquiry1:hover .inquiryText,
#footer .inquiry li.inquiry2:hover .inquiryText{
color: #fff;
font-weight: bold;
font-size: 24px;
padding: 10px;
border: solid 2px #7DB540;
min-width: 200px;
text-align: center;
background-color: #7DB540;
}

#footer .inquiry .inquiryLink .inquirySubText{
color: #fff;
font-size: 16px;
padding: 10px;
text-align: center;
margin-top: 15px;
}

#footer .footerCont{
width: 100%;
max-width: 1200px;
height: calc(40vh - 40px);
display: flex;
justify-content: space-between;
align-items: center;
padding:0 50px;
margin:0 auto;
}
#footer .anotherCont{
display: flex;
justify-content: space-between;
align-items: center;
}
#footer .anotherCont .footerLogo{
width: 100px;
}
#footer .anotherCont p img{
display: flex;
justify-content: space-between;
align-items: center;
}
#footer .anotherCont .footerText{
color: #fff;
font-weight: bold;
margin-left: 40px;
line-height: 2;
}
#footer .snsCont{
display: flex;
justify-content: flex-end;
}
#footer .snsCont a{
width: 60px;
}
#footer .snsCont a:nth-child(2){
width: 60px;
margin:0 0 0 30px ;
}
#footer .snsCont a image{
width: 100%;
}

#footer .copy{
width: 100%;
height:40px;
background-color:#00482A ;
}
#footer .copy p{
color: #FFF;
text-align: center;
font-size: 14px;
padding:10px 0 9px;
}




/* ナビゲーション */
#nav-container {
margin-left: auto;
position: relative;
}

#nav-toggle {
display: block;
width: 32px;
height: 32px;
cursor: pointer;
transform: rotate(0deg);
}

#nav-toggle span {
width: 100%;
height: 4px;
border-radius: 1px;
display: block;
position: absolute;
left: 0;
content: '';
transition: .5s ease-in-out;
}

#nav-toggle span:nth-child(1) {
top: 4px;
transform-origin: left center;
}

#nav-toggle span:nth-child(2) {
top: 12px;
transform-origin: left center;
}

#nav-toggle span:nth-child(3) {
top: 20px;
transform-origin: left center;
}

#nav-toggle.open span:nth-child(1) {
transform: rotate(45deg);
top: -1px;
left: 4px;
}

#nav-toggle.open span:nth-child(2) {
width: 0%;
opacity: 0;
}

#nav-toggle.open span:nth-child(3) {
transform: rotate(-45deg);
top: 20px;
left: 4px;
}

#nav-overlay {
position: absolute;
top: 16px;
left: 16px;
z-index: -1;
border-radius: 50%;
transition: 1s;
transform: scale3d(0, 0, 0);
}

#nav-overlay.open {
transform: scale3d(1, 1, 1);
}

#nav-fullscreen {
width: 100%;
position: fixed;
left: 0;
top: 0;
transition: ease-in-out 0.25s;
transition-delay: 0s;
visibility: hidden;
opacity: 0;
}

#nav-fullscreen ul {
list-style: none;
padding-left: 0;
}

#nav-fullscreen a {
color: white;
text-decoration: none;
font-family: "Inter", sans-serif;
font-optical-sizing: auto;
font-weight: 600;
font-style: normal;
font-variation-settings:"slnt" 0;
}

#nav-fullscreen.open {
visibility: visible;
opacity: 1;
transition: ease-in-out 0.5s;
transition-delay: 0.25s;
}

/* END NAV */
/* BEGIN OTHER */

#nav-overlay {
background: linear-gradient(270deg, #2E9E6F 30%, #7DB540 80%, #7DB540 90%);
}

#nav-toggle span {
background-color: #7DB540;
}
#nav-toggle.open span{
background-color: #fff;
}


#nav-fullscreen {
display: flex;
align-items: center;
justify-content: center;
color: white;
font-family: sans-serif;
font-size: 30px;
}

#nav-fullscreen li {
background: 
linear-gradient(currentColor 0 0) 
var(--p, 0) 100% /var(--d, 0) 3px 
no-repeat;
transition: 0.3s, background-position 0s 0.3s;
margin: 20px 0;
}
#nav-fullscreen li:hover {
--d: 100%;
--p: 100%;
}

/* END OTHER */



/* /_/_/_/_/_/_/ */
/* スマホ */
/* /_/_/_/_/_/_/ */
@media (max-width: 767px) { 
.pcNone{
		display: block !important;
	}
.spNone{
		display: none !important; 
	}

/* header */
#heder{
width:100%;
}
#header {
position: fixed;
z-index: 100;
width: 100%;
top: 0;
left: 0;
}
.header_cont{
margin: 30px auto;
display: flex;
justify-content:space-between;
padding:0 20px ;
}
.headerLogo{
	width: 30%;
	}


/* TOP */
#kv{
position: relative;
}
#kv .kvImg{
margin: 0  auto;
width: 50%;
min-width:0;
}
#kv .kvImg img{
width: 100%;
	}
#kv .scroll{
position: absolute;
left: 20px;
bottom: 10px;
}
#kv .scroll img{
width: 20px;
}


/* mission */
#mission{
background-image:url(/assets/img/sec2_bg.png);
background-repeat: no-repeat;
background-size:cover;
border-radius:0 0 0 0;
}
#mission .slide{
width: 100% !important;
max-width: 1200px;
float: none !important;
margin: 0 auto;
padding: 0 20px;
}
#mission h1{
margin-bottom: 60px;
display:block;
align-items: center;
width: 60%;
margin: 0 auto;
margin-bottom: 60px;
}
#mission h1 img{
	width: 100%;
	}
#mission h1::after {
content: "";
display: block;
margin-top: 20px;
width: 0;
height: 4px;
background-color: #7DB540;
transition: width 2s ease-out;
margin-left: 2rem;
box-shadow: 1px 1px 5px rgba(66, 110, 0,0.3);
display: none;
}
#mission h1.inview::after {
width: 100%;
}
#mission .slide p {
color: #fff;
line-height: 2;
font-size: 16px;
font-weight: bold;
text-shadow: 1px 1px 5px rgba(66, 110, 0,0.5);
}
.aboutBtn{
color: #fff;
display: block;
font-size: 16px;
font-weight: bold;
text-align: right;
text-decoration: none;
position: relative;
margin-top: 30px;
padding-bottom: 20px;
}
.aboutBtn span{
border: solid 2px #fff;
padding: 10px 10px 10px 30px;
position: relative;
}
.aboutBtn span:before{
content: '';
display: block;
width: 16px; 
height: 16px;
background-image: url(/assets/img/arrow.svg);
background-size: contain;
background-repeat:no-repeat;
position:absolute;
top:14px;
left:10px;}

/* service */
.serviceCont{
width: 100%;
margin: 0 auto;
padding:30px 0;
}
.serviceCont .serviceTit{
margin-bottom: 60px;
display:block;
align-items: center;
width: 70%;
margin: 0 auto;
margin-bottom: 60px;
}
.serviceCont .serviceTit img{
text-align: center;
margin: 0 auto;
}
.serviceCont .serviceBox{
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding:0 20px ;
}
.serviceCont .serviceBox ul{
display: block;
justify-content: space-between;
list-style: none;
padding-left: 0;
}
.serviceCont .serviceBox ul li{
width: 100%;
}
.serviceCont .serviceBox .serviceImg{
position: relative;
display: none;
}
.serviceCont .serviceBox .serviceImg img{
position: relative;
width: 100%;
}
.serviceCont .serviceBox .serviceImg::before{
content:"";
display:block;
width:60%;
height:6px;
background-color:#2E9E6F;
position:absolute;
top:0;
left:0px;
z-index: 10;
display: none;
}
.serviceCont .serviceBox ul li .serviceSubTit {
position: relative;	
padding-top: 0px;
margin-top: 20px;
margin-bottom: 10px;
font-size: 16px;
font-weight: bold;
color: #2E9E6F;
}
.serviceCont .serviceBox ul li .serviceSubTit::before{
content:"";
display:block;
width:60%;
height:6px;
background-color:#7DB540;
position:absolute;
top:0;
left:0;
display: none;
}
.serviceCont .serviceBox ul li .serviceText {
font-size: 14px;
font-weight: 500;
}


/* access */
#access{
background-image:url(/assets/img/sec4_bg.png);
background-repeat: no-repeat;
background-size:cover;
border-radius:0 0 0 0;
}
#access .slide{	
width: 100% !important;
max-width: 1200px;
float: none;
padding: 0 20px;
margin: 0 auto;
}
#access ul{
display: block;
list-style: none;
padding-left:0;
}
#access ul li.accessMap{
width: 100%;
height: 30vh;
}
#access ul li.accessMap iframe{
width: 100%;
height: 30vh;
}
#access .accessCont{
width: 100%;
}

#access h1{
margin-bottom: 60px;
overflow: hidden;
width: 70%;
}
#access h1 img{
float: none;
}
#access .slide p {
color: #fff;
line-height: 1.5;
font-size: 18px;
font-weight: bold;
text-align: left;
text-shadow: 1px 1px 5px rgba(66, 110, 0,0.3);
margin-bottom: 20px;
}


/* Footer */
#footer{
width: 100%;
background-color: #2E9E6F;
}
#footer .inquiry{
width: 100%;
}
#footer .inquiry{
display: flex;
justify-content: space-between;
list-style: none;
padding: 0;
}
#footer .inquiry li{
position: relative;
overflow: hidden;
width: 50%;
height:40vh;
}
#footer .inquiry .inquiryLink{
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 20;
height: 100%;
text-decoration: none;
}

#footer .inquiry li.inquiry1:after {
position: absolute;
content: "";
display: block;
width: 100%;
height:  40vh;
top: 0;
background: url(/assets/img/inquiry_img.png) no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-ms-background-size: cover;
background-size: cover;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
z-index: 1;
}
#footer .inquiry li.inquiry2:after {
position: absolute;
content: "";
display: block;
width: 100%;
height:  40vh;
top: 0;
background: url(/assets/img/inquiry_img2.png) no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-ms-background-size: cover;
background-size: cover;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
z-index: 1;
}
#footer .inquiry li.inquiry1:hover:after,
#footer .inquiry li.inquiry2:hover:after{
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
#footer .inquiry .inquiryLink .inquiryText{
color: #fff;
font-weight: bold;
font-size: 20px;
padding: 10px;
border: solid 2px #fff;
min-width: 20vh;
text-align: center;
transition: all .3s ease-out;
}
#footer .inquiry li.inquiry1:hover .inquiryText,
#footer .inquiry li.inquiry2:hover .inquiryText{
color: #fff;
font-weight: bold;
font-size: 20px;
padding: 10px;
border: solid 2px #7DB540;
min-width: 20vh;
text-align: center;
background-color: #7DB540;
}

#footer .inquiry .inquiryLink .inquirySubText{
color: #fff;
font-size: 16px;
padding: 10px;
text-align: center;
margin-top: 15px;
}

#footer .footerCont{
width: 100%;
max-width: 100vw;
height: calc(60vh - 40px);
display: flex;
justify-content: space-between;
align-items: center;
padding:0 20px;
margin:0 auto;
flex-wrap: wrap;
}
#footer .anotherCont{
display: flex;
justify-content: space-around;
align-items: center;
width: 100%;
margin-top: 7vh;
}
#footer .anotherCont .footerLogo{
width: 30%;
}
#footer .anotherCont p img{
display: flex;
justify-content: space-between;
align-items: center;
}
#footer .anotherCont .footerText{
color: #fff;
font-weight: bold;
margin-left: 30px;
line-height: 1.5;
}
#footer .snsCont{
display: flex;
justify-content: center;
width: 100%;
margin-bottom: 4vh;
}
#footer .snsCont a{
width: 60px;
}
#footer .snsCont a:nth-child(2){
width: 60px;
margin:0 0 0 30px ;
}
#footer .snsCont a image{
width: 100%;
}

#footer .copy{
width: 100%;
height:40px;
background-color:#00482A ;
}
#footer .copy p{
color: #FFF;
text-align: center;
font-size: 12px;
padding:10px 0 9px;
}



}