.lp-pc{
  display: block !important;
}
.lp-sp{
  display: none !important;
}
header, .p-head-products{
  display: none !important;
}
.p-block-editor-container{
  max-width: 100% !important;
  margin: 0% !important;
  padding: 0% !important;
}
.lp-header{
  display: block !important;
  width: 90%;
  margin: 20px 5%;
  padding-bottom: 20px;
  align-items: center;
  height: 100%;
  border-bottom: 1px solid #9a9b9c;
}
.lp-header < div{
  display: flex !important;
  flex-wrap: nowrap;
}
.lp-header > div > div > ul{  /* コンテンツをliで横並び  */
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 40px;
  font-weight: 500 !important;
  align-items: center;
  height: 100%;
}
.lp-header > div > div > ul > li::before{
  position: initial !important;
  padding-left: 0 !important;
}
.lp-tel{
  position: relative;
  text-align: center;
}
.lp-tel-icon{
  position: absolute;
  top: 5px;
  left: 0.5em;
}
.lp-area{
  max-width: 100%;
}
.lp-area > .lp-contents:nth-of-type(even){ /* 背景色口語 */
  background: #f2f5f7;
}
.lp-contents{
  padding: 3% 14%;
}
.lp-contents > div > p{
  text-align: center;
}
.lp-contents > div > img{
  display: block;
  margin: 0 auto 2% auto;
}
.lp-contents > div > h1{
  font-weight: bold !important;
  font-size: 1.6rem !important;
  text-align: center !important;
}
.lp-box,lp-header-box{ /* 3カラム */
  display: flex;
  flex-wrap: wrap;
}
.lp-box > div{
  margin: 1.0rem auto;
  width: 30%;
  border: 1px solid gray;
  border-radius: 8px;
  background-color: #FFF;
}
.lp-box img{
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
}
.lp-box2{
  margin-top: 3%;
}
.lp-box > div > ul, .lp-box2 > ul{  /* コンテンツをliで横並び  */
  display: flex;
  flex-wrap: wrap;
  padding: 0.6rem;
}
.lp-box > div > ul > li{
  width: 20%;
}
.lp-box > div > ul > li+li{
  width: 80%;
}
.lp-box > div > ul > li::before, .lp-box2 > ul > li::before, .lp-box3 > div > ul > li::before{
  position: initial !important;
  padding-left: 0 !important;
}
.lp-box > div > ul > li > h3, .lp-box2 > ul > li > h3{
  font-size: 1.2rem !important;
  font-weight: bold !important;
}
/*.lp-box2 > ul:nth-child(even){
  flex-direction: row-reverse;
} */
.lp-box2 > ul{
  width: 90%;
  margin: auto 5%;
  border-top: 1px solid lightgray;
}
.lp-box2 > ul:first-child{
  border-top: none;
}
.lp-box2 > ul > li{
  width: 40%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
}
.lp-box2 > ul > li+li{
  width: 60%;
}
.lp-box3{ /* 6カラム */
  display: flex;
}
.lp-box3 > div{
  flex: 1;
  justify-content: center;
}
.lp-box3 > div > ul{
  width: 100%;
  max-width: 180px;
  aspect-ratio: 1 / 1;
  text-align: center;
  border: 1px solid gray;
  border-radius: 50%;
  padding: 20px;
  background-color: #FFF;
}
.lp-box3 > div > ul > li{
  padding-left: 0 !important;
  font-weight: bold !important;
  align-items: flex-end;
  height: 50%;
}
.lp-box3 > div > ul > li > img{
  width: 60px;
}
.lp-button a { /* ボタン */
  background: #ec6608;
  border-radius: 50px;
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  max-width: 260px;
  padding: 15px 25px;
  color: #FFF;
  transition: 0.3s ease-in-out;
  font-weight: bold;
  text-decoration :none;
}
.lp-button a:hover {
  background: #313131;
  color: #FFF;
}
.lp-button a:after {
  content: '';
  width: 10px;
  height: 10px;
  border-top: 3px solid #FFF;
  border-right: 3px solid #FFF;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 50%;
  right: 20px;
  border-radius: 1px;
  transition: 0.3s ease-in-out;
}
.lp-button a:hover:after {
  border-color: #FFF;
}
.lp-heading {
  padding: 0.8rem 1.6rem;
  color: #fff !important;
  border-radius: 50px;
  background-color: #4887b1;
  font-size: 1.6rem !important;
  text-align: center;
  margin: 2%;
  font-weight: 700 !important;
}
.lp-header-box > ul{
  display: flex;
  flex-wrap: wrap;
}
.lp-header-box > ul > li::before,.lp-header-box > ul > li > ul > li::before{
  position: initial !important;
  padding-left: 0 !important;
}
.lp-header-box > ul > li{
  width: 30%;
  left: -16px;
}
.lp-header-box > ul > li+li{
  width: 70%;
  top: 0;
  bottom: 0;
  margin: auto;
  position: absolute;
  left: -16px;
}
.lp-header-box > ul > li > ul{
  display: flex;
  flex-wrap: wrap;
  font-size: 1.6rem !important;
  justify-content: flex-end;
  gap: 40px;
}
.lp-header-box > ul > li > ul > li > a{
  color: #4d4d4d;
  position: relative;
  display: inline-block;
  text-decoration: none;
  font-weight: bold;
}
.lp-header-box > ul > li > ul > li > a::after{
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #4d4d4d;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
.lp-header-box > ul > li > ul > li > a:hover::after{
  transform: scale(1, 1);
}
.img_1 > img{
  width: 40%;
}
@media screen and (max-width:768px) {  /* SP表示 */
  .lp-pc{
    display: none !important;
  }
  .lp-sp{
    display: block !important;
  }
  .lp-header{
    width: 98%;
    margin: 2%;
    padding-bottom: 10px;
  }
  .lp-tel-icon{
    left: 1.2em;
  }
  .lp-header-box > ul > li{
    width: 40%;
  }
  .lp-header-box > ul > li+li{
    width: 60%;
  }
  .lp-header-box > ul > li > ul{
    gap: 0px;
  }
  .lp-contents{
    padding: 3% 1%;
  }
  .lp-contents > div > p{
    text-align: left;
    margin: 0.6rem !important;
  }
  .lp-contents > div > h1{
    font-size: 1.2rem !important;
  }
  .lp-box,.lp-box2 > ul{ /* 3カラム⇒解除 */
    display: block;
  }
  .lp-box > div{
    width: 96%;
  }
  .lp-box > div > ul > li{
    width: 16%;
  }
  .lp-box > div > ul > li+li{
    width: 84%;
  }
  .lp-heading {
    font-size: 1.2rem !important;
    padding: 0.4rem 1.6rem;
  }
  .lp-box2 > ul{
    width: 100%;
    margin: 0;
  }
  .lp-box2 > ul > li{
    width: 100%;
  }
  .lp-box2 > ul > li+li{
    width: 100%;
  }
  .lp-box > div > ul > li > h3, .lp-box2 > ul > li > h3{
    font-size: 1.0rem !important;
    text-align: center;
  }
  .lp-box3{
    flex-wrap: wrap;
    gap: 10px;
  }
  .lp-box3 > div{
    flex: 0 0 30%;
  }
  .lp-box3 > div > ul{
    max-width: 120px;
    padding: 10px;
  }
  .lp-box3 > div > ul > li{
    font-size: 0.6rem !important;
  }
  .lp-box3 > div > ul > li > img{
    width: 40px;
  }
  .img_1 > img{
    width: 80%;
  }
}