@CHARSET "UTF-8";

/* kk */

:root {
    --fontSize: 4vw;
}
* {
	box-sizing: border-box;
	padding: 0;
	margin:  0;
	font-family: sans-serif;
}
html, body {
    font-size: var(--fontSize);
}
#parent {
    width: 100vw; /* 最大化する */
    height: 100dvh;
    display: grid;
    grid-template-areas: "header" "center" "footer";
    grid-template-columns: auto;
    grid-template-rows: auto 1fr auto;
    column-gap: 0rem;
    row-gap: 0rem;
    padding: 0.3rem;    /* 8px 8px 8px; */
}
#center {/* この直下にスクロールするdivを置く */
    width: 100%;
    padding: 0.3rem;
    overflow-x: auto;
    overflow-y: auto;
    border-top: 0.2rem solid #888;
    border-bottom: 0.2rem solid #888;
}
#header {
	width: 100%;
    padding: 0.3rem;
	overflow: hidden;
}
#footer {
	width: 100%;
    padding: 0.8rem 0.3rem 0 0.3rem;
    text-align: right;
}
#info {
    font-weight: bold;
    font-size: 0.70rem;
    color: #e00;
}
#header ul {
    line-height: 1.05rem;
}
#header li:not(:last-child) {
    margin-bottom: 0.5rem;
}

#tbl-bdr table, #tbl-bdr td, #tbl-bdr th {
	border-collapse: collapse;
	border:0.1rem solid #333;
	padding: 0.3rem;
	margin: 0;
	word-break: break-all;
}
#tbl-bdr table {
    width: 96%; 
}
#tbl-bdr input[type="radio"], #tbl-bdr input[type="radio"]:checked {
	transform:scale(1.5);
}
#tbl-bdr input[type="radio"]:checked {
	color: #f00;
}
.caution {
    color: #e00;
    font-weight: bold;
}
#tbl-bdr tr:nth-child(odd) {
    background: #f0f0f0;
}
#tbl-bdr tr:nth-child(even) {
    background: #fdfdfd;
}
.abstract {
    font-size: 0.9rem;
	color: #222;
}
.full {
    font-weight: bold; color: #888;
}
.done {
    font-weight: bold; color: #0000e0;
}
.closed {
    font-weight: bold; color: #060;
}
.applied {
    font-weight: bold; color: #e00000;
}
hr {
    margin: 0.4rem 0;
	border:0.1rem solid #666;
}
h2 {
    font-weight: bold;
    font-size: 1.35rem;
}
h4 {
    font-weight: bold;
    font-size: 1.1rem;
}
ul {
	padding-inline-start: 1.5rem;
}
button {
    width: 6.0rem;
    height: 2.0rem;
    margin-left: 1.0rem;
    font-weight: bold;
    font-size: 1.0rem;
}

/* https://qiita.com/gilly/items/546adecd18a8db3fd059 */
/* @media (hover: hover) and (pointer: fine) { */
/* @media screen and (width > 480px) { */

@media (hover: hover) and (pointer: fine) {
    html, body {
        font-size: 16px;
    }
    #parent {
        width: 800px;
        height: 98dvh;
        margin: auto;
        border: 1px solid #666; 
    }
}