@charset "UTF-8";

/* ---------------------------------------------------------------------------
  ★共通
--------------------------------------------------------------------------- */

html {
    font-size: 62.5%;
}

body {
    font-size: 1.5rem;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1.8;
    font-weight: normal;
    max-width: 100%;
}

object {
    pointer-events: none;
}

.sp {
    display: block !important;
}

.pc {
    display: none !important;
}

a {
    text-decoration: none;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    /*スマホ時url改行されるように*/
    word-wrap: break-word;
    word-break: break-all;
    overflow-wrap: break-word;
}



/* ---------------------------------------------------------------------------
  ★BASE
--------------------------------------------------------------------------- */
a.to_detail{
    width: 280px;
    height: 50px;
    line-height: 47px;
}
a.to_detail02{
    height: 40px;
    line-height: 40px;
    margin: 0 auto;
}
a.to_detail03{
    width: 200px;
    height: 40px;
    line-height: 37px;  
}

a.to_detail span:before {
    width: 12px;
    height: 12px;
    right: -1rem;
}
a.to_detail02 span:before,
a.to_detail03 span:before {
    width: 12px;
    height: 12px;
    right: 0;
}
a.to_detail05{
    width: 80%;
    height: 70px;
    line-height: 2.2rem;
    padding-top: 1.1rem;
}
a.to_detail05 span.wrap:before {
    width: 12px;
    height: 12px;
    right: 1.5rem;
    top: 55%;
}
a.to_detail05 span.sm{
    font-size: 1.4rem;
}

.imgBox_sp{
    width: 80%;
    max-width: 400px;
    margin: 0 auto;
}

a.anchor01 {
  padding-top: 80px;
  margin-top: -80px;
}
a.anchor02 {
  padding-top: 70px;
  margin-top: -70px;
}


/* ---------------------------------------------------------------------------
  ★header
--------------------------------------------------------------------------- */
#header {
  height: 60px;
  }
#header.active {
     box-shadow: 0 0 10px rgba(0,0,0,0.2);   
}
.header__inner {
    height: 60px;
    margin: auto;
    padding: 7.773px 0;
    width: 92%;
}
.header__logo {
    display: block;
    padding: 0.5rem 0 0;
    position: relative;
    width: 200px;
}
.header__trigger {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 56px;
    justify-content: center;
    position: absolute;
    right: 5px;
    top: 0;
    width: 60px;
    z-index: 99;
}
.header__trigger-menu {
    color: #2c2c2c;
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0.1rem;
}
.header__trigger-menu span.close {
    display: none;
}
.header__trigger-menu.is-active span.open {
    display: none;
}
.header__trigger-menu.is-active span.close {
    display: block;
    color: #2c2c2c;
}

.header__trigger-inner {
    display: inline-block;
    height: 20px;
    position: relative;
    transition: all 0.4s;
    width: 30px;
    margin-bottom: 3px;
}
.header__trigger-line {
    background-color: #2c2c2c;
    border-radius: 2.5px;
    display: inline-block;
    height: 2px;
    left: 0;
    position: absolute;
    transition: 0.5s;
    transition-property: transform, -webkit-transform;
    width: 100%;
}
.header__trigger-line:nth-of-type(1) {
    top: 0;
}
.header__trigger-line:nth-of-type(2) {
    top: 9.5px;
}
.header__trigger-line:nth-of-type(3) {
    bottom: 0;
}
.header__trigger-line:nth-of-type(1).is-active {
    transform: translateY(15px) rotate(45deg);
}
.header__trigger-line:nth-of-type(2).is-active {
    display: none;
}
.header__trigger-line:nth-of-type(3).is-active {
    transform: translateY(-3px) rotate(-45deg);
}



/* =======================================
  nav
========================================== */
body.is-open .navi {
    opacity: 1;
    visibility: visible;
    z-index: 1;
    background: #fff;
    padding-bottom: 3rem;
}
.navi {
    bottom: 0;
    display: block;
    opacity: 0;
    overflow: auto;
    padding-top: 15px;
    position: fixed;
    right: 0;
    top: 60px;
    transition: 0.5s;
    visibility: hidden;
    width: 100%;
    z-index: 50;
}
.navi__menu {
    gap: 0.9rem 0;
    border-top: none;
    flex-direction: column;
    margin: 0 auto;
    padding-right: 0;
    width: 84%;
}
.nav_tit{
    color: var(--main-red);
}
.navi__child li{
    position: relative;
}
li.hasnot-sub{
    border-bottom: 1px solid #222;
}
.navi__menu-link {
    border-bottom: 1px solid #fff;
    color: #222;
    position: relative;
    cursor: pointer;
    transition: all .5s ease;
}
li.has-sub .navi__menu-link{
    padding: 0 0 0 0.8rem;
    margin: 0.5rem 0;
}
li.hasnot-sub .navi__menu-link{
    padding: 0 0 1.1rem 0.8rem;
}

.navi_arrow::before,
.navi_arrow02::before,
.navi_arrow03::before{
    content: "";
    width: 8px;
    height: 8px;
    border-top: 1px solid var(--main-red);
    border-right: 1px solid var(--main-red);
    -webkit-transform: rotate(45deg);
    position: absolute;
    right: 20px;
    transform: rotate(45deg);
    transition: .3s;
}
.navi_arrow::before{
    top: calc(50% - 7px);
}
.navi_arrow02::before{
    top: 42%;
}
.navi_arrow03::before{
    top: calc(50% - 2px);
}

.navi__child {
    border-bottom: 1px solid #222;
    padding-bottom: 1rem;
}
.navi__child a {
    gap: 5px;
    gap: 0.5rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #222;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px 15px;
    width: 100%;
    padding: 0.5rem 1.5rem 0.5rem 2.3rem;
}

/*.navi__child li:not(:first-child) {
    margin-bottom: 0.8rem;
}
.navi__buttons {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 2rem auto 0 auto;
    width: 84%;
}
.header__button {
    font-size: 1.8rem;
    padding: 0.6rem 0 0.8rem 0;
    width: 45%;
}*/

ul.header__logoWrap{
    gap: 1rem;
    margin: 2rem auto 0 auto;
    justify-content: center;
}
ul.header__logoWrap li{
    width: 70px;
}
a.header__bn{
    font-size: 1.5rem;
    width: 80%;
    max-width: 400px;
    height: 50px;
    line-height: 48px;
    margin: 2rem auto 0 auto;
}
a.header__bn span{
    padding-left: 2.5rem;
}
a.header__recruit span:before{
    width: 20px;
    height: 23px;
}
a.header__contact span:before{
    width: 20px;
    height: 14px;
}

.inner,.inner_700,.inner_800,.inner_900,.inner_1000,.inner_1100,.inner_1200{
    width: 90%;
}

/* ---------------------------------------------------------------------------
  ★TOTOP
--------------------------------------------------------------------------- */
#totop {
  position: absolute;
  top: -4rem;
  right: 0;
  width: 46px;
  height: 142px;
  display: block;
}



/* ---------------------------------------------------------------------------
  ★トップイメージ
--------------------------------------------------------------------------- */
.top_img{
    background: none;
    margin-top: 6rem;
    height: 535px;
}
.top_img:before{
    height: 20vw;
    position: absolute;
}
.top_img img{
    width: 100%;
    height: 100%;
    object-fit: cover;   
}
.top_img .imgBox{
  width: 115px;
  height: 115px;
  bottom: -40px;  
}
.top_txt{
    width: 100%;
}
.top_txt_in{
  width: 89%;
  min-width: 329px;  
  word-break: break-word;
  margin: 198px auto 0 auto;
  text-align: justify;
}
.top_txt_in h2{
    font-size: 2.2rem;
    line-height: 3rem;
    text-align: center;
    padding: 0.5rem 2rem 0.7rem 2rem;
}
.top_txt_in .txtBox{
    background: rgba(255,255,255,0.9);
    padding: 1rem 1.5rem 0 1.5rem;
}
.top_txt_in .txtBox p{
    line-height: 2.5rem;
    text-align: center;
    font-weight: 600;
}
.topBox_out{
    padding-bottom: 5rem;
}
.topBox_txt{
    text-align: justify;
    margin: 5rem 0 7rem 0;
}
#home .topBox h3{
    font-size: 2.25rem;
    line-height: 3.5rem;
    margin: 1rem 0 1.5rem 0.5rem;
    text-align: center;
}
.topServiceList{
    justify-content: center;
    gap: 5.5rem 0;
    margin: 0 auto 2rem auto;
    max-width: 400px;
}
.topServiceList a{
    width: 250px;
    height: 150px;
    padding: 1.5rem;
    position: relative;
}
.topServiceList a:nth-child(odd){
    margin: 0 auto 0 1rem;
}
.topServiceList a:nth-child(even){
    margin: 0 0 0 auto;
}
.topServiceList .imgBox{
    top: -4rem;
    width: 250px;
    height: 150px;
}
.topServiceList .imgBox img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.topServiceList p{
    padding-bottom: 0.7rem;
}

