﻿html,body{
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	min-height:100%;
	background-color: #f1f0f5;
	font-family: "SF Pro JP","SF Pro Text","SF Pro Icons","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック","Helvetica Neue","Helvetica","Arial",sans-serif;
}
label,span,button,input[type=button]{
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.Drive_List_Box{
	position: relative;
	width:100%;
	height:100%;
	overflow:auto;
}

table{
	border-collapse: collapse;
	cursor:default;
}
tr{
	border: 0px solid #666;
}
th, td{
	border: 0px solid #666;
}
input,textarea{
	font-family: "SF Pro JP","SF Pro Text","SF Pro Icons","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック","Helvetica Neue","Helvetica","Arial",sans-serif;
}
input,textarea,select,button{
	outline: none;
	vertical-align: middle;
}
input[type="date"],
input[type="month"],
input[type="search"],
input[type="submit"],
input[type="button"],
button{
	border-width:1px;
	background-color: rgb(239,239,239);
	-webkit-appearance: none;
}
select{
}
input[type="radio"]{
	margin:0 5px;
}
input[type="button"],
input[type="range"].Switch::-webkit-slider-thumb,
button{
	cursor : pointer;
}
input[type="date"]::-webkit-datetime-edit-text{
	-webkit-appearance: none;
}
li{
	list-style-type : none;
}

div.Input-Group{
	display:table;
	border-collapse:separate;
}
	div.Input-Group .Form-Control{
		display:table-cell;
	}

input[type="range"].Switch{
	-webkit-appearance: none;
	padding:3px;
	width:60px;
	height: 25px;
	float: left;
	background:#000;
	border: 2px solid #7f7f7f;
	border-radius: 50vh;
	box-shadow:inset 2px 2px 3px 0px rgb(0, 0, 0, 0.3), inset -2px -2px 3px 0px rgb(255, 255, 255, 0.3);
}
	input[type="range"].Switch::-webkit-slider-thumb{
		-webkit-appearance: none;
		width: 65%;
		height: 15px;
		background:#b4b4b4;
		border: 0px solid #b4b4b4;
		border-radius: 50vh;
		box-shadow:2px 2px 3px 0px rgb(0, 0, 0, 0.3), -2px -2px 3px 0px rgb(255, 255, 255, 0.3);
	}
/*
#tfoot{
	position:absolute;
	width:100%;
	height:150px;
	background-color:rgb(27,40,49);
	bottom:0px;
}
*/
button dd.Push {
    position: absolute;
    top: -3px;
    right: -3px;
    width: 18px;
    font-size: 11px;
    line-height: 18px;
    color: #fff;
    text-align: center;
    background-color: rgb(255 0 0);
    border-radius: 50%;
    z-index: 1;
}

.USER_list_panel{
	position:fixed;
	width:180px;
	max-height:300px;
	z-index:99;
	background-color:#fff;
	border-radius:10px;
	border: 2px solid darkslategray;
	overflow:hidden;
}
.CLIENT_list_panel{
	position:fixed;
	width:180px;
	max-height:300px;
	z-index:99;
	background-color:#fff;
	border-radius:10px;
	border: 2px solid darkslategray;
	overflow:hidden;
}

#Holiday tr{
	border-bottom: 1px solid #afafaf;
}
#Holiday tr:last-child{
	border-bottom: 0px solid #afafaf;
}
#Holiday th,#Holiday td{
	border-right: 1px solid #afafaf;
}
#Holiday th:last-child,#Holiday td:last-child{
	border-right: 0px solid #afafaf;
}



.W_10{
	margin:0 2px;
	width:calc(10% - 4px);
	float:left;
}
.W_15{
	margin:0 2px;
	width:calc(15% - 4px);
	float:left;
}
.W_20{
	margin:0 2px;
	width:calc(20% - 4px);
	float:left;
}
.W_25{
	margin:0 2px;
	width:calc(25% - 4px);
	float:left;
}
.W_30{
	margin:0 2px;
	width:calc(30% - 4px);
	float:left;
}
.W_33{
	margin:0 2px;
	width:calc(33.3333% - 4px);
	float:left;
}
.W_40{
	margin:0 2px;
	width:calc(40% - 4px);
	float:left;
}
.W_50{
	margin:0 2px;
	width:calc(50% - 4px);
	float:left;
}
.W_66{
	margin:0 2px;
	width:calc(66.6666% - 4px);
	float:left;
}
.W_75{
	margin:0 2px;
	width:calc(75% - 4px);
	float:left;
}
.W_80{
	margin:0 2px;
	width:calc(80% - 4px);
	float:left;
}
.W_90{
	margin:0 2px;
	width:calc(90% - 4px);
	float:left;
}
.W_100{
	margin:0 2px;
	width:calc(100% - 4px);
	float:left;
}

