.lNav ul li.index {
  background-image: url("/product-corp/img/Unit.jpg");
}
.lNav ul li.assy {
  background-image: url("/product-corp/img/Assy.jpg");
}
.lNav ul li.pro {
  background-image: url("/product-corp/img/Pro.jpg");
}
.lNav ul li.equ {
  background-image: url("/product-corp/img/mukyo.jpg");
}
.cont {
  box-sizing    : border-box;
  margin        : 0 auto;
  max-width     : 350px;
  padding       : 0px 0px 0px 0px;
  box-shadow: 0px 3px 20px #666666;
}
.cont a{
  display:flex;
  justify-content:center;
  align-items:center;
  border: 1px solid #012E59;
}
.cont:hover {
  box-shadow: none;
}
.custom, .tokusyu {
  box-sizing : border-box;
  margin: 0 auto;
  text-align: center;
}
.custom {
  max-width: 1300px;
}
.tokusyu {
  max-width: 600px;
}
.custom div,.tokusyu div {
  display: inline-block;
  vertical-align: top;
}
.custom img,.tokusyu img {
  width: 200px;
  margin: 5px 20px 0 20px;
}
@media screen and (max-width: 767px) {
.custom, .tokusyu {
width: 85%;
font-size: 1.7rem;
text-align: left;
}
.custom div ,.tokusyu div {
  display: flex;
  align-items: center;
}
.custom img,.tokusyu img {
  width: 100px;
  margin: 10px 20px 10px ;

}
}
.grayback {
  background-color: #f2f2f2;
}
.dairi {
  box-sizing : border-box;
  margin: 0 auto;
  max-width: 800px;
  text-align: center;
  line-height: 1.2;
  border-radius:15px;
  border: 3px solid #737373;
  padding-bottom: 20px;
}
.dairi div {
  display: inline-block;
  margin: 10px;
  vertical-align: middle;
}
.dairi img {
  margin: 5px 20px 20px 20px;
  box-sizing : border-box;
  vertical-align: middle;
}

/*  画面幅が767px以下の場合 */
@media screen and (max-width: 767px) {
  .dairi {
    margin: 0 40px;
    max-width: 100%; /* 幅を100%に設定 */
    padding: 10px;   /* paddingを調整 */
  }

  .dairi img {
    margin: 20px 10px 10px; /* 画像のマージンを少なく */
    max-width: 70%; /* 幅を70%に設定 */
  }

  .dairi div {
    display: block; /* divを縦に並べる */
  }
}


h6 {
  font-size: 1.2em;
}
h5 {
  font-size: 1.5em;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
h5 {
  font-size: 2rem;
}
}

