/*------------------------------------------*/
/*	シーエナジー用CSS						*/
/*	Styles.css								*/
/*	CREATE：2007/04/04	S.Yato				*/
/*------------------------------------------*/

/*------------------------------------------*/
/*■本文■									*/
/*	マージン設定　：上、右、下、左 各5px	*/
/*	背景色設定　　：白(#ffffff)				*/
/*	フォントサイズ：12px					*/
/*------------------------------------------*/
body {
    margin: 5px 5px 5px 5px;
    /*	background-color: #ffffff; */
    background-image: url(img/body_back.gif);
    font-size: 14px;
   /* font-family: "MS Gothic", sans-serif;*/
}

/*------------------------------------------*/
/*■リンク（共通）■						*/
/*	修飾：下線								*/
/*------------------------------------------*/
a {
    text-decoration: underline;
}

    /*------------------------------------------*/
    /*■リンク（未訪問）■						*/
    /*	文字色：青(#0000ff)						*/
    /*------------------------------------------*/
    a:link {
        color: #0000ff;
    }

    /*------------------------------------------*/
    /*■リンク（訪問済み）■					*/
    /*	文字色：薄青紫(#8800ff)					*/
    /*------------------------------------------*/
    a:visited {
        color: #8800ff;
    }

    /*------------------------------------------*/
    /*■リンク（訪問中）■						*/
    /*	文字色：赤(#ff0000)						*/
    /*------------------------------------------*/
    a:active {
        color: #ff0000;
    }

    /*------------------------------------------*/
    /*■リンク（カーソルが触れた時）■			*/
    /*	文字色：赤(#ff0000)						*/
    /*------------------------------------------*/
    a:hover {
        color: #ff0000;
    }

/*------------------------------------------*/
/*■ヘッダー用テーブル■					*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上下左右 各0px			*/
/*	背景色設定　　：薄い水色(#e5ecf9)		*/
/*	フォントサイズ：12px					*/
/*------------------------------------------*/
.header table {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    background-color: #c6e0b4;
    font-size: 12px;
}

/*------------------------------------------*/
/*■ヘッダー用 h3(タイトル名)■				*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上右0px、下3px、左0px	*/
/*	パディング設定：上3px、右下0px、左15px	*/
/*	ボーダー設定　：上下1px　黒色(#000000)	*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：18px					*/
/*	フォント修飾　：太字（bold）			*/
/*------------------------------------------*/
.header h3 {
    width: 950px;
    margin: 0px 0px 3px 0px; /*上右下左*/
    padding: 3px 0px 0px 15px;
    border-top: solid 1px #000000;
    border-bottom: solid 1px #000000;
    border-left: solid 0px #000000;
    border-right: solid 0px #000000;
    color: #000000;
    font-size: 18px;
    font-weight: bold;
}

#header {
    margin-bottom: 20px;
}

    #header table {
        background-color: #c6e0b4;
    }

        #header table tr {
            height: 20px;
        }

    #header .title {
        font-weight: bold;
    }

#header {
    height: 40px;
    width: 959px;
}

    #header .header-table {
        width: 100%;
        height: 34px;
    }

        #header .header-table td {
            height: 20px;
        }

        #header .header-table #header-title .title {
            width: 774px;
            text-align: center;
        }

            #header .header-table #header-title .title .title-large {
                font-size: large;
            }

            #header .header-table #header-title .title .title-large {
                font-size: medium;
            }

            #header .header-table #header-title .title .title-right {
                text-align: right;
                height: 18px;
            }

                #header .header-table #header-title .title .title-right .title-icon {
                    height: 11px;
                }

        #header .header-table .lbldate-lbltime {
            text-align: center;
            height: 18px;
        }
/*------------------------------------------*/
/*■ヘッダー用 システム名■					*/
/*	フォント色設定：黒色(#000000)			*/
/*------------------------------------------*/
.system_title {
    color: #ff0000;
}

/*------------------------------------------*/
/*■ヘッダー用 サブシステム名■				*/
/*	フォント色設定：黒色(#000000)			*/
/*------------------------------------------*/
.subsystem_title {
    color: #008800;
}

/*------------------------------------------*/
/*■ヘッダー用 日時■						*/
/*	フォント色設定：黒色(#000000)			*/
/*------------------------------------------*/
.date {
    color: #2299ff;
}

/*------------------------------------------*/
/*■ヘッダー用 ユーザ名■					*/
/*	フォント色設定：黒色(#000000)			*/
/*------------------------------------------*/
.user_name {
    color: #aa00aa;
}

/*------------------------------------------*/
/*■フッター■								*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上3px、右0px、下左3px	*/
/*	ボーダー設定　：上1px　黒色(#000000)	*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：10px					*/
/*------------------------------------------*/
.footer {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 3px 0px 3px 3px;
    border-top: solid 1px #000000;
    color: #000000;
    font-size: 10px;
}


