/* ■■■■■■■■■ pc or smartphone ■■■■■■■■■ */
/* 
@import url(pc.css) screen and (min-width:376px);
@import url(sp.css) screen and (max-width:375px);
*/
/* ■■■■■■■■■ memo ■■■■■■■■■ */
/*
._title: diplay:inline (centered smaller title)
._subtitle: (abolished) → ._caption
._caption: diplay:block (full width title)
*/
/* ■■■■■■■■■ animation (test) ■■■■■■■■■ */
@keyframes myframe{
from {
color:red;
@font-size:normal;
}
to{
color:#00ff00;
@font-size:large;
}
}span.new{
@font-size:small;
font-family:"Times";
@position: absolute;
/* animation: myframe 0.5s ease-in 1s infinite alternate both; */
animation: myframe 0.8s ease-in 1s infinite alternate both;
background-color:#ffffff;
border-radius:20px;
padding:0 0.4em;
}
/* ■■■■■■■■■ body ■■■■■■■■■ */
body{
/* margin:0.5em 1.5em; */
margin:0.5em 1.5em;
color:#3768bd;
background-color:#ffffff
}
body,table,td,ul,ol,dl,dd{
line-height:1.4em;
}
/* ■■■■■■■■■ link ■■■■■■■■■ */
a:link{
color:#0066ff;
}
a:active{
color:#800080;
}
a.name:active{
color:#0066ff;
}
a:visited{
color:#696969;
}
/* ■■■■■■■■■  abolished ■■■■■■■■■ */
/* a.ref{ */
/* background-color:#efefef; */
/* font-weight:bold; */
/* border-radius:5px; */
/* } */
/* .list a.ref,.rule a.ref,.pattern a.ref,.important a.ref{ */
/* background-color:transparent; */
/* border-radius:0; */
/* } */
p a,table a{
background-color:#efefef;
font-weight:bold;
border-radius:5px;
}
.section a:hover{
background-color:#c0ffff;
font-style:italic;
}
.section [class^="goto"] a:hover{
font-style:normal;
}
.list a,.rule a,.pattern a,.important a{
font-weight:bolder;
}
.important a{
background-color:transparent;
}
/* ■■■■■■■■■ headers ■■■■■■■■■ */
h1,h2,.header_addition,div.subtitle,h3,h4,h5,h6{
text-align:center;
margin-left:auto;
margin-right:auto;
margin-top:0.5em;
padding:0.3em 0 0.3em 0;
}
h1,h2,h3,h4,h5,h6{
border:solid #d0d0d0;
border-width:1px 0 1px 0;
}
h1{
font-size:150%;
font-weight:bolder;
letter-spacing:1em;
width:98%;
}
h2{
font-size:140%;
background-color:#f0f8ff;
letter-spacing:0.3em;
width:90%;
}
.header_addition{
/* each page <h2>'s subtitle */
font-size:85%;
color:#507dac;
letter-spacing:0.2em;
}
.header_addition::before{
content:"# ";
}
div.subtitle{
/* each page subtitle */
margin:0.3em 1em;
font-size:120%;
font-weight:bolder;
}
div.subtitle::before{
content:"- ";
}
div.subtitle::after{
content:" -";
}
h3{
font-size:130%;
background-color:#f0f8ff;
letter-spacing:0.1em;
width:80%;
}
/* .header h3{ */
/* [unused] (integrated in span.topic) */
/* 
h3.topic{
all:unset;
border:none;
background-color:transparent;
text-align:left;
display:inline-block;
text-indent:-1em;
padding-left:1em;
font-size:large;
}
*/
/* .header h3::before{ */
h3.topic::before{
content:"§";
}
h4{
background-color:#f0f0f0;
/* background-color:#edffff; */
font-size:120%;
width:70%;
}
h5{
font-size:100%;
/* background-color:#f5f5f5; */
background-color:#efffff;
color:#5f5f5f;
width:60%;
}
h6{
font-size:100%;
background-color:#f0f0f0;
color:#6f6f6f;
width:50%;
}
/* ■■■■■■■■■ iframe, form ■■■■■■■■■ */
iframe,form,input{
border-radius:8px;
}
input{
margin-bottom:0;
}
form{
margin-bottom:0;
}
/* ■■■■■■■■■ text decoration ■■■■■■■■■ */
hr{
color:#efefef;
}
u{
font-weight:bolder;
}
em{
margin-right:0.2em;
}
strong{
margin-right:0.1em;
}
.strong{
font-weight:bolder;
}
kbd{
font-size:100%;
}
sup{
font-size:xx-small;
}
sub{
font-size:xx-small;
}
dfn{
font-style:normal;
}
abbr{
all:unset;
}
dfn.jp{
@font-family:"Meiryo";
}
dfn.en{
font-family:"Times";
}
/* ■■■■■■■■■ table (css) ■■■■■■■■■ */
/* 小画面では<table>よりもきれいに見える */
/* 画面サイズを小さくするとthが自動的に縦一列になる */
/* colspan, rowspanの設定が不明(不可?)なのでシンプルな構成の表にしか使えない */
.table{
display:table;
width:100%;
border:1px solid #a0a0a0;
border-collapse: collapse;
/* border-collapse:separate; */
/* border-spacing:1px; */
margin:auto;
margin:0 0 1em 0;
}
.caption{
display:table-caption;
text-align:center;
font-size:large;
}
.tr{
display:table-row;
}
.th{
display:table-cell;
text-align:center;
font-weight:bold;
border:solid 1px #a0a0a0;
background-color:#efffff;
vertical-align:middle;
}
.td{
display:table-cell;
border:solid 1px #a0a0a0;
}
.th,.td{
padding:0.2em;
line-height:1.2em;
}
/* ■■■■■■■■■ table (html)■■■■■■■■■ */
/* 小画面では見にくいのでdl,dt,ddに順次置き換える */
/* 数行程度の小さな表はPC用に残し、<div class="hi_reso">で表示する */
/* 小画面では<div class="low_reso">でdl,dt,ddを使った表を見せる */
div.hi_reso{
display:block;
}
div.low_reso{
display:none;
}
caption{
font-weight:bolder;
font-size:111%;
padding-bottom:0.1em;
}
table{
margin:0 0 1em 0;
width:98%;
border-collapse:separate;
}
table,th,td{
border:solid 1px #c0c0c0;
}
table.collapse{
border-collapse:collapse;
}
table.centered{
text-align:center;
}
th{
/* thの幅が優先されてtdの幅が極端にせまくなるのを防ぐ */
/* ie では効果なし */
background-color:#efffff;
padding:0.3em 0;
}
td{
/* thの幅が優先されてtdの幅が極端にせまくなるのを防ぐ */
/* ie では効果なし */
border:solid 1px #c0c0c0;
padding:0 0.2em;
}
td p.example{
margin-left:0em;
}
td.word{
/* verb.htm, noun.htm */
/* min-width:35%; */
/* max-width:40%; */
/* width:35%; */
background-color:#f0f0f0;
text-align:center;
font-weight:bolder;
font-size:88%;
}
td.null{
/* not available or null */
color:#707070;
font-weight:bold;
text-align:center;
}
td span.null{
/* n/a or null */
font-size:80%;
color:#808080;
font-weight:bold;
}
td.center{
text-align:center;
vertical-align:middle;
}
/* ■■■■■■■■■ page top index ■■■■■■■■■ */
div[class^="toplist"]{
letter-spacing:0.1em;
border-width:0px 0px 1px 1.3em;
padding-left:0.3em;
margin:0.5em 0em 0.2em 0.5em;
}
.toplist00{
border-radius:20px;
border-bottom:solid 2px #c0c0c0;
background-color:#eeeeff;
padding:0.3em 0 0.3em 0.5em;
margin:0.3em 0em 0.2em 0.5em;
word-break:break-all;
}
.toplist0{
border:solid #78ffa2;
}
.toplist1{
border:solid #6495ed;
}
.toplist2{
border:solid #c6f791;
}
.toplist3{
border:solid #ffff00;
}
.toplist4{
border:solid #ffccff;
}
.toplist5{
border:solid #b0b0b0;
}
.toplist6{
border:solid #dfdbff;
}
.toplist7{
border:solid #cfe0ff;
}
.toplist8{
border:solid #c0ffff;
}
.toplist9{
border:solid #ff7dff;
}
/* ■■■■■■■■■ button link ■■■■■■■■■ */
.button a[href]{
background-color:#e0eeff;
border-bottom:solid 1.5px #5871aa;
border-right:solid 2px #5871aa;
border-radius:13px;
padding:0.1em 0.7em;
line-height:1.4em;
}
.button a[href]:hover{
color:#ffffff;
background-color:#000000;
}
/* ■■■■■■■■■ each page nav & subnav ■■■■■■■■■ */
div.nav{
margin-left:auto;
margin-right:auto;
width:50%;
text-align:center;
word-break:keep-all;
}
.popuptopic .subnav{
line-height:1.4em;
word-break:keep-all;
}
.currentpage{
border-radius:13px;
color:#000000;
font-weight:bolder;
background-color:#e0e0e0;
padding:0.15em 0.8em;
}
/* ■■■■■■■■■ general: each title ■■■■■■■■■ */
[class$="_title"]{
display:inline;
font-weight:bold;
position:relative;
left:0.8em;
top:0.6em;
}
/* ■■■■■■■■■ general: preface ■■■■■■■■■ */
.preface_title{
color:#404040;
background-color:#f0f0f0;
border:solid 1px #c0c0c0;
padding:0.2em 2em;
border-radius:50px;
}
.preface{
border:solid 2px #c9c9c9;
padding:0.3em 1.5em;
margin:0 8em 1em 8em;
text-indent:1em;
background-color:#f0ffff;
font-weight:bolder;
border-radius:15px;
}
/* ■■■■■■■■■ contents general: hidden item ■■■■■■■■■ */
.hide{
display:none;
}
/* ■■■■■■■■■ contents general:header ■■■■■■■■■ */
div.article{
margin:1em 2em;
}
div.header{
font-size:110%;
border-bottom:solid 1px;
/* margin:1em 0em 0.5em 0em; */
margin:1em 0em;
font-weight:bolder;
}
div.series_header{
font-size:x-large;
background-color:#e4e4ff;
padding:0.2em 0 0.2em 0.1em;
border-radius:30px 0 0 30px;
border-left:solid 1em #5f5f5f;
color:#000000;
margin-left:-0.5em;
margin-bottom:0.3em;
}
div.series_subheader{
font-size:85%;
margin:-0.3em 0 0.3em 1.5em;
line-height:1.2em;
}
div.series_subheader::before{
font-size:120%;
content:"┗#";
}
span.topic{
text-align:left;
display:inline-block;
text-indent:-1em;
padding-left:1em;
font-size:large;
}
span.topic::before{
content:"§";
}
/* ■■■■■■■■■ contents general:font (test) ■■■■■■■■■ */
[class="topic"],[class$="point"],[class$="title"],[class$="point"],[class^="goto"]{
/* font-family:fantasy;を使うとIEでは表示が乱れる */
@font-family:fantasy;
}
/* ■■■■■■■■■ contents general:content ■■■■■■■■■ */
div.section{
margin:0 0 0 2em;
}
/* ■■■■■■■■■ contents general:point index ■■■■■■■■■ */
div.point_index_caption{
color:#4f4f4f;
background-color:#ffffff;
font-weight:bolder;
font-size:88%;
border:solid 1px #c0c0c0;
padding:0.3em 1em 0 0.8em;
border-top-left-radius:20px;
border-top-right-radius:20px;
border-right:solid 3px #c0c0c0;
border-bottom:solid 3px #ffffff;
display:inline-block;
position:relative;
top:0.1em;
}
div.point_index dl{
margin:0 0 0 1em;
}
div.point_index{
background-color:#ffffff;
border:solid 1px #c0c0c0;
border-top-right-radius:30px;
border-right:solid 5px #c0c0c0;
border-bottom:solid 1px #cfcfcf;
margin:0 0 1em 0;
}
div.point_index a.ref{
font-weight:normal;
background-color:#ffffff;
border-bottom:dashed 1px #a0a0a0;
border-radius:0px;
}
div.point_index a.ref:hover{
background-color:#c0ffff;
}
div.point_index li{
padding-right:0.3em;
}
/* ■■■■■■■■ contents general: (sub)(sub)(sub)point ■■■■■■■■ */
p[class$="point"]{
line-height:1em;
padding:0.7em;
font-weight:bold;
padding-left:1.8em;
text-indent:-1.8em;
font-weight:bolder;
}
span[class$="point_caption"]{
padding:0.05em 0.3em;
font-weight:lighter;
font-size:80%;
border-left:5px solid #91c5ff;
border-bottom:1.5px solid #c0c0c0;
margin-left:0.5em;
padding-top:0em;
}
p[class$="point"]::before{
padding-left:0.5em;
margin-right:0.2em;
}
p.point{
font-size:110%;
background-color:#f0f8ff;
/* margin:0 0 0.5em -1.5em; */
margin:0 0 0.5em -2em;
}
p.point::before{
content:"■";
}
p.subpoint{
font-size:100%;
background-color:#fff8dc;
margin:0 0 0.5em -1.5em;
}
p.subpoint::before{
content:"●";
}
p.subsubpoint{
font-size:100%;
background-color:#e0feff;
margin:0 0 0.5em -1em;
}
p.subsubpoint::before{
content:"◆";
}
p.subsubsubpoint{
font-size:100%;
background-color:#e3ffe3;
margin:0 0 0.5em -0.4em;
}
p.subsubsubpoint::before{
content:"▼";
}
/* ■■■■■■■■■ contents general: example ■■■■■■■■■ */
div.mini_caption{
/* point, subpontで区切るほどではない項目にタイトルを付ける */
font-size:80%;
padding:0.3em 0;
margin-bottom:-1.3em;
line-height:1em;
border-radius:10px;
background-color:#dddcff;
color:#0f0f0f;
text-indent:-1.8em;
padding-left:1.8em;
}
div.mini_caption::before{
padding-left:0.5em;
content:"▽";
}
ol .example,ul .example,.list .example,.rule .example,.pattern .example{
background-color:transparent;
margin:-0.5em 0 0 0;
}
.example{
/* sentence or clause example */
background-color:#eeeeef;
color:#0f0f0f;
padding:0.5em;
border-radius:18px;
}
/* span のブロック化 */
/* 
.example span, .important span, .list span, .pattern span, .rule span{
display:block;
}
*/
.exm{
/* with horizontal dotted line */
/* border-bottom:dashed 2px #c0c0c0; */
/* box-sizing:border-box; */
/* width:100%; */
/* margin-top:0.2em; */
}
.ok{
/* 【○】[unused] */
}
.ng{
/* 【×】[unused] */
}
.nb{
/* 【△】[unused] */
}
.trn{
/* 【訳】[unused] */
}
.enjp{
/* 【和訳】[unused] */
}
.jpen{
/* 【英訳】[unused] */
}
.ltrl{
/* 【直訳】[unused] */
font-style:italic;
font-size:90%;
font-weight:normal;
display:inline-block;
color:#606060;
/* background-color:#ffffff; */
/* border-radius:10px; */
/* padding-right:1em; */
}
/* ■■■■■■■■■ contents general: hanging ■■■■■■■■■ */
[class^="hg"]{
display:inline-block;
}
.hg0_5em{
/* examples within confusables:starting with '(' */
text-indent:-0.6em;
padding-left:0.6em;
}
.hg1em{
/* examples within confusables:starting with '※' */
text-indent:-1.1em;
padding-left:1.1em;
}
.hg1_5em{
/* examples additional parenthesis (= ...) */
text-indent:-1.8em;
padding-left:1.8em;
}
.hg2em{
/* word + examples:【例】【訳】【 × 】【 ○ 】 */
text-indent:-2.7em;
padding-left:2.7em;
}
.hg2_5em{
/* word:【例a】【訳b】 */
text-indent:-3.2em;
padding-left:3.2em;
}
.hg3em{
/* word + examples:【例文】【和訳】 */
text-indent:-3.7em;
padding-left:3.7em;
}
.hg3_5em{
/* word + examples:【例文a】【和訳a】 */
text-indent:-4.2em;
padding-left:4.2em;
}
.hg4em{
/* examples general:【例文】【和訳】【英訳】【 × 】【 ○ 】 */
text-indent:-4.7em;
padding-left:4.7em;
}
.hg4_5em{
/* examples general:【例文1】【和訳1】 */
text-indent:-5.2em;
padding-left:5.2em;
}
.hg5em{
/* examples general:【和　訳】【平叙文】【疑問文】【代名詞】 */
text-indent:-5.8em;
padding-left:5.8em;
}
.hg5_5em{
/* examples general:【和　訳1】【平叙文1】【疑問文1】*/
text-indent:-6.3em;
padding-left:6.3em;
}
.hg6em{
/* examples genera:【let + us】*/
text-indent:-6.8em;
padding-left:6.8em;
}
.hg6_5em{
/* examples genera: */
text-indent:-7.3em;
padding-left:7.3em;
}
.hg7em{
/* examples general:【イディオム】【関係代名詞】 */
text-indent:-7.8em;
padding-left:7.8em;
}
.hg7_5em{
/* examples general: */
text-indent:-8.3em;
padding-left:8.3em;
}
.hg8em{
/* examples general:【動詞、助動詞】 */
text-indent:-8.8em;
padding-left:8.8em;
}
.hg8_5em{
/* examples general: */
text-indent:-9.3em;
padding-left:9.3em;
}
.hg9em{
/* examples general:【fallの過去形】【feelの過去形】 */
text-indent:-9.8em;
padding-left:9.8em;
}
.hg9_5em{
/* examples general: */
text-indent:-10em;
padding-left:10em;
}
li[class$="em"]{
display:list-item;
}
/* ■■■■■■■■■ contents general: paraphrase ■■■■■■■■■ */
span.paraphrase{
/* (= ) */
font-style:italic;
font-size:95%;
font-weight:normal;
display:inline-block;
text-indent:-2em;
padding-left:2em;
}
/* 
.important>span.paraphrase{
display:inline-block;
text-indent:-1em;
padding-left:1em;
margin-left:1em;
font-style:normal;
}
*/
span.hg3em~span.paraphrase{
/* example's paraphrasing */
margin-left:2.5em;
}
span.hg3_5em~span.paraphrase{
/* example's paraphrasing */
margin-left:3em;
}
span.hg4em~span.paraphrase{
/* example's paraphrasing */
margin-left:3.5em;
}
span.hg4_5em~span.paraphrase{
/* example's paraphrasing */
margin-left:4em;
}
span.hg5em~span.paraphrase{
/* example's paraphrasing */
margin-left:4.5em;
}
/* ■■■■■■■■■ contents general: comment ■■■■■■■■■ */
.comment{
color:#006dd9;
font-weight:bold;
display:inline-block;
text-indent:-1.2em;
padding-left:1.2em;
margin-left:2.5em;
font-size:88%;
}
.hg3em~.comment{
/* example's comment */
margin-left:2.5em;
}
.hg3_5em~.comment{
/* example's comment */
margin-left:3em;
}
.hg4em~.comment{
/* example's comment */
margin-left:3.5em;
}
.hg4_5em~.comment{
/* example's comment */
margin-left:4em;
}
.hg5em~.comment{
/* example's comment */
margin-left:4.5em;
}
/* ■■■■■■■■■ contents general: list: dl,dt,dd ■■■■■■■■■ */
dl{
/* margin:0;*/
}
dl dt{
font-size:large;
font-weight:bold;
}
div.list dt,div.rule dt,div.pattern dt{
text-indent:-1.2em;
padding-left:1.2em;
padding-top:0.2em;
padding-bottom:0.2em;
background-color:#ffffff;
margin-bottom:0.1em;
}
div.list dt a.ref,div.rule dt a.ref,div.pattern dt a.ref{
}
div.list dt::before,div.rule dt::before,div.pattern dt::before{
/* content:"\0025b6"; */
content:"\0029eb";
margin:0 0.2em;
}
/* ■■■■■■■■■ contents general: list: div ■■■■■■■■■ */
div.list_title,div.rule_title,div.pattern_title{
color:#000000;
padding:0.3em 1.4em 0.3em 0.4em;
font-size:90%;
border-left:solid 1.0em;
border-radius:15px;
}
div.list_title{
border-color:#6495ed;
background-color:#ccccff;
}
div.rule_title{
border-color:#90ee90;
background-color:#ccfbbe;
}
div.pattern_title{
border-color:#da70d6;
background-color:#eeccff;
box-shadow:2px 2px #aaaaaa;
}
div.list,div.rule,div.pattern{
padding-left:0.8em;
padding:0 0.3em;
margin:0 0 1em 0;
}
div.list{
border-radius:10px;
border:solid 1px #ccccff;
background-color:#eeeeff;
}
div.rule{
border-radius:10px;
border:double 3px #ccfbbe;
background-color:#efffee;
}
div.pattern{
border:solid 1px #c0c0c0;
background-color:#ffefff;
border-top-color:transparent;
border-left:transparent;
/* box-shadow:4px 2px #aaaaaa; */
box-shadow:5px 4px #c0c0c0;
}
div.rule li,div.pattern li{
font-weight:bolder;
}
div.rule li>[class^="hg"],div.pattern li>[class^="hg"]{
font-weight:normal;
}
/* ■■■■■■■■■ contents general: list: ul,ol,li ■■■■■■■■■ */
ol,ul{
margin-bottom:0.3em;
}
li{
padding-left:0.5em;
}
div.list>ol,div.list>ul,div.rule>ol,div.rule>ul,div.pattern>ol,div.pattern>ul{
/* list with title */
padding-top:0.7em;
}
ul li[class^="compact"]{
list-style:none;
margin-left:-2em;
}
ul li[class^="compact"] ul li{
list-style:none;
}
ol.hl li,ul.hl li{
/* with Horizontal Line */
border-bottom:dashed 2px #c0c0c0;
padding:0.3em 0;
}
li div{
/* supplementary explanation of li */
font-weight:normal;
font-size:medium;
 }
