/* ある程度揃えるために */

.b2bac-common-modal .modal-content form {
    margin-block-end: 0 !important;
}

.b2bac-common-modal .modal-body p {
    margin: 0;
}

.b2bac-common-modal .modal-body .b2bac-modal-table {
    width: 100%;
}

/* テーブルカラム数が多く、幅がmodal-lgでは足りない場合の調整 */
.b2bac-common-modal div.modal-xl {
    max-width: 90% !important;
}

/* ui_style によって広くなりすぎる現象を調整 */
.b2bac-common-modal div.modal-lg {
    max-width: 900px !important;
}

/* コンテンツがないタイトルバーが小さくならないように */
.b2bac-common-modal .modal-header {
    min-height: calc(3.5rem + 1px); /* 下ボーダーの線を加味して + 1px で調整 */
}

/* h3タイト利用時にタイトルバーの高さが変わらないように */
.b2bac-common-modal .modal-header h3 {
    margin-top: 0;
}

/* 閉じる x ボタンの右上かつ他のエレメントに影響しない設定 */
.b2bac-common-modal .close {
    position: absolute;
    z-index: 1;
    font-size: 12px !important;
}

.b2bac-common-modal .modal-header>.close {
    right: 1rem;
}

.b2bac-common-modal .modal-content>.close,
.b2bac-common-modal form>.close {
    right: 0rem;
    padding: 1rem;
}

/* footer のボタンの幅、マージンの共通設定 */
.b2bac-common-modal .modal-footer .btn {
    width: 25%;
    margin-top: 0;
    margin-bottom: 0;
}
.b2bac-common-modal .modal-footer>* {
    margin-left: 0;
    margin-right: .5rem;
}
.b2bac-common-modal .modal-footer>*:first-child {
    margin-left: auto;
}
.b2bac-common-modal .modal-footer>*:last-child {
    margin-right: auto;
}

/* 中身だけスクロールするテーブル */
/* 各 td と th に col-** クラスで幅を指定すること！ */

.b2bac-scroll-table>tbody,
.b2bac-scroll-table div.div-table-tbody {
    overflow-y: scroll;
    width: 100%;
}

.b2bac-scroll-table>thead,
.b2bac-scroll-table div.div-table-thead {
    margin-right: calc(1rem + 1px); /* 縦の scroll bar の幅は約 1rem, ボーダーが 1px なので、その合計値。本来は正確な計算をするべき */
    margin-left: 0px;
}

table.b2bac-scroll-table,
.b2bac-scroll-table>thead,
.b2bac-scroll-table>thead>tr>th,
.b2bac-scroll-table>tbody,
.b2bac-scroll-table>tbody>tr>td {
    display: block;
}

.b2bac-scroll-table>*>tr {
    display: flex;
}

.b2bac-scroll-table>thead>th,
.b2bac-scroll-table>tbody>tr>td,
.b2bac-scroll-table div.div-table-thead div.div-table-th,
.b2bac-scroll-table div.div-table-thead div.div-table-th>div>div,
.b2bac-scroll-table div.div-table-thead div.div-table-th-group>div,
.b2bac-scroll-table div.div-table-tbody div.div-table-td,
.b2bac-scroll-table div.div-table-tbody div.div-table-td>div>div,
.b2bac-scroll-table .detail-row div.detail-data {
    float: left;
}

