@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700,900%7CRoboto:300,400,500,700%7CMaterial+Icons);

html {
  overflow: hidden!important;
}
body,html{
padding:0;margin:0;font-size: large;
font-family: 'Noto Sans JP', 'Roboto', sans-serif;
font-weight: 300;
}
.select2-results .select2-highlighted{
color:#446ad3 !important;
}

#main-navbar .navbar-inner .navbar-brand, #main-navbar .navbar-inner > .navbar-header {
  padding-left: 0 !important;
}

.customer-details {
  overflow-y: auto;
}
#content-wrapper {
    left: 0;
    padding: 46px 11px 0px;
    width: 100%;
    position: relative;
    height: 100vh;
}
#content-area {
      height: calc(100vh - 46px);
      margin-top: 46px;
      overflow-y: auto;
      overflow-x:hidden;
}
.add-button{
  position:fixed;right:30px;bottom:20px;
}
.add-button button{
  height: 50px;
  width:50px;
}
.add-button-panel {
  position: absolute;
      top: 20px;
      right: 25px;
}
.add-button-panel button{
  height: 40px;
  width: 40px;
}


#content-wrapper:after,#content-wrapper:before,#main-menu:after,#main-menu:before,#main-wrapper:after,#main-wrapper:before,body:after,body:before{
content:" ";display:table
}
#content-wrapper:after,#main-menu:after,#main-wrapper:after,body:after{
clear:both
}
#main-wrapper{
    width:100%;overflow:hidden!important
}

#main-menu-bg{
    display:block;height:100%;padding:0;position:fixed;top:0;z-index:499;
    background: linear-gradient(0deg,#5f9bdc 0%,#446ad3 100%)!important;
}
.star {
  white-space: nowrap;
}
.bgcolor-lightblue {
  background-color: #e8f4f8;
}
.theme-default #main-menu .mmc-dropdown-open>a {
    background: #5f9bdc!important;
}
.theme-default #main-menu .mm-dropdown>ul, .theme-default #main-menu .mmc-dropdown-open-ul {
    background: #fff;
}
.theme-default #main-menu .mmc-dropdown-open-ul .mmc-title {
  background: #fff!important;
      color: #838c96!important;
  }
  .theme-default #main-menu .mmc-dropdown-open-ul a:hover,.theme-default #main-menu .navigation a:hover{
  background: #f3f3f3!important;
  color:#333;
  }
  .theme-default #main-menu li.active>a {
    background: #fff;
    color: #808b9c !important;
  }
  .theme-default #main-menu li.active>a .menu-icon {
    color: #fff !important;
    width: 30px;
    height: 30px;
    line-height: 30px;
    margin: -5px 0 !important;
    background: rgba(0,0,0,0.25);
    border-radius: 5px;
  }



#leftcol, #rightcol {
  height: calc(100vh - 46px);
}
#rightcol {
  background-color: #e8f4f8;
  padding:4px 10px 4px 4px;
  border-left: 1px solid #d0d1d5;
}
#widgetList {
  position: absolute;
  bottom: 0px;
  margin-bottom: 0px!important;
  width: 100%;
}
#widgetCallResult {
border:1px solid #e5e6e9;padding:4px;background-color:#ffffff;marign:0 0 0 5px !important;border-radius: 5px;
}
#widgetCallHistory {
border: 1px solid #e5e6e9;margin-top:4px;  background:#FFFFFF; padding:0px;height: calc(100vh - 550px);border-radius: 5px;
}
#main-navbar #main-menu-toggle {
  display: none;
}
.righttxt {text-align: right !important}
.animated{
-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both
}
.animated.hinge{
-webkit-animation-duration:2s;animation-duration:2s
}

/*住所1*/
.inputAddr1 {height:35px;width:100%;padding-left:10px !important;border:0px}
.inputAddr1:focus{
border-color:1px solid #43a543!important;-webkit-box-shadow:none;box-shadow:none;color:red;
}

@media screen and (max-width: 767px) {
    html {
        overflow-y: scroll;
    }
}

.th-category, .td-category {cursor:pointer; width:100px !important;}
.th-customername, .td-customername {cursor:pointer; width:360px !important;}
.th-customerperson, .td-customerperson {cursor:pointer; width:150px !important;}
.th-tel, .td-tel{cursor:pointer; width:100px !important;}
.th-address, .td-address{cursor:pointer; width:250px !important;}
.th-callcount, .td-callcount {cursor:pointer; width:60px !important;}
.th-lastcallday, .td-lastcallday{cursor:pointer; width:110px !important;}
.th-status, .td-status{cursor:pointer; width:120px !important;}
.td-status span{text-overflow: ellipsis;max-width: 110px;overflow: hidden;}
.th-rating, .td-rating{cursor:pointer; width:100px !important;}
.th-remarks, .th-remarks{cursor:pointer; width:auto !important;}
.th-allocation, .th-allocation{cursor:pointer; width:150px !important;}
.th-customitems, .td-customitems{cursor:pointer; width:100px !important;}

.text-over-hidden{text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}

#CallmodeListTable>tbody>tr>th{
	white-space: nowrap;font-size: 13px;
}

#list_view, list_view>tbody>tr>td, list_view>tbody>tr>th, list_view>tfoot>tr>td, list_view>tfoot>tr>th, list_view>thead>tr>td, list_view>thead>tr>th {
	white-space: nowrap;
}
#ListViewMybox, #ListViewListMng, #ListVieBanList, #ListViewLeadList, #ListViewClientReport, #listViewActivityResults{
  height: calc(100vh - 210px);width:100%; overflow:auto;
}
#ListViewProject {
  height: calc(100vh - 216px);width:100%; overflow:auto;
}
#listViewCustomParams {
  height: calc(100vh - 135px);width:100%; overflow:auto;
}

.list-child {
background-color:#f3f3f3;border-left:20px solid #333;
}
option.list-child {
background-color:#f3f3f3;padding-left:20px !important;border-width:3px;
}

.default-workgroup {
  background-color: #f6f3ec;
}

#ListViewCalllog{
 height: calc(100vh - 180px);width:100%; overflow:auto;
}
#ListViewUsers, #listViewRecallList {
height: calc(100vh - 120px);overflow-y: auto;
}
#ListViewAccess, #listViewCallHistoryIP {
  height: calc(100vh - 110px);width:100%; overflow:auto;
}
#ListViewClients, #ListViewAppointList {
  height: calc(100vh - 46px);overflow-y: auto;

}
#details_view {
 width:100%;height:calc(100vh - 220px);overflow:auto;
}
#ListViewAppointList, #ListViewAppointForm {
  width:100%;height:calc(100vh - 220px); overflow-x:hidden; overflow-y:auto;background-color:#ffffff;
}
#listViewCustomerDetails {
 width:100%;height:calc(100vh - 200px);overflow:auto;
}
#CallModeHistoryList, #CallHistoryCustomer {
  height: calc(100vh - 584px);
  width: 100%;
  overflow: auto;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
#insideHistoryFrame {
  width: 100%;
  height: 100vh;
  overflow: auto;
}
#sample-table-1 {
	font-size: 14px !important;
}
#sample-table-1>tbody>tr>td {
	font-size: 16px !important;
  word-break: break-all;
}
#buttonFiltered {
  float:right;height:30px;
}
#myboxSwitcher .switcher {
  height:21px;
  width:50px;
}
.select2-container .select2-choice .select2-arrow b {
    margin-top: 0px !important;
}
.select2-container .select2-choice {
    height: 40px !important;
}

.modal{right:0;left:0}.rtl .modal-content{-webkit-box-shadow:-0 3px 9px rgba(0,0,0,0.5);box-shadow:-0 3px 9px rgba(0,0,0,0.5)}.rtl .modal-backdrop{right:0;left:0}.rtl .modal-footer{text-align:left}.rtl .modal-footer .btn+.btn{margin-left:auto;margin-right:5px}.rtl .modal-footer .btn-group .btn+.btn{margin-left:auto;margin-right:-1px}.rtl .modal-footer .btn-block+.btn-block{margin-left:auto;margin-right:0}@media(min-width:768px){.rtl .modal-content{-webkit-box-shadow:-0 5px 15px rgba(0,0,0,0.5);box-shadow:-0 5px 15px rgba(0,0,0,0.5)}}
.btn-signal {width: 95%; height:75px; margin: 0 auto;}