.topBox_txt_02{
    text-align: center;
    margin-bottom: 1rem;
}
.to_detailBox_top{
    width: 100%;
    margin: 0 auto;
    gap: 2rem;
    justify-content: center;
}
#home .to_detailBox_top,
#HighPressure .to_detailBox_top{
    position: relative;
    bottom: 2.5rem;
}



/* -- topResponse ---------------*/
.topResponse_out{
    margin-top: 1rem;
    padding: 3rem 0 0 0;
}
.topResponse h3{
    font-size: 2rem;
    text-align: center;
    margin-bottom: 1.5rem;
    line-height: 3rem;
}
.topResponse ul{
    gap: 3rem 0;
}
.topResponse ul li{
    width: calc(50% - 1rem);
}
.topResponse ul li .txtBox{
    font-size: 1.7rem;
    padding: 0.2rem;
}
.topResponse ul li .imgBox{
    height: 250px;
}
.topResponse ul li p{
    line-height: 2.2rem;
    margin-top: 0.5rem;
    text-align: justify;
}
.to_detailBox{
    width: 100%;
    margin: 0 auto;
    position: relative;
    bottom: -3rem;
    gap: 2rem;
    justify-content: center;
}


/* -- topAbout ---------------*/
.topAbout{
    background-size: 20em;
    padding: 3rem 0 0 0;
    margin-top: 5rem;
}
.topAbout h3{
    font-size: 2rem;
    margin-bottom: 1.5rem;
}
.topAbout .txtBox p span{
    font-size: 1.7rem;
    margin-bottom: 1rem;
}
.topAbout .bnBox{
    gap: 1.5rem;
    margin-top: 3rem;
}
.topAbout .bnBox a.bn:nth-child(-n+4){
    width: 100%;
    height: 150px;
}
.topAbout .bnBox .bn:last-child{
    width: 100%;
    height: 315px;
    background-position: center top;
}
.topAbout .bnBox .bn .tit{
    font-size: 1.7rem;
    width: 90px;
    height: 90px;
}
.topAbout .bnBox a.bn:first-child .tit,
.topAbout .bnBox a.bn:nth-child(3) .tit,
.topAbout .bnBox a.bn:nth-child(4) .tit,
.topAbout .bnBox .bn .tit{
    line-height: 88px;
}
.topAbout .bnBox a.bn:nth-child(2) .tit{
    line-height: 2.5rem;
    padding-top: 1.8rem;
}
.topAbout .bnBox a.bn:nth-child(-n+4) .tit{
    margin: 3rem 0 0 3rem;
}
.topAbout .bnBox .bn .tit{
    margin: 3rem 2rem 0 3rem;
}
.topAbout .bnBox .bn p{
    padding-top: 1rem;
    margin: 0 3rem;
    line-height: 2.5rem;
}
.topAbout a.to_detail02{
    margin: 3rem 3rem 0 3rem;
}

/* -- topInfo ---------------*/
.topInfo_out{
    padding: 3rem 0 0 0;
}
.topInfo{
  padding: 1rem 0;
}
span.club{
    font-size: 1.4rem;
    letter-spacing: 0;
}
.cateBox{
    gap: 1rem;
}
.cateBox a{
    width:calc(50% - 0.5rem);
    padding: 0.3rem 0 0.4rem 0;
}
ul.infoList{
    width: 90%;
    margin: 2rem auto 0 auto;
}
ul.infoList li{
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}
ul.infoList li span.day{
    display: block;
}
ul.infoList li span.news-title{
    display: block;
    line-height: 2.2rem;
    margin-top: 0.5rem;
}
.topInfo_out a.to_detail{
    bottom: -2.5rem;
}

/* -- topRecruit ---------------*/
.topRecruit{
    background:none;
    margin-top: 60px;
}

/* -- topBanner ---------------*/
.topBanner{
    width: 80%;
}
ul.slick01{
    margin: 3rem 2rem 0 2rem;
}
ul.slick01 li{
    margin: 0 2rem;
}

/* -- topBanner_bt ---------------*/
.topBanner_bt{
    margin-top: 3rem;
}
.topBanner_bt .Box{
    width: 100%;
    height: 200px;
    padding-top: 2rem;
}
.topBanner_bt .Box h3{
    font-size: 2rem;
    padding-left: 3.2rem;
    margin: 1rem 0 2rem 0;
}
.topBanner_bt .Box02 h3{
    padding-left: 3.5rem;
}
.topBanner_bt .Box01::after {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;   
}
.topBanner_bt .Box01 h3:before{
    width: 24px;
    height: 30px;
}
.topBanner_bt .Box02 h3:before{
    width: 31px;
    height: 31px;
}
.topBanner_bt p{
    line-height: 2.2rem;
}

/* -- footer  ---------------*/
footer{
    padding: 3rem 0;
    position: relative;
}
.footer_inner{
  gap:3rem;
  text-align: center;
}
a.footer_logo{
  width: 240px;
  margin-bottom: 2rem;
}
.footer_left{
    width: 100%;
}
.footer_left address{
    text-align: left;

}
.footer_left address span{
    margin-right: 0.5rem;
}
.footer_left a.footer_tel{
    font-size: 1.3rem;
    line-height: 2.5rem;
    text-align: left;
    display: block;
    margin-top: 0.8rem;
}
.footer_left a.footer_tel span{
    font-size: 2.2rem;
    display: block;
}

.snsBox{
    gap: 3rem;
}
.snsBox a {
  width: 40px;
}

.footer_right{
    text-align: center;
}
.footer_right .spacer{
    width: 100%;
}
.footer_li , 
.footer_nav-wrap div{
    width: 11.5em;
    text-align: left;
    display: inline-block;
}

.footer_li-item,.footer_li-item a{
  margin-bottom: 15px;
}
.footer_nav{
    width: 100%;
}
.footer_nav-wrap{
    gap: 0 3.5rem;
    /*justify-content: center;*/
    margin-bottom: 2rem;
}
.footer_nav-wrap div ul.footer_li{
    width: 100%;
}

.footer__copy{
    text-align: left;
}


/* ---------------------------------------------------------------------------
  下層ページ
--------------------------------------------------------------------------- */
.subTop{
    height: 120px;
    width: 100%;
    margin-top: 6rem;
}
.subTop h2{
    font-size: 2.3rem;
    padding-top: 4rem;
}
#sub h3{
    font-size: 2.3rem;
    line-height: 3.5rem;
}

ul.pankuzu{
    margin: 1rem auto 3rem auto;
}

.{
    width: 80%;
    max-width: 400px;
    margin: 0 auto;
}
.bor_bt{
  margin-bottom: 2rem;
  padding-bottom: 2rem;
}


/* ---------------------------------------------------------------------------
  会社案内
--------------------------------------------------------------------------- */
#company a.anchor:before {
    height: 100px; /* 調整したい高さ（固定ヘッダーの高さ） */
    margin-top: -100px; /* heightと同じ分のネガティブマージン */
}
#company .topBox,
#considerationAll .topBox{
    height: 150px;
    padding: 4.2rem 0;
}
#company .topBox h3,
#considerationAll .topBox h3{
    margin-bottom: 0.5rem;
}
#companyAll .link_wrap,
#considerationAll .link_wrap{
  justify-content: center;
  gap: 2rem 0;
  padding: 4rem 0;
}
#companyAll .link_wrap a,
#considerationAll .link_wrap a{
    padding: 0 2rem;
}
#companyAll .link_wrap a:nth-child(4)::before,
#considerationAll .link_wrap a:nth-child(3)::before {
    content:"";
    display:inline-block;
    width: 1px;
    height: 20px;
    background-color: #222;
    position: absolute;
    top: 53%;
    transform: translateY(-50%);
    left: -2px;
}

