/** 上書き **/
.article.page .entry-content,
.article,
.content {
  margin: 0 !important;
}
.sc_breadcrumb,
.go-to-top {
  display: none !important;
}
#content {
  font-feature-settings: "palt";
}
@media screen and (max-width: 768px) {
  .offer .mt-6,
  .voice .mt-6 {
    margin-top: 3rem !important;
  }
}

/** 共通アイテム **/
.bold-blue {
  color: #2c5c9a;
}
span.title_main {
  background: #e94709;
  color: #fff;
  margin: 0 4px;
  padding: 4px 8px;
}
span.title_sub {
  background: #2c5c9a;
  color: #fff;
  margin: 0 4px;
  padding: 4px 8px;
}

/** CVボタン **/
.cv-btn a {
  font-size: 20px;
  padding: 20px 60px 20px 100px;
  position: relative;
}
.cv-btn a::before {
  background: center/contain no-repeat url("../images/career-lp_free.png");
  content: "";
  height: 60px;
  left: 4px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
}
.cv-btn a.btn::after {
  /* a.btn で Cocoon の .btn:hover::after（矢印が右へ動く）より優先度を上げ、ホバーで動かないようにする */
  background: center/contain no-repeat url("../images/hero/arrow-l.svg");
  content: "";
  height: 21px;
  margin: 0;
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  width: 11px;
}
/* 折り返す場合は「30秒でキャリア相談に／申し込む」の位置でのみ改行させる */
.cv-btn-line {
  display: inline-block;
}
.cv-btn a:hover {
  background: #ca3a02 !important;
  opacity: 1;
  text-decoration: none;
}

.cv-fix {
  bottom: 0;
  left: 0;
  padding: 20px !important;
  position: fixed;
  transition:
    transform 0.6s ease,
    opacity 0.6s ease;
  z-index: 9999;
}
.cv-fix.hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateY(100%);
}
/* 初期表示は HTML 側で hidden にしておき、JS が初期状態を確定するまではアニメーションさせない（読み込み時のチラ見え防止） */
.cv-fix:not(.cv-fix--ready) {
  transition: none;
}
@media screen and (max-width: 992px) {
  .cv-fix {
    padding: 15px !important;
  }
  .cv-btn a {
    font-size: 18px;
    padding: 15px 36px 15px 64px;
  }
  .cv-btn a::before {
    height: 48px;
    width: 48px;
  }
  .cv-btn a.btn::after {
    background-image: url("../images/hero/arrow-s.svg");
    height: 11px;
    right: 18px;
    width: 6px;
  }
}

/** CVエリア **/
.cv .box-background {
  padding: 40px !important;
}
.cv .wp-block-column:nth-of-type(2) {
  border-left: 1px solid #ddd;
  padding: 0 24px;
  box-sizing: border-box;
}
.cv h2 {
  margin-bottom: 30px;
}
.cv span.title {
  background: #fff;
  color: #2c5c9a;
  margin: 0 4px;
  padding: 4px 8px;
}
.cv .check-list {
  display: inline-block;
}
.cv h4 {
  margin-bottom: 10px;
}
.cv .check-list li {
  margin-top: 8px;
  position: relative;
}
.cv .check-list li::before {
  background: center/contain no-repeat url("../images/career-lp_check.png");
  content: "";
  height: 20px;
  left: -25px;
  position: absolute;
  top: 4px;
  width: 20px;
}
.cv .img1 {
  left: 64px;
  position: absolute;
  top: -138px;
  width: 200px;
}
.cv .img2 {
  position: absolute;
  right: 64px;
  top: -138px;
  width: 200px;
}
@media screen and (max-width: 992px) {
  .cv .img1 {
    left: 30px;
    top: -100px;
    width: 150px;
  }
  .cv .img2 {
    right: 30px;
    top: -100px;
    width: 150px;
  }
  .cv .box-background {
    padding: 20px !important;
  }
}
@media screen and (max-width: 992px) {
  .cv .check-list {
    margin: 0;
    padding-left: 20px;
  }
}
@media screen and (max-width: 768px) {
  .cv .check-list {
    margin-bottom: 10px;
  }
  .cv .wp-block-column:nth-of-type(2) {
    border-left: none;
    padding: 0;
  }
}

