/*--------------------------------------------------------------------------*/
/*スマホ表示*/
@media screen and (max-width: 768px) {
    form#listform {
        margin-top: 2em;
    }
    .adm-table {

        border-collapse: collapse;
        border-spacing: 0;
        text-align: center;
    }
    .adm-table thead {
        background-color: #FAFAFA;
    }
    .adm-table th {
        padding: 0 0.5em;
        font-weight: 500;
        font-size: 1em;
        color: #4A4A4A;
        border: 1px solid #EAEAEA;

        /* koi */
        background-color: #444;
        color: #fff;
        text-align: center;
    }
    .adm-table td {
        padding: 0 0.5em;
        font-weight: 500;
        font-size: 1em;
        color: #4A4A4A;
        vertical-align: middle;
        border: 1px solid #EAEAEA;
    }
    .adm-table .odd {
        background-color: #FBFBFB;
    }
    .adm-table a {
        text-decoration: none;
    }
    .adm-table select {
        padding: 0.5em;
        border: 1px solid #E0E0E0;
        border-radius: 8px;
        background-color: #FAFAFA;
        color: #4A4A4A;
    }
    .adm-table .btn_change_clinic {
        margin-left: 10px;
        padding: 8px 12px;
        background-color: #4c4c4c;
        color: #FFFFFF;
        border: none;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }
    .adm-table .btn_change_clinic:hover {
        background-color: #222222;
    }

    .product p {
        margin: 0;
        color: #555;
    }


    .table-wrapper {
        overflow-x: auto;
    }
    .adm-table td, .adm-table th {
        min-width: 80px;
    }
    .nonactv {
        cursor: not-allowed;
        color: #CCCCCC;
    }
    .search-pager {
        display: flex;
        align-items: center;
        flex-direction: column;
    }
    .data {
        font-size: 1em;
        color: #4A4A4A;
    }
    .btns {
        display: flex;
        align-items: center;
    }
    .scope {
        font-size: 0.1em;
        padding: 0.1em 0.1em;
        border: 1px solid #E0E0E0;
        color: #4A4A4A;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }

    .mvpg {
        display: none;
    }

    .pgnum {
        padding: 0.1em 0.2em;
        margin: 0 0.1em;
        border: 1px solid #E0E0E0;
        color: #4A4A4A;
        border-radius: 8px;
        transition: background-color 0.3s ease;
    }

    .pgnum.actv {
        background-color: #4c4c4c;
        color: #FFFFFF;
    }
    .file-image {
        width: 3em;
        height: 3em;
        text-decoration: none;
    }
    .icon-sort {
        color: #fff;
        font-size: 1.1em;
    }
    .icon-sort.current,
    .icon-sort:hover {
        color: #ff9581;
    }
}

/*--------------------------------------------------------------------------*/
/*PC表示*/
@media screen and (min-width: 769px) {
    form#listform {
        /* margin-top: 2em; */
    }
    .adm-table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
        text-align: center;
    }
    .adm-table thead {
        background-color: #FAFAFA;
    }
    .adm-table th {
        padding: 1em;
        font-weight: 500;
        font-size: 14px;
        color: #4A4A4A;
        border: 1px solid #EAEAEA;

        /* koi */
        background-color: #444;
        color: #fff;
        text-align: center;
    }
    .adm-table td {
        padding: 1em;
        font-weight: 500;
        font-size: 1em;
        color: #4A4A4A;
        vertical-align: middle;
        border: 1px solid #EAEAEA;
    }
    .adm-table .odd {
        background-color: #FBFBFB;
    }
    .adm-table a {
        text-decoration: none;
    }
    .adm-table a:hover {
        opacity: 0.5;
    }
    .adm-table select {
        padding: 0.5em;
        border: 1px solid #E0E0E0;
        border-radius: 8px;
        background-color: #FAFAFA;
        color: #4A4A4A;
    }
    .adm-table .btn_change_clinic {
        margin-left: 10px;
        padding: 8px 12px;
        background-color: #4c4c4c;
        color: #FFFFFF;
        border: none;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }
    .adm-table .btn_change_clinic:hover {
        background-color: #222222;
    }
    .adm-table .note {
        max-width: 250px;
        white-space: normal;
        font-size: 12px;
        color: #666;
    }
    .product p {
        margin: 0;
        color: #555;
    }

    [data-tooltip]:hover::before {
        content: attr(data-tooltip);
        position: absolute;
        white-space: nowrap;
        background-color: #333;
        color: #FFF;
        padding: 8px 12px;
        border-radius: 8px;
        font-size: 12px;
        bottom: 25px;
    }
    .table-wrapper {
        overflow-x: auto;
    }
    .adm-table td, .adm-table th {
        min-width: 80px;
    }
    .nonactv {
        cursor: not-allowed;
        color: #CCCCCC;
    }
    #tableContent .pager-wrap {
        display: flex;
        align-items: baseline;
        justify-content: flex-start;
        flex-wrap: wrap;
        /* margin-bottom: 1em; */
    }
    .search-pager {
        margin: 1em 0; /* Top, Right, Bottom, Left margin */
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .search-pager .data {
        font-size: 1em;
        color: #4A4A4A;
        margin-right: 1em;
        white-space: nowrap;
    }
    .btns {
        display: flex;
        align-items: center;
        white-space: nowrap;
    }
    .scope, .mvpg {
        padding: 0.4em 0.8em;
        margin: 0 5px;
        border: 1px solid #E0E0E0;
        color: #4A4A4A;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }
    .scope:hover, .mvpg:hover {
        background-color: #F0F4FF;
    }
    .pgnum {
        padding: 0.4em 0.8em;
        margin: 0 5px;
        border: 1px solid #E0E0E0;
        color: #4A4A4A;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }

    .pgnum.actv {
        background-color: #4c4c4c;
        color: #FFFFFF;
    }

    .pgnum:hover {
        background-color: #F0F4FF;
    }
    .file-image {
        width: 3em;
        height: 3em;
        text-decoration: none;
    }

    .icon-sort {
        color: #fff;
        font-size: 1.1em;
    }
    .icon-sort.current,
    .icon-sort:hover {
        color: #ff9581;
    }
}