body{
  color: #1d1d1d;
  background: #fffffc;
  font-size: 1.4rem;
  padding-top: 45px;
}

body > #wrap{
  height:auto;
}
.imgLqd100 img {
    width: 100px; 
	height: 100px; 
	background-size: cover!important; 
	background-position: 50% 50%; 
	background-repeat: no-repeat;
}

input[type="text"],
input[type="date"],
input[type="number"],
input[type="time"] {
  font-size: 14px;
  font-family: 'Segoe UI_', 'Open Sans', Verdana, Arial, Helvetica, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, 'メイリオ', sans-serif!important;
}

#wrap {
  position: relative;
  margin: 0px auto;
  height: 100%;
  min-height: 100%;
}

h1, h2, h3, h4, h5 {
  font-weight: normal!important;
}

hr {
	color: #eee;
}

.fg-info {
  color: #4390df !important;
}
.bg-info {
  background-color: #4390df !important;
}
.ol-info {
  outline-color: #4390df !important;
}
.bd-info {
  border-color: #4390df !important;
}

.fg-danger {
  color: #ee6557 !important;
}
.bg-danger {
  background-color: #ee6557 !important;
}
.ol-danger {
  outline-color: #ee6557 !important;
}
.bd-danger {
  border-color: #ee6557 !important;
}

.fg-warning {
  color: #ecb935 !important;
}
.bg-warning {
  background-color: #ecb935 !important;
}
.ol-warning {
  outline-color: #ecb935 !important;
}
.bd-warning {
  border-color: #ecb935 !important;
}

label.error {
  display:table;
  color: #EE6557;
  font-size: 12px;
  margin: 0 0 6pt auto;
}
label.form-info {
  display:table;
  color: #4390df;
  font-size: 12px;
  margin: 0 0 6pt auto;
}

img[class*="load"] {
  margin: 0 auto;
  display: block;
  opacity: 0.8;
}
.loading img.load64 {
  width: 64px;
  height: 64px;
}
.loading img.load32 {
  width: 32px;
  height: 32px;
}
.loading img.load128 {
  width: 128px;
  height: 128px;
}
.loading img.loadbar220 {
  width: 220px;
  height: 20px;
}

.loading.error,
.loading.notfound {
  display: table;
  margin: 0 auto;
}
.loading.error span,
.loading.notfound span {
  vertical-align:middle;
  font-size:1.8rem;
  padding-right:16px;
}

/* override cf2 colors */
.metro a,
.metro .link {
  color: #0E7AC4;
}

.metro a:hover,
.metro .link:hover {
  color: rgba(14, 122, 196, 0.8);
}

.metro a:focus,
.metro .link:focus,
.metro a:active,
.metro .link:active {
  color: rgba(14, 122, 196, 0.6);
}

.metro .listview .list {
  border: 3px #b3b3b3 solid;
}

/* footer select language */
select.select-lang{
  background-color: #1d1d1d;
  border: none;	
  color: #fffffc;
}
select.select-lang:hover,
select.select-lang:active {
  border: none;	
}

.metro .container {
  padding-bottom:60px;
}

.metro .navbar {
  background-color: #15992A;
}

.metro .navbar .navbar-content .element {
  color : #fffffc;
}
.metro .navbar .navbar-content .element.hero {
  font-size:22px;
}
.metro .navbar .navbar-content .element.hero.hb {
  padding-right: 4px;
  margin-right: 0;
}
.metro .navbar .navbar-content .element.drop-hb {
  padding-left: 2px;
}
.metro .navbar .navbar-content .element.drop-hb {
  padding-left: 2px;
  cursor: pointer;
}
.metro .navbar .navbar-content .element .dropdown-menu {
  color: #1d1d1d;
}

/* header dropdown (info) */
/* header dropdown (user-info) */
.metro .navbar .navbar-content .dropdown-menu {
  border: 2px solid #15992A;
  border-top: none;
}
.metro .navbar .navbar-content .element .dropdown-menu.user-info {
  min-width: 350px;
  right: 24px;
  border: 2px solid #15992A;
  border-top: none;
}

.metro .navbar .navbar-content .element:hover,
.metro .navigation-bar .element-menu > li:hover, .metro .navbar .element-menu > li:hover,
.metro .navigation-bar .element-menu > li:hover, .metro .navbar .element-menu > li.active {
  background-color: #18af30 ;
}

