@charset "UTF-8";
/*--------------------------------------------------
釣り方ページ
--------------------------------------------------*/
/* section-titleあしらい */
.section-title--beginner-technique,
.section-title--hookset,
.section-title--troubleshooting {
  position: relative;
}
.section-title--beginner-technique::before,
.section-title--hookset::before,
.section-title--troubleshooting::before {
  content: "";
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.section-title--beginner-technique::before {
  top: -18.6rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 18.4rem;
  aspect-ratio: 203/195;
  background-image: url(../images/howto/howto_decoration_01.svg);
}
@media screen and (min-width: 768px) {
  .section-title--beginner-technique::before {
    top: -19rem;
    left: -2rem;
    -webkit-transform: none;
    transform: none;
    width: 19rem;
  }
}
@media screen and (min-width: 1280px) {
  .section-title--beginner-technique::before {
    top: -20.9rem;
    left: -9.1rem;
    width: 30.6rem;
  }
}

.section-title--hookset::before {
  top: -12.2rem;
  right: 1.4rem;
  width: 10.5rem;
  aspect-ratio: 115/120;
  background-image: url(../images/howto/howto_decoration_02.svg);
}
@media screen and (min-width: 768px) {
  .section-title--hookset::before {
    top: -7.6rem;
    right: calc(50% - 36rem);
    width: 9.5rem;
  }
}
@media screen and (min-width: 1024px) {
  .section-title--hookset::before {
    top: -7.6rem;
    right: calc(50% - 41.4rem);
    width: 12rem;
  }
}

.section-title--troubleshooting::before {
  top: -9.6rem;
  right: -0.5rem;
  width: 11.7rem;
  aspect-ratio: 115/87;
  background-image: url(../images/howto/howto_decoration_03.svg);
}
@media screen and (min-width: 768px) {
  .section-title--troubleshooting::before {
    top: -5rem;
    right: calc(50% - 36rem);
    width: 12rem;
  }
}
@media screen and (min-width: 1024px) {
  .section-title--troubleshooting::before {
    top: -5.8rem;
    right: calc(50% - 39.6rem);
    width: 13.4rem;
  }
}

/* その他スタイル */
@media screen and (min-width: 768px) {
  .how-to-jigging {
    padding-bottom: 9.5rem;
  }
}

.section-lead--how-to-jigging {
  width: 90%;
  max-width: 1090px;
  margin-inline: auto;
}

.section-lead--jigging-actions {
  width: 90%;
  max-width: 1090px;
  margin-inline: auto;
}

.beginner-technique {
  margin-block: 11.6rem min(28%, 15rem);
  padding-bottom: 5.2rem;
  scroll-margin-top: -1.5rem;
}
@media screen and (min-width: 768px) {
  .beginner-technique {
    margin-block: 6.5rem 6.8rem;
    padding-block: 5.2rem 7rem;
    scroll-margin-top: 3.8rem;
  }
}

@media screen and (min-width: 768px) {
  .hookset {
    padding-top: 11.3rem;
  }
}

.section-lead--hookset {
  width: 90%;
  max-width: 1120px;
  margin-inline: auto;
  font-size: 1.5rem;
}
@media screen and (min-width: 768px) {
  .section-lead--hookset {
    font-size: 1.6rem;
    letter-spacing: 0.05em;
  }
}

.hookset__image {
  margin-top: 2rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .hookset__image {
    margin-top: 3rem;
  }
}
@media screen and (min-width: 768px) {
  .hookset__image img {
    width: 100%;
  }
}

.fight {
  padding-bottom: 7.8rem;
}
@media screen and (min-width: 768px) {
  .fight {
    padding-bottom: 9rem;
  }
}