/* ==========================================================================
   サイトの部品を 1 つの型にそろえる（2026-10-20）
   --------------------------------------------------------------------------
   なぜ: トップの骨格は OKI（大企業）の写しで、その上に後から足した部品が
   それぞれ別の作りで載っていた。実測（1440px）で
     見出しの大きさ 5 種（62/50/42/36/30）・書体 2 つ・太さ 790/800
     角丸 5 種（14/12/10/8/5）・影 3 種・左端 6 か所・ボタン 4 形・色 6 つ
   オーナー「パーツの作りがチグハグで統一感はないしベンチャー企業感がない」
   「全部を組み合わせて最後に統一感を演出する」。

   4 社を同じ物差しで測り、部品ごとに 1 社から取って 1 つの型にした:
     LayerX    … 文字色を真っ黒にしない（紺みの墨 + 灰の 2 段）／角丸は 1 種類・影なし
                 ／ボタンは丸い札（高さ 52・全丸）を 1 形だけ
     Goodpatch … 節の欧文の題を大きく（600・字間 -2%・行送り .95）
                 ／和文の見出しは 700・行送り 1.4
     SmartHR   … 節の頭に全幅 1px の罫・本文 16px / 行送り 1.9 / 字間 .04em
                 ／ボタンの矢印は右端に置く
     レバレジーズ … 色を絞る（強調は 1 色）・欧文 + 和文の 2 段の題
   色は Remind の紺 #003678 を唯一の強調色にする。緑・深い青緑は使わない。

   効く範囲: body.rm-unify の中だけ（functions.php が付ける）。
   ヒーロー（動画・言葉・斜めの帯）には 1 つも当てていない。
   ========================================================================== */
.rm-unify {
  --u-ink: #14243a;
  --u-sub: #5f6b7d;
  --u-line: #dfe5ec;
  --u-soft: #f3f6f9;
  --u-accent: #003678;
  --u-accent-deep: #002452;
  --u-radius: 16px;
  --u-en: "Figtree", "Noto Sans JP", sans-serif;
  --u-ja: "Noto Sans JP", sans-serif;
}

/* ── 1. 節の題（お知らせ・事業・ビジョン で同じ形）──────────────────────
   全幅 1px の罫 → 欧文の大きな題（紺）→ 和文の見出し（墨）。左端は 1 本。 */
.rm-unify main .heading-hgroup {
  display: block;
  padding-top: 28px;
  border-top: 0;
  /* 罫は本文の幅だけに引く（hgroup が t-container を兼ねる節でも端まで伸ばさない） */
  background: linear-gradient(var(--u-line), var(--u-line)) top left / 100% 1px no-repeat;
  background-origin: content-box;
  background-clip: content-box;
}
.rm-unify main .heading-hgroup.-align-right { text-align: left; }
.rm-unify main .text-shoulder {
  display: block;
  border: 0;
  color: var(--u-accent);
  font-family: var(--u-en);
  font-weight: 600;
  font-size: 88px;
  line-height: .95;
  letter-spacing: -.02em;
}
.rm-unify main .text-shoulder .deco-dot { display: none; }
.rm-unify main .heading-hgroup .heading-hgroup__title,
html[lang=ja] .rm-unify main .heading-hgroup .heading-hgroup__title {
  width: auto;
  margin: 28px 0 0;
  color: var(--u-ink);
  font-family: var(--u-ja);
  font-weight: 700;
  font-size: 36px;
  line-height: 1.45;
  letter-spacing: .02em;
}
.rm-unify main .heading-hgroup .heading-hgroup__title::before { display: none; }
/* 強調の語は紺 1 色（緑は使わない）。元の規則は動きの有無で 2 通りに色を付けるので両方を上書きする */
.rm-unify main .typo-accent,
[data-motion-active="true"] .rm-unify main .typo-accent { color: var(--u-accent) !important; animation: none !important; }
.rm-unify main .heading-hgroup .heading-hgroup__title br { display: none; }

