/*Write your custom css in this file.*/

.general-form .form-control {
    /*border-radius: 4px;*/
    /*border-color: initial;*/
    /*background-color: #fff;*/
    /*box-shadow: none;*/
    /*transition: background 0.5s;*/
}


#sortable tr td.rank:hover {
    cursor: move;
}

#sortable-table {
    width: 100%;
    color: #444;
}
.event{
    font-size: 10px!important;
    margin-top: -5px!important;
    margin-left: 0px!important;
}
.head-no{

}

.head-item {
    text-align: center;
    /* width: 45%; */
    width: 430px!important;
    border-right: 1px solid #eee;
}
.invoice_item_title{
    width: 410px!important;
}
.estimate_item_title{
    width: 410px!important;
}
.head-quantity {
    text-align: center;
    width: 8%;
    border-right: 1px solid #eee;
}

.head-unit-type {
    text-align: center;
    width: 7%;
    border-right: 1px solid #eee;
}

.head-rate {
    text-align: center;
    width: 15%;
    border-right: 1px solid #eee;
}

.head-total {
    text-align: center;
    width: 15%;
}
.head-delete {
    text-align: center;
    width: 60px;
}
.invoice_quantity{
    text-align: right;
}
.estimate_quantity {
    text-align: right;
}
.body-item {
    width: 45%;
    border: 1px solid #fff;
    padding: 10px;
}
#estimate_item_dropdown_icon{
    color: #B3B3B3;
    float: right;
    padding: 5px 15px!important;
    margin-top: -35px;
    font-size: 18px;
}

#invoice_item_dropdown_icon {
    color: #B3B3B3;
    float: right;
    padding: 5px 10px;
    margin-top: -35px;
    font-size: 18px;
}

.body-quantity {
    text-align: center;
    width: 10%;
    border: 1px solid #fff;
}

.body-unit-type {
    text-align: center;
    width: 10%;
    border: 1px solid #fff;
}

.body-rate {
    text-align: right;
    width: 350px;
    border: 1px solid #fff;
}
.rank{
    padding-top: 16px!important;
    text-align: center;
}
::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.1);
}
.fc-time-grid-container{
    height: 100%!important;

}
.body-total {
    text-align: right;
    width: 150px!important;
    height: 66px!important;
    padding-top: 15px!important;
    border: 1px solid #fff;
}


.panel-pink-purple {
    background-color: #ff4961;
}

.widget-arrival {
    float: left;
    padding-top: 10px;
    padding-left: 30px;
    font-size: 80px;
    min-height: 80px;
    line-height: 35px;
}

.widget-count {
    text-align: right;
    position: absolute;
    right: 25px;
    padding-top: 10px;
    padding-right: 25px;
}

.count_new_estimates {
    display: inline-block;
    float: right;
    background-color: #1e9ff2;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    color: #fff;
}

.count_new_invoices {
    display: inline-block;
    float: right;
    background-color: #1e9ff2;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    color: #fff;
}

.flexible-container {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between; /* 横方向中央揃え（Safari用） */
    justify-content: space-between; /* 横方向中央揃え */
    -webkit-flex-wrap: wrap; /* 折り返し（Safari用） */
    flex-wrap: wrap; /* 折り返し */
}
.list-group-messages
{
    margin-bottom: 0px;
}

ul.flexible-container {
    padding-inline-start: 0;
}

/******** renewal_design start ********/
/* ================================== */
/* common
/* ================================== */
body,
#page-content {
    /*background-color: #f4f5fa;*/
}

html body a,
html body a:focus,
html body a:active {
    color: #1e9ff2;
}

html body a:hover {
    color: #0c84d1;;
}

.app-loader .loading,
.circle-loader,
.table-loader .loading {
    border: solid 2px #1e9ff2;
    border-top-color: #fff;
}

.circle-done {
    color: #1e9ff2;
}

/* ================================== */
/* table
/* ================================== */
td.option a.edit,
td.child ul.dtr-details a.edit {
    background: #1e9ff2;
    color: #fff;
}

td.option a.delete,
td.child ul.dtr-details a.delete {
    background: #ff4961;
    color: #fff;
}

td.option a.mark_as_open {
    background: #1e9ff2;
    color: #fff;
}

td.option a.mark_as_closed {
    background: #ff9149;
    color: #fff;
}

td.option a.assign_to_me {
    background: #777;
    color: #fff;
}

th.ui-state-default {
    background: #fff;
}

.paging_simple_numbers .ui-button {
    background: #fff;
    color: #1e9ff2;
    border: 1px solid #babfc7 !important;
    padding: .4em 1em !important;
    margin: 0 !important;
}

.paging_simple_numbers .ui-button:hover {
    color: #1e9ff2;
}

.paging_simple_numbers .ui-button.previous.ui-state-disabled,
.paging_simple_numbers .ui-button.next.ui-state-disabled {
    color: #6b6f82;
    pointer-events: none;
    cursor: auto;
    background-color: #fff;
    border-color: #626e82;
}

.paging_simple_numbers span .ui-button.ui-state-disabled {
    z-index: 1;
    color: #fff;
    background-color: #1e9ff2;
    border-color: #1e9ff2;
    opacity: 1;
}

.dataTables_wrapper .dataTables_paginate .fg-button:first-child,
.dataTables_wrapper .dataTables_paginate .fg-button:last-child {
    border-radius: 0;
}

/* no-border */
table.only-row-border th.ui-state-default {
    background: #fff;
    border-bottom: none !important;
}

table.only-row-border.display tbody td {
    border: none;
    border-bottom: 1px solid #f2f2f2;
}

table.only-row-border thead th {
    border: none;
    border-top: 1px solid #f2f2f2;
}

.dataTable tbody tr.active td,
.dataTable tbody tr.active:hover td {
    background: #28d094 !important;
}

.content-wrapper {
    padding: 0 2rem 0;
}

.breadcrumb {
    background-color: transparent;
    margin-bottom: 0;
    padding: 10px 20px 10px 20px;
}

