
html, body {
    padding: 0;
    margin: 0;
    font-family: Tahoma, sans-serif;
    background: #21476b;
    color: #fff;
}

p {
    text-align: center;
}

a {
    color: #71baff;
    background-color: #ffffff00;
    transition-duration: 0.3s;
}

p a {
    display: inline-block;
    padding: 0.3rem 0.4rem;
    border-radius: 0.3em;
}

a:hover {
    background-color: #ffffff0f;
}

b {
    padding: 1em 0 0.5em 0;
    display: block;
    position: relative;
}

#content {
    padding: max(min(1vh, 1vw), 15px);
    max-width: max(39em, 800px);
    font-size: max(min(2.5vh, 2.5vw), 13px, 120%);
    margin: 0 auto;
}

.table_area {
    background-color: #00000017;
    border-radius: 0.3em;
    padding: 1em 1.5em;
    margin-bottom: 2em;
}

.table_line {
    display: flex;
    width: -webkit-fill-available;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    border-bottom: solid 1px #ffffff0a;
    padding-bottom: 0.45em;
    margin-bottom: 0.25em;
}

.table_line>* {
    flex: 1 1 0;
    width: inherit;
    text-align: left;
}

.table_line.table_line_ok div, .table_line.table_line_ok a {
    text-decoration: line-through;
    color: #25537e !important;
}

.table_line:first-of-type {
    border-bottom: solid 1px #ffffff17;
}

.table_line>div:first-of-type {
    flex: 0 0 0;
    color: #fff !important;
    text-decoration: none;
    margin-right: 0.4em;
}

.spoiler_area {
    border: dotted 0.3em #0000002b;
    border-radius: 0.9em;
    padding: 0.5em;
}

.spoiler_bt {
    background-color: #2b71b3;
    border-radius: 0.4em;
    color: #fff;
    text-align: center;
    padding: 0.45em;
    transition-duration: 0.3s;
    cursor: pointer;
    user-select: none;
}
.spoiler_bt:hover {
    background-color: #367dc1;
}

.spoiler_win {
    display: none;
}
.spoiler_area[spoiler_open="1"] .spoiler_win {
    display: block;
}
.spoiler_area .spoiler_bt span:last-of-type {
    display: none;
}
.spoiler_area[spoiler_open="1"] .spoiler_bt span:first-of-type,
.spoiler_area[spoiler_open="0"] .spoiler_bt span:last-of-type {
    display: none;
}
.spoiler_area[spoiler_open="0"] .spoiler_bt span:first-of-type,
.spoiler_area[spoiler_open="1"] .spoiler_bt span:last-of-type {
    display: inline;
}

@media (max-width: 800px) {
    .table_area {
        font-size: max(min(2.2vh, 2.2vw), 13px, 90%);
    }
}