.b2bac-scroll-table>tbody>tr>td,
.b2bac-scroll-table div.div-table-tbody div.div-table-td,
.b2bac-scroll-table div.div-table-tbody div.div-table-td>div>div,
.b2bac-scroll-table .detail-row div.detail-data {
    /* 以下３つの定義がないと、内容が長すぎるとテーブルの形が崩れる */
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.b2bac-scroll-table>thead,
.b2bac-common-modal div.div-table-thead,
.b2bac-scroll-table div.div-table-thead {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

/* 赤い枠を付けるため： knockout との関連は、validated-input-dialog を参考に */
.b2bac-common-modal .invalid:focus {
    border-color: #f22;
    background-color: #fee;
}

.b2bac-common-modal .invalid {
    border-color: #faa;
    background-color: #ffefef;
}

/* 灰色背景に載っているためドロップダウンリストが合わせて灰色になるように */
.b2bac-common-modal select {
    border-radius: 0.3rem;
}

/* テーブル定義 */
/* divテーブル利用時
   利用例： <div class="div-table-th">

   div-table-th-group … 通常表示に見せた入れ子(データの幅でcol-1.5相当を利用したいときにヘッダーに設定)
    ⇒配下のdivで入れ子部分が適用される
   div-table-th … 二段表示の入れ子、通常テーブルの枠に利用する
   div-table-td … 通常のテーブルデータの利用と同様にクラスに設定
    ⇒配下のdiv>divで入れ子部分が適用される
*/

/* テーブル罫線用 */
.b2bac-common-modal .b2bac-modal-table>tbody>tr>td:first-child,
.b2bac-common-modal .b2bac-modal-table>thead>tr>th:first-child,
.b2bac-common-modal .b2bac-modal-table div.div-table-td:first-child,
.b2bac-common-modal .b2bac-modal-table div.div-table-th:first-child,
.b2bac-common-modal .b2bac-modal-table div.div-table-th-group:first-child,
.b2bac-common-modal .b2bac-modal-table div.div-table-th>div>div:not(:first-child),
.b2bac-common-modal .b2bac-modal-table div.div-table-td>div>div:not(:first-child) {
    border-left: 1px solid #ddd;
}

/* テーブルヘッダー用 */
.b2bac-common-modal .b2bac-modal-table>thead>tr>th,
.b2bac-common-modal .b2bac-modal-table div.div-table-th-group>div {
    padding: 0.5rem;
    border-right: 1px solid #ddd;
    text-align: center;
}

/* div作成テーブル ヘッダー用 */
.b2bac-common-modal .b2bac-modal-table div.div-table-th {
    padding: 0.5rem 0.5rem 0 0.5rem;
    border-right: 1px solid #ddd;
    font-weight: bolder;
    text-align: center;
}

/* div作成テーブルヘッダー 入れ子（2段表示）用 */
.b2bac-common-modal .b2bac-modal-table div.div-table-th p {
    padding-bottom: 0.5rem;
}

.b2bac-common-modal .b2bac-modal-table div.div-table-th>div>div {
    padding: 0.5rem;
    border-top: 1px solid #ddd;
}

/* div作成テーブルヘッダー 入れ子用 */
.b2bac-common-modal .b2bac-modal-table div.div-table-th-group {
    padding: 0;
    font-weight: bolder;
}

/* テーブルデータ用 */
.b2bac-common-modal .b2bac-modal-table>tbody>tr>td,
.b2bac-common-modal .b2bac-modal-table div.div-table-td {
    padding: 0.5rem;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    text-align: center;
}

/* div作成テーブルデータ 入れ子用 */
.b2bac-common-modal .b2bac-modal-table div.div-table-td>div>div {
    padding: 0.5rem;
}

/* サブデータ行用 */
.b2bac-common-modal .b2bac-modal-table div.detail-row {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

.b2bac-common-modal .b2bac-modal-table div.detail-row-show {
    border-bottom: 1px solid #ddd;
}

/* テーブルボディ高さ調整 */
.b2bac-common-modal .b2bac-modal-table>tbody {
    height: 15rem;
}

.b2bac-common-modal .modal-xl .b2bac-modal-table>tbody,
.b2bac-common-modal .modal-xl .b2bac-modal-table div.div-table-tbody {
    height: 30rem;
}

/* テーブルのヘッダー色を定義 */
.b2bac-common-modal .b2bac-modal-table>thead,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead {
    background: #ebebeb;
}

/* テーブルの行の色を交互に変えるための odd/even 定義 */
.b2bac-common-modal .b2bac-modal-table>tbody tr:nth-child(odd),
.b2bac-common-modal .b2bac-modal-table .div-table-tbody div.div-table-tr:nth-child(odd),
.b2bac-common-modal .b2bac-modal-table .div-table-tbody div.div-table-tr.summary-row:nth-child(4n+1),
.b2bac-common-modal .b2bac-modal-table .div-table-tbody div.div-table-tr:nth-child(4n+2) div.detail-row {
    background: #ffffff;
}
.b2bac-common-modal .b2bac-modal-table>tbody tr:nth-child(even),
.b2bac-common-modal .b2bac-modal-table .div-table-tbody div.div-table-tr:nth-child(even),
.b2bac-common-modal .b2bac-modal-table .div-table-tbody div.div-table-tr.summary-row:nth-child(4n+3),
.b2bac-common-modal .b2bac-modal-table .div-table-tbody div.div-table-tr:nth-child(4n) div.detail-row {
    background: #f7f7f7;
}

/* テーブルタグ時のtoggle用 odd/even 定義 */
.table-double-striped>tbody>tr:nth-of-type(4n+1),
.table-double-striped>tbody>tr:nth-of-type(4n+2) {
    background-color: #ffffff !important;
}
.table-double-striped>tbody>tr:nth-of-type(4n+3),
.table-double-striped>tbody>tr:nth-of-type(4n+4) {
    background-color: #f7f7f7 !important;
}

/* サイト無効状態でテーブルの行の色をグレーアウトするための定義 */
.table-double-striped>tbody>tr:nth-of-type(4n+1).smc-service-disable-background,
.table-double-striped>tbody>tr:nth-of-type(4n+2).smc-service-disable-background {
    background-color: #bbbbbb !important;
}
.table-double-striped>tbody>tr:nth-of-type(4n+3).smc-service-disable-background,
.table-double-striped>tbody>tr:nth-of-type(4n+4).smc-service-disable-background {
    background-color: #bbbbbb !important;
}

/* 適用行の下部に影を付ける */
.b2bac-common-modal .b2bac-modal-table .drop-shadow-over-detail-row {
    box-shadow: 5px 2px 5px rgba(227,227,227,1);
    position: relative;
    z-index: 2;
}

/* ソートボタンの▲▼イメージ */
.b2bac-common-modal .b2bac-modal-table>thead .sorting,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting {
    background-image: url("../img/modal/sort_both.png");
}
.b2bac-common-modal .b2bac-modal-table>thead .sorting_asc,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting_asc {
    background-image: url("../img/modal/sort_asc.png");
}
.b2bac-common-modal .b2bac-modal-table>thead .sorting_desc,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting_desc {
    background-image: url("../img/modal/sort_desc.png");
}

/* ▲▼イメージを表示する際の調整（イメージの繰り返し無し、右寄せ） */
.b2bac-common-modal .b2bac-modal-table>thead .sorting,
.b2bac-common-modal .b2bac-modal-table>thead .sorting_asc,
.b2bac-common-modal .b2bac-modal-table>thead .sorting_desc,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting_asc,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting_desc {
    background-repeat: no-repeat;
    background-position: center right;
}

/* ▲▼イメージを追加したカラムのポインタの動き */
.b2bac-common-modal .b2bac-modal-table>thead .sorting,
.b2bac-common-modal .b2bac-modal-table>thead .sorting_asc,
.b2bac-common-modal .b2bac-modal-table>thead .sorting_desc,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting_asc,
.b2bac-common-modal .b2bac-modal-table div.div-table-thead .sorting_desc {
    cursor: pointer;
    *cursor: hand;
}

/* GooogleMapのサイズ定義 */
.b2bac-common-modal .b2bac-common-map {
    height: 100%;
    width: 100%;
}

/* GooogleMapのオートコンプリートをモーダルより前面に表示させるためZ値を調整 */
.pac-container {
    z-index: 2000 !important;
}

/* textareaの定義 */
.b2bac-common-modal textarea {
    resize: none;
    height: 20rem;
    background: #fff !important;
    color: #212529;
    text-align: left;
    line-height: 1.5;
}

.b2bac-common-modal textarea.check-displayed-height {
    height: 17.3rem;
}

/* タブデザインの定義 */
.b2bac-common-modal .rounded-top-tab {
    cursor: pointer;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    height: 100%;
    display: flex;
    align-items:center;
}

.form-row.show{
	display: flex;
	text-align: center;
}

#b2bac-common-modal-stack .form-row .form-control {
	text-align: left;
}

#b2bac-common-modal-stack .bootstrap-datetimepicker-widget.dropdown-menu {
	min-width: 280px;
}
#b2bac-common-modal-stack .bootstrap-datetimepicker-widget table th {
      padding-right: 0px;
      padding-left: 0px;
}

