@charset "UTF-8";

/* MAIN VISUAL
-------------------------------------------------------------------------------*/

.copy{
   width:700px;
   height:500px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%); /* Safari用 */
    transform: translate(-50%, -50%);
    background-image: url(../img/top/copy_pc.svg);
    background-repeat: no-repeat;
    background-size: 700px 500px;
    z-index:9999;
}

.bifuka-mark{
  width:220px;
  height: 155px;
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   left:75px;
   bottom:30px;
   background-image: url(../img/top/icon-bifuka.svg);
   background-repeat: no-repeat;
   background-size: 220px 155px;
   z-index:9999;
}


.topContainer {  
    position: relative;
    width: 100%;
    margin:0;
    height: calc(100vh - 155px);
    -webkit-overflow: hidden;
            overflow: hidden;
    
    /* max-height: 2160px; */
}
.slider{    
    opacity: 0;
    transition: 1s;
}
.slider,
.slick-list, 
.slick-track, 
.image, 
.overlay {
    width: 100%;
    height: 100%;
}
.slick-track {
    position: relative;
    z-index : 1;
}

.slick-initialized{
    opacity: 1;
}
.slider img{
    display: none!important;
    height: auto;
    width: 100%;
}
.image {
    position: relative;
    z-index: 100;
    width: 100%;
    height: 100%;
    background: center center no-repeat;
    background-size: cover;
}
.img1 {
    background-image: url(../img/top/slide01.jpg);
}
.img2 {
    background-image: url(../img/top/slide02.jpg);
}
.img3 {
    background-image: url(../img/top/slide03.jpg);
}
.img4 {
    background-image: url(../img/top/slide04.jpg);
}
.img5 {
  background-image: url(../img/top/slide05.jpg);
}




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


  .copy{
    width:300px;
    height:300px;
     display: flex;
     justify-content: center;
     align-items: center;
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%); /* Safari用 */
     transform: translate(-50%, -50%);
     background-image: url(../img/top/copy_sp.svg);
     background-repeat: no-repeat;
     background-size: 300px 300px;
     z-index:9999;
 }
 
 .bifuka-mark{
   width:150px;
   height:106px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left:20px;
    bottom:20px;
    background-image: url(../img/top/icon-bifuka.svg);
    background-repeat: no-repeat;
    background-size: 150px 106px;
    z-index:9999;
 }
 


  .topContainer {
    width: 100vw;
    height: calc(100vh - 60vw);
    position: relative;
    top:60px;
    -webkit-overflow: hidden;
            overflow: hidden;
    margin: 0 auto 0;
}
    .img1 {
        background-image: url(../img/top/slide01_sp.jpg);
    }
    .img2 {
        background-image: url(../img/top/slide02_sp.jpg);
    }
    .img3 {
        background-image: url(../img/top/slide03_sp.jpg);
    }
    .img4 {
        background-image: url(../img/top/slide04_sp.jpg);
    }

    .img5 {
      background-image: url(../img/top/slide05_sp.jpg);
  }


}



/* BUSINESS
-------------------------------------------------------------------------------*/


._business{
  background:url(/assets/img/top/icon-business.svg) no-repeat;
  background-position: 0 5px;
  background-size:40px 40px;
  padding:0 0 0 50px;
}

._company{
  background:url(/assets/img/top/icon-company.svg) no-repeat;
  background-position: 0 5px;
  background-size:40px 40px;
  padding:0 0 0 50px;
}


._works{
  background:url(/assets/img/top/icon-works.svg) no-repeat;
  background-position: 0 5px;
  background-size:43px 43px;
  padding:0 0 0 55px;
}


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

  ._business{
    background:url(/assets/img/top/icon-business.svg) no-repeat;
    background-position: 0 5px;
    background-size:38px 38px;
    padding:0 0 0 50px;
  }
  
  ._company{
    background:url(/assets/img/top/icon-company.svg) no-repeat;
    background-position: 0 5px;
    background-size:38px 38px;
    padding:0 0 0 51px;
  }
  
  
  ._works{
    background:url(/assets/img/top/icon-works.svg) no-repeat;
    background-position: 0 5px;
    background-size:39px 39px;
    padding:0 0 0 53px;
  }
  

}



.readmore-txt{
  margin:0;
  padding:0;
}

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

  .readmore-txt{
    margin:0 0 40px 0;
    padding:0;
  }
  

}