/* ================================== */
/* sidebar / header (PC)
/* ================================== */
@media only screen and (min-width: 768px) {
    .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
        color: #ffffff;
        background-color: transparent;
    }

    #page-content {
        padding-bottom: 50px;
        margin-bottom: 50px;
    }

    .navbar-nav {
         margin: 0px -15px;
    }


    #navbar {
        flex: 1;
        background-color: #ffffff;
        box-shadow: 0 2px 18px 1px rgba(49, 53, 72, .1);
        border-radius: .45rem;
        border: 1px solid rgba(0, 0, 0, .06);
    }

    .navbar-default {
        box-shadow: unset;
        background-color: transparent;
    }

    .navbar-wrapper {
        flex: 1;
        padding: 5px 20px;
        background-color: transparent;
    }

    .br-sp {
        display: none;
    }
    .breadcrumb {
        padding: 20px 20px 10px 20px;
    }

    .box-content {
        padding-top: 10px;
    }

    #sidebar {
        /*background-color: #fff;*/
        /*color: #6b6f82;*/
        box-shadow: 10px 15px 30px 1px rgba(0, 0, 0, .1);
        width: 260px;
        padding-top: 20px;
        font-size: 1.15rem;
    }

    #sidebar ul#sidebar-menu li {
        line-height: 1.8;
    }

    #sidebar ul#sidebar-menu li a {
        padding: 12px 30px 12px 18px;
        /*background-color: #fff;*/
        transition: all .2s ease;
    }

    #sidebar ul#sidebar-menu li.active a {
        /*background-color: #fff;*/
        /*color: #6b6f82;*/
        border-left: none;
        /*border-right: 4px solid #1e9ff2;*/
    }

    #sidebar ul#sidebar-menu li:hover a {
        /*color: #85899b;*/
        padding-left: 24px;
    }

    #sidebar ul#sidebar-menu li:hover,
    #sidebar ul#sidebar-menu li a:hover {
        /*background-color: #fff;*/
    }

    #sidebar-menu .devider {
        /*border-bottom: 1px solid rgba(221, 230, 233, 0.48);*/
    }

    .mCSB_dragger {
        height: auto !important;
    }

    /*nav {*/
    /*    background-color: #1e9ff2 !important;*/
    /*    color:#fff;*/
    /*    min-height: 5rem;*/
    /*    box-shadow: 0 2px 30px 2px rgba(0, 0, 0, .1) !important;*/
    /*}*/

    nav .navbar-header {
        width: 260px;
        color:#fff;
        background-color: #fff;
        height: 67px;
        padding: 0 .85rem 0 1.2rem;

        border-right: 1px solid #f2f4f6;
        border-right-width: 1px;
        border-right-style: solid;
        border-right-color: rgb(242, 244, 246);

        display: flex;
        align-items: center;
        justify-content: center;
    }

    nav .navbar-header .navbar-brand {
        padding: 0;
        width: auto;
        margin-right: 0;
    }

    nav .navbar-nav li {
        margin-top: 4px;
    }

    /*nav .navbar-nav li*/
    /*!* nav .navbar-nav li > a *! {*/
    /*    color: #fff !important;*/
    /*}*/

    /*nav .navbar-nav li span,*/
    .navbar-right i,
    #fa-envelope-o,
    #fa-check-square-o
        /*nav .navbar-nav li > a,*/
    /*nav .navbar-nav li > a > i */
    {
        font-size: 20px;
        background-color: transparent !important;
    }

    nav .navbar-nav li.dropdown-user {
        font-weight: 700;
    }

    nav .navbar-nav li.dropdown-user a {
        font-size: 16px;
    }

    /*nav .navbar-nav li.dropdown-user.open > a,*/
    /*.navbar-nav > .open > a,*/
    /*.navbar-nav > .open > a:hover,*/
    /*.navbar-nav > .open > a:focus {*/
    /*    background-color: #1e9ff2 !important;*/
    /*}*/

    /*nav .navbar-nav .dropdown-menu,*/
    /*nav .navbar-nav .dropdown-menu a {*/
    /*    color: #6b6f82 !important;*/
    /*}*/

    /*nav .navbar-nav li.dropdown-user.open .dropdown-menu li a {*/
    /*    background-color: #fff;*/
    /*}*/

    /*.nav-tabs > li:not(.title-tab):after {*/
    /*    background-color: #1e9ff2;*/
    /*}*/

    /*.nav-tabs > li > a:hover {*/
    /*    color: #1e9ff2;*/
    /*}*/

    /*.nav-tabs > li.active > a,*/
    /*.nav-tabs > li.active > a:active,*/
    /*.nav-tabs > li.active > a:hover,*/
    /*.nav-tabs > li.active > a:focus {*/
    /*    color: #1e9ff2;*/
    /*    border-bottom: 2px solid #1e9ff2;*/
    /*}*/

    .nav-tabs-modern > li:not(.title-tab):after {
        /*   */
    }

    .nav-tabs-modern > li > a:hover {
        color: #1e9ff2;
    }

    .nav-tabs-modern > li.active > a,
    .nav-tabs-modern > li.active > a:active,
    .nav-tabs-modern > li.active > a:hover,
    .nav-tabs-modern > li.active > a:focus {
        color: #1e9ff2;
        background: transparent;
        border-top:2px solid #1e9ff2;
        border-bottom: 1px solid  #fff;
        border-right:1px solid #babfc7;
        border-left:1px solid #babfc7;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
       /*  border-bottom: 2px solid #1e9ff2; */
    }

    .nav-tabs-projects-edit-modern > li > a:hover {
        color: #1e9ff2;
    }

    .nav-tabs-projects-edit-modern > li.active > a,
    .nav-tabs-projects-edit-modern > li.active > a:active,
    .nav-tabs-projects-edit-modern > li.active > a:hover,
    .nav-tabs-projects-edit-modern > li.active > a:focus {
        color: #1e9ff2;
        background: transparent;
        border-top:2px solid #1e9ff2;
        border-bottom: 1px solid #f5f5f5;
        border-right:1px solid #babfc7;
        border-left:1px solid #babfc7;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
       /*  border-bottom: 2px solid #1e9ff2; */
    }

    .timeline-right {
        width: 80%;
    }

    .content-wrapper {
        padding: 1.6rem 2rem 1rem;
    }
}

/* ================================== */
/* panel
/* ================================== */
.panel {
     /* box-shadow: 0 2px 18px 1px rgba(49, 53, 72, .1); */
     border-radius: .45rem;
     /* border: 1px solid rgba(0, 0, 0, .06);  */
}

.panel .post-dropzone,
.panel .nav-tabs {
    border-radius: .45rem;
    border: 1px solid #fff;
}

.panel.border-white,
.panel .panel-heading,
.panel .page-title,
.panel .box {
    border-radius: .45rem;
    border: 1px solid #fff;
}

.panel .table-responsive {
    padding-bottom: none !important;
}

.panel .table-responsive tr:last-child td {
    border-bottom: none !important;
}

.panel-info {
    background: #fff;
    color: #00bfff !important;
}

.panel-info .btn {
    background: #1e9ff2;
    color: #fff !important;
}

.panel-info a {
    color: #1e9ff2 !important;
}

.panel-warning {
    background: #fff;
    color: #ff9149 !important;
}

.panel-warning .btn {
    background: #ff9149;
    color: #fff;
}

.panel-warning a {
    color: #ff9149 !important;
}

.panel-success {
    background: #fff;
    color: #28d094 !important;
}

.panel-success .btn {
    background: #28d094;
    color: #fff;
}

