html { 
  overflow-y: scroll;
  height: 100%;
}
body {
  width: 100%;
  margin: 0;
  padding: 0;
  /*height: 100%;*/
  font-family: "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	word-wrap: break-word;
}

.min{
  font-family: "游明朝", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", Meiryo, serif;
	word-wrap: break-word;
}

img {
	vertical-align: bottom;
	font-size: 0;
	line-height: 0;
}
.base {
	background-color: #FFF;
}
.pc-only {
  display: block;
}
.sm-only {
  display: none;
}
.clearfix {
  clear: both;
}
/* ヘッダー */
.sm-header {
  display: none;
}


#header {
  font-size: 0.8vw;
  width: 100%;
}



.logo-area{
width:65.41%;
margin: 0 auto;
padding:  0;
position: relative;
}
.logo-area img{
width:100%;
}

.logo-l{
position: absolute;
width:28.98%;
top:3%;
left: 3%;
}
.logo-l img{
width:100%;
}

.head-txt{
position:absolute;
right: 0;
bottom: 10%;
width: 52.86%;
font-size: 1.1vw;
line-height: 170%;
}


.navi-area{
width: 100%;
border-top: 2px solid #007246;
padding:1% 0;
background-color: #ffffff;
}

.navi-box {
  width: 62%;
  margin: 0 auto;
  max-width: 1190px;
  display: flex;
}

.navi-01 {
  width: 24.8%;
  text-align: center;
  padding: 0;
  border-left: 1px solid #007246;
  border-right: 1px solid #007246;
  line-height: 200%;
}
.navi-01 img{
width:44.55%;
margin: 2% auto;
}

.navi-01 a:hover{
opacity:0.6;
}

.navi-02 {
  width: 24.8%;
  text-align: center;
  padding: 0;
  border-right: 1px solid #007246;
  line-height: 200%;
}
.navi-02 img{
width:44.55%;
margin: 2% auto;
}

.navi-02 a:hover{
opacity:0.6;
}

.fixed-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
}

#point01{
padding-top: 120px;
margin-top:-120px;
}

#point02{
padding-top: 120px;
margin-top:-120px;
}

#point03{
padding-top: 120px;
margin-top:-120px;
}

#point04{
padding-top: 120px;
margin-top:-120px;
}

/*****************************************************************************************************************************************
sec01
*****************************************************************************************************************************************/

#sec01 {
width:100%;
}

.sec01-top{
width:100%;
height: 5vw;
display: block;
background-color: #333333;
}
.sec01_in{
width:100%;
height: auto;
background: linear-gradient(#007b3e, #91bc9d);
padding-bottom: 4%;
}

.sec01-con{
width:62%;
margin: 0 auto;
position: relative;
}

.sec01-title{
width:100%;
position: absolute;
    top: -6%;
}
.sec01-title img{
width:100%;
}

.sec01-box{
width:90.75%;
margin: 0 auto;
padding-top: 5%;
display: flex;
}

.jigyo-box{
flex: 1;
margin: 0 1.3%;
line-height: 200%;
font-size: 1.2vw;
color: #ffffff;
text-align: center;
}
.jigyo-box img{
width:100%;
}
/*****************************************************************************************************************************************
sec02
*****************************************************************************************************************************************/

#sec02 {
width:100%;
height: auto;
background-color: #333333;
padding: 5% 0;
}

.sec02_bg{
width:78.125%;
margin:0 auto;
}

.sec02_in{
width:100%;
height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 33.333%;
    background: url('../img/sec02_bg.png') 0 0 no-repeat;
    background-size: contain;
}

.sec02_in-box{
width:100%;
margin: -36.333% auto 0;
}

.sec02-title{
width:23.86%;
margin: 10% auto 2%;
}
.sec02-title img{
width:100%;
}

.sec02-bar{
border-bottom: 2px solid #ffffff;
margin-bottom: 4%;
}

.sec02-txt {
  font-size: 1vw;
  line-height: 170%;
  margin-bottom: 4%;
  color: #ffffff;
  text-align: center;
}