/* ── 2. ボタン（丸い札 1 形）──────────────────────────────────────────── */
.rm-unify main .button-base {
  height: 52px;
  padding: 0 22px 0 28px;
  gap: 16px;
  border-radius: 999px;
  background: var(--u-accent);
  color: #fff;
  font-family: var(--u-ja);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
  transition: background-color .25s ease;
}
.rm-unify main .button-base:hover { background: var(--u-accent-deep); }
.rm-unify main .button-base .buttonBase__icon--left { display: none; }
.rm-unify main .button-base .button-base__label,
.rm-unify main .button-base .buttonBase__icon--right { transform: none !important; opacity: 1 !important; }
.rm-unify main .button-base .buttonBase__icon--right {
  display: grid; place-items: center;
  width: 28px; height: 28px;
  border-radius: 999px;
  background: rgb(255 255 255 / .16);
}
.rm-unify main .button-base .buttonBase__icon--right { padding: 0; }
.rm-unify main .button-base .buttonBase__icon--right svg,
.rm-unify main .button-base .buttonBase__icon--right .icon-base { width: 13px; height: 13px; color: #fff; transform: none !important; opacity: 1 !important; }

/* ── 3. 写真・カードの角（1 種類・影なし）───────────────────────────── */
.rm-unify main .image-rounded,
.rm-unify main .image-rounded img { border-radius: var(--u-radius); }

/* ── 4. お知らせ ─────────────────────────────────────────────────────── */
.rm-unify #okis-news .list-news-thumbnail__title { color: var(--u-ink); font-weight: 700; }
.rm-unify #okis-news .date { color: var(--u-sub); font-family: var(--u-en); }

/* ── 5. 事業（3 枚）──────────────────────────────────────────────────
   全幅の帯をやめて本文の幅に入れ、3 枚を同じ角・同じ間隔で並べる。
   覆いは全面の黒 50% をやめ、文字の下だけ暗くする（写真が見える）。 */
.rm-unify #business-segment .seg3-wrap {
  width: auto;
  max-width: none;
  margin-top: 56px;
  padding-top: 0;
  padding-inline: var(--container-padding, 60px);
}
.rm-unify #business-segment .seg3 { gap: 16px; border-radius: 0; overflow: visible; }
.rm-unify #business-segment .seg3__item,
.rm-unify #business-segment .seg3__link { border-radius: var(--u-radius); overflow: hidden; border: 0; }
.rm-unify #business-segment .seg3__image-filter {
  opacity: 1;
  background: linear-gradient(180deg, rgb(10 22 40 / .05) 0%, rgb(10 22 40 / .15) 40%, rgb(10 22 40 / .82) 100%);
}
.rm-unify #business-segment .seg3__number span { font-family: var(--u-en); font-weight: 600; font-size: 15px; }
.rm-unify #business-segment .seg3__rule { opacity: .35; }
.rm-unify #business-segment .seg3__title { padding-left: 0; font-weight: 700; font-size: 30px; letter-spacing: .02em; }
.rm-unify #business-segment .seg3__title::before { display: none; }
.rm-unify #business-segment .seg3__description { margin-left: 0; font-weight: 500; font-size: 14px; line-height: 1.85; letter-spacing: .03em; }

/* ── 6. CRM の入口 ───────────────────────────────────────────────────
   深い青緑をやめて紺に（強調色は 1 色）。角・見出し・「詳しく見る」を型に合わせる。 */
.rm-unify .cta-crm .lp-card__screen { border-radius: 12px; }
.rm-unify .cta-crm .lp-card { --card-bg: var(--u-accent) !important; background-color: var(--u-accent); border-radius: var(--u-radius); box-shadow: none; }
.rm-unify .cta-crm .lp-card__title { padding-left: 0; font-weight: 700; font-size: 32px; line-height: 1.45; letter-spacing: .02em; }
.rm-unify .cta-crm .lp-card__title::before { display: none; }
.rm-unify .cta-crm .lp-card__text { padding-left: 0; margin-left: 0; font-size: 15px; line-height: 1.9; letter-spacing: .03em; }
.rm-unify .cta-crm .lp-card__more {
  justify-self: start;
  align-self: start;
  width: fit-content;
  display: inline-flex; align-items: center; gap: 16px;
  height: 52px; padding: 0 22px 0 28px;
  border-radius: 999px;
  background: #fff; color: var(--u-accent);
  font-size: 15px; font-weight: 700; letter-spacing: .04em;
}