.panel-success a {
    color: #28d094 !important;
}

.panel-danger {
    background: #fff;
    color: #ff4961 !important;
}

.panel-danger .btn {
    background: #ff4961;
    color: #fff;
}

.panel-danger a {
    color: #ff4961 !important;
}

.panel-invoice {
    background: #fff;
    color: #28d094 !important;
}

.panel-invoice .btn {
    background: #28d094;
    color: #fff;
}

.panel-invoice a {
    color: #28d094 !important;
}

.panel-estimate {
    background: #fff;
    color: #ff4961 !important;
}

.panel-estimate .btn {
    background: #ff4961;
    color: #fff;
}

.panel-estimate a {
    color: #ff4961 !important;
}

/* ================================== */
/* modal
/* ================================== */
.modal-content {
    box-shadow: 0 2px 18px 1px rgba(49, 53, 72, .1);
    border-radius: .45rem;
    border: 1px solid rgba(0, 0, 0, .06);
}

#ajaxModalContent {
    border-radius: .45rem;
}

/* ================================== */
/* button
/* ================================== */
.btn,
.dt-button {
    border-radius: 1.5rem;
}

.btn-primary {
    background-color: #666ee8;
}

.btn-primary:hover {
    border-color: #1e9ff2;;
    background-color: #1e9ff2;;
}

.btn-primary:focus,
.btn-primary:active {
    border-color: #232fde !important;
    background-color: #232fde !important;
}

.btn-info {
    background-color: #1e9ff2;
}

.btn-danger {
    border-color: #ff4961;
    background-color: #ff4961;
}

.btn-success {
    border-color: #28d094;
    background-color: #28d094;
}

a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    background-color: #1e9ff2;
    border: 1px solid #1e9ff2;
}

/* ================================== */
/* label / text / bar / bg
/* ================================== */
.label-info {
    background: #1e9ff2;
}

.label-warning {
    background: #ff9149;
}

.label-success {
    background: #28d094;
}

.label-danger {
    background: #ff4961;
}

.label-primary {
    background: #666ee8;
}

.has-error .help-block,
.text-danger {
    color: #ff4961;
}

.has-error .form-control {
    border-color: #ff4961;
}

ins {
    color: #1e9ff2;
}

.dashboard-changes ins {
    color: #4e5e6a;
    font-weight: bold;
}

.progress-bar {
    background: #1e9ff2;
}

.bg-success {
    background: #28d094;
}

/* ================================== */
/* parts
/* ================================== */
/*#content {*/
/*    margin-top: 65px;*/
/*}*/

#sidebar-menu .badge {
    background: #1e9ff2;
}

.sticky-note {
    background: rgb(246, 255, 203);
    font-size: 100%;
    color: #4e5e6a;
}

.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
    background: #1e9ff2;
}

.select2-results .select2-highlighted {
    background: #1e9ff2;
}

.datepicker table tr td.active.active {
    background: #1e9ff2;
    border-color: #1e9ff2;
}

.pull-up {
    transition: all .25s ease;
}

/* .pull-up:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 14px 24px rgba(62, 57, 107, .2);
    z-index: 30;
} */

.pull-up .widget-details {
    position: relative;
    right: 0;
    padding-right: 0;
}

/* estimate */
.estimate-card {
    text-align: center;
    padding: 8px 0 7px;
    height: auto;
    text-transform: uppercase;
    font-size: 24px;
    line-height: 32px;
    color: #28d094;
    background-color: #e7f3d2;
}

.estimate-card.draft {
    color: #8394a1;
    background-color: #e6eaec;
}

/** estimate and invoice pdf start **/
/**
 * ※ PDF出力はCSSを読み込まないので、下記ファイルにも同様の内容を記載
 *   application/views/estimates/estimate_pdf.php
 *   application/views/invoices/invoice_pdf.php
 */
table.estimate-items,
table.invoice-items {
    color: #6b6f82 !important;
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

table.estimate-items .form-group,
table.invoice-items .form-group {
    margin-bottom: 0;
}

table.estimate-items tr td,
table.estimate-items tr th,
table.invoice-items tr td,
table.invoice-items tr th {
    border: none;
    border-top: 1px solid #e3ebf3;
    border-bottom: 1px solid #e3ebf3;
    padding: 5px;
    line-height: 20px !important;
}

table.estimate-items tr th,
table.invoice-items tr th {
    font-weight: 400;
}

table.estimate-items tr .item,
table.invoice-items tr .item {
    width: 45%;
}

table.estimate-items tr .description,
table.invoice-items tr .description {
    color: #888;
    font-size: 90%;
}

table.estimate-items tr .quantity,
table.estimate-items tr .unit_type,
table.invoice-items tr .quantity,
table.invoice-items tr .unit_type {
    text-align: center;
    width: 10%;
}

table.estimate-items tr .rate,
table.estimate-items tr .total,
table.invoice-items tr .rate,
table.invoice-items tr .total {
    text-align: right;
    width: 18%;
}

table.estimate-items tr.header .total,
table.invoice-items tr.header .total {
    width: 20%;
}

.price-area {
    color: #6b6f82;
    width: 100%;
}

.price-area table {
    width: 100%;
    margin-top: 10px !important;
}

.price-area table td,
.price-area table th {
    padding: 10px;
    line-height: 20px !important;
}

.price-area table .left-space {
    width: 60%;
}

.price-area table .title {
    font-size: 17px;
}

.price-area table .price-row td.first {
    width: 20%;
}

.price-area table .price-row td {
    border-top: 1px solid #626e82;
    border-bottom: 1px solid #e3ebf3;
}

.price-area table .price-row td.value {
    text-align: right;
}

.pdf-note-box {
    border: 2px solid #f2f2f2;
    color: #444;
    padding: 10px;
}

/** estimate and invoice pdf end **/

/** chat start **/
.timeline-left {
    position: absolute;
    height: calc(100vh - 8.4rem);
    z-index: 1;
    width: 21% !important;
    display:none;
}

#timeline > .post-content:first-child {
    padding-top: 10px !important;
}

.timeline-widget {
    height: calc(100vh - 14.2rem);
    padding: 1.4rem;
    overflow-y: auto;
}

.timeline-widget #timeline .post-content .media {
    border: 1px solid #fff;
    border-radius: .45rem;
}


.message-footer {
    border-top: 1px solid #EEE;
    /* padding: 1rem 3px; */
    background-color: #fff !important;
}

.message-footer .d-flex {
    display: flex;
    align-items: center;
}

.message-footer .image-preview {
    width: 100%;
    margin: 0 auto;
    position: fixed;
    bottom: 8rem;
    background: rgba(98, 110, 130, 0.5);
}

.message-footer form #post-dropzone {
    margin-left: 10px;
    background: #fff !important;
}

