@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900&subset=japanese');
/*----------------------------------------------------
 default
----------------------------------------------------*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}body{line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main{display:block;}nav ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}ins{background-color:#ff9;color:#000;text-decoration:none;}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}del{text-decoration:line-through;}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help;}table{border-collapse:collapse;border-spacing:0;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}input,select{vertical-align:middle;}
a { -webkit-tap-highlight-color: rgba(200,200,555,0.6); }
a:link { text-decoration: none; color: #222; }
a:visited { text-decoration: none; color: #222; }
img { vertical-align: top; }
li { list-style-type:none; }
h1, h2, h3 { font-weight: normal; }
/*----------------------------------------------------
 clearfix
----------------------------------------------------*/
.clr:after { content: ''; display: block; clear: both; }

/*----------------------------------------------------
 Body
----------------------------------------------------*/
html { min-height: 100%; position: relative;}
body {
	background-color:#FFF;
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
	text-align: left;
	width: 100%;
	height: 100%;
	-webkit-text-size-adjust: 100%;
}
/*----------------------------------------------------
 common
----------------------------------------------------*/
.container{padding: 0;}
.row{margin: 0;}
input, select{
	display: inline-block;
	height: 24px;
	padding: 0 2px;
	border: 1px solid #B9C5CB;
	border-radius: 3px;
	font-size: 13px;
	vertical-align: top;
}
textarea{
	display: inline-block;
	padding: 4px;
	border: 1px solid #B9C5CB;
	border-radius: 3px;
	font-size: 13px;
}
/*----------------------------------------------------
 header
----------------------------------------------------*/
header{
	position: relative;
	width: 100%;
	height: 40px;
	background-color: #5DA9E0;
	box-shadow: 0px 1px 0 rgba(0, 0, 0, 0.1);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
}
header .logo{
	margin: 6px 8px;
}
header .logo img{
	height: 28px;
}
header button.menuBtn{
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	padding: 6px 8px;
	font-size: 24px;
}
/*----------------------------------------------------
 sidebar
----------------------------------------------------*/
.sidebar{
	display: block;
	background: #EDF0F1;
	border-right: 1px solid #90a4ad;
	width: 160px;
	height: 100%;
	position: fixed;
	top: 40px;
	left: 0;
	z-index: 2;
}
.sidebar .sidebar-menu li {
	border-bottom: 1px solid #FFF;
	list-style: none;
	margin: 0 0px;
}
.sidebar .sidebar-menu li a{
	width: 100%;
	min-height: 40px;
	padding: 0 8px;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	vertical-align: middle;
	word-break: break-all;
	display: inline-block;
	display: -webkit-flex;
	display: flex;
	flex-direction: row;
	-webkit-align-items: center;
	align-items: center;
	flex: 1 0 auto;
}
.sidebar .sidebar-menu li a:hover,
.sidebar .sidebar-menu li a.select{
	background: #dad8dc;
}
/*----------------------------------------------------
 contents
----------------------------------------------------*/
section.contents{
	padding: 40px 0 0 160px;
}
/*----------------------------------------------------
 .btn
----------------------------------------------------*/
.btn, a.btn{
	padding: 4px;
	font-size: 14px;
	line-height: 1;
	color: #fff;
	cursor: pointer;
	border-radius: 3px;
}
.btn:hover, a.btn:hover{
	color: #fff;
}
/*---------- btn color ----------*/
.btn-blue {
	background-color: #0058A2;
	border-color: #0058A2;
}
.btn-blue:hover {
	background-color: #004E8C;
	border-color: #004E8C;
}

.btn-skyBlue {
	background-color: #2E7FC4;
	border-color: #2E7FC4;
}
.btn-skyBlue:hover {
	background-color: #2976B4;
	border-color: #2976B4;
}

.btn-yellow {
	background-color: #F6AF38;
	border-color: #F6AF38;
}
.btn-yellow:hover {
	background-color: #F49E0F;
	border-color: #F49E0F;
}

.btn-green {
	background-color: #19AE5B;
	border-color: #19AE5B;
}
.btn-green:hover {
	background-color: #169C53;
	border-color: #169C53;
}

.btn-lime {
	background-color: #BED004;
	border-color: #BED004;
}
.btn-lime:hover {
	background-color: #AABC03;
	border-color: #AABC03;
}

.btn-red {
	background-color: #EE4351;
	border-color: #EE4351;
}
.btn-red:hover {
	background-color: #EC2D3C;
	border-color: #EC2D3C;
}

.btn-gray {
	background-color: #A7A7A7;
	border-color: #A7A7A7;
}
.btn-gray:hover {
	background-color: #919191;
	border-color: #919191;
}

/*----------------------------------------------------
 datetimepicker
----------------------------------------------------*/
.pickerWrap{
	display: inline-block;
}
.pickerWrap .input-group input.form-control{
	max-width: 96px;
	height: 24px;
	padding: 0 2px;
	border: 1px solid #B9C5CB;
	border-radius: 3px 0 0 3px;
	font-size: 13px;
	color: #222;
}
.pickerWrap .input-group.timepicker input.form-control{
	max-width: 64px;
}
.pickerWrap .input-group.dateandtimepicker input.form-control{
	max-width: 110px;
}
.pickerWrap .input-group-text{
	width: 25px;
	padding: 4px 0;
	border: 1px solid #B9C5CB;
	border-radius: 0 3px 3px 0;
	font-size: 14px;
}
.pickerWrap .input-group-text i{
	margin: 0 auto;
}
.timepicker a.btn{
	color: #222;
}
.datepicker .table th,
.datepicker .table td{
	border-top: 0;
}
.datepicker .table thead th{
	border-bottom: 0;
}

/*----------------------------------------------------
 モック
----------------------------------------------------*/
a#mock{
	position: fixed;
	bottom: 0;
	right: 0;
	display: block;
	background-color: red;
	padding: 8px 16px;
	color: #FFF;
}