#overview .link_wrap,
#history .link_wrap,
#mvv .link_wrap,
#esg .link_wrap{
    padding: 0 0 4rem 0;
}

.messageBox h3{
    margin-bottom: 1.5rem;
}
.messageBox .imgBox {
    width: 80%;
    max-width: 400px;
    margin: 0 auto 2rem auto;
}
.message_sign{
    margin-top: 2rem;
}
.message_sign img{
  width: 125px;
}
.messageBox .flex_wrap{
    margin-bottom: 3rem;
}
.messageBox h4{
    font-size: 2.1rem;
}
.messageBox p.txt{
    max-width: 400px;
}
#company .Box_out ul li{
  padding-left: 1.5rem;
}
#company .Box_out ul li::before{
    top: 10px;
}

.philosophy .inner_1100{
    padding: 2rem 0 3rem 0;
    margin: 2.5rem auto 0 auto;
}
.philosophy h3{
    margin-bottom: 1rem;
}
.philosophy .imgBox{
    width: 100%;
    margin: 0 auto;
}
#company .Box_out{
    padding: 1.5rem 0 3rem 0;
}
#company .enviBox{
    padding: 1.5rem 0 6rem 0;
}
#company .Box_w{
    padding: 1rem 2rem 2rem 2rem;
}
#company .Box_w h3{
    margin-bottom: 1rem;
}
#company .Box_w ul li{
    text-align: justify;
}
#company .Box_w ul li:not(:last-child) {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}


/* ---------------------------------------------------------------------------
  会社概要
--------------------------------------------------------------------------- */
#overview{
    margin-bottom: 3rem;
}
#overview h3{
    margin-bottom: 1rem;
}
#overview table.c-table th {
        border: 1px solid #f4f6f5;
        background: #f9ecee;
        vertical-align: top;
        padding: 12px 13px;
        font-weight: 600;
        width: 100%;
        display: block;
        word-break: break-all;
}
table.c-table_sp td {
        border-right: 1px solid #f4f6f5;
        border-left: 1px solid #f4f6f5;
        border-top: none;
        border-bottom: none;
        vertical-align: top;
        padding: 12px 13px;
        word-break: break-all;
        width: 100%;
        display: block;
}
table.c-table_sp td:last-child{
    border-bottom: 1px solid #f4f6f5;
}
.whiteBox_out{
    padding: 0 0 3rem 0;
}
.whiteBox{
    padding: 1rem 0;
}
#overview .Mgt{
    margin-top: 2.5rem;
}
.access{
    padding: 1.5rem 2rem 1rem 2rem;
}
.access .flex_wrap{
    justify-content: center;
}
.access .imgBox{
    width: 100%;
    margin-bottom: 1.5rem;
}
.access .tit{
    font-size: 1.8rem;
    margin-bottom: 0.5rem;
    text-align: center;
}
#overview iframe{
    width: 100%;
    height: 250px;
    margin: 1.5rem 0 0 0;
}

/* ---------------------------------------------------------------------------
  沿革
--------------------------------------------------------------------------- */
#history{
    margin-bottom: 3rem;
}
#sub h3.pageTop{
    font-size: 2.3rem;
    line-height: 3rem;
}
#sub h3.pageTop span{
    font-size: 1.5rem;
}
#history h3.pageTop{
    margin-bottom: 2.5rem;
}

#history .historyBox{
    margin-top: 2rem;
}
.o_08 dl{
  border-left: solid 1px var(--main-red);
  position: relative;
  padding: 0.3rem 0 4rem 4rem;
  margin-left: 2rem;
}
.o_08 dl dt{
    font-size: 1.8rem;
    line-height: 2.5rem;
    width: 100%;
}

.o_08 dl dt span.year{
    font-size: 1.6rem;
    width: 75px;
    margin-bottom: 0.5rem;
    line-height: 2rem;
    padding: 0.1rem 0 0.3rem 0;
}
.o_08 dl dt span.year::after {
  width: 25px;
  top: calc(50% - 1px);
  left: calc(50% + -68px);
  z-index: -1;
}
.o_08 dl dt span.txt{
    font-size: 1.5rem;
    line-height: 2.2rem;
    margin: 0.5rem 0 1rem 0;
}
.o_08 dl dt span.txt03{
    margin-bottom: 0;
}
.o_08 dl dt span.sm{
    font-size: 1.3rem;
}
.o_08 dl dt span.sm02{
    font-size: 1.3rem;
    line-height: 2rem;
    display: block;
}
.o_08 dl dt span.Mgb {
    margin-bottom: 0.5rem;
}
.o_08 dl dt span.txtAdjust{
    display: block;
    line-height: 2.5rem;
    margin: 0.7rem 0;
}
.o_08 dl dt span.txt02{
    display: block;
    margin-top: 0.7rem;
}
.o_08 dl dd{
  float: right;
    width: 100%;
    max-width: 400px;
}
.o_08 dl dd .Mgt{
    margin-top: 1rem;
}
.o_08 dl dd .imgBox .imgMgt{
    padding-top: 1rem;
}



/* ---------------------------------------------------------------------------
  MVV
--------------------------------------------------------------------------- */
#mvv{
    margin-bottom: 5rem;
}
#mvv h3{
    margin-bottom: 1.5rem;
}
#mvv .topBox{
    padding-bottom: 1rem;
}
#mvv .topBox .imgBox{
    margin: 2rem auto;
}
#mvv .Mgb{
    margin-bottom: 3rem;
}
#mvv .mission,
#mvv .vision,
#mvv .value,
#mvv .wh{
    background-size: 20em;
    padding: 4rem 0 0 0;
}
#mvv .mission,
#mvv .wh{
    margin-top: 2rem;
}
#mvv ul.ul_01{
    margin: 0.5rem 0;
}
#mvv ul.ul_01 li{
    font-size: 1.6rem;
    line-height: 2.2rem;
    padding-left: 1.5rem;
}
#mvv ul.ul_01 li:not(:last-child){
    margin-bottom: 1rem;
}
#mvv .vision ul.ul_01 li:last-child::before{
    top: 28%;
}
#mvv .imgBox{
    margin-bottom: 1.5rem;
}
#mvv .vision .fiveBox{
    border-top: 1px solid var(--main-red);
    border-bottom: 1px solid var(--main-red);
    padding: 1.5rem 0;
    margin: 2rem auto 0 auto;
}
#mvv .vision h4{
    font-size: 1.8rem;
    margin-bottom: 0.5rem;
}
#mvv .vision .ul_wrap ul li:not(:last-child) {
    margin-bottom: 0.5rem;
}
#mvv .vision .ul_wrap ul li span{
    display: inline-block;
    margin-right: 0.5rem;
}
#mvv .value h4{
    font-size: 1.8rem;
}

#mvv .wh h3{
    margin-bottom: 2.5rem;
}
#mvv .wh h4{
    font-size: 2.5rem;
    line-height: 2.8rem;
    margin-bottom: 0.5rem;
}
#mvv .wh h4 span{
    font-size: 1.3rem;
    display: block;
}
#mvv .wh p{
    text-align: justify;
}
#mvv .wh .ul_wrap{
    margin: 1rem 0;
}
#mvv .wh .Mgb{
    margin-bottom: 2rem;
}


/* ---------------------------------------------------------------------------
  サスティナビリティへの取り組み
--------------------------------------------------------------------------- */
#esg{
    margin-bottom: 5rem;
}
#esg h2{
    line-height: 3rem;
    padding-top: 3rem;
}
#esg .topBox{
    margin-bottom: 2.5rem;
    padding-bottom: 2.5rem;
}
#esg .topBox h3{
    margin-bottom: 1.5rem;
}
#esg .topBox h4{
    font-size: 1.8rem;
}
#esg .topBox .imgBox{
    margin-top: 2rem;
}
#esg .titBox .imgBox{
    height: 60px;
    margin-bottom: 0.5rem;
}
#esg .BoxAll h3{
    padding-left: 0.8rem;
}
#esg .BoxAll ul {
    margin-top: 1.5rem;
    gap: 1.5rem;
}
#esg .BoxAll ul li .imgBox{
    width: 180px;
    height: 180px;
    margin: 0 auto;
}
#esg .BoxAll ul li p{
    font-size: 1.7rem;
    margin-top: 0.5rem;
    line-height: 2.2rem;
}
#esg .BoxAll .Box_in{
    margin-top: 3rem;
}
#esg .BoxAll .Box_in .imgBox{
    margin-bottom: 1rem;
}
#esg .BoxAll .Box_in .txtBox p span{
    font-size: 1.8rem;
}
#esg .MgtBox{
    margin-top: 2rem;
}
#esg .Box01,#esg .Box02{
    margin-bottom: 2rem;
    padding-bottom: 2rem;
}

