/* HiElf Base Css                */
/* 作成日：2020/08/24            */
/* 群馬学校給食                  */
/* 作成者：ASC                   */
/* 追加　：**年**月**日:追加内容 */

/****************/
/* 画面デザイン */
/****************/


/* ボディ */
body {
    font-family: 'MS Gothic';
    font-size: 16px;
}

/* ヘッダー */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background-color: #007ACC;
    color: white;
    display: flex;
    align-items: center;
    padding-left: 10px;
    z-index: 1000;
}

.fixed-header {
    /*border-collapse: collapse;*/
    width: 100%;
    height:100%;
    top: 0;
    left: 0;
}

.fixed-header th,
fixed-header td{
    border:1px solid #ddd;
    padding:0px;
    text-align:left;
}

.fixed-header thead{
    display:table;
    width:100%;
    table-layout:fixed;
}

.table-body-wrapper{
    max-height:100px;
    /*overflow-y:auto;*/
}

.table-body-wrapper table{
    display:table;
    width:100%;
    table-layout:fixed;
}

/*  */
.content {
    margin-top: 60px; /* ヘッダー高さ分ずらす */
    height: calc(100vh - 60px);
    overflow-y: auto;
    padding: 10px;
    background-color: #f4f4f4;
}

/* フッタ */
footer {
    margin-left: 10px;
    width: 1533px;
}

/* タイトル帯 */
.TaitoleBar {
    width: 100%;
}

/* ボタン帯 */
.ButtonContainer {
    margin-right: 10px;
}

/* メッセージ帯 */
.ValidateMassage {
    color: red;
    margin-bottom: 8px;
    margin-left: 10px;
    margin-right: 10px;
}

/* 主処理表示帯 */
.body-content {
    width: 100%;
    padding: 0;
}

/*.modal-body {
    position: fixed;
    top: 30%;
    left: 30%;
    width: 400px;
    background: white;
    border: 1px solid black;
    padding: 20px;
    z-index: 1000;
}*/

/********************/
/* テーブルデザイン */
/********************/
/* タイトルテーブル */
.TitleTable {
    min-width: 99%;
    border-collapse: collapse;
    vertical-align: bottom;
}

    .TitleTable th, .TitleTable tr {
        padding: 0;
        margin: 0;
    }

    .TitleTable .th1 {
        width: 100px;
        text-align: left;
    }

    .TitleTable .th2 {
        width: 300px;
        text-align:left;
    }

    .TitleTable .th3 {
        width: 100px;
        text-align: left;
    }

    .TitleTable .th4 {
        width: 400px;
        text-align: right;
    }

    .TitleTable .th5 {
        width: 200px;
        text-align: left;
    }

    .TitleTable .th1 input[type="image"] {
        width: 100px;
        height: auto;
    }

    .TitleTable .th2 input[type="image"] {
        width: 300px;
        height: auto;
    }

/* 検索用テーブル */
.SearchTableForHeader {
    margin-left: 10px;
    margin-right: 10px;
    width: 100%;
    font-family: 'MS Gothic';
    background-color: #8ED973;
    color: #ffffff;
}

    .SearchTableForHeader thead {
        visibility: hidden;
    }

        .SearchTableForHeader thead th {
            text-align: right;
            height: 0px;
            padding-top: 0px;
            padding-bottom: 0px;
            color: #005243;
            width: 10%;
        }

        .SearchTableForHeader thead tr {
            height: 0px;
        }

    .SearchTableForHeader tbody {
    }

        .SearchTableForHeader tbody th {
            text-align: right;
            height: 10px;
            color: #ffffff;
            background-color: #316745
        }

        .SearchTableForHeader tbody td {
            text-align: left;
            height: 30px;
        }

    .SearchTableForHeader input[type="text"] {
        font-size: medium;
        height: 25px;
    }

/* 検索用テーブル */
.SearchTable {
    margin-left: 10px;
    margin-right: 10px;
    width: 100%;
    font-family: 'MS Gothic';
    background-color: #DAF2D0;
}

    .SearchTable thead {
        visibility: hidden;
    }

        .SearchTable thead th {
            text-align: right;
            height: 0px;
            padding-top: 0px;
            padding-bottom: 0px;
            color: #005243;
            width: 10%;
        }

        .SearchTable thead tr {
            height: 0px;
        }

    .SearchTable tbody {
    }

        .SearchTable tbody th {
            text-align: right;
            height: 10px;
            color: #ffffff;
            background-color: #316745
        }

        .SearchTable tbody td {
            text-align: left;
            height: 30px;
        }

    .SearchTable td.label {
        text-align: right;
        color: #275317;
        background-color: #8ED973;
    }

    .SearchTable td.LabelText {
        text-align: center;
        color: #275317;
        background-color: #8ED973;
    }

    /*単校複校用*/
    .SearchTable td.labelTH {
        text-align: center;
        border: 1px solid black;
        color: #ffffff;
        background-color: #316745;
    }
    /*下線表示なし*/
    .SearchTable td.labelTHDown {
        text-align: center;
        border: 1px solid black;
        border-bottom: none;
        color: #ffffff;
        /*background-color: #316745;*/
    }

    .SearchTable td.labelTHColor {
        text-align: center;
        border: 1px solid black;
        border-bottom: none;
        color: black;
    }

    .SearchTable input[type="text"] {
        font-size: medium;
        }