/** 悩みエリア **/
.nayami .h2_nayami {
  margin-bottom: 10px !important;
}
.nayami .nayami-list {
  border-radius: 8px;
  height: 100%;
  padding: 30px !important;
}
.nayami .nayami-list ul {
  padding: 0;
}
.nayami .nayami-list li {
  list-style: none;
  padding-left: 35px;
  position: relative;
}
.nayami .nayami-list li + li {
  border-top: 1px solid #ccc;
  margin-top: 15px;
  padding-top: 15px;
}
.nayami .nayami-list li::before {
  background: center/contain no-repeat url("../images/career-lp_moyamoya.png");
  content: "";
  height: 26px;
  left: 0;
  position: absolute;
  top: 0;
  width: 24px;
}
.nayami .nayami-list li + li::before {
  top: 15px;
}

.nayami .other-item-wrap {
  display: flex;
  flex-direction: column;
}
.nayami .other-item {
  gap: 0;
  margin: 0 !important;
  position: relative;
}
.nayami .other-item::before {
  background: center/contain no-repeat url("../images/career-lp_guruguru.png");
  content: "";
  height: 60px;
  position: absolute;
  right: 0;
  top: 0;
  width: 60px;
}

/** 解決エリア **/
.kaiketsu .title_main {
  font-size: 4rem;
}
.kaiketsu .point-wrap {
  justify-content: center;
}
.kaiketsu .point {
  max-width: calc(calc(100% - 12rem) / 3);
}
@media screen and (max-width: 768px) {
  .kaiketsu .title_main {
    font-size: 2.8rem;
  }
  .kaiketsu .point {
    max-width: 100%;
  }
}

/** 求人例エリア **/
.offer {
  background: top right/cover no-repeat url("../images/career-lp_offer.jpg");
}
.offer .offer-item {
  padding: 0 30px 30px 30px;
}
.offer .offer-item h5 {
  margin-bottom: 2rem;
  white-space: nowrap;
}
.offer .offer-item .term-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-bottom: 2rem;
}
.offer .offer-item .term-label {
  background: #fdede6;
  border-radius: 25px;
  color: #e94709;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 0 !important;
  padding: 2px 15px;
  flex: 0 0 auto;
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.5;
  text-align: center;
}
@media screen and (max-width: 992px) {
  .offer .offer-item .term-wrap {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }
  .offer .offer-item h5 {
    margin-bottom: 2rem;
    white-space: normal;
  }
}
@media screen and (max-width: 768px) {
  .offer .offer-item .term-wrap {
    flex-direction: row;
    gap: 10px;
  }
  .offer {
    background: top right/contain no-repeat
      url("../images/career-lp_offer_sp.jpg");
  }
}

/** 利用者の声エリア **/
.voice > span {
  background: repeating-linear-gradient(
    -45deg,
    #def8ff 0,
    #def8ff 10px,
    #d8f7ff 10px,
    #d8f7ff 15px
  );
}
.voice .voice-item {
  box-shadow: 0 0 24px rgba(120, 200, 230, 0.3);
  padding: 30px !important;
}
.voice .voice-item .column-wrap {
  gap: 30px !important;
}
.voice .voice-item .column-wrap h4 {
  margin-bottom: 15px !important;
}
.voice .voice-item .column-wrap h4 + p {
  margin-bottom: 15px !important;
}

