@charset "UTF-8";

.lp_wrap .point {
  padding: 5% 0%;
  background-color: #ffe605;
}
.lp_wrap .point .slide {
  width: 300%;
  display: flex;
}
.lp_wrap .point .slide > li {
  width: 100%;
  position: relative;
}
.lp_wrap .point .slide > li > picture {
  display: block;
  width: 89.604%;
  margin: auto;
}
.lp_wrap .point .slide .slide1 .point_head,
.lp_wrap .point .slide .slide2 .point_head {
  position: absolute;
  padding: 1.2% 2.2%;
  top: 16%;
  left: 9.7%;
  font-size: 1.9vw;
  letter-spacing: 0.05em;
  background-color: #ffe605;
  border-radius: 100vw 100vw 20vw 100vw;
}
.lp_wrap .point .slide .slide1 .marker,
.lp_wrap .point .slide .slide2 .marker {
  position: absolute;
  top: 39%;
  left: 8%;
  width: 32.679%;
}
.lp_wrap .point .slide .slide1 .marker svg mask path,
.lp_wrap .point .slide .slide2 .marker svg mask path {
  fill: none;
  stroke: #ffffff;
  stroke-width: 10px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
  stroke-dasharray: 479 479;
  stroke-dashoffset: 479;
  transition: 0.8s;
}
.lp_wrap .point .slide .slide1.move .marker svg mask path,
.lp_wrap .point .slide .slide2.move .marker svg mask path {
  stroke-dashoffset: 0;
}
.lp_wrap .point .slide .slide1 h2,
.lp_wrap .point .slide .slide2 h2 {
  position: absolute;
  top: 35%;
  left: 10%;
  font-size: 2.5vw;
  letter-spacing: 0.1em;
}
.lp_wrap .point .slide .slide3 h2 span:nth-child(1) {
  position: absolute;
  top: 5.5%;
  left: 10%;
  width: 80%;
  text-align: center;
  font-size: 6.1vw;
  letter-spacing: 0.05em;
  color: #ffe605;
}
.lp_wrap .point .slide .slide3 h2 span:nth-child(2) {
  position: absolute;
  top: 16%;
  left: 10%;
  width: 80%;
  text-align: center;
  font-size: 2.5vw;
  letter-spacing: 0.1em;
}
.lp_wrap .point .slide .slide1 p,
.lp_wrap .point .slide .slide2 p {
  position: absolute;
  top: 49%;
  left: 10%;
  width: 35%;
  text-align: justify;
  font-size: 1.1vw;
  letter-spacing: 0.025em;
  line-height: 2.2em;
}
.lp_wrap .point .slide .slide1 p span,
.lp_wrap .point .slide .slide2 p span {
  font-size: inherit;
  background-color: #ffe605;
}
.lp_wrap .point .slide .slide3 p {
    position: absolute;
    top: 28%;
    left: 10%;
    width: 80%;
    text-align: center;
    font-size: 1.1vw;
    letter-spacing: 0.05em;
}
.lp_wrap .point .slide .slide3 p br {
  display: none;
}
.lp_wrap .point .slide .slide3 .balloon li {
  position: absolute;
  left: 45%;
  width: 28.742%;
  padding: 1.2% 0%;
  text-align: center;
  font-size: 1.9vw;
  letter-spacing: 0.05em;
  background-color: #ffe605;
  border-radius: 100vw 100vw 100vw 20vw;
  transform-origin: left bottom;
  transition: 0.8s;
  transform: scale(0);
  opacity: 0;
}
.lp_wrap .point .slide .slide3 .balloon li:nth-child(1) {
  top: 42%;
}
.lp_wrap .point .slide .slide3 .balloon li:nth-child(2) {
  top: 55%;
}
.lp_wrap .point .slide .slide3.move .balloon li {
  transform: scale(1);
  opacity: 1;
}
.lp_wrap .point .slide .slide3.move .balloon li br {
  display: none;
}
@media all and (max-width: 750px) {
  .lp_wrap .point {
    padding: 10% 0%;
  }
  .lp_wrap .point .slide {
    width: 100%;
    display: block;
  }
  .lp_wrap .point .slide > li > picture {
    width: 84%;
  }
  .lp_wrap .point .slide .slide1,
  .lp_wrap .point .slide .slide2 {
    margin-bottom: 10%;
  }
  .lp_wrap .point .slide .slide1 .point_head,
  .lp_wrap .point .slide .slide2 .point_head {
    padding: 2.6% 4.4%;
    top: 5.1%;
    left: 15.8%;
    font-size: 3.2vw;
  }
  .lp_wrap .point .slide .slide1 .marker,
  .lp_wrap .point .slide .slide2 .marker {
    top: 16%;
    left: 13%;
    width: 61.333%;
  }
  .lp_wrap .point .slide .slide1 .marker svg mask path,
  .lp_wrap .point .slide .slide2 .marker svg mask path {
    stroke-dasharray: 540 540;
    stroke-dashoffset: 540;
  }
  .lp_wrap .point .slide .slide1 h2,
  .lp_wrap .point .slide .slide2 h2 {
    top: 14%;
    left: 16.8%;
    font-size: 4.8vw;
  }
  .lp_wrap .point .slide .slide3 h2 span:nth-child(1) {
    top: 3.1%;
    font-size: 11vw;
  }
  .lp_wrap .point .slide .slide3 h2 span:nth-child(2) {
    top: 9.4%;
    font-size: 4.8vw;
    letter-spacing: 0.2em;
  }
  .lp_wrap .point .slide .slide1 p,
  .lp_wrap .point .slide .slide2 p {
    top: 21%;
    left: 17%;
    width: 66%;
    font-size: 3.2vw;
    line-height: 1.875em;
  }
  .lp_wrap .point .slide .slide3 p {
    top: 15.3%;
    font-size: 2.8vw;
    line-height: 1.714em;
  }
  .lp_wrap .point .slide .slide3 p br {
    display: block;
  }
  .lp_wrap .point .slide .slide3 .balloon li {
    width: 22.667%;
    aspect-ratio: 1 / 1;
    padding: 0%;
    display: grid;
    place-content: center;
    font-size: 3.2vw;
    line-height: 1.375em;
  }
  .lp_wrap .point .slide .slide3 .balloon li:nth-child(1) {
    top: 38%;
  }
  .lp_wrap .point .slide .slide3 .balloon li:nth-child(2) {
    top: 58%;
  }
  .lp_wrap .point .slide .slide3.move .balloon li br {
    display: block;
  }
}