/* ==========================================================================
   文字　── トビラ（rct.tobila.com）の実測に合わせる
   2026-08-07 riho さん「プライムは無視して、もっと扉に合わせて。
                        太さ・大きさ・字間・行間も」

   ★プライムナンバーズ基準はやめました。以下はすべてトビラの実測値です。

   実測（rct.tobila.com を 1440px と 390px の2つで走査）
   ────────────────────────────────────────────────
     役割              1440px                       390px
     ページ大見出し     90 / w400 / 行間90 / 字間2.7   41.6 / 行間41.6
     セクション見出し    36 / w400 / 行間39.6 / 字間1.08  25.0 / 行間27.5
     中見出し          28 / w400 / 行間39.2 / 字間1.4    18.7 / 行間26.2
     カード見出し       24 / w400 / 行間26.4 / 字間0.72   18.7 / 行間20.6
     英語ラベル        20 / w400 / 行間30 / 字間0.6      13.5 / 行間20.3
     英語ラベル（太）    20 / w700 / 行間22               12.5 / 行間13.7
     本文             16 / w400 / 行間32 / 字間1.28      13.5 / 行間27
     小ラベル          16 / w500 / 行間24 / 字間1.28      13.5 / 行間20.3
     小さい文字        14 / w500 / 行間21 / 字間1.28      10.4 / 行間15.6
     英語の小          14 / w400 / 行間21 / 字間0.42      10.4 / 行間15.6
     ボタンの英語       15 / w600 / 行間22.5 / 字間0.45    12.0 / 行間17.9
     連番（飾り）       11 / w400 / 行間11 / 字間0.33       7.8 / 行間7.8
   ────────────────────────────────────────────────

   字間  和文 1.28px 固定 ／ 欧文 0.03em（＝サイズ×0.03）
   行間  大見出し 1.0〜1.4 ／ 見出し 1.1 ／ 本文 2.0 ／ ラベル 1.5
   太さ  400 / 500 / 600 / 700 の4段階

   ★1つだけ置き換えています
     トビラの日本語見出しは 見出ゴMB31（有料）の w400 です。
     こちらは Noto Sans JP なので、同じ w400 にするとひょろっとして弱く見えます。
     出典ファイル（tobila-typography.css）自身が
     「流用するなら Noto Sans JP Bold か ヒラギノ角ゴ W6 に置き換える」
     と書いているので、日本語の見出しだけ w700 にしています。
     Adobe Fonts を契約したら、--mk-font-display の1行差し替えで本物になります。
   ========================================================================== */


/* ==========================================================================
   1. 大きさ・行間・字間　（1440px と 390px の実測値をつないでいる）
   ========================================================================== */

/* --- ページの大見出し（FV・ページタイトル）90 → 41.6 ---------------------- */
.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .t-h1{
  font-size:clamp(41.6px, 4.61vw + 23.6px, 90px);
  line-height:1.05;
  letter-spacing:.03em;
}
.mk .mk-pagehead--contact h1{font-size:clamp(25px, 1.05vw + 20.9px, 36px);line-height:1.1;}

/* --- セクションの大見出し 36 → 25 ---------------------------------------- */
.mk .mk-head h2,
.mk .t-h2{
  font-size:clamp(25px, 1.05vw + 20.9px, 36px);
  line-height:1.1;
  letter-spacing:.03em;
}

/* --- 大きい英語（Contact）72 → 41.6 -------------------------------------- */
.mk .t-en,
.mk .mk-contact__side h1{
  font-size:clamp(41.6px, 2.9vw + 30.3px, 72px);
  line-height:1;
  letter-spacing:.03em;
}

/* --- 中見出し 28 → 18.7 --------------------------------------------------- */
.mk .t-h3,
.mk .mk-theme__title,
.mk .mk-post__title{
  font-size:clamp(18.7px, 0.88vw + 15.3px, 28px);
  line-height:1.4;
  letter-spacing:.03em;
}

/* --- カード見出し 24 → 18.7 ---------------------------------------------- */
.mk .t-h4,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title,
.mk .mk-form__label{
  font-size:clamp(18.7px, 0.5vw + 16.7px, 24px);
  line-height:1.1;
  letter-spacing:.03em;
}

/* --- 英語ラベル（Service / Case study）20 → 13.5 -------------------------- */
.mk .mk-sectitle__en{
  font-size:clamp(13.5px, 0.62vw + 11.1px, 20px);
  line-height:1.5;
  letter-spacing:.03em;
}
/* 連番・小さい飾り 11 → 7.8 */
.mk .mk-numcard__no,
.mk .mk-usecard__no{
  font-size:clamp(7.8px, 0.3vw + 6.6px, 11px);
  line-height:1;
  letter-spacing:.03em;
}

/* --- 本文 16 → 13.5（行間はトビラどおり 2.0）------------------------------ */
.mk,
.mk .t-body,
.mk .mk-head .mk-lead,
.mk .mk-pagehead .lead,
.mk .mk-article p,
.s-laboro .msg-lead{
  font-size:clamp(13.5px, 0.24vw + 12.6px, 16px);
  line-height:2;
  letter-spacing:1.28px;
}

