:root {
	--header-bgcolor: black;	/*#557624;*/	/* ヘッダー部の背景色 */
}

* { box-sizing: border-box; }

body {
	margin: 0;
}

/* cellspacing=0 の設定 */
table {
	border-collapse: collapse;
}

/* cellpadding=0 & border=0 の設定 */
table th, table td {
	padding: 0px;
	border: 0px;
}

a {
	color: #004be0;
}

input[type="text"][readonly] {
	border: none;
	pointer-events: none;
}

input[type="number"] {
	width: 5em;
	text-align: right;
}

/* スピナーの常時表示 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  opacity: 1;
}

/* readonly時のマウス操作抑制 */
select[readonly],
input[type="radio"][readonly],
input[type="checkbox"][readonly] {
	pointer-events: none;
}

input[type="checkbox"][readonly] + label {
	pointer-events: none;
}

/* デフォルトの文字サイズが小さいということで変更 */
input {
	font-size: 1em;
}

textarea {
	font-size: 1em;
	resize: none;
}

select {
	font-size: 1em;
}

button {
	font-size: 1em;
}

fieldset {
	display: inline-block;
	border: 1px solid #CCCCCC;
}

/* キャプションが2行のボタン */
.btn2h {
	line-height: 1em;
	height: 2.5em;
	white-space: nowrap;
}

.btn_orange {
	background-color: #FFC000;
	/*border:1px solid gray;*/
}

.btn_orange:hover {
	background-color: #EFB000;
	/*border:1px solid gray;*/
}

/* disbledは半透明 */
*:disabled {
	opacity: 0.3;
}

/* ----------------------------------------------
	ページ内レイアウトの制御
------------------------------------------------- */
#header {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	padding-bottom: 4px;
	/*background-color: white;*/
	z-index: 10;
}

#content {
	margin-top: 92px;
	height: calc(100vh - 94px);
	min-height: 720px;
	position: relative;
}

.paneMap {
	float: left;
	width: 50%;
	height: 100%;
}

.paneL {
	float: left;
	width: 50%;
	height: 100%;
}

.paneR {
	float: right;
	width: 50%;
	height: 100%;
}

.paneB {
	float: left;
	width: 100%;
	height: 100%;
}

#check_list {
	height: 100%;
}

/* 上下配置モード */
@media screen and (orientation: portrait) {

	#content {
		height: auto;
	}

	.paneMap {
		float: none;
		width: 100%;
		height: 90vh;	/*50%;*/
	}

	.paneL {
		float: none;
		width: 100%;
		height: auto;	/*50%;*/
	}

	.paneR {
		float: none;
		width: 100%;
		height: auto;	/*50%;*/
	}

	.paneB {
		float: none;
		width: 100%;
		height: calc(100vh - 55px);
	}

	#check_list {
		height: auto;
	}

	.colfull {
		display: none;
	}
}

/* ----------------------------------------------
	タイトルバー
------------------------------------------------- */
.title_bar {
	background-color: var(--header-bgcolor);
	color: white;
	padding: 0px 8px;
}

.title_bar table {
	height: 50px;
}

.title_bar td {
	white-space: nowrap;
}

.title_bar img {
	height: 40px;
	background-color: white;
	display: inline-block;
	vertical-align: middle;
	opacity: 0.8;
}

#title_name {
	font-size: 22px;
	padding-right:8px;
	display: inline-block;
	vertical-align: middle;
}

/* ハンバーガーボタン：ここで全体のサイズ */
.hamburger {
	position: relative;
	width: 30px;
	height: 26px;
	top: 2px;
	left: -3px;
	display: none;
}

/* 三本線 */
.hamburger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #FFF;
}

/* 三本線の上の部分 */
.hamburger span:nth-of-type(1) {
	top: 0;
}

/* 三本線の中心部分 */
.hamburger span:nth-of-type(2) {
	top: 12px;
}

/* 三本線の下の部分 */
.hamburger span:nth-of-type(3) {
	bottom: 0;
}