.color-line {
    background: #f7f9fa;
    height: 0px;/*height: 6px;*/
    background-image: -webkit-linear-gradient(left, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
    background-image: -moz-linear-gradient(left, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
    background-image: -ms-linear-gradient(left, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
    background-image: linear-gradient(to right, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
    background-size: 100% 6px;
    background-position: 50% 100%;
    background-repeat: no-repeat
}
td.head {text-align: center;vertical-align: middle !important;background: #f9f9f9;font-weight: 500}
.unit {float: right; margin-top:-30px;}
table#call_history_title {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0; /* tableのcellspacing="0"の代わり */
  background-color: #ffffff;
}
table#call_history_record{
  width: 100%;
  max-height: 100px;
  height: auto !important; /* IE6 max-height対応 */
  height: 100px;　/* IE6 max-height対応 */
  overflow-x: hidden; /* 横スクロール非表示 */
  overflow-y: scroll; /* 縦スクロール */
}
#call_history_record table thead,#call_history_record table tbody{
  display: block;
}
#call_history_record table tbody{
  overflow-y: scroll;
  height: 150px;
}
#call_history_record table thead th:last-child,#call_history_record table tbody td:last-child{
  width: 99999px!important;
}
#calldestination {
	color: #555;
	/*background-color: #f4f4f4;*/
	width:100%;
	font-size:90% !important;
	border: 2px;
}

#list-menu-wrapper {
	background-color: #f4f4f4; /*#061c3f;*/
  padding: 5px 10px;
	border-bottom:1px solid #e4e4e4;
}
.search-value {
  overflow: auto;
}

.status_form_header {
	background-color:#ffffff;   /*#eeeeee;#f4f4f4; #d9edf7*/
	border:none;
	/*color:#3a87ad;*/
	width:100%;
	text-align:center;
	font-size: 15px !important;
	font-weight: bold;
	line-height: 30px;
	border-bottom:1px solid #e5e6e9;
}
#suggestions {
	margin-top: -6px;
}

#notice {
    background-color: #23272d;
    padding: 5px 0;
    color: #FFF;
    text-align: center;
    font-size: 13px;
    height: 25px;
}

#g-notification .q-item__label.text-caption {
  white-space: break-spaces;
}

.content-box {
  font-size: 16px;
  width: 100%;
  height: 150px;
  margin: 0px;
  position: relative;
  /* So we can position the banner within the box */

  background:#fbf4f4;
  /*border: 3px solid #e1e1e1;*/
  /*box-shadow: 0 0 10px rgba(0, 0, 0, .3);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
  margin-bottom:5px;
  */
}

#sideNavDate {
    font-family: quicksandregular;
    font-size: 317%;
    color: #FFF;
    display: block;
    text-align: center;
    line-height: 1;
    margin-top: -8px;
    margin-bottom: 7px;
}
#sideNavDay {
    font-size: 11px;
    color: #FFF;
    padding-left: 3px;
}

#ribbon-container {
  position: absolute;
  top: 10px;
  right: 0px;
  overflow: visible;
  /* so we can see the pseudo-elements we're going to add to the anchor */

  font-size: 18px;
  /* font-size and line-height must be equal so we can account for the height of the banner */

  line-height: 18px;
}

#ribbon-container:before {
  /*
  content: "";
  height: 0;
  width: 0;
  display: block;
  position: absolute;
  top: 3px;
  left: 0;
  border-top: 21px solid rgba(0, 0, 0, .3);

  border-bottom: 21px solid rgba(0, 0, 0, .3);
  border-right: 29px solid rgba(0, 0, 0, .3);
  border-left: 29px solid transparent;
*/
}

#ribbon-container:after {
  /* This adds the second part of our dropshadow */
/*
  content: "";
  height: 3px;
  background: rgba(0, 0, 0, .3);
  display: block;
  position: absolute;
  bottom: -3px;
  left: 58px;
  right: 3px;
  */
}

#ribbon-container a {
  display: block;
  padding: 10px;
  position: relative;
  /* allows us to position our pseudo-elements properly */

  background: #0089d0;
  overflow: visible;
  height: 42px;
  margin-left: 29px;
  color: #fff;
  text-decoration: none;
}

#ribbon-container a:after {
  /* this creates the "folded" part of our ribbon */
/*
  content: "";
  height: 0;
  width: 0;
  display: block;
  position: absolute;
  bottom: -15px;
  right: 0;
  border-top: 15px solid #004a70;
  border-right: 15px solid transparent;
  */
}

#ribbon-container a:before {
  /* this creates the "forked" part of our ribbon */

  content: "";
  height: 0;
  width: 0;
  display: block;
  position: absolute;
  top: 0;
  left: -29px;
  border-top: 21px solid #0089d0;
  border-bottom: 21px solid #0089d0;
  border-right: 29px solid transparent;
  border-left: 29px solid transparent;
}

#ribbon-container a:hover {
  background: #009ff1;
}

#ribbon-container a:hover:before {
  /* this makes sure that the "forked" part of the ribbon changes color with the anchor on :hover */

  border-top: 21px solid #009ff1;
  border-bottom: 21px solid #009ff1;
}
#calldialpanel {
 top:15px;width:100% !important;height:100% !important;background:#242424;color:#ffffff;
}
#calldialpanel button {width:30%;height:24%;background:#595959;margin:5px 0;border:0px;font-wight:bold;border-radius: 2px;

}

#dial_number {
  width:100%;height:180px;border-bottom: 1px solid #f3f3f3;
}
.suggestion-box {
  padding: 7px; font-weight:bold; height: 37px; background: rgba(0,0,0,0.05);
}
#suggestionsList {
 background-color:#ffffff; cursor:hand;cursor:pointer;max-height:500px;overflow-y: auto;overflow-x:hidden;
}
.input4details {height:35px;padding-left:10px !important;border:0px}
.input4details:focus{
border-color:#43a543 !important;-webkit-box-shadow:none;box-shadow:none;color:red;
}
.input4form {width:100%;height:35px;padding-left:10px !important;border:0px;margin: 0;background-color:#f0f8ff;}
.input4form:focus{
border-color:#43a543 !important;-webkit-box-shadow:none;box-shadow:none;
}

.search-label {
	font-weight: normal; !important;
	padding:0;
  font-size: 12px;
}

.element-tile {
	display: block;
    position: relative;
    /*box-shadow: 0 3px 10px #C8C8C8;
    border:1px solid;
    border-color: #e5e6e9 #dfe0e4 #d0d1d5;*/
    overflow: hidden;
    text-decoration: none;
    cursor: pointer;
}
.memo-string-title {
	font-color:#c1c1c1;
	border-top: 1px solid #e4e4e4;
	/*border-bottom: 1px solid #e4e4e4;*/
	background: #eee;
	padding: 0 10px;
	/*border-radius: 10px 10px 0px 0px;*/
}
.memo-string-disc {
	padding: 0 10px;
	border-bottom: 1px solid #e4e4e4;
	/*border-radius: 0px 0px 10px 10px;*/
	margin: 1px 0px;

}
.status-btn {
     margin-top: -4px;
    font-weight: bold !important;
    height: 31px;
    border-color: #ddd;
    border-bottom-color: #cecece;
    background: #f4f4f4;
    color: #555;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    font-size: 13px;
    border-radius: 2px;
}

.loginbg1 {
	height: 0;
	/* 表示画像の高さ ÷ 表示画像の幅 × 100 */
	padding-top: 56.25%;
	background:url('../img/bg02.jpg') 0 0 no-repeat;
	background-size: contain;
	margin-bottom: -56.25%;
}
#login-wrap {
	top: 200px;
	width: 850px;
    background-color: rgba(0, 0, 0, 0.6);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#99000000',GradientType=0 );
    overflow: hidden;
    margin: 0 auto;
    padding: 30px;
    position: relative;
    z-index: 25;
}
#hangup_call_counterpart_board:focus,#hangup_call_counterpart:focus,#hangup_memo_1_board:focus,#hangup_memo_1:focus,#hangup_call_status_board:focus,#hangup_call_status:focus,#datetime_picker_1_board:focus,#datetime_picker_1:focus, {
  border: 3px solid #f05050 !important;
}

/* ---------------------------------------------------
    SearchBAR STYLE
----------------------------------------------------- */
#searchbar {
    min-width: 250px;
    max-width: 250px;
    background: #f3f3f3;
    /*color: #fff;*/
    transition: all 0.3s;
            position: fixed;
        z-index: 997;
        height: 100%;

}

#search_form_buttons {
	margin-bottom: 5px;

}

#search_form_items {
    overflow-y: scroll;
    overflow-x: hidden;
}

#search_form_items::-webkit-scrollbar {
  display: none;
}

#searchbar.active {
    margin-left: -250px;
}

#searchbar .searchbar-header {
    padding: 20px;
    background: #6d7fcc;
}

#searchbar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid #47748b;
}

#searchbar ul p {
    color: #fff;
    padding: 10px;
}

