.c-page-hd::before {
  background-image: url(../images/voice/txt_hd.png);
}

@media (width <= 768px) {
  .c-page-hd::before {
    animation: hd-sp calc(5 * 5s) linear infinite;
  }
}
@media (769px <= width) {
  .c-page-hd::before {
    animation: hd-pc calc(5 * 5s) linear infinite;
  }
}
@keyframes hd-sp {
  0% {
    background-position-x: 0;
  }
  100% {
    background-position-x: -158px;
  }
}
@keyframes hd-pc {
  0% {
    background-position-x: 0;
  }
  100% {
    background-position-x: -349px;
  }
}
/* =========================================================
voice
========================================================= */
/*------------------------------------------
list
------------------------------------------*/
@media (width <= 768px) {
  .voice-list {
    padding-top: 25px;
  }
}
@media (769px <= width) {
  .voice-list {
    padding-top: 60px;
  }
}
.voice-list__ttl {
  text-align: center;
}

.voice-list__ttl .en {
  color: #2187FF;
  font-family: "Lato", sans-serif;
  line-height: 1;
  font-weight: 500;
}

@media (width <= 768px) {
  .voice-list__ttl .en {
    font-size: 22px;
  }
}
@media (769px <= width) {
  .voice-list__ttl .en {
    font-size: 34px;
  }
}
.voice-list__ttl .ja {
  margin: 10px auto 0;
  line-height: 1;
  letter-spacing: 0.12em;
}

@media (width <= 768px) {
  .voice-list__ttl .ja {
    font-size: 11px;
  }
}
@media (769px <= width) {
  .voice-list__ttl .ja {
    font-size: 14px;
  }
}
@media (width <= 768px) {
  .voice-list .c-nav01 {
    margin: 30px auto 0;
  }
}
@media (769px <= width) {
  .voice-list .c-nav01 {
    margin: 40px auto 0;
  }
}
.voice-list .c-nav01__list {
  display: flex;
  justify-content: center;
  gap: clamp(1px, 2.13vw, 23px);
}

.voice-list .c-nav01__item {
  flex: 1;
  max-width: 288px;
}

.voice-list .c-nav01__item a {
  word-break: keep-all;
  overflow-wrap: anywhere;
  line-height: 1.4;
  text-align: center;
}

@media (width <= 768px) {
  .voice-list .c-col1-3 {
    margin: 35px auto 0;
  }
}
@media (769px <= width) {
  .voice-list .c-col1-3 {
    margin: 55px auto 0;
  }
}
@media (width <= 768px) {
  .voice-list .c-pager {
    margin: 30px auto 0;
  }
}
@media (769px <= width) {
  .voice-list .c-pager {
    margin: 60px auto 0;
  }
}
/* =========================================================
voice detail
========================================================= */
.voice-detail {
  position: relative;
  z-index: 1;
}

@media (width <= 768px) {
  .voice-detail {
    padding-top: 20px;
  }
}
@media (769px <= width <= 1024px) {
  .voice-detail {
    padding-top: 60px;
  }
}
@media (1025px <= width) {
  .voice-detail {
    margin: -115px auto 0;
  }
}
@media (1025px <= width) {
  .voice-detail__wrap {
    display: grid;
    grid-template-columns: 37.5% 1fr;
    grid-template-rows: max-content 1fr;
    gap: 30px 6.25%;
    grid-template-areas: "head image" "head body";
  }
}
@media (1025px <= width) {
  .voice-detail__img {
    grid-area: image;
  }
}
.voice-detail__img img {
  width: 100%;
}

@media (width <= 768px) {
  .voice-detail__head {
    margin: 15px auto 0;
  }
}
@media (769px <= width <= 1024px) {
  .voice-detail__head {
    margin: 30px auto 0;
  }
}
@media (1025px <= width) {
  .voice-detail__head {
    grid-area: head;
    height: -moz-max-content;
    height: max-content;
    padding: 180px 0 0;
    position: sticky;
    top: 0;
  }
}
.voice-detail__date {
  font-family: "Lato", sans-serif;
  color: #A2A2A2;
  line-height: 1;
  letter-spacing: 0;
}

@media (width <= 768px) {
  .voice-detail__date {
    font-size: 12px;
  }
}
@media (769px <= width) {
  .voice-detail__date {
    font-size: 14px;
  }
}
@media (width <= 768px) {
  .voice-detail__ttl {
    margin: 15px auto 0;
    font-size: 15px;
    line-height: 1.73;
  }
}
@media (769px <= width) {
  .voice-detail__ttl {
    margin: 20px auto 0;
    font-size: 26px;
    line-height: 1.92;
  }
}
.voice-detail__place {
  letter-spacing: 0.08em;
  line-height: 1.3;
}

@media (width <= 768px) {
  .voice-detail__place {
    margin: 20px auto 0;
    font-size: 13px;
  }
}
@media (769px <= width) {
  .voice-detail__place {
    margin: 30px auto 0;
    font-size: 16px;
  }
}
@media (width <= 768px) {
  .voice-detail__body {
    margin: 15px auto 0;
  }
}
@media (769px <= width <= 1024px) {
  .voice-detail__body {
    margin: 30px auto 0;
  }
}
@media (1025px <= width) {
  .voice-detail__body {
    grid-area: body;
  }
}
.voice-detail__list01 .bundle {
  display: flex;
  border-bottom: 1px solid #EDEDED;
  line-height: 1.4;
}