/* ハンバーガー三本線：棒の動きや傾き加減など */
.hamburger span {
	display: inline-block;
	transition: all .4s; /* クリックしてからの動作時間 */
	z-index: 10;
}

/* ここで数字を変えて傾きなどを調節 */
.hamburger.active span:nth-of-type(1) { /* 上の棒線 */
	transform: translateY(12px) rotate(-45deg);
	-webkit-transform: translateY(12px) rotate(-45deg);
}

.hamburger.active span:nth-of-type(2) { /* クリックしたら消える真ん中の棒線 */
	opacity: 0;
}

.hamburger.active span:nth-of-type(3) { /* 下の棒線 */
	transform: translateY(-12px) rotate(45deg);
	-webkit-transform: translateY(-12px) rotate(45deg);
}

/* ----------------------------------------------
	ドロップダウンメニュー
------------------------------------------------- */
/* メニューの一覧 */
.menu ul {
	padding: 0px;
	margin: 0px;
	list-style: none;
}

.menu li {
	padding: 0px;
	margin: 0px;
	list-style: none;
}

ul.menu {
	background-color: var(--header-bgcolor);
	letter-spacing: -100px; /* inline-blockで要素を横並びにした時の隙間を無くす */
	padding: 0px;
	margin: 0px;
	border-top: 1px solid white;
}

/* メイン */
ul.menu li {
	position: relative;
	display: inline-block; /* これが無いと、子と孫の位置がかなりずれる */
	letter-spacing: normal; /* 上で指定したletter-spacingを元通りに */
	border-right: 1px solid white;
	/*width: 16%;*/	/* 横並びの個数で調整*/
}

ul.menu > li:first-child {
/*	width: 6%;*/
}
ul.menu > li:last-child {
	border-right: none;
}

ul.menu a {
	display: block; /* リンクボタン全体をクリック出来るように */
	padding: 8px 15px; /* ここでメニューのサイズ */
	text-decoration: none;
	color: white;
}

ul.menu a:hover {
	background-color: rgba(192, 192, 192, 0.2) !important;	/* グレーの薄さ0.2 */
	color: white !important;
}

/* サブメニュー(hover時) */
ul.menu li:hover > ul {
	display: block; /* ここで表示(hover時) */
}
 
/* サブメニュー */
ul.menu ul {
	display: none;
	position: absolute;
}

/* サブメニュー以降 */
ul.menu ul li {
	width: 205px; /* ここである程度の長さを指定しないと、文字が縦並びになる(px指定) */
	background-color: var(--header-bgcolor);
	border: 1px solid white;
	border-top: none;
}

ul.menu ul li a {
	color: white;
}

/* 孫メニュー以降の表示について */
ul.menu ul ul {
	display: none;
	position: absolute;
	top: -1px; /* これがないと、項目の子メニューの真横に孫メニューが表示されない */
	left: 100%; /* 親要素から、左から右に100％ずらす */
}

/* 上下配置モード */
@media screen and (orientation: portrait) {

	#content {
		margin-top: 51px;
		height: auto;
	}

	.hamburger,
	.hamburger span {
	    display: inline-block;
	}

	/* メニュー部分 */
	#nav {
		position: absolute;
		top: 0;
		width: 100%;
		display: none;
		/*transform: translateX(-100vw);*/ /* ここで要素を画面外に配置 */
		/*transition: all .2s;*/
	}

	#nav.active { /* アクティブ時 */
		display: block;
		/*transform: translateX(0%);*/ /* ここで要素を元の位置に */
		/*transition: all .2s;*/
	}

	ul.menu li {
	    display: block;	/*initial;*/
	    width: 100%;
		border-top: 1px solid white;
	}

	/* サブメニュー */
	ul.menu ul {
	    display: none;	/*initial;*/
	    position: relative;	/*initial;*/
	}

	/* サブメニュー(hover時) */
	ul.menu li:hover > ul {
		display: block; /* ここで表示(hover時) */
	}

	ul.menu ul li {
		width: 100%;
		/*background-color: white;*/
	}
	ul.menu ul ul {
	    display: block;	/*initial;*/
	    position: relative;	/*initial;*/
	    top: 0;	/*initial;*/
	    left: 0;	/*initial;*/
	}
}

