/* ============================================================
   Recruit HOME (page 974) — legacy section styles
   Ported from the live https://mazrica.com/recruit/ stylesheets:
     maz_common/assets/css/style.css + recruit.css + reset.css
     maz_recruit/style.css (VISION / VALUE)
   Scoped under .recruit-legacy so the broad legacy class names
   can't clash with the mz framework. Font sizes are hardcoded in
   px (legacy rem x 10 — the legacy base was html/body 62.5% = 1rem
   10px; the mz core uses a 16px base).
   Shared classes already provided by the recruit bundle's
   .recruit-legacy block (.inner / .mdl-flex / .ttl-middle /
   .ttl-txt / .ttl-min-jp / .conversion-area / .btn / .article /
   .footer-link ...) are NOT redefined here.
   Throwaway, like the interim team design.
   ============================================================ */

/* ---- Images never overflow their container (live reset.css `img{max-width:100%}`;
        the mz core does NOT set this, so title images at height:100px would blow
        out the mobile viewport without it) ---- */
.recruit-legacy img { max-width: 100%; }

/* ---- Anchors: legacy dark text, not the mz-core blue (maz_common) ---- */
.recruit-legacy a { color: #333; text-decoration: none; }
.recruit-legacy a:visited { color: inherit; }
.recruit-legacy a:hover { cursor: pointer; opacity: .7; }

/* ---- Section rhythm (maz_common style.css) ---- */
.recruit-legacy .mdl-col { padding: 120px 0; }

/* ---- VISION (maz_recruit style.css) ---- */
.recruit-legacy .mdl-col.vision { padding-top: 80px; }
.recruit-legacy .mdl-col.vision > .inner {
  background-repeat: no-repeat;
  background-position: top right;
  background-size: contain;
}
.recruit-legacy .mdl-col.vision > .inner > .img-container { display: none; }
.recruit-legacy .vision .ttl-middle,
.recruit-legacy .value .ttl-middle { margin-bottom: 32px; }
.recruit-legacy .ttl-middle > small {
  display: block;
  font-size: 16px;
  line-height: 26px;
}
.recruit-legacy .ttl-lead {
  font-size: 32px;
  line-height: 1;
  padding: 0 0 1em;
  background: #FF8400;
  background: linear-gradient(to right, #FF3E00 0%, #FF8400 450px, #FF8400 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.recruit-legacy .lead-text {
  color: #6E6E6E;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.7;
}

/* ---- VALUE (maz_recruit style.css) ---- */
.recruit-legacy .mdl-col.value { padding: 0; }
.recruit-legacy .value .value-list {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  grid-template-columns: minmax(auto, 450px) minmax(auto, 450px);
  list-style: none;
  padding-left: 0;
}
.recruit-legacy .value .value-list li { max-width: 100%; }
.recruit-legacy .value .value-list h4 {
  font-size: 16px;
  line-height: 32px;
  background: #FF8400;
  background: linear-gradient(to right, #FF3E00 0%, #FF8400 50px, #FF8400 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.recruit-legacy .value .value-list h4 + p {
  color: #6E6E6E;
  font-size: 24px;
  line-height: 28px;
  letter-spacing: 2px;
  padding: 0 0 1.2em;
}

/* ---- Message + image blocks: at a Glance / Life (maz_common) ---- */
.recruit-legacy .mdl-common .ttl-middle { line-height: 62px; }
.recruit-legacy .mdl-common .ttl-txt { margin-bottom: 33px; }
.recruit-legacy .mdl-common-txt {
  color: #6E6E6E;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.7;
  width: 100%;
  max-width: 560px;
}
.recruit-legacy .mdl-common-txt p + p { margin-top: 20px; }

/* 数字で見るマツリカ background (recruit.css) */
.recruit-legacy .mdl-common.mazrica-at-a-glance {
  background: url('https://corp-site.mazrica.com/assets/images/recruit/mazrica_at_a_glance_01.png') no-repeat top right;
  background-size: 418px 413px;
  min-height: 413px;
}
/* Life at mazrica band (recruit.css) */
.recruit-legacy .bg-life_at_mazrica {
  background: url('https://corp-site.mazrica.com/assets/images/recruit/bg_life_at_mazrica_pc.jpg') no-repeat right top;
  background-size: cover;
  height: 660px;
  box-sizing: border-box;
}

/* ---- Text link "一覧へ" with arrow (maz_common) ---- */
.recruit-legacy .txt-link-wrap { text-align: right; }
.recruit-legacy .mazrica-at-a-glance .txt-link-wrap,
.recruit-legacy .bg-life_at_mazrica .txt-link-wrap { width: 100%; max-width: 560px; }
.recruit-legacy .txt-link {
  font-size: 14px;
  padding-right: 100px;
  position: relative;
}
.recruit-legacy .txt-link a { color: #333; }
.recruit-legacy .txt-link::before {
  content: "";
  position: absolute;
  background: url('https://corp-site.mazrica.com/assets/images/common/txt_link.png') no-repeat;
  background-size: 81px 35px;
  width: 81px;
  height: 35px;
  right: 0;
  bottom: -6px;
}
/* Title + link row (RECRUITMENT TYPE) */
.recruit-legacy .ttl-link .txt-link { margin: -10px 0 0 21px; }

/* ---- HOME hover colour reversal (recruit.css) ---- */
.recruit-legacy .mazrica-home-reversal-link:hover { color: #FF5C00; }
.recruit-legacy .mazrica-home-reversal-link:hover img,
.recruit-legacy .txt-link.mazrica-home-reversal-link:hover::before,
.recruit-legacy .footer-link .article-prev a.mazrica-home-reversal-link:hover::after,
.recruit-legacy .footer-link .article-next a.mazrica-home-reversal-link:hover::after {
  filter: invert(25%) sepia(26%) saturate(6428%) hue-rotate(1deg) brightness(105%) contrast(102%);
}

/* ---- SP / PC display utilities (reset.css) ---- */
.recruit-legacy .is-sp { display: none; }
.recruit-legacy .is-pc { display: block; }

/* ============================================================
   Wide desktop (<= 1700px) — "一覧へ" link block re-aligns left
   (recruit.css @media 1700; NOT 768 — most desktops are < 1700)
   ============================================================ */
@media screen and (max-width: 1700px) {
  .recruit-legacy .mazrica-at-a-glance .txt-link-wrap,
  .recruit-legacy .bg-life_at_mazrica .txt-link-wrap { text-align: left; margin-top: 40px; }
}

/* ============================================================
   Mobile (<= 768px)
   ============================================================ */
@media screen and (max-width: 768px) {
  .recruit-legacy .mdl-col { padding: 60px 0; }
  .recruit-legacy .ttl-min-jp { font-size: 20px; line-height: 30px; }

  /* VISION */
  .recruit-legacy .mdl-col.vision { padding-top: 50px; }
  .recruit-legacy .mdl-col.vision > .inner { background-image: none !important; }
  .recruit-legacy .mdl-col.vision > .inner > .img-container { display: block; }
  .recruit-legacy .ttl-lead { margin-top: 20px; line-height: 1.7; }

  /* VALUE grid → single column */
  .recruit-legacy .value .value-list {
    grid-auto-rows: 1fr;
    grid-template-rows: unset;
    grid-auto-flow: row;
    grid-template-columns: 1fr;
  }

  /* Title image scales by width on SP (not a forced height) */
  .recruit-legacy .ttl-middle img.col2 { height: auto; }

  /* Backgrounds drop out, SP images take over */
  .recruit-legacy .mdl-common.mazrica-at-a-glance { background: none; }
  .recruit-legacy .bg-life_at_mazrica { height: auto; background: none; }
  .recruit-legacy .bg-life_at_mazrica-sp { margin-top: 40px; }

  .recruit-legacy .mdl-common-txt { max-width: none; }
  .recruit-legacy .mdl-common-txt + .mdl-common-imgsp { margin-top: 30px; }

  .recruit-legacy .ttl-link { display: block; }
  .recruit-legacy .ttl-link .txt-link { margin: 30px 0; display: inline-block; }

  .recruit-legacy .is-sp { display: block; }
  .recruit-legacy .is-pc { display: none; }
}