/** QAエリア **/
.qa .qa-item {
  padding: 15px;
}
.qa .qa-item .qa-contents {
  gap: 15px;
  margin-bottom: 15px;
}
.qa .qa-item hr {
  margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
  .qa .qa-item {
    padding: 10px;
  }
  .qa .qa-item .qa-contents {
    gap: 10px;
    margin-bottom: 10px;
  }
  .qa .qa-item hr {
    margin-bottom: 10px;
  }
}

/* ---- キャリアアドバイザー紹介 タグ ---- */
.tag-area {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 6px;
  margin-top: 8px;
}
.tag-area .tag {
  display: inline-block;
  padding: 4px 12px;
  background: #f2f7fc;
  color: #1f4e78;
  border-radius: 16px;
  font-size: 12px;
  line-height: 1.5;
}

/* ---- 共通ヘッダー（Figma: PC 1-205 / SP 2-1442） ---- */
.site-header {
  background: #fff;
  border-bottom: 13px solid #e94709;
}
.site-header__inner {
  display: flex;
  align-items: center;
  padding: 16px 0 11px 15px; /* Figma の下余白 24px は 13px の境界線込み */
}
.site-header__brand {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 58px; /* CTA の高さ。CTA の無いページでもヘッダーの高さを揃える */
  gap: 4px;
  padding: 0 8px 0 0; /* 左は .site-header__inner の 15px に揃える */
}
.site-header__tagline {
  margin: 0;
  color: #333;
  font-size: 11px;
  font-weight: 400;
  line-height: 19.25px;
  white-space: nowrap;
}
.site-header__logo {
  display: block;
  line-height: 0;
}
.site-header__logo img {
  width: 305px;
  height: auto;
  display: block;
}
.site-header__cta {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 8px;
  padding: 4px 30px 4px 4px;
  border: 1px solid #e94709;
  border-radius: 200px;
  background: #e94709;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  line-height: 27px;
  text-decoration: none;
  white-space: nowrap;
}
.site-header__cta:hover {
  background: #ca3a02;
  border-color: #ca3a02;
  color: #fff;
  text-decoration: none;
}
.site-header__cta-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #fff;
  color: #e94709;
  line-height: 1.1;
}
.site-header__cta-badge-top {
  font-size: 9.6px;
}
.site-header__cta-badge-bottom {
  font-size: 16px;
}
.site-header__cta-arrow {
  display: block;
}
@media (max-width: 768px) {
  .site-header {
    border-bottom-width: 6px;
  }
  .site-header__inner {
    padding: 8px 8px 9px; /* Figma の下余白 15px は 6px の境界線込み */
  }
  .site-header__brand {
    min-height: 32px; /* SP の CTA の高さ */
    gap: 0;
    padding: 0;
  }
  .site-header__tagline {
    margin-bottom: 4px;
    font-size: 8px;
    line-height: 10px;
    white-space: normal; /* 320px など幅が足りないときは「│」の後ろで折り返す（span 単位で改行） */
  }
  .site-header__tagline span {
    display: inline-block;
  }
  .site-header__logo img {
    width: 150px;
  }
  .site-header__cta {
    gap: 4px;
    margin: 0 0 0 8px;
    padding: 2px 10px 2px 2px;
    font-size: 12px;
    line-height: 18px;
  }
  .site-header__cta-badge {
    width: 26px;
    height: 26px;
  }
  .site-header__cta-badge-top,
  .site-header__cta-badge-bottom {
    font-size: 8px;
  }
}

/* ---- お知らせ（Figma: PC 19-18 / SP 19-212） ---- */
.site-notice {
  display: flex;
  justify-content: center;
  padding: 16px 15px;
  background: #f6f7f8;
}
.site-notice__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #333;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  text-decoration: none;
}
.site-notice__link:hover {
  color: #333;
  text-decoration: underline;
}
.site-notice__icon {
  flex: none;
  display: block;
}
.site-notice__text {
  position: relative;
  top: 0.5px; /* PC の 14px はヒラギノの字面が上寄りに見えるので、アイコンと中央を揃える */
}
@media (max-width: 768px) {
  .site-notice {
    padding: 8px 11px;
  }
  .site-notice__link {
    align-items: flex-start; /* SP は本文が複数行になるので、アイコンを 1 行目に揃える */
    font-size: 13px;
    line-height: 19.5px;
  }
  .site-notice__icon {
    position: relative;
    top: -2px; /* 24px のアイコンを 19.5px の 1 行目と中央で揃える */
  }
  .site-notice__text {
    top: 0;
  }
}