/*------------------------------------------*/
/*■メニューリンク■						*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：左寄せ				*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：12px					*/
/*------------------------------------------*/
.menu_link {
    /*width:600px; */
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: left;
    color: #000000;
    font-size: 24px;
    text-decoration: none;
}


/*------------------------------------------*/
/*■メッセージ■							*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.message {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #000000;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■メッセージ940ピクセル用■				*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.message940 {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #000000;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■メッセージ650ピクセル用■				*/
/*	幅　　　　　　：650px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.message650 {
    width: 650px;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #000000;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■メッセージ2■							*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：黒色(#000000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.message2 {
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■エラーメッセージ■						*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：赤色(#ff0000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.error_message {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #ff0000;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■エラーメッセージ940ピクセル用■			*/
/*	幅　　　　　　：940px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：赤色(#ff0000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.error_message940 {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #ff0000;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■エラーメッセージ650ピクセル用■			*/
/*	幅　　　　　　：650px					*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：赤色(#ff0000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.error_message650 {
    width: 650px;
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #ff0000;
    font-size: 14px;
    font-weight: bold;
}

/*------------------------------------------*/
/*■エラーメッセージ2■						*/
/*	マージン設定　：上、右、下、左 各0px	*/
/*	パディング設定：上、右、下、左 各3px	*/
/*	テキスト表示位置：中央寄せ				*/
/*	フォント色設定：赤色(#ff0000)			*/
/*	フォントサイズ：14px					*/
/*	フォント修飾：太字						*/
/*------------------------------------------*/
.error_message2 {
    margin: 0px 0px 0px 0px;
    padding: 3px 3px 3px 3px;
    text-align: center;
    color: #ff0000;
    font-size: 14px;
    font-weight: bold;
}

.ervalue {
    /*エラー項目（未入力フィールド）*/
    background-color: #ffcccc;
}

.imeon {
    /*通常 日本語入力箇所*/
    ime-mode: active;
}

.imeoff {
    /*通常 日本語入力禁止箇所*/
    ime-mode: disabled;
}

.offn {
    /*通常 数字入力箇所*/
    text-align: right;
    ime-mode: disabled;
}

.erimeon {
    /*エラー 日本語入力箇所*/
    background-color: #ffcccc;
    ime-mode: active;
}

.erimeoff {
    /*エラー 日本語入力禁止箇所*/
    background-color: #ffcccc;
    ime-mode: disabled;
}

.eroffn {
    /*エラー 数字入力箇所*/
    background-color: #ffcccc;
    text-align: right;
    ime-mode: disabled;
}

.error_data {
    /*エラー 箇所テキスト*/
    color: #ff0000;
    font-weight: bold;
}

.warning_data {
    /*ワーニング 箇所テキスト*/
    color: #ff0000;
}

.focus {
    /*フォーカスのあたった現入力箇所*/
    background-color: #fffeba;
}

.bara_disabled {
    /*バラ数入力箇所（デフォルト入力不可）*/
    background-color: #eeeeee;
}

.bara_enabled {
    /*バラ数入力箇所（入力可能時）*/
    background: #ffffff;
}

.center {
    /*中央寄せ（コード、日付など）*/
    text-align: center;
}

.left {
    /*左寄せ（通常）*/
    text-align: left;
}

.right {
    /*右寄せ（金額、数量など）*/
    text-align: right;
}

input {
    /*インプットタグ用*/
    font-family: monospace;
}

select {
    /*セレクトタグ用*/
    font-family: monospace;
}

.btn {
    /*ボタンフリーピクセル用（幅あり）*/
    margin: 0px 0px 0px 0px; /*上右下左*/
    padding: 0px 12px 0px 12px; /*上右下左*/
    text-align: center;
    font-size: 12px;
}

.btn0 {
    /*ボタン0ピクセル用*/
    margin: 0px;
    padding: 0px;
    background-color: #ffffff;
    width: 0px;
    font-size: 1px;
    color: #ffffff;
}

.btn1 {
    /*ボタンフリーピクセル用（幅なし）*/
    margin: 0px;
    padding: 0px 1px 0px 1px; /*上右下左*/
    text-align: center;
    font-size: 12px;
}

.btn100 {
    /*ボタン100ピクセル用*/
    margin: 0px 0px 0px 0px; /*上右下左*/
    padding: 0px 3px 0px 3px;
    width: 100px;
    text-align: center;
    font-size: 12px;
}

.delbtn {
    /*削除ボタンフリーピクセル用（幅あり）*/
    margin: 0px 0px 0px 0px; /*上右下左*/
    padding: 0px 12px 0px 12px;
    background-color: #ff0000;
    text-align: center;
    font-size: 12px;
    color: #ffffff;
}