.readmore-txt::after {
  content:"";
  display:inline-block;
	width:1.2em;
	height:1.2em;
  background:url(/assets/img/common/gnav_fix_arr.svg) no-repeat;
  background-position: 0 0px;
  background-size:17px 17px;
  padding:0 0 12px 15px;
  margin:0 5px 0 0;
}


.contents_inner {
  box-sizing: boder-box;
  width: 100%;
  height:auto;
  margin: 0 auto;
  padding:0 140px;
  text-align: center;
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 10%,#f5f5f5 10%, #f5f5f5 50%, #f5f5f5 90%,#ffffff 90%, #ffffff 90%, #ffffff 100%);
  
}

  
  .flex_wrapper-box-business {
   width:100%;
    padding:0;
    margin:0;
    display:flex;
    box-sizing:border-box;
  justify-content: space-between;
    flex-wrap: wrap;
  }
  
  
  
  .flex_two-business-left{
    width:35%;
    height:auto;
    padding:0;
    margin:0;
    text-align:left;
    display:flex;
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
      justify-content: center; /* 子要素をflexboxにより中央に配置する */
    position: relative;
  }
  
  
  .flex_two-business-right{
    width:65%;
    height:auto;
    padding:0;
    margin:0;
    text-align:left;
    position: relative;
  }

.top_img{
  width:100%;
  margin:0 0 90px 0;
}

.bottom_img{
  width:80%;
  margin:0 0 0 10%;
  text-align: right;
}
  

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


  .contents_inner {
    box-sizing: boder-box;
    width: 100%;
    height:auto;
    margin: 0 auto;
    padding:75px 20px;
    text-align: center;
    background: linear-gradient(180deg, #f5f5f5 0%, #f5f5f5 10%,#f5f5f5 10%, #f5f5f5 50%, #f5f5f5 90%,#f5f5f5 90%, #f5f5f5 90%, #f5f5f5 100%);
    
  }
  
    
    .flex_wrapper-box-business {
     width:100%;
      padding:0;
      margin:0;
      display:block;
      box-sizing:border-box;
    justify-content: space-between;
      flex-wrap: wrap;
    }
    
    
    
    .flex_two-business-left{
      width:auto;
      height:auto;
      padding:0;
      margin:0;
      text-align:left;
      display:flex;
      flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
        justify-content: center; /* 子要素をflexboxにより中央に配置する */
      position: relative;
    }
    
    
    .flex_two-business-right{
      width:auto;
      height:auto;
      padding:0;
      margin:0;
      text-align:left;
      position: relative;
    }
  
  .top_img{
    width:100%;
    margin:0 0 20px 0;
  }
  
  .bottom_img{
    width:100%;
    margin:0 0 0 0;
    text-align: right;
  }
    

}
  
  
  /* NEWS
  -------------------------------------------------------------------------------*/
  
  .fixed-news {
    width:auto;
    height:75px;
    margin:0;
    padding:0;
    z-index:10;
    background-color:#1d2846;
    opacity: 1;
}