.voiceArea .flow {
  max-width: 800px;
  margin: 0 auto;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .voiceArea .flow {
    padding: 15px 10px;
  }
}
.voiceArea h3 {
  text-align: center;
  padding-top: 50px;
}
dl {
  display: block;
  position: relative;
  margin: 0 0 30px;
}
@media screen and (max-width: 767px) {
  dl {
    margin-left: 0;
  }
}
dl::before {
  content: '';
  display: block;
  height: calc(100% + 30px);
  width: 1px;
  border-left: #06A1DF 5px dashed;
  position: absolute;
  top: 0;
  left: 50%;
}
dt {
  display: block;
  min-width: 300px;
  margin-bottom: 0;
  padding: 6px 40px;
  background: #06A1DF;
  color: #FFF;
  font-size: 2.6rem;
  border-radius: 1;
  white-space: normal;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 767px) {
   dt {
    padding: 8px 0 4px 20px;
    font-size: 2.2rem;
    line-height: 1.4;
  }
}
dt .fontEng {
  display: inline-block;
  min-width: 70px;
}
@media screen and (max-width: 767px) {
  dt .fontEng {
    min-width: 0;
  }
}
dd {
  display: flex;
  margin: 0 0 30px;
  border: #06A1DF 3px solid;
  background:  #F2FAFD;
  z-index: 1;
  position: relative;
  align-items: flex-start;
  flex-wrap: wrap;

}
@media screen and (max-width: 767px) {
  dd {
    width: 100%;
  }
}
dd.none {
  border: none;
  padding: 0;
}
dd:nth-last-of-type(1) {
  margin-bottom: 0;
}
.icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  padding: 20px;
  text-align: center;
  font-size: 5rem;
  color: #06A1DF;
}
@media screen and (max-width: 767px) {
  .icon {
    width: 100px;
    padding: 14px;
    font-size: 4rem;
  }
}
dd p {
  display: flex;
  align-items: center;
  padding: 10px 10px 10px 0;
  margin-bottom: 0;
  flex: 1;
  font-size: 1.8rem;
}
@media screen and (max-width: 767px) {
dd p {
    font-size: 1.6rem;
    line-height: 1.5;
  }
}
.fontandcenter {
  text-align: center;
}
.setsubi {
  display: flex;
  margin : 0 auto;
  width: 700px;
}
.setsubi img {
  width: 300px;
  padding: 10px 0 10px 0;
}
@media screen and (max-width: 767px) {
.setsubi {
  display: block;
  width: auto;
}
}
.setsubiimg {
  max-width: 200px;
  margin-right: 3rem;
}
@media screen and (max-width: 767px) {
  .setsubiimg {
  display: none;
}
}
.setsubitext {
  text-align: left;
  width: 500px;
}
@media screen and (max-width: 767px) {
.setsubitext {
  width: 350px;
  margin: 0 auto;
  }
}
.setsubitext img{
  display: none;
  }
@media screen and (max-width: 767px) {
.setsubitext img{
  display: block;
  width: 200px;
  margin: 0 auto;
}
}
.setsu {
  display: flex;
  margin : 0 auto;
  width: 700px;
}
@media screen and (max-width: 767px) {
.setsu {
  display: block;
  width: auto;
}
}
.setsuimg {
  max-width: 200px;
  margin-top:30px;
  font-size:1.2rem;
}
@media screen and (max-width: 767px) {
  .setsuimg {
    margin: 0 auto;
}
}
.setsutext {
  text-align: left;
  width: 500px;
}
@media screen and (max-width: 767px) {
.setsutext {
  width: 350px;
  margin: 0 auto;
  }
}
.hgroup.term {
  background-position: center;
  background-image: url("/product-corp/img/termtop.jpg");
  background-color: silver;
  background-size: cover;
}
.midasi {
margin:  0 auto;
box-sizing: border-box;
font-weight: bold;
color: #fff;
background-color:#222222;
border-radius:50px;
font-size: 30pt;
padding-left: 50px;
max-width: 800px;
}
@media screen and (max-width: 767px) {
  .midasi {
    font-size: 15pt;
    padding-left: 20px; /* 任意で調整 */
  }
}
.honbun {
  margin: 5px auto;
  box-sizing: border-box;
  font-size: 1.8rem;
  max-width: 800px;
  padding: 10px 20px 20px;
}
@media screen and (max-width: 767px) {
  .honbun {
    font-size: 1.4rem;
  }
}
.pointbox {
  padding: 20px;
  display: block;
  font-size: 1.6rem;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .pointbox {
    font-size: 1.2rem;
  }
}
.imgfl {
  text-align: center;
  font-size: 1.4rem;
  display: block;
  margin: 0 auto;
  }
  @media screen and (max-width: 767px) {
    .imgfl {
      font-size: 1.2rem;
    }
  }
.boxdre {
    position: relative;
    margin: 0 auto;
    padding: 20px;
    border: solid 3px #000;
    border-radius: 8px;
    max-width: 800px;
    display: flex;
    align-items: center;
}
.boxdre .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 15px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    font-weight: bold;
}
.boxdre img {
  width: 100px;
  margin-right: 30px;
}
.boxdre span {
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  .boxdre {
    display: block;
  }
  .boxdre .box-title {
       left: 50%;
       transform: translateX(-50%);
    }
  .boxdre img {
    margin: 0 auto;
    display: block;
  }
  .boxdre span {
    font-size: 1.2rem;
  }
}