.l-main .box-frame h3,
.l-main .box-collision h3,
.l-main .box-offset h3,
.l-main .box-protection h3 {
  text-align: center;
}
.l-main .box-frame figure,
.l-main .box-collision figure,
.l-main .box-offset figure,
.l-main .box-protection figure {
  text-align: center;
}
.l-main .box-frame .c-contentArea {
  padding-top: 0;
  padding-bottom: 0;
}
.l-main .box-frame figure {
  margin-top: 20px;
}
.l-main .box-collision .ui-popupWrap,
.l-main .box-offset .ui-popupWrap,
.l-main .box-protection .ui-popupWrap {
  margin-top: 1em;
}
.l-main .box-collision .ui-popupWrap .box-popup01 {
  top: 51.7%;
}
.l-main .box-collision .ui-popupWrap .box-popup01 .ui-title {
  top: 65px;
  width: 130px;
  margin-left: -18.5vw;
}
.l-main .box-collision .ui-popupWrap .box-popup01 .ui-title:after {
  top: -20px;
  transform: rotate(163deg) translateY(-5px);
}
.l-main .box-collision .ui-popupWrap .box-popup01 .ui-popupBtn {
  margin-left: -20.5vw;
}
.l-main .box-collision .ui-popupWrap .box-popup02 {
  top: 37%;
}
.l-main .box-collision .ui-popupWrap .box-popup02 .ui-title {
  top: 23px;
  width: 110px;
  margin-left: calc(-7vw - 55px);
}
.l-main .box-collision .ui-popupWrap .box-popup02 .ui-title:after {
  top: 30%;
  left: 100%;
  transform: rotate(-90deg) translateY(0px);
}
.l-main .box-collision .ui-popupWrap .box-popup02 .ui-popupBtn {
  margin-left: -7vw;
}
.l-main .box-collision .ui-popupWrap .box-popup03 {
  top: 58.1%;
}
.l-main .box-collision .ui-popupWrap .box-popup03 .ui-title {
  top: 34px;
  width: 90px;
  margin-left: calc(-2.2vw + 85px);
}
.l-main .box-collision .ui-popupWrap .box-popup03 .ui-title:after {
  top: 10%;
  left: -16px;
  transform: rotate(90deg) translateY(-5px);
}
.l-main .box-collision .ui-popupWrap .box-popup03 .ui-popupBtn {
  margin-left: -2.2vw;
}
.l-main .box-collision .ui-popupWrap .box-popup04 {
  top: 41.8%;
}
.l-main .box-collision .ui-popupWrap .box-popup04 .ui-title {
  top: -12px;
  margin-left: calc(8.6vw - 17px);
  white-space: nowrap;
}
.l-main .box-collision .ui-popupWrap .box-popup04 .ui-title:after {
  left: 73%;
  border-top-width: 30px;
}
.l-main .box-collision .ui-popupWrap .box-popup04 .ui-popupBtn {
  margin-left: 8.6vw;
}
.l-main .box-collision .ui-popupWrap .box-popup05 {
  top: 70.8%;
}
.l-main .box-collision .ui-popupWrap .box-popup05 .ui-title {
  margin-left: calc(3.6vw + 30px);
  margin-top: 65px;
  white-space: nowrap;
}
.l-main .box-collision .ui-popupWrap .box-popup05 .ui-title:after {
  top: -19px;
  left: 22%;
  transform: rotate(150deg) translateY(-5px);
}
.l-main .box-collision .ui-popupWrap .box-popup05 .ui-popupBtn {
  margin-left: 3.6vw;
}
.l-main .box-collision .ui-popupWrap .box-popup06 {
  top: 31.8%;
}
.l-main .box-collision .ui-popupWrap .box-popup06 .ui-title {
  top: 33px;
  margin-left: calc(16.6vw + 70px);
  white-space: nowrap;
}
.l-main .box-collision .ui-popupWrap .box-popup06 .ui-title:after {
  top: 10%;
  left: -16px;
  transform: rotate(90deg) translateY(-5px);
}
.l-main .box-collision .ui-popupWrap .box-popup06 .ui-popupBtn {
  margin-left: 16.6vw;
}
.l-main .box-offset .ui-popupWrap .box-popup01 {
  top: 62.7%;
}
.l-main .box-offset .ui-popupWrap .box-popup01 .ui-title {
  margin-left: calc(-16.5vw + 10px);
  width: 150px;
  margin-top: 65px;
}
.l-main .box-offset .ui-popupWrap .box-popup01 .ui-title:after {
  top: -20px;
  transform: rotate(-190deg) translateY(-5px);
}
.l-main .box-offset .ui-popupWrap .box-popup01 .ui-popupBtn {
  margin-left: -16.5vw;
}
.l-main .box-offset .ui-popupWrap .box-popup02 {
  top: 47%;
}
.l-main .box-offset .ui-popupWrap .box-popup02 .ui-title {
  margin-left: calc(8vw - 4px);
}
.l-main .box-offset .ui-popupWrap .box-popup02 .ui-popupBtn {
  margin-left: 8vw;
}
.l-main .box-offset .ui-popupWrap .box-popup03 {
  top: 63.1%;
}
.l-main .box-offset .ui-popupWrap .box-popup03 .ui-title {
  margin-left: calc(15.8vw + 50px);
  white-space: nowrap;
}
.l-main .box-offset .ui-popupWrap .box-popup03 .ui-title:after {
  left: 8%;
  transform: rotate(20deg) translateY(-5px);
}
.l-main .box-offset .ui-popupWrap .box-popup03 .ui-popupBtn {
  margin-left: 15.8vw;
}
.l-main .box-offset .ui-popupWrap .box-popup04 {
  top: 59.9%;
}
.l-main .box-offset .ui-popupWrap .box-popup04 .ui-title {
  margin-left: calc(31.9vw + 25px);
  margin-top: 65px;
  white-space: nowrap;
}
.l-main .box-offset .ui-popupWrap .box-popup04 .ui-title:after {
  top: -20px;
  left: 50%;
  transform: rotate(-190deg) translateY(-5px);
}
.l-main .box-offset .ui-popupWrap .box-popup04 .ui-popupBtn {
  margin-left: 31.9vw;
}
.l-main .box-protection .ui-popupWrap .box-popup01 {
  top: 48.7%;
}
.l-main .box-protection .ui-popupWrap .box-popup01 .ui-title {
  width: 130px;
  margin-left: calc(-16.5vw + 28px);
  margin-top: 65px;
}
.l-main .box-protection .ui-popupWrap .box-popup01 .ui-title:after {
  top: -20px;
  left: 50%;
  transform: rotate(-190deg) translateY(-5px);
}
.l-main .box-protection .ui-popupWrap .box-popup01 .ui-popupBtn {
  margin-left: -16.5vw;
}
.l-main .box-protection .ui-popupWrap .box-popup02 {
  top: 33.3%;
}
.l-main .box-protection .ui-popupWrap .box-popup02 .ui-title {
  margin-left: calc(-10vw - 20px);
}
.l-main .box-protection .ui-popupWrap .box-popup02 .ui-title:after {
  left: 75%;
}
.l-main .box-protection .ui-popupWrap .box-popup02 .ui-popupBtn {
  margin-left: -10vw;
}
.l-main .box-protection .ui-popupWrap .box-popup03 {
  top: 21%;
}
.l-main .box-protection .ui-popupWrap .box-popup03 .ui-title {
  margin-left: calc(-1.2vw + 125px);
  width: 145px;
  margin-top: 25px;
}
.l-main .box-protection .ui-popupWrap .box-popup03 .ui-title:after {
  top: 30%;
  left: -16px;
  transform: rotate(90deg) translateY(-5px);
}
.l-main .box-protection .ui-popupWrap .box-popup03 .ui-popupBtn {
  margin-left: -1.2vw;
}