.delbtn1 {
    /*削除ボタンフリーピクセル用（幅なし）*/
    margin: 0px;
    padding: 0px 1px 0px 1px; /*上右下左*/
    background-color: #ff0000;
    text-align: center;
    font-size: 12px;
    color: #ffffff;
}

.delbtn100 {
    /*削除ボタン100ピクセル用*/
    margin: 0px 0px 0px 0px; /*上右下左*/
    padding: 0px 3px 0px 3px;
    background-color: #ff0000;
    width: 100px;
    text-align: center;
    font-size: 12px;
    color: #ffffff;
}


/*------------------------------------------*/
/*■TABLES■								*/
/*	フォントサイズ：12px					*/
/*------------------------------------------*/
table {
    font-size: 12px;
}

tr {
    height: 25px;
}

.show_table {
    border: 1px solid #555555;
    border-collapse: collapse;
    padding: 3px;
}

/*.show_table td {
	border:1px solid #555555;
	}
*/

.hyde_table {
    border: 0px none;
    border-collapse: collapse;
    padding: 0px;
}

.column_key {
    background-color: #ffdb76;
    text-align: center;
}

.column_normal {
    background-color: #94b5ff;
    text-align: left;
}

.column_list_title {
    background-color: #94b5ff;
    text-align: center;
}

.column_list {
    background-color: #bbeeff;
    text-align: center;
}

.column_joken {
    background-color: #f9ffd1;
    text-align: center;
}

.column_status1 {
    background-color: #99ff99;
    text-align: center;
}

.column_status2 {
    background-color: #9999ff;
    text-align: center;
}

.column_menu {
    background-color: #f9ffd1;
    text-align: left;
}

.column_gokei {
    background-color: #94b5ff;
    text-align: right;
}

.menu th {
    color: #ffffff;
    background-color: #599bff;
}

.menu td {
    background-color: #eaf3ff;
}

.head_tr {
    /*ヘッダ用テーブル行*/
    background-color: #eeeeff;
}

.evn_tr {
    /*偶数行用テーブル行*/
    background-color: #C0C0C0;
}

.odd_tr {
    /*奇数行用テーブル行*/
    background-color: #ffffff;
}

.page_tr
/*一覧ページ数表示行*/ {
    background-color: #8080ff;
}

.yo_tr {
    /*検査予定行*/
    background-color: #ebf89f;
}

.sekisou {
    /*積送中*/
    color: #ff0000;
}

.zaiko_case {
    /*ケース在庫*/
    color: #990000;
}

.zaiko_hanwari {
    /*半割在庫*/
    color: #0000ff;
}

.zaiko_bara {
    /*バラ在庫*/
    color: #000000;
}

.selected_tr {
    /*選択中テーブル行（リンクあり）*/
    background-color: #ccffcc;
    cursor: pointer;
}

.selected_tr_no_link {
    /*選択中テーブル行（リンクなし）*/
    background-color: #ccffcc;
}

.menu_link:link {
    /*メインメニューリンク */
    color: #375623;
    font-size: 20px;
    font-weight: bold;
}

.menu_link:visited {
    /*メインメニューリンク */
    color: #375623;
    font-size: 20px;
    font-weight: bold;
}

.menu_link:hover {
    /*メインメニューリンク */
    color: #00AA00;
    font-size: 20px;
    font-weight: bold;
}


/* ブルーバージョンCss */
#header {
    WIDTH: 964px;
    HEIGHT: 40px;
}

#left {
    BORDER-RIGHT: #333333 1px solid;
    BORDER-TOP: #333333 1px solid;
    MARGIN-TOP: 8px;
    PADDING-LEFT: 10px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 18px;
    FLOAT: left;
    MARGIN-BOTTOM: 8px;
    BORDER-LEFT: #333333 1px solid;
    WIDTH: 700px;
    COLOR: #333333;
    BORDER-BOTTOM: #333333 1px solid;
    FONT-FAMILY: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    BACKGROUND-COLOR: #3399ff;
}

#right {
    FLOAT: left;
    PADDING-BOTTOM: 10px;
    WIDTH: 250px;
    PADDING-TOP: 10px;
}

#navi {
    CLEAR: left;
    BORDER-TOP: #0066ff 1px solid;
    MARGIN-TOP: 5px;
    PADDING-LEFT: 10px;
    FONT-SIZE: 14px;
    MARGIN-BOTTOM: 10px;
    PADDING-BOTTOM: 5px;
    WIDTH: 954px;
    PADDING-TOP: 5px;
    BORDER-BOTTOM: #0066ff 1px solid;
    HEIGHT: 0px;
}

#middle {
    WIDTH: 964px;
}

#bee {
    WIDTH: 281px;
    HEIGHT: 20px;
    BACKGROUND-COLOR: #00ffcc;
}