#searchbar ul li a {
    /*padding: 10px;*/
    font-size: 1.1em;
    display: block;
}
#searchbar ul li a:hover {
    color: #7386D5;
    background: #fff;
}

#searchbar ul li.active > a, a[aria-expanded="true"] {
    color: #fff;
    background: #6d7fcc;
}


a[data-toggle="collapse"] {
    position: relative;
}

#nav-bottom-icons {
  position: absolute;
  bottom: 10px;
  text-align: center;
  width: 100%;
}

#nav-bottom-icons ul {
  padding-left: 0px;
}

#nav-bottom-icons ul li {
  list-style: none;
}

#nav-bottom-icons img {
  max-width: 30px;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
    #searchbar {
        margin-left: -250px;

    }
    #searchbar.active {
        margin-left: 0;
    }
    #searchbarCollapse span {
        display: none;
    }
    .login_main {
        width: 100%;
    }
}
#searchbarCollapse {
   position: absolute;bottom: 0px;left: 250px;height: 50px;
 }

.project-select2>.select2-choice {
  border: none;
}
.theme-default .project-select2>.select2-container-active .project-select2>.select2-choice, .theme-default .project-select2>.select2-container-active .project-select2>.select2-choices {
  border: none;
}

#projectLeftCol {
  width: 200px;
  height: calc(100vh - 137px);
  position: absolute;
  overflow-x: hidden;
  overflow-y: auto;
  background: #e9ebee;
}
#projectRightCol {
margin-left:202px;
width: 100%;
}

.group-bar {
font-size: 14px;font-weight:600;padding-left: 20px;background-color:#e6e6e5;line-height: 90%;
}
.list-thead {
  font-size:13px;
text-align-last: center;
}
#hangup_call_status_board option, #hangup_call_counterpart_board option {
  font-weight: 500;
  padding: 1px 4px;
}
.checkbox-inline, .radio-inline {
    margin-top: -5px !important; //padding 5pxが自働でできてしまうことの調整
}
.bootstrap-tagsinput {
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    display: inline-block;
    padding: 4px 6px;
    color: #555;
    vertical-align: middle;
    border-radius: 4px;
    max-width: 100%;
    line-height: 22px;
    cursor: text;
}
.bootstrap-tagsinput input {
    border: none;
    box-shadow: none;
    outline: none;
    background-color: transparent;
    padding: 0 6px;
    margin: 0;
    width: auto;
    max-width: inherit;
}
#calldestination>.btn-default {
  background-color: #ffffff!important; background-image: none!important;
}

timeline-alt{
padding:20px 0;position:relative
}
.timeline-alt .timeline-item{
position:relative
}
.timeline-alt .timeline-item:before{
background-color:#f1f3fa;bottom:0;content:"";left:9px;position:absolute;top:20px;width:2px;z-index:0
}
.timeline-alt .timeline-item .timeline-icon{
float:left;height:20px;width:20px;border-radius:50%;border:2px solid transparent;font-size:12px;text-align:center;line-height:16px;background-color:#fff
}
.timeline-alt .timeline-item .timeline-item-info{
margin-left:30px
}
.timeline-alt .timeline-item:before {
    background-color: #f1f3fa;
    bottom: 0;
    content: "";
    left: 9px;
    position: absolute;
    top: 20px;
    width: 2px;
    z-index: 0;
}
.timeline-alt .timeline-item .timeline-item-info {
    margin-left: 30px;
}
.timeline-alt .timeline-item .timeline-icon {
    float: left;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    border: 2px solid transparent;
    font-size: 12px;
    text-align: center;
    line-height: 16px;
    background-color: #fff;
}


#buttonCustomerDetailsUpdate{
  position: fixed;
  right: 25px;
  bottom: 5px;
}
#report_menu_tab, #list_menu_tab {
  margin-top:10px; border-bottom:1px solid #ccc;
}

body {
    margin:0;
    overflow:hidden;
    height: 100vh;
}

.bubble {
    animation:spin 1s infinite linear;
    border-radius:50%;
    position:absolute;
    transform-origin:bottom;

}

@keyframes spin {
    100% {
        transform:rotate(360deg);
    }
}

.loading_cont {
    position: absolute;
}

.loading_cont:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0px;
    opacity: 0.05;
    z-index: 0;
}

/* login画面 */

#loader1 {
    position: absolute;
    width: 300px;
    height: 300px;
    top: 0%;
    right: 0%;
}

#loader2 {
    position: absolute;
    width: 300px;
    height: 300px;
    top: 0%;
    right: 0%;
}

#loader3 {
    position: absolute;
    width: 300px;
    height: 300px;
    top: 0%;
    right: 0%;
}

#loader4 {
    position: absolute;
    width: 300px;
    height: 300px;
    bottom: 0%;
    left: 0%;
}

#loader5 {
    position: absolute;
    width: 300px;
    height: 300px;
    bottom: 0%;
    left: 0%;
}

#loader6 {
    position: absolute;
    width: 300px;
    height: 300px;
    bottom: 0%;
    left: 0%;
}

#svgcontainer1 {
    width: 100%;
    height: 100%;
}

#svgcontainer2 {
    width: 100%;
    height: 100%;
}

#activityLabelBar {
    background-color: #f3f3f3;
    height: 55px;
    vertical-align: middle;
    padding:10px;
}

.menu-text {
  vertical-align:middle;line-height:35px;display: inline-block;font-size:15px;
}
.input-group-form {
  position: relative;
    z-index: 2;
    float: left;
    margin-bottom: 0;
    border-top-color: #c2c2c2;
    -webkit-box-shadow: none;
    height: 32px;
    padding: 6px 12px;
    font-size: 13px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #d6d6d6;
    border-radius: 2px;
}
rect {
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

.blobs {
    -webkit-filter: url("#goo");
    filter: url("#goo");
}

.blob {
    fill: white;
}
.login_main {
    padding: 19px 52px;
    width:30%;
    max-width: 400px;
    margin: auto;
    position: relative;
    box-shadow: 0px 26px 46px rgba(39,64,145,0.08);
    background-color: #fff;
    z-index: 1;
}

.sign {
    padding-top: 5px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: bold;
    font-size: 19px;
}

.un {
    width: 100%;
    color: rgb(38, 50, 56);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1px;
    background: #fff;
    padding: 10px 20px;
    border: none;
    border-bottom: 1px solid #eee;
    outline: none;
    box-sizing: border-box;
    margin-bottom: 50px;
    margin-bottom: 27px;
    font-family: 'Ubuntu', sans-serif;
}

.pass {
    width: 100%;
    color: rgb(38, 50, 56);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1px;
    background:#fff;
    padding: 10px 20px;
    border: none;
    border-bottom: 1px solid #eee;
    outline: none;
    box-sizing: border-box;
    margin-bottom: 50px;
    margin-bottom: 0px;
    font-family: 'Ubuntu', sans-serif;
}


.un:focus, .pass:focus {
    border-bottom: 2px solid #000000 !important;

}

.submit {
    width: 100%;
    height: 50px;
    cursor: pointer;
    border-radius: 5em;
    color: #fff;
    background: linear-gradient(to right, #235bbe, #437fec);
    border: 0;
    font-family: 'Ubuntu', sans-serif;
    margin-top: 20px;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.04);
}

.forgot {
    text-align: right;
    text-shadow: 0px 0px 3px rgba(117, 117, 117, 0.12);
    color: #3c77e2;
    font-size: 12px;
    font-weight: 600;
}

.noaccount {
    text-align: center;
    text-shadow: 0px 0px 3px rgba(117, 117, 117, 0.12);
    color: #000000;
    font-size: 12px;
    font-weight: normal;

}

.login {
    height: 100%;
    width: 100%;
    display: table;
    position: absolute;
    overflow: hidden;
}

.login_panel_wrapper {
  display: table-cell;
vertical-align: middle;
}

/* 汎用パーツ */
.bg-info-lighten {
    background-color: rgba(68,186,220,.25)!important;
}
.text-info {
    color: #44badc!important;
}
.bg-primary-lighten {
    background-color: rgba(54,136,252,.25)!important;
}
.text-primary {
    color: #3688fc!important;
}
.bg-danger-lighten {
    background-color: rgba(250,103,103,.25)!important;
}
.text-danger {
    color: #fa6767!important;
}
.bg-warning-lighten {
    background-color: rgba(249,188,13,.25)!important;
}
.text-warning {
    color: #f9bc0d!important;
}
.bg-success-lighten {
    background-color: rgba(66,210,157,.25)!important;
}
.text-success {
    color: #42d29d!important;
}
.bg-secondary-lighten {
    background-color: rgba(145,156,167,.25)!important;
}
.text-secondary {
    color: #919ca7!important;
}
.card-1 {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24) !important;
}

