.navbar {
    min-height: 50px;
}

.navbar li a {
    margin-top: 0;
    margin-bottom: 0;
}

.navbar-nav li a {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.navbar-brand {
    padding: 6px 12px 6px 18px;
    height: 50px;
}

body {
    font-size: 14px;
}

footer {
    text-align: center;
    margin-top: 20px;
}

.container-fluid {
    min-width: 980px;
}

.space_top10 {
    margin-top: 10px;
}

.space_top30 {
    margin-top: 30px;
}

.nowrap {
    white-space: nowrap;
}

.no_margin {
    margin: 0;
    padding: 0;
}

.n_mr {
    margin: 0 !important;
}

ul.line100 li {
    float: left;
    width: 100px;
    list-style: none;
}

label {
    font-weight: normal;
}

table.tbl_center th,
table.tbl_center td {
    text-align: center;
}

table.vertical_mid td {
     vertical-align: middle !important;
}

.of_box100 {
    max-height: 100px;
    overflow-y: scroll;
}

.of_box200 {
    max-height: 300px;
    overflow-y: scroll;
}

.of_box400 {
    height: 400px;
    overflow-y: scroll;
}

.of_box500 {
    max-height: 500px;
    border: 1px solid #ccc;
    padding: 10px;
    overflow-y: scroll;
}

.of_box800xy {
    max-height: 800px;
    border: 1px solid #ccc;
    padding: 10px;
    overflow: scroll;
}

.image_resize {
    max-width: 170px;
    max-height: 220px;
}

* html body .image_resize {
    width: expression(this.width >= this.height ? "170px" : "auto");
    height: expression(this.width <= this.height ? "220px" : "auto");
}

.image_resize_item {
    max-width: 320px;
    max-height: 240px;
}

* html body .image_resize_item {
    width: expression(this.width >= this.height ? "320px" : "auto");
    height: expression(this.width <= this.height ? "240px" : "auto");
}

.cursor_p {
    cursor: pointer;
}

.text_lg {
    font-size: 36px;
}

.text_lg small {
    color: #ccc;
    font-size: 2rem;
}

.pagination {
    margin: 0 !important;
}

.wd10 {
    width: 10% !important;
}

.wd20 {
    width: 20% !important;
}

.wd40 {
    width: 40% !important;
}

.wd60 {
    width: 60% !important;
}

.wd80 {
    width: 80% !important;
}

.wd100 {
    width: 100% !important;
}

.wp60 {
    width: 60px !important;
}

.wp100 {
    width: 100px !important;
}

.wp160 {
    width: 160px !important;
}

.wp200 {
    width: 200px !important;
}

.wp220 {
    width: 220px !important;
}

.wp300 {
    width: 300px !important;
}

.wp400 {
    width: 400px !important;
}

.al_l {
    text-align: left;
}

.help-block {
    margin: 0 !important;
}

label.ib {
    display: inline-block;
    font-weight: normal;
    margin-right: 1rem;
}

.label-purple {
  background-color: #7E57C2;
}
.label-purple[href]:hover,
.label-purple[href]:focus {
  background-color: #673AB7;
}

.jumbotron {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}

@media screen and (min-width: 760px){
    table.detail_tbl th {
        background: #f5f5f5;
        width: 180px;
        vertical-align: middle !important;
        text-align: center;
    }

    table.detail_tbl_sm th {
        background: #f5f5f5;
        width: 120px;
        vertical-align: middle !important;
        text-align: center;
    }

    table.detail_tbl_inp th {
        width: 200px !important;
        background: #F9F9F9;
        text-align: center;
        vertical-align: middle !important;
    }
}

@media screen and (max-width: 760px){
    table.detail_tbl th {
        background: #f5f5f5;
        width: 25%;
        vertical-align: middle !important;
        text-align: center;
    }

    table.detail_tbl_sm th {
        background: #f5f5f5;
        width: 14%;
        vertical-align: middle !important;
        text-align: center;
    }

    table.detail_tbl_inp th {
        width: 25% !important;
        background: #F9F9F9;
        text-align: center;
        vertical-align: middle !important;
    }
}

.form-inline {
    width: auto;
    display: inline-block;
}

.dataTables_wrapper.form-inline {
    display: initial;
}

.form-control {
    width: auto;
    display: inline-block;
}

.dl-horizontal_ctm dl {
    width: 100%;
}

.dl-horizontal_ctm dt {
    float:left;
    width:120px;
    padding:5px 0 5px 10px;
    border-bottom: 1px solid #f5f5f5;
    text-align: right;
    clear:both;
}

.dl-horizontal_ctm dd {
    margin-left:120px;
    padding:5px 5px 5px 10px;
    border-bottom: 1px solid #f5f5f5;
}

.carousel-inner .item {
    height: 300px;
    text-align: center !important;
}

.inline_b {
    display: inline-block;
}

.icon_badge {
    position: absolute;
    top: 3px;
    right: -5px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}

.icon_badge .inner {
    display: block;
    position: relative;
    margin: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    color: #fff;
    font-size: 10px;
    line-height: 13px;
    text-align: center;
    background: -webkit-gradient(linear, left top, left bottom, from(#ee757b), to(#c80507));
    background: -webkit-linear-gradient(top, #ee757b, #c80507);
    background: linear-gradient(to bottom, #ee757b, #c80507);
    background: gradient(linear, center top, center bottom, from(#ee757b), to(#c80507));
}

.modal-dialog-center {
    margin: 20% auto;
}


table.monthdata{
    border:1px solid #ddd;
    margin-bottom:20px;
    text-align: center;
    border-collapse: collapse;
    border-spacing: 0;
    vertical-align: middle;
}

table.monthdata tbody {
    border: 1px solid #ddd;
}

table.monthdata tbody:nth-child(odd) {
    background: #f9f9f9;
}

table.monthdata th,
table.monthdata td{
    padding:8px;
    line-height: 1.5;
}

table.monthdata th{
    background: #f5f5f5;
}

table.monthdata th.parent,
table.monthdata td.parent{
    border: 1px solid #ddd;
}

table.monthdata th.detail{

}

table.monthdata td.detail{
    border-top: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px dotted #ddd;
}

table.monthdata td.bold{
    background: #f5f5f5;
    font-weight: bold;
}

table > tbody > tr.nodisplay:hover > td,
table > tbody > tr.nodisplay > td,
table > tbody > tr.nodisplay:nth-child(odd) > td{
    color:#a94442;
    background: #FCEFEF;
}


.panel-heading-height{
    line-height:2.5;
    height: 91px;
}

.jointby2.jcolor, .base_joint2.jcolor{color:; background: #F2DEDE;}
.jointby3.jcolor, .base_joint3.jcolor{color:; background: #FCF8E3;}
.jointby4.jcolor, .base_joint4.jcolor{color:; background: #D9EDF7;}
.jointby5.jcolor, .base_joint5.jcolor{color:; background: #DFF0D8;}

/* データ検索メーター */
.meter_bar {
    background: #d9d9d9;
    height: 40px;
    border-radius: 100px;
    position: relative;
    overflow: hidden;
    margin-top: 5px;
}
.meter_bar .line-l {
    position: absolute;
    height: 100%;
    max-width: 100%;
    bottom: 0;
    left: 0;
    background: green;
    line-height: 0;
    border-radius: 200px 0 0 200px;
}
.meter_bar .count_date {
    position: absolute;
    width: 100%;
    line-height: 1;
    left: 0;
    top: 50%;
    -ms-transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
    text-align: center;
    color: #fff;
}
.meter_bar .count_date p{
    font-weight: 600;
    margin-bottom: 0;
}
.meter_bar .count_date p span{
    font-size: 20px
}

.mb5{
    margin-bottom: 5px;
}
/*.data_area{
    width: 90%;
    max-width: 500px;
    margin: 0 auto 40px;

}*/
.data_area>div{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    margin-top: 5px;
    text-align: center;
}

.data_area .tag{
    display: inline-block;
    background: green;
    color: #fff;
    border-radius: 5px;
    padding: 4px 10px;
    position: relative;
    margin-right: 10px;
    width: 110px
}
.data_area .tag:after{
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-left: 5px solid #e69500;
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translate(0%,-50%);
}
.data_area>div p{
    margin-bottom: 0;
    -webkit-flex: 1 0 50%;
    -moz-flex: 1 0 50%;
    -ms-flex: 1 0 50%;
    -o-flex: 1 0 50%;
    flex: 1 0 50%;
}
.data_area>div p span{
    font-size: 20px;
    font-weight: 600;
}
@media screen and (max-width: 425px){
    .container-fluid .row>div:nth-of-type(odd){
        padding-right: 5px;
    }
    .container-fluid .row>div:nth-of-type(even){
        padding-left: 5px;
    }
    .panel-body{
        padding: 10px 5px
    }
}
@media screen and (max-width: 320px){
    .data_result{
        padding: 20px 10px
    }
}
/* 請求データ変更履歴詳細 */
p.bill_change_history {
    margin: 20px 10px;
}
#bill_change_history_table {
    margin: 0 auto;
}
#bill_change_history_table > thead th {
    width: 45%
}
#bill_change_history_table > thead th:first-child {
    width: 10%
}
#bill_change_history_table table,
#bill_change_history_table th,
#bill_change_history_table tr,
#bill_change_history_table td {
    border: 1px solid #000;
    border-collapse: collapse;
}
#bill_change_history_table tr {
    line-height: 2.5em;
}
#bill_change_history_table table.detail-table,
#bill_change_history_table table.detail-table tr {
    border: 0;
    width: 100%;
}
#bill_change_history_table table.detail-table td {
    border: 0;
}
#bill_change_history_table .delete {
    background-color: #f8d7da;
}
#bill_change_history_table .add {
    background-color: #d4edda;
}
#bill_change_history_table th,
#bill_change_history_table td {
    padding: 5px;
    text-align: center;
    font-size: 14px;
}
#bill_change_history_table table.detail-table thead {
    background-color: #eee;
}
#bill_change_history_table table.detail-table tr {
    border-bottom: 1px dotted #222;
}
#bill_change_history_table table.detail-table tr:last-child {
    border-bottom: 0;
}
#bill_change_history_table table.detail-table thead tr th,
#bill_change_history_table table.detail-table tbody tr td {
    border: 1px dotted #222;
    border-collapse: collapse;
}
#bill_change_history_table .tbody-delete > tr > td:last-child {
    background-color: #f8d7da;
}