.message-footer form #post-dropzone #post_description {
    width: 75%;
    border: 1px solid #cacfe7;
    color: #3b4781;
    margin-left: 10px;
    resize: none;
    height: auto;
}

.message-footer form #post-dropzone #post_description-error {
    position: relative;
    padding-left: 2px;
    font-size: 12px;
}

.message-footer form .submit-button {
    margin-left: 15px;
    cursor: pointer;
}

.estimates_hiddened {
    width:0px;
    height:0px;
    margin: 0px;
    padding: 0px;
    color:  #fff;
    visibility: hidden;
    display: none;

}



@media only screen and (max-width: 1480px) {
.estimates {
    position: absolute;
    background-color: #fff;
    left: 120px;
    top: -48px;
}

}

@media screen and (max-width: 1400px) {
    #timeline .post-content:nth-child(even) {
        float: right;
        clear: right;
        padding-left: 0px;
        padding-right: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .label_client_first_last{
        display:none;
    }
    .form-group-clients{
        margin-bottom:0px;
    }
    .client_first_name{
        margin-right: 27px!important;
    }
    .client_last_name{
        margin-right: 13px!important;
    }
    .client_model_form{
        margin-right: 25px!important;
    }
     .client_show_hide_password{
        width: 16%;
       /*  margin-left: 80%;
        position: absolute; */
    }
    .login_group{
        display: flex;
    }
    .nav {
        padding-bottom: 5px;
    }

    nav .navbar-header {
        flex: 1;
    }

    .sm-ds {
        display: none;
    }

    .navbar-brand {
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        margin-top: 3px;
        margin-bottom: auto;
        left: 0;
        right: 0;
        text-align: center;
    }

    #sidebar-toggle {
        /* color: #1d2632; */
       float:left;
       margin-left: 10px;
    }
    .datatable-tools .dataTables_length {
        /*width: 35%;*/
        /*float: left;*/
        text-align: right;
        display: inline-block;
    }

    .datatable-tools .DTTT_container {
        text-align: left;
        display: inline-block;
        margin-right: 0 !important;
    }

    .col-md-9.custom-toolbar {
        text-align: center;
    }

    .col-md-3.toolbar-left-top {
        text-align: center;
    }

    .timeline-widget {
        height: calc(100vh - 18rem);
    }

    .message-footer {
        padding: 1rem 0;
        padding-bottom: 0px;
    }

    .message-footer form #post-dropzone #post_description {
        width: 80%;
        margin: 0 auto;
       /*  height: 80px; */
    }

    .message-footer .image-preview {
        bottom: 11rem;
    }

    .message-footer form #post-dropzone #post_description-error {

    }

    .timeline-right #timeline-content {
        overflow-x: hidden;
    }
}

/** chat end **/

/** calender start **/
.fc-event {
    border-radius: 3px !important;
}

.fc-event span {
    font-size: 11px;
    font-weight: bold;
}

.fc-content {
    padding: 3px;
}

.fc-left button {
    color: #666ee8;
    border-color: #666ee8 !important;
    padding: 10px !important;
    border-radius: 4px !important;
    text-shadow: none !important;
}

.fc-left button.fc-prev-button {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.fc-left button.fc-next-button {
    margin-left: -1px;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.fc-left button.fc-state-disabled {
    color: #666ee8;
    background-color: transparent !important;
    opacity: .65;
    border-color: #2C3E50 !important;
}

.fc-left button:hover {
    color: #fff;
    background-color: #666ee8 !important;
}

.fc-left button.fc-state-disabled:hover {
    background-color: transparent !important;
    border-color: #666ee8 !important;
    color: #666ee8;
}

.fc table {
    font-size: 1.1em !important;
}

/** calender end **/

/** message start **/
.message-button-list .send-message-btn {
    position: relative;
    display: block;
    padding: 10px 15px;
    text-align: center;
    margin: 10px auto;
    border-color: #ff4961 !important;
    background-color: #ff4961 !important;
    color: #FFF !important;
    box-shadow: 0 1px 10px 1px rgba(255, 73, 97, .6);
    font-weight: 500;
    border-radius: .25rem !important;
}

.message-button-list .list-group-messages {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-top: 30px;
    margin-bottom: 0;
}

.message-button-list .list-group-messages a {
    padding: .8rem 1rem;
    font-weight: 500;
    background-color: transparent;
    border-radius: .25rem;
    border: none;
    box-shadow: none;
    color: #6b6f82;
}

.message-button-list .list-group-messages a:hover {
    color: #0c84d1;
}

.message-button-list .list-group-messages a.active {
    background-color: #666ee8;
    color: #fff;
}

#message-table tr td:not(.unread-row) {
    background: #f4f5fa !important;
}

#message-table tr.active td {
    background: #28d094 !important;
}

.message-row.unread {
    border: none;
}

.message-row.unread strong,
.message-row.unread span {
    color: #0c84d1;
}

/** message end **/

/** setting start **/
#email-template-table,
#role-table {
    width: 95%;
}

#email-template-table td,
#role-table td {
    border-left: none;
    border-right: none;
}

#role-list-box {
    padding-bottom: 10px;
}

#task-status-table {
    border-bottom: none;
}