/* グリッド関連 */
.GridHeader {
    background-color: #316745;
    font-family: 'MS Gothic';
    font-size: small;
    font-weight: normal;
    color: white;
    text-align: center;
}

.GridRow {
    background-color: #d6e9ca;
    font-family: 'MS Gothic';
    font-size: small;
    text-align: left;
}

.ListFont {
    font-family: 'MS Gothic';
    font-size: small;
    text-align: center;
}

.GridAlternatingRow {
    background-color: White;
    text-align: left;
}

/* 一覧表示用テーブル */
.ViewTable {
    margin-left: 10px;
    /* margin-right: 10px; */
    /*width: 99%; margin-rightが機能しないため */
}

    .ViewTable th {
        /* 見出し */
        padding: 0px 1px 0px 1px;
        color: #ffffff;
        background-color: #316745;
        text-align: center;
        white-space: nowrap;
    }

    .ViewTable tr:nth-child(2n) {
        /* 偶数行 */
        background-color: #ffffff;
        font-size:medium;
    }

    .ViewTable tr:nth-child(2n+1) {
        /* 奇数行 */
        background-color: #d6e9ca;
        font-size: medium;
    }

    .ViewTable td {
        /* 通常のセル */
        height: 20px;
        padding: 0px 2px 0px 2px;
        vertical-align: middle;
        max-width: 100px;
        white-space: normal;
        word-break: break-all;
    }

    .ViewTable input[type="text"] {
        height: 25px;
    }

/* 一覧表示用テーブル */
.ViewTableForFukukou {
    margin-left: 10px;
}

    .ViewTableForFukukou th {
        /* 見出し */
        padding: 0px 1px 0px 1px;
        color: #ffffff;
        background-color: #316745;
        text-align: center;
        white-space: nowrap;
    }

    .ViewTableForFukukou tr:nth-child(2n) {
        /* 偶数行 */
        background-color: #d6e9ca!important;
        font-size: medium;
    }

    .ViewTableForFukukou tr:nth-child(2n+1) {
        /* 奇数行 */
        background-color: #d6e9ca;
        font-size: medium;
    }

    .ViewTableForFukukou td {
        /* 通常のセル */
        height: 20px;
        padding: 0px 2px 0px 2px;
        vertical-align: middle;
        max-width: 100px;
        white-space: normal;
        word-break: break-all;
    }

    .ViewTableForFukukou input[type="text"] {
        height: 25px;
    }

/* 入力用テーブル */
.InputTable {
    padding: 10px 10px 10px 10px;
    border-collapse: collapse;
    border: 1px solid LightGray;
    width: 100%;
    table-layout: fixed;
    word-break: break-all;
    word-wrap: break-word;
}

    .InputTable thead {
        height: 0px;
        visibility: hidden;
    }

    .InputTable tbody {
    }

        .InputTable tbody tr {
            border-collapse: collapse;
            border: 1px solid LightGray;
            height: 40px;
        }

        .InputTable tbody th {
            text-align: right;
            padding: 3px;
            color: #fff;
            /* background-color: rgb(180,198,231);*/
            background-color: rgb(230, 247, 74);
            border-collapse: collapse;
            border: 1px solid LightGray;
            font-weight: bold;
        }

        .InputTable tbody td {
            height: 40px;
        }

    .InputTable input[type="text"] {
        font-size: medium;
        height: 22px;

    }

.checkbox1 {
    display: block;
    color: #800000;
    /* background-color: rgb(180,198,231);*/
    border-collapse: collapse;
    border: 1px solid LightGray;
    font-weight: bold;
}

    /* 前景色 */
    .ColorMain {
    /* 紺    R:000 G:050 B:150 */
    color: #149600;
}

.ColorFore1 {
    /* 黒    R:000 G:000 B:000 */
    color: #000000;
}

