@charset "utf-8";
/* このサイトはモバイルファースト */

@media only screen and (min-width: 767px){
}

/* 左右のぐらつきをなくす */
#wrapper{overflow: hidden;}

/* ///////////////////////////////////////////////

スマホ　ナビゲーション

////////////////////////////////////////////////// */

/*ヘッダーまわりはサイトに合わせて調整してください*/
header {
  background:#fff;
}

#nav-drawer {
  position: relative;
  height: 64px;
}

@media only screen and (min-width: 767px){
  #nav-drawer {
    display: none;
  }
}

#nav-drawer p.logo{
  width: calc(100% - 125px);
	padding: 3% 1% 0 1%;
	float: left;
	text-align: center;
	box-sizing: border-box;
}
#nav-drawer p.logo img {
	display: inline-block;
	max-height: 46px;
}
#nav-drawer img.tel{
  float: right;
  padding: 13px 10px;
    background: #2ca89f;
    width: 41px;}


/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  float: right;
  display: inline-block;
  width: 32px;
  height: 32px;
  vertical-align: middle;
  background-color: #e5622e;
  padding: 16px;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 6px;/*線の太さ*/
  width: 32px;/*長さ*/
  border-radius:0px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -14px;
}
#nav-open span:after {
  bottom: -27px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}
#nav-content img.logo{display: block; width: 220px; margin: 20px auto 10px;}
#nav-content ul.menu01{padding:0 20px; margin: 0 0 20px 0}
#nav-content ul.menu01 li{background:url(../images/common_header_nav_icon_sp.png) no-repeat center left;background-size: 20px; border-bottom: #f1e5e1 3px solid;}
#nav-content ul.menu01 li a{padding: 13px 0 13px 30px;display: block;color: #282828;font-weight: 400;font-size: 1rem;}
#nav-content ul.menu01 li:last-child{border:none}

#nav-content ul.menu02{}

  ul.menu02 {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 1rem 1rem 1rem;
  }
  ul.menu02 li {list-style-type:none;}
  /* 電話 */
  .nav-square_btn3-1 {
    display: inline-block;
    padding: .8em 3em;
    text-decoration: none;
    background: #2ca89f;
    /*ボタン色*/
    color: #FFF;
    border-bottom: solid 6px #007169;
    border-radius: 5px;
    transition-duration: 0.2s;
    margin: 0 0 15px 0
  }
  /* フォーム */
  .nav-square_btn3-2 {
    display: inline-block;
    padding: 1.2em 4em;
    text-decoration: none;
    background: #ec4e00;
    /*ボタン色*/
    color: #FFF;
    border-bottom: solid 6px #af4318;
    border-radius: 5px;
    transition-duration: 0.2s;
  }


/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