#sarch {
    BORDER-RIGHT: #ffffff 1px solid;
    BORDER-TOP: #ffffff 1px solid;
    BORDER-LEFT: #ffffff 1px solid;
    WIDTH: 964px;
    BORDER-BOTTOM: #ffffff 1px solid;
}

.beetable {
    PADDING-LEFT: 10px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    FLOAT: left;
    MARGIN: 2px 5px 3px 3px;
    WIDTH: 268px;
    HEIGHT: 20px;
    BACKGROUND-COLOR: #666666;
}

#wapper {
    WIDTH: 964px;
    BACKGROUND-COLOR: #ffffff;
}

.ex02 TD {
    FONT-SIZE: 14px;
    BACKGROUND-COLOR: #cccccc;
}

.ex02_CStable {
    FONT-SIZE: 14px;
    BACKGROUND-COLOR: #cccccc;
    height: 20px;
}

.ex03 {
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    RIGHT: 10px;
    COLOR: #000000;
    BACKGROUND-COLOR: #33ccff;
}

.ex03_CStable {
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    RIGHT: 10px;
    COLOR: #000000;
    BACKGROUND-COLOR: #33ccff;
    height: 20px
}

#hyou {
    BORDER-RIGHT: #ffffff 1px solid;
    BORDER-TOP: #ffffff 1px solid;
    MARGIN-TOP: 10px;
    BORDER-LEFT: #ffffff 1px solid;
    WIDTH: 964px;
    BORDER-BOTTOM: #ffffff 1px solid;
    HEIGHT: 0px;
}

.beetableblue {
    PADDING-LEFT: 10px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    FLOAT: left;
    MARGIN: 2px 5px 3px 3px;
    WIDTH: 130px;
    HEIGHT: 20px;
    BACKGROUND-COLOR: #3399ff;
}

#leftblue {
    BORDER-RIGHT: #333333 1px solid;
    BORDER-TOP: #333333 1px solid;
    MARGIN-TOP: 8px;
    PADDING-LEFT: 10px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 18px;
    FLOAT: left;
    MARGIN-BOTTOM: 8px;
    BORDER-LEFT: #333333 1px solid;
    WIDTH: 770px;
    COLOR: #000000;
    BORDER-BOTTOM: #333333 1px solid;
    FONT-FAMILY: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    HEIGHT: 25px;
    BACKGROUND-COLOR: #3399ff;
}

#sarchblue {
    BORDER-RIGHT: #0066ff 1px solid;
    BORDER-TOP: #0066ff 1px solid;
    BORDER-LEFT: #0066ff 1px solid;
    WIDTH: 964px;
    BORDER-BOTTOM: #0066ff 1px solid;
}
/*H2 {
	PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 18px; BACKGROUND-IMAGE: url(untitled/br2.jpg); BORDER-LEFT: #00ccff solid; BORDER-BOTTOM: #00ccff thin solid; FONT-FAMILY: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}*/
H2 {
    PADDING-LEFT: 10px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 18px;
    FONT-FAMILY: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

/* ↓ 2019/08/** バージョンアップに伴い追加 */
.common-table-layout {
    padding: 0;
    margin: 0;
    vertical-align: top;
    /*display: inline-block;*/
    border-collapse: collapse;
}

.td-title-area-m {
    margin: 0px;
    color: #375623 !important;
    font-size: 22px !important;
    font-weight: bold !important;
}

.system-title-area {
    padding: 0px;
    vertical-align: top;
    width: 62px;
    height: 16px;
}

.system-title-spase {
    height: 16px;
    margin: 0;
    padding: 0;
}

.title-image {
    display: block;
    padding: 0px;
    height: 16px;
}

.logout {
    vertical-align: top;
    padding: 0px;
}

.masta-title-area {
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
}

.td-title-area {
    white-space: nowrap;
    width: 70%;
    margin: 1px;
}

.title-user-area {
    white-space: nowrap;
    width: 350px;
    text-align: left;
    font-size: 14px;
}

/*------------------------------------------*/
/*■一覧画面下部ボタン（共通）■		    */
/*	表示位置設定CSS        					*/
/*------------------------------------------*/
.bottom-btn-left {
    text-align: left;
}

.bottom-btn-center {
    text-align: center;
}

.bottom-btn-right {
    text-align: right;
}

/*------------------------------------------*/
/*■検索画面（共通）■		   　　　　　　 */
/*------------------------------------------*/
.search-form {
    margin-top: 15px;
    width: 800px;
}

.search-btn-td {
    height: 19px;
}

.search-bottom-btn-area {
    height: 10px;
    width: 100%;
}

/* ↑ 2019/08/** バージョンアップに伴い追加 */


/* ↓ 2019/09/** バージョンアップに伴い追加 */
/*------------------------------------------*/
/*■■■　システム共通ヘッダ START　■■■  */
/*    表示位置設定CSS                       */
/*------------------------------------------*/

.table-style-class {
    margin: 0;
    padding: 0;
    width: 100%;
}

.td-title-class {
    height: 16px;
}

.title-user-area {
    white-space: nowrap;
    width: 30%;
    text-align: left;
    align-items: start
}

/*------------------------------------------*/
/*■■■ 機能画面 START ■■■              */
/*    表示位置設定CSS                       */
/*------------------------------------------*/

.td-title-area-m {
    margin: 0px;
    color: #375623 !important;
    font-size: 27px !important;
    font-weight: bold !important;
}

.table-area {
    margin: 1px;
    padding: 0px;
    width: 950px;
    background-color: #3399ff;
}

.table-search-btn-area-full {
    width: 100%;
}

.td-search-clear-btn {
    width: 950px;
}

.disp-page-area {
    text-align: right;
}

.register-spase {
    height: 16px;
}

.bottom-btn {
    width: 476px;
}

.form-page {
    margin-top: 15px;
    width: 100%;
}

/*------------------------------------------*/
/*　■ボタン・テキスト位置指定■　　　　	*/
/*	表示位置設定CSS        					*/
/*------------------------------------------*/
.position-left {
    text-align: left;
}

.position-center {
    text-align: center;
}

.position-right {
    text-align: right;
}

.back-menu-area {
    align-items: center;
    text-align: center;
    font-size: 14px;
}

.area-link-back {
    width: 100px;
}

.area-link-menu {
    width: 200px;
}

.area-link-back, .area-link-menu {
    text-align: center;
    font-size: 14px
}

/* ↑ 2019/09/** バージョンアップに伴い追加 */

/*VN UPDATE*/
#wapper {
    WIDTH: 1200px;
    BACKGROUND-COLOR: #ffffff;
    margin: 0px;
}

