@CHARSET "UTF-8";

/*=======================================================
 スクロール付きテーブルの基本スタイル
=======================================================*/

/*
	スクロール付きテーブルを収める最外枠
	重ね合わせの基準を指定
*/
.scrolltable_outer_container {
	position        : relative;
	width           : 100%;
	white-space     : nowrap;
}

/*
	各領域を最外枠内に全て重ね合わせ
*/
.scrolltable_top_left_container {
	position        : absolute;
	top             : 0;
	left            : 0;
	vertical-align  : top;
	white-space     : nowrap;
	overflow        : hidden;
}
.scrolltable_top_container {
	position        : absolute;
	top             : 0;
	left            : 0;
	vertical-align  : top;
	white-space     : nowrap;
	width           : 100%;
	overflow        : hidden;
}
.scrolltable_left_container {
	position        : absolute;
	top             : 0;
	left            : 0;
	vertical-align  : top;
	white-space     : nowrap;
	overflow        : hidden;
}
.scrolltable_body_container {
	position        : absolute;
	top             : 0;
	left            : 0;
	vertical-align  : top;
	white-space     : nowrap;
	width           : 100%;
	overflow        : scroll;
}

/*
	スクロール付きテーブルの基本スタイル
	ボーダー、背景色、セルのデフォルトの大きさ等を設定
*/
table.scrolltable {
	background      : white;
	border          : silver 1px solid;
	border-collapse : collapse;
	table-layout    : fixed;
	word-break      : break-all;
	word-wrap       : break-word;
}
table.scrolltable > tbody > tr > td {
	background  : white;
	border      : silver 1px solid;
	font-weight : normal;
	padding     : 0px 2px;
	white-space : nowrap;
	width       : 100px;
	max-width   : 100px;
	min-width   : 100px;
	height      : 28px;
	overflow    : hidden;
}

/* 上領域のセルをデフォルトでセンタリング */
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td,
.scrolltable_top_container > table.scrolltable > tbody > tr > td {
	text-align  : center;
}

/* 上領域を二重線で区切り */
.scrolltable_top_left_container > table.scrolltable > tbody > tr:last-of-type > td,
.scrolltable_top_container > table.scrolltable > tbody > tr:last-of-type > td {
	border-bottom-width : 3px;
	border-bottom-style : double;
}
/* 左領域を二重線で区切り */
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td:last-of-type,
.scrolltable_left_container > table.scrolltable > tbody > tr > td:last-of-type {
	border-right-width : 3px;
	border-right-style : double;
}

/* 奇数行の背景色 */
.scrolltable_left_container > table.scrolltable > tbody > tr:nth-of-type(2n) > td,
.scrolltable_body_container > table.scrolltable > tbody > tr:nth-of-type(2n) > td {
	background-color    : beige;
}

/* ハイライト行、ハイライトセル */
.scrolltable_top_left_container > table.scrolltable > tbody > tr.highlight > td,
.scrolltable_top_container      > table.scrolltable > tbody > tr.highlight > td,
.scrolltable_left_container     > table.scrolltable > tbody > tr.highlight > td,
.scrolltable_body_container     > table.scrolltable > tbody > tr.highlight > td,
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td.highlight,
.scrolltable_top_container      > table.scrolltable > tbody > tr > td.highlight,
.scrolltable_left_container     > table.scrolltable > tbody > tr > td.highlight,
.scrolltable_body_container     > table.scrolltable > tbody > tr > td.highlight {
	background  : yellow;
}

/* アラート行、アラートセル */
.scrolltable_top_left_container > table.scrolltable > tbody > tr.alert > td,
.scrolltable_top_container      > table.scrolltable > tbody > tr.alert > td,
.scrolltable_left_container     > table.scrolltable > tbody > tr.alert > td,
.scrolltable_body_container     > table.scrolltable > tbody > tr.alert > td,
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td.alert,
.scrolltable_top_container      > table.scrolltable > tbody > tr > td.alert,
.scrolltable_left_container     > table.scrolltable > tbody > tr > td.alert,
.scrolltable_body_container     > table.scrolltable > tbody > tr > td.alert {
	background  : hotpink;
}

