:root,
html { font-size: 62.5%; }

#content .cf { zoom: 1; }
#content .cf:before, #content .cf:after { content: ''; display: table; }
#content .cf:after { clear: both; }

.cat-kakuto   { color: red; }
.cat-kinkyori { color: darkorange; }
.cat-shageki  { color: forestgreen; }
.cat-shien    { color: blueviolet; }
.cat-enkyori  { color: royalblue; }

.toc { margin: 20px; text-align: left; }
.toc-list { list-style: none; line-height: 1.5; font-size: 1.6rem; border-radius: 8px; box-shadow: 0 0 4px rgba(0,0,0,.1); }
.toc-list li { }
.toc-list a { margin-bottom: -1px; padding: 12px; border: 1px solid #00607e; display: block; color: #00607e; background-color: #fff; background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc1ODEiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTAwJSIgeTE9IjEwMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgo8c3RvcCBzdG9wLWNvbG9yPSIjRjRGNEY0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjRkZGRkZGIiBvZmZzZXQ9IjEiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNTgxKSIgLz4KPC9zdmc+); }
.toc-list a:before { display: inline-block; width: 1.6rem; vertical-align: middle; color: #e00; content: "\f105"; font-family: FontAwesome; font-size: 2.4rem; }	/* .fa-angle-right */
.toc-list li:first-child a { border-top-left-radius: 8px; border-top-right-radius: 8px; }
.toc-list li:last-child  a { border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
.toc-list .label { margin-right: .5em; border-bottom: 1px solid transparent; display: inline-block; vertical-align: middle; font-style: normal; font-weight: bold; }
.toc-list .name { display: inline-block; vertical-align: middle; }

.toc-list a:hover { color: #e00; background-color: #f2f2f2; background-image: none; }
.toc-list a:hover .label { border-bottom-color: #e00; }

.toc-list .current,
.toc-list .current:hover { background-color: rgba(0,96,126,.1); background-image: none; }
.toc-list .current:hover .label,
.toc-list .current:hover .name { color: #00607e; }
.toc-list .current:hover .label { border-bottom-color: transparent; }

.publication-notes { margin-top: 40px; }

.section + .induction { margin-top: 10px; }

.section { padding: 20px 0 12px 0; }
.section .section-head { margin-left: 20px; margin-right: 20px; }
.section-head-black { width: auto; background: #000; font-size: 2.5rem; }
.section-body { padding: 20px 20px 0; text-align: left; line-height: 1.5; font-size: 1.8rem; }
.section .section-body:first-child { padding-top: 0; }

.section p,
.section .block { margin: 1.8rem 0 0; display: block; }
.section-body p:first-child,
.section-body .block:first-child { margin-top: 0; }
.section .center { text-align: center; }
.section .right { text-align: right; }
.section .link { color: #e00; border-bottom: 0 solid #e00; }
.section .link:hover { border-bottom-width: 1px; }
.section .note { font-size: 1.4rem; }
.section .small { color: #888; font-size: 1.2rem; }
.section .toc { margin: 0; }
.section .fig { }
.section a { color: #e00; }

.section .bullet-list { list-style: none; }
.section .bullet-list > li { padding-left: 1em; text-indent: -1em; }
.section .bullet-list-block { margin: 1em 0 0; }

.section .bullet-beam > li { padding-left: 24px; position: relative; }
.section .bullet-beam > li:before { content: ""; position: absolute; top: .5em; left: 2px; display: inline-block; width: 14px; height: 6px; background-color: #3cf; }
.section .bullet-beam-block { margin: 1em 0 0; }

.section .button-wrap { margin: 12px 0 0; }
.section .button-wrap .button { padding: 16px; display: inline-block; color: #fff; background-color: #00607e; font-size: 2rem; font-weight: bold; border-radius: 8px; text-shadow: 1px 1px 1px rgba(0,0,0,.5); letter-spacing: 1px; text-decoration: none; }
.section .button-wrap .button:hover { background-color: rgba(0,96,126,.8); }
.section .button-wrap-center { text-align: center; }
.section .button-wrap-single .button { min-width: 50%; }

.section .heading-square { margin: 4rem 0 0; color: #00607e; font-size: 2.0rem; font-weight: bold; }
.section .heading-square:before { margin-right: .25em; content: ""; display: inline-block; width: .8em; height: .8em; background-color: #00607e; }
.section .heading-square + p { margin-top: 0; }
.section h3.heading-square { background: none; text-align: left; text-shadow: none; height: auto; line-height: normal;}

.section .table-spec { margin: 1em 0 0; width: 100%; border-collapse: collapse; border-spacing: 0; font-size: 1.6rem; }
.section .table-spec th,
.section .table-spec td { padding: .5em; border: 1px solid #ccc; box-sizing: border-box; vertical-align: middle; }
.section .table-spec th { width: 5%; white-space: nowrap; }
.section .table-spec thead th,
.section .table-spec thead td,
.section .table-spec tbody th { background-color: #eee; font-weight: bold; }

.section .flow { margin: 1em 0 0; }
.section .flow ol { margin: 0; padding: 0; list-style: none; }
.section .flow ol > li { margin: 1em 0 0; padding: 15px; border: 1px solid #ccc; position: relative; background-color: #f2f2f2; border-radius: 8px; }
.section .flow-arrow ol > li:nth-child(n+2) { margin-top: 40px; }
.section .flow-arrow ol > li:nth-child(n+2):before { display: block; position: absolute; top: -40px; line-height: 40px; width: 100%; color: #ccc; text-align: center; content: "\f107"; font-family: FontAwesome; font-size: 64px; }
.section .flow p:nth-child(n+2),
.section .flow .block:nth-child(n+2) { margin: 1.6rem 0 0; }

.section .fig-pane-white { padding: 5px; border: 1px solid #ccc; box-sizing: border-box; background-color: #fff; border-radius: 5px; text-align: center; }
.section .fig-pane-white img { width: 100%; }