.ColorFore2 {
    /* 紺    R:000 G:050 B:150 */
    color: #149600;
}

.ColorFore3 {
    /* 白    R:255 G:255 B:255 */
    color: #ffffff;
}

.ColorFore4 {
    /* 灰    R:150 G:150 B:150 */
    color: #969696;
}

.ColorFore5 {
    /* 赤    R:200 G:000 B:000 */
    color: #c80000;
}

.ColorFore6 {
    /* 未定  R:xxx G:xxx B:xxx */
    color: #c0c0c0;
}

.ColorFore7 {
    /* 未定  R:xxx G:xxx B:xxx */
    color: #000000;
}

/* 背景色 */
.ColorBack1 {
    color: #000000;
}

.ColorBack2 {
    color: #149600;
}

.ColorBack3 {
    color: #ffffff;
}

.ColorBack4 {
    color: #969696;
}

.ColorBack5 {
    color: #c80000;
}

.ColorBack6 {
    color: #4b4bff;
}

.ColorBack7 {
    color: #dce1fa;
}

.ColorBack8 {
    color: #ebf1de;
}

.ColorBack9 {
    color: #c4d79b;
}

.ColorBack10 {
    color: #4f6228;
}

.BgColorBack11 {
    background-color: #d6e9ca !important;
}

/********************/
/* 部品の属性を記載 */
/********************/

/* タイトル */
.TitleLarge {
    font-family: 'MS Gothic';
    font-size: xx-large;
    text-align: left;
}

.TitleMedium {
    font-family: 'MS Gothic';
    font-size: x-large;
}

.TitleSmall {
    font-family: 'MS Gothic';
    font-size: medium;
}

/* 明細（ラベル）*/
.LabelLight {
    color: rgb(255,255,255);
    background-color: rgb(180,198,231);
}

.LabelDark {
    color: rgb(255,255,255);
    background-color: rgb(0,50,150);
}

.LabelWhite {
    color: rgb(0,0,0);
    /*background-color: rgb(255,255,255);*/
}