/** setting end **/
@media (max-width: 480px) {
    .navbar-brand {
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        text-align: center;
    }
    .sm-ds {
        display: none;
    }
    .company-name {
        font-size: 18px !important;
    }
    .list-group-messages {
        width: 50%;
        margin-top: 10px !important;
    }
    .br-sp {
        display: block;
    }
    .centering {
        display: inline-block;
        width: 100%;
        text-align: center;
    }
    .save-profile {
        text-align: center;
    }
    .datatable-tools {
        text-align: center;
    }
    .custom-toolbar {
        text-align: center;
    }
    .dataTables_filter{
        float: none !important;
    }
    .flex-left {
        display: flex;
        flex-direction: column;
        float: left !important;
    }
    .navbar-nav .todo-top-icon a {
        padding-left: 0;
    }

    .init-chat-icon {
        right: 5px;
    }

    .message-footer #post-form-container {
        margin-left: -10px;
    }

    .message-footer form #post-dropzone #post_description {
        width: 80%;
        margin: 0 auto;
        /* height: 80px; */
    }

    .datatable-tools .dataTables_length {
        /*width: 35%;*/
        /*float: left;*/
        text-align: right;
    }

    .datatable-tools .DTTT_container {
        text-align: left;
        display: inline-block;
        margin-right: 0;
        margin-left: 10px;
        margin-top: 5px;
    }

    #date-picker {
        display: block;
        text-align: center;
    }

    .message-button-list .send-message-btn {
        /* #613 ボタン色調整 */
        /* background-color: #666ee8 !important; */
        border-radius: 1.5rem !important;
        color: #fff !important;
        box-shadow: none;
        width: 50%;
        padding: 15px;
        border: none;
    }

    .modal-content button[type=submit] {
        /* margin-top: 10px; */
        margin-right: 10px;
    }

    .nav-tabs:not(.display-tab) li a {
        background: #1e9ff2 !important;
        color: #fff !important;
        border-bottom: none !important;
        border-radius: 1.5rem !important;
        padding: 5px 7px !important;
        margin: 3px !important;
    }
    .nav-tabs-modern:not(.display-tab) li a {
        background: #009688 !important;
        color: #fff !important;
        border-bottom: none !important;
        border-radius: 1.5rem !important;
        padding: 5px 7px !important;
        margin: 3px !important;
    }
    .nav-tabs-modern > li.active > a,
    .nav-tabs-modern > li.active > a:hover,
    .nav-tabs-modern > li.active > a:focus {
        color: #555;
        cursor: default;
        background-color: #fff;
        border: 1px solid #ddd;
        border-bottom-color: transparent;
    }
    .nav-tabs-modern:not(.display-tab) li.active {
        /*
        opacity: 0.6;
        */
    }

    .nav-tabs-modern li:not(.title-tab) {
        padding-top: 11px;
    }

    /* .nav-tabs-projects-edit-modern:not(.display-tab) li a {
        background: #009688 !important;
        color: #fff !important;
        border-bottom: none !important;
        border-radius: 1.5rem !important;
        padding: 5px 7px !important;
        margin: 3px !important;
    } */
    .nav-tabs-projects-edit-modern > li.active > a,
    .nav-tabs-projects-edit-modern > li.active > a:hover,
    .nav-tabs-projects-edit-modern > li.active > a:focus {
        color: #555;
        cursor: default;
        background-color: #fff;
        border: 1px solid #ddd;
        border-bottom-color: transparent;
    }
    .nav-tabs-projects-edit-modern:not(.display-tab) li.active {
        z-index: 400;
        opacity: 1.0;
    }
    .nav-tabs-projects-edit-modern:not(.display-tab) li ul li.active a  {
        z-index: 400;
        opacity: 0.6;
    }

    .nav-tabs-projects-edit-modern li:not(.title-tab) {
        padding-top: 11px;
        opacity: 1.0;
    }

    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        color: #555;
        cursor: default;
        background-color: #fff;
        border: 1px solid #ddd;
        border-bottom-color: transparent;
    }

    .nav-tabs:not(.display-tab) li.active {
        opacity: 0.6;
    }

    .nav-tabs li:not(.title-tab) {
        padding-top: 11px;
    }

    .title-tab {
        display: contents !important;
    }

    #project-gantt-section .select2-container {
        margin-left: 0 !important;
    }

    #customer_feedback-comment-form-container footer button,
    #project-comment-form-container footer button {
        width: 100%;
        margin: 5px auto;
    }

    .current-update-item {
        width: 100%;
    }

    .invoice-preview-contents {
        width: 900px;
        position: relative;
        top: 10px;
    }

    #estimate-form-preview button {
        width: 100%;
        margin: 5px auto;
    }

    .profile-image {
        width: 100%;
    }

    .profile-image + .box-content {
        display: table-footer-group;
        text-align: center;
        font-size: 18px;
    }

    .setting-menu-toggle-btn {
        float: right;
        position: relative;
        bottom: 5px;
    }

    .comment-image-box {
        width: 90%;
    }

    .custom-toolbar {
        padding-right: 10px;
        padding-left: 10px;
    }

    .app-loader {
        right: 40% !important;
    }

    .fc table {
        font-size: 1.0em !important;
    }

    .form-size {
        width: 65%;
    }
}

#navbar > ul.nav.navbar-nav.navbar-left.pl15 {
    display: inline-block;
}

.comment-form-container{
    padding: 15px;
}

.flexiblebox {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    align-items: center; /* 縦方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    justify-content: center; /* 横方向中央揃え */
}
.balloon {
    display: none;
    width: 110px;
    position: absolute;
    left: 180px;
    padding: 16px;
    border-radius: 5px;
    background: #1e9ff2;
    color: #fff;
    font-weight: bold;
    z-index: 10;
}
.balloon:after {
    border-right: 10px solid #1e9ff2;  /* 吹き出し口の幅・色 */
    border-top: 10px solid transparent;     /* 吹き出し口の高さ１／２ */
    border-bottom: 10px solid transparent;  /* 吹き出し口の高さ１／２ */
    left: -10px;                            /* 吹き出し口の位置調整 */
    /*top: 20%;                                !* 吹き出し口の縦位置 *!*/
    position: absolute;
    pointer-events: none;
    content: " ";
}
.dataTable > thead > tr > th > div {
    text-align: center !important;
}

#sidebar-toggle-md {
    padding-bottom: 0;
    /*padding: 15px 0 0 0;*/
}

.todo-top-icon {
    font-size: inherit;
}

#navbar > ul.nav.navbar-nav.navbar-left.pl15 > li {
    text-align: center;
}

.custom-toolbar {
    /* display: inline-block; */
    text-align: center;
    width: auto;
}

.toolbar-left-top {
    width: auto;
}

#sidebar-menu .la {
    font-size: 20px !important;
    margin-left: -2px;
}

#navbar .la {
    font-size: 24px;
    margin-top: -1px;
}

#page-content .panel-body .la {
    font-size: 70px;
    /*margin-top: -5px;*/
    margin-left: -7px;
}

#page-content .panel-body .widget-icon {
    font-size: 60px;
    /*min-height: auto;*/
}

.filter .btn-default.active:hover{
    background: #dcdcdc;
}

.btn.active,
.btn.active:focus{
    background: #dcdcdc;
}

.dropdown-menu .list-group-item {
    font-size: 13px;
}

#sidebar-scroll {
    padding-bottom: 50px;
}

.panel-purple{
    background-color:rgb(112, 18, 189);
    color: #fff;
}
.panel-pink-purple{
    background-color:rgb(209, 35, 209);
    color: #fff;
}

#inDummy {
    width      : 200px;
    font-size  : 12pt;
    padding    : 3px 5px;
    ime-mode   : disabled;
}
#inPass{
    display    : none;
}
#errMsg {
    width      : 250px;
    margin     : 5px auto;
    background : #fff;
    border     : 2px solid red;
    color      : red;
    font-size  : 10pt;
}

.status-selected {
    background-color: #1e9ff2 !important;
    color: white !important;
}

html, body {
    background-color: #f4f5fa;
}

.transparent {
    background-color: transparent;
}

.nav-tabs {
    background-color: transparent;
}
.user-language-option {
    display: none !important;
}
.notifications {
    display:block; ;
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

#delete_event {
    order: 0;
    margin-top: 10px;
}
#confirm_event {
    order: 1;
    margin-top: 10px;
}
#reject_event {
    order: 2;
    margin-top: 10px;
}
#edit_event {
    order: 3;
    margin-top: 10px;
}
#close_event {
    order: 4;
    margin-top: 10px;
}