/* ---- 求人例・利用者の声：資格タブで絞り込み（汎用LP完成イメージと同じ仕組み） ---- */
.jtr {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}
.jtabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-bottom: 24px;
}
.jtabs .jtl {
  cursor: pointer;
  padding: 8px 18px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #c9d8ef;
  color: #0d2d56;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}
#jt-pick:checked ~ .jtabs .jtl-pick,
#jt-boki:checked ~ .jtabs .jtl-boki,
#jt-zeirishi:checked ~ .jtabs .jtl-zeirishi,
#jt-sharoshi:checked ~ .jtabs .jtl-sharoshi,
#jt-shindanshi:checked ~ .jtabs .jtl-shindanshi,
#jt-takken:checked ~ .jtabs .jtl-takken,
#jt-fp:checked ~ .jtabs .jtl-fp,
#jt-it:checked ~ .jtabs .jtl-it,
#vt-all:checked ~ .jtabs .vtl-all,
#vt-boki:checked ~ .jtabs .vtl-boki,
#vt-zeirishi:checked ~ .jtabs .vtl-zeirishi {
  background: #0d2d56;
  color: #ffffff;
  border-color: #0d2d56;
}
#jt-pick:checked ~ .jgrid .jobcard:not(.jpick),
#jt-boki:checked ~ .jgrid .jobcard:not(.jq-boki),
#jt-zeirishi:checked ~ .jgrid .jobcard:not(.jq-zeirishi),
#jt-sharoshi:checked ~ .jgrid .jobcard:not(.jq-sharoshi),
#jt-shindanshi:checked ~ .jgrid .jobcard:not(.jq-shindanshi),
#jt-takken:checked ~ .jgrid .jobcard:not(.jq-takken),
#jt-fp:checked ~ .jgrid .jobcard:not(.jq-fp),
#jt-it:checked ~ .jgrid .jobcard:not(.jq-it),
#vt-boki:checked ~ .vgrid .voicecard:not(.vq-boki),
#vt-zeirishi:checked ~ .vgrid .voicecard:not(.vq-zeirishi) {
  display: none;
}
@media (max-width: 640px) {
  .jtabs {
    gap: 8px 6px;
  }
  .jtabs .jtl {
    white-space: nowrap;
    padding: 7px 14px;
    font-size: 13px;
  }
}

/* 求人カード（帯は元LPの「CASE 01」画像と同じ見た目をテキストで再現） */
.offer-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  align-items: stretch; /* 同じ行のカードの高さを揃える */
  align-content: flex-start; /* min-height で高さを固定しても行が引き伸ばされないようにする */
  counter-reset: jc;
}
.offer-grid .offer-card {
  width: calc((100% - 48px) / 3);
}
.offer-grid .jobcard {
  counter-increment: jc;
}
.jcase::after {
  content: counter(jc, decimal-leading-zero);
}
.offer-card {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: 8px;
  overflow: hidden;
}
.offer-card .offer-item {
  flex: 1 1 auto;
}
.offer-case {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  padding: 18px 20px 14px;
  margin-bottom: 24px;
  background: #eef2f7;
  color: #2c5c9a;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", sans-serif;
  font-weight: 700;
  line-height: 1;
}
.offer-case__label {
  font-size: 16px;
  letter-spacing: 0.02em;
}
.offer-case__num {
  font-size: 34px;
  letter-spacing: 0.02em;
}
.offer-qual {
  text-align: center;
  margin: 0 0 14px !important;
}
.offer-qual span {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 14px;
  border-radius: 999px;
  background: #0d2d56;
  color: #ffffff;
  line-height: 1.5;
}
.offer-grid .offer-item h5 {
  white-space: normal;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .offer-grid .offer-card {
    width: calc((100% - 24px) / 2);
  }
}
@media (max-width: 600px) {
  .offer-grid .offer-card {
    width: 100%;
  }
}