/* ///////////////////////////////////////////////

PC用　ヘッダーエリア

////////////////////////////////////////////////// */
p.description{background-color: #282828; color: #fff;text-align: center;font-size: .8rem; font-weight: 400;padding: 7px;letter-spacing: .1rem}

.nav_pc{ background-color:#e5622e}
ul.menu01_pc{display: flex;flex-direction: row;justify-content: space-between;width: 1000px; margin: 0 auto;}
ul.menu01_pc li{ background: url(../images/common_header_nav_icon_pc.png)no-repeat left center}
ul.menu01_pc li a{color: #fff;display: block;padding: 20px 0 20px 25px;}
ul.menu01_pc li a:hover{}

.header_pc{ width: 1000px; margin: 15px auto;overflow: hidden;}
.header_pc img.common_logo{float: left;width: 320px}
.header_pc ul{float: right;display: flex;justify-content: space-between;width: 500px;margin: 3px 0 0 0;}
.header_pc ul li{width:270px}
.header_pc ul li:last-child{width: 220px;}

.header_pc .tel_btn{display: block;padding: 3px 0 0 0}
.header_pc .mail_btn {
  display: block;
  padding: 1.2em 1em .8em;
  text-decoration: none;
  background-color: #ed522e;
  /*ボタン色*/
  color: #FFF;
  border-bottom: solid 6px #c54f20;
  border-radius: 5px;
  transition-duration: 0.2s;
  margin: -2px 0 0 0;
}

.header_pc .mail_btn:hover {
  /*ボタン色*/
  background-color: #ff732e;
  -ms-transform: translateY(2px);
  -webkit-transform: translateY(2px);
  transform: translateY(2px);
  /*下に動く*/
  border-bottom: solid 3px #c54f20;
  /*影*/
}
/* ///////////////////////////////////////////////

footer

////////////////////////////////////////////////// */

.footer-inner {}

.footer-inner ul.menu03{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: space-between; background-color:#e5622e;padding:10% 5%;}
.footer-inner ul.menu03 li{width: 48%;list-style-type: none;background:url(../images/common_header_nav_icon_sp.png) no-repeat 13px center #fff;background-size: 20px;margin-bottom: 3%; border-radius: 3px;font-size: .9rem;text-align: center;}
.footer-inner ul.menu03 li a{padding: 13% 0 13% 15% ;display: block;color: #282828}

.credit{text-align: center;background-color: #dee3e9;padding: 10% 5%;}
.credit p.group-name{font-weight: 600; color: #1256a3; font-size:1.5rem;margin-bottom: 3%;}
.credit p.group-shigyo{font-weight: 400; font-size:.8rem;margin-bottom: 10%;}
.credit ul.campany{display: flex;flex-direction: column;padding: 0 20%;}
.credit ul.campany li{margin-bottom: 5%;}

.copy{background-color: #282828; color: #fff;font-size: .8rem;text-align: center; padding: 5% 0 40%;}


@media only screen and (min-width: 767px){
  .footer-inner .nav_pc{ background-color:#e5622e}
  .footer-inner ul.menu03{display: flex;flex-direction: row;justify-content: space-between;width: 1000px; margin: 0 auto;padding: 10px 0}
  .footer-inner ul.menu03 li{ background: url(../images/common_header_nav_icon_pc.png)no-repeat left center;width: initial; margin-bottom:0;}
  .footer-inner ul.menu03 li a{color: #fff;display: block;padding: 20px 0 20px 25px;}
  .footer-inner ul.menu03 li a:hover{}

  .credit{padding: 50px 0;}
  .credit p.group-name{margin-bottom:20px;font-size: 2rem}
  .credit p.group-shigyo{margin-bottom:20px;font-size: 1rem}
  .credit ul.campany{display: flex;flex-direction: row; justify-content: space-between;padding: 0 30%;}
  .credit ul.campany li{margin-bottom:0;width: 47%;}

  .copy{padding: 30px 0 120px}

}

/* ///////////////////////////////////////////////

position fixed：コンタクト

////////////////////////////////////////////////// */
.footerfix-cta{padding:17px 0 10px;background-color: rgba(0, 0, 0, 0.8);position: fixed;z-index: 1000;bottom: 0;width: 100%;height: 95px}
.footerfix-cta-inner{}
.footerfix-cta-inner a.logo{display: none}
.footerfix-cta ul.cta{display:none;}
.footerfix-cta-inner span.lead{color: #fff;text-align: center;font-weight: bold;font-size: 1.2rem;display: block;margin-bottom:5px}
ul.cta-sp{display: flex;flex-direction: row;justify-content: space-between;padding: 1% 5% 0}
ul.cta-sp li{width: 48%}
ul.cta-sp li img{width: 100%;}
ul.cta-sp li a{background-color: #ed522e;
border-bottom: solid 3px #a72f00;
border-radius: 5px;
display: block;
padding: 8px 8px 9px;}

@media only screen and (min-width: 767px){
  .footerfix-cta{width: 100%;background-color: rgba(233, 238, 242, 0.8);height: 62px}
  .footerfix-cta-inner{width: 1000px; margin: 0 auto;position: relative}
  .footerfix-cta-inner a.logo{display: inline-block;position: absolute;top:0px;width: 320px;}
  .footerfix-cta-inner span.lead{display: none;}
  ul.cta-sp{display:none;}
  .footerfix-cta ul.cta{display: flex; flex-direction: row;justify-content: space-between;width: 520px;position: absolute;right: 0}
  .footerfix-cta ul.cta li{}
  .footerfix-cta ul.cta li img{display: inline-block;}
  .footerfix-cta ul.cta li img.pc-tel{width: 270px;margin: 5px 0 0 0}
  .footerfix-cta ul.cta li a.form-btn{padding: 5px 0 0 0; display: inline-block;background-color: #ed522e;
  border-bottom: solid 4px #a72f00;
  border-radius: 5px;
  display: block;
  padding:15px 17px 14px;}
  .footerfix-cta ul.cta li a.form-btn:hover{
    border-bottom: solid 2px #a72f00;
    -webkit-transform: translateY(2px);
 -ms-transform: translateY(2px);
 transform: translateY(2px);
 transition-duration: 0.2s;
  }

}


  /* ///////////////////////////////////////////////

  PC用パーツ：コンタクト

  ////////////////////////////////////////////////// */
  .contact{background-color: #ffceb5}
  .contact-inner{ width: 1000px;margin: 0 auto;padding: 50px 0}
  .contact-inner h2{font-size: 1.8rem;margin-bottom: 25px;text-align: center;}
  .contact-inner ul{display: flex;flex-direction: row;justify-content: space-between;padding: 0 90px;}
  .contact-inner ul li{width: 48%;}

  .contact-inner a.tel_btn{
    background-color: #fff;
    border-radius: 3px;
    padding:20px 10px;
    text-align:center;
    display:block;
  }

  .contact-inner .mail_btn {
        display: inline-block;
        padding: 20px 36px;
        text-decoration: none;
        background-color: #ed522e;
        /*ボタン色*/
        color: #FFF;
        border-bottom: solid 6px #c54f20;
        border-radius: 5px;
        transition-duration: 0.2s;
        margin: -2px 0 0 0;
      }

  .contact-inner .mail_btn:hover {
        /*ボタン色*/
        background-color: #ff732e;
        -ms-transform: translateY(2px);
        -webkit-transform: translateY(2px);
        transform: translateY(2px);
        /*下に動く*/
        border-bottom: solid 3px #c54f20;
        /*影*/
      }


/* ///////////////////////////////////////////////

SUB　基本パーツ

////////////////////////////////////////////////// */
.sub-contents{}

.sub-title{background: url(../images/common_bg02.gif);padding:6% 5%}
.sub-title h2{color: #d94e09;font-size: 1.7rem;font-weight: 400;}

@media only screen and (min-width: 767px){
  .sub-title{padding:45px 0; }
  .sub-title h2{width: 1000px; margin: 0 auto;}
}

.pnkz{padding:5% 5%}
.pnkz ul{}
.pnkz li{display: inline;}
.pnkz li:after{content: '>';padding: 0 3px;color: #555;}
.pnkz li:last-child:after{content: '';}
.pnkz li a{color: #282828;text-decoration: underline;}

@media only screen and (min-width: 767px){
.pnkz{padding:30px 0 45px}
.pnkz ul{width: 1000px; margin: 0 auto;}
}

.sub-link{margin-bottom: 8%;}
.sub-link ul{display: flex;flex-direction: row; flex-wrap: wrap;justify-content: space-between;padding:0 5%}
.sub-link li{width: 48%;font-size: 0.95rem}
.sub-link li a{
  display: block;
  padding: 1.2rem 0rem .9rem;
  text-decoration: none;
  background: #2ca89f;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 6px #27948c;
  border-radius: 5px;
  transition-duration: 0.2s;
  margin: 0 0 5% 0;
  text-align: center;}

.sub-link li a:after{
  font-family: "Font Awesome 5 Free";
  content: '\f107';
  font-weight: 900;
  color: #fff;/*アイコンの色*/
  display: inherit;
  margin: 0.6rem 0 0 0;
}

.sub-link li a:hover{}

  @media only screen and (min-width: 767px){
  .sub-link{margin-bottom: 70px}
  .sub-link ul{width:920px; margin: 0 auto; }
  .sub-link li{width: 32%;font-size: 1.2rem;margin-bottom: 10px}
  .sub-link li a{padding: 1rem 0rem 1.3rem;margin: 0}
  .sub-link li a:after{display:inline-block; position:relative;right:-40px;}
  .sub-link li a:hover{  /*ボタン色*/
    background-color: #3bcec3;
    -ms-transform: translateY(2px);
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
    /*下に動く*/
    border-bottom: solid 3px #27948c;
    /*影*/}
  }



.sub-contents-inner{padding: 0 5%}

h3{font-size: 1.8rem; line-height: 2rem; border-bottom: solid 5px #87d3cd;display:inline-block;padding:0 0 1%;margin: 0 0 10%}
h4{font-size: 1.5rem; line-height: 2rem; border-bottom: solid 5px #e5622e;display:inline-block;margin: 0 0 5%;color: #282828;font-weight: 400}
h5{display:inline-block; font-size:1rem;color: #d94e09; background-color: #f9eae4; line-height: 1.6rem;font-weight: 400;padding: 3%;margin-bottom: 5%}

.sub-contents-inner p{ margin: 0 0 9% 0;line-height: 1.8;text-align: justify;}
span.marker{color: #e5622e; border-bottom: solid 3px #ffc3ab;}
aside{font-size:.8rem; color:#e5622e;margin-top: 1%;line-height: 1.2rem;}
aside:before{content: '※';padding: 0　3px;}

@media only screen and (min-width: 767px){
  .sub-contents-inner{width: 800px; margin: 0 auto;}
  h3{font-weight: 400;font-size: 2.2rem;display: block;border: none; background: url(../images/common_h3_border_pc.png) no-repeat center bottom;text-align: center;padding-bottom: 24px;margin-bottom: 40px}
  h4{margin-bottom: 20px}
  h5{padding: 15px}
    .sub-contents-inner p{ margin: 0 0 50px 0;line-height: 1.8;text-align: justify;font-size: 1.1rem; font-weight: 200}

}



/* 汎用　主に申請サービス */
.table_01{ width : 100%; margin : 0 auto 10%; border-spacing: 0 10px; line-height: 1.5rem}
.table_01 th{background-color: #d94e09; color: #ffffff;display: block;padding: 3%;font-size: 1.2rem;font-weight: 400;text-align: left;}
.table_01 td{display: block;padding: 5% 0}
.table_01 a{color: inherit; border-bottom: solid 3px #ffc3ab;color: #e5622e;margin: 0 5px;display: inline-block;}

@media only screen and (min-width: 767px){
  .table_01{}
  .table_01 th{display: table-cell; padding: 15px;width: 30%;border-bottom: 15px solid #fff; text-align: center;vertical-align: middle;}
  .table_01 td{display: table-cell; padding: 15px 40px;width: 70%;font-size: 1.1rem}
  .table_01 a{color: inherit; border-bottom: solid 3px #ffc3ab;color: #e5622e;margin: 0 5px;display: inline-block;}
}

.table_02{ width : 100%; margin : 0 auto 10%; border-spacing: 0 10px; line-height: 1.5rem}
.table_02 th{background-color: #f1eae7; color: #282828;display: block;padding: 3%;font-weight: 600;text-align: left;}
.table_02 td{display: block;padding: 5% 0}
.table_02 a{color: inherit; border-bottom: solid 3px #ffc3ab;color: #e5622e;margin: 0 5px;display: inline-block;}
.table_02 a:before{ font-family: "Font Awesome 5 Free";
 content: '\f0c1';font-weight: 900;margin: 0 5px}

 @media only screen and (min-width: 767px){
   .table_02{margin-bottom: 50px;border-collapse: separate;
    border-spacing: 0px 10px;}
   .table_02 th{display: table-cell; padding: 15px;width: 30%;text-align: center;vertical-align: middle;}
   .table_02 td{display: table-cell; padding: 15px 20px;}
   .table_02 a{color: inherit; border-bottom: solid 3px #ffc3ab;color: #e5622e;margin: 0 5px;display: inline-block;}
 }


/* 建設業許可とは */
.table_03{ width : 100%; margin : 0 auto 10%; border-spacing: 0 10px; line-height: 1.5rem}
.table_03 th{background-color: #d94e09; color: #ffffff;display: block;padding: 3%;font-size: 1.2rem;font-weight: 400;text-align: left;border-left: 10px solid #f27d42;padding: 2% 3%;}
.table_03 td{display: block;padding: 2% 0}
.table_03 a{color: inherit; border-bottom: solid 3px #ffc3ab;color: #e5622e;margin: 0 5px;display: inline-block;}

.table_03 th:before{content:attr(data-label);display: block;color: #ffc3ab;font-size: 1rem}
.table_03 td:before{content:attr(data-label);display: block;color: #c1c1c1;font-size: 1rem}

@media only screen and (min-width: 767px){
  .table_03{ font-size: 1.2rem}
}

/* 料金案内 */
.table_04{ width : 100%; margin : 0 auto 10%; border-spacing: 0 10px; line-height: 1.5rem;border:1px solid #d94e09}
.table_04 th{background-color: #d94e09; color: #ffffff;padding: 2%;font-weight: 400;text-align: left;width: 33%;border-bottom:1px solid #fff;font-size: 0.9rem;vertical-align: middle;}
.table_04 td{width: 33%;text-align: center;border-bottom:1px solid #d94e09;font-size: 0.8rem;padding: 2%;line-height:1rem;vertical-align: middle;}
.table_04 a{}

.table_04 th.left{background-color: #f1e5e1; color: #282828}
.table_04 th.right{background-color: #ecdad4; color: #282828}

@media only screen and (min-width: 767px){
  .table_04 th{font-size: 1.2rem;}
  .table_04 td{font-size: 1.2rem;line-height:1.4rem}
}

/* 料金案内：モデル料金プラン */
.table_05{ width : 100%; margin : 0 auto 3%; border-spacing: 0 10px; line-height: 1.5rem;}
.table_05 th{background-color: #f1eae7; color: #282828;padding: 3%;font-weight: 400;text-align: left;width: 33%;vertical-align: middle;}
.table_05 td{width: 33%;text-align: right;;font-size: 1.3rem;padding: 3%;line-height:1rem;vertical-align: middle;}
.table_05 a{}
.table_05 th.sum{font-size: 1.5rem;font-weight: 600;color: #fff;background-color: #d94e09;}
.table_05 td.sum{font-size: 2rem;font-weight: 800;color: #e5622e;background-color: #f1eae7;}


dl.qa{font-size: 1rem;line-height: 1.8rem; margin-bottom: 5%}
dl.qa dt{font-size: 1.2rem;margin: 0 0 3%;color: #e5622e;font-weight: 600}
dl.qa dt:before {
   font-family: "Font Awesome 5 Free";
   content: '\f075';
   font-weight: 900;
   padding-right: 5px;
   color: #e5622e;/*アイコンの色*/
   }
dl.qa dd{background-color: #f7f5f5;padding: 3%;margin-bottom: 7%}
dl.qa dd:before {}
dl.qa dd a{color: inherit;color: #d94e09;margin: 0 5px;display: inline;background-color:#ffdccf}
dl.qa dd a:before{ font-family: "Font Awesome 5 Free";
 content: '\f0c1';font-weight: 900;margin: 0 5px}

ul.list{line-height: 1.8rem;margin-bottom: 10%}
ul.list li{}

  ul.list-mark{line-height: 1.6rem;margin-bottom: 10%}
  ul.list-mark li{margin-bottom: 3%; border-left: 4px solid #e5622e;padding: 0 0 0 3%;}
  @media only screen and (min-width: 767px){
    ul.list-mark{margin-bottom: 50px}
      ul.list-mark li{padding: 0 0 0 10px; margin-bottom: 10px}
  }

a.square_btn5{
      display: block;
      padding: 20px 0;
      text-decoration: none;
      background-color: #ed522e;
      /*ボタン色*/
      color: #FFF;
      border-bottom: solid 6px #c54f20;
      border-radius: 5px;
      transition-duration: 0.2s;
      margin:0 auto;
      height:15px;
      text-align: center;
      font-size: 1.2rem;
      font-weight: 600;
      margin-bottom: 10%;
    }

a.square_btn5:hover {
      /*ボタン色*/
      background-color: #ff732e;
      -ms-transform: translateY(2px);
      -webkit-transform: translateY(2px);
      transform: translateY(2px);
      /*下に動く*/
      border-bottom: solid 6px #c54f20;
      /*影*/
    }

/*  */
