/* //////////////////////////////////// */
/* general */
/* //////////////////////////////////// */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
html,body{
  font-family: 'Noto Sans JP', sans-serif;
}
a{
  transition: .5s;
}
a:hover{
  text-decoration: none!important;
}

html{
  scroll-behavior: smooth;
}
span.br{
  display: inline-block;
}

/* //////////////////////////////////// */
/* container調整 */
/* //////////////////////////////////// */
@media (min-width: 576px){
  .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 95%;
  }
}
@media (min-width: 1240px){
  .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 1220px;
  }
}
/* //////////////////////////////////// */
/* 文字 */
/* //////////////////////////////////// */
p{
  line-height: 1.5em;
}
.text-green{
  color: #07ad91;
}
.page h3{
  font-weight: bold;
  border-bottom: none;
  margin: 20px 0;
  line-height: 1.5em;
}
h3::after{
  display: none;
}
/* //////////////////////////////////// */
/* btn */
/* //////////////////////////////////// */
a.btn-more{
  line-height: 70px;
  text-align: center;
  display: block;
  max-width: 300px;
  margin: 50px auto 0;
  color: #fff;
}
a.btn-more:hover{
  text-decoration: none;
}

/* //////////////////////////////////// */
/* グラデーション */
/* //////////////////////////////////// */
.green-grd{
  background-image: -moz-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
}

.orange-grd {
  background-image: -moz-linear-gradient( 90deg, rgb(240,131,0) 0%, rgb(234,85,4) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(240,131,0) 0%, rgb(234,85,4) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(240,131,0) 0%, rgb(234,85,4) 100%);
}



/* //////////////////////////////////// */
/* 共通パーツ */
/* //////////////////////////////////// */
.sec-ttl{
  text-align: center;
  margin-bottom: 50px;
}
.sec-ttl h3{
  font-weight: bold;
  border-bottom: none;
  margin: 20px 0 0;
}
.sec-ttl h3::after{
  display: none;
}
.sec-ttl h5{
  color: #07ad91;
  font-weight: bold;
  margin: 0;
  background-image: -moz-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.sec-ttl p{
  margin: 20px 0 0;
}
section .container{
  padding: 30px 15px;
}

@media screen and (min-width: 769px) {
  section .container{
    padding: 60px 15px;
  }
}

/* //////////////////////////////////// */
/* header */
/* //////////////////////////////////// */
header.siteHeader{
  box-shadow: none;
  min-height: 65px;
}
.siteHeader .container{
  padding-top: 0;
  padding-bottom: 0;
  max-height: 65px;
}
.siteHeader_logo img{
  max-height: 40px;
}
.nav-btn{
  display: block;
  height: 65px;
  width: 110px;
  color: #fff;
  text-align: center;
  font-size: 14px;
  position: relative;
  cursor: pointer;
}
.nav-btn span{
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%,-50%);
  width: 100%;
}
.nav-btn::after {
  content:'';
  position: absolute;
  bottom: 10px;
  width: 40px;
  height: 8px;
  left: 50%;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: skew(45deg) translateX(-50%);
  transition: .3s;
}
.nav-btn:hover::after{
  width: 50px;
  left: calc( 50% + 5px);
}
.tel-box{
  height: 65px;
  padding: 0 10px;
}
.device-mobile .gMenu>li {
    padding: 14px 14px;
}
.device-mobile .gMenu>li .gMenu_name{
  font-size: 14px;
}
.tel-box .no{
  font-size: 30px;
  font-weight: bold;
  margin-bottom: 2px;
  line-height: 1em;
}
.siteHeader .container{
  max-width: 1400px;
  width: 100%;
}
#menu-header-menu{
  margin-right: 30px;
}
#vk-mobile-nav-menu-btn{
  display: none;
}
.siteHeader_logo{
  padding: 14px 0;
}
@media (max-width: 1199.98px){
  .siteHeader_logo img {
    margin-left: inherit;
    margin-right: inherit;
  }
  .siteHeader_logo{
    padding: 14px 0;
  }
}
.hamburger{
  display: none;
}
@media (max-width: 1279px){
  .gMenu_outer nav {
    display: none;
  }
  .header-block{
    display: none;
  }
  .header_scrolled .gMenu_outer{
    display: none;
  }
}
.header_scrolled .header-block{
  display: none;
}