/* ── 7. ビジョン（2 枚）──────────────────────────────────────────────
   題の四角を外し、文を題の真下から書き始める（列の途中から始めない）。 */
.rm-unify #technologies-and-innovation .t-and-i__list { margin-top: 56px; }
.rm-unify #technologies-and-innovation .t-and-i__list_title,
html[lang=ja] .rm-unify #technologies-and-innovation .t-and-i__list_title {
  margin: 28px 0 0; padding: 0;
  color: var(--u-ink);
  font-weight: 700; font-size: 24px; line-height: 1.5; letter-spacing: .02em;
}
.rm-unify #technologies-and-innovation .t-and-i__list_title .deco-dot { display: none; }
.rm-unify #technologies-and-innovation .t-and-i__list_description {
  width: auto; max-width: 34em;
  margin: 14px 0 0; padding: 0;
  color: var(--u-sub);
  font-size: 16px; line-height: 1.9; letter-spacing: .04em;
}
.rm-unify #technologies-and-innovation .t-and-i__list_button { margin: 28px 0 0; }

/* ── 8. 会社概要・採用（貼り付く面）────────────────────────────────── */
.rm-unify #about-us .about-us__list_title { margin-left: 0; }
.rm-unify #about-us .about-us__list_title .deco-dot,
.rm-unify #about-us .about-us__content_decodot { display: none; }
.rm-unify #about-us .about-us__list_title,
html[lang=ja] .rm-unify #about-us .about-us__list_title {
  color: var(--u-ink); font-weight: 700; font-size: 40px; line-height: 1.3; letter-spacing: .02em;
}
.rm-unify #about-us .about-us__list_description {
  margin-left: 0; color: var(--u-sub);
  font-size: 16px; line-height: 1.9; letter-spacing: .04em;
}
.rm-unify #about-us .about-us__list_pagination { font-family: var(--u-en); font-weight: 600; color: var(--u-accent); }

/* ── 9. ヘッダーの 2 つのボタン・手前の帯（どのページにも出る）─────────── */
.rm-unify .button-blur.button-contact { border-radius: 999px; }
.rm-unify .button-blur.button-contact:last-of-type { background: #fff; color: var(--u-accent); }
.rm-unify .foot-cta__en { color: #fff; opacity: .7; font-family: var(--u-en); font-weight: 600; }
.rm-unify .foot-cta__card { border-radius: var(--u-radius); }
.rm-unify .foot-cta__card[data-primary] { background: #fff; color: var(--u-accent); }
.rm-unify .foot-cta__card[data-primary] .foot-cta__t { color: var(--u-sub); }
.rm-unify .foot-cta__card[data-primary] .foot-cta__go { background: var(--u-accent); color: #fff; }

@media (max-width: 1023px) {
  .rm-unify main .heading-hgroup { padding-top: 20px; }
  .rm-unify main .text-shoulder { font-size: 48px; }
  .rm-unify main .heading-hgroup .heading-hgroup__title,
  html[lang=ja] .rm-unify main .heading-hgroup .heading-hgroup__title { margin-top: 18px; font-size: 24px; }
  .rm-unify main .heading-hgroup .heading-hgroup__title br { display: inline; }
  .rm-unify #business-segment .seg3-wrap { margin-top: 32px; padding-inline: 16px; }
  .rm-unify #business-segment .seg3__title { font-size: 24px; }
  .rm-unify .cta-crm .lp-card__title { font-size: 24px; }
  .rm-unify #about-us .about-us__list_title,
  html[lang=ja] .rm-unify #about-us .about-us__list_title { font-size: 28px; }
}

/* 会社概要・採用のボタンを文の左端にそろえる（スマホで 24px 右にずれていた） */
.rm-unify #about-us .about-us__list_button { margin-left: 0; }
@media (max-width: 1023px) {
  .rm-unify #business-segment .seg3__image-filter {
    background: linear-gradient(180deg, rgb(10 22 40 / .35) 0%, rgb(10 22 40 / .6) 45%, rgb(10 22 40 / .85) 100%);
  }
}
