@charset "UTF-8";

/* ==========================================
   下層ページの見出し（h1。XD 05・06・08〜12 の グループ 1872 / 1773）
   XD PC: YuGo-Bold 40px・字間 4px・#555・左揃え（x=203 y=240、ベースライン 275）、波線は幅 100%・高さ 幅×0.0777（20.14）
   XD SP: 30px・字間 3px（x=13.5 y=127.58、ベースライン 153.58）、波線 194.36×15.1
   ========================================== */
.page-title {
  position: relative;
  display: block;
  width: fit-content;
  height: 31px;
  margin: 0 0 20px;
  padding: 1px 0 0;
  font-family: var(--font-ja);
  font-size: 30px;
  font-weight: 700;
  line-height: 1; /* 30px ÷ 30px */
  letter-spacing: 0.1em; /* 3px ÷ 30px */
  color: var(--color-text);
  text-indent: -1.5px; /* XD SP: x=13.5（外側の padding 15px より 1.5 左） */
  isolation: isolate; /* 波線（::after の z-index -1）が外側の白い背景の下に隠れないようにする */
}

.page-title::after {
  content: "";
  position: absolute;
  bottom: -4.77px;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 15.1px;
  background-image: url("../../img/wavyline.svg");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% 100%;
}

@media (width >= 768px) {
  .page-title {
    height: auto;
    margin-bottom: 47.6px;
    padding: 0;
    font-size: 40px;
    line-height: 42.4px; /* 40px × 1.06。比率にすると Blink の丸めで 1/64px ずれて XD との位置が 1px 動くので px のまま（AUDIT CSS-1 の要確認） */
    letter-spacing: 0.1em;
    text-indent: 0;
  }

  .page-title::after {
    bottom: -2.3px;
    height: 20.14px;
  }
}