.btn-sec02 a{
width:14.8%;
margin: 0 auto;
display: block;
background-color: #ffffff;
text-align: center;
text-decoration: none;
color: #007246;
font-size: 1.4vw;
line-height: 100%;
padding: 1% 0;
font-weight: bold;
}

.btn-sec02 a:hover{
opacity:0.6;
}

/*****************************************************************************************************************************************
sec03
*****************************************************************************************************************************************/
#sec03 {
width:100%;
height: auto;
background: linear-gradient(#007b3e, #91bc9d);
padding-bottom: 4%;
}

.sec03-con{
width:62%;
margin: 0 auto;
position: relative;
}

.sec03-title{
width:100%;
position: absolute;
    top: -3%;
}
.sec03-title img{
width:100%;
}

.sec03-box{
width:67.22%;
margin: 0 auto;
text-align: left;
font-size: 1.1vw;
line-height: 170%;
color: #ffffff;
padding-top: 8vw;
}

/*****************************************************************************************************************************************
sec04
*****************************************************************************************************************************************/

#sec04 {
width:100%;
margin: 0 auto ;
padding: 3% 0 5%;
}

.sec04-title{
width:100%;
}
.sec04-title img{
width:100%;
}

.sec04_bg{
width:46.875%;
margin: 5% auto ;
}

.sec04_in{
width:100%;
/*height: 0;*/
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 100%;
    background: url('../img/gai_bg.png') 0 0 no-repeat;
    background-size: contain;

}

.sec04box{
width:100%;
margin: -100% auto 0;
    font-size: 1.1vw;
    line-height: 180%;
}

.sec04-gaiyou{
width:100%;
display: flex;
}

.sec04-l{
width:18.7%;
text-align: right;
border-right: 1px solid #000000;
padding-right: 3%; 
}

.sec04-r{
width:75%;
padding-left: 3%;
padding-bottom: 3%;
}

.sec04-r#last{
width:75%;
padding-left: 3%;
padding-bottom: 0;
}

.map{
color:#ffffff;
background-color: #007246;
line-height: 120%;
padding: 0.3% 1%;
text-decoration: none;
display: inline-block;
}
a .map{
text-decoration: none !important;
color: #ffffff;
}

/*****************************************************************************************************************************************
sec05
*****************************************************************************************************************************************/

#sec05 {
width:100%;
  margin: 0 ;
  padding: 0;
}

.sec05_bg{
width:100%;
height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 26.04%;
    background: url('../img/sec05_bg.png') 0 0 no-repeat;
    background-size: contain;
}

.sec05_in{
width:62%;
margin: -26.04% auto 0;
}

.sec05box{
width:42%;
margin-left: 58%;
padding: 10% 0;
}
.sec05box img{
width:100%;
}

/*****************************************************************************************************************************************
sec06
*****************************************************************************************************************************************/

#sec06 {
width:100%;
margin: 0 auto ;
padding: 5% 0;
}

.sec06_in{
width:27.5%;
margin: 0 auto ;
}
.sec06_in img{
width:100%;
}


/*****************************************************************************************************************************************
フッター
*****************************************************************************************************************************************/
#footer {
 width:100%;
height: auto;
background: linear-gradient(#007b3e, #91bc9d);
padding: 3% 0;
}

.navi-area2{
width: 100%;
padding: 0 0 0.3%;
background-color: #ffffff;
margin-bottom: 3%;
}

.navi-box {
  width: 62%;
  margin: 0 auto;
  max-width: 1190px;
  display: flex;
}

.navi2-01 {
  width: 20%;
  text-align: center;
  padding: 0;
  line-height: 200%;
}
.navi2-01 img{
width:55.462%;
margin: 2% auto;
}

.navi2-01 a:hover{
opacity:0.6;
}

.foot_in{
width:53.64%;
margin:0 auto;
  color: #ffffff;
  font-size: 1vw;
  line-height: 170%;
}

.foot_in a{
text-decoration: none;
color: #ffffff;
}

.foot-logo{
width:40%;
margin-bottom: 1%;
}
.foot-logo img{
width:100%;
}

/***********************************************************************************************
ながれ
***********************************************************************************************/
.logo-l2 {
    position: relative;
    width: 28.98%;
    padding: 2% 0;
    top: 3%;
    left: 3%;
}

