@charset "utf-8";
body{
 margin: 0;
padding: 0;
font-family: Hiragino Kaku Gothic ProN,Hiragino Sans、ヒラギノ角ゴシック,"メイリオ",meiryo,sans-serif;
font-size: 16px;
font-weight: 300;
color:#4D4D4D;
line-height: 2.7em;
}
a{
 text-decoration: none;
 color: #4D4D4D;
 transition: .3s;
}
a:hover{
 opacity:0.8;
 -moz-opacity:0.5;
 filter:alpha(opacity = 50);
}
img{
    width: 100%;
}
p{
    line-height: 2em;
}
ul{
 margin: 0;
 padding: 0;
}
ul li{
    list-style: none;
}
.flex{
display: flex;
}
.pc-no{
    display: none;
}
section{
    text-align: center;
}

.roboto-thin {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .roboto-light {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .roboto-regular {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .roboto-medium {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .roboto-black {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: normal;
  }
  
  .roboto-thin-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: italic;
  }
  
  .roboto-light-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: italic;
  }
  
  .roboto-regular-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .roboto-medium-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: italic;
  }
  
  .roboto-bold-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: italic;
  }
  
  .roboto-black-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: italic;
  }
  
.header_rogo{
    width: 200px;
    padding-left: 24px;
    margin: 0;
}

.grnv{
    justify-content: space-between;

    margin: auto;
}
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 1,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}
.nav_wp{
    width: 800px;
    justify-content: space-around;
    margin-top: 30px;
}
.nav_wp li{
    display: flex;
    line-height: 1.2em;
    text-align: center;
}
.nav_wp li span{
    display: block;
    font-size: 12px;
    font-family: 'Roboto';
    color: #EF7C00;
}
.nav_wp li span::first-letter{
    color: #008001;
}    
.header_tel{
    width: 220px;
    text-align: center;
    background-color: #008001;
    color: #fff;
}
.tel-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Roboto';
    font-size: 24px;
    font-weight: 400;
}

.tel-inner div{
    display: inline-block;
    background-color: #1DA21E;
    border-radius: 30px;
    width: 30px;
    height: 30px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 5px;
}

.slider {
    height: 38vw;
    margin-inline: auto;
    overflow: hidden; /* 画像がはみ出ないようにする */
    width: 100vw;
  }
  .slick-img img {
    width: 100%;
  }
  @keyframes zoomUp {
    0% {
      transform: scale(1);
    }
    100% {
      transform: scale(1.15); /* 拡大率 */
    }
  }
  .add-animation {
    animation: zoomUp 10s linear 0s normal both;
  }

.slider_wp{
    position: relative;
}
  .maintext{
    position: absolute;
    top: 50%;
    background-color: #ffffffd1;
    padding: 1%;
    right: 160px;
    font-size: 36px;
    border-radius: 8px;
  }
  .maintext span{
    color: #EF7C00;
  }

.concept{
    background-image:url(../img/section_02_bg.jpg) ;
background-size: cover;
text-align: center;
background-position: center;
}

h2{
    margin: 0 auto;
    font-size: 24px;
    font-weight: 500;

}
.concept h2{
  padding-top: 64px;
}
.concept h2 span{
color: #EF7C00;
border-bottom: 3px solid #008001;
padding-bottom: 5px;
}
.concept p{
    line-height: 2em;
    padding: 24px 0 40px;
}
.p_title{
    margin-top: 64px;
}

.p_title h3{
    font-size: 24px;
    font-weight: 500;
    margin: 0;
}
.p_title p{
    color: #EF7C00;
    margin: 0;
}
.p_title p::first-letter{
    color: #008001;
}
.bg_gr{
    background-color: #F5F5F5;
    height: 100%;
}
.bg_or{
    background-color: rgba(239, 124, 0, 0.1);
    height: 100%;
}


.featurelist_inner:hover img{
  transform: scale(1.1);
  transition: 0.3s;
}

.featurelist_innerimg{
  overflow: hidden;
  height: 300px;
}
.featurelist_num{
    background-color: #EF7C00;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    margin: 24px auto;
    font-size: 24px;
    font-family: 'Roboto';
    color: #fff;
}
.featurelist_inner h4{
    font-size: 24px;
    font-weight: 500;
    margin: 16px 0 0;
    padding-bottom: 24px;
    line-height: 1.6em;
}
.featurelist_inner h4 span{
    font-size: 16px;
    display: block;
    line-height: 1em;
}
.btn_wp{

    position: relative;
    padding: 24px;
    transition: all .2s;
    width: 200px;
    margin: 40px auto;
    line-height: 3em;
}
.btn_wp a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 40px;
    background: #d5d5d5;
}
.btn_wp a:hover{
    background-color: #EF7C00;
    color: #fff;
    opacity:unset;
}