/* ---------------------------------------------------------------------------
  サービス案内
--------------------------------------------------------------------------- */
#services{
    margin-bottom: 5rem;
}
#services .topBox_out{
    margin-top: 6rem;
    padding-bottom: 2rem;
}
#services .topBox01 h3{
    margin-bottom: 1rem;
}
ul.topServiceList{
    justify-content: center;
    gap: 5.5rem 0;
    margin: 0 auto 2rem auto;
    max-width: 400px;
}
ul.topServiceList li{
    width: 250px;
    height: 150px;
    padding: 1.5rem;
    position: relative;
}
ul.topServiceList li:nth-child(odd){
    margin: 0 auto 0 1rem;
}
ul.topServiceList li:nth-child(even){
    margin: 0 0 0 auto;
}
ul.topServiceList .imgBox{
    top: -4rem;
    width: 250px;
    height: 150px;
}
ul.topServiceList .imgBox img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#services .Box{
    padding: 2rem 0 2.5rem 0;
}

#services .Box .Boxin .imgBox{
    margin-bottom: 1rem;
}
#services .Box .Boxin a.to_detail{
    width: 200px;
    margin: 1.5rem auto 0 auto;
}

#services .Box01 h3 span{
    font-size: 1.4rem;
    line-height: 2rem;
    display: block;
}
#services .Box01 .Boxin{
    margin-top: 1.5rem;
    padding: 1.5rem;  
}
#services .Box02 .imgBox_top{
    width: 30px;
    margin: 1rem auto 0 auto;
}
#services .Box02 h3{
    margin: 1rem 0 1.5rem 0;
}
/*#services .Box02 h3{
    width: 100%;
    max-width: 400px;
    margin: 1rem auto 2rem auto;
    height: 50px;
    line-height: 45px;
}*/
#services .Box02 h3::after {
  border-left: 15px solid transparent; /* 左側の辺 */
  border-right: 15px solid transparent; /* 右側の辺 */
  border-top: 15px solid #222; /* 上側の辺に色を付ける */
}
#services .Box02 .breakerBox{
    padding: 1rem 1rem 3rem 1rem;
}
#services .Box02 h4{
    font-size: 1.8rem;
    margin-top: 1rem;
}
#services .Box02 ul {
    margin-top: 1.2rem;
    gap: 1.5rem 1rem;
}
#services .Box02 ul li .imgBox{
    width: 150px;
    height: 150px;
}
#services .Box02 ul li p{
    line-height: 2rem;
    margin-top: 0.5rem;
}

#services .Box03{
    padding: 0 0 2.5rem 0;
    margin-top: 2rem;
}
#services .Box03 h3{
    line-height: 3rem;
}
#services .Box03 h3 span.case{
    font-size: 1.5rem;
}
#services .Box03 h3 span.number{
    font-size: 1.3rem;
    line-height: 1.4em;
    width: 20px;
  height: 20px;
  margin: 0 0.2rem 0 0.3rem;
  top: -0.1rem;
}
#services .Box03 .Box_in{
    width: 100%;
    padding: 0rem 0 3rem 0;
}
#services .Box03 .Box_in01{
    padding-bottom: 3rem;
}
#services .Box03 .tit_02{
    font-size: 1.6rem;
}
#services .Box03 .tit_01,
#services .Box03 .tit_02{
    width: 100%;
        margin: 1.5rem auto 2rem auto;
        height: 40px;
        line-height: 37px;
}
#services .Box03 .tit_01::after{
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #222;
}

#services .Box03 .flex_wrap{
    margin-bottom: 2rem;
}
#services .Box03 .Box_in01 .imgBox{
    margin-bottom: 1.5rem;
}
#services .Box03 .Box_in01 ul li:not(:last-child) {
    margin-bottom: 1.5rem;
}
#services .Box03 .Box_in01 ul li span{
    padding: 0.2rem 1rem 0.4rem 1rem;
    margin-bottom: 0.5rem;
    width: 170px;
}
#services .Box03 .answerBox{
    padding: 1rem 2rem 1.5rem 2rem;
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-top: 2rem;
}
#services .Box03 .Box_in02 h3 span.sm{
    font-size: 1.3rem;
    line-height: 2.5rem;
}
#services .Box03 .Box_in02 .flex_wrap{
    width: 100%;
    margin: 0 auto;
    align-items: center;
    gap: 1.5rem;
}
#services .Box03 .Box_in02 .txtBox{
    font-size: 1.7rem;
    text-align: justify;
    width: 80%;
}
#services .Box03 .Box_in02 ul li:not(:last-child) {
    margin-bottom: 1rem;
}
#services .Box03 .Box_in02 .answerBox {
    padding: 0.4rem 0 1.6rem 0;
    font-size: 2.5rem;
    line-height: 2.4rem;
    width: 100%;
}
#services .Box03 .Box_in02 .answerBox span{
    font-size: 1.4rem;
}
#services .Box03 .Box_in02 .answer_txt{
    margin-top: 1rem;
    text-align: justify;
}
#services .Box03 ul li p{
    line-height: 2.5rem;
}
#services .Box03 .Box_in02 .txtBox span{
    width: 100%;
    display: block;
}
#services .Box03 .Box_in02 .txtBox span::before,
#services .Box03 .Box_in02 .txtBox span::after{
    width: 20px;
    height: 15px;
    top: -5px;
}
#services .Box03 .Box_in02 .txtBox span::before {
    left: -30px;
}
#services .Box03 .Box_in02 .txtBox span::after {
    right:-30px;
}

#services .Box04{
    padding: 2rem;
    margin: 3rem auto;
}
#services .Box04 h3{
    font-size: 2rem;
    font-weight: 700;
    line-height: 3rem;
    margin-bottom: 1rem;
}
#services .Box04 .flex_wrap{
    margin-top: 1.5rem;
    justify-content: center;
}
#services .Box04 ul li{
    margin-bottom: 1rem;
}
#services .Box04 ul li:before{
  width: 20px;
  height: 20px;
  margin-top: 5px;
}
#services .Box04 ul li p{
    font-size: 1.7rem;
    line-height: 2.5rem;
    padding-left: 1rem;
}
#services .Box04 a.to_detail03{
    width: 250px;
    margin: 2rem auto 0 auto;
}

/* ---------------------------------------------------------------------------
  サービス下層　共通
--------------------------------------------------------------------------- */
#servicesAll{
}
#servicesAll h3{
    margin-bottom: 1.3rem;
    text-align: center;
}
#servicesAll h3 span.sm{
    font-size: 1.7rem;
}
#servicesAll h4{
    font-size: 1.8rem;
    line-height: 2.5rem;
    margin-bottom: 0.5rem;
}
#servicesAll .MgtBox{
    margin-top: 2.5rem;
}
#servicesAll .topBox .imgBox{
    margin-bottom: 1.5rem;
}
#servicesAll .topBox{
  margin-bottom: 5rem;
}
#servicesAll .topBox .txtBox::after {
    background-color: var(--main-red);
    content: "";
    display: block;
    height: 1px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: 100%;
    bottom: -2.5rem;
}