.company-name {
    font-size: 20px;
}
/* ガントの線を点線にする仕様 */
.gantt .arrow {
    fill: none;
    stroke: #666;
    stroke-width: 0.9 !important;
}

.gantt .bar-wrapper.no-drag.active .bar {
    fill: #b8c2cc !important
}

.gantt-container .gantt-task-popup {
    min-width: 180px;
    padding: 10px;
    font-size: 13px;
}


.gantt .bar-wrapper.no-drag.active .bar {
    fill: #b8c2cc !important
}

.gantt-container .gantt-task-popup {
    min-width: 180px;
    padding: 10px;
    font-size: 13px;
}

.gantt-container .popup-wrapper {
    box-shadow: -3px 7px 15px rgba(0, 0, 0, 0.1) !important
}

.gantt .handle {
    fill: #f1f1f1 !important
}

.gantt .today-highlight {
    fill: #f9e6c5 !important
}

.gantt-status-filter .mr15, .gantt-status-filter .DTTT_container, .gantt-status-filter .btn {
    margin: 0 !important
}

.gantt-status-filter .DTTT_container {
    float: none !important
}

.gantt .weekends-highlight {
    opacity: .5;
    fill: #fbddd8 !important
}

.gantt .bar, .gantt .handle, .gantt .path-line {
    transition: .2s !important
}


.invoice-meta {
    word-wrap: break-word;
}

.color-tag {
    border: 1px solid #4e5e6a;
}

@media only screen and (min-width: 768px) {
    .client_last_name{
        margin-right: 0px!important;
        padding-left: 20px!important;
        padding-right: 0px!important;
    }
    .label_client_first_name{
        display:none;
    }
    .label_client_last_name{
        display:none;

    }
    .label_client_first_last{
        width: 16%;
    }
    .client_first_name{
        padding-left: 50px!important;
        /* padding-right: 0px!important; */
        width: 42%;
    }
    .navbar-default .navbar-nav > li > a {
        color: #ffffff;
    }

    .navbar-default .navbar-nav > li > a:hover {
        color: #ffffff;
    }

    .navbar-header {
        box-shadow: 0 2px 30px 2px rgba(0, 0, 0, .1) !important;
    }

    #navbar {
        /*background-color: #1d2632;*/
        background-color: #1e9ff2;
        height: 60px !important;
    }

    #default-navbar {
        display: flex;
    }

    #sidebar-toggle-md {
        color: #ffffff;
    }
}

table.dataTable thead th {
    position: relative;
    background-image: none !important;
}

table.dataTable thead .sorting:before, table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before, table.dataTable thead .sorting_desc_disabled:after {
    position: absolute;
    display: block;
    opacity: 0.3;
    top: 50%;
    margin-top: -10px;
}

table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
    right: 0.4em;
    content: "\2191";
}

table.dataTable thead .sorting_asc:before {
    right: 0.4em;
    content: "\2191";
    opacity: 1;
}

table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    right: -0.1em;
    content: "\2193";
}

table.dataTable thead .sorting_desc:after {
    right: -0.1em;
    content: "\2193";
    opacity: 1;
}

.page-title {
    display: flex;
    align-items: center;
}

.page-title .btn {
    margin: 5px 5px;
}

.page-head {
    display: block;
}

#sidebar,
.btn-primary,
.nav-tabs > li:not(.title-tab):after,
#timeline .post-content .post-date span {
    background: #ffffff;
    color: #000000;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:active,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #000000;
    border-color: #000000;
}

.nav-tabs > li > a:hover {
    color: #000000;
}

.dataTable tbody tr.active td,
.dataTable tbody tr.active:hover td {
    background: #1e9ff2 !important;
    color: #000000;
}

.select2-results .select2-highlighted {
    background-color: #1e9ff2;
    color: #fff;
}

.datepicker table tr td.active.active,
.datepicker table tr td.active.active:hover,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:hover.active,
.datepicker table tr td span.active.active:hover,
.datepicker table tr td span.active:hover.active:hover,
.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
    background: #1e9ff2;
    border-color: #1e9ff2;
}


.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
#sidebar-menu li ul > li > a,
#sidebar-menu li:hover,
#sidebar-menu > li.active > a,
#sidebar-menu li a:hover {
    background: #ffffff;
    color: #6b6f82;
}

#sidebar-menu .devider {
    border-color: #000000;
    color: #000000;
}

a {
    color: #ffffff;
}

.bg-success {
    background: #ffffff;
    color: #000000;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
    background-color: transparent;
}


#sidebar-menu li a,
#sidebar-menu li.expand > a:before {
    color: #7988a2;
}

#sidebar-menu > li.active > a {
    border-color: #6b6f82;
}

#sidebar-menu > li > ul > li > a:hover {
    background: #ffffff;
    color: #6b6f82;
}


a:hover,
a:focus,
a:active {
    color: #ffffff;
}

.bg-dark-success {
    background: #ffffff;
    color: #000000;
}

.atwho-view .cur {
    background-color: #ffffff;
    color: #000000;
}

.btn-primary {
    border: 1px solid #f2f4f6 !important;
}

.btn-sign {
    background: #1e9ff2;
    color: #ffffff;
}

.btn-primary:focus,
.btn-primary:active {
    color: #000000 !important;
    border-color: #000000 !important;
    background-color: #ffffff !important;
}

@media only screen and (min-width: 768px) {
    .navbar-default .navbar-nav > li > a {
        color: #ffffff;
    }

    .navbar-default .navbar-nav > li > a:hover {
        color: #ffffff;
    }

    .navbar-header {
        box-shadow: 0 2px 30px 2px rgba(0, 0, 0, .1) !important;
    }

    #navbar {
        background-color: #1e9ff2;
    }

    #sidebar-toggle-md {
        color: #ffffff;
    }
}
@media (max-width: 767px){
    .signin-box{
        width: 90%;
        max-width: 450px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 5%;
        margin-bottom: 5%;
    }
        /*mobile view menu*/
        #sidebar, #sidebar.collapsed{
            opacity: 0;
            width: 75%;
            z-index: 2147483647;
            transform: translate3d(0px,0,0);
        }

        .off-screen #sidebar,
        .off-screen #sidebar.collapsed{
            padding-top: 7px !important;
            display:table-cell;
            width: 75%!important;
            opacity: 1;
            z-index: 900;
            position: absolute;
            transform: translate3d(0px,0,0);
            transition: width .25s,opacity .25s,transform .25s;
            padding-bottom: 10000px;
            margin-bottom: -10000px;
            box-shadow: 200px 200px 200px 200px rgba(0,0,0,0.5);

        }
        .off-screen #page-container{
            position: absolute;
            display: inline-table;
        }
        #page-container{
            position: absolute;
            left: 0px;

        }

}
.hidden-xs:hover > .dropdown-menu{
    display: block;
}


