/* ------------------------------
Adjustment
------------------------------ */
.mg0 {margin: 0 !important;}
.mt0 {margin-top: 0 !important;}
.mb0 {margin-bottom: 0 !important;}
.ml0 {margin-left: 0 !important;}
.mr0 {margin-right: 0 !important;}

.mt5 {margin-top: 5px !important;}
.mb5 {margin-bottom: 5px !important;}
.ml5 {margin-left: 5px !important;}
.mr5 {margin-right: 5px !important;}

.mt10 {margin-top: 10px !important;}
.mb10 {margin-bottom: 10px !important;}
.ml10 {margin-left: 10px !important;}
.mr10 {margin-right: 10px !important;}

.mt15 {margin-top: 15px !important;}
.mb15 {margin-bottom: 15px !important;}
.ml15 {margin-left: 15px !important;}
.mr15 {margin-right: 15px !important;}

.mt20 {margin-top: 20px !important;}
.mb20 {margin-bottom: 20px !important;}
.ml20 {margin-left: 20px !important;}
.mr20 {margin-right: 20px !important;}

.mt30 {margin-top: 30px !important;}
.mb30 {margin-bottom: 30px !important;}
.ml30 {margin-left: 30px !important;}
.mr30 {margin-right: 30px !important;}

.pd0 {padding: 0 !important;}
.pt0 {padding-top: 0 !important;}
.pb0 {padding-bottom: 0 !important;}
.pl0 {padding-left: 0 !important;}
.pr0 {padding-right: 0 !important;}

.pt5 {padding-top: 5px !important;}
.pb5 {padding-bottom: 5px !important;}
.pl5 {padding-left: 5px !important;}
.pr5 {padding-right: 5px !important;}

.pt10 {padding-top: 10px !important;}
.pb10 {padding-bottom: 10px !important;}
.pl10 {padding-left: 10px !important;}
.pr10 {padding-right: 10px !important;}

.pt15 {padding-top: 15px !important;}
.pb15 {padding-bottom: 15px !important;}
.pl15 {padding-left: 15px !important;}
.pr15 {padding-right: 15px !important;}

.pt20 {padding-top: 20px !important;}
.pb20 {padding-bottom: 20px !important;}
.pl20 {padding-left: 20px !important;}
.pr20 {padding-right: 20px !important;}
.none {
  margin: 0px !important;
  padding: 0px !important;
  border-top-style: none !important;
  border-right-style: none !important;
  border-bottom-style: none !important;
  border-left-style: none !important;
  background-image: none !important;
}

.text-link {
  color: #337ab7;
  text-decoration: underline;
}

/*Use when text protrudes*/
.break-word {
  word-wrap: break-word;
}
.white-space-nomal{
  white-space: normal;
}