.news-ttl{
  border:1px solid #ffffff;
  color:#ffffff;
  font-size:16px;
  margin:7px 0 0 0;
  padding:2px 15px 0px 15px;
}  


  .news-box-header{
    width:auto;
    height:auto;
    margin:0;
    padding:0px 0;
    display:flex;
    align-items: center;   
  }
  
  .news-box-header .date{
  width:80px;
  height:auto;
  margin:0 25px 0 0;
  padding:10px 0 5px 0;
  color:#ffffff;
  }
  
  .news-box-header .title{
    width:auto;
    height:auto;
    margin:0;
    padding:10px 0 5px 0;
    color:#ffffff;
  }

  .news-box-header .title a{
    color:#ffffff;
    text-decoration: underline;
  }
  
  .news-box-header .title a:hover{
    color:#a1c62e;
    text-decoration: none;
  }
  
  

  
    .flex_wrapper-box-th-w{
      max-width:1200px;
      padding:15px 0 0 0;
      margin:0 auto;
      text-align:center;
      display:flex;
      box-sizing:border-box;
    justify-content: space-between;
      flex-wrap: wrap;
  
    }
  
    .flex_wrapper-box-th{
      width:10%;
      height:auto;
      padding:0;
      margin:0 auto;
      text-align:center;
      display:flex;
      justify-content: center;
      align-items: flex-start;
    }
  
    .flex_wrapper-box-thm{
      width:80%;
      height:auto;
      padding:0;
      margin:0 auto;
      text-align:center;
    }
  

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


      .fixed-news {
        width:auto;
        height:auto;
        margin:60px 0 0 0;
        padding:10px;
        z-index:10;
        background-color:#1d2846;
        opacity: 1;
    }
    
    .news-ttl{
      border:1px solid #ffffff;
      color:#ffffff;
      font-size:14px;
      margin:0;
      padding:2px 15px 0px 15px;
    }  
    
    
      .news-box-header{
        width:auto;
        height:auto;
        margin:0;
        padding:0px 0;
        display:flex;
        align-items: start;   
        font-size:12px;
      }
      
      .news-box-header .date{
      width:auto;
      height:auto;
      margin:0 15px 0 0;
      padding:10px 0 5px 0;
      color:#ffffff;
      }
      
      .news-box-header .title{
        width:auto;
        height:auto;
        margin:0;
        padding:10px 0 5px 0;
        color:#ffffff;
        line-height:150%;
      }
      
    
      
        .flex_wrapper-box-th-w{
          max-width:auto;
          padding:15px 0 0 0;
          margin:0 auto;
          text-align:center;
          display:block;
          box-sizing:border-box;
        justify-content: space-between;
          flex-wrap: wrap;
      
        }
      
        .flex_wrapper-box-th{
          width:auto;
          height:auto;
          padding:0;
          margin:0 auto;
          text-align:center;
          display:block;
          justify-content: center;
          align-items: flex-start;
        }
      
        .flex_wrapper-box-thm{
          width:auto;
          height:auto;
          padding:0;
          margin:0;
          text-align:left;
        }

    }
  
  
  /* COMPANY
  -------------------------------------------------------------------------------*/
  
  
  .flex_wrapper-box-company {
    clear:left;
    padding:0;
    margin:0;
    display:flex;
    box-sizing:border-box;
    align-items:center; 
    
  }
  
  
  
  .flex_two-company-left {
      width:50%;
      height:auto;
      padding:0px; 
      margin:0 5% 0 0;
      text-align:left;
    }
    
    .flex_two-company-right {
      width:50%;
      height:auto;
      padding:0px; 
      margin:0;
      text-align:left;
    }
  
  
    @media screen and (max-width:800px) {
  
      .flex_wrapper-box-company {
        clear:left;
        padding:0;
        margin:0;
        display:block;
        box-sizing:border-box;
        align-items:center; 
        
      }
      
      .flex_wrapper-box-company br{
        display:none;
      }
      
      
      .flex_two-company-left {
          width:auto;
          height:auto;
          padding:0px; 
          margin:0 0 0 0;
          text-align:left;
        }
        
        .flex_two-company-right {
          width:auto;
          height:auto;
          padding:0px; 
          margin:0;
          text-align:left;
        }
      

    }


    /* WORKS
  -------------------------------------------------------------------------------*/

.contents-works h2{
  color:#ffffff;
}

.contents-works .readmore-txt a{
  color:#ffffff;
}

.contents-works .readmore-txt a:hover{
  color:#a1c62e;
}

  .swiper-container {
    width: 100%;
    height: 100%;
    margin:50px 0 0 0;
    padding-bottom:50px!important;
  }

  .swiper-pagination-bullet-active { background-color: #a1c62e!important; }


  .swiper-slide {
    text-align: left;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    min-height:360px;
  }

  .swiper-slide_box{
    width:auto;
    height:auto;
    margin:0;
    padding:0;
  }

  .swiper-slide_box_img{
    width:auto;
    height:auto;
    margin:0;
    padding:0;
    position: relative;/*相対配置*/
  }
  
    .swiper-slide_box_img p {
    position: absolute;/*絶対配置*/
    color: white;/*文字は白に*/
    bottom: 0;
    left: 0;
    background-color:#a1c62e;
    font-size:12px;
    padding:2px 4px;

    }
  
    .swiper-slide_box_img img {
    width: 100%;
    }

  dl.swiper-slide_box_txt{
    width:auto;
    height:auto;
    margin:0;
    padding:20px;
  }

  dl.swiper-slide_box_txt dt{
    width:auto;
    height:auto;
    margin:0 0 15px 0;
    padding:0;
    line-height:150%;
  }

  dl.swiper-slide_box_txt dd{
    width:auto;
    height:auto;
    margin:0;
    display: inline-block;
    font-size:10px;
    padding:2px 4px;
    border:1px solid #000000;
  }




  /* GOOGLE MAP
  -------------------------------------------------------------------------------*/

  
  .google_map{
    position:relative;
    width:100%;
    height:0;
    padding-bottom: 35%;
    margin:0;
}
.google_map iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

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

  .google_map{
    position:relative;
    width:100%;
    height:0;
    padding-bottom: 65.5%;
    margin:0;
}
.google_map iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

}


