@charset "utf-8";
/* ヘッダー・フッター・右下固定ボタン・パンくずリスト */





/* ================================================================================================

全ページ共通設定

=================================================================================================== */

/* スマホ崩れ防止 ------- */
html{
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}

/*--------------------------------------------------------------------------------------------------*/

* { margin: 0px;padding: 0px;}/*全ての要素の空白をなくす*/
li { list-style-type: none;}/*リストの・を消す*/
img{vertical-align: bottom;}/*画像の下にできた余白を消す*/
body {width:100%;} 
*, *::before, *::after {box-sizing: border-box;}/*paddingにより枠が広がることを防止*/
/*--------------------------------------------------------------------------------------------------*/

/* リンク設定 ------- */
a {
text-decoration:none!important;/*リンクの下の下線を消す*/
color: inherit!important;/*リンクの色を変更しない*/
}
a:visited{color: inherit;/*リンクの色を変更しない*/}
a:active{color: inherit;/*リンクの色を変更しない*/}
/*--------------------------------------------------------------------------------------------------*/

/* 改行指定 ------- */
@media screen and (min-width: 1281px) {
.sp_br{display: none;}
.ho_br{display: none;}
}






/* ===========================================================================================================================================================


　ヘッダー（外部ファイル:link_header.html）


=========================================================================================================================================================== */