#header {
    height: 40px;
    width: 100%;
}

#header {
    height: 40px;
    width: 100%;
}

.ex02 TD {
    FONT-SIZE: 14px;
    BACKGROUND-COLOR: white;
}

.ex03 {
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    RIGHT: 10px;
    COLOR: #000000;
    border: 1PX solid;
    BACKGROUND-COLOR: #c6e0b4 !important;
}

.form-page {
    margin-top: 0px;
    width: 100%;
}


#header {
    margin-bottom: 20px;
}

.header table {
    width: 950px;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    background-color: #c6e0b4;
    font-size: 12px;
}

#header table tr {
    height: 20px;
}

#header .title {
    font-weight: bold;
}

#header {
    height: 40px;
    width: 100%;
}

    #header .header-table {
        width: 100%;
        height: 34px;
    }

        #header .header-table td {
            height: 20px;
        }

        #header .header-table #header-title .title {
            width: 650px;
            text-align: right;
        }

            #header .header-table #header-title .title div {
                display: flex;
                width: 100%;
                justify-content: right;
                align-items: center;
            }

    #header .title-large {
        font-size: 28px !important;
    }

    #header .title-medium {
        font-size: 20px !important;
    }

    #header .header-table #header-title .title .title-right {
        text-align: right;
        height: 18px;
    }

    #header .title-right div {
        display: flex;
        justify-content: end;
        align-items: center;
    }

    #header .header-table #header-title .title .title-right .title-icon {
        height: 11px;
    }

    #header .header-table .lbldate-lbltime {
        text-align: right;
        height: 18px;
        width: 10%;
    }

.wapperMenu {
    padding-right: 6%;
}

.table-search-btn {
    margin-left: 17px;
}

.hyde_table {
    margin-left: 45px;
}

.table-search-btn {
    margin-left: 20px;
}

.table-result-area {
    /*margin-left: 20px;*/
    border-spacing: 0px !important;
    border-collapse: collapse;
}

    .table-result-area .ex03-th td, #gvMst .ex03-th td, #tblAdd .ex03-th td, .table-result .ex03-th td {
        border: 1px solid;
    }

    .table-result-area .ex02-body td, #gvMst .ex02 td, #gvMst .ex02, .w-100-ct .ex02-body td, #tblAdd .ex02-body td, .table-result .ex02-body td {
        border: 1px dashed !important;
    }

        .table-result-area .ex02-body:last-child td, #gvMst .ex02:last-child td, #gvMst tr:last-child .ex02, .w-100-ct .ex02-body:last-child td, #tblAdd .ex02-body:last-child td, .table-result .ex02-body:last-child td {
            border-bottom: 1px solid !important;
        }

        .table-result-area .ex02-body td:last-child, #gvMst .ex02 td:first-child, #gvMst tr .ex02:first-child, .w-100-ct .ex02 td:first-child, #tblAdd .ex02 td:first-child, .table-result .ex02-body td:last-child {
            border-left: 1px solid !important;
        }

        .table-result-area .ex02-body td:last-child, #gvMst .ex02 td:last-child, #gvMst tr .ex02:last-child, .w-100-ct .ex02-body td:last-child, #tblAdd .ex02 td:first-child, .table-result .ex02-body td:last-child {
            border-right: 1px solid !important;
        }