/* ----------------------------------------------
	一覧用コマンド
------------------------------------------------- */
.listmenu {
	/* padding: 4px 8px; */
}

.listmenu button {
	width: 3em;
	line-height: 1em;
	height: 2.5em;
	white-space: nowrap;
}

/* ----------------------------------------------
	一覧テーブル
------------------------------------------------- */
.std_tbl {
	/*font-size: 12px;*/
}

.std_tbl caption {
	color: white;
	background-color: #9DB861;
	width: 11em;
}

.std_tbl th {
	padding: 4px 4px;
	font-weight: normal;
	white-space: nowrap;
	background-color: #D7E3BF;
	border: 1px solid #CCCCCC;
}

.std_tbl td {
	padding: 4px 4px;
	text-align: center;
	border: 1px solid #CCCCCC;
}

.fix_tbl th {
	position: sticky;
	top: 0px;
	left: 0px;
}

.fix_tbl th:before {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	width: 100%;
	height: 100%;
	border: 1px solid #CCCCCC;
	box-sizing: content-box;
}

.selrow {
	background-color: #FFF2CC;	/* 選択行の色 */
}

.cap_tbl {
	/*font-size: 12px;*/
}

.cap_tbl th {
	padding: 2px 4px;
	font-weight: normal;
	color: white;
	background-color: #9DB861;
	width: 11em;
}

.cap_tbl td {
	padding: 2px 4px;
	color: #0595b1;
	background-color: #DBEEF3;
}

/* 黄色地 */
.yellow_cell {
	background-color: yellow;
}

/* 赤地 */
.red_cell {
	color: white;
	background-color: red;
}

/* ----------------------------------------------
	編集テーブル
------------------------------------------------- */
.edit_div {
	padding: 8px;
	position: absolute;
	bottom: 8px;
	left: 8px;
	background-color: white;
	z-index: 2;
}

tr.required th::after {
	content: "必須";
	margin-left: 3px;
	color: white;
	background: red;
	padding: 0px 2px;
	font-size: 12px;
}

th.required::after {
	content: "必須";
	margin-left: 3px;
	color: white;
	background: red;
	padding: 0px 2px;
	font-size: 12px;
}

.edit_div button {
	width: 6em;
	height: 2.5em;
}

.edit_mask {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	padding: 0px;
	margin: 0px;
	opacity: .10;
	filter: alpha(opacity=10);
	background-color: black;
	z-index: 1;
}

td.kpass_cell input {
	width: 95%;
}

td.plus_code_kpass_cell input {
	width: 60%;
}

#plus_code_btn {
	width: 33%;
	height: 2em;
	margin-left: 2%;
}

/* ----------------------------------------------
	ダイアログ
------------------------------------------------- */
.dialog {
	padding: 0px;
	border: 1px solid gray;
	border-radius: 6px;
	box-shadow: 0 0 1em rgba(0,0,0,0.5);
	width: 25%;
	min-width: 200px;
}

/* 見出し部 */
.dialog-header {
	border-bottom: 1px solid #CCCCCC;
	padding: 2px 8px;
}

/* コンテンツ */
.dialog-body {
	padding: 1em 8px;
}

/* フッター部（ボタンが並ぶ） */
.dialog-footer {
	border-top: 1px solid #CCCCCC;
	padding: 8px;
	text-align: right;
}

/* ----------------------------------------------
	背景地図選択
------------------------------------------------- */
.basemap {
	position: absolute;
	top:8px;
	right:8px;
}

.basemap summary {
	background-color: white;
	padding: 0px 4px;
}

.basemap > div {
	background-color: rgba(255,255,255,0.8);
	padding: 0px 2px;
}