.logo-r2{
position: absolute;
width:20%;
top:10%;
right: 3%;
}
.logo-r2 img{
width:100%;
}

#sec-nagare {
width:100%;
height: auto;
background: linear-gradient(#007b3e, #91bc9d);
padding-bottom: 2%;
margin-bottom: 5%;
}

.n-title01{
width:100%;
margin-bottom: 1%;
}
.n-title01 img{
width:100%;
}

.n-txt{
font-size: 1.1vw;
color: #ffffff;
text-align: center;
line-height: 180%;
margin-bottom: 3%;
}

.n-nagare{
width:100%;
margin-bottom: 3%;
}
.n-nagare img{
width:100%;
}

.nagare-area{
width:53.645%;
margin: 0 auto;
}

.n-box{
width:100%;
margin-bottom: 7%;
}

.n-pic01{
width:50.87%;
float: left;
}
.n-pic01 img{
width:100%;
}

.n-txt01{
position: relative;
width:49.13%;
float: right;
text-align: center;
color: #000000;
font-size: 1vw;
line-height: 170%;
padding-top: 10%;
}

.n-midasi-r{
position: absolute;
top:5%;
right: 0;
width: 106.7%;
}
.n-midasi-r img{
width: 100%;
}

.n-pic02{
width:50.87%;
float: right;
}
.n-pic02 img{
width:100%;
}

.n-txt02{
position: relative;
width:49.13%;
float: left;
text-align: center;
color: #000000;
font-size: 1vw;
line-height: 170%;
padding-top: 10%;
}

.n-midasi-l{
position: absolute;
top:5%;
left: 0;
width: 106.7%;
}
.n-midasi-l img{
width: 100%;
}

.n-title02{
width:100%;
margin-bottom: 5%;
}
.n-title02 img{
width:100%;
}

.jirei-area{
width:91.59%;
margin: 0 auto 3%;
display: flex;
flex-wrap: wrap;
}

.j-box{
width:30%;
margin: 0 1.666%;
text-align: center;
font-size: 1.2vw;
font-weight: bold;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
line-height: 130%;
color: #ffffff;
}
.j-box img{
width:100%;
margin-bottom: 5%;
}

#sec06-n {
width:100%;
margin: 0 auto 5% ;
padding: 0;
}

/***********************************************************************
工事実績
************************************************************************/
.sec01k-box{
width:90.75%;
margin: 5% auto 3%;
    padding: 0;
display: flex;
}


.k-box{
width:100%;
padding-top: 120px;
margin-top:-120px;
padding-bottom: 8%;
}

.k-midasi{
    font-family: 'Noto Serif JP', serif;
    font-weight: 600;
}

.k-midasi .main {
    display: inline-block;
    min-width: 220px;
    margin-bottom: 5%;
    padding: 4% 5%;
    background: #444;
    color: #fff;
    font-size: 180%;
    text-align: center;
}

.k-midasi .sub {
    display: inline-block;
    margin-bottom: 10px;
    font-size: 150%;
}
.k-midasi .sub._1_ {
    position: relative;
    padding-left: 20px;
}
.k-midasi .sub._1_:before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 10px;
    height: 10px;
    margin-top: -3px;
    border-radius: 50%;
    background: #555;
    content: '';
}


.k-komi{
font-size: 1.4vw;
font-weight: bold;
line-height: 170%;
border-bottom: 1px solid #007246;
margin-bottom: 2%;
color: #000000;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

.k-picbox{
width:100%;
display: flex;
flex-wrap: wrap;
margin-bottom: 5%;
}

.k-pic{
width:18.349%;
margin-right: 2%;
margin-bottom: 2%;
}
.k-pic._full_ {
    width: 100%;
}

.k-pic#last{
width:18.349%;
margin-right: 0;
}

.k-pic img{
width:100%;
}

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

.pc-only {
  display:none;
}
.sm-only {
  display: block;
}
/* ヘッダー */
#header {
    width: 100%;
    /*height: 60px;*/
}

.sm-header {
  display: block;
}

.logo-area {
    width: 80%;
    margin: 0;
    padding: 0;
    position: relative;
}

