.voicePage {
  line-height: 1.5;
  background-color: #ffffff;
  color: #464646;
  font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-weight: 500;
}
.voicePage img {
  display: block;
  max-width: 100%;
  height: auto;
}
.voicePage p {
  margin: 0;
}
.voicePage a:hover {
  opacity: 1;
}

.voiceSingle__hero.is-empty,
.c-voiceCard__img.is-empty {
  background-color: #ecf5ea;
}

.voiceKv {
  position: relative;
  display: flex;
  align-items: flex-start;
  height: clamp(180px, 25.2831594635px + 20.1192250373vw, 315px);
  overflow: hidden;
  border-radius: 0 0 clamp(60px, -20.2235469449px + 10.4321907601vw, 130px) clamp(60px, -20.2235469449px + 10.4321907601vw, 130px);
}

.voiceKv__bg {
  position: absolute;
  inset: 0;
  background-color: #4fca6a;
}
.voiceKv__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(92, 125, 163, 0.75);
  mix-blend-mode: multiply;
}

.voiceKv__title {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding-top: clamp(63px, -0.0327868852px + 8.1967213115vw, 118px);
  padding-left: clamp(20px, -68.2459016393px + 11.4754098361vw, 97px);
  color: #ffffff;
  font-size: clamp(30px, 1.348733234px + 3.7257824143vw, 55px);
  font-weight: 700;
  line-height: 1.45;
}

.voiceList {
  max-width: 1440px;
  margin: 0 auto;
  padding: clamp(60px, 32.4947839046px + 3.5767511177vw, 84px) clamp(15px, -59.4932935917px + 9.6870342772vw, 80px) clamp(80px, 34.1579731744px + 5.9612518629vw, 120px);
}

.voiceList__layout {
  display: flex;
  align-items: flex-start;
  gap: clamp(51px, 40.6855439642px + 1.3412816692vw, 60px);
}
@media screen and (max-width: 768px) {
  .voiceList__layout {
    flex-direction: column;
  }
}

.voiceList__main {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  gap: clamp(40px, 17.0789865872px + 2.9806259314vw, 60px);
  min-width: 0;
}

.voiceList__empty {
  width: 100%;
  color: #464646;
  font-size: 16px;
  text-align: center;
}

.voiceList__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  column-gap: clamp(16px, 6.8315946349px + 1.1922503726vw, 24px);
  row-gap: clamp(51px, 47.5618479881px + 0.4470938897vw, 54px);
}
@media screen and (max-width: 768px) {
  .voiceList__grid {
    grid-template-columns: 1fr;
  }
}

.voiceSingle {
  max-width: 1440px;
  margin: 0 auto;
  padding: clamp(60px, 32.4947839046px + 3.5767511177vw, 84px) clamp(15px, -151.1773472429px + 21.609538003vw, 160px) clamp(80px, 34.1579731744px + 5.9612518629vw, 120px);
}

.voiceSingle__article {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(36px, 29.1236959762px + 0.8941877794vw, 42px);
}

.voiceSingle__hero {
  width: 100%;
  max-width: 770px;
  height: clamp(243px, -73.3099850969px + 41.1326378539vw, 519px);
  margin: 0;
  overflow: hidden;
  border-radius: 25px;
}
.voiceSingle__hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.voiceSingle__content {
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 23.4157973174px + 0.5961251863vw, 32px);
  width: 100%;
}
@media screen and (max-width: 768px) {
  .voiceSingle__content {
    padding: 0 15px;
  }
}
.voiceSingle__content.--qa {
  gap: clamp(28px, 14.2473919523px + 1.7883755589vw, 40px);
}

.voiceQa {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.voiceQa__item {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.voiceQa__q {
  margin: 0;
  padding: 4px 20px;
  border-left: 6px solid #0ca06a;
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
}

.voiceQa__a {
  color: #000000;
  font-size: clamp(15px, 13.8539493294px + 0.1490312966vw, 16px);
  font-weight: 500;
  line-height: clamp(26.25px, 24.2444113264px + 0.260804769vw, 28px);
}
.voiceQa__a p {
  margin: 0;
}

.voiceSingle__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(14px, 11.7078986587px + 0.2980625931vw, 16px);
}

.voiceSingle__name {
  color: #000000;
  font-size: clamp(24px, 19.4157973174px + 0.5961251863vw, 28px);
  font-weight: 700;
  line-height: 1.45;
}
@media screen and (max-width: 768px) {
  .voiceSingle__name {
    color: #0ca06a;
  }
}

.voiceSingle__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(11px, 9.8539493294px + 0.1490312966vw, 12px) 24px;
  padding: clamp(20px, 15.4157973174px + 0.5961251863vw, 24px) clamp(15px, -4.4828614009px + 2.5335320417vw, 32px);
  background-color: #ecf7f7;
  border-radius: 12px;
}

.voiceSingle__spec {
  display: flex;
  align-items: center;
  gap: clamp(12px, 9.7078986587px + 0.2980625931vw, 14px);
}

.voiceSingle__specLabel,
.voiceSingle__specValue {
  margin: 0;
}

.voiceSingle__specLabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px 3px;
  border: 1px solid #0ca06a;
  border-radius: 44px;
  color: #0ca06a;
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
}

.voiceSingle__specValue {
  color: #000000;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  white-space: nowrap;
}

.voiceSingle__body {
  display: flex;
  flex-direction: column;
  gap: clamp(0px, -36.6736214605px + 4.7690014903vw, 32px);
  color: #000000;
  font-size: clamp(15px, 13.8539493294px + 0.1490312966vw, 16px);
  font-weight: 500;
  line-height: clamp(26.25px, 24.2444113264px + 0.260804769vw, 28px);
}
@media screen and (max-width: 768px) {
  .voiceSingle__body > * + * {
    margin-top: 1em;
  }
}

