section#page-content > * {
    line-height: 1.5em;
}
h3 {
    color: #0000DD;
    font-weight: bold;
    font-size: 1.2em;
    margin: 0.5em 0;
}
li {
    list-style: none;
}
section.news > h3 + p {
    text-align: right;
    color: #666;
    margin: 0.5em 0;
}

.fa-file-pdf {
    margin-right: 0.5em;
}
summary {
    cursor: pointer;
}
div.file {
    margin: 10px 0;
    padding: 5px;
    background-color: #EEE;
}

/* 1024px以上でasideを左に表示 */
@media screen and  (min-width: 1024px) {
    section#page-content {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }
    aside {
        /* position: -webkit-sticky; /* safari対応 */
        top: 20px;
        position: sticky;
        flex-basis: 25%;
        margin: 0 10px;
    }
    article {
        flex-basis: 75%;
        padding: 0 10px;
    }
    article > section.bordered, article > section.news {
        margin: 30px 10px;
    }
    details {
        display: none;
    }
}
@media screen and  (max-width: 1023px) {
    article > section.news {
        margin: 10px 0;
    }
    aside {
        display: none;
    }
}

/* アンカーリンク（目次） */
.anchor-title {
    display: inline-block;
    width: calc(100% - 26px);
    padding: 10px;
    background-color: #1C1E76;
    border: 3px solid #1C1E76;
    color: white;
    margin-bottom: 5px;
}
ul.anchor > li > a {
    display: inline-block;
    width: calc(100% - 26px);
    padding: 10px;
    background-color: #CACBF2;
    border: 3px solid #CACBF2;
    color: #1C1E76;
    margin-bottom: 5px;
}
ul.anchor > li > a:hover {
    background-color: white;
}

/* 他のページを表示 */
ul.other {
    padding: 0;
}
@media screen and (min-width: 1024px) {
    ul.other {
        text-align: center;
    }
}
ul.other > li {
    list-style: none;
    height: 100px;
    margin: 10px;
}
@media screen and (min-width: 1024px) {
    ul.other > li {
        display: inline-block;
        width: 20em;
    }
}
@media screen and (max-width: 1023px) {
    ul.other > li {
        width: 100%;
        max-width: 20em;
        margin: 10px auto;
    }
}

ul.other > li > a {
    text-decoration: none;
    color: white;
    display: block;
  transition-duration: 0.2s;
    height: 100%;
    width: 100%;
    padding: 0;
}
ul.other > li > a:hover {
    color: black;
}

ul.other > li > a > div {
    position: relative;
  transition-duration: 0.2s;
    height: 100%;
    width: 100%;
}

ul.other > li > a > div > p {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
    line-height: 2em;
}

ul.other > li > a.bg_63 > div {
    background-color: rgba(11, 36, 32, 0.8);
}
ul.other > li > a.bg_63:hover > div {
    background-color: rgba(197, 247, 239, 0.8);
}
ul.other > li > a.bg_62 > div {
    background-color: rgba(11, 36, 32, 0.8);
}
ul.other > li > a.bg_62:hover > div {
    background-color: rgba(197, 247, 239, 0.8);
}