/* ------------------------------
Base Custom Style
------------------------------ */
.content{
  height: inherit;
}
.info-maintenance {
  border-top:dotted 2px #ccc;
  border-bottom:dotted 2px #ccc;
  text-align: center;
  padding: 30px 0;
  margin-bottom: 20px;
}
.navbar-status-text {
  font-size: 120%;
  padding: 15px 15px;
}
.btn-block {
  margin-bottom: 10px;
}
td .btn-block{
  margin-bottom: 5px;
}
.btn-block:last-child {
  margin-bottom: 0;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td,
.table > tbody > tr > td label {
  vertical-align: middle;
}
body.modal-open {
  height: inherit;
}
table a{
  color: #337ab7;
  text-decoration: underline;
}
a.panel-heading {
  display: block;
}
.table-cell{
  display: table-cell;
  vertical-align: middle;
}
.fit-content {
  width: -moz-fit-content;
  width: -webkit-fit-content;
}

/*tab custom style*/
.nav-tabs-custom{
  border-bottom: 1px solid #eaeaea;
}
.nav-tabs-custom li a{
  background-color: #dadada;
  border-left: 1px solid #eaeaea;
  border-right: 1px solid #eaeaea;
  border-top: 1px solid #eaeaea;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.nav-tabs-custom li.active a{
  background-color: #fff;
}
.nav-tabs-custom > li.active > a,
.nav-tabs-custom > li.active > a:hover,
.nav-tabs-custom > li.active > a:focus {
  border: 1px solid #eaeaea;
  border-bottom-color: transparent;
}
.nav-tabs-custom > li {
  margin-bottom: -1px;
}
.nav-tabs-custom + .tab-content .panel-body{
  border-color: #eaeaea;
}


/*border color*/
.border-left-important {
  border-left: solid 5px #d9534f !important;
}
.border-left-unread{
  border-left: solid 5px #62cb31 !important;
}
.border-left-default {
  border-left: solid 5px #ddd !important;
}
@media screen and (max-width: 1200px) {
  .info .border-left-important + div {
    border-left: solid 5px #d9534f !important;
  }
  .info .border-left-unread + div {
    border-left: solid 5px #62cb31 !important;
  }
  .info .border-left-default + div {
    border-left: solid 5px #ddd !important;
  }
}

/*Datepicker Style*/
input[type="date"]::-webkit-inner-spin-button{
  -webkit-appearance: none;
}
input[type="date"]::-webkit-clear-button{
  -webkit-appearance: none;
}

/*login,register,error,etc common custom style*/
.custom-login {
  /*Nomal*/
  /*background-image: url(../../custom/images/bg_login.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;*/

  /*Dot Screen _b=black, _w=white*/
  /*background-image: url(../../custom/images/bg_dot_b.gif),url(../../custom/images/bg_login.jpg);*/
  background-size: auto,cover;
  background-repeat: repeat,no-repeat;
  background-position: center;
  background-attachment: fixed;

  /*Gradation Screen*/
  /*background-image: radial-gradient(rgba(0, 0, 0, 0.5), #000 80%), url(../../custom/images/bg_login.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;*/
}

/*Mypege Common Custom Style*/
.custom-mypage #wrapper {
  /*background-image: url(../../images/bg_mypage.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;*/
}
.mobile-menu-info,
.mobile-menu-chat,
.mobile-menu-logout {
  position: relative;
  height: 55px;
  display: inline-block;
  color: #9d9fa2;
  font-size: 25px;
  padding: 15px 20px;
  line-height: 20px;
}
a.mobile-menu-info:hover,
a.mobile-menu-chat:hover,
a.mobile-menu-logout:hover {
  background-color: #f7f8fa;
  color: #9d9fa2;
}
.mobile-menu-button {
  float:right;
}
.label-menu-corner .label{
  right: 12px;
  top: 12px;
}
textarea{
  resize:none;
  height:50px;
}
.chat-users, .chat-discussion{
  height:auto;
}
i.chat-read{
    position: absolute;
    right: 10px;
    top: 5px;
}
i.chat-Delete{
    position: absolute;
    left: 10px;
    top: 5px;
}
.input-group-label{
  font-size:14px;
  font-weight:bold;
  display: table-cell;
  vertical-align: middle;
  text-align:left;
  width: 1%;
  min-width:95px;
  white-space: nowrap;
  padding-right:10px;
}
span.input-group-label + input.form-control,
span.input-group-label + textarea.form-control,
span.input-group-label + select.form-control{
  border-radius: 4px!important;
}
.input-daterange span.input-group-label + input.form-control{
  border-radius: 4px!important;
  border-top-right-radius: 0px!important;
  border-bottom-right-radius: 0px!important;
}
.input-daterange input.form-control + span.input-group-addon{
  border-left:none;
  border-right:none;
}
.dataTables_length{
  text-align:left!important;
}
.table-responsive{
  padding:15px;
}
.table-inline tbody tr{
  float:left;
  margin-left:10px;
}
table.table-inline{
  margin-left: -10px;
}
.table-inline label{
  margin-left:3px;
  font-weight:normal;
}
.radiolist td{
  display: inline-block;
  position: relative;
  padding-right: 15px;
  padding-left: 20px;
  padding-bottom: 5px;
}
.radiolist.radio{
  padding-left: 0; 
}
/*Use in Table*/
.dataTables_scroll th .checkbox label::after,
.dataTables_scroll td .checkbox label::after{
  margin-left: -21px;
}
@media screen and (min-width: 768px){
  .dataTables_scroll th .checkbox,
  .dataTables_scroll td .checkbox,
  .dataTables_scroll th .radio,
  .dataTables_scroll td .radio{
    padding-left: 3px;
  }
}
th .checkbox, td .checkbox,
th .radio, td .radio{
  margin: 3px 0 0 3px;
}
th .checkbox label, td .checkbox label,
th .radio label, td .radio label{
  padding: 0;
}

/*Chat Style*/
.chat-discussion .chat-message.left .message {
  margin-right: 30%;
  margin-left: 0;
}
.chat-discussion .chat-message.right .message {
  margin-left: 30%;
  margin-right: 0;
}
.chat-date {
  width: 50%;
  padding: 5px;
  margin-top: 15px;
  margin-bottom: 15px;
  border: #6a6c6f solid 1px;
  text-align: center;
  border-radius: 15px;
}
.chat-discussion .chat-message.left .message:before {
  content: "";
	position: absolute;
	top: 25%;
  left: -20px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0px 25px 20px 0;
	border-color: transparent #eee transparent transparent;
	z-index: 0;
}
.chat-discussion .chat-message.right .message:before {
  content: "";
	position: absolute;
	top: 25%;
  right: -20px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0px 0 20px 25px;
	border-color: transparent transparent transparent #0074a9;
	z-index: 0;
}
.chat-message.right .chat-bg{
  background-color: #0074a9;
  color: #fff;
}
.chat-discussion .chat-message.right .message.delete:before {
	border-color: transparent transparent transparent #eee;
}
.chat-message.right .chat-bg.delete{
  text-align: center;
  background-color:#eee;
}
.chat-discussion .message {
    background-color: #eee;
}
.chat-users {
  margin-left:0;
  border-right:solid 1px #eaeaea;
}
.chat-discussion .chat-message.left .message.delete:before {
  border-color: transparent #eee transparent transparent;
}
.chat-discussion .chat-message.left .message.delete {
}
.chat-discussion .message.delete {
  background-color: #eee;
}