/* //////////////////////////////////// */
/*　ハンバーガーボタン　*/
/* //////////////////////////////////// */
.hamburger {
  display : none;
}
nav.globalMenuSp {
  position: fixed;
  z-index : 2;
  top  : 0;
  left : 0;
  color: #000;
  background: #07ad91;
  text-align: center;
  transform: translateX(100%);
  transition: all 0.6s;
  width: 100%;
  padding: 65px 0;
  height: calc( 100% - 65px)
}
nav.globalMenuSp ul {
  background: #07ad91;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}
nav.globalMenuSp ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: .5s;
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
nav.globalMenuSp ul li:hover{
  background : #fff;
}
nav.globalMenuSp ul li a {
  display: block;
  color: #fff;
  padding: 1em 0;
  text-decoration :none;
}
nav.globalMenuSp ul li:hover a{
  color: #07ad91;
}
nav.globalMenuSp.active {
  transform: translateX(0%);
}
@media (max-width: 1279px){
  .hamburger-wrap{
    width: 65px;
    height: 65px;
    position: fixed;
    z-index : 3;
    right : 0;
    top   : 0;
  }
  .hamburger {
    display : block;
    width : 42px;
    height: 42px;
    cursor: pointer;
    text-align: center;
    position: relative;
    top: 12px;
    right: -12px;
  }
  .hamburger span {
    display : block;
    position: absolute;
    width   : 30px;
    height  : 2px ;
    left    : 6px;
    background : #fff;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition   : 0.3s ease-in-out;
    transition        : 0.3s ease-in-out;
  }
  .hamburger span:nth-child(1) {
    top: 10px;
  }
  .hamburger span:nth-child(2) {
    top: 20px;
  }
  .hamburger span:nth-child(3) {
    top: 30px;
  }
  /* ナビ開いてる時のボタン */
  .hamburger.active span:nth-child(1) {
    top : 16px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform   : rotate(-45deg);
    transform        : rotate(-45deg);
  }
  .hamburger.active span:nth-child(2),
  .hamburger.active span:nth-child(3) {
    top: 16px;
    -webkit-transform: rotate(45deg);
    -moz-transform   : rotate(45deg);
    transform        : rotate(45deg);
  }
}


/* //////////////////////////////////// */
/* page-header */
/* //////////////////////////////////// */
.page-header{
  height: 300px;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #efefef;
}
.page-header .container{
  position: relative;
  height: 100%;
}
.page-title{
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
}
@keyframes extend{
  0%{
    transform: scaleX(0);
  }
  100%{
    transform: scaleX(1);
  }
}
@keyframes fadeIn{
  0%{
    opacity: 0;
  }
  50%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}
.page-title h1{
  animation : extend 0.5s;
  transform-origin: left;
  background: #fff;
  width: fit-content;
  padding: 0 10px;
  font-size: 24px;
  line-height: 1.8em;
  margin-bottom: 10px;
  font-weight: bold;
}
.page-title span.fadein{
  animation : fadeIn 1s;
  color: #333;
}
@media screen and (min-width: 768px) {
  .page-title h1{
    font-size: 28px;
    padding: 0 20px;
  }
}

/* //////////////////////////////////// */
/* footer */
/* //////////////////////////////////// */
footer.siteFooter{
  background: #515151;
  color: #fff;
}
footer.siteFooter{
  border-top: none;
}
footer.siteFooter a{
  color: #fff;
}
footer.siteFooter a:hover{
  color: #07ad91;
}
footer.siteFooter .container{
  padding: 50px 15px;
  margin-bottom: 65px;
}
footer.siteFooter .sectionBox.copySection{
  padding: 5px 0;
}
#menu-footer-menu-left,#menu-footer-menu-right{
  margin: 0;
  padding: 0;
}
footer.siteFooter ul li{
  list-style: none;
}
footer .logo-wrap{
  max-width: 240px;
  margin-bottom: 40px;
}
footer .access-info{
  margin-bottom: 40px
}
footer .access-item{
  margin-bottom: 20px;
}
footer .access-item p.office{
  padding-bottom: 4px;
  margin-bottom: 4px;
  border-bottom: 1px solid #fff;
}
.footer-fix-block{
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 15px;
  z-index: 100;
}
.footer-fix-block .nav-btn{
  flex: 1;
}
.footer-fix-block .nav-btn:hover{
  color: #fff;
}
.footer-fix-block .tel-box{
  background: #fff;
  text-align: center;
  color: #333;
  font-size: 14px;
  padding: 10px 5px;
  text-decoration: none;
}
.footer-fix-block .tel-box .no{
  font-size: 18px;
}
.contact-bnr{
  max-width: 800px;
  margin: 30px auto 30px;
  padding-top: 1px;
}
.contact-bnr > .container{
  max-width: 100%;
  padding: 0 15px !important;
}
.white-area{
  background: #fff;
  margin: 5px 5px 6px;
}
.white-area, .transparent-area{
  flex: 1;
  text-align: center;
  padding: 20px 15px;
}
.white-area h3{
  color: #07ad91;
  font-weight: bold;
  margin-bottom: 10px;
  letter-spacing: .1em;
  margin-top: 0;
  border-bottom: none;
}
.transparent-area{
  color: #fff;
  position: relative;
}
.tel-area{
  width: 90%;
  margin: 0 auto;
}
.red-bnr h4{
  color: #fef000;
  margin-bottom: 8px;
  font-weight: bold;
}
.red-bnr{
  background: #c7151c;
  color: #fff;
  border-radius: 20px;
  padding: 20px 10px;
  position: relative;
}
.red-bnr::after{
  position: absolute;
  content: '';
  display: block;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  width: 10px;
  height: 10px;
  right: 14px;
  transform: translateY(-50%) rotate(45deg);
  top: 50%;
}