.numlistBox_out{
    padding-bottom: 3rem;
}
.numlistBox{
    padding: 0 1.5rem 2rem 1.5rem;
}
.numlistBox ul{
    margin-top: 2rem;
}
.numlistBox ul li:not(:last-child){
    margin-bottom: 2rem;
}
.numlistBox .num{
    width: 46px;
    font-size: 2rem;
    padding: 0 0.7rem 0.2rem 0;
    margin: 0 auto;
}
.numlistBox .txtBox h4{
    font-size: 1.8rem;
    line-height: 2.5rem;
    margin: 1rem 0 0.5rem 0;
    text-align: center;
}
.recomBox ul li{
    margin-bottom: 1rem;
}
.recomBox ul li:before{
  width: 25px;
  height: 25px;
  margin-top: 3px; 
}
.recomBox ul li p{
    margin-left: 0.6rem;
    width: 90%;
}
.recomBox .imgBox{
    margin: 0 auto 1rem auto;
}
.ManuBox{
    margin-top: 1rem;
}
#servicesAll .ManuBox h3{
    font-size: 2rem;
    margin-bottom: 3rem;
}
.ManuBox h3::before{
    width: 4rem;
    bottom: -4.5rem;
}
.ManuBox ul{
    gap: 1rem 0;
}
.ManuBox ul li{
    width: calc(50% - 2rem);
}
.movieBox{
    margin-bottom: 3rem;
}
.movie{
    width: 100%;
}
.movie iframe{
    width: 100%;
    /*border: 1px solid #666;*/
}
.baBox{
    margin-bottom: 5rem;
}
.baBox .imgBox01{
    width: 70%;
    max-width: 350px;
    margin: 0 auto 3rem auto;
}
#air .baBox .imgBox01{
    width: 60%;
}
.baBox .imgBox02{
    width: 90%;
    max-width: 450px;
    margin: 0 auto;
}
#air .baBox .imgBox02{
    width: 75%;
}
.baBox .imgBox02 p{
    font-size: 2rem;
}
.baBox .imgBox01::before{
  left: 50%;
  transform: translateX(-50%);
  top: auto;
  bottom: -4rem;
  width: 35px;
  height: 25px;
  clip-path: polygon(0 0,100% 0, 50% 100%);
}
#Mechanical .baBox::after {
    background-color: #ccc;
    content: "";
    display: block;
    height: 2px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: 100%;
    bottom: -3rem;
}
a.bn_cases{
    width: 80%;
    margin: 3rem auto;
    padding: 5rem 0 7rem 0;
}
a.bn_cases:before {
    width: 15px;
    height: 15px;
    bottom: 4rem;
}
a.bn_cases .tit{
    font-size: 2rem;
    margin-bottom: 1rem;
}
a.bn_cases p{
    font-size: 1.5rem;
    line-height: 2.3rem;
}
.bn_cases{
    width: 80%;
    height: 230px;
    margin: 3rem auto;
    padding: 12rem 2rem 0 2rem;
}
.bn_cases p{
    margin-top: 0.5rem;
    line-height: 2.3rem;
}

#servicesAll span.cate{
    margin-right: 0;
}


/* ---------------------------------------------------------------------------
  高圧設備工事
--------------------------------------------------------------------------- */
#HighPressure .Box01{
    margin: 2.5rem auto;
}
#HighPressure .Box01::after{
    bottom: -2.5rem;
}
#HighPressure .Box01 h4{
    font-size: 2rem;
    line-height: 3rem;
}
#HighPressure .Box01 h4 span.sm{
    font-size: 1.3rem;
}
#HighPressure .Box02{
    margin-top: 5rem;
}
#HighPressure .Box02 a.to_detail04{
  height: 105px;
  margin: 2rem auto;
  padding: 1rem;
}
#HighPressure .Box02 a.to_detail04:before{
    width: 20px;
    height: 20px;
    right: 1.5rem;
    top: 50%;
}
#HighPressure .Box02 a .imgBox{
    width: 85px;
    margin-right: 1.5rem;
}
#HighPressure .Box02 a .txtBox{
    line-height: 2.2rem;
    padding-bottom: 0.5rem;
    flex: 1;
}
#HighPressure .Box02 a .txtBox span.tit{
    font-size: 1.8rem;
}
#HighPressure .Box02 a .txtBox span.sm{
    font-size: 1.3rem;
}
#HighPressure .Box03{
    margin-top: 4rem;
}
#HighPressure .Box05{
    padding: 2rem 0;
}
#HighPressure .Box05 ul.Box_in01{
    width: 220px;
    gap: 1rem;
    margin: 1.5rem auto 3rem auto;
}
#HighPressure .Box05 ul.Box_in01 li{
    width: 100%;
    max-width: 400px;
    padding: 0.3rem 0.3rem 0.5rem 0.3rem;
}
#HighPressure .Box05 ul.Box_in01 li p{
    font-size: 1.7rem;
    line-height: 2.2rem;
}

#HighPressure .Box05 ul.Box_in01 li p sup{
    font-size: 1.3rem;
}
#HighPressure .Box05 ul.Box_in02{
    margin-top: 3rem;
    gap: 2rem;
}
#HighPressure .Box05 ul.Box_in02 li p{
    margin-top: 0.2rem;
}

#HighPressure .Box05 .komeBox{
    margin-bottom: 3rem;
}
.kome{
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-top: 1rem;
    padding-left: 1em;
    text-indent: -1em;
}
#HighPressure .Box05 p.kome{
    margin-top: 2rem;
}
#HighPressure .Box05 p.kome span{
  padding-left: 1em;
  text-indent: -1em;  
}
#HighPressure .to_detailBox_top{
    width: 100%;
}

#HighPressure .Box07{
    padding: 1.5rem;
    margin: 3rem auto;
}
#HighPressure .Box07 .flex_wrap{
  align-items: center;
}
#HighPressure .Box07 .imgBox{
    width: 200px;
    margin-bottom: 2rem;
}
#HighPressure .Box07 .imgBox img{
    width: 200px;
    height: 200px;
}
#HighPressure .Box07 .txtBox .tit{
    font-size: 1.8rem;
    line-height: 2.5rem;
    margin-bottom: 1rem;
}
#HighPressure .Box07 p.kome{
    margin-top: 1rem;
    text-align: justify;
}

.serviceNewsBox_out{
    margin-bottom: 6rem;
}
.serviceNewsBox_out a.to_detail{
    width: 72%;
    max-width: 400px;
    margin: 0 auto;
    bottom: -2.5rem;
}
.serviceNewsBox{
    padding: 2rem 0 0 0;
}
.serviceNewsBox ul{
    gap: 2rem 0;
}
.serviceNewsBox ul li{
   width: 80%;
   margin: 0 auto; 
}
.serviceNewsBox ul li .imgBox{
    height: 150px;
}
.serviceNewsBox ul li .txtBox{
    padding: 0.6rem 1rem 1rem 1rem;
}
.serviceNewsBox ul li .txtBox .flex_wrap{
    gap: 0.5rem;
}
.serviceNewsBox ul li .dayBox{
    margin-bottom: 0.5rem;
    align-items: center;
}
.serviceNewsBox ul li .dayBox span.day{
    font-size: 1.4rem;
}
.serviceNewsBox ul li .dayBox span.cate{
    font-size: 1.2rem;
    line-height: 2rem;
    padding: 0 0.6rem;
    height: 21px;
}
.serviceNewsBox ul li p{
    line-height: 2.4rem;
}

.flex_img{
    width: 80%;
}
.flex_1{
    flex: auto;
}


/* ---------------------------------------------------------------------------
  弱電工事
--------------------------------------------------------------------------- */
.oneStopBox{
    padding: 2rem 0 2.5rem 0;
}
.oneStopBox ul{
    margin-top: 1.5rem;
    gap: 2rem;
}
.oneStopBox ul li{
    width: 65%;
    max-width: 400px;
    margin: 0 auto;
}
.oneStopBox ul li .imgBox{
    height: 200px;
}
.oneStopBox ul li .imgBox img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.oneStopBox ul li .tit{
    font-size: 1.7rem;
    line-height: 2rem;
    padding: 0.5rem 0 0.7rem 0;
}
.oneStopBox ul li p{
    margin-top: 0.4rem;
    line-height: 2.2rem;
}

/* ---------------------------------------------------------------------------
  照明・内装工事
--------------------------------------------------------------------------- */
#light_interior .Box02{
    padding: 3rem 0 2.5rem 0;
}
#light_interior .oneStopBox ul{
    gap: 2rem 0;
    margin-top: 0;
}
#light_interior .oneStopBox ul li{
    width: 80%;
    margin: 0 auto;
}
#light_interior .oneStopBox ul li .tit{
    font-size: 1.7rem;
    line-height: 2rem;
    padding: 0.7rem 0 0.9rem 0;
}


