.htextViewer {
	position: relative;
}

/* width, heightをボーダー、内部余白まで含めたサイズ指定にする
 * これをやめると2列以上ある階層情報を表示した時に1列目にスクロールバーが
 * 表示されるようになる。
 * (展開ハンドルを含めたセルの幅とCSSで指定したセルの幅に差異が発生するため。)
 * 'border-box'は解除しないようにする。
 */
.htextViewer *, .htextViewer *:before, .htextViewer *:after {
	box-sizing: border-box;
}

.htextViewer .header {
	z-index: 2;
	position: -webkit-sticky; /* Safari ver.6.1 - ver.12 */
	position: sticky;
	top: 0px;
	background: rgba(255, 255, 255, 0.9);
}

.htextViewer .header table {
	border-collapse: collapse;
}
.htextViewer .header td {
	margin: 0px;
	padding: 0px;
	vertical-align: middle;
	font-family: courier,monospace;
}

.htextViewer .header .columnTitle .column {
	/* br08501 の "KEGG Resource" 等で折り返しを発生させない */
	white-space: nowrap;
	/* はみ出たカラム名が隣のセルにかからないように、はみ出た部分は非表示にする */
	overflow: hidden;
	text-overflow: ellipsis;
}
.htextViewer .header .columnTitle .column:not(:first-child) {
	/* 罫線描画時の見映えのためにわずかにスペースを挿入 */
	padding-left: 2px;
}

/* 一括展開ハンドルの間隔 margin-left = インデント幅(15px) - open.svgの幅(9px) */
.htextViewer .header .expandHandle .handle:not(:first-child) {
	margin-left: 6px;
}

.htextViewer .body {
	position: absolute;
}

.htextViewer .htextGrid {
	border-collapse: collapse;
}

.htextViewer .htextGrid td {
	margin: 0px;
	padding: 0px;

	background: #ffffff;
	min-width: 10px;

	/* マーカーの絶対位置表示のために必要 */
	position: relative;

	/* position:relativeを設定するとFirefox で
	 * tdタグの枠線（border）が表示されなくなる問題への対応。
	 */
	background-clip: padding-box;

	/* 行間の設定
   * line-heightを指定していないと日本語ファイルは
   * 文字の実際の高さよりtdタグの高さが高くなり、行間が広がりすぎる。
   * 逆に行間のスペースを調整したい場合はここで設定するとよい。
   */
	line-height: 1.2em;

	font-family: courier,monospace;

	/* 折り返しは禁止して、
   * セルの幅を超えた文字は "..." で表示する。
   */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.htextViewer .htextGrid td * {
	/* 中央寄せすると検索結果のハイライトタグの前後で段ができる。 */
	/* 逆にmiddleにしないと左端のマーカーと展開ハンドルが綺麗に並ばない。 */
	-vertical-align: middle;
}
.htextViewer .body .column:not(:last-child) .htextGrid td {
	/* カラムの区切りを分かりやすくするために、わずかにスペースを挿入 */
	padding-right: 10px;
}
.htextViewer.borderd .htextGrid .firstRow td { /* 行の境界線 .borderd指定時だけ有効 */
	border-top: solid 1px #dddddd;
}
.htextViewer .body .column:not(:first-child) .htextGrid td {
	/* 罫線描画時の見映え（詰まった感じにさせない）のために、
   * 2カラム目以降のセルの左端にスペースを挿入
   */
	padding-left: 2px;
}
.htextViewer.borderd .body .column:not(:first-child) .htextGrid td {
	/* 行の境界線 .borderd指定時だけ有効 */
	border-left: solid 1px #dddddd;
}
.htextViewer.striped .htextGrid .evenRow td { /* 行の背景色 .striped指定時だけ有効 */
	background: #eeeeee;
}
.htextViewer .htextGrid .separator td {
	border-bottom: solid 1px #eeeeee;
}

.htextViewer .markers {
	position: absolute;
	top: 0px;
	left 0px;
}
.htextViewer .marker {
	margin: 0px;
	padding: 0px;

	/* スクロール時にヘッダー部のマーカーとボディ部のマーカーの間に
   * 継ぎ目が見えるように罫線を入れる。
   */
	border-bottom: solid 1px white;
}
.htextViewer.borderd .marker {
	/* ボーダーを表示している時はボーダーが継ぎ目になるので
   * 下部の罫線は無しにする。
   */
	border-bottom: solid 0px white;
}
.htextViewer .marker.clickable:hover {
	cursor: pointer;
}

.htextViewer .body .handle {
}
.htextViewer .body .handle:before {
	content: url(/Fig/get_htext/whiteSP.svg);
	margin: 0 9px 0 0;
}

.htextViewer .body .parent .handle:hover:before {
	cursor: pointer;
}

.htextViewer .body .parent .handle:before {
	content: url(/Fig/get_htext/close.svg);
	margin: 0 9px 0 0;
}

.htextViewer .body .parent.expanded .handle:before {
	content: url(/Fig/get_htext/open.svg);
	margin: 0 9px 0 0;
}

.htextViewer .hit.focus {
	background: #ffa07a !important;
}

/* カラム名のピン */
img.pin {
	transform: rotate(-100deg);
}
img.pin.stabbed {
	transform: rotate(-175deg);
}
img.filter.clickable {
	border: solid 1px #ffffff;
	border-right: solid 1px #cccccc;
	border-bottom: solid 1px #cccccc;
}
img.filter.clickable {
	cursor: pointer;
}
img.filter.stabbed { /* Pruning = ON */
	background: #e8e8e8;
}
img.filter.enabled { /* Filter = ON */
	border: solid 1px #777777;
	-border-right: solid 1px #a0a0a0;
	-border-bottom: solid 1px #a0a0a0;
}
img.filter.stabbed.enabled { /* Pruning = ON and Filter = ON */
	border-right: solid 1px #707070;
	border-bottom: solid 1px #707070;
}