/* ================================
  energy
  MB→PC min-width:768px
================================ */

/* -------------------------------- 
  エネルギー事業TOP
-------------------------------- */

/*上部アンカーリンク*/
#energy .imgNavBox {
overflow: hidden;
}
#energy .imgNavBox ul {
display: -webkit-flex;
display: flex;
align-items: center;
flex-wrap: wrap;
margin: 0 0 20px;
}
#energy .imgNavBox ul li {
display: -webkit-flex;
display: flex;
flex-shrink: 0;
width: 50%;
padding: 0;
height: 200px;
position: relative;
background: url("../img/energy/index_secimg_01.jpg") no-repeat center center;
background-size: cover;
}
#energy .imgNavBox ul li:nth-child(2) {
background-image: url("../img/energy/index_secimg_02.jpg");
}
#energy .imgNavBox ul li:nth-child(3) {
background-image: url("../img/energy/index_secimg_03.jpg");
}
#energy .imgNavBox ul li:nth-child(4) {
background-image: url("../img/energy/index_secimg_04.jpg");
}

#energy .imgNavBox ul li a {
position: relative;
display: block;
background-color: rgba(0,0,0,0.8);
border-radius: 6px;
color: #fff;
width: 70%;
height: 50%;
margin: auto;
}
#energy .imgNavBox ul li a::after {
position: absolute;
bottom: 20%;
left: 50%;
margin: auto;
content: "";
vertical-align: middle;
width: 8px;
height: 8px;
border-top: 2px solid #df7603;
border-right: 2px solid #df7603;
transform: translateX(-50%) rotate(135deg);
}
#energy .imgNavBox ul li .box {
position: absolute;
top: 42%;
left: 50%;
transform: translate(-50%, -42%);
text-align: center;
width: 80%;
margin: 0 auto;
}

@media screen and (min-width: 768px), print {
  #energy .imgNavBox ul {
  margin-bottom: 90px;
  }
  #energy .imgNavBox ul li {
  width: 25%;
  height: 320px;
  }
  #energy .imgNavBox ul li a {
  margin-top: 240px;
  width: 60%;
  height: 40%;
  }
  #energy .imgNavBox ul li .box {
  top: 30%;
  left: 50%;
  transform: translate(-50%, -30%);
  }
}

#energy .cateTopSup {
padding-top: 10px;
}

#energy .cateTopSup table {
border: 1px solid #333;
margin-top: 10px;
width: 100%;
}

#energy .cateTopSup th {
background-color: #f4e0ca;
padding: 14px 10px 10px;
text-align: left;
}
#energy .cateTopSup td {
padding: 14px 10px 0;
}

#energy .cateTopSup td ul {
padding-top: 0;
}

#energy .cateTopSup td p {
margin: 0 0 10px;
padding: 0;
line-height: 1.3;
}

#energyTop #sec04 {
margin-bottom: 30px;
}

#energyService .titBox {
position: relative;
padding-bottom: 70px;
}

#energyService .tit {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
background-color: rgba(223,118,3,0.9);
color: #fff;
width: 70%;
min-width: 250px;
margin: -10px auto 10px;
padding: 20px 10px;
font-size: 22px;
text-align: center;
}
#energyService .tit .fEng {
display: block;
padding-top: 5px;
font-size: 13px;
font-weight: normal;
}
#energyTop .pointget .sub , #energyTop .carwash .sub {
font-size: 18px;
}
#energyTop .pointget .sub {
color: #b53d7d;
}
#energyTop .carwash .sub {
color: #245b7f;
}
#energyTop .pointget , #energyTop .carwash {
margin-top: 20px;
}
#energyTop .pointget {
border: 1px solid #b53d7d;
}
#energyTop .pointget h3 , #energyTop .carwash h3 {
position: relative;
padding: 10px;
font-size: 20px;
color: #FFF;
}
#energyTop .pointget h3 {
background-color: #b53d7d;
}
#energyTop .carwash h3 {
background-color: #245b7f;
}
#energyTop .pointget h3 span:before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f52f";
font-size: 18px;
margin-left: -24px;
padding-right: 6px;
}
#energyTop .pointget h3:after {
position: absolute;
display: block;
content: "";
width: 0px;
height: 0px;
top: 100%;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #b53d7d;
}
#energyTop .pointget span , #energyTop .carwash span {
display: block;
padding-left: 24px;
}
#energyTop .pointget .txtBox , #energyTop .carwash .txtBox {
padding: 10px;
}
#energyTop .pointget .notesTxt {
padding-left: 1em;
text-indent: -1em;
font-size: 15px;
}
#energyTop .carwash {
border: 1px solid #245b7f;
}
#energyTop .carwash h3 span:before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f1b9";
margin-left: -24px;
padding-right: 6px;
font-size: 18px;
}
#energyTop .carwash h3:after {
position: absolute;
display: block;
content: "";
width: 0px;
height: 0px;
top: 100%;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #245b7f;
}


@media screen and (max-width: 767px) {
  #energy .cateTopSup th,
  #energy .cateTopSup td {
  display: block;
  width: 100%;
  }
}

@media screen and (min-width: 768px), print {

  #energy .cateTopSup.pcFlexSec table,
  #energy .cateTopSup.pcFlexSec .box {
  width: 48%;
  }

  #energy .cateTopSup.pcFlexSec .box table {
  width: 100%;
  }

  #energy .cateTopSup th {
  width: 24%;
  min-width: 100px;
  }
  
  /*調整*/
  #energy .infoBtnBox {
  padding-top: 40px;
  }
  #energy .infoBtnBox li {
  vertical-align: top;
  }
  #energy .infoBtnBox li:first-child a {
  padding: 0 30px;
  }

  #energyService .titBox {
  margin-bottom: 20px;
  }
  #energyService.titBox img {
  width: 840px;
  }
  #energyService .titBox::before {
  position: absolute;
  top: 20%;
  left: 20%;
  content: "";
  width: 100%;
  height: 72%;
  -webkit-transform: rotate(-1deg);
  -moz-transform: rotate(0deg);
  transform: rotate(0deg);
  background-color: rgba(223,118,3,0.2);;
  background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #fff), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #fff),color-stop(.75, #fff), color-stop(.75, transparent),to(transparent));
  -webkit-background-size: 14px 14px;
  z-index: -1;
  }
  #energyService .tit {
  width: 400px;
  padding: 40px 0;
  font-size: 30px;
  }
  #energyService .tit .fEng {
  font-size: 16px;
  }
  #energyTop .pointget .txtBox , #energyTop .carwash .txtBox {
  padding: 15px;
  }
  #energyTop .pointget h3 span:before {
  margin-left: -18px;
  }
  #energyTop .carwash h3 span:before {
  margin-left: -18px;
  }
}





/* お問合せ */
#mf .readTxt .line {
  display: inline-block;
  position: relative;
  margin: 0 auto;
  padding: 0 10px 15px;
  text-align: left;
}
#mf .readTxt .line:after {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 8px;
content: '';
background-image: -webkit-repeating-linear-gradient(135deg, #000, #000 1px, transparent 2px, transparent 5px);
background-image: repeating-linear-gradient(-45deg, #000, #000 1px, transparent 2px, transparent 5px);
background-size: 7px 7px;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

#mf .faxNo::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f1ac";
margin-top: -1px;
margin-right: 5px;
margin-left: 5px;
font-size: 18px;
}
@media screen and (min-width: 768px), print {
  #mf .faxNo::before {
  font-size: 20px;
  }
  #rntlService .tit {
  width: 400px;
  padding: 40px 0;
  font-size: 30px;
  }
}