/* 利用者の声 */
.voice-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  padding: 32px 30px;
  margin: 0 auto 28px;
}
.is-layout-constrained > .voice-card {
  max-width: 750px; /* body .is-layout-constrained > * の max-width: initial より優先 */
}
.voice-card:last-child {
  margin-bottom: 0;
}
.voice-card .wp-block-column > :last-child {
  margin-bottom: 0;
}
@media (min-width: 782px) {
  /* アイコン列をアイコン幅（120px）に固定して、文章との間を詰める */
  .voice-card .column-wrap {
    gap: 30px;
  }
  .voice-card .column-wrap > .wp-block-column:first-child {
    flex: 0 0 120px;
    width: 120px;
  }
}
@media (max-width: 768px) {
  .voice-card {
    padding: 24px 16px;
    margin-bottom: 16px;
  }
}
.vgrid .voice-card {
  margin-bottom: 24px;
}
.vgrid .voice-card:last-child {
  margin-bottom: 0;
}
.voice-tags {
  margin: 4px 0 8px;
}

/* ==========================================================================
   メインビジュアル（Figma: PC 1-203 / SP 1-1176）
   PC: 2880x1000 の写真の上に、右側 43.5% 幅のブロックを縦中央に配置
   SP: 750x1240 の写真を背景に、上にコピー、下に件数とCTA
   ========================================================================== */
.hero {
  position: relative;
  background: #fff url("../images/hero/hero-pc.jpg") no-repeat center top /
    cover;
  font-feature-settings: "palt";
}
.hero__inner {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
  min-height: calc(100vw * 500 / 1440); /* 写真の比率 2880:1000 */
  display: flex;
  align-items: center;
}
@media (min-width: 1440px) {
  .hero__inner {
    min-height: 500px;
  }
}
.hero__content {
  width: 43.5%; /* 627 / 1440 */
  margin-left: 46%; /* 663 / 1440 */
  padding: 40px 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
}

/* 黄色いリボン（右端は Figma の三角形SVGを上下に重ねて矢印型にする） */
.hero__ribbon {
  position: relative;
  display: inline-block;
  margin: 0 0 -20px;
  padding: 8px 20px;
  background: #fffc33;
  color: #333;
  font-size: clamp(16px, 1.39vw, 20px);
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
}
.hero__ribbon::before,
.hero__ribbon::after {
  content: "";
  position: absolute;
  left: 100%;
  width: 16px;
  height: 50%;
  background: url("../images/hero/ribbon-notch.svg") no-repeat 0 0 / 100% 100%;
}
.hero__ribbon::before {
  top: 0;
}
.hero__ribbon::after {
  bottom: 0;
  transform: scaleY(-1);
}

/* 見出し（白地の2行） */
.hero__title {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-weight: 600;
  line-height: 1.3;
}
.hero__title-line {
  display: inline-block;
  padding: 5px 20px;
  background: #fff;
  color: #333;
  font-size: clamp(26px, 3.06vw, 44px);
  white-space: nowrap;
}
.hero__title-line--brand {
  color: #e94709;
  font-size: clamp(28px, 3.33vw, 48px);
}

.hero__bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
}

/* 非公開求人 150,000件以上 */
.hero__count {
  margin: 0;
  color: #fff;
  font-weight: 600;
  line-height: 1.5;
  text-shadow: 0 0 4px #000;
  white-space: nowrap;
}
.hero__count-label {
  font-size: clamp(18px, 1.67vw, 24px);
}
.hero__count-num {
  font-family: Inter, "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(32px, 3.33vw, 48px);
  font-weight: 600;
  line-height: 0.75;
}