.card-1h {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24) !important;
  transition: all 0.3s cubic-bezier(.25,.8,.25,1) !important;
}

.card-1h:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22) !important;
}

.card-2 {
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23) !important;
}

.card-3 {
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important;
}

.card-4 {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22) !important;
}

.card-5 {
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22) !important;
}
.mr-5 {  margin-right: 5px;}
.ml-5 {  margin-left: 5px;}
.mb-5 {  margin-bottom: 5px;}
.mt-5 {  margin-top: 5px;}
.mr-10 {  margin-right: 10px;}
.ml-10 {  margin-left: 10px;}
.mb-10 {  margin-bottom: 10px;}
.mt-10 {  margin-top: 10px;}


/* pages.min.cssの中　*/
.page-invoice .invoice{
padding:0 20px
}
.page-invoice .invoice hr{
border:none;
border-bottom:3px solid #f1f1f1;
margin:0 -20px
}
.page-invoice .invoice-header{
background:#f7f7f7;
border-bottom:8px solid #f1f1f1;
margin:0 -20px;
padding:20px;
position:relative
}
.page-invoice .invoice-header:after,.page-invoice .invoice-header:before{
content:" ";
display:table
}
.page-invoice .invoice-header:after{
clear:both
}
.page-invoice .invoice-header h3{
font-size:19px;
font-weight:600;
height:55px;
line-height:23px;
margin:0 0 0 40px;
padding:0;
word-wrap:none
}
.page-invoice .invoice-header small{
color:#a0a0a0;
font-size:12px
}
.page-invoice .invoice-header .invoice-logo{
display:block;
height:26px;
width:26px;
margin:12px 0 0 -40px;
position:absolute
}
.page-invoice .invoice-header address{
border-left:5px solid #e8e8e8;
color:#959595;
display:block;
font-size:12px;
line-height:15px;
padding-left:10px;
margin-top:5px
}
.page-invoice .invoice-date{
font-size:16px;
font-weight:600;
margin-top:-5px
}
.page-invoice .invoice-info,.page-invoice .invoice-table{
padding:30px 0
}
.page-invoice .invoice-info:after,.page-invoice .invoice-info:before,.page-invoice .invoice-table:after,.page-invoice .invoice-table:before{
content:" ";
display:table
}
.page-invoice .invoice-info:after,.page-invoice .invoice-table:after{
clear:both
}
.page-invoice .invoice-recipient{
font-size:14px;
line-height:19px;
height:60px;
padding-left:70px
}
.page-invoice .invoice-recipient:before{
background:#f7f7f7;
border-radius:999px;
color:#888;
content:"TO";
display:block;
font-size:14px;
font-weight:600;
height:52px;
line-height:52px;
margin:4px 0 0 -70px;
position:absolute;
text-align:center;
width:52px
}
.page-invoice .invoice-total{
background:#f7f7f7;
color:#888;
font-weight:600;
height:60px;
line-height:60px;
padding:0 25px;
white-space:nowrap;
margin-top:20px
}
.page-invoice .invoice-total span{
display:block;
float:right;
color:#555;
font-size:24px
}
.page-invoice .invoice-description{
color:#aaa;
font-size:12px;
font-weight:400;
line-height:15px;
padding-top:4px
}
.page-invoice table{
width:100%
}
.page-invoice table thead{
background:#f7f7f7;
color:#888;
font-size:12px
}
.page-invoice table tbody tr{
font-size:14px
}
.page-invoice table tbody tr+tr{
border-top:1px solid #f1f1f1
}
.page-invoice table td,.page-invoice table th{
border-left:1px solid #fff;
font-weight:600;
padding:7px 0 7px 15px;
text-align:left;
vertical-align:top
}
.page-invoice table td{
padding-bottom:20px;
padding-top:20px
}
@media (min-width:768px){
.page-invoice .invoice{
padding:0 40px
}
.page-invoice .invoice hr{
border:none;
border-bottom:3px solid #f1f1f1;
margin:0 -40px
}
.page-invoice .invoice-header{
padding:40px;
margin:0 -40px
}
.page-invoice .invoice-header h3{
float:left
}
.page-invoice .invoice-header address{
margin:6px 0 0 30px;
float:left
}
.page-invoice .invoice-date{
float:right;
margin-top:6px
}
.page-invoice .invoice-recipient,.page-invoice .invoice-total{
width:50%
}
.page-invoice .invoice-recipient{
float:left
}
.page-invoice .invoice-total{
float:right;
margin-top:0
}

}
body.page-invoice.page-invoice-print,body.page-invoice.page-invoice-print *{
color:#000!important
}
.page-invoice.page-invoice-print .invoice{
min-width:768px;
padding:0 40px
}
.page-invoice.page-invoice-print .invoice hr{
border-bottom:1px solid #aaa;
margin:0 -40px
}
.page-invoice.page-invoice-print .invoice-header{
padding:40px;
margin:0 -40px;
background:0 0;
border-bottom:2px solid #aaa
}
.page-invoice.page-invoice-print .invoice-header h3{
float:left;
margin:0!important
}
.page-invoice.page-invoice-print .invoice-header address{
margin:6px 0 0 30px;
float:left
}
.page-invoice.page-invoice-print .invoice-header .invoice-logo{
display:none!important
}
.page-invoice.page-invoice-print .invoice-date{
float:right;
margin-top:6px
}
.page-invoice.page-invoice-print .invoice-recipient,.page-invoice.page-invoice-print .invoice-total{
width:50%
}
.page-invoice.page-invoice-print .invoice-recipient{
float:left
}
.page-invoice.page-invoice-print .invoice-recipient:before{
color:#000;
background:0 0
}
.page-invoice.page-invoice-print .invoice-total{
float:right;
margin-top:0;
background:0 0;
text-align:right
}
.page-invoice.page-invoice-print .invoice-total span{
margin-left:15px
}
.page-invoice.page-invoice-print table thead{
background:0 0;
border-bottom:1px solid #aaa
}
.page-pricing .page-pricing-header{
margin:-22px -22px 22px -22px;
overflow:hidden;
position:relative;
text-align:center
}
.page-pricing .page-pricing-header img{
left:0;
position:absolute;
width:100%
}
.page-pricing .page-pricing-header .bg-overlay{
opacity:.5;
position:absolute;
top:0;
left:0;
right:0;
bottom:0
}
.page-pricing .page-pricing-header .page-pricing-header-content{
position:relative
}
.page-pricing .page-pricing-header .page-pricing-header-content h1.page-title{
padding:40px 0 0;
color:#fff;
margin:0 0 -40px 0
}
.page-pricing .page-pricing-header .page-pricing-header-content .slogan{
padding:60px 0 40px;
color:#fff
}
.page-pricing .page-pricing-header .page-pricing-header-content .slogan h3,.page-pricing .page-pricing-header .page-pricing-header-content .slogan h4{
padding:0;
margin:0
}
.page-pricing .page-pricing-header .page-pricing-header-content .slogan h3{
line-height:30px;
font-weight:600
}
.page-pricing .page-pricing-header .page-pricing-header-content .slogan h4{
padding-top:10px;
font-weight:300
}
.page-pricing .plans-panel{
margin:0 auto
}
.page-pricing .plans-container{
position:relative;
margin:-1px
}
.page-pricing .plans-container:after,.page-pricing .plans-container:before{
content:" ";
display:table
}
.page-pricing .plans-container:after{
clear:both
}
.page-pricing .plan-col{
text-align:center;
padding:0;
position:relative;
margin-bottom:22px
}
.page-pricing .plan-header{
font-size:15px;
font-weight:700;
overflow:hidden;
line-height:50px;
white-space:nowrap;
position:relative
}
.page-pricing .plan-pricing{
white-space:nowrap;
padding:20px 0
}
.page-pricing .plan-currency{
font-size:24px;
font-weight:300
}
.page-pricing .plan-value{
font-size:44px;
font-weight:300
}
.page-pricing .plan-period{
font-size:18px;
display:inline-block;
margin-left:5px;
font-weight:300
}
.page-pricing .plan-features{
padding:0;
margin:0;
border-top:none
}
.page-pricing .plan-features>a,.page-pricing .plan-features>li{
margin:0;
padding:16px 0;
font-size:14px;
font-weight:300;
display:block
}
.page-pricing .plan-features>li{
background:#fff;
border:1px solid #e4e4e4;
border-top:0
}
.page-pricing .plan-features>a{
margin-top:-1px;
font-size:13px;
-webkit-transition:all .2s;
transition:all .2s
}
.page-pricing .trial{
padding:20px 0;
text-align:center;
font-size:14px;
color:#888;
line-height:23px
}
.page-pricing .trial a{
font-size:15px
}
.ie8 .page-pricing .page-pricing-header .bg-overlay{
display:none!important
}
@media (min-width:768px){
.page-pricing .plans-panel{
background:#fafafa;
border:1px solid #e4e4e4;
margin-bottom:22px
}
.page-pricing .plan-col{
margin-bottom:0
}
.page-pricing .plan-col+.plan-col .plan-features>li{
border-left-width:0;
-webkit-box-shadow:-1px 0 0 #e4e4e4;
box-shadow:-1px 0 0 #e4e4e4
}
.page-pricing .plan-col+.plan-col .plan-features>a{
margin-left:-1px
}

}
html body.page-signin{
background:#666!important
}
#page-signin-bg{
height:100%;
left:0;
overflow:hidden;
position:fixed;
top:0;
width:100%;
z-index:20
}
#page-signin-bg img{
width:100%
}
#page-signin-bg .overlay{
background:rgba(0,0,0,.5);
bottom:0;
left:0;
position:absolute;
right:0;
top:0
}
.page-signin .signin-container{
border-radius:2px;
display:block;
margin:20px 14px;
position:relative;
z-index:999
}
.page-signin .signin-info{
background:#444;
display:block;
overflow:hidden;
padding:20px 30px;
text-align:center
}
.page-signin .signin-info .logo{
color:#fff;
font-size:22px;
font-weight:700;
opacity:1
}
.page-signin .signin-info .logo[href]:hover{
opacity:.7
}
.page-signin .signin-info .slogan{
color:#fff;
font-size:16px;
font-weight:300;
margin-top:5px
}
.page-signin .signin-info ul{
display:none
}
.page-signin .signin-form{
background:#fff;
display:block;
padding:30px;
position:relative
}
.page-signin .password-reset-form{
background:#fff;
bottom:0;
display:none;
left:0;
padding:30px;
position:absolute;
right:0;
top:0;
z-index:1020
}
.page-signin .password-reset-form .header{
background:#f4f4f4;
border-bottom:1px solid #ddd;
margin:-30px -30px 30px -30px;
padding:20px
}
.page-signin .password-reset-form .header .signin-text{
margin:0
}
.page-signin .password-reset-form .header .signin-text span{
background:#f4f4f4
}
.page-signin .password-reset-form .header .signin-text:before{
display:none
}
.page-signin .password-reset-form .header .close{
margin-top:2px
}
.page-signin .password-reset-form .form-group.w-icon .signin-form-icon{
z-index:1025
}
.page-signin .form-actions{
margin-top:15px
}
.page-signin .form-actions .signin-btn{
border:none;
border-radius:999999px;
font-size:13px;
font-weight:600;
line-height:19px;
outline:0!important;
padding:10px 0;
text-align:center;
width:100%;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signin .form-actions .signin-btn:hover{
background:#444!important
}
.page-signin .form-actions a.forgot-password{
border-bottom:1px dashed #bbb;
color:#999;
display:inline-block;
font-size:11px;
margin-left:10px;
padding-bottom:1px
}
.page-signin .form-actions a.forgot-password:hover{
color:#555;
text-decoration:none
}
.page-signin .form-group{
margin:0;
position:relative
}
.page-signin .form-group+.form-group{
margin:10px 0 0
}
.page-signin .form-group.w-icon .signin-form-icon{
border-right:1px solid #d6d6d6;
bottom:9px;
color:#d6d6d6;
display:block;
font-size:14px;
left:0;
line-height:27px;
position:absolute;
text-align:center;
top:9px;
width:40px;
z-index:1002;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signin .form-group.w-icon input[type=password],.page-signin .form-group.w-icon input[type=text]{
font-size:15px;
padding-left:56px
}
.page-signin .form-group.w-icon input[type=password]:focus+.signin-form-icon,.page-signin .form-group.w-icon input[type=text]:focus+.signin-form-icon{
color:#888
}
.page-signin .signin-text{
color:#777;
display:block;
font-size:15px;
font-style:italic;
margin-bottom:25px;
position:relative;
text-align:center
}
.page-signin .signin-text span{
background:#fff;
display:inline-block;
padding:0 20px;
position:relative
}
.page-signin .signin-text:before{
background:#e4e4e4;
content:"";
display:block;
height:1px;
left:0;
position:absolute;
right:0;
top:50%
}
.page-signin .signin-with{
background:#f4f4f4;
border-top:1px solid #ddd;
margin:30px -30px -30px -30px;
padding:20px 30px
}
.page-signin .signin-with-btn{
border-radius:2px;
color:#fff;
display:block;
font-weight:300;
padding:10px 0;
text-align:center;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signin .signin-with-btn span{
font-weight:600
}
.page-signin .signin-with-btn+.signin-with-btn{
margin-top:10px
}
.page-signin .signin-with-btn:hover{
background:#444!important
}
.page-signin .not-a-member{
color:#fff;
display:block;
font-size:14px;
margin:-20px 0 0 0;
padding:20px 0;
position:relative;
text-align:center;
z-index:999
}
.page-signin .not-a-member a{
color:#fff;
text-decoration:underline;
transition:all .3s
}
.page-signin .not-a-member a:hover{
opacity:.6
}
@media (min-width:480px){
.page-signin .form-actions{
margin-top:15px
}
.page-signin .form-actions .signin-btn{
padding-left:40px;
padding-right:40px;
width:auto
}

}
@media (min-width:768px){
.page-signin .signin-container{
display:table;
margin:80px auto;
width:650px;
table-layout:fixed
}
.page-signin .signin-info{
display:table-cell;
padding:30px;
text-align:left;
vertical-align:top;
width:40%
}
.page-signin .signin-info ul{
color:#fff;
display:block;
font-size:13px;
font-weight:300;
margin:30px 0 0;
padding:0
}
.page-signin .signin-info ul li{
list-style:none;
margin:0;
padding:7px 0
}
.page-signin .signin-info ul .signin-icon{
display:block;
float:left;
font-size:14px;
line-height:18px;
margin-right:6px;
text-align:center;
width:24px
}
.page-signin .signin-form{
display:table-cell;
vertical-align:top;
width:60%
}
.page-signin .not-a-member{
margin:-80px 0 80px
}

}
html body.page-signup{
background:#666!important
}
#page-signup-bg{
height:100%;
left:0;
overflow:hidden;
position:fixed;
top:0;
width:100%;
z-index:20
}
#page-signup-bg img{
width:100%
}
#page-signup-bg .overlay{
background:rgba(0,0,0,.5);
bottom:0;
left:0;
position:absolute;
right:0;
top:0
}
.page-signup .signup-container{
border-radius:2px;
display:block;
margin:20px 14px;
position:relative;
z-index:999
}
.page-signup .signup-header{
background:#444;
display:block;
overflow:hidden;
padding:20px 30px;
text-align:center
}
.page-signup .signup-header .logo{
color:#fff;
font-size:22px;
font-weight:700;
opacity:1
}
.page-signup .signup-header .logo[href]:hover{
opacity:.7
}
.page-signup .signup-header .slogan{
color:#fff;
font-size:16px;
font-weight:300;
margin-top:5px
}
.page-signup .signup-form{
background:#fff;
display:block;
padding:30px 20px;
position:relative
}
.page-signup .form-actions{
margin-top:15px
}
.page-signup .form-actions .signup-btn{
border:none;
border-radius:999999px;
font-size:13px;
font-weight:600;
line-height:19px;
outline:0!important;
padding:10px 0;
text-align:center;
width:100%;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signup .form-actions .signup-btn:hover{
background:#444!important
}
.page-signup .form-actions a.forgot-password{
border-bottom:1px dashed #bbb;
color:#999;
display:inline-block;
font-size:11px;
margin-left:10px;
padding-bottom:1px
}
.page-signup .form-actions a.forgot-password:hover{
color:#555;
text-decoration:none
}
.page-signup .form-group{
margin:0;
position:relative
}
.page-signup .form-group+.form-group{
margin:10px 0 0
}
.page-signup .form-group.w-icon .signup-form-icon{
border-right:1px solid #d6d6d6;
bottom:9px;
color:#d6d6d6;
display:block;
font-size:14px;
left:0;
line-height:27px;
position:absolute;
text-align:center;
top:9px;
width:40px;
z-index:1002;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signup .form-group.w-icon input[type=password],.page-signup .form-group.w-icon input[type=text]{
font-size:15px;
padding-left:56px
}
.page-signup .form-group.w-icon input[type=password]:focus+.signup-form-icon,.page-signup .form-group.w-icon input[type=text]:focus+.signup-form-icon{
color:#888
}
.page-signup .signup-text{
color:#777;
display:block;
font-size:15px;
font-style:italic;
margin-bottom:25px;
position:relative;
text-align:center
}
.page-signup .signup-text span{
background:#fff;
display:inline-block;
padding:0 20px;
position:relative
}
.page-signup .signup-text:before{
background:#e4e4e4;
content:"";
display:block;
height:1px;
left:0;
position:absolute;
right:0;
top:50%
}
.page-signup .signup-with{
background:#f4f4f4;
border-top:1px solid #ddd;
margin:30px -20px -30px -20px;
padding:20px
}
.page-signup .signup-with-btn{
border-radius:2px;
color:#fff;
display:block;
font-weight:300;
padding:10px 0;
text-align:center;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signup .signup-with-btn span{
font-weight:600
}
.page-signup .signup-with-btn+.signup-with-btn{
margin-top:10px
}
.page-signup .signup-with-btn:hover{
background:#444!important
}
.page-signup .have-account{
color:#fff;
display:block;
font-size:14px;
margin:-20px 0 0 0;
padding:20px 0;
position:relative;
text-align:center;
z-index:999
}
.page-signup .have-account a{
color:#fff;
text-decoration:underline;
transition:all .3s
}
.page-signup .have-account a:hover{
opacity:.6
}
@media (min-width:480px){
.page-signup .signup-container{
width:380px;
margin:80px auto
}
.page-signup .signup-form{
padding:30px
}
.page-signup .signup-with{
margin-left:-30px;
margin-right:-30px;
padding-left:30px;
padding-right:30px
}
.page-signup .have-account{
margin:-80px 0 20px
}

}
.page-signin-alt{
padding-bottom:40px
}
.page-signin-alt .signin-header{
background:#fff;
padding:16px 0 16px 16px;
position:relative;
-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05),0 1px 0 rgba(0,0,0,.05);
box-shadow:0 2px 2px rgba(0,0,0,.05),0 1px 0 rgba(0,0,0,.05)
}
.page-signin-alt .signin-header .logo{
color:#555;
font-size:16px;
height:24px;
line-height:24px;
width:24px;
opacity:1;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signin-alt .signin-header .logo[href]:hover{
opacity:.6
}
.page-signin-alt .signin-header .btn{
position:absolute;
right:16px;
top:12px
}
.page-signin-alt .signin-header .demo-logo{
display:inline-block;
height:24px;
line-height:24px
}
.page-signin-alt .form-header{
font-size:22px;
font-weight:300;
text-align:center;
margin:40px 0
}
.page-signin-alt .panel{
margin:0 16px;
padding:20px
}
.page-signin-alt .signin-password{
position:relative
}
.page-signin-alt .signin-password input{
padding-right:70px
}
.page-signin-alt .signin-password .forgot{
position:absolute;
right:10px;
top:10px;
color:#555;
background:#f1f1f1;
border-radius:2px;
line-height:25px;
padding:0 7px;
font-size:12px
}
.page-signin-alt .signin-password .forgot:hover{
text-decoration:underline
}
.page-signin-alt .signin-with{
margin:0 14px;
padding:20px;
text-align:center
}
.page-signin-alt .signin-with .header{
font-size:16px;
font-weight:300;
text-align:center;
margin:0 0 20px
}
.page-signin-alt .signin-with .btn{
padding-left:0;
padding-right:0;
width:40px;
text-align:center
}
@media (min-width:480px){
.page-signin-alt .signin-header{
padding-left:0;
text-align:center
}
.page-signin-alt .panel{
width:360px;
margin:0 auto;
padding:27px
}
.page-signin-alt .signin-with{
width:360px;
margin:0 auto
}

}
.page-signup-alt{
padding-bottom:40px
}
.page-signup-alt .signup-header{
background:#fff;
padding:16px 0 16px 16px;
position:relative;
-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05),0 1px 0 rgba(0,0,0,.05);
box-shadow:0 2px 2px rgba(0,0,0,.05),0 1px 0 rgba(0,0,0,.05)
}
.page-signup-alt .signup-header .logo{
color:#555;
font-size:16px;
height:24px;
line-height:24px;
width:24px;
opacity:1;
-webkit-transition:all .3s;
transition:all .3s
}
.page-signup-alt .signup-header .logo[href]:hover{
opacity:.6
}
.page-signup-alt .signup-header .btn{
position:absolute;
right:16px;
top:12px
}
.page-signup-alt .signup-header .demo-logo{
display:inline-block;
height:24px;
line-height:24px
}
.page-signup-alt .form-header{
font-size:22px;
font-weight:300;
text-align:center;
margin:40px 0
}
.page-signup-alt .panel{
margin:0 16px;
padding:20px
}
.page-signup-alt .signup-with{
margin:0 14px;
padding:20px;
text-align:center
}
.page-signup-alt .signup-with .header{
font-size:16px;
font-weight:300;
text-align:center;
margin:0 0 20px
}
.page-signup-alt .signup-with .btn{
padding-left:0;
padding-right:0;
width:40px;
text-align:center
}
@media (min-width:480px){
.page-signup-alt .signup-header{
padding-left:0;
text-align:center
}
.page-signup-alt .panel{
width:360px;
margin:0 auto;
padding:27px
}
.page-signup-alt .signup-with{
width:360px;
margin:0 auto
}

}
.page-search .search-text{
color:#888;
font-size:15px;
font-weight:300;
line-height:36px;
margin-bottom:22px
}
.page-search .search-tabs{
margin-bottom:-2px
}
.page-search .search-tabs:after,.page-search .search-tabs:before{
content:" ";
display:table
}
.page-search .search-tabs:after{
clear:both
}
.page-search .search-form{
background:#fafafa;
margin:-1px;
padding:16px 20px;
position:relative
}
.page-search .search-form .input-group-addon{
border-bottom-width:0;
border-left-width:0;
border-top-width:0
}
.page-search .search-form input[type=text]{
border-bottom-width:0;
border-top-width:0
}
.page-search .search-form button{
border-bottom-width:0;
border-right-width:0;
border-top-width:0
}
.page-search .search-classic{
margin:-20px;
padding:0
}
.page-search .search-classic li{
list-style:none;
margin:0;
padding:20px
}
.page-search .search-classic li>*+*{
margin-top:10px
}
.page-search .search-classic li+li{
border-top:1px solid #e4e4e4
}
.page-search .search-classic .search-content,.page-search .search-classic .search-tags,.page-search .search-classic .search-title,.page-search .search-classic .search-url{
display:block
}
.page-search .search-classic .search-title{
font-size:15px;
font-weight:600
}
.page-search .search-classic .search-tags:after,.page-search .search-classic .search-tags:before{
content:" ";
display:table
}
.page-search .search-classic .search-tags:after{
clear:both
}
.page-search .search-classic .search-tags a,.page-search .search-classic .search-tags span{
display:block;
float:left;
line-height:17px
}
.page-search .search-classic .search-tags .search-tags-text{
color:#aaa;
font-size:10px;
font-weight:600;
margin-right:10px;
text-transform:uppercase
}
.page-search .search-classic .search-tags .badge,.page-search .search-classic .search-tags .label{
font-size:10px
}
.page-search .search-classic .search-tags .badge+.badge,.page-search .search-classic .search-tags .badge+.label,.page-search .search-classic .search-tags .label+.badge,.page-search .search-classic .search-tags .label+.label{
margin-left:5px
}
.page-search .search-classic .search-url{
color:#3a8b54;
font-size:11px;
margin-top:4px
}
.page-search .search-users{
margin:-20px
}
.page-search .search-users table{
margin:0
}
.page-search .search-users table td,.page-search .search-users table th{
padding-bottom:14px;
padding-top:14px;
vertical-align:middle
}
.page-search .search-users .avatar{
border-radius:999999px;
height:30px;
width:30px
}
.page-search .search-messages{
margin-bottom:-20px;
margin-top:-20px
}
.page-search .search-messages .message{
padding-bottom:12px;
padding-top:12px
}
.page-search .search-messages .message .date{
top:12px
}
.page-404{
background:#f4b04f!important
}
.page-500{
background:#e66454!important
}
.page-500 .error-text{
margin-bottom:80px!important
}
.page-404,.page-500{
text-align:center
}
.page-404 .header,.page-500 .header{
background:#fff;
padding:20px 0;
-webkit-box-shadow:0 4px 0 rgba(0,0,0,.1);
box-shadow:0 4px 0 rgba(0,0,0,.1)
}
.page-404 .header .logo,.page-500 .header .logo{
color:#555;
font-size:16px;
height:24px;
line-height:24px;
width:24px;
opacity:.6;
-webkit-transition:all .3s;
transition:all .3s
}
.page-404 .header .logo[href]:hover,.page-500 .header .logo[href]:hover{
opacity:1
}
.page-404 .header .demo-logo,.page-500 .header .demo-logo{
display:inline-block;
height:24px;
line-height:24px;
background:#555!important
}
.page-404 .error-code,.page-500 .error-code{
color:#fff;
font-size:120px;
font-weight:700;
line-height:140px;
margin-top:60px;
text-shadow:0 4px 0 rgba(0,0,0,.1)
}
.page-404 .error-text,.page-500 .error-text{
color:#fff;
color:rgba(0,0,0,.5);
font-size:20px;
font-weight:600;
padding:0 20px
}
.page-404 .error-text .oops,.page-500 .error-text .oops{
font-size:50px
}
.page-404 .error-text .hr,.page-500 .error-text .hr{
background:#fff;
background:rgba(0,0,0,.2);
display:inline-block;
height:5px;
margin:20px 0;
width:40px
}
.page-404 .error-text .solve,.page-500 .error-text .solve{
display:inline-block;
font-size:16px;
font-weight:400;
margin-top:15px
}
.page-404 .search-form,.page-500 .search-form{
display:inline-block;
margin:50px 0 80px
}
.page-404 .search-form .search-btn,.page-404 .search-form .search-input,.page-500 .search-form .search-btn,.page-500 .search-form .search-input{
border:none;
border-radius:3px;
display:block;
float:left;
font-size:15px;
height:46px;
line-height:20px;
padding:13px 0
}
.page-404 .search-form .search-btn,.page-404 .search-form .search-btn:active,.page-404 .search-form .search-btn:focus,.page-404 .search-form .search-input,.page-404 .search-form .search-input:active,.page-404 .search-form .search-input:focus,.page-500 .search-form .search-btn,.page-500 .search-form .search-btn:active,.page-500 .search-form .search-btn:focus,.page-500 .search-form .search-input,.page-500 .search-form .search-input:active,.page-500 .search-form .search-input:focus{
outline:0!important;
outline-offset:0!important
}
.page-404 .search-form .search-input,.page-500 .search-form .search-input{
background:#fff;
color:#555;
padding-left:12px;
padding-right:12px;
width:220px
}
.page-404 .search-form .search-btn,.page-500 .search-form .search-btn{
background:#444;
background:rgba(0,0,0,.2);
color:#fff;
font-size:13px;
margin-left:10px;
padding-left:12px;
padding-right:12px;
-webkit-transition:all .3s;
transition:all .3s
}
.page-404 .search-form .search-btn:hover,.page-500 .search-form .search-btn:hover{
background:rgba(0,0,0,.5)
}
.page-404 .search-form .search-btn:active,.page-500 .search-form .search-btn:active{
background:rgba(0,0,0,.7)
}
.timeline{
position:relative;
padding-bottom:30px;
margin-bottom:20px
}
.timeline:after,.timeline:before{
content:"";
display:block;
position:absolute;
left:30px;
bottom:0
}
.timeline:before{
width:4px;
top:0;
margin-left:-2px
}
.timeline:after{
width:12px;
height:12px;
margin-left:-6px;
border-radius:999999px
}
.tl-header{
position:relative;
width:140px;
padding:8px 0;
text-align:center;
left:0;
margin-left:0;
margin-top:40px;
margin-bottom:40px;
font-size:14px;
border-radius:2px
}
.tl-header.now{
margin-top:0
}
.tl-entry{
margin-left:30px;
margin-right:0;
padding-left:36px;
padding-right:0;
position:relative;
margin-bottom:40px
}
.tl-entry:after,.tl-entry:before{
content:" ";
display:table
}
.tl-entry:after{
clear:both
}
.tl-entry:before{
content:"";
display:block;
position:absolute;
width:6px;
height:6px;
left:-3px;
right:auto;
border-radius:999999px;
top:20px
}
.tl-body{
position:relative;
padding:15px;
margin:0
}
.tl-body:before{
content:"";
display:block;
width:0;
height:0;
border-style:solid;
border-width:8px 9px 8px 0;
position:absolute;
left:-9px;
right:auto;
top:15px
}
.tl-body:after{
content:"";
display:block;
width:0;
height:0;
border-style:solid;
border-width:7px 8px 7px 0;
border-color:transparent #fff transparent transparent;
position:absolute;
left:-8px;
right:auto;
top:16px
}
.tl-time{
position:absolute;
left:auto;
right:auto;
margin-left:0;
margin-right:0;
text-align:right;
white-space:nowrap;
color:#888;
top:-22px;
font-size:13px
}
.tl-icon{
display:block;
position:absolute;
width:40px;
height:40px;
line-height:40px;
border-radius:999999px;
left:-20px;
right:auto;
top:4px;
text-align:center;
font-size:14px;
overflow:hidden
}
.tl-icon img{
height:100%;
display:block
}
.tl-wide{
margin:0 -15px
}
@media (min-width:768px){
.timeline:after,.timeline:before{
left:100px
}
.tl-header{
left:100px;
margin-left:-70px
}
.tl-entry{
margin-left:100px;
margin-bottom:20px
}
.tl-time{
left:auto;
right:100%;
margin-left:0;
margin-right:32px;
top:14px
}
.timeline.centered .tl-header,.timeline.centered:after,.timeline.centered:before{
left:50%;
right:auto
}
.timeline.centered .tl-entry{
margin-left:50%;
margin-right:0
}
.timeline.centered .tl-entry.left{
margin-left:0;
margin-right:50%;
padding-left:0;
padding-right:36px
}
.timeline.centered .tl-entry.left:before{
left:auto;
right:-3px
}
.timeline.centered .tl-entry.left .tl-body:before{
border-width:8px 0 8px 9px;
left:auto;
right:-9px
}
.timeline.centered .tl-entry.left .tl-body:after{
border-width:7px 0 7px 8px;
border-color:transparent transparent transparent #fff;
left:auto;
right:-8px
}
.timeline.centered .tl-entry.left .tl-time{
left:100%;
right:auto;
margin-left:32px;
margin-right:0
}
.timeline.centered .tl-entry.left .tl-icon{
left:auto;
right:-20px
}

}
.page-mail{
background:#fff!important
}
.page-mail #content-wrapper{
padding:0
}
.page-mail .mail-nav{
border:0 solid;
border-bottom-width:1px
}
.page-mail .mail-nav .navigation{
overflow:hidden;
position:relative;
padding-top:46px;
height:46px
}
.page-mail .mail-nav .navigation.open{
height:auto
}
.page-mail .mail-nav .navigation.open li.active:after{
-ms-transform:rotate(90deg);
-webkit-transform:rotate(90deg);
transform:rotate(90deg)
}
.page-mail .mail-nav .sections{
margin:10px 0;
padding:0
}
.page-mail .mail-nav .sections li{
list-style:none;
margin:0;
padding:0;
-webkit-transition:all .2s;
transition:all .2s
}
.page-mail .mail-nav .sections li.active{
position:absolute;
top:0;
width:100%;
border-bottom:1px solid
}
.page-mail .mail-nav .sections li.active a{
line-height:46px;
font-size:15px
}
.page-mail .mail-nav .sections li.active:after{
content:"\f105";
font-family:FontAwesome;
position:absolute;
display:block;
right:16px;
top:8px;
font-size:20px;
-webkit-transition:all .2s;
transition:all .2s
}
.page-mail .mail-nav .sections li.active .badge,.page-mail .mail-nav .sections li.active .label{
margin-top:13px;
margin-right:36px
}
.page-mail .mail-nav .sections .badge,.page-mail .mail-nav .sections .label{
margin-top:8px;
margin-right:16px
}
.page-mail .mail-nav .sections a{
display:block;
padding:0 0 0 16px;
line-height:36px;
font-size:14px
}
.page-mail .compose-btn{
margin-top:46px;
border-bottom:1px solid;
padding:16px
}
.page-mail .mail-select-folder{
display:none
}
.page-mail .mail-select-folder.active{
display:block
}
.page-mail .m-nav-icon{
width:16px;
margin-right:10px;
text-align:center;
display:inline-block
}
.page-mail .mail-nav-header{
margin-top:25px;
font-size:11px;
text-transform:uppercase;
padding-left:16px;
font-weight:600
}
.page-mail .mail-nav-lbl{
display:inline-block;
width:10px;
height:10px;
border-radius:3px;
margin-right:10px
}
.page-mail .mail-nav .add-more a{
font-size:12px
}
.page-mail .mail-nav li.divider{
padding:0;
height:1px;
margin:9px 0 3px
}
.page-mail .mail-controls{
border-bottom:1px solid #efefef;
padding:12px 16px
}
.page-mail .mail-controls .btn-group+.btn-group{
margin-left:12px
}
.page-mail .mail-controls .btn{
font-size:14px;
line-height:14px
}
.page-mail .mail-controls .btn .fa-caret-down{
position:relative;
top:-1px
}
.page-mail .mail-controls .pages{
line-height:30px;
margin-right:13px;
color:#bbb
}
@media (min-width:992px){
.page-mail .mail-controls .wide-btns .btn{
width:60px;
text-align:center;
display:inline-block
}

}
.page-mail .mail-container-header{
display:none;
border-bottom:1px solid #efefef;
line-height:35px;
padding:14px 16px;
font-size:20px;
font-weight:300
}
.page-mail .mail-container-header.show{
display:block
}
@media (min-width:992px){
.page-mail #content-wrapper{
position:static
}
.page-mail .mail-nav{
width:200px;
border-bottom:0;
position:absolute;
height:auto;
min-height:100%;
border-right-width:1px
}
.page-mail .mail-nav.fixed{
position:fixed
}
.page-mail .mail-nav.fixed:before{
display:none!important
}
.page-mail .mail-nav:before{
content:"";
display:block;
top:0;
bottom:0;
position:fixed;
width:200px;
border-right:1px solid;
z-index:-1
}
.page-mail .mail-nav .navigation{
height:auto!important;
padding-top:0
}
.page-mail .mail-nav .navigation .label{
font-size:10px;
line-height:16px;
padding:0 4px;
margin-top:11px!important;
margin-right:16px!important
}
.page-mail .mail-nav .navigation li:after{
display:none!important
}
.page-mail .mail-nav .sections li.active{
position:static;
top:auto;
border:none
}
.page-mail .mail-nav .sections a,.page-mail .mail-nav .sections li.active a{
font-size:13px;
line-height:36px
}
.page-mail .mail-select-folder{
display:none!important
}
.page-mail .mail-container{
margin-left:200px;
min-height:400px
}
.page-mail .mail-container-header{
display:block;
margin-top:46px
}

}
.page-mail .mail-list{
margin:16px;
padding:0
}
.page-mail .mail-item{
margin:0;
list-style:none;
position:relative;
padding:12px 14px 12px 46px
}
.page-mail .mail-item:nth-child(2n-1){
background:#f6f6f6
}
.page-mail .m-chck,.page-mail .m-star{
position:absolute
}
.page-mail .m-chck{
left:15px;
top:14px
}
.page-mail .m-star{
left:15px;
top:35px
}
.page-mail .m-star a{
font-size:15px;
color:#bbb
}
.page-mail .m-star a:before{
content:"\f006";
font-family:FontAwesome
}
.page-mail .m-star a:hover{
color:#ffab00
}
.page-mail .m-from,.page-mail .m-subject{
margin-right:80px
}
.page-mail .m-from a{
color:#444
}
.page-mail .m-subject{
margin-top:5px
}
.page-mail .m-subject a{
color:#777
}
.page-mail .m-date{
position:absolute;
right:15px;
top:12px;
width:80px;
text-align:right;
color:#aaa
}
.page-mail .mail-item.starred .m-star a:before{
content:"\f005";
color:#ffab00
}
.page-mail .unread .m-from,.page-mail .unread .m-subject{
font-weight:700
}
@media (min-width:992px){
.page-mail .mail-item{
padding-left:220px;
padding-right:100px
}
.page-mail .m-star{
left:40px;
top:11px
}
.page-mail .m-from{
position:absolute;
overflow:hidden;
width:140px;
left:70px
}
.page-mail .m-subject{
margin-top:0;
overflow:hidden
}
.page-mail .m-date{
width:150px
}

}
.page-mail .m-details-star{
color:#ffab00;
margin-right:12px;
position:relative;
display:block;
float:left;
top:1px
}
.page-mail .m-details-star,.page-mail .m-details-star>*{
font-size:15px
}
.page-mail .m-details-star>*{
line-height:20px
}
.page-mail .label{
position:relative;
vertical-align:middle;
top:-1px
}
.page-mail .mail-info{
padding:14px 16px;
border-bottom:1px solid #efefef
}
.page-mail .mail-info:after,.page-mail .mail-info:before{
content:" ";
display:table
}
.page-mail .mail-info:after{
clear:both
}
.page-mail .mail-info .avatar{
display:block;
width:40px;
height:40px;
border-radius:999999px;
float:left
}
.page-mail .mail-info .from{
display:block;
float:left;
margin-left:10px
}
.page-mail .mail-info .name,.page-mail .mail-info .name a{
color:#555;
font-size:14px
}
.page-mail .mail-info .email,.page-mail .mail-info .email a{
color:#aaa
}
.page-mail .mail-info .date{
display:block;
float:right;
font-size:14px;
color:#aaa;
margin-top:9px
}
.page-mail .mail-message-body{
font-size:14px;
line-height:24px;
padding:20px 16px
}
.page-mail .mail-attachments{
padding:20px 16px;
margin:20px 0;
border-top:1px solid #efefef;
border-bottom:1px solid #efefef
}
.page-mail .mail-attachments li{
list-style:none;
margin:0;
padding:10px
}
.page-mail .mail-attachments li:nth-child(2n-1){
background:#f6f6f6
}
.page-mail .message-details-reply{
margin:0 16px 50px
}
.page-mail .new-mail-form{
margin:0 0 50px;
padding:20px 16px
}
.page-faq .accordion-toggle{
color:#555
}
.page-faq .form-faq{
margin-top:18px
}
.page-profile .profile-full-name{
font-size:20px;
font-weight:300;
line-height:40px;
padding-top:15px;
padding-bottom:20px;
position:relative;
border-bottom-width:2px;
margin-bottom:0;
text-align:center
}
.page-profile .profile-content .tab-content{
background:#fff
}
.page-profile .profile-block{
margin-bottom:18px;
text-align:center
}
.page-profile .profile-photo{
padding:6px;
display:inline-block;
margin-bottom:10px;
border-radius:999999px
}
.page-profile .profile-photo img{
display:block;
max-width:100%;
border-radius:999999px
}
.page-profile .left-col>.panel .panel-heading{
padding-left:10px;
padding-right:10px
}
.page-profile .left-col>.panel .panel-body{
padding:10px;
padding-bottom:0
}
.page-profile .left-col .list-group-item{
background:none!important;
border:none;
padding-bottom:0;
margin-top:7px;
padding-left:10px;
padding-right:10px
}
.page-profile .profile-skills .label{
display:block;
float:left;
margin-right:4px;
margin-bottom:4px
}
.page-profile .profile-list-icon{
width:24px;
text-align:center;
font-size:14px
}
.page-profile .tl-entry:before,.page-profile .tl-header,.page-profile .tl-icon{
box-shadow:0 0 0 4px #fff!important
}
.page-profile .widget-followers{
margin:-20px
}
.page-profile .widget-followers .follower{
padding:13px 20px
}
.page-profile .profile-content-hr{
margin-top:30px;
margin-bottom:30px
}
@media (min-width:768px){
.page-profile .left-col{
float:left;
width:220px
}
.page-profile .right-col{
overflow:hidden;
padding-left:20px
}
.page-profile .profile-content{
margin-top:0
}
.page-profile .profile-full-name{
padding-left:240px;
padding-bottom:50px;
text-align:left
}
.page-profile .profile-row{
margin-top:-36px
}
.page-profile .profile-block{
margin-top:-70px
}
.profile-content-hr{
display:none
}

}