/* ■■■■■■■■■ contents general: importnat ■■■■■■■■■ */
.important{
font-weight:bold;
padding:0.5em 1em;
background-color:#ffdfff;
/* box-shadow:4px 2px #aaaaaa; */
box-shadow:5px 4px #c0c0c0;
}
.eg_imp{
/* examples with in important:starting with '# ' */
display:inline-block;
text-indent:-1em;
padding-left:1em;
}
.eg_imp+.jp{
/* interjection.htm, spelling.htm, tokusatsu.htm */
font-weight:normal;
display:block;
margin-left:1em;
text-indent:-1.5em;
padding-left:1.5em;
}
/* ■■■■■■■■■ contents general: confusable ■■■■■■■■■ */
/* old */
dl.confusable{
border-radius:8px;
background-color:#ffffba;
padding:0.5em 1em;
}
dl.confusable dt.confusable{
font-size:xx-large;
font-family:"Times";
margin:0.2em 0;
}
/* new */
div.confusable{
border-radius:8px;
background-color:#ffffba;
padding:0.1em 1em;
}
div.confusable dt{
font-size:xx-large;
font-family:"Times";
margin-bottom:0.2em;
}
/* ■■■■■■■■■ contents general: insertion ■■■■■■■■■ */
.insertion{
/* inserted comment */
font-size:88%;
font-weight:bolder;
margin-left:5em;
color:#006dd9;
display:inline-block;
text-indent:-3.5em;
padding-left:3.5em;
margin-left:0.5em;
}
.rule .insertion,.pattern .insertion{
font-weight:normal;
}
/* ■■■■■■■■■ contents general: aim ■■■■■■■■■ */
.aim{
/* conjunction.htm, japanese.htm only */
background-color:#ffffba;
font-size:110%;
font-weight:bolder;
padding:0.5em 0;
text-align:center;
width:75%;
letter-spacing:0.1em;
margin-left:auto;
margin-right:auto;
}
/* ■■■■■■■■■ contents general: adj_pattern ■■■■■■■■■ */
/* adjective.html only (construction pattern) */
[class^="adj_pattern"]{
/* for test */
@display:none;
}
.adj_pattern_title{
color:#000000;
padding:0.15em 1.4em 0.15em 0.4em;
/* background-color:#ccccff; */
background-color:#d0d0d0;
border-radius:10px;
border:solid 1px #c0c0c0;
font-size:small;
}
div.adj_pattern{
letter-spacing:-0.08em;
font-size:small;
color:#000000;
border:solid 1px #c0c0c0;
border-radius:10px;
padding:0.5em;
text-indent:-1em;
padding-left:1em;
margin:0 0 1em 0;
}
div.adj_pattern a.ref{
border-radius:10px;
}
/* ■■■■■■■■■ contents general: on/off menu ■■■■■■■■■ */
input.summary{
display:none;
}
label.summary{
color:#303030;
background-color:#f0f0f0;
padding:0.2em 0.5em 0.2em 0.3em;
border-radius:30px;
font-size:x-small;
}
label.summary::before{
/* content:"↓"; */
/* content:"+"; */
content:"\25bc";
margin-right:0.3em;
}
.details{
visibility:hidden;
height:0;
opacity:0;
font-weight:normal;
font-size:medium;
}
input.summary:checked+label.summary+.details{
visibility:visible;
height:auto;
opacity:1;
transition:all 0.5s;
}
input.summary:checked+label.summary::before{
/* content:"↑"; */
/* content:"-"; */
content:"\25b2";
margin-right:0.3em;
}
.top_nav input.summary,.top_nav label.summary,.top_nav .details{
display:none;
/* unfinished due to design */
margin-left:3em;
}
.top_nav .details{
visibility:hidden;
height:0;
opacity:0;
font-weight:normal;
font-size:medium;
}
.top_nav ul.details{
margin-left:1em;
}
.top_nav .details li{
list-style-type:none;
}
.top_nav .details li::before{
content:"■";
}
.top_nav .details li li::before{
content:"§";
}
.top_nav .details li li li::before{
content:"# ";
}
/* ■■■■■■■■■ contents general: inserted fyi ■■■■■■■■■ */
/* 参考 */
.fyi_start{
display:inline;
}
.fyi{
border-radius:0 10px 10px 50px;
border:solid 2px #c0c0c0;
padding:0.1em 0.5em;
margin:0 0 1em 0;
}
/* ■■■■■■■■■ contents general: inserted see ■■■■■■■■■ */
/* 【参照】*/
.see{
font-size:88%;
}
/* ■■■■■■■■■ contents general: addition  ■■■■■■■■■ */
/* 【注意】 */
.addition_title{
background-color:#bbddff;
color:#000000;
}
.addition{
border-color:#bbd9ff;
}
/* ■■■■■■■■■ contents general: aside ■■■■■■■■■ */
/* 【参考】 */
div.aside_title{
background-color:#ccecff;
color:#000000;
}
div.aside_caption{
font-weight:bold;
background-color:#dfefef;
color:#000000;
border-radius:10px;
margin-top:1em;
padding:0.1em 0.8em;
display:inline-block;
}
div.aside_caption::before{
content:"★";
margin-right:0.3em;
display:inline-block;
text-indent:-1em;
padding-left:1em;
}
div.aside{
border-color:#ccddff;
}
/* ■■■■■■■■■ contents general: addition & aside ■■■■■■■■■ */
.addition,.aside{
font-size:88%;
border-radius:30px;
padding:0em 1em;
margin:0 0 1em 0;
border-style:double;
border-width:5px;
}
/* .addition p,.aside p{ */
.addition p:not(.example),.aside p:not(.example){
text-indent:1em;
}
.addition_title,.aside_title{
font-size:88%;
padding:0.1em 0.6em;
border-radius:10px;
margin-left:1em;
}
/* ■■■■■■■■■ contents general: cross reference ■■■■■■■■■ */
.note{
font-size:88%;
border:3px #c0c0c0 double;
padding:0.5em;
margin:0 0 1em 0;
}
.note_title{
font-size:88%;
color:#404040;
background-color:#f0f0f0;
padding:0.1em 0.6em;
margin-left:1em;
}
.note div.note_link{
text-indent:-1.8em;
padding-left:1.8em;
}
.note div::before{
color:#000000;
font-weight:bold;
font-size:110%;
content:"§";
}
.note li{
/* ●●●テスト:li●●● */
list-style-type:none;
}
.note li::before{
color:#000000;
font-weight:bold;
font-size:110%;
content:"§";
margin-left:-2em;
}
/* end of ●●●テスト:li●●● */

