#header {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  max-width: 1000px;
  min-width: 300px;
  min-height: 250px;
  margin: 0 auto;
  padding: 0;
  background-color: #42484E;
  color: #fff;
}

#header .header-bg {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
}

#header .title {
  position: relative;
}

html.dark #header::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  filter: invert(100%) hue-rotate(180deg);
  pointer-events: none;
}

html.dark #header .header-bg {
  filter: invert(100%) hue-rotate(180deg);
}


.tablemenu td.style_td a:link,
.tablemenu td.style_td a:visited {
  color: #03c;
  text-decoration: none;
}

.tablemenu table.style_table tbody td {
  color: #222;
}

th.style_th a:link,
th.style_th a:visited {
  color: #03c;
  text-decoration: underline;
}

td.style_td a:link,
td.style_td a:visited {
  color: #40c4ff;
  text-decoration: underline;
}

a:active {
	color: #F60;
}

thead td.style_td,
tfoot td.style_td {
	color:#fff;
	background-color:#2b2b2b;
  border: 1px solid #666;
}
.style_th {
	padding:5px;
	background-color:#dcdcdc;
  border: 1px solid #aaa;
}
.style_td {
	padding:8px 4px;
	margin:1px;
	color:inherit;
  font-size:12px;
}

#menubar strong {
  font-size: 1.05em;
}


/* tablesorter */
table.style_table thead td::before {
  border: 1px solid #777;
}


table.style_table tbody td {
	color: #eee;
	background-color: #444;
  border: 1px solid #777;
}

#body table.style_table tbody tr:nth-child(odd) td {
  background: #444;
}

table.style_table thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
	background-color: #555;
}

table.style_table thead th,
table.style_table thead td {
  position: relative;
  top: 0px;
  z-index: 2;
}


th.sortable::after {
  content: "▼";
  display: block;           /* ← 改行して下に表示 */
  font-size: 0.6em;
  color: #999;
  opacity: 0.5;
  margin-top: 0.2em;        /* 上の文字と少し余白 */
}

th.sortable.asc::after {
  content: "▲";
  color: #000;
  opacity: 1;
}

th.sortable.desc::after {
  content: "▼";
  color: #000;
  opacity: 1;
}


.ac_block .plugin-ac-header {
  border: 1px solid #ccc;
  padding: 12px 40px 12px 16px;
  background: #fff;
  position: relative;
  font-weight: bold;
  cursor: pointer;
}

.ac_block .plugin-ac-header .ac-icon::before,
.ac_block .plugin-ac-header .ac-icon::after {
  left: auto;
  right: 12px;
  font-size: 1.2em;
  color: #333;
}

.ac_block .plugin-ac-header:hover {
  filter: none;
}

.ac_block .plugin-ac {
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 12px 16px;
  margin: 0;
  background: #fafafa;
}

/* div odd */
div.odd tbody tr:nth-child(odd) td {
  background-color: #333 !important;
}