.LabelGradation {
    color: rgb(0,0,0);
    background: linear-gradient(#FFFFFF, #FFCC99);
}

.LabelBlue {
    color: #ffffff;
    background: #149600;
}

.LabelLightGreen {
    color: #ffffff;
    background: #d6e9ca;
}

.LabelPKKey {
    color: #ffffff;
    background: #316745;
}

.LabelColor {
    /*display: block;*/
    display:inline-block;
    color: #275317;
    background-color: #8ED973;
    text-align: right;
}

.LabelTextAlign {
    text-align: right;
}

.LabelTextAlignCenter {
    text-align: center !important;
}

.TextAlignRight {
    text-align: right !important;
}

/* テキストボックス (背景と枠) */
.TextBoxWhite {
    background-color: rgb(255,255,255);
    border-color: rgb(150,150,150); /* 機能していないため Top,Bottom,Right,Left を個別指定 */
    border: solid 1px;
    width: 100%;
    border-bottom-color: darkgray;
    border-top-color: darkgray;
    border-left-color: darkgray;
    border-right-color: darkgray;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Chrome, Safari */
}

.TextBoxLightGray {
    background-color: lightgray;
    border-color: rgb(150,150,150); /* 機能していないため Top,Bottom,Right,Left を個別指定 */
    border: solid 5px;
    width: 100%;
    border-bottom-color: darkgray;
    border-top-color: darkgray;
    border-left-color: darkgray;
    border-right-color: darkgray;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Chrome, Safari */
}

.TextBoxGray {
    background-color: rgb(150,150,150);
    border-color: rgb(150,150,150); /* 機能していないため Top,Bottom,Right,Left を個別指定 */
    border: solid 1px;
    width: 100%;
    border-bottom-color: darkgray;
    border-top-color: darkgray;
    border-left-color: darkgray;
    border-right-color: darkgray;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Chrome, Safari */
}

.TextBox {
    border: solid 1px;
    border-radius: 0;
    box-shadow: none;
    font-family: 'MS Gothic';
    Height: 100%;
}

.TextBoxForInt {
    border: solid 1px;
    border-radius: 0;
    box-shadow: none;
    font-family: 'MS Gothic';
    Height: 100%;
    text-align:right;
}

.TextBoxBackColor {
    border: solid 1px;
    border-radius: 0;
    box-shadow: none;
    font-family: 'MS Gothic';
    background-color: #DAF2D0;
    height:100%
}

.DropDown {
    Height: 100%;
    font-family: 'MS Gothic';
    top: 0px;
    left: 0px;
}

.DropDownSmall {
    Height: 20px;
}

/* ボタン */
.ButtonRegular {
    height: 40px;
    width: 180px;
}

.Buttonico_alert {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_alert.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43; /*#000080*/
}

.Button_delete_center {
    text-align: center;
    vertical-align: middle;
    display: inline-block;
}

.Buttonico_arrow-down {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_arrow-down.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43; /*#000080*/
}

.Buttonico_arrow-up {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_arrow-up.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43; /*#000080*/
}
    .Buttonico_arrow {
    display: block;
    margin: 0 auto;
    font-family: 'MS Gothic';
    font-size: medium;
    height: 40px;
    width: 180px;
    background: none;
    text-align: center;
    line-height: 40px;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    color: #000000;
}

.Buttonico_arrow-left {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_arrow-left.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43; /*000080*/
}

.Buttonico_arrow-left-R {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: right center;
    background-image: URL(../Resources/ico_arrow-left.png);
    background-repeat: no-repeat;
    text-align: left;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43; /*000080*/
}

.Buttonico_arrow-right {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_arrow-right.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43; /*000080*/
}

.Buttonico_arrow-up {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_arrow-up.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_bar-chart {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_bar-chart.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_check-mark {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/チェックマーク.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_checkoff-mark {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/チェックオフマーク.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_computer_Small {
    font-family: 'MS Gothic';
    font-size: large;
    margin-left: 0px;
    height: 40px;
    width: 80px;
    background-position: left center;
    background-image: URL(../Resources/ico_computer.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_computer {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_computer.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_calculator {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_calculator.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_catalog {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_catalog.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_plane {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_plane.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_book {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_book.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_board {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_board.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_invoice {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_invoice.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_door {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ログアウト.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_cancel {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/キャンセル.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_delete {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ゴミ箱.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_edit {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_edit_n.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_escape {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_escape.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_excel {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_excel.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_gear {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/歯車.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_loginhome {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/home.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_home {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/HOME_16.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_infoico {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_infoico.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_pdf {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/PDF.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_printer {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/プリンター.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_printer2 {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_printer.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_search {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/検索.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_settings {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_settings.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_stackoverflow {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_stackoverflow.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_text-file {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_textfile.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_trash {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ゴミ箱.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_reset {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_back.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_undo {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_gear_n.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_upload {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/アップロード.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_whatsapp {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_whatsapp.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_x-mark {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_x-mark.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #000080;
}

.Buttonico_login {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico-login.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #801a00;
}

.Buttonico_notebook_128 {
    font-family: 'MS Gothic';
    font-size: x-large;
    height: 50px;
    background-position: left center;
    background-image: URL(../Resources/ico_computer.png);
    background-repeat: no-repeat;
    background-color: #ffffff;
    text-align: right;
    color: #007b43;
}

.Buttonico_printer-128 {
    font-family: 'MS Gothic';
    font-size: x-large;
    height: 50px;
    background-position: left center;
    background-image: URL(../Resources/ico_printer.png);
    background-repeat: no-repeat;
    background-color: #ffffff;
    text-align: right;
    color: #007b43;
}

.Buttonico_Left-16 {
    font-family: 'MS Gothic';
    font-size: medium;
    background-position: left center;
    background-image: url('../Resources/icon_Left16.png');
    background-repeat: no-repeat;
    background-color: #ffffff;
    text-align: right;
    color: #007b43;
}

.Buttonico_Right-16 {
    font-family: 'MS Gothic';
    font-size: medium;
    background-position: left center;
    background-image: url('../Resources/icon_Right16.png');
    background-repeat: no-repeat;
    background-color: #ffffff;
    text-align: right;
    color: #007b43;
}

.Buttonico_Mail {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_Mail.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_Warehouse {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 180px;
    background-position: left center;
    background-image: URL(../Resources/ico_Warehouse.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_Puls {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 80px;
    background-position: center center;
    background-image: URL(../Resources/icon_Plus.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}

.Buttonico_Minius {
    font-family: 'MS Gothic';
    font-size: small;
    margin-left: 0px;
    height: 40px;
    width: 80px;
    background-position: center center;
    background-image: URL(../Resources/icon_Minius.png);
    background-repeat: no-repeat;
    text-align: right;
    border-style: outset;
    border-width: 3px;
    border-color: #c0c0c0;
    background-color: #ffffff;
    color: #007b43;
}
    /* 線 */
    .LineLarge hr {
    border-width: 5px 0px 0px 0px; /* 太さ */
    border-style: solid; /* 線種 */
    border-color: #149600; /* 線色 */
    height: 5px; /* 高さ(※古いIE用) */
    width: 100%;
}

.LineMedium hr {
    border-width: 3px 0px 0px 0px; /* 太さ */
    border-style: solid; /* 線種 */
    border-color: #149600; /* 線色 */
    height: 3px; /* 高さ(※古いIE用) */
    width: 100%;
}

.LineSmall {
    width: 100%;
    background-color: #d6e9ca;
}

    .LineSmall hr {
        border-width: 1px 0px 0px 0px;  太さ 
        border-style: solid;  線種 
        border-color: #149600;  線色 
        height: 1px;  高さ(※古いIE用) 
    }

.LineSmall_Grid {
    width: 100%;
    overflow-y: auto;
    overflow-x: auto;
    height: 55vh; /* 55% of viewport */
    max-height: 70vh; /* optional for tall screens */
    min-height: 40vh; /* optional for small screens */
    background-color: #d6e9ca;
}
    .LineSmall_Grid hr {
        border-width: 1px 0px 0px 0px;
        border-style: solid;
        border-color: #149600;
        height: 1px;
    }

/* 段落(間隔0) */
p {
    margin: 0;
}
/********************/
/* 項目の属性を記載 */
/********************/

/* IMEControl*/
/*.txtIMEDisabled {
    ime-mode: disabled;
}

.txtIMEActive {
    ime-mode: active;
}

.txtIMEInActive {
    ime-mode: inactive
}*/

/* 文字の表示位置（ラベル／テキストボックス） */
.AlignLeft {
    text-align: left;
}

.AlignCenter {
    display:block;
    text-align: center;
}

.AlignRight {
    text-align: right;
}

/* 検証時、警告欄*/
.ValidationValue {
    color: red;
    margin-bottom: 8px;
}

.ValidationRedValue {
    color: red;
    margin-bottom: 8px;
}

/* セルからはみ出た文字を非表示 */
.OverflowHidden {
    overflow: hidden;
}

/* モーダルスタイル */
.modal-milk {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 650px;
    background-color: #ffffff;
    border: 1px solid #ccc;
    padding: 20px;
    z-index: 1000;
}

.modal-milk-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.close-btn {
    cursor: pointer;
    font-weight: bold;
}

.modal-milk-footer {
    text-align: right;
    margin-top: 20px;
}

.modal-milk table {
    width: 100%;
    border-collapse: collapse;
}

.modal-milk td {
    padding: 5px;
}

.text-box-long {
    width: 100%;
    height: 80px;
}

.file-upload {
    background-color: #ffffff;
    border: 1px solid;
    padding: 4px;
    font-size: 14px;
    color: #000;
    box-sizing: border-box; 
    font-family: 'MS Gothic';
}

.custom-checkbox input[type="checkbox"] {
    width: 18px; /* 横幅 */
    height: 18px; /* 高さ */
    border: 1px solid black; /* 枠線を黒で */
    cursor: pointer; /* マウスカーソルを指マークに */
}

.GridTextRight {
    width: 100%;
    text-align: right;
    vertical-align: middle;
    font-size: 16px;
    font-family: 'MS Gothic';
}

.LabelTextLeft {
    text-align: left;
    vertical-align: middle !important;
    padding: 4px;
    top:auto
}

.GridTextLeftHK {
    width: 100%;
    text-align: left;
    vertical-align: middle;
    font-size: 12px;
    font-family: 'MS Gothic';
}

.GridTextRightHK {
    width: 100%;
    text-align: right;
    vertical-align: middle;
    font-size: 10px;
    font-family: 'MS Gothic';
}

.GridLabelHK {
    width: 100%;
    text-align: center;
    vertical-align: middle;
    font-size: 12px;
    font-family: 'MS Gothic';
}

.labelInsideCell {
    display: inline-block; /* allows controlling alignment inside the label */
    text-align: left; /* left-align text inside the label */
}

.GridTextLeft {
    width: 100%;
    text-align: left;
    vertical-align: middle;
    font-size: 16px;
    font-family: 'MS Gothic';
}

.table-container {
    max-height: 40vh; /* height of scrollable area */
    overflow-y: scroll; /* vertical scroll */
    border: 1px solid #ccc;
}

.freeze-table {
    border-collapse: collapse;
    width: 100%;
}

    .freeze-table td {
        padding: 0px;
        border: 1px solid #ccc;
        text-align: left;
    }

/* Freeze first 2 rows */
.sticky-row {
    position: sticky;
    top: 0; /* first row sticks at top */
    /*background-color: #f0f0f0;*/
    background-color: #DAF2D0;
    z-index: 3;
}

    /* Second row offset to appear below first */
    .sticky-row:nth-child(3) {
        top: 30px; /* adjust according to first row height */
    }