/********** 検索結果テーブル **********/
table.result {
    border-top: 1px solid #006666;
    border-left: 1px solid #006666;
    border-collapse: collapse;
    empty-cells: show;
    width: 100%;
    margin-top: .25em;
}

    table.result,
    table.result > thead,
    table.result > tbody {
        /*display: block;*/
    }

        table.result > thead > tr,
        table.result > tbody > tr {
            /*display: flex;*/
        }

            table.result > thead > tr > th,
            table.result > tbody > tr > td {
                /*    display: inline-block; */
            }

        table.result th {
            font-weight: normal;
            margin: 0px;
            padding: 2px;
            background-color: #8fca8f;
            text-align: left;
            vertical-align: middle;
            word-wrap: break-word;
            border-right: 1px solid #006666;
            border-bottom: 1px solid #006666;
        }

        table.result .col1 {
            width: 0;
        }

        table.result .col2 {
            width: 10em;
        }

        table.result .col3 {
            width: 30%;
        }

        table.result .col4 {
            width: 8em;
        }

        table.result .col5 {
            width: 0;
        }

        table.result .col6 {
            width: 3em;
        }

        table.result .col7 {
            width: 15%;
        }

        table.result .col9 {
            width: 12%;
            min-width: 1em;
        }

        table.result .col10 {
            width: 8em;
        }

        table.result .col8 {
            width: 1.6em;
        }

        table.result td.col1 {
            white-space: nowrap;
        }

        table.result td.col2,
        table.result td.col3,
        table.result td.col4,
        table.result td.col5,
        table.result td.col7 {
            word-wrap: break-word;
        }

        table.result td.col6 {
            text-align: center;
        }

            table.result td.col6 span {
                display: inline-block;
                text-align: right;
                width: 2em;
            }

        table.result td.col8 {
            text-align: center;
        }

        table.result th > a > div {
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            align-content: center;
        }

            table.result th > a > div > div.text {
                flex-grow: 1;
                flex-shrink: 1;
                text-align: center;
                word-break: break-word;
            }
            /*table.result th > div > div:first-child a {
                    display:inline-block;
                    width:100%;
                    word-break:break-word;
                }*/
            table.result th > a > div > div.icon {
                flex-grow: 0;
                flex-shrink: 0;
            }

        table.result td > span > span {
            display: inline-block;
            word-break: break-word;
        }

        table.result > tbody > tr {
            cursor: pointer;
            /*position: relative;*/
            transform: translate(0);
            clip-path: inset(0);
        }

            table.result > tbody > tr:hover {
                text-decoration: underline;
                color: red;
            }

            table.result > tbody > tr:nth-child(2n+1) {
                background-color: white;
            }

            table.result > tbody > tr:nth-child(2n) {
                background-color: #eeffee;
            }

        table.result td {
            margin: 0px;
            padding: 2px;
            vertical-align: middle;
            border-right: 1px solid #006666;
            border-bottom: 1px solid #006666;
        }

            table.result td.col8 a {
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                display: flex;
                flex-direction: row;
                justify-content: flex-end;
                inset: 0;
            }
                table.result td.col8 a:link,
                table.result td.col8 a:visited,
                table.result td.col8 a:hover,
                table.result td.col8 a:active {
                    text-decoration: none;
                }
                table.result td.col8 a span {
                    color: #066;
                    display: inline-block;
                    padding-right: 0.25em;
                }
                    table.result td.col8 a:hover span,
                    table.result td.col8 a:active span {
                        color: red;
                    }
label.btn-container {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    margin-right: .5em;
    position: relative;
}

    label.btn-container:not(.invisible) {
        display: inline-flex;
    }

    label.btn-container > input {
        position: absolute;
        z-index: 1;
        width: 1em;
        height: 1em;
        top: 0;
        left: .2em;
    }

    label.btn-container > span {
        padding-left: 1.4em;
        display: inline-block;
        word-wrap: break-word;
    }

    label.btn-container > input:disabled + span {
        color: #999;
    }

input[type="text"],
input[type="search"] {
    width: 20em;
    -webkit-appearance: none;
}

.flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

    .flex-container span {
        display: inline-block;
        flex-grow: 0;
        flex-shrink: 0;
    }

        .flex-container span:last-child {
            flex-grow: 1;
            flex-shrink: 1;
        }

span.notice {
    padding-left: 1.5em;
    text-indent: -1.5em;
    font-size: 0.8em;
    color: Red;
}

.search-btn input[type="button"] {
    margin-left: 1em;
    margin-right: 1em;
}

.pager {
    margin-top: .25em;
    display: inline-block;
    white-space: nowrap;
}

.page-disp {
    float: right;
}

.pager a {
    margin-right: .5em;
    padding-right: .125em;
    padding-left: .125em;
}

    .pager a.currentPage {
        border: 1px solid #006666;
        background-color: #006666;
        color: #fff;
    }

    .pager a span {
        height: .75em;
        line-height: .75em;
        border: none;
        display: inline-block;
        white-space: nowrap;
        position: relative;
    }

        .pager a span::before,
        .pager a span::after {
            width: .75em;
            height: .75em;
            content: "";
            display: inline-block;
            border: 0.375em solid transparent;
        }

        .pager a span.first::before,
        .pager a span.first::after {
            border-right-color: #006666;
        }

        .pager a span.first::after {
            position: absolute;
            top: 0;
            left: -0.375em;
        }

        .pager a span.last::before,
        .pager a span.last::after {
            border-left-color: #006666;
        }

        .pager a span.last::after {
            position: absolute;
            top: 0;
            left: 0.375em;
        }

