/* =====================================================================
   英語の文字のフォント（1〜6 Adobe Fonts キット bhj6cfv ／ 7〜10 Google Fonts）
   html[data-enfont="1〜6"] で、英語に使う --en を切りかえる。
   キットが読みこめないとき（オフライン・許可されていないドメイン）は、うしろのフォントで表示。
   ===================================================================== */
html[data-enfont="1"]{--en:"uddigikyokasho-pro","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="2"]{--en:"tbudgothic-std","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="3"]{--en:"century-old-style-std","Century Schoolbook",Georgia,serif}
html[data-enfont="4"]{--en:"adobe-handwriting-tiffany","Bricolage Grotesque",cursive,sans-serif}
html[data-enfont="5"]{--en:"ff-uberhand-pro","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="6"]{--en:"ta-pop-kaku","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="7"]{--en:"Poppins","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="8"]{--en:"Nunito","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="9"]{--en:"Lexend","Bricolage Grotesque",system-ui,sans-serif}
html[data-enfont="10"]{--en:"Andika","Bricolage Grotesque",system-ui,sans-serif}

/* キットにない太さを、ブラウザがむりに太くしない（にじんだ太字にならないように） */
html.wf-active{font-synthesis-weight:none}

/* 見本用（せってい画面・管理画面） */
.fontfamily1,.enf-1{font-family:"uddigikyokasho-pro",sans-serif;font-weight:400;font-style:normal}
.fontfamily2,.enf-2{font-family:"tbudgothic-std",sans-serif;font-weight:400;font-style:normal}
.fontfamily3,.enf-3{font-family:"century-old-style-std",serif;font-weight:400;font-style:normal}
.fontfamily4,.enf-4{font-family:"adobe-handwriting-tiffany",sans-serif;font-weight:400;font-style:normal}
.fontfamily5,.enf-5{font-family:"ff-uberhand-pro",sans-serif;font-weight:500;font-style:normal}
.fontfamily6,.enf-6{font-family:"ta-pop-kaku",sans-serif;font-weight:400;font-style:normal}
.enf-7{font-family:"Poppins",sans-serif;font-weight:600}
.enf-8{font-family:"Nunito",sans-serif;font-weight:700}
.enf-9{font-family:"Lexend",sans-serif;font-weight:600}
.enf-10{font-family:"Andika",sans-serif;font-weight:700}

/* =====================================================================
   字と字のあいだ（字間）：html[data-ls="0〜3"]
   --lt 文の字間 / --ld 大きな見出しの字間 / --fit 見出しの大きさ（字間が広いほど少し小さく）
   --lh 英文の行の高さに足す分 / --pad 字間に合わせて枠の内側を少し広げる分
   つづけ字のフォント（4）は、字間をあけるとつながりが切れるので控えめにする（--ls-k）
   ===================================================================== */
:root{--ls-t:.025em;--ls-d:.05em;--ls-fit:.96;--lh:.06;--ls-k:1}
html[data-ls="0"]{--ls-t:0em;--ls-d:0em;--ls-fit:1;--lh:0}
html[data-ls="1"]{--ls-t:.025em;--ls-d:.05em;--ls-fit:.96;--lh:.06}
html[data-ls="2"]{--ls-t:.055em;--ls-d:.1em;--ls-fit:.91;--lh:.12}
html[data-ls="3"]{--ls-t:.09em;--ls-d:.16em;--ls-fit:.86;--lh:.18}
html[data-enfont="4"]{--ls-k:.3}
html{
  --lt:calc(var(--ls-t) * var(--ls-k));
  --ld:calc(var(--ls-d) * var(--ls-k));
  --fit:calc(1 - (1 - var(--ls-fit)) * var(--ls-k));
}
