@charset "utf-8";
/*===================================*
 * 
 * Cell Size 
 * 
 *===================================*/
/*--------------------------------*
 * cell width height
 *--------------------------------*/
.milchart table.chart_table td,
table.sticky_table tr.data_date th {
	width:40px;
	min-width: 40px;
}
.milchart table.chart_table td,
table.sticky_table tr.data_date th,
table.sticky_table tr.data_vid th {
	height:40px;
	min-height: 40px;
}
/*--------------------------------*
 * dataname width
 *--------------------------------*/
table.sticky_table th.summary {
	width:200px;
	min-width: 200px;
}











/*===================================*
 * 
 * Other
 * 
 *===================================*/
/*--------------------------------*
 * html,body
 *--------------------------------*/
html,
body {
	height:100%;
	width:100%;
}
body {
	width:100%;
}
/*--------------------------------*
 * milchart_window
 *--------------------------------*/
.milchart_window {
	margin-top:100px;
	margin-left:100px;
	width:1600px;
	height:300px;
	overflow: scroll;
	position:relative;
}
/*--------------------------------*
 * milchart
 *--------------------------------*/
.milchart {
	position:relative;
}
.viewport {
	overflow:hidden;
	position:relative;
}
/*--------------------------------*
 * chart_table
 *--------------------------------*/
.milchart table.chart_table {
	white-space: nowrap;
	overflow:hidden;
	z-index:1;
	position:relative;;
}
.milchart table.chart_table td {
 	border:1px solid #ccc;
	padding:5px;
	text-align:center;
	vertical-align:middle;
	user-select: none;
	background:#fff;
	background-clip: padding-box;

}
/*--------------------------------*
 * sticky_table
 *--------------------------------*/
table.sticky_table th {
	user-select: none;
	background:#e8faff;
	white-space: nowrap;
	background-clip: padding-box;
	border:1px solid #ccc !important;
	background-clip: padding-box;
	text-align:center;
	vertical-align:middle;
}
table.sticky_table tr.data_date th {
}
table.sticky_table tr.data_vid th {
	z-index:100;
}
table.sticky_table thead {
	height:100px;
	z-index:110;
}
.fixed {
	position:sticky;
	left:0;
	top:0;
}
/*--------------------------------*
 * scrollbar
 *--------------------------------*/
.milchart::-webkit-scrollbar {
	width:20px;
	height:20px;
}
.milchart::-webkit-scrollbar-track {
	background:#eee;
	border-radius: 4px;
}
.milchart::-webkit-scrollbar-thumb {
	background:#bbb;
	border-radius: 4px;
}
/*--------------------------------*
 * other
 *--------------------------------*/
.milchart .selected {
	border:2px solid #4af;
}
.milchart .isset {
	background-color:#eee !important;
}
.milchart .grabpoint {
	cursor:pointer;
	position: absolute;
	z-index: 30;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 2px solid #fff;
	box-sizing: border-box;
	background: #4af;
	margin-top: -7px;
	margin-left: -7px;
}
.milchart .bar {
	overflow:hidden;
	opacity:0.9;
	cursor:pointer;
	z-index:10;
	background:#e67f7a;
	border-radius:3px;
	position:absolute;
	height: auto;
	user-select: none;
}
.milchart .bar p{
	padding:0 4px;
	white-space: nowrap;
	text-align:center;
	color:#fff;
	font-size:0.8rem;
	line-height:0.8rem;
}
.milchart .delete_point {
	cursor:pointer;
	position: absolute;
	z-index: 20;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid #fff;
	box-sizing: border-box;
	background: #000;
	margin-top: -14px;
	margin-left:-2px;
	color:#fff;
}
.milchart .delete_point:before {
    content: '✖';
    color: #fff;
	position:absolute;
	left:3px;
	top:-1px;
	font-size:0.8rem;
}
/*--------------------------------*
 * overlay
 *--------------------------------*/
.overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0, 0, 0, .7);
	z-index: 10000;
	opacity: 1;
}
.overlay .content {
	overflow-y:scroll;
	overflow-x:hidden;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 800px;
	background:#fff;
	color: #000;
	font-size: 16px;
	text-align: center;
	min-height:500px;
	height:inherit;
	padding:30px;
	border-radius:10px;
	max-height: calc(100% - 40px);
}
/*--- overlay [table] ---*/
.overlay .content table {
	border-radius:10px;
	border:3px solid #ccc;
	border-collapse: separate;
	width:100%;
}
.overlay .content table th,
.overlay .content table td{
	text-align:left;
	padding:20px 10px 20px 20px;
	vertical-align:top;
}
.overlay .content table th{
	padding-top:25px;
	padding-left:50px;
	width:30%;
}
/*--- overlay ul ---*/
.overlay .content table ul {
	display:flex;
	justify-content:center;
	border-top:2px solid #ccc;
}
.overlay .content table ul li {
	margin-top:10px;
	text-align:center;
}
.overlay .content table ul li:nth-child(2) {
	margin-left:10px;
}
/*--- overlay button ---*/
.overlay .content table button {
	width:130px;
	min-width:130px;
	background:#006c94;
	color:#fff;
	padding:10px;
	border-radius:5px;
	cursor:pointer;
}
.overlay .content table button:hover{
	opacity:0.8;
}
/*--- overlay [input select textarea] ---*/
.overlay .content input,
.overlay .content select,
.overlay .content textarea {
	background:#ebf9ff;
	border-radius:4px;
	border:2px solid #ccc;
	padding:10px;
	text-align:left;
}
.overlay .content table select {
  -moz-appearance: menulist;
  -webkit-appearance: menulist;
}
.overlay .content table .calendar input {
	width:150px;
}
.overlay .content table .calendar input:nth-child(1) {
	margin-right:10px;
}
.overlay .content table .calendar input:nth-child(2) {
	margin-left:10px;
}
.overlay .content table textarea {
	min-height:200px;
}