/* ▼ 共通 ---------------- */
.header_back{width:100%;background:#3F3B3A;}
.header_contents1,.header_contents_sp,.header_nav_container,.header_left,.header_right,.header_nav_item1,.header_left_invoice,.header_sp_invoice{box-sizing:border-box;}

/* ▼ PC：会社情報 -------- */
.header_contents1{width:50%;display:flex;justify-content:space-between;align-items:center;margin:auto;padding:10px 0 15px;}

.header_left{width:35%;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;}
.header_left_logo img{height:100%;}
.header_left_company{color:#F8B73D;font-size:1rem;font-weight:bold;}
.header_left_invoice{width:100%;color:#fff;font-size:0.8rem;font-weight:bold;background:#898989;padding:3px 5px;line-height:100%;border-radius:5px;text-align:center;}

.header_right{width:50%;display:flex;justify-content:right;align-items:center;}
.header_right_tel img{height:100%;padding-right:10px;}

/* ▼ PC：ナビ -------- */
.header_contents2{width:50%;margin:auto;}
.header_nav_container{display:flex;justify-content:space-between;align-items:center;padding:20px 0;}
.header_nav_item1{width:15%; padding:0;border:0;} /* 枠線はaに移す */
.header_nav_item1 a{font-size:1rem;font-weight:bold;color:#3F3B3A;display:block;white-space:nowrap;border:1px solid #EFEFF0;padding:10px 0;text-align:center;line-height:1;}
.header_nav_item1:hover{background:#EFEFF0;}
.header_nav_item1:active{background:#3F3B3A;color:#FFFFFF;} /* ← #FFFFF を修正 */
.header_nav_item2{width:10%;display:flex;justify-content:right;align-items:center;margin-left:20px;}
.header_nav_item2 img{width:100%;}

/* ▼ SP：基本（PCでは非表示にしておく） */
.header_contents_sp,.header_sp_invoice{display:none;}


        /* ▽▽▽ タブレット(1280px以下) ▽▽▽ */
        @media screen and  (max-width:1280px){
        .header_contents1,.header_contents2{width:95%;}
        .header_left{width:36%;}
        .header_left_logo img{height:80%;}
        }

        /* ▽▽▽ スマホ(768px以下) ▽▽▽ */
        @media screen and (max-width:760px){
        .header_contents1,.header_contents2{display:none;}
        .header_contents_sp{display:flex;width:90%;background:#3F3B3A;flex-wrap:wrap;justify-content:space-between;align-items:center;margin:auto;padding:15px 0;}
        .header_sp_tel,.header_sp_btn_mail{height:40px;}
        .header_sp_tel img,.header_sp_btn_mail img{height:100%;}
        }






/* ===========================================================================================================================================================


　フッター（外部ファイル:link_footer.html）


=========================================================================================================================================================== */

/* ▼ フッター：背景と外側（箱） -------- */
.footer_contents1{width:100%;background:#C9CACB;padding:50px 0;}
.footer_contents2{width:100%;background:#EFEFF0;padding:10px 0;}

/* ▼ フッター：中身の器（並び） -------- */
.footer_container{width:55%;margin:auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;}

/* ▼ ロゴ -------- */
.footer_item_logo{width:15%;margin-right:100px;}
.footer_item_logo img{width:100%;}

/* ▼ ナビ（文字） -------- */
.footer_item_nav{width:18%;color:#3F3B3A;font-size:15px;font-weight:bold;line-height:250%;}

/* ▼ SNS（並び） -------- */
.footer_item_sns{width:15%;display:flex;justify-content:space-between;flex-wrap:wrap;}
.footer_item_sns img{width:100%;}

/* ▼ コピーライト（文字） -------- */
.footer_contents2 p{font-size:14px;color:#898989;text-align:center;}


        /* ▽▽▽ タブレット(1280px以下) ▽▽▽ */
        @media screen and  (max-width:1280px){
        .footer_container{width:90%;}
        .footer_item_logo{width:20%;margin-right:50px;}
        .footer_item_nav{width:22%;}
        .footer_item_sns{display: none;}
        .footer_contents2{padding:5px 0;}
        .footer_contents2 p{font-size:12px;}
        }

        /* ▽▽▽ スマホ(768px以下) ▽▽▽ */
        @media screen and (max-width:760px){
        .footer_contents1{padding:25px;}
        .footer_container{width:90%;}
        .footer_item_logo{width:100%;margin:0 auto;text-align:center;}
        .footer_item_logo img{width:50%;}
        .footer_item_nav{display: none;}
        .footer_contents2{padding:5px 0;}
        .footer_contents2 p{font-size:12px;}
        }

/*--------------------------------------------------------------------------------------------------*/

/* ▼ 短いページでもフッターが最下部に固定 ------- */
html, body {height: 100%;}
body {margin: 0;}

#wrap {min-height: 100%;display: flex;flex-direction: column;}
#wrap > main {flex: 1;}/* main が余白を全部使う */
#footer {flex-shrink: 0;}/* フッターは縮まない */






/* ===========================================================================================================================================================


　固定ナビ全体：右下固定・※出現位置はJS制御＝sys_jumpbtn.js


=========================================================================================================================================================== */
/* 固定ナビ全体：右下固定（出現位置はJS制御） */
.floating-nav{
  position:fixed;right:20px;bottom:-300px;z-index:800;
}

/* 各ボタン共通：余白リセット */
.floating-nav p{margin:0;}

/* 各ボタン共通：サイズ・背景 */
.floating-nav a{
  width:60px;height:60px;display:block;
  background-repeat:no-repeat;background-size:contain;
  transition:.3s;
}

/* 上へ戻る */
.jump_top a{background-image:url(navi/up.png);}
.jump_top a:hover{background-image:url(navi/up_o.png);}

/* LINE */
.jump_line{margin-top:5px;}
.jump_line a{background-image:url(navi/contact_line.png);}
.jump_line a:hover{background-image:url(navi/contact_line_o.png);}

/* 施工事例 */
.jump_works{margin-top:5px;}
.jump_works a{background-image:url(navi/works_icon.png);}
.jump_works a:hover{background-image:url(navi/works_icon_o.png);}

/* 旧IDボタンは非表示 */
#jump_top,#jump_line,#jump_works{display:none;}


        /* SPでも必ず表示させる保険 */
        @media screen and (max-width:768px){
          .floating-nav{display:block;position:fixed;}
        }






/* ===========================================================================================================================================================


　パンくずリスト


=========================================================================================================================================================== */

/* ▼ パンくずリスト -------- */
.breadcrumb {
  width: 50%;
  margin: 5px auto 0px;
  display: flex;
  gap: 0 20px;
  list-style: none;
  padding: 0;
  font-size: .8em;
  font-weight: bold;
  }
.breadcrumb li {
  display: flex;
  align-items: center;
  }
.breadcrumb li:first-child::before {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 4px;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M11.7%207.5%204%2013.8v6.8c0%20.4.3.7.7.7h4.7c.4%200%20.7-.3.7-.7v-4c0-.4.3-.7.7-.7h2.7c.4%200%20.7.3.7.7v4c0%20.4.3.7.7.7h4.7c.4%200%20.7-.3.7-.7v-6.8l-7.7-6.3h-.9zm12.1%204.4L20.3%209V3.2c0-.3-.2-.5-.5-.5h-2.3c-.3%200-.5.2-.5.5v2.9L13.3%203c-.7-.6-1.8-.6-2.5%200L.2%2011.8c-.2.2-.3.5-.1.7l1.1%201.3c.2.2.5.2.7.1l9.8-8.1h.6l9.8%208.1c.2.2.5.1.7-.1l1.1-1.3c.2-.2.1-.5-.1-.6z%22%20style%3D%22fill%3A%23f8b73d%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  content: '';
  }
.breadcrumb li:not(:last-child)::after {
  display: inline-block;
  width: .3em;
  height: .6em;
  margin-left: 12px;
  background-color: #F8B73D;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  content: '';
  }
.breadcrumb a {
  color: #3F3B3A;
  text-decoration: none;
  }
.breadcrumb a:hover{color: #F8B73D;}