@media screen and (min-width: 768px) {
  .tel-area{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    width: 90%;
  }
  .white-area, .transparent-area{
    padding: 20px 30px;
  }
  .red-bnr::after{
    right: 20px;
  }
  .contact-bnr{
    margin: 70px auto 70px;
  }
}
@media screen and (min-width: 1280px) {
  .footer-fix-block{
    display: none;
  }
  footer.siteFooter .container{
    margin-bottom: 0;
  }
}

/* //////////////////////////////////// */
/* 特徴 */
/* //////////////////////////////////// */
section.features .container{
  padding: 80px 15px 100px;
}
.features{
  background: #f9f8f8;
}
.features-item{
  background-repeat: no-repeat;
  background-size: 100%;
  padding: 40vw 0 0 0;
}
.features-item:not(:last-child){
  margin-bottom: 40px;
}
.features-item .text-box h4{
  color: #07ad91;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5em;
}
.features-item .text-box{
  background: #fff;
  padding: 20px 20px;
  width: 80%;
  margin: auto 0 0 auto;
}
.features-item .text-box p{
  margin: 0;
}


.features-1{
  background-image: url(../img/features-1.jpg);
}
.features-2{
  background-image: url(../img/features-2.jpg);
}
.features-3{
  background-image: url(../img/features-3.jpg);
}
.features-4{
  background-image: url(../img/features-4.jpg);
}
.features-5{
  background-image: url(../img/features-5.jpg);
}

@media screen and (min-width: 768px) {
  .features-item{
    background-repeat: no-repeat;
    background-size: 40%;
    min-height: 300px;
    padding-top: 110px;
  }

  .features-right.features-item{
    background-position: left top;
  }
  .features-left.features-item{
    background-position: right top;
  }
  .features-right .text-box{
    margin: 0 20% 0 auto;
  }
  .features-left .text-box{
    margin: 0 auto 0 20%;
  }
  .features-item .text-box{
    background: #fff;
    padding: 20px 30px;
    width: 45%;
  }
}
/* //////////////////////////////////// */
/* 最新情報 */
/* //////////////////////////////////// */

.info-list{
  margin-bottom: 30px;
}
.info-list .info-cat{
  display: inline-block;
  color: #fff;
  background: #07ad91;
  padding: 0 20px;
  min-width: 100px;
  text-align: center;
}
.info-list time{
  vertical-align: inherit;
  margin-right: 14px;
  color: #999;
}
.info-list .info-meta{
  margin-bottom: 10px;
}
.post-type-archive .info-list{
  border-bottom: 1px solid #efefef;
}
/* //////////////////////////////////// */
/* サービス */
/* //////////////////////////////////// */
section.three-service .container{
  padding-top: 200px;
  position: relative;
}
.three-service{
  background: #f9f8f8;
}
.three-service .row{
  max-width: 1000px;
  margin: 0 auto;
}
.service-box{
  border: 2px solid #07ad91;
  border-radius: 30px;
  padding: 10px 30px 20px;
  height: 100%;
  background: #fff;
  position: relative;
}
.col-md-4:not(:last-child){
  margin-bottom: 30px;
}
.col-md-4:not(:last-child) .service-box::after{
  content: '';
  display: block;
  width: 2px;
  position: absolute;
  height: 40px;
  background: #07ad91;
  bottom: -40px;
  left: 50%;
  z-index: -1;
}
.service-box h3{
  text-align: center;
}
.service-box img{
  width: 100%;
  max-width: 240px;
  display: block;
  margin: 0 auto;
}
.service-sil{
  position: absolute;
  width: 220px;
  transform: translate(-50%,-50%);
  top: 30px;
  left: 50%;
}
@media screen and (min-width: 768px) {
  .col-md-4:not(:last-child){
    margin-bottom: 0;
  }
  .col-md-4:not(:last-child) .service-box::after{
    content: '';
    display: block;
    width: 37px;
    position: absolute;
    height: 2px;
    background: #07ad91;
    top: 50%;
    right: -35px;
    z-index: -1;
    bottom: auto;
    left: auto;
  }
}


/* //////////////////////////////////// */
/* 各ページ */
/* //////////////////////////////////// */
.single-achievement .page-header,.post-type-archive-achievement .page-header,.post-type-archive-news .page-header,.single-news .page-header,.page-id-18 .page-header{
  background-image: url(../img/header-achievement.jpg);
}
.single-achievement .siteContent .container,
.post-type-archive-achievement .siteContent .container,.single-news .siteContent .container,
.post-type-archive-news .siteContent .container{
  max-width: 800px;
  margin: 0 auto;
}
.form-container{
  max-width: 500px;
  margin: 0 auto;
}
.form-container input.btn.btn-primary{
  border: none;
  background-image: -moz-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(107,185,64) 0%, rgb(0,172,151) 100%);
  border-radius: 0;
  margin: 0 auto;
  display: block;
  height: 50px;
  width: 100%;
}