.companylink_wp{
    background-color: #EF7C00;
overflow: hidden;
}
.companylink_wp:hover{
   
    
}
.companylink_wp:hover img{
  transform: scale(1.1);
  transition: 0.3s;
}
.companylink_inner{
  overflow: hidden;
  height: 440px;
}
.recruitlink_wp{
    background-color: #008001;
    overflow: hidden;
}
.recruitlink_wp:hover img{
  transform: scale(1.1);
  transition: 0.3s;
}
.com_rec {
  margin: 80px 0;
}
.com_rec h4{
    font-size: 24px;
    font-weight: 500;
    margin: 32px 0 16px;
    line-height: 1.6em;
    color: #fff;
}
.com_rec .btn_wp{
  margin: 16px auto;
}
.com_rec .btn_wp p{
  background-color: #fff3;
    margin: 0;
    padding: 8px;
    border-radius: 40px;
}
footer{
  text-align: center;
  line-height: 1.8em;
  margin-top: 40px;
}
.footer_rogo{
  width: 200px;
  margin: auto;
}
.footer_info{
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer_info div{
  width: 240px;
  background-color: #F5F5F5;
  margin: 16px;
  padding: 8px;
  border-radius: 30px;
}
.footer_info div a{
  display: flex;
  align-items: center;
  justify-content: center;
  color: #EF7C00;
  line-height: 2.7em;
}
.footer_info div a span{
  display: block;
  padding-right: 8px;
}
footer h3{
  font-weight: 500;
  font-size: 16px;
  margin: 24px 0 8px;
}
footer h2{
  font-size: 20px;
}
.snsinfo{
  margin: 24px 0;
}
.snsinfo .snslink{
  width: 40px;
  display: block;
  margin: auto;
}
.footer_menu{
  justify-content: center;
}
.footer_menu li{
  margin: 4px 24px; 
}
.copyright{
  background-color: #EF7C00;
  color: #fff;
  font-size: 12px;
  margin-top: 24px;;
}
@media screen and (max-width:960px){
  .header_tel{
    display: none;
  }
  .maintext{
    top: 30%;
  }
  .featurelist_innerimg {
    height: 170px
  }
  .companylink_inner{
    height: 240px;
  }

   }
   
   @media screen and (max-width: 768px) {
body{
line-height: 2em;
    }

.sp-no{
display: none;
}
.pc-no{
    display: block;
}

.maintext{
  position: absolute;
  top: 55%;
  background-color: #ffffffd1;
  padding: 1%;
  font-size: 20px;
  border-radius: 8px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  right: inherit;
    width: 250px;
    text-align: center;
}
 /* ハンバーガーメニュー */
  /* ハンバーガーボタンを押してチェックがONの時だけ
     スマホ用メニューを画面左端に移動する */
     #sp-menu__check:checked ~ .sp-menu__content {
      left: 0;
    }
    /* 変更箇所はコメントの項目のみ */
    .sp-menu__content {
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
    
      /* 普段は画面外にするために左端を画面右端の位置にする */
      left: 100%;
    
      z-index: 90;
      background-color:  #1da21efa;
      
      /* 右端からゆっくり移動するように表示 */
      transition: all 0.5s;
    }
    
    
    .sp-menu__box {
      position: fixed;
      top: 0;
      right: 0;
      display: flex;
      height: 60px;
      width: 60px;
      justify-content: center;
      align-items: center;
      z-index: 100;
      background: #fff;
    }
    .sp-menu__box span,
    .sp-menu__box span:before,
    .sp-menu__box span:after {
      content: "";
      display: block;
      height: 3px;
      width: 25px;
      border-radius: 3px;
      background: #1DA21E;
      position: absolute;
    }
    .sp-menu__box span:before {
      bottom: 8px;
    }
    .sp-menu__box span:after {
      top: 8px;
    }
    #sp-menu__check {
      display: none;
    }
    #sp-menu__check:checked ~ .sp-menu__box span {
      background: rgba(255, 255, 255, 0);
    }
    #sp-menu__check:checked ~ .sp-menu__box span::before {
      bottom: 0;
      transform: rotate(45deg);
    }
    #sp-menu__check:checked ~ .sp-menu__box span::after {
      top: 0;
      transform: rotate(-45deg);
    }
    .sp-menu__list {
      padding: 70px 10px 0;
    }
    .sp-menu__item {
      border-bottom: solid 1px #ffffff;
      list-style: none;
    }
    .sp-menu__link {
      display: block;
      width: 100%;
      font-size: 15px;
      box-sizing: border-box;
      color: #ffffff;
      text-decoration: none;
      padding: 9px 15px 10px 0;
    }
    .slider{
      height: 100vw;
    }
    .header_rogo{
      margin: auto;
      padding: 0;
    }
    .concept h2{
      font-size: 20px;
      padding-top: 40px;
    }
.featurelist_wp{
  flex-wrap: wrap;
  width: 80%;
  margin: auto;
}
.featurelist_innerimg{
  height: auto;
}

.bg_gr{
  height: 95%;
  margin-bottom: 5%;
}
.bg_or{
  height: 95%;
  margin-bottom: 5%;
}
.com_rec{
  flex-wrap: wrap;
}
.companylink_inner{
  height: auto;
}
.footer_info{
  flex-wrap: wrap;
}
.footer_menu{
  flex-wrap: wrap;
}
.footer_menu li{
  width: 45%;
  border: 1px solid #eee;
  padding: 4% 2%;
  margin: 0;
}
footer h2{
  font-size: 18px;
}
}