/* ══════════════════════════════════════════════════════════════════════════
   文字のそろえ方 ─ 全サイト共通の決まり（★正本はこのファイルだけ）
   ・ほかの 3 サイト … _kit/build.mjs が kit.css の末尾に足します
   ・site-build      … _kit/sync-legal.mjs が assets/align.css へ写します

   ★既定は「左ぞろえ」です。真ん中にしてよいのは、次の 4 つだけ。
       1. 最初の画面の大きな見出し
       2. 1 行で終わる短い見出し・ラベル
       3. ボタン（.btn は中の文字がいつも真ん中）
       4. 数字を見せるところ
   ★読む文章は左にそろえます。説明の文章・カードの中の文・箇条書き・
     よくある質問・料金の説明・フォームの説明が、これにあたります。
     その文章の「上の見出し」も、文章に合わせて左に下ろします。
     （見出しだけで文章が無い場面は、真ん中のままで構いません。）

   使う名前は 3 つだけです。★型のほかの名前と重ねないこと。
     .tx-mid   この塊を真ん中にそろえる
     .tx-left  この塊を左にそろえる（中の見出しも一緒に左へ）
     .tx-one   .tx-mid の中で、1 行で終わる文を真ん中に残す

   ★安全網：.tx-mid の中に置いた段落・箇条書き・表・カード・フォームは、
     型の側で左へ戻します。真ん中の場面にうっかり長い文章を置いても、
     読みにくくならないためです。1 行で終わる文は .tx-one で真ん中に残せます。
   ══════════════════════════════════════════════════════════════════════════ */

.tx-mid{text-align:center}
.tx-mid .eyebrow,.tx-mid .kicker{justify-content:center}

/* 真ん中の場面でも、読む文章は左 */
.tx-mid :is(p,ul,ol,dl,dd,table,form,fieldset,blockquote,details,.card,.lead):not(.tx-one){text-align:left}
.tx-mid .tx-one{text-align:center}

/* 左にそろえる塊。中の見出し・ラベルも一緒に左へ */
.tx-left,
.tx-left :is(h1,h2,h3,h4,h5,p,ul,ol,dl,dt,dd,li,em,small,b,strong,blockquote,figcaption,label,.lead,.bigword,.eyebrow,.kicker){text-align:left}
.tx-left .eyebrow,.tx-left .kicker{justify-content:flex-start}