/* 画面の枠・A4 の紙・字のマス（.kb）はひらがなプリントと同じ物を使う。ここにはことわざだけの所を書く */
@import url("../kana/kana.css");

.kotoba { font-family: var(--kyokasho); }
.hl { list-style: none; margin: 3mm 0 0; padding: 0; flex: 1; display: flex; flex-direction: column; }
.hl li { flex: 1; position: relative; display: flex; align-items: center; gap: 3mm; border-bottom: .2mm dashed #ccc; }
.kotoba .no { font-size: 3.6mm; color: #555; width: 9mm; flex: none; font-family: "Yu Gothic UI", sans-serif; }
.qb { display: flex; flex-direction: column; gap: .5mm; }
.yomi { font-size: 3.4mm; color: #555; letter-spacing: .05em; }
.qw { font-size: 7.5mm; display: flex; align-items: center; flex-wrap: wrap; }
.hb { display: inline-flex; margin: 0 1mm; --kb: 10.5mm; }
.hb .kb { font-size: 8mm; }
.answer .hb b { color: var(--red); font-weight: 400; }
.mean { font-size: 4mm; color: #333; }
.mean::before { content: "意味："; color: #777; }
.hl li .tools { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: none; }
.hl li:hover .tools, .hl li:focus-within .tools { display: flex; }
.ml { list-style: none; margin: 4mm 0 0; padding: 0; display: flex; flex-direction: column; gap: 2mm; }
.ml li { display: flex; align-items: center; gap: 3mm; border-bottom: .2mm dashed #ccc; min-height: 15mm; }
.ml .qw { font-size: 6.5mm; flex: 1; }
.ml .qb { flex: 1; }
.ml .pa { font-size: 6mm; white-space: pre; }
.answer .pa b { color: var(--red); font-weight: 400; }
.mr { list-style: none; margin: 6mm 0 0; padding: 4mm; border: .4mm solid #333; border-radius: 2mm; display: flex; flex-direction: column; gap: 2.4mm; font-size: 4.4mm; }
.mr .lt { display: inline-block; width: 8mm; font-weight: 700; }