.table-result {
    border-collapse: collapse;
}

.work-list, accounts-receivable-list, .table-result {
    border-left: 1px solid !important;
}

    .work-list .ex02-body td:last-child, .accounts-receivable-list .ex02-body td:last-child, .table-result .ex02-body td:last-child {
        border-left: 1px dashed !important;
    }

.accounts-receivable-list .ex02-body td:last-child {
    text-align: center;
}

.beetableblue {
    BACKGROUND-COLOR: #ffff;
}

.td-remark-label {
    BACKGROUND-COLOR: #ffff;
}

.ex03_CStable {
    BACKGROUND-COLOR: #c6e0b4;
}

.btn-down {
    color: #000000;
    background-color: #ffff;
    border: 1px solid gray;
    border-radius: 2px;
    height: 22px !important;
}

.content {
    padding: 0px 20px;
    width: calc(100% - 40px);
}

    .content .list {
        width: 100% !important;
    }

    .content .table-result-area {
        border: 1px solid;
    }

    .content .table-result-area {
        border: 1px solid;
    }

.beetableblue {
    background-color: white;
}

.ex02_CStable {
    BACKGROUND-COLOR: white;
}

.w-100 {
    width: 100% !important;
    background-color: #ffff;
}

.w-100-clac-30 {
    width: calc(100% - 30px) !important;
}

td input {
    height: 21px;
    border-width: 1px !important;
}

td .item-button {
    height: 24px !important;
    background-color: #C2DCB1;
    border: solid 1px black;
}

.item-button:hover {
    background-color: #9CCA9B;
}

td .item-dropdown {
    height: 24px !important;
}

td .item-radio {
    height: 13px !important;
}

.ex03_CStable {
    background-color: white;
}

.dsp-radio {
    display: flex;
    align-items: center;
}

    .dsp-radio .item-radio {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

.table-search-area table tr, .table-search-area table tr td {
    display: flex;
    align-items: center;
}

    .table-search-area table tr td input {
        margin-top: 0px !important;
    }

.table-search-area tr td:first-child {
    margin-right: 15px;
}

.borderSpacingUnset {
    border-spacing: 0px 2px !important;
}

.table-result-area {
    border: solid 1px black;
}

.ex02_CStable td {
    border: dashed 1px black;
}

.ex03_CStable td, .ex02_CStable .ex03_CStable {
    background-color: #C6E0B4;
    border: solid 1px black;
}

.ex02_CStable td input {
    width: 98% !important;
    padding: 0px !important;
}

.background_color_white {
    background-color: #ffffff !important;
}

#tblAdd input {
    border-width: 0px !important;
}

#tblAdd {
    border: 1px solid;
}

.btn_in_table {
    height: 20px !important;
    border: 1px solid !important;
}

.content .table-search-btn {
    margin: 0px;
}

.border-spacing-unset {
    border-spacing: 0px !important;
}

#header {
    width: 100% !important;
}

.form-page {
    margin-top: 0px !important;
    width: 100% !important;
}

.btn-down-ct {
    height: 25px !important;
}

.fixed-header {
    position: fixed;
    top: 0;
    z-index: 1000;
}

.vertical-align input,
.vertical-align select {
    vertical-align: middle;
}
/* UPDATE */
span input {
    margin-top: -2px
}

.gridview-header {
    height: 40px;
}

.gridview-row {
    height: 40px;
    padding: 5px;
}

.btn-detail {
    display: block;
    margin: 0 auto;
    height: 30px;
}

.check-box-list tr td label, .check-box-list tr td input {
    vertical-align: middle
}

.check-box-list tbody tr td label {
    padding-left: 7px;
}

.alert-success {
    background-color: #3ab63d;
    color: white;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 15px;
}

.alert-error {
    background-color: #f23838;
    color: white;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 15px;
}

.alert-box {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    color: white;
    padding: 10px;
    border-radius: 5px;
    z-index: 1000;
    min-width: 300px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
    box-shadow: 0px 5px 9px rgba(0, 0, 0, 0.3);
    font-weight: bold;
}

    .alert-box:hover {
        box-shadow: 0px 9px 14px rgba(0, 0, 0, 0.4);
        filter: brightness(0.9);
    }

    .alert-box .close-btn {
        position: absolute;
        top: 2px;
        right: 3px;
        background: transparent;
        border: none;
        color: white;
        font-size: 20px;
        cursor: pointer;
        opacity: 0;
        transition: opacity 0.3s ease;
        font-size: 15px;
        padding: 0;
        margin: 2px 3px 0px 0px;
    }

    .alert-box:hover .close-btn {
        opacity: 1;
    }