/* wow animation -top page fade animation */
.wow {
	visibility: hidden;
  }
  
  .animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
  }
  
  .animated2x {
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
  }
  
  .animated3x {
	-webkit-animation-duration: 3s;
	animation-duration: 3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
  }
  
  @-webkit-keyframes fadekv {
	0% {
	  -moz-transform: translateY(70px);
	  -ms-transform: translateY(70px);
	  -webkit-transform: translateY(70px);
	  transform: translateY(70px);
	}
	100% {
	  -moz-transform: translateY(0);
	  -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
	}
  }
  @keyframes fadekv {
	0% {
	  -moz-transform: translateY(70px);
	  -ms-transform: translateY(70px);
	  -webkit-transform: translateY(70px);
	  transform: translateY(70px);
	}
	100% {
	  -moz-transform: translateY(0);
	  -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
	}
  }
  .fade-kv {
	-webkit-animation-name: fadekv;
	animation-name: fadekv;
  }
  
  @-webkit-keyframes fade-in-up {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -moz-transform: translateY(20px);
	  -ms-transform: translateY(20px);
	  -webkit-transform: translateY(20px);
	  transform: translateY(20px);
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	  -moz-transform: translateY(0);
	  -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
	}
  }
  @keyframes fade-in-up {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -moz-transform: translateY(20px);
	  -ms-transform: translateY(20px);
	  -webkit-transform: translateY(20px);
	  transform: translateY(20px);
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	  -moz-transform: translateY(0);
	  -ms-transform: translateY(0);
	  -webkit-transform: translateY(0);
	  transform: translateY(0);
	}
  }
  .fade-in-up {
	-webkit-animation-name: fade-in-up;
	animation-name: fade-in-up;
  }
  
  @-webkit-keyframes fade-in {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	}
  }
  @keyframes fade-in {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	}
  }
  .fade-in {
	-webkit-animation-name: fade-in;
	animation-name: fade-in;
  }
  
  @-webkit-keyframes zoomIn {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -moz-transform: scale(1);
	  -ms-transform: scale(1);
	  -webkit-transform: scale(1);
	  transform: scale(1);
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	  -moz-transform: scale(1.2);
	  -ms-transform: scale(1.2);
	  -webkit-transform: scale(1.2);
	  transform: scale(1.2);
	}
  }
  @keyframes zoomIn {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -moz-transform: scale(1);
	  -ms-transform: scale(1);
	  -webkit-transform: scale(1);
	  transform: scale(1);
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	  -moz-transform: scale(1.2);
	  -ms-transform: scale(1.2);
	  -webkit-transform: scale(1.2);
	  transform: scale(1.2);
	}
  }
  .zoom-in {
	-webkit-animation-name: zoomIn;
	animation-name: zoomIn;
  }
  
  @-webkit-keyframes zoomOut {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -moz-transform: scale(1.3);
	  -ms-transform: scale(1.3);
	  -webkit-transform: scale(1.3);
	  transform: scale(1.3);
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	  -moz-transform: scale(1);
	  -ms-transform: scale(1);
	  -webkit-transform: scale(1);
	  transform: scale(1);
	}
  }
  @keyframes zoomOut {
	0% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	  opacity: 0;
	  -moz-transform: scale(1.3);
	  -ms-transform: scale(1.3);
	  -webkit-transform: scale(1.3);
	  transform: scale(1.3);
	}
	100% {
	  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	  opacity: 1;
	  -moz-transform: scale(1);
	  -ms-transform: scale(1);
	  -webkit-transform: scale(1);
	  transform: scale(1);
	}
  }
  .zoom-out {
	-webkit-animation-name: zoomOut;
	animation-name: zoomOut;
  }