/* Locally hosted display fonts. Latin and Japanese glyphs use distinct faces. */
@font-face {
  font-family: "HAL Display";
  src: url("fonts/Archivo-variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
  unicode-range: U+0000-02FF, U+1E00-1EFF;
}

@font-face {
  font-family: "HAL Display";
  src: url("fonts/MPLUS1p-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  unicode-range: U+3000-30FF, U+31F0-32FF, U+3400-9FFF, U+F900-FAFF, U+FF00-FFEF;
}

@font-face {
  font-family: "HAL Display";
  src: url("fonts/MPLUS1p-Black.ttf") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  unicode-range: U+3000-30FF, U+31F0-32FF, U+3400-9FFF, U+F900-FAFF, U+FF00-FFEF;
}

/* Archivo: headings 750, buttons 800, width 99. Japanese faces stay unchanged. */
.font-displayEB,
.page-template-recruit_top h2 {
  font-variation-settings: "wght" 750, "wdth" 99;
}

.font-displayB {
  font-variation-settings: "wght" 800, "wdth" 99;
}

/* Browser-review height correction (Archivo 750 / 800): CREATIVE 36px,
   View more 13px of glyph height. Apply to the original responsive sizes. */
:root {
  --display-heading-scale: 1.2059429837900502;
  --display-button-scale: 1.1037995142354755;
}

.topWorks__heading strong.font-displayEB,
.topCommonHeading strong.font-displayEB {
  font-size: calc(1em * var(--display-heading-scale));
}

.topRecruit__heading strong.font-displayEB {
  font-size: calc(80px * var(--display-heading-scale));
}

.topMoreBT.font-displayB {
  font-size: calc(20px * var(--display-button-scale));
}

.topRecruit__btn strong.font-displayB {
  font-size: calc(16px * var(--display-button-scale));
}

.mainHeader__lnLink.font-displayB {
  font-size: calc(14px * var(--display-button-scale));
  flex-shrink: 0;
  white-space: nowrap;
}

.pageTitle em.font-displayEB,
.worksDetail__header_under_label.font-displayEB {
  font-size: 21px;
}

@media (max-width: 800px) {
  /* Keep both language labels inside the button as the logo contracts. */
  .mainHeader__logo {
    min-width: 0;
  }

  .mainHeader__right,
  .mainHeader__right .mainHeader__btn {
    flex-shrink: 0;
  }

  .mainHeader__lnLink.font-displayB {
    font-size: calc(12px * var(--display-button-scale));
    width: auto;
    min-width: 80px;
  }

  .topRecruit__heading strong.font-displayEB {
    font-size: calc(13vw * var(--display-heading-scale));
  }

  .topMoreBT.font-displayB {
    font-size: calc(18px * var(--display-button-scale));
  }

  .pageTitle em.font-displayEB {
    font-size: 14px;
  }
}

/* Static delivery overrides: no external icon service required. */
html,
body,
button,
input,
select,
textarea {
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",
    "メイリオ", Meiryo, "游ゴシック体", "Yu Gothic", YuGothic,
    "Noto Sans JP", sans-serif;
}

.fas,
.fab,
.fa-brands {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  font-style: normal;
  line-height: 1;
}

.fa-angle-down::before {
  content: "";
  display: block;
  width: 0.38em;
  height: 0.38em;
  border-top: 0.12em solid currentColor;
  border-right: 0.12em solid currentColor;
}

.fa-angle-down::before { transform: translateY(-0.08em) rotate(135deg); }
.svg-inline--fa.fa-angle-right {
  display: inline-block;
  width: 0.625em;
  height: 1em;
  overflow: visible;
  vertical-align: -0.125em;
}
.fa-external-link-alt::before,
a.linkBlank::after,
.worksDetail__links_item[target='_blank']::after,
.fa-check::before,
.fa-x-twitter::before,
.btn.blue a::after,
.btn.fresh.btn-large a::after,
.btn.career.btn-large a::after {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  font-family: inherit;
  background-color: currentColor;
  -webkit-mask: var(--hal-icon) center / contain no-repeat;
  mask: var(--hal-icon) center / contain no-repeat;
  vertical-align: -0.125em;
}
.fa-external-link-alt::before,
a.linkBlank::after,
.worksDetail__links_item[target='_blank']::after {
  --hal-icon: url("icons/external-link.svg");
}
.fa-check::before { --hal-icon: url("icons/check.svg"); }
.fa-x-twitter::before { --hal-icon: url("icons/x-twitter.svg"); }
.btn.blue a::after,
.btn.fresh.btn-large a::after,
.btn.career.btn-large a::after {
  --hal-icon: url("icons/chevron-right.svg");
  width: 0.625em;
}
.fa-search::before {
  /* Font Awesome Free search silhouette (CC BY 4.0), served inline. */
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.fa-search-plus::before { content: "⌕"; }
.fa-twitter::before { content: "X"; font-weight: 700; }

/* WORKS search: center the unchanged 26px silhouette, not a font baseline. */
.worksSearch__textWrap_submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.worksSearch__textWrap_submit .fa-search {
  width: 1em;
  height: 1em;
  flex: 0 0 1em;
}

/* A long flex-item label must not shrink the external-link pseudo-element. */
.worksDetail__links_item[target='_blank']::after {
  flex: 0 0 1em;
  min-width: 1em;
  width: 1em;
  height: 1em;
}
