/* @group @m-article-body */

[id*="toc_content"] {
display: grid;
align-content: var(--align-content);
grid-template-columns: repeat(1, 1fr);
gap: 1.5rem;
}

/* @end @m-article-body */

/* -------------------------------------------------------- */

/* @group @m-toc */

[class*="m-toc"] {
order: -1;
}

[class*="m-toc"]>div {
padding: 1.5rem 1.125rem;
background-color: var(--color-whitesmoke);
}

[class*="m-toc"] p {
text-align: center;
}

/*[class*="m-toc"] label:after {
content: '閉じる';
}

[class*="m-toc"] #toc-toggle:checked ~ div label:after {
content: '開く';
}*/

[class*="m-toc"] ul,
[class*="m-toc"] ol {
overflow: hidden;
max-height: 100rem;
transition: var(--transition);
}

[class*="m-toc"] #toc-toggle:checked ~ ul,
[class*="m-toc"] #toc-toggle:checked ~ ol,
[class*="m-toc"] #toc-toggle:checked ~ div ul,
[class*="m-toc"] #toc-toggle:checked ~ div ol {
max-height: 0;
}

/* @end @m-toc */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="m-toc"] {
--counter-list-marker-spacing: 1.875rem;
--counter-list-marker-spacing-child: 2.25rem;
--counter-list-marker-width: 1.875rem;
--counter-list-marker-child-width: 3rem;
--counter-list-line-height: 1.5;
}

/* @end @variables */

/* @group @m-toc */

[class*="m-toc"] div+ol,
[class*="m-toc"] p+ol {
margin-top: .75rem;
}

[class*="m-toc"] ol {
position: relative;
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: .75rem;
counter-reset: li-entry;
}

[class*="m-toc"] ol ol {
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: .375rem;
padding-top: .375rem;
counter-reset: li-entry-child;
}

[class*="m-toc"] li {
position: relative;
counter-increment: li-entry;
padding-left: var(--counter-list-marker-spacing);
}

[class*="m-toc"] ol>li:before {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
content: counter(li-entry)'.';
display: grid;
align-items: center;
width: var(--counter-list-marker-width);
/*font-size: var(--counter-list-font-size);
line-height: var(--counter-list-line-height);*/
speak: none;
}

[class*="m-toc"] ol ol>li {
padding-left: var(--counter-list-marker-spacing-child);
counter-increment: li-entry-child;
}

[class*="m-toc"] ol ol>li:before {
content: counter(li-entry) '-' counter(li-entry-child)'.';
width: var(--counter-list-marker-child-width);
}

/* @end @m-toc */