.metro .navbar .navbar-content .element.user-element {
  padding: 0 15px 0 0;
}
.metro .navbar .navbar-content .element.user-element {
  padding: 0 15px 0 0;
}
.metro .navbar .navbar-content .element.user-element button.element {
  top:-10px;
}

.metro .navbar .navbar-content .element.user-element a.dropdown-toggle {
  top:10px;
}

.metro .dropdown-menu li {
  background-color: #fffffc;
  color: #1d1d1d;
}
.metro .dropdown-menu .menu-user {
  line-height: 14px;
  padding: 6px 10px 12px;
  border: 0;
  border-bottom: 1px #dcddde solid;
  border-top: 1px #fffffc solid;
}
.metro .dropdown-menu .menu-user:first-child:hover {
  border-top-width: 0;
}

.metro .dropdown-menu .menu-user:hover {
  background-color: #fffffc;
  cursor: default;
  border: 0;
  border-bottom: 1px #dcddde solid;
  border-top: 1px #fffffc solid;
}

.metro .dropdown-menu .menu-user .profile-pic {
  width: 100px;
  height: 100px;
  background-color:#1d1d1d;
  margin-right:16px;
}
.metro .dropdown-menu .menu-user .com-name {
  font-size:12px;
}
.metro .dropdown-menu .menu-user .user-name {
  font-size:16px;
  line-height:16px;
}
.metro .dropdown-menu .menu-user .grup-name {
  font-size:12px;
  padding-top: 6pt;
}
.connect {
  color:#ECB935;
  font-size: 12px;
  padding-top: 6pt;
}

.metro .dropdown-menu li.menu-edit {
  margin:0;
}

.metro .dropdown-menu li.menu-edit a{
  padding-left: 16px!important;
  font-size:14px!important;
}

/*　no profile image　*/
i.no-profile {
  background-color: #1d1d1d;
}
i.no-profile.nav-u {
  width: 28px!important;
  height: 28px!important;
  margin: 9px 6px!important;
  /*padding: 4px!important;*/
}
i.no-profile.menu-u {
  font-size: 88px!important;
  margin:10px!important;
}
i.no-profile.edit-u {
  font-size: 88px!important;
  padding: 6px;
}

i.no-profile.list-u {
  font-size: 50px!important;
  padding: 3px;
}

section.profile-pic {
  border: 0;
  display:block;
  overflow:hidden;
  z-index:1;
}

div.image-button section.profile-pic {
  width: 40px;
  height: 40px;
}

div.page-data section.profile-pic {
  position:relative;
  width: 56px;
  height: 56px;
}
li.menu-user section.profile-pic,
div.readonly-user-box section.profile-pic,
div.edit-user-box section.profile-pic {
  position:relative;
  margin: 0 16px 0 0!important;
  width: 100px;
  height: 100px;
/*
  float: left;
  width: 100px;
  height: 100px;
  position:relative;
  overflow: hidden;
  display: block;
*/
}

button.image-button img.thumbnail {
  float:left;
  /*position:absolute;*/
  z-index:3;
}
section.profile-pic img.thumbnail {
  float:left;
  position:absolute;
  z-index:3;
/*
  display: block;
  height: 160px;
  position: absolute;
  left: -65px;
  top: -25px;
*/}

/* footer */
.metro footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 1.0rem;
  color: #fffffc;
  background: #1d1d1d;
  font-size: 1.2rem;
  left: 0; 
  z-index: 9999;
}

span.error {
  color: #EE6557;
  /*font-weight: bold;*/
  font-size: 12px!important;
}

/* sigin in forms */
#form-signin {
  margin:auto;
  padding: 24px 64px;
  background: #f5f5f5;
  margin-top: 60px;
  width:550px;
  border-bottom: solid 10px #1d1d1d;
}

#form-signin form{
  margin: 0;
}
#form-signin form div.input-control{
  margin-bottom: 0;
}

#form-signin i {
  background: #1d1d1d;
  font-size:18px;
  color: #fffffc;
  padding: 8px;
  border-radius: 50%;
}
#form-signin i.active {
  background: #4390df;
  transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
}

#form-signin  span.login-error,
.edit-view span.form-error {
  margin-top:0px;
}

/* tile style override */
.metro .tile-group {
  padding-top: 0!important;
  margin-right: 0!important;
}