.confirm-dialog {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 20px;
    border: 2px solid #000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    text-align: center;
    min-width: 300px;
}

.confirm-dialog-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
    background-color: #e1efc2;
    margin: 15% auto;
    border-radius: 5px;
    padding: 15px;
    width: 350px;
    text-align: center;
    font-size: 19px;
    font-weight: bold;
}

.modal-content-item {
    background-color: #F3FFD8;
    border-radius: 5px;
    padding: 10px;
    border: 1px solid black;
}

button {
    margin: 10px;
    padding: 10px 20px;
}

#suggestionsBox, .suggestionsBox {
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    width: 200px;
}


.suggestion-item {
    padding: 8px;
    cursor: pointer;
}

.suggestion-item:hover {
    background-color: #f0f0f0;
}

.suggestion-item:focus {
    background-color: #f0f0f0;
}

.suggestion-item-not-valid {
    background-color: #a6a6a6;
    padding: 8px;
    cursor: pointer;
}

.suggestion-item-not-valid:hover, .suggestion-item-not-valid:focus {
    background-color: #8d8d8d;
}

.details-summary {
    cursor: pointer;
    transition: 0.2s;
    padding: 6px;
    border-radius: 6px;
    font-size: 20px;
    /* ホバー時のスタイル */
    &:hover

{
    cursor: pointer;
    background-color: #bee1de;
}

/* タブフォーカス時のスタイル */
&:focus-visible {
    outline: dashed #00a5a0;
}
}

#wapperSortable {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

#sortable, .sortable-header {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 1300px;
}

#sortable li, .sortable-header li {
    border: 1px solid #ddd;
    cursor: move;
    display: flex;
    height: 30px;
    border: 1px solid;
}

#sortable li div, .sortable-header li div {
   /* border: 1px solid black;*/
    text-align: center;
}

.ui-state-default.header {
    border: 1px solid black;
    cursor: move;
    display: flex;
    height: 20px !important;
    padding: 5px !important;
    text-align: center;
}

.ui-state-default, .ui-state-default div {
   border-top: 0px solid !important;
    background-color: transparent;
}

.item-customer-code {
    width: 100px;
    text-align: right;
}
.item-customer-name {
    width: 330px;
    text-align: left;
}
.item-address1 {
    width: 270px;
    text-align: left;
}
.item-address2 {
    width: 270px;
    text-align: left;
}
.item-work-name {
    width: 260px;
    text-align: left;
}
.item-display-item {
    width: 70px;
    text-align: right;
}

.ui-state-default.active {
    background-color: aqua !important;
}

#btnUp, #btnDown {
    font-weight: bold;
    height: 40px !important;
    width: 80px !important;
    border: 1px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f9f0f0
}
.sortable-footer {
    height: 50px !important;
    border-top: 0px solid !important;
    align-items: center;
}

.btn-search {
    color: White;
    background-color: #0066FF;
    font-weight: bold;
    height: 40px;
    width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kaishuScheduleSortBtnRegister {
    color: White;
    background-color: #009933;
    font-weight: bold;
    height: 40px;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kaishuScheduleSortBtnDelete {
    color: White;
    background-color: #FF3300;
    font-weight: bold;
    height: 40px;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

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

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

.btn-display-menu {
    width: 60px;
    height: 25px;
    color: White;
    font-size: 15px;
    font-weight: bold;
    margin: unset;
    padding: unset;
    background-color: #0066FF;
    border: 1px solid black;
}

.btn-hidden-menu {
    width: 60px;
    height: 25px;
    color: White;
    font-size: 15px;
    font-weight: bold;
    margin: unset;
    padding: unset;
    background-color: #FF3300;
    border: 1px solid black;
}

.w-300 {
    width: 300px;
}
.w-450 {
    width: 450px;
}
.w-1000 {
    width: 1000px;
}
.w-1250 {
    width: 1250px;
}

@media only screen and (min-width: 1200px) {
    #wapper {
        width: 100%;
    }
}

#suggestionsStaff {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}

#suggestionsCustomer {
    width: 730px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}

#suggestionsVehicle {
    width: 300px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}

#suggestionsRoute {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}
#suggestionsLargeWork {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}
#suggestionsFinancialInsstitution {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}
#suggestionsMediumWork {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}
#suggestionsSmallWork {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}
#suggestionsWork {
    width: 250px !important;
    background-color: white;
    border: 1px solid #ccc;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    text-align: left;
}

input[disabled] {
    opacity: 0.7;
}

.loading-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2); /* Màu nền mờ */
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

/* Loading spinner */
.loading-spinner {
    width: 50px;
    height: 50px;
    border: 5px solid #f3f3f3;
    border-top: 5px solid #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.table-container {
    border: 1px solid #ccc;
    width: 100%
}

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

.table-style th, .table-style td {
    border: 1px solid black;
    padding: 5px;
}