#light_interior .Box04 .c_table_02 table::before{
  left: 50%;
  transform: translateX(-50%);
  bottom: -3.2rem;
  width: 25px;
  height: 20px;
  clip-path: polygon(0 0,100% 0, 50% 100%);  
}
#light_interior .Box04 .Boxin{
    padding-bottom: 2rem;
    margin-top: 2rem;
}
#light_interior .Box04 h4{
    line-height: 2.3rem;
    margin-bottom: 1rem;
}
#light_interior .c_table_02{
    width: 100%;
}
.c_table_02 table tbody tr th{
    padding: 1px 3px 3px 3px;
    font-size: 1.5rem;
}
.c_table_02 table tbody tr td {
  padding: 5px 5px 5px 10px;
  font-size: 1.5rem;
  line-height: 2.2rem;
  margin-bottom: 0.3rem;
}
.c_table_02 table tbody tr td[data-th]:before{
    width: 100%;
}
#light_interior .Box04 .txtBox{
    width: 180px;
    height: 180px;
    font-size: 2rem;
    line-height: 2.8rem;
    padding-top: 4.5rem;
    margin: 4rem 0 1rem 0;
}
#light_interior .Box04 .kome{
  padding-left: 1em;
  text-indent: -1em;
  line-height: 2.2rem;
}
#light_interior .ManuBox{
    margin: 4rem auto;
}

#light_interior .to_detailBox_top,
#Mechanical .to_detailBox_top{
    width: 100%;
    bottom: -3rem;
    margin-bottom: 8rem;
}




/* ---------------------------------------------------------------------------
  機械電源工事
--------------------------------------------------------------------------- */
#Mechanical .Box02{
    padding: 1.5rem 1.5rem 5rem 1.5rem;
    margin: 2.5rem auto 8rem auto;
}
#Mechanical .Box02 .Boxin{
    padding-bottom: 2rem;
    margin-bottom: 2rem;
}
#Mechanical .Box02 .flex_wrap{
    margin: 0 0 3.5rem 0;
}
#Mechanical .Box02 .flex_wrap::before {
        bottom: -2.7rem;
        width: 25px;
        height: 18px;
}
#Mechanical .Box02 .imgBox{
    width: 60px;
    margin-right: 1rem;
}
#Mechanical .Box02 .txtBox{
    flex: 1;
    font-size: 1.6rem;
    padding: 0.5rem 1.5rem;
    height: 82px;
    line-height: 2.3rem;
    margin: 0.5rem 0 0 0;
}
#Mechanical .Box02 .txtBox::before {
        left: -1.5rem;
        top: 26%;
        transform: translateY(-50%);
        width: 35px;
        height: 25px;
}
#Mechanical .Box02 h4{
    line-height: 2.5rem;
    margin: 1rem 0 0.5rem 0;
    padding: 0.5rem;
}
#Mechanical a.to_detail05,
#air a.to_detail05{
    width: 85%;
    font-size: 1.8rem;
    bottom:-4rem;
}
#Mechanical .Box03 a.to_detail05 span.wrap,
#air .Box03 a.to_detail05 span.wrap{
    padding-right: 2rem;
}


/* ---------------------------------------------------------------------------
  空調設備工事
--------------------------------------------------------------------------- */
#air .Box02 .flex_wrap{
    margin-top: 1.3rem;
}
#air .Box03{
    padding: 1.5rem 1.5rem 4.5rem 1.5rem;
    margin-bottom: 8rem;
}
#air .Box03 h3{
    font-size: 2rem;
    line-height: 3rem;
    margin-bottom: 0.8rem;
}

/* ---------------------------------------------------------------------------
  消防設備工事
--------------------------------------------------------------------------- */
#fire .topBox .Boxin{
  padding: 0.5rem 1rem 0.7rem 1rem;
  margin: 1.5rem auto 0 0;
}
#fire .topBox .Boxin p{
    font-size: 1.5rem;
    line-height: 2.4rem;
}
#fire .topBox .Boxin p span{
    font-size: 1.5rem;
}
#fire .borBox{
    padding: 1.4rem;
    margin: 2.5rem auto;
}
#fire .Box02 .flex_wrap{
    margin: 0 0 3.5rem 0;
}
#fire .Box02 .flex_wrap::before {
        bottom: -2.7rem;
        width: 25px;
        height: 18px;
}
#fire .Box02 .imgBox{
    width: 60px;
    margin-right: 1rem;
}
#fire .Box02 .txtBox{
    flex: 1;
    font-size: 1.6rem;
    padding: 0.5rem 1.5rem;
    height: 60px;
    line-height: 2.3rem;
    margin: 0.5rem 0 0 0;
}
#fire .Box02 .txtBox::before {
        left: -1.5rem;
        top: 40%;
        transform: translateY(-50%);
        width: 35px;
        height: 25px;
}
#fire .Box02 h4{
    line-height: 2.5rem;
    margin: 1rem 0 0.5rem 0;
    padding: 0.5rem;
}

/* ---------------------------------------------------------------------------
  保守メンテナンス
--------------------------------------------------------------------------- */
#maintenance .borBox{
    padding: 3rem 1.5rem 2rem 1.5rem;
    margin: 6rem auto 2.5rem auto;
}
#maintenance .Box02 h3{
    margin-top: 0.3em;
}
#maintenance .Box02 .Boxin01{
    padding: 1.5rem;
    margin: 1.5rem 0 3.7rem 0;
}
#maintenance .Box02 .Boxin01::before {
        bottom: -2.7rem;
        width: 25px;
        height: 18px;
}
#maintenance .Box02 .Boxin01 h4{
    padding: 0.5rem 1rem 0.6rem 1rem;
    margin-bottom: 0.5rem;
}
#maintenance .Box02 .Boxin h4{
    line-height: 2.4rem;
}
#maintenance .Box02 .maru{
    width: 70px;
    height: 70px;
    top: -4.5rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.6rem;
    padding-top: 1.9rem;
}
#maintenance .Box02 .ul_wrap{
    padding: 0.5rem;
    margin: 0.8rem 0;
}
#maintenance .Box02 .Boxin ul li{
    font-size: 1.7rem;
    line-height: 2.2rem;
    padding-left: 1.5rem;
}
#maintenance .Box02 .Boxin ul li:not(:last-child) {
    margin-bottom: 0.5rem;
}
#maintenance .Box02 .flex_wrap{
    margin-top: 1.5rem;
    gap: 1rem;
}
#maintenance .Box02 .Boxin ul li.l2_sp::before{
    top: 25%;
}

/* ---------------------------------------------------------------------------
  助成金・補助金活用支援
--------------------------------------------------------------------------- */
#grant .Box01 h4 span.sm{
    font-size: 1.4rem;
    display: inline-block;
}
#grant .Box02{
    margin-top: 2.5rem;
}
#grant .Box02 .imgBox{
    margin-top: 1rem;
    margin-bottom: 1rem;
}
#grant .Box02 .txtBoxin01{
    text-align: center;
}
#grant .Box02 .txtBoxin01 p{
    text-align: left;
    display: inline-block;
    margin: 0.5rem 0 1rem 0;
    line-height: 2.5rem;
}
#grant .Box02 .txtBoxin02{
    width: 220px;
    height: 48px;
    line-height: 2.3rem;
    margin: 1rem auto 3rem auto;
    padding: 0.5rem 1rem 0 1rem;
}
#grant .Box02 .txtBoxin02::before{
    bottom: -24.8px;
    height: 25px;
    z-index: -1;
}
#grant .Box02 .txtBoxin02 span{
    font-size: 2.2rem;
}
#grant .Box02 .txtBox p.price span.big{
    font-size: 2rem;
    padding-bottom: 0.2rem;
}

#grant .Box03{
    padding: 2rem 1.5rem;
    margin-top: 2rem;
}
#grant .Box03 h3{
    line-height: 1.4rem;
    margin-bottom: 2.3rem;
}
#grant .Box03 h3 span.sm{
    font-size: 1.4rem;
    display: block;
}
#grant .Box03 .Boxin_out{
    margin: 1.5rem 0;
}
#grant .Box03 .Boxin .Mgb{
    margin-bottom: 0.5rem;
}
#grant .Box03 .Boxin .tit{
    font-size: 1.4rem;
    line-height: 2.2rem;
    height: 24px;
    padding: 0 1rem;
    margin: 0.4rem 1rem 0 0;
}
#grant .Box03 .Boxin .bold{
    font-size: 1.7rem;
}