/*Logo Adjustment Style*/
.small-logo {
  padding-top: 6px;
}
#logo {
  padding: 5px 10px 5px 10px;
}

/*Task Style*/
#right-sidebar{
  width: 500px!important;
  background-color:#ddd;
}
.bg-task{
  background-color:#fff;
}
.label-primary{
  background-color:#34495e;
  font-weight:normal;
}
.border-emergency{
  border-top:solid 5px #d9534f!important;
}
.border-important{
  border-top:solid 5px #e67e22!important;
}
.border-default{
  border-top:solid 5px #62cb31!important;
}
.border-low {
  border-top: solid 5px #3498db !important;
}
.normalheader .dropdown-menu{
  top: 57%;
}
#right-sidebar .form-control{
  padding: 5px 5px;
  font-weight:normal;
}

/*InformaitionList Style*/
#notes .label{
  padding: 2px 8px 2px 8px;
  font-size: 11px;
  font-weight: normal;
}
#noteContaier .label{
  padding: 2px 8px 2px 8px;
  font-size: 11px;
  font-weight: normal;
}

/*MessageBox, ValidateMessage*/
.successDiv .hpanel .panel-body{
  margin-bottom:20px;
  border: solid 2px #62cb31;
  color:#62cb31;
  background-color:#ddffcc;
}
.ErrorDiv .hpanel .panel-body{
  margin-bottom:20px;
  border: solid 2px #e74c3c;
  color:#e74c3c;
  background-color:#ffcccc;
}
.infoDiv .hpanel .panel-body{
  margin-bottom: 20px;
  border: solid 2px #2962FF;
  color: #2962FF;
  background-color: #81D4FA;
}

/*
* form common style
*/
.form-control-lg,
.input-group-lg > .form-control,
.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
  padding: 15px;
  font-size: 1rem;
  height: calc(1.5em + 30px + 2px);
}
.form-control-xl,
.input-group-xl > .form-control,
.input-group-xl > .input-group-prepend > .input-group-text,
.input-group-xl > .input-group-append > .input-group-text,
.input-group-xl > .input-group-prepend > .btn,
.input-group-xl > .input-group-append > .btn {
  padding: 25px 15px;
  font-size: 1.25rem;
  height: calc(1.5em + 50px + 2px);
}

/*Media Query Style*/
@media screen and (max-width:1200px){
  .form-group .col-lg-6:first-child,
  .form-group .col-lg-2:first-child{
    margin-bottom:15px;
  }
}
@media screen and (max-width:992px){
  .form-group .col-md-6:first-child{
    margin-bottom:15px;
  }
  div.dataTables_wrapper div.dataTables_paginate,
  div.dataTables_wrapper div.dataTables_info {
    text-align: center;
  }
}
@media screen and (max-width:768px){
  #right-sidebar{
    width: 100%!important;
  }
  .form-group .col-sm-6:first-child{
    margin-bottom:15px;
  }
  /*Media Query - Chat*/
  .chat-discussion .chat-message.left .message {
    margin-right:10%;
  }
  .chat-discussion .chat-message.right .message {
    margin-left:10%;
  }
}
@media screen and (max-width: 380px) {
  /*iPhone5,SE Style*/
  .navbar-toggle {
    margin-right: 0;
  }
  .mobile-menu-button {
    right: 35px;
  }
  .mobile-menu-info,
  .mobile-menu-chat,
  .mobile-menu-logout {
    padding: 18px 10px;
    font-size: 22px;
  }
  .label-menu-corner .label {
    right: 0px !important;
  }
  .small-logo{
    font-size:12px;
  }
  .header-link{
    padding: 18px 20px 17px 20px;
  }
  .fixed-small-header.page-small .content {
    padding-top: 20px;
  }
  .fixed-small-header.page-small.show-sidebar .small-header {
    margin-left: 0px;
  }
  .fixed-small-header .small-header {
    position: static;
  }

}
@media screen and (min-width: 769px) {
  .mobile-menu {
    display: none;
  }
}