@media (width <= 768px) {
  .voice-detail__list01 .bundle {
    padding: 15px 0;
    font-size: 12px;
  }
}
@media (769px <= width) {
  .voice-detail__list01 .bundle {
    padding: 20px 0;
    font-size: 14px;
  }
}
.voice-detail__list01 dt {
  color: #797979;
  font-weight: 400;
}

@media (width <= 768px) {
  .voice-detail__list01 dt {
    width: 95px;
  }
}
@media (769px <= width) {
  .voice-detail__list01 dt {
    width: 115px;
  }
}
.voice-detail__list01 dd {
  flex: 1;
  position: relative;
}

@media (width <= 768px) {
  .voice-detail__list01 dd.manager {
    padding: 0 clamp(1px, 46.66vw, 175px) 0 0;
  }
}
@media (width <= 768px) {
  .voice-detail__list01 .arrow-link {
    font-size: clamp(1px, 3.2vw, 12px);
    position: absolute;
    top: 0;
    right: 0;
  }
}
.voice-detail__qa {
  background: url(../images/common/bg01.avif) no-repeat center/cover;
  counter-reset: number 0;
}

@media (width <= 768px) {
  .voice-detail__qa {
    width: calc(100vw - 5.55vw);
    margin: 30px -5.55vw 0 0;
    padding: 30px 40px;
  }
}
@media (769px <= width) {
  .voice-detail__qa {
    margin: 50px -8.35vw 0 0;
    padding: 50px 8.35vw 50px 5.27vw;
  }
}
.voice-detail__qa .box {
  counter-increment: number 1;
}

@media (width <= 768px) {
  .voice-detail__qa .box + .box {
    margin: 30px auto 0;
  }
}
@media (769px <= width) {
  .voice-detail__qa .box + .box {
    margin: 40px auto 0;
  }
}
.voice-detail__qa .q-txt {
  letter-spacing: 0.06em;
  font-weight: 500;
}

@media (width <= 768px) {
  .voice-detail__qa .q-txt {
    font-size: 14px;
    line-height: 1.71;
  }
}
@media (769px <= width) {
  .voice-detail__qa .q-txt {
    font-size: 18px;
    line-height: 1.88;
  }
}
.voice-detail__qa .q-txt::before {
  content: "Q" counter(number) ".";
  display: inline;
}

.voice-detail__qa .a-txt {
  letter-spacing: 0.06em;
}

@media (width <= 768px) {
  .voice-detail__qa .a-txt {
    margin: 20px auto 0;
    font-size: 13px;
    line-height: 1.84;
  }
}
@media (769px <= width) {
  .voice-detail__qa .a-txt {
    margin: 30px auto 0;
    font-size: 15px;
    line-height: 2;
  }
}
.voice-detail__comment {
  display: grid;
}

@media (width <= 768px) {
  .voice-detail__comment {
    margin: 30px auto 0;
    padding: 0 6.25%;
    grid-template-columns: 1fr 93px;
    grid-template-rows: repeat(2, max-content) 1fr;
    grid-template-areas: "head image" "manager image" "text text";
  }
}
@media (769px <= width) {
  .voice-detail__comment {
    margin: 50px auto 0;
    grid-template-columns: 184px 1fr;
    grid-template-rows: repeat(2, max-content) 1fr;
    grid-template-areas: "head head" "image manager" "image text";
    gap: 0 30px;
  }
}
@media (1025px <= width) {
  .voice-detail__comment {
    padding: 0 0 0 5.27vw;
  }
}
.voice-detail__comment .head {
  grid-area: head;
}

@media (769px <= width) {
  .voice-detail__comment .head {
    padding: 0 0 35px;
  }
}
.voice-detail__comment .head .en {
  font-family: "Lato", sans-serif;
  color: #2187FF;
  font-weight: 500;
  line-height: 1;
}

@media (width <= 768px) {
  .voice-detail__comment .head .en {
    font-size: clamp(1px, 4.8vw, 18px);
  }
}
@media (769px <= width) {
  .voice-detail__comment .head .en {
    font-size: 24px;
  }
}
.voice-detail__comment .head .ja {
  letter-spacing: 0.12em;
  line-height: 1;
}

@media (width <= 768px) {
  .voice-detail__comment .head .ja {
    margin: 5px auto 0;
    font-size: clamp(1px, 2.93vw, 11px);
  }
}
@media (769px <= width) {
  .voice-detail__comment .head .ja {
    margin: 10px auto 0;
    font-size: 12px;
  }
}
.voice-detail__comment .img {
  grid-area: image;
  width: 100%;
  aspect-ratio: 1/1;
}

.voice-detail__comment .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.voice-detail__comment .manager {
  letter-spacing: 0.12em;
  line-height: 1.2;
}

@media (width <= 768px) {
  .voice-detail__comment .manager {
    padding: 25px 0 0;
    font-size: 13px;
  }
}
@media (769px <= width) {
  .voice-detail__comment .manager {
    font-size: 15px;
  }
}
.voice-detail__comment .manager .strong {
  margin: 0 0.1em;
  font-size: 1.2em;
}

.voice-detail__comment .txt {
  grid-area: text;
}

@media (width <= 768px) {
  .voice-detail__comment .txt {
    padding: 15px 0 0;
    font-size: 13px;
    line-height: 1.84;
  }
}
@media (769px <= width) {
  .voice-detail__comment .txt {
    margin: 20px 0 0;
    font-size: 15px;
    line-height: 1.73;
  }
}
@media (width <= 768px) {
  .voice-detail .c-btn01 {
    width: 214px;
    margin: 40px auto 0;
  }
}
@media (769px <= width) {
  .voice-detail .c-btn01 {
    width: 275px;
    margin: 80px auto 0;
  }
}