/* グレーアウト行、グレーアウトセル */
.scrolltable_top_left_container > table.scrolltable > tbody > tr.grayout > td,
.scrolltable_top_container      > table.scrolltable > tbody > tr.grayout > td,
.scrolltable_left_container     > table.scrolltable > tbody > tr.grayout > td,
.scrolltable_body_container     > table.scrolltable > tbody > tr.grayout > td,
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td.grayout,
.scrolltable_top_container      > table.scrolltable > tbody > tr > td.grayout,
.scrolltable_left_container     > table.scrolltable > tbody > tr > td.grayout,
.scrolltable_body_container     > table.scrolltable > tbody > tr > td.grayout {
	background  : gray;
}

/* 入力エラー行、入力エラーセル */
.scrolltable_top_left_container > table.scrolltable > tbody > tr.input_error_bg > td,
.scrolltable_top_container      > table.scrolltable > tbody > tr.input_error_bg > td,
.scrolltable_left_container     > table.scrolltable > tbody > tr.input_error_bg > td,
.scrolltable_body_container     > table.scrolltable > tbody > tr.input_error_bg > td,
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td.input_error_bg,
.scrolltable_top_container      > table.scrolltable > tbody > tr > td.input_error_bg,
.scrolltable_left_container     > table.scrolltable > tbody > tr > td.input_error_bg,
.scrolltable_body_container     > table.scrolltable > tbody > tr > td.input_error_bg {
	background  : #ffcccc;
}
/* カーソル行表示 */
.scrolltable_top_left_container:not(.no_cursor) > table.scrolltable:not(.no_cursor) > tbody > tr.cursor_row:not(.no_cursor) > td:not(.no_cursor),
.scrolltable_top_container:not(.no_cursor)      > table.scrolltable:not(.no_cursor) > tbody > tr.cursor_row:not(.no_cursor) > td:not(.no_cursor),
.scrolltable_left_container:not(.no_cursor)     > table.scrolltable:not(.no_cursor) > tbody > tr.cursor_row:not(.no_cursor) > td:not(.no_cursor),
.scrolltable_body_container:not(.no_cursor)     > table.scrolltable:not(.no_cursor) > tbody > tr.cursor_row:not(.no_cursor) > td:not(.no_cursor) {
	background  : #cceeff;
}


/*
	ページングの見出しセルのソート方向表示アイコン
*/
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td.sort_asc,
.scrolltable_top_container > table.scrolltable > tbody > tr > td.sort_asc {
	background      : url('./webapp/images/sort_asc_mark_18x18.png') no-repeat;
}
.scrolltable_top_left_container > table.scrolltable > tbody > tr > td.sort_desc,
.scrolltable_top_container > table.scrolltable > tbody > tr > td.sort_desc {
	background      : url('./webapp/images/sort_desc_mark_18x18.png') no-repeat;
}

/* テーブル内でレイアウト用にテーブルを入れ子にするときパディングを無効化 */
.scrolltable_separator_container {
	padding     : 0px;
	text-align: :left;
}
/* スクロールテーブル内で使う分割用テーブル */
table.scrolltable_separator {
	border-collapse : collapse;
	table-layout    : fixed;
	word-break      : break-all;
	word-wrap       : break-word;
	border-width    : 0px;
	height          : 100%;
}
table.scrolltable_separator > tbody > tr > td {
	border      : silver 1px solid;
	font-weight : normal;
	padding     : 0px 2px;
	white-space : nowrap;
	min-height  : 28px;
	overflow    : hidden;
}
/* 上下左右のボーダーをなくす */
table.scrolltable_separator > tbody > tr:first-child > td {border-top-width    : 0px;}
table.scrolltable_separator > tbody > tr:last-child > td  {border-bottom-width : 0px;}
table.scrolltable_separator > tbody > tr > td:first-child {border-left-width   : 0px;}
table.scrolltable_separator > tbody > tr > td:last-child  {border-right-width  : 0px;}