.table-style th {
    height: 40px
}

.header-style {
    font-weight: bold;
    text-align: center;
    top: 0;
    z-index: 2;
    text-align: center
}

.cell-text-left {
    text-align: left;
    padding-left: 5px;
}

.cell-text-right {
    text-align: right;
    padding-right: 5px;
}

.cell-text-center {
    text-align: center
}

/* WHEEL*/

#single {
    width: 700px;
    height: 340px;
    font-size: 36px;
    padding-top: 120px !important;
    border: solid 2px blue
}

.simple-wheel {
    position: relative;
    overflow: hidden;
    height: 150px;
    border-radius: 10px;
    perspective: 1000px;
    overflow: hidden;
    position: relative;
    border: solid 1px #a9a9a9;
}

.simple-wheel ul {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
    will-change: transform;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
}

.simple-wheel ul li {
    height: 60px;
    line-height: 40px;
    font-size: 30px;
    color: black;
    transition: all 0.3s ease;
}

    .simple-wheel ul li.selected {
        height: 60px;
        font-size: 31px;
        color: black;
        font-weight: 400;
        transform: scale(1.2);
    }

.simple-wheel li {
    height: 30px;
    line-height: 30px;
    text-align: center;
    transition: all 0.3s ease;
    transform-origin: center center;
    transform-style: preserve-3d;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
    border-radius: 20px;
    background-color: #eff9ffb5
}

/* Selected item */
.simple-wheel li.selected {
    font-size: 25px;
    font-weight: bold;
    opacity: 1;
    transform: rotateX(0deg) scale(1.1);
    z-index: 999999;
    background-color: white;
    border-radius: 20px
}

.simple-wheel li.near-top {
    transform: rotateX(30deg) scale(0.9);
    z-index: 99999;
    margin-bottom: -1px;
    background-color: #c7c7c7;
    border-radius: 20px 20px 5px 5px;
}

.simple-wheel li.near-bottom {
    transform: rotateX(30deg) scale(0.9);
    z-index: 99999;
    margin-top: -2px;
    background-color: #c7c7c7;
    border-radius: 5px 5px 20px 20px;
}

/* 2 hàng trên/dưới */
.simple-wheel li.far-top {
    transform: rotateX(40deg) scale(0.8);
    margin-bottom: -17px;
    z-index: 9999;
    background-color: #ababab;
    border-radius: 20px 20px 5px 5px;
}

.simple-wheel li.far-bottom {
    transform: rotateX(40deg) scale(0.8);
    margin-top: -18px;
    z-index: 9999;
    background-color: #ababab;
    border-radius: 5px 5px 20px 20px;
}


#single.simple-wheel {
    background-color: #f3f3f3;
    border-radius: 20px;
/*    padding: 20px;*/
    max-height: 300px;
    overflow: hidden;
}

.wheel-form {
    background-color: white;
    border-radius: 20px;
    border:solid 1px gray
}

.wheel-textbox {
    background-color: #eceded;
    color: #3274e5;
    cursor: pointer;
    caret-color: transparent;
}

.simple-wheel ul {
    will-change: transform;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
}

.simple-wheel {
    -webkit-overflow-scrolling: touch;
}

.btn-top-page {
    width: 90px;
    height: 25px;
    font-family: monospace;
}

.btn-stop {
    position: fixed;
    width: 60px !important;
    height: 60px !important;
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    bottom: 30px;
    right: 10px;
    z-index: 2000;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 24px;
    border: none
}
.btn-stop:hover {
    background-color: rgb(221 9 9 / 79%);
}


.text-wheel-selected {
    border: solid 2px blue !important;
    background-color: white !important;
    font-weight: bold;
    transform: scale(1.2);
    box-shadow: 0 0 6px rgba(0, 128, 0, 0.5);
    z-index: 9000 !important;
}

.wheel-text-disable {
    background-color: #d1d1d1;
    color: #3274e5;
    cursor: pointer;
    caret-color: transparent;
}

/* TABLE LIST */
.table-content {
    width: 90%;
    margin: 0 auto;
}
.row-data-name {
    padding-left: 5px;
}

.btn-search {
    background-color: #0066FF;
    color:white;
    width:100px;
    height:40px;
    margin:0px 10px;
    border:solid 1px black;
}
.btn-row-table {
    width: 40px;
    background-color: #F0F0F0;
}

.btn-search:hover, .btn-detail:hover {
    filter: brightness(90%);
}

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

.table-list th, .table-list td {
    border: solid 1px black;
    height: 41px;
}

.customer-search-inputs {
    display: flex;
    min-height: 40px;
    align-items: center;
    border: none
}

#suggest-customer-info, #suggest-group-info {
    min-height: 44px;
    display: none;
}

.option-selected-gray {
    background-color: #a6a6a6 !important;
}
.option-selected-white {
    background-color: white;
}