#grant .Box03 .Boxin02{
    padding: 1.5rem 1.5rem 2rem 1.5rem;
}
#grant .Box03 .Boxin02 h4{
    padding-bottom: 0.5rem;
    margin-bottom: 0.8rem;
}
#grant .Box03 .Mgb02{
    margin-bottom: 1.5rem;
}

#grant .Box03 .Boxin03{
    margin-top: 1.5rem;
}
#grant .Box03 .Boxin03 .imgBox{
    width: 100%;
    margin: 1.5rem auto 1rem auto;
    text-align: center;
}
#grant .Box03 .Boxin03 .imgBox img{
    width: 80px;
    margin: 0 auto;
}

/* ---------------------------------------------------------------------------
  施工事例
--------------------------------------------------------------------------- */
#cases h3.toptxt{
    margin-bottom: 2rem;
}
#cases .tabs {
    margin: 2rem auto 0 auto;
    padding-bottom: 2rem;

}
.tab_item{
    width: calc(50% - 1.5rem);;
    height: 45px;
    line-height: 40px;
    text-align: center;
    display: inline-block;
}
.tab_labels {
  gap: 1.5rem;
  margin-bottom: 3rem;
  justify-content: space-between;
}
.tab_labels::after {
    display: block;
    content:"";
    width: 50%;
}

#cases .c_box_01 .sToggle dl dt{
    font-size: 1.8rem;
    padding: 5px 35px 5px 5px;
}
#cases .c_table_02 table tbody tr td{
    width: 100%;
    text-align: left;
    border-bottom: 1px solid #ccc;
    vertical-align: middle;
}
#cases .c_table_02 table tbody tr td[data-th]:before {
    width: 90px;
    display: inline-block;
    line-height: 2rem;
    margin-right: 1rem;
    font-family: "Noto Serif JP", serif;
}
#cases .c_table_02 table tbody tr td:nth-last-child(-n + 1) {
        border-bottom: 0;
}
#cases .c_table_02 table tbody tr td.l_02{
    display: flex;
    align-items: center; /* 垂直方向中央 */
    min-height: 50px;
}
.c_box_01 .sToggle dl dt::after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 9px solid var(--main-red);
}

.c_box_01 .sToggle dl dt.togg::after {
  border-bottom: 9px solid var(--main-red);
}
#cases .c_table_02 table tbody tr th{
    font-family: "Noto Serif JP", serif;
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 2.7rem;
}
#cases .c_table_02 table tbody tr:nth-child(even) {
  background-color: #fff;
}

.category-title-wrapper {
  margin: 5rem 0 0.7rem 0;
}
.category-title-wrapper h4{
    font-size: 1.8rem;
}


/* ---------------------------------------------------------------------------
  喜ばれるこんな対応 20選
--------------------------------------------------------------------------- */
#pleasant{
    margin-bottom: 5rem;
}
#pleasant .subTop h2{
    line-height: 2.8rem;
    padding-top: 2.8rem;
}
#pleasant .subTop h2 span{
    font-size: 1.8rem;
}
#pleasant .topBox h3{
    margin-bottom: 0.5rem;
}
#pleasant .borBox {
        padding: 2rem 1.5rem 2rem 1.5rem;
        margin: 3rem auto 0rem auto;
}
#pleasant .Box01 ul li .maru {
        width: 60px;
        height: 60px;
        top: -1.5rem;
        left: -1.5rem;
        font-size: 2.2rem;
        padding-top: 0.9rem;
}
#pleasant .Box01 ul li h4{
    font-size: 1.8rem;
    line-height: 2.5rem;
    margin: 1.2rem 0 0.7rem 0;
}
#pleasant .Box01 .flex_wrap{
    width: 90%;
    margin: 0 auto;
}

/* ---------------------------------------------------------------------------
  工事依頼の方へ：工事の前に
--------------------------------------------------------------------------- */
#considerationAll{
    margin-bottom: 5rem;
}
#considerationAll .Box01 h3{
    margin-bottom: 1.5rem;
}
#before .Box01 h3 span{
    display: block;
    margin-bottom: 1rem;
}
#before .Box02{
    margin-top: 5rem;
}
 #before .Box02 .num{
    font-size: 6rem;
    top: -3rem;
}
 #before .Box02 h4{
    font-size: 2rem;
    line-height: 2.7rem;
    padding-left: 8rem;
    margin-bottom: 1rem;
}
 #before .Box02 h4.adjust_sp{
    padding: 1.4rem 0 1.2rem 8rem;
 }
 #before .Box02 .Mgb{
    margin-bottom: 3rem;
    padding-bottom: 2rem;
}
 #before .Box02 .imgBox{
    margin-top: 1rem;
}

 #before .Box03{
    margin: 4rem auto;
    padding: 2rem 1.5rem;
}
 #before .Box03 h3{
    margin-bottom: 1rem;
 }
#before .Box03 ul li{
    padding: 1.3rem 1.5rem 2rem 1.5rem;
}
#before .Box03 ul li h4{
    font-size: 1.8rem;
    margin-bottom: 0.5rem;
    padding-left: 4.5rem;
}
#before .Box03 ul li h4 span.maru {
        width: 35px;
        height: 35px;
        top: -0.1rem;
        left: 0;
        font-size: 1.8rem;
        padding-top: 0.1rem;
}
#before .Box03 ul li:not(:last-child) {
    margin-bottom: 2.5rem;
}
#before .Box03 ul li:not(:last-child)::before {
        bottom: -2rem;
        width: 20px;
        height: 14px;
}

/* ---------------------------------------------------------------------------
  電建の見積書について
--------------------------------------------------------------------------- */
.threeBox{
    margin: 4rem auto;
}
.threeBox::before{
  top: -1.5rem;
}
.threeBox::after{
  bottom: -1.5rem;
}
.threeBox h4{
    font-size: 1.8rem;
}
.threeBox ul{
    margin-top: 0.5rem;
}
.threeBox ul li{
    padding-left: 1.7rem;
    font-size: 1.6rem;
    line-height: 2.3rem;
}
.threeBox ul li::before{
    top: 8px;
}
.threeBox ul li:not(:last-child) {
    margin-bottom: 0.7rem;
}

#estimate .Box03 ul li{
    gap: 0 3rem;
    align-items: center;
}
#estimate .Box03 ul li .imgBox{
    margin: 1rem auto;
}
#estimate .Box03 ul li .imgBox02 a{
    width: calc(50% - 0.5rem);
}
#estimate .borBox{
    padding: 1.5rem;
    margin: 2.5rem auto;
}
#estimate .Box03 h3{
    text-align: center;
    margin-bottom: 1rem;
}
#estimate .borBox h3{
    margin-bottom: 1rem;
}
#estimate .borBox h4{
    font-size: 1.8rem;
    line-height: 2.5rem;
    margin-bottom: 0.5rem;
}
#estimate .Box04 .imgBox{
    width: 85%;
    margin-bottom: 1rem;
}

/* ---------------------------------------------------------------------------
  10年間工事保証とは
--------------------------------------------------------------------------- */
#guarantee .Box03{
    padding-bottom: 2.5rem;
}
#guarantee .Box03 h3{
    margin-bottom: 1rem;
}
#guarantee .Box03 ul{
    margin-top: 2rem;
    gap: 2rem;
}
#guarantee .Box03 ul li{
    width: 85%;
    max-width: 400px;
    margin: 0 auto;
}
#guarantee .Box03 ul li h4{
    font-size: 1.7rem;
    line-height: 3rem;
    padding: 0rem 0.2rem 0.3rem 0.2rem;
}
#guarantee .Box03 ul li p{
    margin-top: 0.5rem;
}
#guarantee .Box04{
    margin-top: 2.5rem;
}
#guarantee .Box04 .Boxin{
    margin-bottom: 3rem;
}
#guarantee .Box04 .imgBox{
    width: 250px;
    margin: 0 auto 1.5rem auto;
}
#guarantee .Box04 h4{
    font-size: 1.8rem;
    margin-bottom: 0.2rem;
}
#guarantee .Box04 ul li{
  padding-left: 1.7em;
  text-indent: -0.8em;
}
#guarantee .Box04 span.num{
    display: inline-block;
    margin-right: 1rem;
}
#guarantee .Box04 .Boxin02{
    margin-bottom: 3rem;
}