.modal_d019 .b2bac-scroll-table>thead,
.modal_d019 .b2bac-scroll-table div.div-table-thead {
    margin-right: 0px;
}

/* jstreeのデフォルトフォーマット */
.b2bac-jstree .jstree-container-ul > li > div {
  background: -webkit-linear-gradient(#ffffff 0%, #cdcdcd 100%) !important;
  background: linear-gradient(#ffffff 0%, #cdcdcd 100%) !important;
}
.b2bac-jstree .jstree-container-ul > li > a {
  background: none !important;
}
.b2bac-jstree .jstree-wholerow-clicked {
	background: #ffffff !important;
	background: -webkit-linear-gradient(top, #ffffff 0, #ffffff 100%) !important;
	background: linear-gradient(to bottom, #ffffff 0, #ffffff 100%) !important;
}

.modal_d019 .form-row{
	margin-bottom: 0px;
}

.modal_d019 .incorrectAlarm{
	color: #dc3545;
}

.modal_d014_d004 label{
	word-break: break-all;
	white-space: normal;
}
.modal_c004 .row .col-7{
	word-break: break-all;
}
.modal_d010 .b2bac-scroll-table>thead,
.modal_d010 .b2bac-scroll-table div.div-table-thead,
.modal_d011 .b2bac-scroll-table>thead,
.modal_d011 .b2bac-scroll-table div.div-table-thead {
    margin-right: 0px;
}
.modal_d005 .col-form-label{
	word-break: break-all;
}
#b2bac-common-modal-stack div,
#b2bac-common-modal-stack select,
#b2bac-common-modal-stack h3,
#b2bac-common-modal-stack textarea,
#b2bac-common-modal-stack input,
#b2bac-common-modal-stack span,
#b2bac-common-modal-stack pre{
	font-size:18px;
}
#b2bac-common-modal-stack .modal_d005 .form-control{
	height:calc(1.5em + .75rem + 2px);
}
#b2bac-common-modal-stack .modal_c004 .modal-lg,
#b2bac-common-modal-stack .modal_d005 .modal-lg {
    max-width: 900px !important;
}

#b2bac-common-modal-stack .c001Install{
	border-bottom:solid 1px;
}