.select-search-options-container {
    background: #FFFFFF;
    border: 1px solid #C4C4C4;
    border-radius: 4px;
    padding: 0 5px 10px 5px;
    width: 290px;
    overflow-y: hidden;
}

.select-search-options-container > .select-options > .options-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 40vh;
    overflow-x: hidden;
    overflow-y: auto;
}

.select-search-options-container > .select-options > .options-content > .options-item {
    padding: 4px 12px;
    border: 1px solid #C4C4C4;
    border-radius: 4px;
    cursor: pointer;
    height: 28px;
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
}

.select-search-options-container > .select-options > .options-content > .options-item > .option-title {
    font-weight: 400;
    font-size: 13px;
    color: #000000;
    text-transform: none;
    width: fit-content;
    white-space: nowrap;
}

.select-search-options-container > .select-options > .options-content > .options-item.selected {
    border-color: #2343B1;
}

.select-search-options-container > .select-options > .options-content > .options-item.selected > .option-title,
.select-search-options-container > .select-options > .options-content > .options-item.selected > .option-name
{
    color: #2343B1;
}

.select-search-options-container > .select-options > .options-content > .options-item > .option-name {
    font-weight: 400;
    font-size: 13px;
    color: #C4C4C4;
    text-transform: none;
    white-space: nowrap;
}