@charset "UTF-8";
.p-comment {
  display: block;
  position: relative;
}
.p-comment__inner {
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-comment__inner {
    display: grid;
    grid-template-columns: 50% auto;
    grid-template-rows: auto auto 1fr;
    gap: 0 4.5%;
  }
}
.p-comment__cap {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  position: relative;
  margin-bottom: 1.5rem;
  padding: 0.4rem 0.6rem;
  font-size: min(1.7142857143vw, 2.7428571429rem);
  font-family: YakuHanMPs, "Shippori Mincho", "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ 明朝", "ＭＳ Ｐ明朝", "Noto Serif JP", serif;
  line-height: 1.2;
  color: var(--color-white);
  background-color: var(--color-black);
}
@media screen and (min-width: 961px) {
  .p-comment__cap {
    grid-column: 2/3;
    grid-row: 1/2;
  }
}
@media screen and (max-width: 960px) {
  .p-comment__cap {
    padding: 0.3rem 0.6rem;
    font-size: 1rem;
    margin-bottom: 0.5rem;
  }
}
.p-comment__title {
  display: block;
  position: relative;
  margin-bottom: 2.3rem;
  font-size: min(2.1428571429vw, 3.4285714286rem);
  font-family: YakuHanMPs, "Shippori Mincho", "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ 明朝", "ＭＳ Ｐ明朝", "Noto Serif JP", serif;
  letter-spacing: min(0.3214285714vw, 0.5142857143rem);
}
@media screen and (min-width: 961px) {
  .p-comment__title {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 960px) {
  .p-comment__title {
    font-size: 1.5rem;
    letter-spacing: 0.15rem;
  }
}
.p-comment__visual {
  width: 100%;
  display: block;
  position: relative;
}
@media screen and (min-width: 961px) {
  .p-comment__visual {
    grid-column: 1/2;
    grid-row: 1/4;
  }
}
@media screen and (max-width: 960px) {
  .p-comment__visual {
    margin-bottom: 2.4rem;
  }
}
.p-comment__text {
  display: block;
  position: relative;
  font-size: min(1.2857142857vw, 2.0571428571rem);
  line-height: 2.15;
}
@media screen and (max-width: 960px) {
  .p-comment__text {
    font-size: 1.2rem;
    line-height: 2;
  }
}
.p-comment__footer {
  display: block;
  position: relative;
  margin-top: 5rem;
}
@media screen and (max-width: 960px) {
  .p-comment__footer {
    margin-top: 4.5rem;
  }
}
.p-comment__btn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}