.radio-readonly {
    pointer-events: none;
    cursor: not-allowed;
    color: #aaa;
}
.select-readonly {
    appearance: none;
    pointer-events: none;
    cursor: not-allowed;
    background-color: #eee;
}

.table-responsive {
    width:100%;
    margin-bottom: 15px;
    overflow-y: hidden;
    overflow-x: scroll;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    -webkit-overflow-scrolling: touch
}

.table-responsive>.table {
    margin-bottom: 0
}

.table-responsive>.table>thead>tr>th,.table-responsive>.table>tbody>tr>th,.table-responsive>.table>tfoot>tr>th,.table-responsive>.table>thead>tr>td,.table-responsive>.table>tbody>tr>td,.table-responsive>.table>tfoot>tr>td {
    white-space: nowrap
}

.table-responsive>.table-bordered {
    border: 0
}

.table-responsive>.table-bordered>thead>tr>th:first-child,.table-responsive>.table-bordered>tbody>tr>th:first-child,.table-responsive>.table-bordered>tfoot>tr>th:first-child,.table-responsive>.table-bordered>thead>tr>td:first-child,.table-responsive>.table-bordered>tbody>tr>td:first-child,.table-responsive>.table-bordered>tfoot>tr>td:first-child {
    border-left: 0
}

.table-responsive>.table-bordered>thead>tr>th:last-child,.table-responsive>.table-bordered>tbody>tr>th:last-child,.table-responsive>.table-bordered>tfoot>tr>th:last-child,.table-responsive>.table-bordered>thead>tr>td:last-child,.table-responsive>.table-bordered>tbody>tr>td:last-child,.table-responsive>.table-bordered>tfoot>tr>td:last-child {
    border-right: 0
}

.table-responsive>.table-bordered>tbody>tr:last-child>th,.table-responsive>.table-bordered>tfoot>tr:last-child>th,.table-responsive>.table-bordered>tbody>tr:last-child>td,.table-responsive>.table-bordered>tfoot>tr:last-child>td {
    border-bottom: 0
}

/* 紹介ポイント対象者一覧 */
.custom-header {
    display: flex;
    align-items: center;
}
.custom-question-btn {
    font-size: 15px;
    padding: 5px 10px;
    border-radius: 50%;
    background-color: #6f42c1;
    color: #ffffff;
    border: 1px solid #ccc;
    margin-left: 10px;
}
.custom-question-btn:hover {
    background-color: #6f42c1;
    color: #ffffff;
}
.custom-question-btn:focus,
.custom-question-btn:active {
    background-color: #6f42c1;
    color: #ffffff;
    box-shadow: none;
    outline: none;
}