/* ■■■■■■■■■ contents general: punctuation ■■■■■■■■■ */
span.pronunciation{
color:#000000;
}
.eg_imp>.pronunciation{
color:#3f3f3f;
font-weight:normal;
margin-left:0.3em;
}
/* ■■■■■■■■■ contents general: centering ■■■■■■■■■ */
.center{
text-align:center;
margin-left:auto;
margin-right:auto;
}
/* ■■■■■■■■■ contents general: emphasis ■■■■■■■■■ */
.emphasis_jp{
/* font-family:"meiryo"; */
font-weight:bolder;
}
.emphasis_en{
font-family:"Times";
font-size:x-large;
font-weight:bold;
}
/* ■■■■■■■■■ contents general: balloon ■■■■■■■■■ */
/* balloon 1*/
[class^="balloon"]{
font-size:x-small;
font-weight:bold;
}
.balloon1{
color:#ffffff;
background-color:#000000;
}
/* balloon 1*/
.balloon1::before{
color:#000000;
}
/* balloon 2 */
.balloon2{
color:#000000;
background-color:#c0c0c0;
}
/* balloon 2 */
.balloon2::before{
color:#c0c0c0;
}
[class^="balloon"]{
position:relative;
bottom:0.05em;
padding:3px 0.8em 3px 0 ;
border-radius:5px;
z-index:1;
}
/* .balloon1::before,.balloon2::before { */
[class^="balloon"]::before{
line-height:2.2em;
content:"▼";
position:relative;
top:1.1em;
left:0.8em;
z-index:2;
font-style:italic;
}
/* ■■■■■■■■■ contents general: N.B. ■■■■■■■■■ */
.nb_footer{
/* N.B. of list or chart */
margin:1em 0;
padding:0.5em;
border-radius:10px;
border:solid 1px #c0c0c0;
}
.nb_general{
/* general N.B. */
font-size:80%;
font-weight:bolder;
/* color:#006dd9; */
color:#0f0f0f;
margin-left:0.3em;
}
/* ■■■■■■■■■ contents general: quotation ■■■■■■■■■ */
cite{
/* citing source */
font-size:88%;
}
cite::before{
content:"――";
}
/* ■■■■■■■■■ contents general: correction ■■■■■■■■■ */
.correction{
color:#cc0000;
font-weight:bolder;
font-size:80%;
display:inline-block;
text-indent:-1em;
padding-left:1em;
}
.example .correction{
/* general */
margin-left:6em;
}
.eng+.correction{
/* composition */
margin-left:3em;
}
/* balloon */
/* display inline balloon instead of link */
.balloon{
border:solid 2px #c0c0c0;
padding:0 0.2em;
border-radius:10px;
/* 
border-top-right-radius:50px;
border-bottom-right-radius:50px;
border-bottom-left-radius:50px;
*/
}
/* ■■■■■■■■■ contents general: misc ■■■■■■■■■ */
.null{
/* not available or null in <table> and others */
color:#808080;
font-weight:bold;
}
.last_update{
text-align:center;
margin:0 0 0.5em 0;
}
/* ■■■■■■■■■ contents general: filler ■■■■■■■■■ */
.filler_l{
font-size:130%;
color:#a9a9a9;
letter-spacing:0.8em;
margin:1.5em 0 1.5em 0;
text-align:center;
}
.filler_s{
color:#a9a9a9;
letter-spacing:0.8em;
text-align:center;
}
/* ■■■■■■■■■ contents general: group [unused] ■■■■■■■■■ */
div.group_caption{
display:inline;
font-weight:bolder;
color:#000000;
position:relative;
left:0.8em;
top:0.8em;
padding:0.3em 1.3em 0.3em 0.4em;
border-radius:15px;
font-size:90%;
border-left:solid 0.7em #ae8cba;
background-color:#e2c2ff;
}
div.group_caption span.gotolist{
background-color:#efefef;
padding:0.1em;
}
div.group{
border:double 3px #c0c0c0;
border-radius:10px;
padding:0 1em;
margin:0 0 1em 0;
}
/* ■■■■■■■■■ fixed navi buttons ■■■■■■■■■ */
[class$="fixed"] a{
border:none;
}
.navifixed{
position:absolute;
bottom:55%;
margin:0 0.5em;
}
.totopfixed a:visited{
color:#c0c0c0;
}
.totopfixed{
color:#c0c0c0;
font-size:x-large;
padding:0.2em 0.1em 0.2em 0.5em;
position:fixed;
right:0.3em;
}
.homefixed a:visited{
color:#c0c0c0;
}
.homefixed{
color:#c0c0c0;
font-size:x-large;
padding:0.2em 0.1em 0.2em 0.5em;
position:fixed;
right:0.3em;
}
.backfixed a:visited{
color:#c0c0c0;
}
.backfixed{
color:#c0c0c0;
font-size:x-large;
padding:0.2em 0.1em 0.2em 0.5em;
position:fixed;
right:0.3em;
}
/* ■■■■■■■■■ jump (goto*) ■■■■■■■■■ */
[class^="goto"]{
font-size:x-small;
font-weight:lighter;
}
[class^="goto"] a{
border:none;
background-color:transparent;
}
[class^="goto"] a:hover{
color:#ffffff;
background-color:#000000;
border-radius:30px;
padding:0.2em;
}
.gotopagetop{
position:absolute;
right:7%;
font-weight:normal;
letter-spacing:0.1em;
}
.gotopagetop::before{
content:"▲";
}
.gotolist{
/* adjective.htm only */
border-radius:15px;
border:solid 1px #e0e0e0;
background-color:#e0eeff;
text-align:right;
line-height:1.3em;
}
.gotomainlist{
border-radius:15px;
border:solid 1px #e0e0e0;
background-color:#e0eeff;
text-align:right;
line-height:1.3em;
margin-left:-2em;
margin-top:-0.4em;
margin-bottom:0.4em;
padding-right:0.6em;
}
.gotoitemtop{
all:initial;
position:absolute;
right:7%;
font-weight:bolder;
background-color:transparent;
}
.mini_caption+.gotoitemtop{
font-size:x-small;
}
/* ■■■■■■■■■ popup index ■■■■■■■■■ */
/* each page popup small index menu */
div.popupindex{
position:fixed;
top:2%;
left:0.1em;
font-size:88%;
visibility:hidden;
}
div.popupindex:hover{
visibility:visible;
padding:1em;
background-color:#ffffff;
border:solid 1px #000000;
border-radius:20px;
min-height:6em;
max-height:70%;
min-width:50%;
max-width:80%;
z-index:999;
overflow:auto;
overflow-x:auto;
overflow-y:auto;
margin-top:1em;
margin-left:-0.3em;
text-align:left;
word-break:keep-all;
@opacity:0.8;
}
span.popupindex_caption{
font-size:x-large;
visibility:visible;
/* color:#a0a0a0; */
color:#909090;
}
span.popupindex_subcaption{
position:relative;
bottom:1em;
font-weight:bolder;
}
.popupindex a{
font-size:medium;
padding-right:0.3em;
}
.popupindex>a::before{
content:"■";
font-size:88%;
margin-right:0.1em;
}
.popupindex ul>li::before{
content:"§";
}
.popupindex ul>li>ul>li::before{
content:"# ";
}
.popupindex ul li{
list-style-type:none;
padding-left:1.5em;
text-indent:-1.5em;
margin-left:-1em;
}
/* ■■■■■■■■■ popup topic ■■■■■■■■■ */
div.popuptopic{
position:fixed;
top:5em;
left:0.1em;
font-size:88%;
visibility:hidden;
}
span.popuptopic_caption{
font-weight:bolder;
visibility:visible;
font-size:x-large;
color:#a0a0a0;
}
span.popuptopic_subcaption{
font-weight:bolder;
}
div.popuptopic_totop{
font-size:xx-large;
position:absolute;
/* right:1.5em; */
left:0.3em;
bottom:13%;
opacity:0.6;
}
div.popuptopic_totop a{
position:fixed;
}
div.popuptopic div.subnav{
margin:0 1.5em 0 3em;
}
div.popuptopic:hover{
visibility:visible;
background-color:#ffffff;
border:solid 1px #000000;
border-radius:20px;
min-height:6em;
max-height:70%;
min-width:50%;
max-width:90%;
z-index:999;
overflow:auto;
overflow-x:auto;
overflow-y:auto;
margin-left:-0.3em;
padding:0 1em 1em 0;
}
div.popuptopic ul li ul{
margin:0 0 0em -1.5em;
}
div.popuptopic ul li{
list-style-type:none;
text-indent:-1.2em;
padding-left:1.2em;
}
div.popuptopic ul li::before{
content:"§ ";
}
div.popuptopic ul li>ul>li::before{
content:"# ";
}
/* ■■■■■■■■■ navigations ■■■■■■■■■ */
.footer_navi{
text-align:center;
word-break:keep-all;
width:80%;
margin:auto;
}
ul.trail{
font-size:80%;
border:solid 1px #808080;
border-width:1px 0 1px 0;
margin:0 2em;
padding:0.3em 0;
}
li.trail_favicon{
display:inline;
list-style-type:none;
position:relative;
bottom:0.1em;
margin-left:0.3em;
margin-right:-0.3em;
}
li.trail_home{
display:inline;
list-style-type:none;
margin-left:0.1em;
}
li.trail{
display:inline;
list-style-type:none;
}
li.trail::before{
content:">";
margin-right:0.2em;
}
.jump{
margin:4em 1em;
word-break:keep-all;
text-align:center;
}
.navi{
margin:0.5em 1em 1em 1em;
word-break:keep-all;
text-align:center;
}
.favicon_png{
position:relative;
top:0.2em;
}
/* ■■■■■■ PostMail ■■■■■■*/
div.postmail{
border:solid 1px;
text-align:center;
width:95%;
margin:auto;
}
div.postmail_header{
background-color:#6384BD;
color:#ffffff;
padding:0.3em 0 0.3em 0;
}
.postmail_copyright{
font-size:60%;
font-family:Verdana,Helvetica,Arial;
margin:0 0.2em;
text-align:right;
}
textarea{
width:95%;
}
/* ■■■■■■■■■ css for mobile device ■■■■■■■■■ */
/* 414 x 736 (iphone's standard screen size???) */
/* 768 x 1024 (tablet's standard screen size???) */
@media (max-width:770px){
	/* 小画面ではdl,dt,ddを使った表を表示 */
	div.low_reso{
	display:block;
	}
	/* 小画面ではtableを使った表を非表示 */
	div.hi_reso{
	display:none;
	}
	/* ■■■■■■■■■ headers ■■■■■■■■■ */
	h1,h2,h3,h4,h5,h6{
	max-width:90%;
	letter-spacing:0;
	font-size:100%;
	}
	div.subtitle{
	font-weight:lighter;
	text-align:center;
	margin-right:auto;
	margin-left:auto;
	}
	/* ■■■■■■■■■ popup menu ■■■■■■■■■ */
	div[class^="popup"]:hover{
	border-radius:5px;
	}
	span.popupindex_caption{
	font-weight:bolder;
	}
	span.popuptopic_caption{
	font-size:x-large;
	}
	div.popuptopic_totop{
	display:none;
	}
	div.popuptopic .subnav{
	display:none;
	}
	/* ■■■■■■■■■ point index ■■■■■■■■■ */
	span.point_index_caption{
	border:solid 1px #c0c0c0;
	padding:0;
	border-right:solid 3px #c0c0c0;
	border-bottom:solid 3px #ffffff;
	}
	div.point_index{
	border:solid 1px #c0c0c0;
	border-right:solid 3px #c0c0c0;
	border-top-right-radius:0px;
	}
	/* ■■■■■■■■■ general ■■■■■■■■■ */
	body{
	margin:0.5em 1.3em;
	}
	div[class*="index"] a.index{
	padding:0.2em 0.5em;
	}
	.preface{
	margin:0em 5% 1.5em 5%;
	}
	div.article{
	margin:1em;
	}
	div.section{
	margin:0.5em;
	}
	div.article *{
	font-size:100%;
	}
	/* each page index */
	div.index{
	width:90%;
	}
	/* ■■■■■■■■■ list ■■■■■■■■■ */
	div[class^="popup"] li{
	margin-left:-1.5em;
	}
	.point_index li,.list li,rule li,.pattern li{
	margin-left:-1em;
	}
	[class$="_title"]{
	font-weight:normal;
	max-width:80%;
	}
	div.list_title,div.rule_title,div.pattern_title{
	border-width:0.5em;
	display:inline-block;
	border-radius:8px;
	}
	.pattern_title{
	padding:0.3em;
	margin:0;
	box-shadow:1px 1px #aaaaaa;
	}
	.pattern{
	box-shadow:1px 1px #aaaaaa;
	}
	.example{
	border-radius:10px;
	}
	span[class^="hg"]~span.comment,span[class^="hg"]~span.paraphrase{
	text-indent:-1em;
	padding-left:1em;
	margin:0 0 0 1em;
	}
	.note{
	border:4px #f0f0f0 solid;
	}
	.note_link{
	margin-left:0;
	}
	.insertion{
	margin-left:1em;
	}
	.correction{
	margin-left:1em;
	display:inline-block;
	text-indent:-1em;
	padding-left:1em;
	}
	.nb_footer{
	margin-left:0em;
	}
	/* ■■■■■■■■■ hanging ■■■■■■■■■ */
/* 	span[class^="hg"],li[class^="hg"],li[class^="compact"]{ */
	[class^="hg"],li[class^="compact"]{
	text-indent:-1em;
	padding-left:1em;
	}
	.nb_general{
	text-indent:-0.5em;
	padding-left:0.5em;
	}
	/* ■■■■■■■■■ table ■■■■■■■■■ */
	table *{
	font-family:normal;
	width:100%;
	}
	/* ■■■■■■■■■ jump (goto*) ■■■■■■■■■ */
	[class^="goto"],[class^="goto"] a{
	}
	.gotomainlist{
	margin:0;
	}
	.gotoitemtop{
	position:absolute;
	right:1.6em;
	font-weight:bolder;
	}
	.example .gotoitemtop{
	position:absolute;
	right:2.5em;
	font-weight:bolder;
	}
	.gotopagetop{
	display:none;
	}
	.gotopagetop::before{
	display:none;
	}
	.gotoindex{
	border-radius:0 20px 20px 0;
	position:absolute;
	right:2.2em;
	font-weight:bolder;
	background-color:#eeeeef;
	}
	.list .gotoindex{
	background-color:#eeeeff;
	}
	.rule .gotoindex{
	background-color:#efffee;
	}
	/* ■■■■■■■■■ on/off menu on index.html ■■■■■■■■■ */
	.top_nav input.summary,.top_nav label.summary,.top_nav .details{
	display:none;
	}
	/* ■■■■■■■■■ postmail ■■■■■■■■■ */
	div.postmail{
	width:100%;
	}
	/* ■■■■■■■■■ navigations ■■■■■■■■■ */
	div.nav{
	width:95%;
	}
	div.jump *,div.navi *, ul.trail *{
	font-weight:lighter;
	}
	li.trail_home{
	margin:0;
	}
	li.trail::before{
	content:">>";
	}
	/* ■■■■■■■■■ msearch (obsolete) ■■■■■■■■■ */
	.credit{
	font-size:xx-small;
	}
	/* ■■■■■■■■■ msearch (obsolete) ■■■■■■■■■ */
	div.msearch input[type]{
	max-width:80%;
	}
}