body {
    margin: 0;
    font-size: 12pt;
    font-family: 'Noto Sans JP', sans-serif;
}

.scroll {
    overflow-x: auto;
    height: calc(100vh - 10px);
    white-space: nowrap;
}
.scroll::-webkit-scrollbar{
 height: 10px;
}
.scroll::-webkit-scrollbar-track{
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {
 background: #BCBCBC;
}

table {
    overflow: scroll;
    height: 100%;
    zoom: 50%;
    width: 800mm;
    table-layout: fixed;
    border-collapse: collapse;
}

thead {
    display: block;
    position: sticky;
    width: 800mm;
    top: 0;
    z-index: 2;
}

th {
    height: 8mm;
    width: 100mm;
    text-align: left;
    border-bottom: solid 1px #323232;
}

td {
    height: 8mm;
    width: 100mm;
    padding: 0;
}

.person {
    color: #323232;
    font-weight: 700;
    border-bottom: solid 3px #323232;
}

.living {
    border-bottom-right-radius: 6mm;
}

.event {
    color: #c83200;
    font-weight: 700;
    border-bottom: solid 3px #c83200;
}
.event::after {
    content: close-quote"("attr(title)")";
}

.book, .theory, .movie, .painting, .music, .architecture, .design {
    color: #323232;
    font-size: 10pt;
    padding-left: 5px;
    border-left: solid 2px;
}

.book::before {
    content: open-quote;
}
.book::after {
    content: close-quote"("attr(title)")";
}

.theory::after {
    content: "("attr(title)")";
}

.movie::after {
    content: "("attr(title)")";
}

.painting::after {
    content: "("attr(title)")";
}

.music::after {
    content: "("attr(title)")";
}

.architecture::after {
    content: "("attr(title)")";
}

.design::after {
    content: "("attr(title)")";
}

a {
    color: #28b;
    text-decoration: none;
}