.tile-area .tile-area-title {
  top: 60px!important;
}

.tile.bg-cftile {
  background-color:#0E7AC4;
}
.tile.bg-cftile.double {
  width: 220px;
  height: 125px;
  margin: 0 16px 16px 0;
}
.tile.bg-cftile.double:last-child {
  margin: 0;
}

/* when stamp tile*/
.metro .tile.stamp {
  width:200px;
  height:200px;		
}
.metro .tile.stamp .tile-content.icon img{
  width:112px;
  height:112px;
  margin-top: -56px;
  margin-left: -56px;
}

/* Sidebar navigation */
.nav-sidebar {
  margin-right: -21px; /* 20px padding + 1px border */
  margin-bottom: 20px;
  margin-left: -20px;
}
.nav-sidebar > li > a {
  padding-right: 20px;
  padding-left: 20px;
}
.metro .sidebar.cf2-light {
  overflow-x:auto;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: none;
}
.metro .sidebar.cf2-light .treeview {
  background-color: #f5f5f5;
  border: none;
}
.metro .sidebar.cf2-light>ul{
  margin-top: 18px;
}
.metro .sidebar.cf2-light>ul ul{
  border : none;
}

.metro .sidebar.cf2-light>ul>li {
  padding-top: 2px;
  border-bottom-color: #f5f5f5;
}

.metro .sidebar.cf2-light>ul>li li>a {
  padding: 8px 16px !important;
}
.metro .sidebar.cf2-light>ul>li li {
 margin-left: 12px; 
}

.metro .sidebar.cf2-light li.title {
  color: #1d1d1d;
}
.metro .sidebar.cf2-light li a {
  color: #1d1d1d;
  background-color: #f5f5f5;
  border: none;
  font-size: 125%;
}
.metro .sidebar.cf2-light li a:hover {
  background-color: #eeeeee;
  color: #1d1d1d;
}
.metro .sidebar.cf2-light li ul {
  background-color: #f5f5f5;
  border-bottom: 1px #f5f5f5 solid;
}
.metro .sidebar.cf2-light li .divider {
  background-color: #eeeeee;
}
.metro .sidebar.cf2-light li .divider:hover {
  background-color: #eeeeee;
}
.metro .sidebar.cf2-light li.disabled a {
  background-color: #f5f5f5;
  cursor: default;
  color: #d4d4d4;
}
.metro .sidebar.cf2-light li.active a {
  background-color: #d4d4d4;
  color: #1d1d1d;
}

.list-remark.connect {
  color:#ECB935;
  font-size:14px;
  margin-top: 6pt!important;
}

div.main {
	padding-bottom:60px;
}

.edit-view {
  right: 0px;   
  width: 35%;   
  height: initial;
  top:46px;   
  background-color: #f5f5f5;
  position: fixed!important;    
/*  bottom: 0; 
*/   bottom: 38px; 
  /* left: 0; */  
  z-index: 1000;  
  display: block;  
  padding: 20px 20px; 
  overflow-x: hidden;  
  overflow-y: auto;  
  background-color: #f5f5f5!important;  
  border-left: 1px solid #eee!important;
  transition-duration: 1s;
  -webkit-transition-duration: 1s;
  -o-transition-duration: 1s;
  -moz-transition-duration: 1s;
  height: initial!important;
  padding-bottom: 60px!important;
}

.edit-view .btns {
  margin-top : 15px;
}
.edit-view .btns button{
  margin : 6px 10px 0 0;
}
.edit-view .btns button:last-child{
  margin-right : 0;
}

.edit-view .view-title {
  letter-spacing: 0.01em;
  font-size: 1.8rem;
  line-height: 1.8rem;
}

.edit-view .close-button {
  cursor: pointer;
  color: #d4d4d4;
  padding: 6px;
  border: 1px solid #d4d4d4;
  border-radius: 16px;
  font-family: initial;
}

.edit-view .close-button:hover {
  color: #1d1d1d;
}
.edit-view .close-button:active {
  font-size: 13px;
}
.edit-view form label {
  font-size: 12px;
  line-height: 16px;
}

.edit-view label[class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}
.input-control[class*="col-"] {
  padding-right: 0;
}

.form-title{
  padding: 4pt;
  background-color: #eeeeee;
  margin-bottom:2pt;
  font-size: 12px;
}