/* --- 小ラベル（中見出し・表の項目）16 w500 → 13.5 ------------------------- */
.mk .mk-h-mid,
.mk .mk-theme__label,
.mk .c-spec th,
.mk .mk-table th,
.mk-ftr__col > p{
  font-size:clamp(13.5px, 0.24vw + 12.6px, 16px);
  line-height:1.5;
  letter-spacing:1.28px;
}

/* --- 小さい文字 14 → 10.4 ------------------------------------------------- */
.mk .mk-theme__text,
.mk .mk-usecard__text,
.mk .mk-numcard__text,
.mk .mk-table td,
.mk .c-spec td,
.mk .mk-case__client,
.mk .mk-theme__cases p,
.mk .mk-btn-card__desc,
.mk .mk-diagram__note,
.mk .mk-pill,
.mk .mk-pill--auto,
.mk-ftr__col li,
.mk-ftr__legal,
.mk-ftr__bnr p,
.mk-hdr__item{
  font-size:clamp(10.4px, 0.34vw + 9.1px, 14px);
  line-height:1.5;
  letter-spacing:1.28px;
}
/* 本文まわりの小さい文字だけ行間2.0（トビラの本文と同じ扱い） */
.mk .mk-theme__text,
.mk .mk-usecard__text,
.mk .mk-numcard__text,
.mk .mk-table td,
.mk .c-spec td{line-height:2;}

/* --- ボタンの英語 15 → 12 ------------------------------------------------- */
.mk-hdr__btn,
.mk .mk-more__txt,
.mk .mk-form__submit button,
.mk-ftr__btn{
  font-size:clamp(12px, 0.29vw + 10.9px, 15px);
  line-height:1.5;
  letter-spacing:.03em;
}

/* --- 一番小さい飾り 11 → 7.8（パンくず・タグ）----------------------------- */
.mk .mk-crumb,
.mk .mk-tag,
.mk .mk-filter__tab,
.mk .mk-stats span,
.mk .mk-diagram__arrow,
.mk-ftr__legal span{
  font-size:clamp(9px, 0.19vw + 8.3px, 11px);
  line-height:1;
  letter-spacing:.03em;
}


/* ==========================================================================
   2. 太さ　400 / 500 / 600 / 700 の4段階（トビラと同じ段階）
   ========================================================================== */

/* 400 本文・説明文・英語の小さいラベル（トビラは見出しもここ） */
.mk,
.mk .t-body,
.mk .mk-head .mk-lead,
.mk .mk-pagehead .lead,
.s-laboro .msg-lead,
.mk .mk-theme__text,
.mk .mk-usecard__text,
.mk .mk-numcard__text,
.mk .mk-table td,
.mk .c-spec td,
.mk .mk-article p,
.mk .mk-beforeafter li,
.mk .mk-theme__cases p,
.mk .mk-btn-card__desc,
.mk .mk-diagram__note,
.mk .mk-crumb,
.mk .mk-sectitle__en,
.mk .mk-numcard__no,
.mk .mk-usecard__no,
.mk-ftr__bnr p{font-weight:400;}

/* 500 ラベル・タグ・リンク・日付 */
.mk .mk-h-mid,
.mk .mk-theme__label,
.mk .c-spec th,
.mk .mk-table th,
.mk .mk-pill,
.mk .mk-pill--auto,
.mk .mk-tag,
.mk .mk-filter__tab,
.mk .mk-case__client,
.mk .mk-stats span,
.mk-ftr__col li,
.mk-ftr__col > p,
.mk-ftr__legal,
.mk-hdr__item{font-weight:500;}

/* 600 ボタンの英語（トビラの ENTRY と同じ） */
.mk-hdr__btn,
.mk .mk-more__txt,
.mk .mk-form__submit button,
.mk-ftr__btn{font-weight:600;}

/* 700 見出し
   ★トビラは見出ゴMB31 の w400。こちらは Noto Sans JP なので
     出典ファイルの代替案どおり Bold(700) を当てている。 */
.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .mk-head h2,
.mk .t-h1,.mk .t-h2,.mk .t-h3,.mk .t-h4,
.mk .mk-theme__title,
.mk .mk-post__title,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title,
.mk .mk-form__label,
.mk .t-en{font-weight:700;}


/* ==========================================================================
   ★2026-08-07 riho さん
     「フォントの太さとか文字の間隔とかも、いま めっちゃ詰まってるし
       文字が太いし ダサい」

   実測してみると、原因は2つでした。
     ・見出しの行間が 1.05〜1.1 と極端に狭い（トビラの実測値をそのまま入れていた）
       トビラは有料の見出し書体で成立する詰め方で、Noto Sans JP だと窮屈に見える
     ・見出しがすべて w700（太い）。careers.kk-ems.jp は 400／500／600 の3段階で、
       w700 を使っていない

   → 行間をゆるめ、見出しの太さを 700 → 600 に落とす。
     字間も少し広げる。
   ========================================================================== */

