/*
+==============================================================================
|
|    Copyright(c) 2020 IMS. All Rights. Reserved.
|
|  ・システム     ： クリーニング店向けＰＯＳシステム
|
+==============================================================================
|
|   C01012D01（顧客検索ダイアログ画面）スタイルシート
|
|=== 改 版 履 歴 ==============================================================
| Date         Author           Reference                              Version
|==============================================================================
| 2021/01/20   IMS阿部          新規作成                               1.0.0
|
|
===============================================================================
*/
@charset "UTF-8";

/* 店舗検索タイトル部 */
div.search-title {
    height: 45px;
    border: 1px solid #013c95 !important;
    background-color: #013c95 !important;
    color: #ffffff;
    font-size: 15pt;
    text-align: left;
    padding-top: 8px;
    padding-left: 5px;
    padding-right: 5px;
    width: 937px;
}

    div.search-title:hover {
        cursor: pointer;
    }

/* 顧客会員検索 */
div.search-customer-area {
    height: 125px;
    width: 920px;
}

div.tempo-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 791px;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666;
}

/* 顧客検索ヘッダー */
table.customer-list-header {
    border-collapse: collapse;
    table-layout: fixed;
    word-wrap: break-word;
    overflow-y: visible;
    overflow-x: hidden;
    width: 921px;
    font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif !important;
}

    table.customer-list-header thead {
        border-collapse: collapse;
    }

    table.customer-list-header th {
        color: #ffffff;
        background: #778899;
        border: solid 1px #666666;
        font-size: 15pt;
        height: 45px;
    }

    table.customer-list-header thead > tr {
        border-collapse: collapse;
        float: left;
        height: 45px;
    }

        table.customer-list-header thead > tr > td {
            border: solid 1px #666666;
            height: 40px;
            font-size: 15pt;
            overflow-x: hidden;
            overflow-y: hidden;
            white-space: nowrap;
        }

table.customer-list tbody {
    float: left;
    overflow-y: auto;
}

    table.customer-list tbody > tr {
        float: left;
        border-collapse: collapse;
        height: 45px;
    }

        table.customer-list tbody > tr > td {
            border: solid 1px #666666;
            height: 45px;
            font-size: 15pt;
            font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif !important;
            overflow-x: hidden;
            overflow-y: hidden;
            white-space: nowrap;
        }

        table.customer-list tbody > tr td:hover {
            cursor: pointer;
        }

        table.customer-list tbody > tr.selected {
            background: #ffc753;
        }


    table.customer-list tbody td {
        height: 40px;
        font-size: 14px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        max-width: 0;
    }

div.customer-title {
    width: 15%;
    height: 35px;
    margin-top:5px;
}

.input-dll-tempo {
    height: 35px;
    width: 100% !important;
    max-width: 100% !important;
}

.input-text-memberno {
    height: 35px;
    width: 100% !important;
    max-width: 100% !important;
}

.customer-list {
    height: 361px !important;
    width: 938px !important;
}

.customer-reaize {
    height: 271px !important;
    width: 938px  !important;
}

.swich-joken-area {
    display: inline-flex;
    margin-left:10px;
}

.switch-joken {
    display: none;
}

    .switch-joken + label.switch-joken-label,
    .switch-joken + label.switch-joken-label::before,
    .switch-joken + label.switch-joken-label::after {
        -webkit-transition: all .2s;
        transition: all .2s;
    }

    .switch-joken + label.switch-joken-label {
        display: inline-block;
        position: relative;
        width: 80px;
        height: 33px;
        border-radius: 24px;
        cursor: pointer;
        border: solid 2px #b0adad;
    }

        .switch-joken + label.switch-joken-label::before {
            display: block;
            content: "後方";
            position: absolute;
            top: 1px;
            right: 7px;
            color: #ffffff;
            font-size: 20px;
        }

        .switch-joken + label.switch-joken-label::after {
            content: '';
            position: absolute;
            top: -2px;
            left: -5px;
            width: 33px;
            height: 33px;
            background-color: #f7f7f7;
            border-radius: 50%;
            border: solid 2px #b0adad;
        }

    .switch-joken:checked + label.switch-joken-label::before {
        content: "前方";
        left: 10px;
        right: auto;
        color: #ffffff;
    }

    .switch-joken:checked + label.switch-joken-label::after {
        left: 49px;
        background-color: #f7f7f7;
        border: solid 2px #b0adad;
    }

    .switch-joken:checked + label.switch-joken-label {
        background-color: #2596d2;
        border: solid 2px #b0adad;
    }

    .switch-joken + label.switch-joken-label {
        background-color: #968e8e;
        border: solid 2px #b0adad;
    }