/* here you can put your own css to customize and override the theme */

/***
Rounded Portlets
***/
/*
.portlet {
	border-radius: 4px !important;
}

.portlet .portlet-title {
	border-radius: 4px 4px 0px 0px !important;
}

.portlet .portlet-body,
.portlet .portlet-body .form-actions  {
	border-radius: 0px 0px 4px 4px !important;
}
*/

/*
Change Quick Sidebar Width
*/

/*
.page-quick-sidebar-wrapper {
  right: -370px;
  width: 370px;
}

.page-quick-sidebar-open.page-quick-sidebar-push-content .page-sidebar-wrapper {
  margin-left: -370px;
}

.page-quick-sidebar-open.page-quick-sidebar-push-content .page-footer {
  margin-right: 370px;
  margin-left: -370px;
}

.page-sidebar-reversed.page-quick-sidebar-open.page-quick-sidebar-push-content .page-sidebar-wrapper {
  margin-right: 370px;
}

.page-quick-sidebar-open.page-quick-sidebar-push-content.page-quick-sidebar-full-height .page-header {
  margin-left: -370px;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-list {
  width: 370px !important;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-item {
  width: 370px !important;
  margin-left: 370px;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-content-item-shown .page-quick-sidebar-list {
  margin-left: -370px;
}
*/

/*上部のヘッダー*/
.pageHeader {
  background-color: #002896 !important;
}

/*サイドバー*/
.page-sidebar-menu {
  background-color: #002896;
}

/*選択時の大項目*/
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  > li.active
  > a:hover,
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  > li.active.open
  > a:hover,
.page-sidebar .page-sidebar-menu > li.active > a:hover,
.page-sidebar .page-sidebar-menu > li.active.open > a:hover,
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  > li.active
  > a,
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  > li.active.open
  > a,
.page-sidebar .page-sidebar-menu > li.active > a,
.page-sidebar .page-sidebar-menu > li.active.open > a {
  background: #ff8d00;
}

/*選択時の小項目*/
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  .sub-menu
  > li:hover
  > a,
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  .sub-menu
  > li.open
  > a,
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  .sub-menu
  > li.active
  > a,
.page-sidebar .page-sidebar-menu .sub-menu > li:hover > a,
.page-sidebar .page-sidebar-menu .sub-menu > li.open > a,
.page-sidebar .page-sidebar-menu .sub-menu > li.active > a {
  /* background-color: #002896 !important; */
  background-color: #3376b7 !important;
}

.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  > li:hover
  > a,
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .page-sidebar-menu
  > li.open
  > a,
.page-sidebar .page-sidebar-menu > li:hover > a,
.page-sidebar .page-sidebar-menu > li.open > a {
  background: #3376b7;
}

/*右側の各履歴のdiv*/
.portlet.box.blue-madison > .portlet-title {
  background-color: #002896;
}

/*保存ボタン*/
.green.btn {
  background-color: #002896;
}

/*対応可ボタン*/
.btn.yellow-crusta {
  background-color: #ff8d00;
  color: #ffffff;
}

/*フッター*/
.page-footer.ng-scope {
  background-color: #002896;
}

.page-header.navbar .search-form {
  background: #002896 !important;
}

/*ログイン画面の文字の色を変更*/
.login .content .help-block {
    color: #385aaa;
}

span.ng-scope {
    color: #385aaa;
}

/*ユーザー画面右上のロゴを調整*/
.page-header.navbar .page-logo {
    float: left;
    display: block;
    width: 235px;
    height: 46px;
    padding-left: 0px;
    padding-right: 0px;
}

/* custom start */
.page-sidebar.navbar-collapse.collapse span {
    color: white;
}
/* custom end */

.page-header.navbar .page-logo .logo-default {
  margin: 4px 4px 4px 4px;
  width: 90%;
  height: 38px;
  margin-top: 4px;
}

.page-header.navbar .menu-toggler.sidebar-toggler {
    float: right;
    margin: 14px 0 0 5px;
}

