/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/

/* 基本色の変数化 */
:root{
	--BackGroundColor: #ffffff;
	--BGColor: #87ceeb;
	--HoverColor: #add8e6;
	--SelectColor: #6699cc;
	--BorderColor: #cccccc;
	--FontColor: #000000;
	--NoteColor: #fdaeae;
	--FontSize: 75%;
	--BacePadding: 0.2em;
}


html{color: var(--FontColor);background: var(--BackGroundColor);font-size:var(--FontSize);}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;line-height:1.5em;word-break: break-all;letter-spacing:1.2px}
table{border-collapse:collapse;border-spacing:0;display:inline-block;vertical-align:top;background-color: var(--BackGroundColor);color: var(--FontColor);}
fieldset,img{border:0}img{vertical-align: bottom;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:var(--FontSize);font-weight:normal}
q:before,q:after{content:''}
abbr,acronym{border:0;font-variant:normal}
sup{vertical-align:text-top}
sub{vertical-align:text-bottom}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;font-size:100%;line-height:1.2em;padding:var(--BacePadding)}
legend{color: var(--FontColor)}
*, *:before, *:after {
-webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 -o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
input , select{
	padding: var(--BacePadding);
	width: auto;
	max-width:10em;
	min-width:5em;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
select{
	max-width:30em;
}
input[type=checkbox]{
	min-width:3em;
}
input[type=color]{
	padding:0;
}
input[type=date]{
	ime-mode: disabled;
	
}
input[type=button] , input[type=submit]{
	padding: var(--BacePadding);
	max-width:18em;
}
input[type=button][disabled] , input[type=submit][disabled]{
	opacity: 0.2;
	cursor:not-allowed;
}
input[name=Address]{
	max-width:7em;
}
input[type=Tel]{
	max-width:12em;
}
input[name=Banti] {
	max-width:20em;
}

input[type=email] , input[type=url] , input[type=file]{
	max-width:20em;
}
::placeholder {
	color:rgb(248, 169, 169);
}
::-webkit-input-placeholder {
	color:rgb(248, 169, 169);
}
:-ms-input-placeholder {
	color:rgb(248, 169, 169);
}

hr{
	margin: 0.2em;
}
div{
	padding: var(--BacePadding);
}
body{
	text-align:center;
	padding-top: 2em;
	padding-bottom: 2em;
}
input:read-only {
	background-color: var(--BackGroundColor);
	color: var(--FontColor);
	border: 1px solid #c9c9c9;
}
input:required , select:required {
	border: 1px solid red;
}

thead , thead th , tfoot , tfoot td{
	background-color: var(--BGColor);
	color: var(--FontColor);
}
th{
	text-align:center;
}
li{
	height: 2.9em;
}
li:first-child{
	height: 2.0em;
}
div#TabList li:first-child , div#Tabs li:first-child{
	/* タブの部分は除く */
	height: 2.9em;
}
td , th{
	padding: var(--BacePadding);
	border: 1px solid var(--BorderColor);
	white-space: nowrap;
}
div.AdmBox{
	padding: var(--BacePadding);
	border: 1px solid #fcc;
	width: auto;
	min-width: 5em;
	max-width: 100vw;
	overflow:auto;
}
form{
	display: inline-block;
}

/* メッセージ系 */
div#ErrorBox , div#MessageBox {
	position: fixed;
	padding: 0;
	border:1px solid #999;
	background-color: #fff;
	width:auto;
	min-width:20px;
	max-width:90vw;
	height:auto;
	min-height: 5em;
	max-height:75vh;
	text-align:left;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	display:none;
	filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
	top:calc(50% - 50px / 2);
    left:calc(50% - 50px / 2);
	z-index:1000;
	overflow: hidden;
	/* ぼやけ対策 */
}
div#ErrorBox{
	border:2px solid #f00;
	color: #000;
	z-index:1100;
}
div.ErrorTitle{
	border-bottom:1px solid #999;
	background-color:#fdb0b0;
	color: #000;
	overflow:hidden;
}
div.MessageTitle{
	border-bottom:1px solid #999;
	background-color:#f5f5f5;
	color: #000;
	overflow:hidden;
}
img.CloseBtn{
	float:right;
	margin-left:2em;
	background-color: #fff;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
}
div#Error , div#Message {
	background-color: #fff;
	color: #000;
	overflow:auto;
	height: auto;
	max-height: 60vh;
	border-radius: 0 0 5px 5px/ 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px/ 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px/ 0 0 5px 5px;
}
div#BackBord{
	position: fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#ececec;
	opacity:0.7;
	z-index:100;
	display:none;
}
div#MiniOrderBreakdownList{
	min-width: 100px;
	max-width: 48vw;
	width: auto;
	overflow: auto;
	vertical-align: top;
	padding: 0;
}



