.container {
	display: flex;       /* 横並びにする */
	width: 100%;        /* 全体の横幅を指定 */
	gap: 4px;           /* 要素間の隙間 */
	box-sizing: border-box;
}

pre {
	min-width: 0;        /* フレックスアイテムの縮小を許可 */
	/* height: 100px;       高さを指定 */
	margin: 0;
	padding: 4px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;

/* --- ここが重要 --- */
	/* font-family: "Consolas", "Monaco", "Courier New", "Meiryo", monospace; */
	/* font-family: monospace;    等幅フォント（文字数確認用） */
	white-space: pre;  /* 折り返さない */
	overflow-x: auto; /* 横溢れ時にスクロール */
	overflow-y: auto; /* 内容が多い場合にスクロール */
	line-height: 1.5; /* 行の高さを明示的に固定（フォントサイズの1.5倍） */
}
pre {
/* background: #2d2d2d; color: #f8f8f2;  */
border-radius: 5px;
min-height: 20px; }

.pre{
	white-space: pre;  /* 折り返さない */
}

.group { background: #f0f4f8; border-left: 5px solid #007bff; width:100%;
	margin: 6px 0; padding: 2px; text-align: left;}
.keyword-label { color: #007bff; font-size: 1em; }
/* .stopword-input { width: 100%; height: 60px;} */
/* pre { background: white; padding: 4px; margin: 0px 0; border: 1px solid #ddd; overflow-x: auto; } */

/* pre u{background-color: #f1fa8c;} */

label { cursor: pointer; user-select: none; }

.w20p{width:20%;}
.w30p{width:30%;}
input.nume{width:40px;}
select{width:100px;}
pre mark {
	background-color: #f1fa8c; 
	color: #282a36;
}
.vv .rr, .note .rr{color:yellow; font-size: 0.9em;}/* comment, note */

/* 変換結果を表示する pre の整形 */
.container pre, .container div{
	/* background-color: #f9f9f9; */
	/* white-space: pre-wrap;     長い行を折り返す設定 */
	/* word-wrap: break-word;     単語の途中で折り返す設定 */
	flex: 1.0;             /* 1:1の比率で均等に幅を分ける */
}
.gray{color:silver;}
.blue{color:blue;}
.orange{color:orangered;}
/* .vv{color:#000;}
.note{color:#222;}
pre u:hover, pre:hover u{color:red;}.v0:hover pre u,  */

/* .rr span{
	font-size: 0.9em; 
} */
mark {
	background-color: #ffcf00; /* 鮮やかな黄色 */
	color: #000;
	/* font-weight: bold; */
	border-radius: 2px;
	padding: 0 2px;
}

/* .adj u.refadj, .adv u.refadv{
	color: #006;
}
.pron u.refpron, .prep u.refprep, .plain u.refpron, .plain u.refprep{/ *.plain: for iprev* /
	color: dimgray;
	background-image: none;
}
.auxi u.refauxi{
	color: #0f9;
}
.verb u.refverb{
	color: #9f0;
}
.word u.refword, .noun u.refnoun{
	color: #ff0;
}
.hada u.refhanja, .hada u.refhada{
	color: #9f9;
} */