#b2bac-common-modal-stack .modal_c004 .container{
	word-break: break-all;
}
#b2bac-common-modal-stack .modal_d005 .locationLink{
	border-bottom:solid 1px;
}
#b2bac-common-modal-stack .modal_d005 .modal-body{
	padding-bottom:0px;
}


/* commonmodal内のアイコン大きさ指定 */
.b2bac-common-modal button.bizButton i.fa.text-muted {
    font-size: 20px;
}

.b2bac-common-modal .language-select-drop-down-list {
	text-align-last: center; /* for only chrome */
	height: calc(1.5em + .75rem + 2px);
    background-color: #FFFFFF;
    width: 100%;
}

.b2bac-common-modal .country-select-drop-down-list {
	text-align-last: center; /* for only chrome */
}

#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table div.div-table-th-group>div,
#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table div.div-table-td>div,
#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table div.div-table-td>div>div,
#b2bac-common-modal-stack .modal_d011 .b2bac-modal-table div.div-table-th-group>div,
#b2bac-common-modal-stack .modal_d011 .b2bac-modal-table div.div-table-td>div,
#b2bac-common-modal-stack .modal_d011 .b2bac-modal-table div.div-table-td>div>div  {
    height: 100%;
}
#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table>tbody tr:nth-child(even),
#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table .div-table-tbody div.div-table-tr:nth-child(even),
#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table .div-table-tbody div.div-table-tr.summary-row:nth-child(4n+3),
#b2bac-common-modal-stack .modal_d010 .b2bac-modal-table .div-table-tbody div.div-table-tr:nth-child(4n) div.detail-row {
    background: #ffffff;
}