/* メニューナビ */
header{
	position: fixed;
	top: 0;
	width: 100%;
	background-color: var(--BackGroundColor);
	color: var(--FontColor);
	z-index: 10000;
}
nav ul{
	display: table;
	margin: 0 auto;
	padding: 0;
	width: 90%;
	text-align: center;
}
nav ul li{
	display: table-cell;
	min-width: 4em;
	height: 1em;
}
nav ul li a{
	display: block;
	width: 100%;
	height: 100%;
	padding: var(--BacePadding) 0;
	text-decoration: none;
	font-weight: bold;
}
nav ul li.current{
	background-color: var(--BGColor);
}
nav ul li.current a{
	color: var(--FontColor);
}
nav ul li:hover{
	background-color: var(--HoverColor);
}

/* トップページのメニュー用 */
div#MenuList ul{
	padding: 0;
	overflow: hidden;
}
div#MenuList ul li{
	cursor: pointer;
	padding: 0;
	height: auto;
}

div#MenuList ul li a{
	display: block;
	width: 100%;
	height: 100%;
	padding: var(--BacePadding);
	text-align: left;
}
div#MenuList li:hover{
	background-color: var(--HoverColor);
}

div#MenuList li:first-child{
	display: block;
	cursor: auto;
	text-align: center;
	padding: var(--BacePadding);
	background-color: var(--BGColor);
}
div#MenuList li:first-child:hover{
	background-color: var(--BGColor);
}

/* フッター */
footer{
	color:#fff;
	background-color:#000;
	text-align:center;
	margin-top:1em;
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index: 100;
}

/* 共通クラス */
._Box{
	border-radius: 0.5em;
	border:1px solid #999;
	margin: var(--BacePadding) var(--BacePadding) 0 0;
	padding: var(--BacePadding);
	vertical-align: top;
	display:inline-block;

}
a{
	color: var(--FontColor);
	text-decoration: none; 
}
a:hover{
	color: var(--FontColor);
}
td{
	color: var(--FontColor) !important;
}
._ErrorBox{
	border-radius: 0.5em;
	border:1px solid #f00;
	margin: var(--BacePadding) var(--BacePadding) 0 0;
	padding: var(--BacePadding);
	vertical-align: top;
	display:inline-block;
}

._TableBox{
	display:inline-block;
	vertical-align: top;
}
._Table{
	display:table;
	text-align:center;
	width:100%;
}
._Row{
	display:table-row;
}
._Col{
	display:table-cell;
}
._ColCenter{
	display:table-cell;
	width:100%;
	display:inline-block;
	text-align:center;
}
._Left{
	text-align:left;
}
._Center{
	text-align:center;
}
._Right{
	text-align:right;
}
._Border{
	border:1px solid #999;
}

/* 一覧系の設定 */
div.List , div.ListHover{
	display:table;
	text-align:left;
	min-width:100px;
	max-width:100%;
	width:auto;
	margin: 0 auto;
}
div.List ul , div.ListHover ul{
	display:table-row;
}
div.ListHover ul:hover{
	background-color: var(--HoverColor);
	color: var(--FontColor);
}
div.List li , div.ListHover li{
	display:table-cell;
	border:1px solid #999;
	padding: var(--BacePadding);
}
div.ListHover li{
	cursor:pointer;
}
table.ListHover{
	margin: 0 auto;
	/* overflow:auto; */
}
table.ListHover tbody tr:hover{
	background-color: var(--HoverColor);
	color: var(--FontColor);
	cursor:pointer;
}

.selected {
	background-color: var(--SelectColor);
	color: var(--FontColor);
	border:1px solid var(--BorderColor);
	border-radius: 1em;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
}
.selected:hover{
	background-color: var(--SelectColor);
	color: var(--FontColor);
}




div.EstimateList{
	overflow:auto;
	min-height:80px;
	height: 100%;
	display: flex;
  justify-content: center;
}
div.EstimateList .ScrollBox{
	max-height:unset;
}
table#BreakdownList{
	white-space: nowrap;
}
.Price{
	text-align:right !important;
	min-width:5em;
	max-width:8em;
	width:auto;
}