/* ----------------------------------------------
	プログレスダイアログ
------------------------------------------------- */
.progress {
	position: absolute;
	left: calc((100vw - 200px) / 2);
	top: calc((100vh - 3em) / 2);
	padding: 1em;
	background-color: white;
	border: 1px solid gray;
	border-radius: 6px;
	box-shadow: 0 0 1em rgba(0,0,0,0.5);
	width: 200px;
	z-index: 100;
}

.graph {
	position: relative;
	border: 1px solid #CCCCCC;
}
.graph .bar {
	display: block;
	position: relative;
	background: orange;
	text-align: center;
	white-space: nowrap;
}

/* ----------------------------------------------
	reveal
------------------------------------------------- */

/* edge デフォルトの目アイコンの非表示 */
::-ms-reveal {
    display: none;
}

#passwrap {
	border: 1px solid #767676;
	border-radius: 3px;
	background-color: white;
}

#eye {
	width: 32px;
	height: 22px;
	border: none;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='48' width='48'><path d='M24 31.5q3.55 0 6.025-2.475Q32.5 26.55 32.5 23q0-3.55-2.475-6.025Q27.55 14.5 24 14.5q-3.55 0-6.025 2.475Q15.5 19.45 15.5 23q0 3.55 2.475 6.025Q20.45 31.5 24 31.5Zm0-2.9q-2.35 0-3.975-1.625T18.4 23q0-2.35 1.625-3.975T24 17.4q2.35 0 3.975 1.625T29.6 23q0 2.35-1.625 3.975T24 28.6Zm0 9.4q-7.3 0-13.2-4.15Q4.9 29.7 2 23q2.9-6.7 8.8-10.85Q16.7 8 24 8q7.3 0 13.2 4.15Q43.1 16.3 46 23q-2.9 6.7-8.8 10.85Q31.3 38 24 38Zm0-15Zm0 12q6.05 0 11.125-3.275T42.85 23q-2.65-5.45-7.725-8.725Q30.05 11 24 11t-11.125 3.275Q7.8 17.55 5.1 23q2.7 5.45 7.775 8.725Q17.95 35 24 35Z'/></svg>") no-repeat center center;
	background-size: 60% auto;
	cursor: pointer;
	opacity: 0.6;
}

#eye.visible {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='48' width='48'><path d='m31.45 27.05-2.2-2.2q1.3-3.55-1.35-5.9-2.65-2.35-5.75-1.2l-2.2-2.2q.85-.55 1.9-.8 1.05-.25 2.15-.25 3.55 0 6.025 2.475Q32.5 19.45 32.5 23q0 1.1-.275 2.175-.275 1.075-.775 1.875Zm6.45 6.45-2-2q2.45-1.8 4.275-4.025Q42 25.25 42.85 23q-2.5-5.55-7.5-8.775Q30.35 11 24.5 11q-2.1 0-4.3.4-2.2.4-3.45.95L14.45 10q1.75-.8 4.475-1.4Q21.65 8 24.25 8q7.15 0 13.075 4.075Q43.25 16.15 46 23q-1.3 3.2-3.35 5.85-2.05 2.65-4.75 4.65Zm2.9 11.3-8.4-8.25q-1.75.7-3.95 1.075T24 38q-7.3 0-13.25-4.075T2 23q1-2.6 2.775-5.075T9.1 13.2L2.8 6.9l2.1-2.15L42.75 42.6ZM11.15 15.3q-1.85 1.35-3.575 3.55Q5.85 21.05 5.1 23q2.55 5.55 7.675 8.775Q17.9 35 24.4 35q1.65 0 3.25-.2t2.4-.6l-3.2-3.2q-.55.25-1.35.375T24 31.5q-3.5 0-6-2.45T15.5 23q0-.75.125-1.5T16 20.15Zm15.25 7.1Zm-5.8 2.9Z'/></svg>");
}

#eye:hover {
	opacity: 0.6;
}