.logo-l {
float: left;
    width: 80%;
    font-size: 18px;
    color: #000000;
    text-align: left;
    font-weight: bold;
    padding-top: 3%;
}

.logo-l a{
text-decoration: none;
color: #000000;
line-height: 200%;
padding-top: 5%;
}

.sm-main{
width:100%;
margin-bottom: 5%;
}
.sm-main img{
width:100%;
}

.main-txt{
width:90%;
margin: 0 auto;
font-size: 16px;
line-height: 170%;
}
/******** sec01*********************************/
.sec01-con {
    width: 100%;
    margin: 0 auto;
    position: relative;
}

.sec01-box {
    width: 90%;
    margin: 0 auto;
    padding-top: 5%;
    display: flex;
    flex-wrap: wrap;
}

.sec01-top {
    width: 100%;
    height: 10vw;
    display: block;
    background-color: #333333;
}

.sec01-title {
    width: 100%;
    position: absolute;
    top: -4%;
}

.jigyo-box {
    width: 44%;
    margin: 0 3%;
    line-height: 200%;
    font-size: 16px;
    color: #ffffff;
    text-align: center;
}

/******** sec02*********************************/
#sec02 {
    width: 100%;
    height: auto;
    background-color: #333333;
    padding: 10% 0;
}

.sec02_bg{
width:100%;
margin:0 auto;
}

.sec02_in{
width:100%;
height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 71.428%;
    background: url('../img/sec02_bg_sm.png') 0 0 no-repeat;
    background-size: contain;
}

.sec02_in-box{
width:100%;
margin: -71.428% auto 0;
}

.sec02-title {
    width: 50%;
    margin: 5% auto 2%;
}

.sec02-txt {
width: 90%;
    font-size: 16px;
    line-height: 170%;
    margin: 0 auto 4%;
    color: #ffffff;
    text-align: left;
}

.btn-sec02 a {
    width: 40%;
    margin: 0 auto;
    display: block;
    background-color: #ffffff;
    text-align: center;
    text-decoration: none;
    color: #007246;
    font-size: 18px;
    line-height: 100%;
    padding: 2% 0;
    font-weight: bold;
}

/******** sec03*********************************/
#sec03 {
    padding-bottom: 10%;
}

.sec03-con {
    width: 90%;
    margin: 0 auto;
    position: relative;
}

.sec03-box {
    width: 100%;
    margin: 0 auto;
    text-align: left;
    font-size: 16px;
    line-height: 170%;
    color: #ffffff;
    padding-top: 13vw;
}
/******** sec04*********************************/
#sec04 {
    width: 100%;
    margin: 0 auto;
    padding: 10% 0 ;
}

.sec04_bg {
    width: 90%;
    margin: 5% auto;
}

.sec04box {
    width: 80%;
    margin: -100% auto 0;
    font-size: 16px;
    line-height: 180%;
}

.sec04-gaiyou {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.sec04-l {
    width: 100%;
    text-align: left;
    border-right: none;
    padding-right: 0;
    font-weight: bold;
}

.sec04-r {
    width: 100%;
    padding-left: 0;
    padding-bottom: 3%;
}
/******** sec05*********************************/
.sec05_bg{
width:100%;
height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 41.666%;
    background: url('../img/sec05_bg_sm.png') 0 0 no-repeat;
    background-size: contain;
}

.sec05_in{
width:90%;
margin: -41.666% auto 0;
}

.sec05box{
    width: 50%;
    margin-left: 50%;
    padding: 10% 0;
}	

 
 /******** sec06*********************************/
#sec06 {
    width: 100%;
    margin: 0 auto;
    padding: 10% 0;
}
 
.sec06_in {
    width: 70%;
    margin: 0 auto;
}
    
/***********  フッター**************************************************/    
.foot_in {
    width: 80%;
    margin: 0 auto;
    color: #ffffff;
    font-size: 16px;
    line-height: 170%;
}

.foot-logo {
    width: 100%;
    margin-bottom: 1%;
}

.foot-btnbox{
display: block;
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 2000;
    height: 60px;
}