@media only screen and (max-width: 480px) {
    .nav-tabs-modern:not(.display-tab) li a,
    .nav-tabs-projects-edit-modern:not(.display-tab) li a,
    .nav-tabs:not(.display-tab) li a {
        background: #ffffff !important;
        color: #000000 !important;
        border-bottom: none !important;
        border-radius: 1.5rem !important;
        padding: 5px 7px !important;
        margin: 3px !important;
        border: 1px solid #f2f4f6 !important;
    }

    .nav-tabs-modern:not(.display-tab) li.active a {
        color: #686868 !important;
    }
}

.general-form.white .form-control {
    border-color: #ccc;
}

.gantt .bar-label {
    font-size: 15px !important;
    font-weight: normal !important;
}

.gantt .lower-text, .gantt .upper-text {
    font-size: 14px !important;
}

b, strong {
    font-weight: bold;
}

.navbar-header.collapsed {
    width: 65px;
}

.navbar-header.collapsed img {
    width: 35px;
}

.fc-center {
    padding: 20px 0 0 20px;
    min-width: 200px;
}

.panel.no-border {
    padding-right: 15px;
}

.dataTable tbody td {
    word-break: break-word;
}

/* .nav-tabs-modern{
    display: flex;
} */

/* project client */
@media (min-width: 768px) {
    .project_client {
        padding-left: 18px;
    }
}

/* お問合せ管理ドロップダウンを隠れないようにする */
#ticket-table_wrapper {
    min-height: 400px;
}

/* 見積書 > 各見積書 > 編集 削除ボタン
To Do 
設定＞アクセス権限＞役割
プロジェクト一覧 ＞概観・ファイル
他 丸ボタンにする*/ 
#sortable-table td.option a.delete,
#invoice-payment-table td.option a.delete,
#invoice-payment-table td.option a.edit,
#role-list-box td.option a.edit,
#role-list-box td.option a,
#todo-table_wrapper td.option a,
#project-member-table td.option a,
#project-file-table td.option a,
#custom-field-table-sortable td.option a,
#notification-settings-table td.option a,
#contact-table td.option a,
#client-file-table td.option a,
#project-client-contacts-table td.option a,
#task-table td.option a, 
#milestone-table td.option a,
#team-member-file-table td.option a,
.remove-member.delete.ml20,
/* #estimate-table td.option a.delete, */
#estimate-table a.delete_restore_button,
#yearly-invoice-table a.delete_restore_button,
#google-calendar-settings-form .delete-post-dropzone,
/* #yearly-invoice-table .option a, */
.send-invitation-field .remove-invitation.delete,
#client-file-table a.delete
{
    min-width: 28px;
}

/* 見積書、請求書th中央寄せ */
.estimate-items th:first-of-type,
.invoice-items th:first-of-type {
    text-align: center;
}

.estimate-items .rank,
.invoice-items .rank {
    padding-top: 5px !important;
}
table.estimate-items tr td,
table.invoice-items tr td {
    line-height: 32px !important;
}

/* 時計アイコン */
/* .animated-clock {
    background: none;
} */

.select2-container .select2-choice, .select2-container .select2-choices, .select2-container .select2-choices .select2-search-field input {
    font-family: Roboto,"Kosugi Maru","Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.select2-search input {
    font-family: Roboto,"Kosugi Maru","Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.ui-tooltip-content {
    font-family: Roboto,"Kosugi Maru","Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

td.child ul.dtr-details a.edit.comment_button {
    background: transparent;
    color: #777;
}
td.child ul.dtr-details a.cloud_download {
    background: transparent;
    color: #a1a3a5;
}

td.child ul.dtr-details a.mark_as_closed {
    background: #ff9149;
    color: #fff;
}

.column-show-hide-popover-content .list-group-item {
    font-family: Roboto,"Kosugi Maru","Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.notification_description_wrapper ul {
    list-style-type: disc;
}
/* クライアントデータ追加モーダル画面 */
.import_clients_modal-DL {
    display: block;
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
}
.modal-footer-button-wrap {
    text-align: center;
}
.modal-footer-button-wrap button {
    margin-top: 16px;
}
@media (max-width: 767px) {
.impoet_clients_modal-DL {
    display: block;
} 
}

/* スマホ時コンテンツ幅を100%に調整 */
@media (max-width: 767px) {
 #page-container {
     width: 100%;
 }
}

/* #591 各プロジェクト＞タスクリスト タイトルの表示位置 */
#task-table .dataTable tbody td {
    padding: 8px 10px 6px;
}

.dataTable .label  {
    margin: 0;
    vertical-align: text-top;
}

/* #603 請求書一覧スマホ 入金追加ボタン*/
#monthly-invoice-table .dropdown-menu > li > a, 
#yearly-invoice-table .dropdown-menu> li > a
{
    text-align: center;
}
/* #600 スマホ吹き出し調整 */
td.child ul.dtr-details a.edit.text-muted {
    color: #777777;
    text-align: right;
    background: #ffffff;
}
table.dataTable>tbody>tr.child:hover a.edit.text-muted:hover {
     background: transparent !important;
}
/* #613スマホレイアウト調整 */
@media (max-width: 767px) {
    .message-button-list {
        margin-bottom: 20px;
    }
    /* #632 */
    #timeline::before {
        background-image: none;
    }  
    .timeLine_mr {
        margin-right: 15px;
    }
}

/* #625印刷プレビュー画面 */
.dt-print-view table.dataTable thead th {
    text-align: center;
}

.invoice_cc {
    width: 436px;
}
@media (max-width: 767px) {
    .invoice_cc {
        width: 100%;
    }
}
/* #590 */
@media (max-width: 767px) {
    #client-file-table a.delete {
        margin-left: 30px;
    }
    td.child ul.dtr-details a.cloud_download {
        color: #1e9ff2;
    }
    #project-file-table td.child ul.dtr-details a.delete {
        margin-left: 30px;
    }
}
/* #605 */
@media (max-width: 767px) {
    .datatable-tools .DTTT_container {
        text-align: center;
    }
}
/* #635 */
@media (max-width: 767px) {
    .app-alert.animate {
        bottom: unset;
        top: 380px;
    }
}
/* #597 */
@media (max-width: 767px) {
     #page-content.padding_offset {
        padding: 0 !important;
    }
    #page-content.margin_offset {
        margin: 0;
    }
}
/* #664 */
/* table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>td:first-child {
    padding: 15px 0 15px 30px;   
} */
.clientAllTasks table.dataTable tbody td {
    padding: 15px 10px;
}