div.ULList ul{
	display: inline-block;
	vertical-align:top;
	border:1px solid #999;
	padding: 1px;
}
div.ULList ul li{
	padding: var(--BacePadding);
}
div.ULList ul li:first-child , th , table.RowHeader tbody td:first-child{
	background-color: var(--BGColor);
	color: var(--FontColor);
	text-align: center;
}
table.List tbody td , td{
	text-align: left;
	cursor:pointer;
}


/* その他 */
.UserColor{	/* 得意先や従業員の色 */
	margin:0 var(--BacePadding) 0 0;
	display:inline-block;
	width:1em;
	height:1em;
	border-radius: 1em;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
}

div#Tabs , div#TabList{
	text-align: left;
	background: var(--BackGroundColor);
}
.DivList{
	vertical-align:top;
	display: inline-block;
}

.ScrollBox{
	overflow: auto;
	height: auto;
	min-height: 1em;
	max-height: 20em;
	/*width: auto;
	min-width: 5em;
	max-width: 90vw;
	border: 1px solid #f00;*/
}

table.TableScroll{
	border-collapse: separate;
	width: auto;
	max-width: 90vw;
}
.TableScroll thead th {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  /* tbody内のセルより手前に表示する */
  z-index: 1;
}
.TableScroll tfoot td {
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  /* tbody内のセルより手前に表示する */
  z-index: 1;
}
.TableScroll tfoot tr:nth-child(1) td {
  bottom: 0;
}

.Notouch{
	pointer-events: none;
	opacity:0.3;
}

.CrueList{
	display: block;
	cursor:pointer;
	width: auto;
	min-width: 5em;
	max-width: 100%;
	overflow:auto;
}
.selectBorder{
	border: 3px solid #ff0000;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	background-color:#fff;
	position: absolute;
	top: 50vh;
	left: 50vw;
	cursor: move;
	z-index: 10;
}

.ui-autocomplete{
	text-align: left;
}

div#BoxAgregateAttendance{
	width: 100%;
	border: solid 1px #600;
	overflow: auto;
	height: auto;
	min-height: 3em;
	max-height: calc(95vh - 6em);
	padding: 0px;
}

table#AgregateAttendance{
	border-spacing: 0;
	border-collapse: collapse;
	border: solid 1px #666;
	overflow: hidden;
	transform-origin: top left;/*拡大縮小時の起点ほ指定*/
}
table#AgregateAttendance td{
	position: relative;
	width: 7.2em;
}
table#AgregateAttendance tr:hover {
	background-color: var(--HoverColor);
	color: var(--FontColor);
}
table#AgregateAttendance td:hover{
	background-color: var(--SelectColor);
}
table#AgregateAttendance td div:hover{
	background-color: #b7fade;
}
/*
table#AgregateAttendance td:hover:after {
	content: "";
	background-color: var(--HoverColor);
	width: 100%;
	height: 200vh;
	position: absolute;
	top: -100vh;
	left: 0;
	z-index: 1;
	opacity: 0.3;
}
*/

img[src$="new.gif"]{
	vertical-align:middle;
	margin-right: 0.2em;
}
.ui-widget-shadow{/*tooltipの影*/
	-webkit-box-shadow:2px 2px 8px #aaa !important;
	box-shadow:2px 2px 8px #aaa !important;
}

.star{
	display: inline-block;
	color:yellow;
	background-color:#000;
	border-radius: 25%;
	height: auto;
	min-height: 10px;
}
.HalfDay{
	display: inline-block;
	color:rgb(255, 255, 236);
	background-color:rgb(70, 181, 255);
	border-radius: 25%;
}
.OverTime {
	display: inline-block;
	color: rgb(228, 23, 23);
	background-color: rgb(9, 236, 206);
	border-radius: 25%;
}
.AbsenceFromWork{
	display: inline-block;
	color: #fff;
	background-color:#f00;
	border-radius: 25%;
	width: 1em;
	height: 1em;
	margin: 0;
	text-align: center;
	font-weight: bold;
	line-height: 0.5;
}
.MiniMemo{
	font-size:80%;
	display: block;
}

.ui-tooltip{
	text-align: left;
}
.delete{
	float: left;
	color: var(--NoteColor);
}
.SimpleView{
	display: none;
}


div#confirmBox{
    border-radius: 1em;
    -webkit-border-radius: 1em;
    -moz-border-radius: 1em;
}
div#confirmBox h1{
    border-radius: 5px 5px 0 0/ 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0/ 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0/ 5px 5px 0 0;
}