.footbtn-l a{
width:49.5%;
float: left;
display: block;
    height: 60px;
    border-right: 1px solid #ffffff;
    color: #ffffff;
    padding-top: 15px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    background-color: #007246;
}

.footbtn-l a:hover, .footbtn-r a:hover{
opacity:0.6;
}

.footbtn-l img{
width:15%;
}

.footbtn-r a{
width: 100%;
    float: none;
    display: block;
    height: 54px;
    line-height: 43px;
    padding: 10px 0;
    color: #ffffff;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    background-color: #007246;
}

.footbtn-r img{
width:15%;
}

/*********************************************************
流れ
*****************************************************/

.logo-l2 {
float: left;
    width: 80%;
    font-size: 18px;
    color: #000000;
    text-align: left;
    font-weight: bold;
    padding-top: 3%;
}

.logo-l2 a{
text-decoration: none;
color: #000000;
line-height: 200%;
padding-top: 5%;
}

.n-title01 {
    width: 100%;
    margin-bottom: 5%;
}

.n-txt {
    font-size: 16px;
    text-align: left;
}

.n-nagare {
    width: 60%;
    margin: 0 auto 3%;
}

.nagare-area {
    width: 90%;
    margin: 0 auto;
}

.n-pic01 {
    width: 100%;
    float: none;
}

.n-txt01 {
    width: 100%;
    float: none;
    font-size: 16px;
}

.n-midasi-r {
    position: absolute;
    top: -20%;
    right: -2%;
    width: 100%;
}

.n-pic02 {
    width: 100%;
    float: none;
}

.n-txt02 {
 width: 100%;
    float: none;
    font-size: 16px;
}

.n-midasi-l {
    position: absolute;
    top: -20%;
    right: -2%;
    left: unset;
    width: 100%;
}

.jirei-area {
    width: 100%;
}

.j-box {
    width: 70%;
    margin: 0 auto 5%;
    text-align: center;
    font-size: 18px;
    }

/********  工事実績 *******************************/

.sec01k-box {
    width: 100%;
    flex-wrap: wrap;
    }
  
.k-midasi {
    width: 100%;
    margin-bottom: 5%;
} 

.k-komi {
    font-size: 18px;
    margin-bottom: 5%;
    }
  
.k-pic {
    width: 45%;
    margin: 0 2.5% 5%;
    }

.k-pic#last {
    width: 45%;
    margin: 0 2.5% 5%;
}



}



/* スライダー */
.hero .slick-prev:before,
.hero .slick-next:before {
  color: #fff;
}
.hero .slick-next {
    right: 30px;
}

.c-sliderItem img {
    width: 100%;
    height: 100%;
    max-height: 85vh;
    object-fit: cover;
}
.hero {
    position: relative;
}
.hero > .__logo {
    position: relative;
    max-width: 1260px;
    margin: 0 auto;
}
.hero > .__logo > .logo {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 10;
    width: 360px;
}
.hero > .__logo > .tel {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    width: 230px;
}
.hero > .__txt {
    display: block;
    position: absolute;
    bottom: 5%;
    left: 50%;
    width: 90%;
    transform:  translateX(-50%) translateY(0);
    line-height: 1.5;
    color: #fff;
    font-weight: 500;
    font-family: 'Noto Serif JP', serif;
    text-shadow: 0 0 10px rgba(0, 0, 0, .8);
    text-align: center;
}
.hero > .__txt .main {
    display: block;
    font-size: 3vw;
    letter-spacing: .1em;
}
.hero > .__txt .sub {
    display: block;
    padding: 15px 0;
    font-size: 1.8vw;
}
@media only screen and (max-width: 644px) {
    .hero > .__logo > .logo {
        top: 15px;
        left: 5px;
        width: 240px
    }
    .hero > .__txt {
        bottom: 0;
        width: 100%;
        line-height: 1.7;
        padding: 10px;
        text-align: center;
    }
    .hero > .__txt .main {
        font-size: 5vw;
    }
    .hero > .__txt .sub {
        padding-top: 5px;
        font-size: 12px
    }
}

.note {
    padding: 5%;
    border-radius: 4px;
    background: #eee;
    font-size: 110%;
}

.mt0 {
    margin-top: 0;
}