/* CTA（L: 60px バッジ / 20px 文字） */
.hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 30px;
  padding: 8px 40px 8px 8px;
  border: 1px solid #e94709;
  border-radius: 200px;
  background: #e94709;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}
.hero__cta:hover {
  background: #ca3a02;
  border-color: #ca3a02;
  color: #fff;
  text-decoration: none;
}
.hero__cta-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #fff;
  color: #e94709;
  line-height: 1.1;
}
.hero__cta-badge-top {
  font-size: 12px;
}
.hero__cta-badge-bottom {
  font-size: 20px;
}
.hero__cta-arrow--s {
  display: none;
}

/* タブレット（769〜1024px）: PCレイアウトのまま、ブロックを広げて文字とCTAを一段小さく */
@media (max-width: 1024px) {
  .hero__content {
    width: 52%;
    margin-left: 44%;
    gap: 22px;
  }
  .hero__bottom {
    gap: 22px;
  }
  .hero__cta {
    gap: 10px;
    padding: 4px 30px 4px 4px;
    font-size: 18px;
  }
  .hero__cta-badge {
    width: 48px;
    height: 48px;
  }
  .hero__cta-badge-top {
    font-size: 9.6px;
  }
  .hero__cta-badge-bottom {
    font-size: 16px;
  }
  .hero__cta-arrow--l {
    display: none;
  }
  .hero__cta-arrow--s {
    display: inline;
  }
}

/* SP（768px以下）: Figma SP 版のレイアウト */
@media (max-width: 768px) {
  .hero {
    background: #fff url("../images/hero/hero-sp.jpg") no-repeat center 42% /
      cover;
  }
  /* 横向きは縦長の写真を横幅いっぱいに拡大するため、顔（写真の縦 55% 付近）が見えるよう縦位置を下げる */
  @media (orientation: landscape) {
    .hero {
      background-position: center 60%;
    }
  }
  /* タブレット縦（641〜768px）: 縦長の SP 写真だと顔が拡大されて頭が切れるため、横長の PC 写真を左寄せで使う */
  @media (min-width: 641px) {
    .hero {
      background: #fff url("../images/hero/hero-pc.jpg") no-repeat left center / cover;
    }
  }
  .hero__inner {
    min-height: 0;
    display: block;
  }
  .hero__content {
    width: auto;
    margin: 0;
    padding: 32px 16px 16px;
    gap: 8px;
  }
  .hero__ribbon {
    margin: 0;
    padding: 10px;
    font-size: 16px;
    line-height: 1.3;
  }
  .hero__ribbon::before,
  .hero__ribbon::after {
    width: 16px;
  }
  .hero__ribbon::before {
    background-image: url("../images/hero/ribbon-notch-sp-top.svg");
  }
  .hero__ribbon::after {
    background-image: url("../images/hero/ribbon-notch-sp-bottom.svg");
  }
  .hero__title-line {
    padding: 4px 10px;
    font-size: 24px;
    line-height: 1.5;
  }
  .hero__title-line--brand {
    font-size: 30px;
  }
  .hero__bottom {
    width: 100%;
    align-items: center;
    gap: 8px;
    padding-top: 230px;
  }
  .hero__count-label {
    font-size: 18px;
  }
  .hero__count-num {
    font-size: 30px;
  }
}
@media (max-width: 400px) {
  .hero__title-line {
    font-size: 22px;
  }
  .hero__title-line--brand {
    font-size: 28px;
  }
}

/* ---- フッター: 外部リンクの末尾に外部リンクアイコン（文字色に追従） ---- */
.footer-nav li a[target="_blank"]::after {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: 4px;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: url("../images/icon-external-link.svg") no-repeat center / contain;
  mask: url("../images/icon-external-link.svg") no-repeat center / contain;
}