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

/* base ------------------------*/
#wrapper { position:relative; width:100%; min-width:1000px; min-height:100%; padding-top:87px; }
#wrapper.load { -webkit-transition:opacity 1.0s; -moz-transition:opacity 1.0s; -o-transition:opacity 1.0s;transition:opacity 1.0s; opacity:1; }

.wide_inner { width:100%; max-width:100%; margin:0 auto; padding:0 60px; }
.inner { /*width:100%;*/ max-width:1440px; margin:0 5%; }
.narrow { width:100%; max-width:860px; margin:0 auto; }
.container { padding:64px 0 75px; }
.wide { width:100%; }
/* .sp_none{ display:none; } */

#pan { margin-bottom:50px; padding-top:.8em; text-align:right; }
#pan li { display:inline-block; font-size:13px; }
#pan li:not(:first-child):before { content:">"; margin:0 0.5em; color:#888; font-size:15px; }

#loading { position:fixed; top:0; bottom:0; left:0; right:0; z-index:9999; width:100%; height:100%;
  background:#77c1fd;
  background:-webkit-linear-gradient(45deg, #77c1fd 0%,#9ce5bd 100%);
  background:linear-gradient(45deg, #77c1fd 0%,#9ce5bd 100%); }
.loader { position:absolute; top:0; bottom:0; left:0; right:0; width:40px; height:40px; margin:auto;
 -webkit-animation:sk-scaleout .8s infinite ease-in-out;
  animation:sk-scaleout .8s infinite ease-in-out;border-radius:100%; background-color:#fff;  }
@-webkit-keyframes sk-scaleout {
  0% { -webkit-transform:scale(0) }
  100% {
    -webkit-transform:scale(1.0);
    opacity:0;
  }
}

@keyframes sk-scaleout {
  0% {
    -webkit-transform:scale(0);
    transform:scale(0);
  } 100% {
    -webkit-transform:scale(1.0);
    transform:scale(1.0);
    opacity:0;
  }
}


/* --header------------------------ */
header { position:fixed; align-items: center; display: flex; justify-content: space-between; top:0; right:0; left:0; z-index:999; width:100%; padding:0 0 0 60px;
 -webkit-transition:all .5s; transition:all .5s; }

header .logo a { display:block; }
header .logo a img { max-width: 317px; width: 100%;}
header .logo a p { margin-top: 1.8em; font-size: .7em; text-align: center;}

#gnav li { margin-right:0; font-weight:bold; }
#gnav .gmenu > li a { display: flex; height: 100%; padding-inline: .6em; align-items: center; position:relative; }
#gnav .gmenu > li .nav_txt { padding-inline: .6em; }
#gnav .gmenu > li .nav_txt > a { padding-inline: 0;}
#gnav .gmenu > li a:hover { color:#57ad57; }

/*.sns-link { position: absolute;position: absolute; right: 12em; top: 0.7em; }*/
#gnav .sns-link img { width: 37px; height: 37px; }

#gnav > ul > li:last-child { padding:0; margin-right:0;}
#gnav .gmenu > li:last-child a { color:#FFF; background:#57ad57; padding:30px 40px; margin-right:0;}
#gnav .gmenu > li:last-child a:hover { background:#93c870;}
#gnav .gmenu > li:last-child a:after { display:none;}

#gnav .sns-link { margin-right: 1em; column-gap: .8em; }
#gnav .sns-link li:last-child { padding:0; margin-right:0;}
#gnav .sns-link li:last-child a { color:#FFF; background:none; padding:0; margin-right:0;}
#gnav .sns-link li:last-child a:hover { background:none;}
#gnav .sns-link li:last-child a:after { display:none;}

#gnav ul.pc_contact { width:130px; height:86px;}
#gnav ul.pc_contact > li a { width:130px; height:106px; background:#57ad57; color:#FFF; align-items:center;}

.h_recruitBtn { margin:0;}
.h_recruitBtn a { position:absolute; background:#ffb400; color:#FFF; padding:40px; top:108px; right:60px; min-width:164px; text-align:center; font-size:1.2em;}
.h_recruitBtn a::before { content:""; bottom:5px; right:5px; border-top:1em solid transparent; border-right:1em solid #ffff00; position:absolute;} 

header .contact { display:none; }
header .contact a { position:relative; overflow:hidden; display:block; width:40px; height:40px; padding:4px 0; text-align:center; border-radius:50%; background:#1e2024; }
header .contact img { vertical-align:middle; }
header .contact a:before { content:""; position:absolute; z-index:-1; top:0; right:0; bottom:0; left:0;
background:#57ad57;
}
header .contact a:hover { background:none; }

.menu-button { display:none; }

/* scroll固定 */
header.scroll { background:rgba(255,255,255,.9); }
header.scroll .logo a { background-color:initial; }
header.scroll .logo a p { display: none;}
header.scroll #gnav .gmenu > li { padding:25px 0;}
header.scroll #gnav .gmenu > li:last-child { padding:0; }
header.scroll #gnav .gmenu > li:last-child a { padding:25px; }
header.scroll .h_recruitBtn a { padding:20px; top:78px; min-width:134px; }

/* --お問い合わせ------------------------ */


/*アクセス*/
#access-con { margin-top: -73px; padding-top: 73px;}
#access,#accessmap { position: relative; }
#access .accessBox { text-align:center; margin:50px 0;}
#access .accessBox .f_tel span { font-size:2.5em;}
#map { width:100%; height:250px; background-color:grey; }
.map_btn a { position: absolute; display: block; padding: .5em 2em; top: 5px; left: 5px;  background: #57ad57; border: 1px #57ad57 solid; color: #fff; font-size: .8em;}
.map_btn a:hover { border: 1px #57ad57 solid; background: #fff; color: #57ad57;}
#access .map,#accessmap .map{ width: 100%; overflow: hidden; height: 300px; }
#access .map iframe,#accessmap .map iframe { border:0; margin-top: -150px; }

/* 新着情報 */
#news { margin: 80px auto;}
#news h2.ttl { position: relative; margin-bottom: 30px; padding-left: 45px; font-size: 2em; line-height: 1.2;}
#news h2.ttl::before {content: ""; position: absolute; width: 30px; top: 16px; left: 0; border: 3px #57ad57 solid;}
#news h2.ttl span { display: block; font-size: 13px;}

.newsList { overflow-x:auto; margin: 0 auto 30px; }
.newsList li { width: 49%; overflow:hidden; border-bottom:1px dashed #a6937c; }
.newsList a { display:block; padding:12px 10px; text-decoration:none; }
.newsList a:after { content:""; clear:both; display:block; }
.newsList a:hover { background:#f7f7f7; }
.newsList .date { float:left; width:95px; margin:0; font-size:16px; line-height:1.7; font-weight:bold; }
.newsList .txt { margin:0 0 0 110px; }

/* Servis list */
.serviceList { background:#eeeeee; padding:60px 0; margin-bottom:80px; }
.serviceList h2.ttl { position:relative; margin-bottom:60px; padding-left:45px; font-size:2em; line-height:1.2;}
.serviceList h2.ttl::before {content:""; position:absolute; width:30px; top:16px; left:0; border:3px #57ad57 solid;}
.serviceList li { width:24%; background:#FFF; text-align:center; position:relative; margin-bottom:20px;}
.serviceList li::before { content:""; bottom:0; right:0; border-top:1.5em solid transparent; border-right:1.5em solid #57ad57; position:absolute; z-index:100;}
.serviceList li.is-empty::before { display:none;}
.serviceList li a { padding:0; display:block; padding:5%; font-weight:bold;}



/* --footer------------------------ */
footer { border-top:2px #57ad57 solid;}

#pagetop { position: fixed; right: 20px; bottom: 0; z-index: 999; width: 60px;
  height: 60px; margin: 0; text-align: center; }
#pagetop a { display: block; height: 100%; padding: 10px; background-color: #57ad57; position: relative; }
#pagetop a span { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 10px; height: 10px; text-indent: -9999px; }
#pagetop a span::before {
  content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-top: 2px solid #fff; border-right: 2px solid #fff;
  -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

footer .f_nav { width:100%; padding:2em 0 0;}
footer .f_nav + .f_nav2 { padding-top: 1.2em; margin-top: 1.2em; border-top: solid 1px #d2d2d2;}
.f_nav2 { margin-bottom: 2em;}
.f_nav_sub { columns: 3;}

footer .f_nav { gap: 2em;}
footer .f_nav2 li::before { content:"●"; margin:0 10px; font-size:8px; color:#57ad57; vertical-align:middle;}
footer .f_nav li a { font-weight: bold;}
footer .f_nav2 > li::before { content: none;}
footer .f_nav2 li a { font-weight: 400; font-size: .9em;}
footer .f_nav2 > li span { font-weight: bold;}


.copyright { position:relative; margin:0; padding:.9em; font-size:.7em; text-align:center; background:#57ad57; color:#FFF;}
.copyright a { color:#FFF;}
.copyright a:hover { color:#93c870;}

/* 1563以上 (PC) */
@media screen and (min-width:1563px) {
	.inner { margin: 0 auto;}
}


/* 1170以上 (PC) */
@media screen and (min-width:1170px) {
  #wrapper { min-width:100%; }

  header.scroll .logo { left:60px; }
  .sp-nav-wrap { display: none;}

  #nav-toggle { display:block;}
  .open #nav-toggle span:nth-child(1) { top:11px; transform:rotate(315deg); background:#FFF; }
  .open #nav-toggle span:nth-child(2) { width:0; left:50%;}
  .open #nav-toggle span:nth-child(3) { top:11px; transform:rotate(-315deg); background:#FFF;}

}

/* 1430以上 (PC) */
@media screen and (min-width:1430px) {

header #gnav { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
#gnav .gmenu { display: flex; }
#gnav > ul > .nav_hover { display: flex;  padding-inline: .6em; align-items: center; transition: all .6s; cursor: pointer;}
#gnav > ul > .nav_hover:hover { color: #57ad57;}
/* gナビホバー */
#gnav .submenu { position: absolute; visibility: hidden; padding-block: 0; top: calc(100% - 1px); right: 0; left: 0; z-index: 99; width: 100%; max-height: 0; background: #ddf1d0; opacity: 0; overflow: hidden; transition: all .3s ease-in;}
#gnav .gmenu li:hover { background: #ddf1d0;}
#gnav > ul > li:hover .submenu { padding-block: clamp(20px,5vw,54px); visibility: visible; max-height: 9999px; opacity: 1;}
#gnav .submenu .inner { display: flex; gap: 6em;}
#gnav .submenu_list { display: grid; grid-template-columns: repeat(3,1fr); gap: .7em 2.3em;}
#gnav .submenu_list.bb { padding-bottom: 1em; margin-bottom: 1em; border-bottom: solid 1px #b7b7b7;}
#gnav .submenu_list li a { position: relative; padding-left: 2em;}
#gnav .submenu_list li a::before,#gnav .submenu_list li a::after { content: ""; position: absolute;}
#gnav .submenu_list li a::before { width: 22px; height: 22px; left: 0; border-radius: 50%; background: #57ad57;}
#gnav .submenu_list li a::after { left: 6px; width: 6px; height: 6px; border-top: 1px solid #fff; border-right: 1px solid #fff; transform: rotate(45deg);}
.submenu_ttl { margin: 0; font-size: clamp(20px,2.6vw,26px); font-weight: bold; color: #57ad57;}
.submenu_ttl .en { display: block; font-size: clamp(13px,1.5vw,15px); color: #57ad57; font-family: "Roboto", sans-serif;}
  
#gnav .sns-link { align-items: center; order: -1; }
#gnav .sns-link li.insta img.sp { display: none; }  
  
}

@media screen and (max-width:1300px) {
}

/* ================================================================
  タブレット
=================================================================== */
@media screen and (max-width:1429px) {
  body { background-size:80px; }
  #wrapper { overflow:clip; min-width:auto; padding-top:85px;}
  .wide_inner, .inner, .narrow { width:auto; margin-left:5% !important; margin-right:5% !important; padding:0; }
  .inner .narrow  { margin:0; }

  #loading img { width:40px; height:40px; }
	
	.newsList li { width: 100%; }


  /* header------------------------*/
  header { padding:15px 25px 10px; }
  header .contact { display:block; margin-top: .3em; margin-right: .7em; }

  header .logo a { padding:0; }
  header #gnav { margin-top:0; }

  .sp-nav-wrap { display: flex; align-items: center;}

  #gnav{ position:fixed; top:85px; left:0; right:0;
   -webkit-transform:translateX(100%); transform:translateX(100%);
   -webkit-transition:ease .5s; transition:ease .5s;
   z-index:1000; margin-top:0; padding: 20px 25px 20px; background:rgba(30, 32, 36, .9); height: 90%; overflow: scroll;
  }

  #gnav .sns-link { margin-top: 2em; justify-content: center; column-gap: 1.2em; }
  #gnav .sns-link li.insta img.pc { display: none; }
  #gnav .sns-link li:last-child a {text-align: left;}
  #gnav.open {
   -webkit-transform:translateX(0); transform:translateX(0);
   overflow-y:auto; -webkit-overflow-scrolling:touch;
  }
  #gnav .gmenu li { width: 100%; margin-right:0; padding:10px 0; border-bottom:1px #FFF solid; }
  #gnav li a { padding:.4em 0; color:#fff; }
  #gnav li a:after { display:none;}
  #gnav > ul > .nav_hover { position: relative; color:#fff;}
  .nav_txt { position: relative; display: block; padding: .4em .6em;}
  .nav_txt a { padding: 0 !important;}
  #gnav > ul > .nav_hover .nav_txt::before,#gnav > ul > .nav_hover .nav_txt::after { display: block; position: absolute; z-index: 2; right: 1.75em; top: 50%; translate: 0 -50%; bottom: 0; margin: 0 auto; width: 13px; height: 1px; background: #fff; content: ""; transition: .3s; pointer-events: none;}
  #gnav > ul > .nav_hover .nav_txt::after { rotate: 90deg;}
  #gnav > ul > .nav_hover.active .nav_txt::after { rotate: 0deg;}
  .submenu { display: none;}
  .submenu .submenu_ttl { display: none;}
  .submenu_list > li a { font-size: .9em;}
  .submenu_list.bb { border-bottom: solid 3px #fafdf4; margin-bottom: 0.6em; padding-bottom: 0.7em;}
  .submenu_list > li, header.scroll #gnav li .submenu_list > li { padding-block: .4em !important;}
  .submenu_list > li:last-child { border-bottom: none !important;}
  header.scroll #gnav .gmenu > li:last-child a { padding: 1em; }

  #gnav .gmenu > li:last-child { margin-top:1em; border-bottom:none;}
  #gnav .gmenu > li:last-child a { text-align:center; padding:1em;}

  .h_recruitBtn a { position:static; width:100%; display:block; padding:12px; margin:10px 0;}
  .h_recruitBtn a::before { display:none;}


/*  #gnav .submenu { display:none; }*/

  header.scroll #gnav { top:73px; }
  header.scroll #gnav .gmenu li { padding:10px 0 !important; }


  /* menuボタン */
  .menu-button { float:right; }
  .menu-button,
  .menu-button span { display:block;	transition:all .5s; -webkit-transition:all .5s; box-sizing:border-box; }
  .menu-button .menu { position:relative;	width:30px;	height:22px; }
  .menu-button span { position:absolute; left:0; width:100%; height:2px; background-color:#1e2024; }

  .menu-button span:nth-of-type(1) { top:0; }
  .menu-button span:nth-of-type(2) { top:10px; }
  .menu-button span:nth-of-type(3) { bottom:0; }

  .menu-button.open span:nth-of-type(1) {
  	-webkit-transform:translateY(10px) rotate(-45deg);
  	transform:translateY(10px) rotate(-45deg);
  }
  .menu-button.open span:nth-of-type(2) {
  	opacity:0;
  }
  .menu-button.open span:nth-of-type(3) {
  	-webkit-transform:translateY(-10px) rotate(45deg);
  	transform:translateY(-10px) rotate(45deg);
  }

  .fnav { font-size:.95em; }
  .menu-button .label { width:auto; height:auto; margin:0 0 6px; color:#1e2024;
    text-align:center; line-height:1; font-size:12px; }

  .serviceList li { width:32%; }
}

/* ============================================================================
  スマホ
============================================================================ */
@media screen and (max-width:599px){

  body { font-size: 15px;}

  .sp_none{ display:none; }
	.pc_none{ display:block;}
	
	.newsList .date { float: none;}
	.newsList .txt { margin: 0;}

  header { padding:10px 15px 10px 10px; gap:1em; }
  header .logo a { padding:0; }

  footer .f_nav { display:block; padding:0;}
  footer .f_nav li { width:100%; border-bottom:1px #57ad57 dotted; padding:10px;}
  footer .f_nav li:last-child { border-bottom:none;}
  footer .f_nav li::after { display:none;}

  footer .f_nav + .f_nav2 { padding-top: 0.5em; margin-top: 0.5em;}
  .f_nav_sub { columns: 2;}
  .f_nav_sub li { padding: 0 !important; border-bottom: none !important;}
  footer .f_nav2 li::before { position: absolute; top: .8em; left: 0; margin: 0;}
  footer .f_nav2 li { position: relative; padding-left: 1em !important;}

  #accessmap { margin-top: 2em;}

  /* Service list */
  .serviceList h2.ttl { margin-bottom:10%; }
  .serviceList li { width:48.5%; margin-bottom:10px; font-size:.9em; }

}