body.smartphone input,
body.smartphone textarea,
body.smartphone input.form-control,
body.smartphone textarea.form-control {
    font-size: 16px;
}

body.smartphone .select2-container-multi .select2-choices .select2-search-field input {
    font-size: 16px;
}

body.smartphone [contenteditable=true] {
    font-size: 16px;
}

body.smartphone .note-editor.note-frame .note-editing-area .note-codable {
    font-size: 16px;
}


/* 591 */
.centered {
    text-align: center;
}
.expenseTable .tf-lable,
.expensesTable-members .tf-lable,
.spending .tf-lable {
    text-align: center;
}

.file_icon .pull-left {
    float: none !important;
    display: block;
    margin: 0;
    text-align: center;
}
@media (max-width: 767px) {
    .expenseTable .fa.pull-left,
    .noteTable .fa.pull-left,
    .expensesTable-members .fa.pull-left,
    .spending .fa.pull-left {
        float: none !important;
        margin: 0;
    }
}
.invoice_payment_table .tf-lable {
    text-align: left;
}

body.smartphone {
    min-height: 100vh;
    min-height: calc(var(--vh, 1vh) * 100);
}

body.smartphone #content {
    display: flex;
    height: auto;
    overflow: visible;
}

@media (max-width: 767px) {
    body.smartphone #content #sidebar {
        display: none;
    }
    body.smartphone #content #sidebar.w100p {
        display: block;
    }
}

body.smartphone #content #page-container {
    height: auto;
    overflow: visible;
}

/* #662 */
@media (max-width: 767px) {
    .clientTabs {
        display: none;
    }
    .importMembers {
        display: none;
    }
}
/* #663 */
@media (max-width: 768px){
    #client-table.client-table_list .dtr-details li{
        list-style-type: disc;
        text-align: left;
    }
    #client-table.client-table_list .dtr-details li:nth-of-type(2) ul {
        padding-left: 30%;
    }
}

/* #602 請求書 見積書 ロゴ部分調整*/
@media (max-width: 767px) {
    .form-group-padding {
        padding: 0 15px;
    }
    .invoice-logo-preview,
    .estimate-logo-preview {
        width: 100%;
    }
    .mr15.Logo {
        margin: 0 !important;
        width: calc(100% - 20px);
    }
    .estimate-subtotal.paddig-r-none,
    .col-md-9.paddig-r-none,
    .estimate-total.paddig-r-none,
    .invoice-subtotal.paddig-r-none,
    .col-md-9.paddig-r-none,
    .invoice-total.paddig-r-none {
        padding-right: 0;
    }
    .file-upload.uploadWrap {
        position: absolute;
        margin: 10px 0;
    }
}

 /* #602 */
 
@media (max-width: 767px) {
    .estimate_item_title,
    .invoice_item_title {
        width: unset !important;
    } 
    .head-unit-type {
        width: 15%;
    }
    .head-rate {
        width: 16%;
    }
}
.flexible-container-item {
    width: 436px;
}

@media (max-width: 767px) {
    .flexible-container-item {
        width: 100%;
    }
    .flexible-container-item input{ 
        width: 100%;
    }
    .select2-container.form-size {
        width: 80%;
    }
}


body.iphone ul#client-tabs + div.tab-content {
    min-height: 150px;
}

div.online_demo_notice {
    border: 2px solid #4d4d4d;
    border-radius: 3px;
    padding: 0.5em;
    color: #4d4d4d;
}

div.online_demo_notice p {
    margin: 0.2em 0;
    font-size: 0.9em;
}

div.online_demo_notice p.note {
    margin: 0.2em 0 0.5em 0;
}

div.online_demo_notice p.list {
    text-indent: -2em;
    padding-left: 2em;
}

div.online_demo_notice p:first-child {
    font-size: 1em;
}

div.online_demo_notice p svg {
    vertical-align: text-bottom;
}

@media (max-width: 767px) {
    div.online_demo_notice p {
        font-size: 0.8em;
    }
}

div.online_demo_accounts {
    border: 2px solid #4d4d4d;
    border-radius: 3px;
    padding: 0.2em;
    color: #4d4d4d;
    margin-top: 1em;
}

div.online_demo_accounts p {
    margin: 0.2em 0;
    font-size: 0.9em;
    text-align: center;
}

div.online_demo_accounts table {
    font-size: 0.8em;
    width: 100%;
}

div.online_demo_accounts table th,
div.online_demo_accounts table td {
    text-align: center;
    border: 1px solid white;
    padding: 0.2em 0;
}

div.online_demo_accounts table th {
    background-color: #cbd2dd;
}

div.online_demo_accounts table td {
    background-color: #edeff5
}


.gantt-float-header .toggle-search-panel {
    display: inline-block;
    float: none !important;
    margin-left: 4px;
    background-color: white;
    font-size: 14px;
    visibility: hidden;
}

.gantt-float-header .toggle-search-panel button {
    background-color: white;
    font-size: 14px;
}

.gantt-float-header .search-panel.collapse {
    height: auto;
    display: block;
}

@media (max-width: 767px) {
    .gantt-float-header h4 {
        padding: 10px 10px 0 10px;
    }
    .gantt-float-header .toggle-search-panel {
        visibility: visible;
    }
    .gantt-float-header .search-panel {
        width: 100%;
        margin: 0;
        padding: 0 10px;
    }
    .gantt-float-header .search-panel.collapse {
        overflow: hidden;
        height: 0;
    }
    .gantt-float-header .search-panel.collapse.in {
        height: auto;
    }
    .gantt-float-header .search-panel .w200 {
        width: 100%;
    }
    .gantt-float-header .search-panel .ml10 {
        margin-left: 0 !important;
    }
    .gantt-float-header .search-panel #gantt-status-dropdown-container {
        display: block;
    }
    .gantt-float-header .search-panel #s2id_gantt-view-dropdown {
        padding-bottom: 10px;
    }
}

@media (min-width:768px) and (max-width: 1280px) {
    #page-container {
        width: calc(100% - 200px);
    }
    #page-container.w100p {
        width: calc(100% - 200px) !important;
    }
    #sidebar {
        width: 200px;
        font-size: 1rem;
    }
    #sidebar.w100p {
        width: 200px !important;
    }
    nav .navbar-header {
        flex-shrink: 0;
        flex-grow: 0;
        flex-basis: auto;
        width: 200px;
        padding: 0;
        margin: 0;
        border: none;
    }
    nav .navbar-header .navbar-brand {
        position: relative;
        width: 200px;
        height: 67px;
        padding: 0;
        margin: 0;
    }
    nav .navbar-header .navbar-brand img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        max-width: 100%;
        width: 100%;
        height: auto;
        padding: 0;
        margin: 0;
    }
    nav .navbar-nav li.dropdown-user a span.topbar-user-name {
        display: none;
    }
}