@media screen and (min-width: 1px) and (max-width: 767px) {
  .l-main .box-frame h3,
  .l-main .box-collision h3,
  .l-main .box-offset h3,
  .l-main .box-protection h3 {
    font-size: 16px;
  }
  .l-main .c--pcpt40 {
    padding-top: 1em !important;
  }
}
@media all and (min-width: 768px) {
  .l-main .box-collision .ui-popupWrap,
  .l-main .box-offset .ui-popupWrap,
  .l-main .box-protection .ui-popupWrap {
    margin-top: 40px;
  }
  .l-main .box-collision .ui-popupWrap .box-popup01 .ui-title {
    top: 53.6%;
    width: 230px;
    margin-left: calc(-30.4% - -10px);
    margin-top: 80px;
  }
  .l-main .box-collision .ui-popupWrap .box-popup01 .ui-popupBtn {
    margin-left: -30.4%;
    top: 53.6%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup02 .ui-title {
    top: 42%;
    width: 170px;
    margin-left: calc(-13.9% - 87px);
  }
  .l-main .box-collision .ui-popupWrap .box-popup02 .ui-popupBtn {
    margin-left: -13.9%;
    top: 37%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup03 .ui-title {
    top: 66.5%;
    margin-left: calc(-9.4% + 115px);
    width: auto;
  }
  .l-main .box-collision .ui-popupWrap .box-popup03 .ui-popupBtn {
    margin-left: -9.4%;
    top: 59.2%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup04 .ui-title {
    top: 34.6%;
    margin-left: calc(3.7% - 16px);
  }
  .l-main .box-collision .ui-popupWrap .box-popup04 .ui-popupBtn {
    margin-left: 3.7%;
    top: 42.6%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup05 .ui-title {
    top: 70.7%;
    margin-left: calc(-1.4% + 50px);
    margin-top: 75px;
  }
  .l-main .box-collision .ui-popupWrap .box-popup05 .ui-popupBtn {
    margin-left: -1.4%;
    top: 70.7%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup06 .ui-title {
    top: 38.7%;
    margin-left: calc(13.3% + 90px);
  }
  .l-main .box-collision .ui-popupWrap .box-popup06 .ui-popupBtn {
    margin-left: 13.3%;
    top: 31.3%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup01 .ui-title {
    margin-left: calc(-24.6% + 20px);
    width: auto;
    margin-top: 46.8%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup01 .ui-popupBtn {
    margin-left: -24.6%;
    top: 64.8%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup02 .ui-title {
    width: auto;
    margin-left: calc(3% - 0px);
    margin-top: 0;
    top: 43.3%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup02 .ui-popupBtn {
    margin-left: 3%;
    top: 47.3%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup03 .ui-title {
    margin-left: calc(13% + 50px);
    white-space: nowrap;
    top: 61.6%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup03 .ui-title:after {
    left: 38%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup03 .ui-popupBtn {
    margin-left: 13%;
    top: 65.2%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup04 .ui-title {
    margin-left: calc(30.5% + 40px);
    margin-top: 80px;
    top: 61.3%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup04 .ui-popupBtn {
    margin-left: 30.5%;
    top: 62.1%;
  }
  .l-main .box-protection .ui-popupWrap .box-popup01 .ui-title {
    margin-left: calc(-23.3% + 55px);
    margin-top: 80px;
    top: 50.3%;
    width: auto;
  }
  .l-main .box-protection .ui-popupWrap .box-popup01 .ui-popupBtn {
    margin-left: -23.3%;
    top: 50.3%;
  }
  .l-main .box-protection .ui-popupWrap .box-popup02 .ui-title {
    width: auto;
    margin-left: calc(-18.4% - 25px);
    margin-top: -20px;
    top: 31.9%;
  }
  .l-main .box-protection .ui-popupWrap .box-popup02 .ui-popupBtn {
    margin-left: -18.4%;
    top: 31.9%;
  }
  .l-main .box-protection .ui-popupWrap .box-popup03 .ui-title {
    margin-left: calc(-7.3% + 230px);
    width: auto;
    margin-top: 20px;
    top: 22.5%;
  }
  .l-main .box-protection .ui-popupWrap .box-popup03 .ui-popupBtn {
    margin-left: -7.3%;
    top: 20.2%;
  }
}
@media all and (min-width: 1024px) {
  .l-main .box-collision .ui-popupWrap .box-popup02 .ui-title {
    top: 40.4%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup03 .ui-title {
    top: 64.5%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup04 .ui-title {
    top: 37.6%;
  }
  .l-main .box-collision .ui-popupWrap .box-popup06 .ui-title {
    top: 36.7%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup01 .ui-title {
    margin-top: 44.8%;
  }
  .l-main .box-offset .ui-popupWrap .box-popup03 .ui-title {
    top: 62.7%;
  }
}