/*ユーザー画面左上の検索ボックスを見やすく*/
.page-sidebar-closed.page-sidebar-fixed
  .page-sidebar:hover
  .sidebar-search
  .input-group
  .form-control,
.page-sidebar .sidebar-search .input-group .form-control {
  background-color: #ffffff;
  color: #000000;
}

/*マウスオーバーしたときの色を変更*/
.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle:hover {
  background-color: #3376b7;
}

.green.btn:hover,
.green.btn:focus,
.green.btn:active,
.green.btn.active {
  background-color: #3376b7;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle {
  background-color: #3376b7;
}

/*サイドバーの色を変更 */
.page-quick-sidebar-wrapper,
.page-quick-sidebar-wrapper .page-quick-sidebar .nav-justified > li.active > a {
  border: 0;
  background: #002896;
}

.page-quick-sidebar-wrapper .page-quick-sidebar .list-items > li:hover {
  background: #3376b7;
}

/*CRMの左と右を50%ずつにする。*/
.col-md-8 {
  width: 50%;
}

.col-md-4 {
  width: 50%;
}

/*画面上部のボタンの色を調整*/
.customize-top-menu .navbar-nav > li > a {
  background: #022891;
}

.page-header.navbar .hor-menu .navbar-nav > li.open > a, .page-header.navbar .hor-menu .navbar-nav > li > a:hover {
  color: #d2d2d2;
  background: #3376b7 !important;
}

.announcementModal .caption {
    width: 100%;
}

.announcementModal .to {
    display: flex;
}

.announcementModal .to .to-info {
    padding-left: 10px;
    max-height: 120px;
    min-height: 20px;
    flex: 1;
    margin-right: 20px;
    overflow-y: auto;
}

.page-container .agentDeskTabBox {
  margin: -25px -20px 0px -20px;
  background-color: #f7f7f7;
}

.page-container .agentDeskTabBox.zoom-in {
  margin: 25px -20px 0 -20px;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-tasks .dropdown-menu.tasks {
    margin-top: 5px !important;
    min-width: 270px;
    max-width: 400px;
    width: auto;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-tasks .dropdown-menu.tasks:before {
    right: 16px !important;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-tasks .dropdown-menu.tasks:after {
    right: 17px !important;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-tasks .dropdown-menu.tasks .icon-close {
    /* left: -9px; */
    position: absolute;
    top: -10px;
    right: -12px;
    font-size: 18px;
    color: gray;
    font-weight: 100;
    background-color: #fff;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    text-align: center;
    line-height: 20px;
    letter-spacing: 0px;
    cursor: pointer;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-notify .dropdown-menu.notify {
    margin-top: 0 !important;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-notify .dropdown-menu.notify:before {
    right: 17px !important;
}
.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-notify .dropdown-menu.notify:after {
    right: 17px !important;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-tasks .dropdown-toggle {
    padding: 17px 10px 14px 10px;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown.dropdown-notify .dropdown-toggle {
    padding: 17px 10px 14px 10px;
}

.btn-cancel-customize,.btn-cancel-customize:focus {
    color: #333333;
    background-color: white;
    border-color: #cccccc;
}

.marquee-container {
  width: 75px;
  height: 20px;
  overflow: hidden;
  position: relative;
}

.marquee-text {
  position: absolute;
  white-space: nowrap;
}

@keyframes marquee {
  from {
    transform: translateX(0);
    margin-left: 0;
  }

  to {
    transform: translateX(-100%);
    margin-left: 100%;
    margin-right: 0;
  }
}

.portlet-body .table-container .searchFilterItems {
    display: flex;
    padding-bottom: 5px;
}

.portlet-body .table-container .searchFilterItems .tagsinput{
    display: flex;
    flex: 1;
    flex-flow: wrap;
}

.portlet-body .table-container .searchFilterItems .tagsinput > span{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

.portlet-body .table-container .searchFilterItems .clear {
    background-color: #d84a38;
    margin-right: 5px;
    animation:none;
    -webkit-animation:none;
    cursor: pointer;
}