.voiceSingle__related {
  margin-top: clamp(60px, 55.4157973174px + 0.5961251863vw, 64px);
  padding: 50px clamp(0px, -68.7630402385px + 8.9418777943vw, 60px);
  background-color: #ebf5ea;
  border-radius: 29px;
}

.voiceSingle__relatedTitle {
  margin-bottom: 24px;
  color: #019c63;
  font-size: 20px;
  font-weight: 700;
  line-height: normal;
  text-align: center;
}

.voiceSingle__relatedList {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
@media screen and (max-width: 768px) {
  .voiceSingle__relatedList {
    display: flex;
    gap: 15px;
    padding: 0 15px 8px;
    overflow-x: auto;
  }
}

@media screen and (max-width: 768px) {
  .voiceSingle__relatedList .c-voiceCard {
    flex: 0 0 277px;
  }
}

.voiceSingle__back {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 264px;
  height: 51px;
  margin: clamp(60px, 55.4157973174px + 0.5961251863vw, 64px) auto 0;
  padding: 14px 52px;
  border-radius: 68px;
  background-color: #019c63;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
  transition: background-color 0.3s, color 0.3s;
}
.voiceSingle__back:hover {
  background-color: #ffffff;
  color: #019c63;
  outline: 1px solid #019c63;
}

.c-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.c-pager__item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(30px, 23.1236959762px + 0.8941877794vw, 36px);
  height: clamp(30px, 23.1236959762px + 0.8941877794vw, 36px);
  border: 1px solid #0ca06a;
  background-color: #ffffff;
  color: #0ca06a;
  font-family: "Noto Sans JP", "Hiragino Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  transition: background-color 0.3s, color 0.3s;
}
.c-pager__item:hover {
  background-color: #0ca06a;
  color: #ffffff;
}
.c-pager__item.is-current {
  border-color: transparent;
  background-color: #0ca06a;
  color: #ffffff;
}
.c-pager__item.is-current:hover {
  border-color: #0ca06a;
  background-color: #ffffff;
  color: #0ca06a;
}

.c-pager__ellipsis {
  color: #0ca06a;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 1;
}

.c-catNav {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 20px;
  width: clamp(180px, 116.9672131148px + 8.1967213115vw, 235px);
}
@media screen and (max-width: 768px) {
  .c-catNav {
    width: 100%;
  }
}

.c-catNav__label {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #0ca06a;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
}
.c-catNav__label::before {
  content: "";
  flex-shrink: 0;
  width: 15px;
  height: 14px;
  background: url("../img/common/icon-bubble-green.svg") center/contain no-repeat;
}

.c-catNav__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media screen and (max-width: 768px) {
  .c-catNav__list {
    flex-direction: row;
    gap: 8px;
    margin-right: -15px;
    padding-right: 15px;
    padding-bottom: 14px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .c-catNav__list::-webkit-scrollbar {
    display: none;
  }
  .c-catNav__list > li {
    flex-shrink: 0;
  }
}

.c-catNav__item {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 48px;
  padding: 10px 16px;
  border: 1px solid #0ca06a;
  border-radius: 5px;
  background-color: #ffffff;
  color: #0ca06a;
  font-size: clamp(16px, 13.7078986587px + 0.2980625931vw, 18px);
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
  transition: background-color 0.3s, color 0.3s;
}
@media screen and (max-width: 768px) {
  .c-catNav__item {
    width: max-content;
    height: auto;
    flex-shrink: 0;
    padding: 8px 14px;
  }
}
.c-catNav__item:hover {
  background-color: #0ca06a;
  color: #ffffff;
}
.c-catNav__item.is-current {
  background-color: #0ca06a;
  color: #ffffff;
}
.c-catNav__item.is-current::after {
  display: block;
  position: absolute;
  content: "";
  margin: auto;
  top: 16px;
  right: -10px;
  width: 0;
  height: 0;
  margin: 0;
  border-width: 7px 0 7px 10px;
  border-style: solid;
  border-color: transparent transparent transparent #0ca06a;
}
@media screen and (max-width: 768px) {
  .c-catNav__item.is-current::after {
    top: auto;
    right: auto;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 10px 7px 0;
    border-color: #0ca06a transparent transparent;
  }
}
.c-catNav__item.is-current:hover {
  background-color: #ffffff;
  color: #0ca06a;
}

.c-voiceCard__link {
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: #000000;
}
.c-voiceCard__link:hover .c-voiceCard__img img {
  transform: scale(1.06);
}
.c-voiceCard__link:hover .c-voiceCard__cat {
  text-decoration: none;
}

a.c-voiceCard__cat:hover {
  text-decoration: none;
}

.c-voiceCard__img {
  aspect-ratio: 259/180;
  margin: 0;
  overflow: hidden;
  border-radius: 25px;
}

.c-voiceCard__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.c-voiceCard__body {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
@media screen and (max-width: 768px) {
  .c-voiceCard__body {
    padding: 0 15px;
  }
}

.c-voiceCard__cat {
  display: inline-flex;
  align-items: flex-end;
  gap: 6px;
  color: #0ca06a;
  font-size: 14px;
  font-weight: 500;
  line-height: 14px;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.c-voiceCard__cat::before {
  content: "";
  flex-shrink: 0;
  width: 15px;
  height: 14px;
  background: url("../img/common/icon-bubble-green.svg") center/contain no-repeat;
}

.c-voiceCard__texts {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.c-voiceCard__name {
  font-size: clamp(18px, 15.7078986587px + 0.2980625931vw, 20px);
  font-weight: 700;
  line-height: 1.4;
}

.c-voiceCard__excerpt {
  display: -webkit-box;
  overflow: hidden;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}