body {
    overflow-x: hidden;
}

:root {
    --primary-color: #9ad7ffe7;
    --education-color: rgba(128, 255, 0, 0.788);
    --footer-color: rgba(128, 255, 0, 0.788);
}

.logo>a {
    text-shadow: 2px 2px 5px var(--education-color);
}

/* フッター */
footer {
    padding-bottom: 10px;
    color: white;
}

footer {
    background-color: rgba(56, 85, 27, 0.788);
}

footer>div>ul>li>a {
    color: white;
}

.border-education {
    border-color: var(--education-color);
}




@media screen and (max-width:600px) {

    .grade-subtitle {
        font-size: 1em !important;
    }

    .explain {
        width: 95%;
    }

    .attention {
        font-size: .8em;
    }
}

/* PC */
@media screen and (min-width:601px) {

    .grade-title {
        padding: 2% !important;
    }

    .grade-subtitle {
        padding-bottom: 3%;
    }

    .example {
        font-size: 1.3em;
    }

    .explain {
        width: 60%;
        font-size: 1.2em;
    }

    td {
        font-size: 1.2em;
    }

    .access {
        display: flex;
        justify-content: space-around;
        align-items: center;
    }


}

.bb {
    border-right: 2px dotted var(--education-color);
    height: 7vh;
}

tr.elem-table {
    background: rgb(255, 221, 221);
}

tr.junior-table {
    background: rgb(204, 207, 255);
}

tr.high-table {
    background: rgb(204, 255, 208);
}

table {
    border: rgba(0, 0, 0, 0.24) !important;
    margin-bottom: 0 !important;
}

td {
    text-align: center;
}

.content-subtitle {
    width: fit-content;
    padding-left: 5px;
    font-size: 1.3em;
    border-left: 10px solid var(--education-color);
    margin: 3vh auto;
}

.elementary {
    margin: 3vh auto 0;
    padding-bottom: 5vh;
    background: rgba(255, 194, 154, 0.349) !important;
}

.junior {
    margin: 0 auto;
    padding-bottom: 5vh;
    background: rgba(154, 154, 255, 0.349);
}

.grade-title {
    padding: 3%;
    text-align: center;
    font-size: 1.6em;
    font-weight: 900;
    font-family: serif;
}

.grade-subtitle {
    font-family: serif;
    font-size: 1.4em;
    text-align: center;
}

.grade-example>.example {
    margin: 15px 10px;
    font-family: serif;
    padding: 2px 5px;
}

.elementary>.grade-example>.example {
    border: 1px solid rgba(129, 75, 36, 0.24);
    background: rgb(255, 221, 221);
    color: rgb(129, 75, 36);
}

.junior>.grade-example>.example {
    border: 1px solid rgba(36, 45, 129, 0.24);
    background: rgb(204, 207, 255);
    color: rgb(36, 42, 129);
}