@media (max-width: 400px){
	.W_10{
		margin:0 2px;
		width:calc(33.3333% - 4px);
		float:left;
	}
	.W_15{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_20{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_25{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_30{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_33{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_40{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_50{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_66{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_75{
		margin:0 2px;
		width:calc(100% - 4px);
	}
}@media (min-width: 401px) and (max-width: 800px){
	.W_10{
		margin:0 2px;
		width:calc(25% - 4px);
		float:left;
	}
	.W_15{
		margin:0 2px;
		width:calc(33.3333% - 4px);
	}
	.W_20{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_25{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_30{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_33{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_40{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_50{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_66{
		margin:0 2px;
		width:calc(100% - 4px);
	}
	.W_75{
		margin:0 2px;
		width:calc(100% - 4px);
	}
}@media (min-width: 801px) and (max-width: 1280px){
	.W_10{
		margin:0 2px;
		width:calc(16.6666% - 4px);
		float:left;
	}
	.W_20{
		margin:0 2px;
		width:calc(33.3333% - 4px);
	}
	.W_30{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_33{
		margin:0 2px;
		width:calc(50% - 4px);
	}
	.W_66{
		margin:0 2px;
		width:calc(50% - 4px);
	}
}
.W_10 p,.W_15 p,.W_20 p,.W_25 p,.W_30 p,.W_33 p,.W_40 p,.W_50 p,.W_66 p,.W_75 p,.W_80 p,.W_90 p,.W_100 p{
	margin:5px 0;
}

._W_10{
	width:10%;
	float:left;
}
._W_15{
	width:15%;
	float:left;
}
._W_20{
	width:20%;
	float:left;
}
._W_25{
	width:25%;
	float:left;
}
._W_30{
	width:30%;
	float:left;
}
._W_33{
	width:33.3333%;
	float:left;
}
._W_50{
	width:50%;
	float:left;
}
._W_66{
	width:66.6666%;
	float:left;
}
._W_75{
	width:75%;
	float:left;
}

@media (max-width: 400px){
	._W_15{
		width:25%;
	}
	._W_20{
		width:25%;
	}
	._W_25{
		width:33.3333%;
	}
	._W_30{
		width:50%;
	}
	._W_33{
		width:100%;
	}
	._W_50{
		width:100%;
	}
	._W_75{
		width:100%;
	}
}@media (min-width: 401px) and (max-width: 600px){
	._W_15{
		width:20%;
	}
	._W_20{
		width:25%;
	}
	._W_25{
		width:50%;
	}
	._W_30{
		width:50%;
	}
	._W_33{
		width:50%;
	}
	._W_50{
		width:50%;
	}
	._W_75{
		width:100%;
	}
}@media (min-width: 601px) and (max-width: 970px){
	._W_20{
		width:25%;
	}
	._W_25{
		width:33.3333%;
	}
	._W_30{
		width:50%;
	}
	._W_33{
		width:50%;
	}
	._W_75{
		width:66.6666%;
	}
}

@media (max-width: 200px){
	._Changeable_W{
		margin:5px;
		width:calc(100% - 10px);
		float:left;
	}
}
@media (min-width: 201px) and (max-width: 360px){
	._Changeable_W{
		margin:5px;
		width:calc(50% - 10px);
		float:left;
	}
}
@media (min-width: 361px) and (max-width: 600px){
	._Changeable_W{
		margin:5px;
		width:calc(33.3333% - 10px);
		float:left;
	}
}
@media (min-width: 601px) and (max-width: 860px){
	._Changeable_W{
		margin:5px;
		width:calc(25% - 10px);
		float:left;
	}
}
@media (min-width: 861px) and (max-width: 1024px){
	._Changeable_W{
		margin:5px;
		width:calc(20% - 10px);
		float:left;
	}
}
@media (min-width: 1025px) and (max-width: 1280px){
	._Changeable_W{
		margin:5px;
		width:calc(16.6666% - 10px);
		float:left;
	}
}
@media (min-width: 1281px){
	._Changeable_W{
		margin:5px;
		width:calc(10% - 10px);
		float:left;
	}
}

input[type=text], input[type=password]{
	border-width:1px;
	border-color:#aaa;
	border-radius:3px;
}
input[type=number]{
	border-width:1px;
	border-color:#aaa;
	border-radius:3px;
	text-align:right;
}
input[type=date]{
	border-width:1px;
	border-color:#aaa;
	border-radius:3px;
}
input[type=button]{
	border-width:1px;
	border-color:#aaa;
	border-radius:3px;
	font-size:11px;
}
input[type=button][target=ok]{
	color:rgba(111, 120, 154, 1);
	background-color:rgba(255,148,0,0.4);
}
input[type=button][target=ok]:hover{
	background-color:rgba(255,148,0,0.7);
}
input[type=button][target=ok]:active{
	background-color:rgba(255,148,0,1);
}

input[type=button][target=userlist]{
	color:#fff;
	background-color:rgba(90,100,175,0.4);
}
input[type=button][target=userlist]:hover{
	background-color:rgba(90,100,175,0.7);
}
input[type=button][target=userlist]:active{
	background-color:rgba(90,100,175,1);
}

input[type=button][target=CONlist]{
	color:#fff;
	background-color:rgba(34, 144, 36,0.4);
}
input[type=button][target=CONlist]:hover{
	background-color:rgba(34, 144, 36,0.7);
}
input[type=button][target=CONlist]:active{
	background-color:rgba(34, 144, 36,1);
}

input[type=date]::-webkit-inner-spin-button{
	height:100%;
}

textarea{
	border-radius:3px;
}
/*
.option_loading{
	background-image:url(./Link_Manager.php?Link=Image/gif/loading_1&Type=gif);
	background-repeat:no-repeat;
	background-position:center -50%;
}
*/

.background{
	background-image: linear-gradient( #CD853F, #CD69C9);
	background-repeat:no-repeat;
	background-position:center;
	background-size:100%;
}




.WindowPanel{
	position:fixed;
	background-color:rgb(230, 230, 230);
	box-shadow: 0px 0px 2px #333;
	border-radius: 5px;
	overflow:hidden;
}
.WindowPanel:hover{
	transition:0.2s;
	box-shadow: 0px 0px 5px #333;
}
	.WindowPanel #TopBar{
		height:30px;
		color:#fff;
		text-align:center;
		background-color:rgb(90,130,160);
	}
		.WindowPanel #TopBar #Begin{
			width:90px;
			height:30px;
			float:left;
		}
		.WindowPanel #TopBar #Name{
			width:calc(100% - 180px);
			height:30px;
			line-height:30px;
			float:left;
			cursor:default;
		}
		.WindowPanel #TopBar #ButtonArea{
			width:90px;
			height:30px;
			float:right;
		}
			.WindowPanel #TopBar #Upload{
				margin:2px;
				width:26px;
				height:26px;
				color:#fff;
				font-size:70%;
				background-color:rgba(20, 200, 15, 0.8);
				border-radius:50%;
				border-width:0px;
			}
			.WindowPanel #TopBar #CSV_Load{
				margin:2px;
				width:26px;
				height:26px;
				color:#fff;
				font-size:70%;
				background-color:rgba(0, 255, 25, 0.8);
				border-radius:50%;
				border-width:0px;
			}
			.WindowPanel #TopBar #Close{
				margin:2px;
				width:26px;
				height:26px;
				background-color:rgba(255, 80, 80, 1);
				background-image: url(./Link_Manager.php?Link=Image/SVG_ICON/Cross&Type=svg);
				background-repeat: no-repeat;
				background-position: center;
				background-size: 40%;
				border-radius:50%;
				border-width:0px;
				float:right;
			}
	.WindowPanel #BodyBar{
		height : calc(100% - 30px);
		box-sizing : border-box;
		overflow:hidden;
		overflow-y:auto;
	}
	



