/*-----------
sub-ttl
------------*/
.sub-ttl {
  background: url("../img/pc-hero.jpg") no-repeat center/cover;
}

@media screen and (max-width: 767px) {
  .sub-ttl {
    background: url("../img/sp-hero.jpg") no-repeat center/cover;
  }
}
/*-----------
contents
------------*/
.contents {
  margin: clamp(74.5px, 7.7604166667vw, 149px) 0 clamp(139px, 14.4791666667vw, 278px);
}

.contents h2 {
  font-weight: bold;
  color: #b2231a;
  font-size: clamp(10px, 1.0416666667vw, 20px);
  line-height: 1.8;
  letter-spacing: 0.1em;
}

.contents h2 span {
  display: block;
  color: #000000;
  font-size: clamp(9px, 0.9375vw, 18px);
}

.contents .inner {
  display: grid;
  grid-auto-flow: column;
  gap: 0 clamp(55px, 5.7291666667vw, 110px);
  margin-top: clamp(15px, 1.5625vw, 30px);
}

.contents .inner .txt p {
  font-size: clamp(8px, 0.8333333333vw, 16px);
  line-height: 1.875;
  letter-spacing: 0.1em;
}

.contents .inner .pic {
  display: grid;
  gap: clamp(12.5px, 1.3020833333vw, 25px) 0;
  max-width: clamp(221.5px, 23.0729166667vw, 443px);
  width: 100%;
}

@media screen and (max-width: 767px) {
  .contents {
    margin: clamp(39.5px, 10.5333333333vw, 79px) 0 clamp(110.5px, 29.4666666667vw, 221px);
  }
  .contents h2 {
    font-size: clamp(13px, 3.4666666667vw, 26px);
    line-height: 1.385;
  }
  .contents h2 span {
    font-size: clamp(11px, 2.9333333333vw, 22px);
  }
  .contents .inner {
    grid-auto-flow: row;
    gap: clamp(47.5px, 12.6666666667vw, 95px) 0;
    margin-top: clamp(22.5px, 6vw, 45px);
  }
  .contents .inner .txt p {
    font-size: clamp(12px, 3.2vw, 24px);
    line-height: 1.25;
  }
  .contents .inner .pic {
    gap: clamp(17.5px, 4.6666666667vw, 35px) 0;
    max-width: 100%;
    padding: 0 clamp(17.5px, 4.6666666667vw, 35px);
    box-sizing: border-box;
  }
  .main section [class$=-inn] {
    max-width: 100%;
    padding: 0 clamp(26px, 6.9333333333vw, 52px);
    box-sizing: border-box;
  }
}/*# sourceMappingURL=style.css.map */