/* --- 行間をゆるめる -------------------------------------------------------- */
.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .t-h1{line-height:1.45;letter-spacing:.04em;}
.mk .mk-head h2,
.mk .t-h2{line-height:1.5;letter-spacing:.04em;}
.mk .t-h3,
.mk .mk-theme__title,
.mk .mk-post__title{line-height:1.7;letter-spacing:.04em;}
.mk .t-h4,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title,
.mk .mk-form__label{line-height:1.75;letter-spacing:.04em;}
.mk .t-en,
.mk .mk-contact__side h1{line-height:1.15;}

/* --- 見出しの太さ 700 → 600（careers.kk-ems.jp は w700 を使っていない）------ */
.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .mk-head h2,
.mk .t-h1,.mk .t-h2,.mk .t-h3,.mk .t-h4,
.mk .mk-theme__title,
.mk .mk-post__title,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title,
.mk .mk-form__label,
.mk .t-en{font-weight:600;}

/* ボタン・ピルの文字も少し細く */
.mk .mk-pill,
.mk .mk-pill--auto,
.mk-hdr__item,
.mk-hdr__btn{font-weight:500;}


/* ==========================================================================
   ★2026-08-07 riho さん「全体的に文字の間隔が狭いし、文字が太くて濃い」
     前回は見出しだけ直したので、今回は本文・ラベルまで含めて全体を緩める。

     字間  和文 1.28px 固定 → .09em（16pxで1.44px。大きい字ほど広がる）
           見出し .04em → .06em
     行間  見出し 1.5 → 1.6 ／ カード見出し 1.75 → 1.85 ／ 本文 2.0 のまま
     太さ  見出し 600 → 500 ／ ラベル・タグ 500 → 400
     色    本文の黒 #253a4f → その88%（#253a4f のまま薄くする）
           見出しは #253a4f のまま
   ========================================================================== */

/* --- 字間 ------------------------------------------------------------------ */
.mk,
.mk .t-body,
.mk .mk-head .mk-lead,
.mk .mk-pagehead .lead,
.mk .mk-article p,
.s-laboro .msg-lead,
.mk .mk-theme__text,
.mk .mk-usecard__text,
.mk .mk-numcard__text,
.mk .mk-table td,
.mk .c-spec td,
.mk .mk-theme__cases p,
.mk .mk-btn-card__desc,
.mk .mk-h-mid,
.mk .mk-theme__label,
.mk .c-spec th,
.mk .mk-table th,
.mk .mk-pill,
.mk .mk-pill--auto,
.mk-ftr__col li,
.mk-ftr__col > p,
.mk-hdr__item{letter-spacing:.09em;}

.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .mk-head h2,
.mk .t-h1,.mk .t-h2,.mk .t-h3,.mk .t-h4,
.mk .mk-theme__title,
.mk .mk-post__title,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title{letter-spacing:.06em;}

/* --- 行間 ------------------------------------------------------------------ */
.mk .mk-head h2,
.mk .t-h2{line-height:1.6;}
.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .t-h1{line-height:1.55;}
.mk .t-h3,
.mk .mk-theme__title,
.mk .mk-post__title{line-height:1.8;}
.mk .t-h4,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title{line-height:1.85;}
.mk .mk-h-mid,
.mk .mk-theme__label,
.mk-ftr__col li,
.mk-ftr__col > p,
.mk-hdr__item{line-height:1.8;}

/* --- 太さ（見出し600 → 500 ／ ラベル500 → 400）------------------------------ */
.s-laboro .hero-h1,
.mk .mk-pagehead h1,
.mk .mk-head h2,
.mk .t-h1,.mk .t-h2,.mk .t-h3,.mk .t-h4,
.mk .mk-theme__title,
.mk .mk-post__title,
.mk .mk-numcard__title,
.mk .mk-usecard__title,
.mk .mk-case__title,
.mk .mk-btn-card__title,
.mk .mk-form__label,
.mk .t-en{font-weight:500;}

.mk .mk-h-mid,
.mk .mk-theme__label,
.mk .mk-tag,
.mk .mk-filter__tab,
.mk .mk-case__client,
.mk .c-spec th,
.mk .mk-table th,
.mk-ftr__col li,
.mk-ftr__col > p{font-weight:400;}

/* --- 色（本文だけ少し薄く。見出しは #253a4f のまま）-------------------------- */
.mk .t-body,
.mk .mk-head .mk-lead,
.mk .mk-pagehead .lead,
.mk .mk-article p,
.s-laboro .msg-lead,
.mk .mk-theme__text,
.mk .mk-usecard__text,
.mk .mk-numcard__text,
.mk .mk-table td,
.mk .c-spec td,
.mk .mk-theme__cases p,
.mk .mk-diagram__note{color:rgba(37,58,79,.82);}