/* ---------------------------------------------------------------------------
  お知らせ
--------------------------------------------------------------------------- */
#news,
#news-post{
    padding-bottom: 4rem;
}
.newsBox ul.newsBox_in{

}
.newsBox ul.newsBox_in li a{
    padding: 1.5rem 0.5rem;
}
.newsBox ul.newsBox_in li .imgBox {
  width: 80%;
  max-width: 400px;
  height: 200px;
  margin: 0 auto 1rem auto;
}
#news h3 {
  font-size: 1.8rem;
  line-height: 2.7rem;
  margin: 0.7rem 0 0.5rem 0;
}
span.day {
  font-size: 1.2rem;
  margin-right: 1rem;
}
span.cate {
  font-size: 1.2rem;
  padding: 0.25rem 0.5rem;
  line-height: 1.3;
  display: inline-block;
  margin-right: 0.5rem;
}

.category-group-title{
    font-size: 1.5rem;
  padding: 0rem 0.5rem 0.3rem 1rem;
}
.daycateBox{
    width: 100%;
}


#news-post h3 {
  font-size: 2rem;
  line-height: 3.3rem;
  margin: 0.7rem 0 1.5rem 0;
}
#news-post ul.pankuzu li:first-child a {
  width: 48px;
}
#news-post ul.pankuzu li:nth-child(2) a {
  width: 70px;
  margin-right: 10px;
  padding-right: 20px;
}
#news-post .imgBox {
  width: 80%;
  max-width: 400px;
  height: 200px;
  margin: 0 auto 1rem auto;
}
#news-post img{
    margin: 1.5rem 0;
    object-fit: contain;
    height: auto;
}
#news-post .imgBox img{
    margin: 0;
}

#news-post a.to_detail01 {
  margin-top: 3rem;
}
#news-cat .topBox p {
  margin: 0 0 1.5rem 0;
  font-size: 1.8rem;
}

#pager{
    margin: 3rem auto 0 auto;
}
#news-post .pager {
    width: 90%;
  margin: 2rem auto 4rem auto;
}

.sidebar {
  width: 100%;
  max-width: 400px;
  margin: 4rem auto 0 auto;
  padding: 0;
}

/* =======================================
    ★ページャー
========================================== */
.wp-pagenavi {
    clear: both;
    font-size: 14px;
    text-align: center;
}

.wp-pagenavi a,
.wp-pagenavi span {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 2.6;
    border: 1px solid #000000;
    -webkit-transition: ease-out 0.5s;
    transition: ease-out 0.5s;
    color: #000000;
    font-size: 14px;
    margin: 5px;
    vertical-align: top;
    padding: 0px;
    background-color: #fff;
    border-radius: 4px;
}

.wp-pagenavi span.extend {
    border: 1px solid rgba(245, 245, 245, 0);
}

.wp-pagenavi span.current {
    color: #fff;
    background-color: #000000;
    font-size: 14px;
    vertical-align: top;
    text-decoration: none;
}


/* 月別アーカイブリスト */
.monthly-archives {
  margin-top: 3rem;
  padding: 1.5rem 2rem;
}
.archive-months{
    gap: 1rem 0;
}
.archive-months a,
.archive-months span{
    font-size: 1.4rem;
}



/* ---------------------------------------------------------------------------
  お問い合わせ
--------------------------------------------------------------------------- */
#contact a.anchor:before {
    height: 300px; /* 調整したい高さ（固定ヘッダーの高さ） */
    margin-top: -300px; /* heightと同じ分のネガティブマージン */
}
#contact,#thanks,#privacy{
  margin-bottom: 6rem;
}

#contact{
  margin-bottom: 5rem;
}
#contact h3{
    font-size: 2rem;
    line-height: 3.2rem;
}
#contact .topBox{
    text-align: justify;
}
#contact .telWrap{
    margin: 2.5rem auto;
}
#contact .telWrap a{
    line-height: 4.5rem;
    margin-top: 0.2rem;
}
#contact .telWrap a img{
    width: 30px;
    object-fit: contain;
    margin: 0.6rem 0.3rem 0 0;
}
#contact .telWrap a span.number{
    font-size: 3.2rem;
}
#contact .telWrap span.txt_b{
    padding-left: 4rem;
}
#contact .borBox{
    padding: 1.5rem 1.5rem 2rem 1.5rem;
    margin: 3rem auto 4rem auto;
}
#contact .hearing h3{
    margin-bottom: 0.5rem;
}
#contact .hearing p{
    text-align: justify;
}
#contact .hearing a{
        width: 250px;
        height: 60px;
        margin: 1.5rem auto 0 auto;
}
#contact .hearing a span{
    font-size: 1.6rem;
    line-height: 2rem;
    padding: 0.7rem 0 0 4.5rem;
}
#contact .hearing a span:before{
    width: 25px;
    height: 25px;
    top: 55%;
    left: 1rem;
}

#contact .mailWrap h3{
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}
#contact p.kome{
    font-size: 1.3rem;
    margin-top: 0.5rem;
}
.hissu {
  margin-top: 0.5rem;
  height: 19px;
}

#contact table,
#contact table tbody,
#contact table tbody tr {
  display: block;
}

.privacy_wrap {
  margin: 2rem auto;
}
#contact .privacy_wrap p{
    font-size: 1.3rem;
}
#contact label.c_b {
  font-size: 1.4rem;
  gap: 1rem;
  display: block; /*警告の位置調整*/
  padding-left: 1.7em;
  text-indent: -1.7em;
}
form#mailformpro label {
  white-space: normal !important; /*警告の位置調整*/
}
div.mfp_err {
  text-indent: 0; /*警告のインデントなし*/
}

.submit_wrap{
    width: 270px;
    margin: 3rem auto 2rem auto;
}
.submit_wrap:before {
    right: 2rem;
    width: 8px;
    height: 10px;
}

#contact table.c-table_sp th{
    display: flex;
    align-items: center;
    border: 1px solid #f4f6f5;
        background: #f9ecee;
        vertical-align: top;
        padding: 12px 13px;
        color: #333;
        font-weight: 500;
        width: 100%;
        word-break: break-all;
}
#thanks .miniTextBox{
    width: 90%;
    margin: 0 auto;
    padding: 4rem 0 5rem 0;
}
#thanks .miniTextBox p{
    text-align: justify;
}
#error {
  margin-top: 10rem;
}


/* ---------------------------------------------------------------------------
  共通
--------------------------------------------------------------------------- */
.sec_h3_wrap{
    padding: 35px 0;
}
.sec_h3_wrap h3{
    top:3px;
}
.h3_left h3{
    left: 47%;
    transform: translateX(-37%);
}
.bgblue_wrap{
    padding: 2rem;
}
.bgblue02_wrap{
    padding: 3rem 2rem;
}
.spacer__02{
    display: none;
}
.spacer__03_2 {
  width: 100%;
}



/* ---------------------------------------------------------------------------
  ★タイトル
--------------------------------------------------------------------------- */

.tit02 {
    text-align: center;
    font-family: "Noto Serif JP", serif;
    margin: 0 auto 35px;
}

.tit02 b {
    font-size: 5rem;
    line-height: 1.5;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
}

.tit02 span {
    color: #8c8c8c;
    font-size: 3.6vw;
    display: block;
    line-height: 1;
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", cursive, sans-serif, serif;
}


/* ---------------------------------------------------------------------------
  ★グローバルナビゲーション
--------------------------------------------------------------------------- */

.nav_wrp {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 3;
    display: none;
}

.nav_wrp.changed {
    display: block;
}

.nav_site {
    top: 0;
    right: -100%;
    width: 100%;
    max-width: 240px;
    height: 100%;
    padding: 100px 30px 50px;
    position: fixed;
    opacity: 0;
    -webkit-transition: 0.7s;
    transition: 0.7s;
    -webkit-transition-timing-function: cubic-bezier(0.96, -0.01, 0.08, 1);
    transition-timing-function: cubic-bezier(0.96, -0.01, 0.08, 1);
    background: rgba(0, 0, 0, 0.8);
    overflow-y: auto;
    z-index: 1;
}

.nav_site.active {
    opacity: 1;
    top: 0;
    right: 0;
}



#contact .popup-inner {
    padding: 40px 20px;
}