@media only screen and (max-width: 768px) {
    html:not(.no-responsive) select {
        width: 100%;
    }

        html:not(.no-responsive) select > option {
            white-space: normal;
        }

    html:not(.no-responsive) .flex-container {
        flex-direction: column;
        flex-wrap: wrap;
    }

    html:not(.no-responsive) td.btn-container {
        line-height: 1.8em;
    }

    html:not(.no-responsive) label.btn-container {
        line-height: 1.15em; /* normalize.cssの値 */
    }

        html:not(.no-responsive) label.btn-container > input {
            top: .3em;
        }

        html:not(.no-responsive) label.btn-container > span {
            border: 1px solid #999;
            border-radius: .25em;
            padding-top: .15em;
            padding-right: .15em;
            padding-bottom: .15em;
            background: linear-gradient(#ccffcc, #8fca8f);
            text-shadow: 1px 1px 0px #ccffcc;
        }

        html:not(.no-responsive) label.btn-container > input:checked + span {
            background: linear-gradient(#6d996d, #8fca8f);
        }

    html:not(.no-responsive) .search-btn {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: center;
    }

        html:not(.no-responsive) .search-btn input[type="button"] {
            padding: 0.5em 2em;
        }

    html:not(.no-responsive) .pager {
        line-height: 2.5em;
    }

        html:not(.no-responsive) .pager a {
            border: 1px solid #006666;
            padding: .5em;
        }

            html:not(.no-responsive) .pager a:not(.currentPage) {
                background-color: #eeffee;
            }

            html:not(.no-responsive) .pager a:link,
            html:not(.no-responsive) .pager a:visited,
            html:not(.no-responsive) .pager a:hover,
            html:not(.no-responsive) .pager a:active {
                color: black;
                text-decoration: none;
            }

    html:not(.no-responsive) table.result {
        border-right: 1px solid #006666;
    }

        html:not(.no-responsive) table.result > thead,
        html:not(.no-responsive) table.result > tbody,
        html:not(.no-responsive) table.result > thead > tr > th,
        html:not(.no-responsive) table.result > tbody > tr > td {
            display: block;
        }

            html:not(.no-responsive) table.result > thead > tr {
                background-color: #8fca8f;
            }

        html:not(.no-responsive) table.result tr {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            margin-bottom: .25em;
            position: relative;
            padding-right: 1.6em;
            border-top: 1px solid #006666;
            border-right: none;
            border-bottom: none;
            /*border-left: 1px solid #006666;*/
        }

        html:not(.no-responsive) table.result thead tr {
            /*border-right: 1px solid #006666;*/
            border-bottom: 1px solid #006666;
            border-top: none;
        }

        html:not(.no-responsive) table.result td,
        html:not(.no-responsive) table.result th {
            border-top: none;
            border-right: 1px solid #006666;
            border-bottom: 1px solid #006666;
            border-left: none;
        }

            html:not(.no-responsive) table.result th.col3 {
                border-bottom: none;
            }

        /*        html:not(.no-responsive) table.result .col1 { /*登録番号*/
        /*            width: 5em;
            order: 1;
        }*/

        html:not(.no-responsive) table.result .col2 { /*時限*/
            width: 30%;
            flex-grow: 1;
            order: 2;
        }

        /*        html:not(.no-responsive) table.result .col5 { /*教室*/
        /*            width: 7em;
            order: 3;
        }*/

        html:not(.no-responsive) table.result .col7 { /*開講学部学科*/
            width: 50%;
            order: 4;
            flex-grow: 1;
        }

        html:not(.no-responsive) table.result .col6 { /*単位*/
            width: 20%;
            order: 5;
            border-right: none;
        }

        html:not(.no-responsive) table.result .col9 { /*クラス*/
            width: 30%;
            order: 6;
        }

        html:not(.no-responsive) table.result td.col9 {
            min-height: 1em;
        }

        html:not(.no-responsive) table.result .col10 { /*メッセージ*/
            width: 70%;
            order: 7;
            flex-grow: 1;
            border-right: none;
        }

        html:not(.no-responsive) table.result .col4 { /*教員名*/
            width: 100%;
            order: 8;
            border-right: none;
        }

        html:not(.no-responsive) table.result .col3 { /*科目*/
            width: 100%;
            order: 9;
            border-right: none;
        }

        html:not(.no-responsive) table.result th {
            white-space: normal;
            word-wrap: break-word;
            border-top: none;
        }

            html:not(.no-responsive) table.result th.col8 { /*詳細リンク（ヘッダ）*/
                display: none;
            }


        html:not(.no-responsive) table.result td.col8 { /*詳細リンク(データ)*/
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            width: 100%;
            border-right: none;
        }

            html:not(.no-responsive) table.result td.col8 a {
                /*position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                width: 100%;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;*/
                justify-content: flex-end;
            }

                html:not(.no-responsive) table.result td.col8 a::before {
                    /*position: relative;
                    display: block;
                    content: "";
                    width: 1.2em;
                    height: 1.2em;
                    background-color: #8fca8f;
                    margin-right: .2em;
                    border-radius: 50%;*/
                }

                html:not(.no-responsive) table.result td.col8 a::after {
                    /*position: relative;
                    display: block;
                    content: "";
                    width: 0;
                    height: 0;
                    background-color: transparent;
                    left: 1em;
                    border: .5em solid transparent;
                    border-left-color: white;
                    border-right: none;
                    box-sizing: content-box;*/
                }

    /*html:not(.no-responsive) table.result td.col8 a span {
                    display: none;
                }*/
}

@media only screen and (max-width: 479px) {
    html:not(.no-responsive) input[type="text"],
    html:not(.no-responsive) input[type="search"] {
        width: 100%;
    }

    html:not(.no-responsive) td.btn-container {
        line-height: 2.5em;
    }

    html:not(.no-responsive) label.btn-container {
    }

        html:not(.no-responsive) label.btn-container.full-width {
            margin-left: 0;
            margin-right: 0;
            width: 100%;
        }

        html:not(.no-responsive) label.btn-container.half-width {
            margin-left: 0;
            margin-right: 0;
            width: 48%;
        }

        html:not(.no-responsive) label.btn-container > input {
            width: 2em;
            height: 2em;
            top: .4em;
        }

        html:not(.no-responsive) label.btn-container > span {
            left: -2em;
            padding-left: 2.4em;
            min-height: 2.6em;
        }

        html:not(.no-responsive) label.btn-container.full-width > span,
        html:not(.no-responsive) label.btn-container.half-width > span {
            width: 100%;
        }

    html:not(.no-responsive) table.result .col5 { /*教室*/
        width: 5em;
        border-right: none;
    }
}