.edit-view .input-section {
  background-color: #fffffc;
  padding: 7pt 7pt 0 7pt;
  margin-bottom:1pt;
}
/*.edit-view .input-section.last {
  border-bottom: solid 2px #1d1d1d;
}*/
.edit-view .submit-section {
  padding: 7pt 7pt 0 7pt;
}

.page-content {
  margin-top:16px;
}

.metro .input-control.span {
  display: inline-block;
  position: relative;
  height: 34px;
  width: 100%;
}
.metro .input-control.span span {
  vertical-align: middle;
}

.prof-image input[type=file],
.picture-edit input[type=file]{
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  bottom: 0;
  right: 0;
  z-index: 0;
}

.list-content span.u-count{
	padding:6pt 0!important;
}
.list-content span.list-remark{
	padding-top:6pt!important;
}
.input-control.checkbox span {
	margin-right:6px;
}

.list-remark.attr-allocate{
    color:#ECB935;
}

#headerBar {
  background-color: #1d1d1d;
  padding: 37px 37px 33px;
  transition: top 0.25s ease;
  -webkit-transition: top 0.25s ease;
  top: -206px;
  position: absolute;
  left: 0px;
  right: 0px;
  z-index: 9999999;
  height: auto;
}

#headerBar .tile-status span.name{
  font-size: 86%;
  margin: 5px 10px 2px 5px;
}

ul.addrow {
  position: relative!important; 
  z-index: 1;
  background-color: transparent!important;
  border: none!important;
  text-align: center!important;
}
ul.addrow li {
  background-color: transparent!important;
}
ul.addrow li i {
  font-size:2.0rem!important;
}

section.item-section .accordion-frame a.heading{
	background-color: #fffffc!important;
	
}
section.item-section .accordion-frame .input-control {
	background-color: transparent!important;
	
}

/* icon stamp tiles setting */
.page-data.object-tiles .tile {
	background-color: transparent;
	border: 4px #f5f5f5 solid;
}
.page-data.object-tiles .tile.selected {
	border-color: #4390df;
}
.page-data.object-tiles .brand {
	text-align: center;
}
.page-data.object-tiles .brand .label {
	margin: 6px 0 2px 0;
	color:#1d1d1d;
	font-size:12px;
}
/* condition-master */
.condition-box {
  background-color: #f5f5f5;
  padding: 16px;
}

table div.input-control,
table div.input-control label,
table div.input-control span,
.pagination.priority {
  margin: 0!important;
  padding: 0!important;
}
.pagination.priority li a{
  padding: 6pt 8pt!important;
}

/* treeview */
ul.treeview.project {
  /*font-size:16px!important;*/
  background-color:#fffffc;
}

ul.treeview.project .node-toggle {
  width: 16px;
  height: 30px;
}
/*ul.treeview.project li.node:hover,*/
ul.treeview.project li.node>a:hover {
  background-color: #e6f2fa;
}

ul.treeview.project li.node>a.active {
  background-color: #bcdcf2;
}
ul.treeview.project li.node {
  border-left: 6px solid #d4d4d4;  
}
ul.treeview.project li.node>a {
  background-color:#eee;
  padding-bottom: 6pt!important;
  padding-left: 0!important;
}

ul.treeview.project .node-toggle:before {
  top: 9px;
  left: 6px;
  border-left: 12px solid transparent!important;
  border-top: 12px solid transparent!important;
  border-bottom: 12px #1d1d1d solid!important;
}

ul.treeview.project div.input-control {
	margin: 7pt 6pt;
	margin-left:0;
}
ul.treeview.project div.input-control input, 
ul.treeview.project div.input-control select{
	border: none;
}
ul.treeview.project button[name=node-set-attr],
ul.treeview.project button[name=node-add-child] {
	padding-top: 12pt!important;
	padding-bottom: 12pt!important;
}


ul.treeview.project button[name=apply-name],
ul.treeview.project button[name=cancel-name] {
	padding-top: 6pt!important;
	padding-bottom: 5pt!important;
	margin: 6pt 0 0 6pt!important;
}
ul.treeview.project .node-info {
  margin-left: 33px;
  background-color:#fffffc;
  border: 1px #eee solid;
  padding: 6pt;
  margin-top: 9px;
}