#b2bac-common-modal-stack .modal_d011 .b2bac-scroll-table>tbody>tr>td,
#b2bac-common-modal-stack .modal_d011 .b2bac-scroll-table div.div-table-tbody div.div-table-td,
#b2bac-common-modal-stack .modal_d011 .b2bac-scroll-table div.div-table-tbody div.div-table-td>div>div,
#b2bac-common-modal-stack .modal_d011 .b2bac-scroll-table .detail-row div.detail-data,
#b2bac-common-modal-stack .modal_d010 .b2bac-scroll-table>tbody>tr>td,
#b2bac-common-modal-stack .modal_d010 .b2bac-scroll-table div.div-table-tbody div.div-table-td,
#b2bac-common-modal-stack .modal_d010 .b2bac-scroll-table div.div-table-tbody div.div-table-td>div>div,
#b2bac-common-modal-stack .modal_d010 .b2bac-scroll-table .detail-row div.detail-data,
#b2bac-common-modal-stack .modal_d028 .b2bac-scroll-table>tbody>tr>td,
#b2bac-common-modal-stack .modal_d028 .b2bac-scroll-table div.div-table-tbody div.div-table-td,
#b2bac-common-modal-stack .modal_d028 .b2bac-scroll-table div.div-table-tbody div.div-table-td>div>div,
#b2bac-common-modal-stack .modal_d028 .b2bac-scroll-table .detail-row div.detail-data,
#b2bac-common-modal-stack .modal_d026 .b2bac-scroll-table>tbody>tr>td,
#b2bac-common-modal-stack .modal_d026 .b2bac-scroll-table div.div-table-tbody div.div-table-td,
#b2bac-common-modal-stack .modal_d026 .b2bac-scroll-table div.div-table-tbody div.div-table-td>div>div,
#b2bac-common-modal-stack .modal_d026 .b2bac-scroll-table .detail-row div.detail-data {
    /* 以下３つの定義がないと、内容が長すぎるとテーブルの形が崩れる */
    word-break: normal ! important;
    overflow: visible ! important;
    white-space: normal;
}

#b2bac-common-modal-stack .modal_d010 .b2bac-scroll-table div.div-table-tbody .resend,
#b2bac-common-modal-stack .modal_d010 .b2bac-scroll-table div.div-table-tbody .requestRc,
#b2bac-common-modal-stack .modal_d026 .b2bac-scroll-table .siteManagement,
#b2bac-common-modal-stack .modal_d026 .b2bac-scroll-table .siteLocation{
	word-break:break-all ! important;
	overflow: visible;
    white-space: normal;
}
#b2bac-common-modal-stack .modal_d026 .incorrectDate,
#b2bac-common-modal-stack .modal_d026 .incorrectEndDate{
	color: #dc3545;
}
.calenderAddPadding{
	margin:0px ! important;
}

.popover h3 {
	margin-top: 0px;
}

#b2bac-common-modal-stack .modal_d019 .d019Tbody select>option {
    color:black;
}