li.node{
  margin-left:32px;
}
form.node-form {
	margin: 0;
}
div.node-name {
  margin-bottom:0!important;
  padding-bottom:0!important;
}
div.node-kana {
  margin-top:0!important;
  height: 26px!important;
}
div.node-kana input {
  font-size:80%;
  padding-top: 0!important;
  padding-bottom: 0!important;
  height: 26px!important;
}

#dropzone {
  border: 6px #eee dashed;
  padding: 32px 16px;
  vertical-align: middle;
  margin: 10px 0 auto;
  color: #d4d4d4;
  font-weight: bold;
  font-size: 18px;
  width: 100%;
  text-align:center;
}

.dropzone-error{
  margin-top:6pt;
  color: #EE6557;
  font-weight:bold;
}

/*  status */
.metro .tile.status {
  margin-right:24px;
  width:240px;
  height:240px;		
}
.metro .tile.status:hover {
	cursor:default;
}

.status-value {
    font-size: 46px;
    /*margin: 0 0 6pt auto;*/
}

div.listview-outlook a{
	background-color:#fffffc;
}

.status-value-unit {
    font-size: 16px;
    /*margin: 0 0 6pt auto;*/
}

div#prog-device, div#prog-user, div#prog-storage {
    height:26px;
}

div#book-info-box {
	padding-bottom:0!important;
}

section.button-box {
	background-color:#fffffc;
}
section.button-box button {
	margin:6px 0 !important;
	/*margin-left:6px!important*/;
}
button.fluid {
  width: 100%;
}
button.half {
  width: 49.5%;
}


/* galleriffic */

div.galleriffic div.content a, div.galleriffic div.navigation a {
	text-decoration: none;
}

div.galleriffic div#container {
	overflow: hidden;
}

div.galleriffic div.content {
	display: none;
	clear: both;
	padding-top: 20px;
}

div.galleriffic div.navigation {
  width: 100%;
  background-color: #fffffc;
}

div.content a:hover, div.content a:active {
  text-decoration: underline;
}
div.galleriffic div.navigation a.pageLink:hover {
  background-color:#f5f5f5;
}
div.galleriffic div.navigation a.pageLink:active {
  background-color:#1d1d1d;
}
div.galleriffic div.navigation a.pageLink {
	display: block;
	position: relative;
	float: left;
	background-position:center center;
	background-repeat:no-repeat;
	height: 77px;
	line-height: 77px;
	font-size:16px;
	padding:2px 4px;
}
div.navigation a.pageLink:focus {
	outline: none;
}

div.controls {
	margin-top: 5px;
	height: 23px;
}
div.controls a {
	padding: 5px;
}
div.ss-controls {
	float: left;
}
div.nav-controls {
	float: right;
}

div.slideshow-container,
div.loader,
div.slideshow a.advance-link {
	width: 100%; /* This should be set to be at least the width of the largest image in the slideshow with padding */
}

div.loader,
div.slideshow a.advance-link,
div.caption-container {
	/*height: 460px;*/
}

div.slideshow-container {
	position: relative;
	clear: both;
}

div.caption {
  padding: 2px;
  font-size:14px!important;
}

div.navigation-container {
	float: left;
	position: relative;
	left: 50%;
}
div.navigation {
	float: left;
	position: relative;
	left: -50%;
}

ul.thumbs {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
}
ul.thumbs li {
	float: left;
	padding: 0;
	margin: 2px;
	list-style: none;
}
a.thumb {
	padding: 1px;
	display: block;
}
a.thumb:focus {
	outline: none;
}
ul.thumbs img {
	border: none;
	display: block;
}

/*
div.pagination {
	clear: both;
	position: relative;
	left: -50%;
}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
	position: relative;
	display: block;
	float: left;
	margin-right: 2px;
	padding: 4px 7px 2px 7px;
	border: 1px solid #ccc;
}
div.pagination a:hover {
	text-decoration: none;
}
div.pagination span.current {
	font-weight: bold;
}

div.pagination span.ellipsis {
	border: none;
	padding: 5px 0 3px 2px;
}

div.gallery-gutter {
	clear: both;
	padding-bottom: 20px;
}*/

.metro .treeview .node-toggle:before {
  border-left: 8px solid transparent;
  border-top: 8px solid transparent;
  border-bottom: 8px #1d1d1d solid;
  top: -3px
}