/* Global Application Css */

/* -------------------------------------------------------------------- */
/* システム共通 */
/* -------------------------------------------------------------------- */

html {
    --base-color: #F5FFFA;
    --max-width: 1000px;
    font-size: 16px;
}

/*システム共通フォント*/
body {
    font-family: "MS Mincho", "Hiragino Mincho Pro" !important;
}

/*システム共通カラー*/
:root {
    --SysMainColorTitle: #008000; /*システムメインカラー タイトル用*/
    --SysMainColorBack: #F0FFF0; /*システムメインカラー 背景用*/
    --SysSubColorBack: #FFFFE0; /*システムサブカラー 背景用*/
    --bg-color-inp: #E0FFFF; /*背景色 - 入力欄*/
    --bg-color-read: #FFFFFF; /*背景色 - 読み取り専用項目*/
    --bg-color-disabled: #F0F0F0; /*背景色 - 非活性欄*/
    --bg-color-inpLbl: #00008B; /*背景色 - 入力欄-項目名*/
    --bg-color-outLbl: #FFEBCD; /*背景色 - 読み取り専用欄-項目名*/
    --bg-color-Type1Lbl: #FFFF00; /*背景色 - 項目種別1-項目名*/
    --bg-color-Type2Lbl: #00E000; /*背景色 - 項目種別2-項目名*/
    --bg-color-button: #F0F0F0; /*背景色 - ボタン*/
    --bg-color-dialog: #F7B74D; /*背景色 - ダイアログタイトル*/
    --border-color: #808080; /*罫線色*/
    --font-color-SysInfo: #000080; /*文字色-システム情報用*/
    --font-color-AreaTitle: #0000FF; /*文字色-領域タイトル用*/
    --font-color-ErrNew: #FF0000; /*文字色-新規orエラー*/

    --mud-default-borderradius: 4px; /*標準の角丸*/
}

/* -------------------------------------------------------------------- */
/* レイアウト配置用 */
/* -------------------------------------------------------------------- */
/*行表示*/
.flexRow {
    display: flex;
    flex-direction: row;
}

/*行表示 - 中央揃え*/
.flexRowCenter {
    display: flex;
    flex-direction: row;
    align-items: center;
}

/*行表示 - 右寄せ*/
.flexRowEnd {
    display: flex;
    flex-direction: row;
    margin: 0px 0px 0px auto;
}

/*列表示*/
.flexColumn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/*1行あける*/
.flexSpace {
    flex: 1;
}

/* -------------------------------------------------------------------- */
/* ヘッダ部共通配置用 */
/* -------------------------------------------------------------------- */
/*トップエリア*/
#TopArea {
    width: 100%;
    margin: 5px;
}

/*タイトル*/
#Title {
    font-size: 1.1rem;
    font-weight: bolder;
    color: var(--SysMainColorTitle);
}

/* リモート支援ラベル */
#RemoteLabel {
    height: 26px;
    width: 140px;
    font-size: 1.1rem;
    font-weight: bold;
    margin: 0px 5px 0px 5px;
    text-align: center;
    background: #126CD5;
    color: white;
    border-radius: var(--mud-default-borderradius);
}

/* リモート支援ボタン */
.remoteButton {
    height: 26px;
    width: 120px;
    margin-left: 5px;
    padding: 2px 16px 2px 16px;
    background: var(--bg-color-button);
    color: var(--font-color-SysInfo);
    font-size: 1.1rem;
    border-color: black;
    border-style: solid;
    border-width: 1px;
}

#LineSpace {
    height: 7px;
}

/* 教会ラベル */
#SelectKyokaiLabel {
    height: 26px;
    width: 90px;
    padding-top: 2px;
    font-size: 1rem;
    margin: 0px 1px 0px 0px;
    text-align: center;
    background-color: var(--SysMainColorTitle);
    color: white;
    border-radius: var(--mud-default-borderradius);
}

/* 教会メニュー 選択教会*/
.selectKyokai {
    width: 250px;
    margin: 0px 5px 0px 0px;
}

    .selectKyokai #SelectKyokai {
        height: 26px;
        font-size: 1rem;
        padding: 0px 0px 0px 5px;
        color: var(--font-color-SysInfo);
    }

/* 操作者ラベル */
#LoginUserLabel {
    height: 26px;
    width: 90px;
    padding-top: 2px;
    font-size: 1rem;
    margin: 0px 1px 0px 0px;
    text-align: center;
    background-color: var(--SysMainColorTitle);
    color: white;
    border-radius: var(--mud-default-borderradius);
}

/* 操作者 */
.loginUser {
    width: 320px;
}

    .loginUser #LoginUser {
        height: 26px;
        font-size: 1rem;
        padding: 0px 0px 0px 5px;
        color: var(--font-color-SysInfo);
    }

/* 終了ボタン */
.endButton {
    height: 26px;
    width: 220px;
    font-size: 1.1rem;
    background: var(--bg-color-button);
    color: red;
    font-weight: bold;
    border-style: solid;
    border-width: 1px;
}

/* 機能ボタンエリア */
#FunctionButtonArea {
    width: 100%;
    margin: 0px 5px 0px 5px;
    padding: 5px 5px 5px 0px;
    background-color: var(--SysMainColorBack);
    border-color: var(--SysMainColorTitle);
    border-style: solid;
    border-width: 1px;
    border-radius: var(--mud-default-borderradius);
}

/*  ヘッダーエリア */
#HeaderArea {
    width: 100%;
    margin: 5px;
    height: 75px;
}

/*  条件エリア */
.JyokenArea {
    padding: 5px;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--mud-default-borderradius);
}

/* -------------------------------------------------------------------- */
/*コントロール共通設定 */
/* -------------------------------------------------------------------- */
/*ラベル */
/* -------------------------------------------------------------------- */

/*MudTextの共通フォントサイズ*/
.mud-typography {
    font-size: 0.9rem;
}

/* ヘルプメッセージ */
.Msg {
    font-size: 0.85rem;
    line-height: 1.3;
    border: 1px var(--border-color) solid;
    background-color: var(--SysMainColorBack);
    overflow-y: auto;
    border-radius: var(--mud-default-borderradius);
}

#HelpMsg {
    font-size: 0.85rem;
    margin: 0px;
    padding: 3px 10px 3px 10px;
    color: var(--font-color-SysInfo);
    white-space: pre-wrap;
}

#ErrMsg {
    font-size: 0.85rem;
    margin: 0px;
    padding: 0px 10px 0px 10px;
    color: red;
    white-space: pre-wrap;
}

/* ラベル「条件」 */
.JyokenTitle {
    font-weight: bold;
    text-align: left;
    color: blue;
    margin-bottom: 1px;
    font-size: 0.9rem;
}
/* ラベル　条件項目名等 */
.JyokenLabel {
    width: 60px;
    margin-right: 10px;
    text-align-last: justify;
    font-size: 0.9rem;
}

/* ラベル「表示件数」等(幅：中) */
.JyokenLabel2 {
    width: 60px;
    font-size: 0.9rem;
    text-align: center;
}
/* ラベル「～」等(幅：小) */
.JyokenLabel3 {
    width: 30px;
    font-size: 0.9rem;
    text-align: center;
}

/*ラベル　領域名「入力欄」「明細欄」等*/
.AreaTitle {
    font-size: 1.1rem;
    font-weight: bold;
}

/* セル用ラベル (共通) */
.InputLabel, .OutputLabel, .Type1Label, .Type2Label {
    font-size: 0.9rem;
    text-align: center;
    border-radius: 0 !important;
}

/* 入力セル用ラベル */
.InputLabel {
    color: white !important;
    background-color: var(--bg-color-inpLbl) !important;
    white-space: nowrap;
}
/* 参照セル用ラベル */
.OutputLabel {
    color: black !important;
    background-color: var( --bg-color-outLbl) !important;
}
/* 項目分類1用ラベル */
.Type1Label {
    background-color: var(--bg-color-Type1Lbl) !important;
    color: black;
}
/* 項目分類2用ラベル */
.Type2Label {
    background-color: var(--bg-color-Type2Lbl) !important;
    color: black;
}


/* -------------------------------------------------------------------- */
/* 入力項目 */
/* -------------------------------------------------------------------- */
/* 入力可能 */
/* -------------------------------------------------------------------- */
.InpL {
    background-color: var( --bg-color-inp) !important;
    padding: 0px 0px 0px 3px !important;
    text-align: left !important;
    align-items: center !important;
}

    .InpL .mud-input-root {
        padding: 0px 0px 0px 3px !important;
        text-align: left !important;
        align-items: center !important;
    }

    .InpL .mud-input-slot {
        font-size: 0.9rem !important;
    }

    .InpL .mud-input-underline::before,
    .InpL .mud-input-underline::after {
        border-bottom: none !important;
    }

.InpC {
    background-color: var( --bg-color-inp) !important;
    text-align: center !important;
    align-items: center !important;
}

    .InpC .mud-input-root {
        text-align: center !important;
        align-items: center !important;
    }

    .InpC .mud-input-slot {
        font-size: 0.9rem !important;
    }

    .InpC .mud-input-underline::before,
    .InpC .mud-input-underline::after {
        border-bottom: none !important;
    }

.InpR,
.InpPageNo {
    background-color: var( --bg-color-inp) !important;
    padding: 0px 3px 0px 0px !important;
    text-align: right !important;
    align-items: center !important;
}

    .InpR .mud-input-root,
    .InpPageNo .mud-input-root {
        padding: 0px 3px 0px 0px !important;
        text-align: right !important;
        align-items: center !important;
    }

    .InpR .mud-input-slot, .InpPageNo .mud-input-slot {
        font-size: 0.9rem !important;
    }

    .InpR .mud-input-underline::before, .InpPageNo .mud-input-underline::before, .InpR .mud-input-underline::after, .InpPageNo .mud-input-underline::after {
        border-bottom: none !important;
    }

.InpPageNo {
    margin-left: 2px;
    border: 1px solid var(--border-color) !important;
    width: 70px;
    border-radius: var(--mud-default-borderradius);
}

/* -------------------------------------------------------------------- */
/* 読み取り専用 */
/* -------------------------------------------------------------------- */
.ReadL {
    background-color: var( --bg-color-read) !important;
    padding: 0px 0px 0px 3px !important;
    text-align: left !important;
    align-items: center !important;
}

    .ReadL .mud-input-root {
        padding: 0px 0px 0px 3px !important;
        text-align: left !important;
        align-items: center !important;
    }

    .ReadL .mud-input-slot {
        font-size: 0.9rem !important;
    }

    .ReadL .mud-input-underline::before,
    .ReadL .mud-input-underline::after {
        border-bottom: none !important;
    }

.ReadC {
    background-color: var( --bg-color-read) !important;
    text-align: center !important;
    align-items: center !important;
}

    .ReadC .mud-input-root {
        text-align: center !important;
        align-items: center !important;
    }

    .ReadC .mud-input-slot {
        font-size: 0.9rem !important;
    }

    .ReadC .mud-input-underline::before,
    .ReadC .mud-input-underline::after {
        border-bottom: none !important;
    }

.ReadR {
    background-color: var( --bg-color-read) !important;
    padding: 0px 3px 0px 0px !important;
    text-align: right !important;
    align-items: center !important;
}

    .ReadR .mud-input-root {
        padding: 0px 3px 0px 0px !important;
        text-align: right !important;
        align-items: center !important;
    }

    .ReadR .mud-input-slot {
        font-size: 0.9rem !important;
    }

    .ReadR .mud-input-underline::before,
    .ReadR .mud-input-underline::after {
        border-bottom: none !important;
    }
/* -------------------------------------------------------------------- */
/* 非活性 */
/* -------------------------------------------------------------------- */
.DisabledL {
    background-color: var( --bg-color-disabled) !important;
    padding: 0px 0px 0px 3px !important;
    text-align: left !important;
    align-items: center !important;
}

    .DisabledL .mud-input-root {
        padding: 0px 0px 0px 3px !important;
        text-align: left !important;
        align-items: center !important;
    }

    .DisabledL .mud-input-slot {
        font-size: 0.9rem !important;
        color: black !important;
    }

    .DisabledL .mud-input-underline::before,
    .DisabledL .mud-input-underline::after {
        border-bottom: none !important;
    }

.DisabledC {
    background-color: var( --bg-color-disabled) !important;
    text-align: center !important;
    align-items: center !important;
}

    .DisabledC .mud-input-root {
        text-align: center !important;
        align-items: center !important;
    }

    .DisabledC .mud-input-slot {
        font-size: 0.9rem !important;
        color: black !important;
    }

    .DisabledC .mud-input-underline::before,
    .DisabledC .mud-input-underline::after {
        border-bottom: none !important;
    }

.DisabledR {
    background-color: var( --bg-color-disabled) !important;
    padding: 0px 3px 0px 0px !important;
    text-align: right !important;
    align-items: center !important;
}

    .DisabledR .mud-input-root {
        padding: 0px 3px 0px 0px !important;
        text-align: right !important;
        align-items: center !important;
    }

    .DisabledR .mud-input-slot {
        font-size: 0.9rem !important;
        color: black !important;
    }

    .DisabledR .mud-input-underline::before,
    .DisabledR .mud-input-underline::after {
        border-bottom: none !important;
    }

/* -------------------------------------------------------------------- */
/*ボタン */
/* -------------------------------------------------------------------- */

/* ボタン共通デザイン*/
.MenuBtn1, .MenuBtn2, .MenuBtn3, .MenuBtn4, .MenuBtn5, .MenuBtn6,
.SearchButton, .PageButton, .DelDetailBtn, .DetailBtn, .DetailInputButton {
    font-size: 1rem;
    padding: 1px 0px 0px 0px;
    line-height: 1.1;
    background: var(--bg-color-button);
    border-style: solid;
    border-width: 1px;
    font-weight: bold;
}

/*通常機能ボタン*/
.MenuBtn1 {
    margin-left: 5px;
    height: 38px;
    width: 120px;
}

/*赤色機能ボタン(削除関連)*/
.MenuBtn2 {
    margin-left: 5px;
    height: 38px;
    width: 120px;
    color: red;
}

/*オレンジ色機能ボタン(状態変更関連)*/
.MenuBtn3 {
    margin-left: 5px;
    height: 38px;
    width: 120px;
    color: #FD7E00;
}

/*青色機能ボタン(登録関連)*/
.MenuBtn4 {
    margin-left: 5px;
    height: 38px;
    width: 120px;
    color: blue;
}

/*表示(条件抽出)ボタン*/
.SearchButton {
    height: 38px;
    width: 80px;
}

/* ページ移動ボタン (前頁・次頁) */
.PageButton {
    width: 70px;
    height: 25px;
    font-size: 0.8rem;
    font-weight: normal;
}

/* 詳細・内訳入力ボタン */
.DetailInputButton {
    width: 120px;
    height: 25px;
    font-size: 0.8rem;
    border: 1px solid;
}

.mud-button-root.DetailInputButton:hover {
    background-color: var(--bg-color-inp) !important;
    border-color: var(--border-color) !important;
}

    .mud-button-root.DetailInputButton:hover .mud-button-label {
        color: black !important;
    }

/* 一覧-削除ボタン */
.DelDetailBtn {
    font-size: 0.8rem;
    color: red;
}
/* 詳細ボタン */
.DetailBtn {
    min-width: 58px;
    width: 58px;
    height: 25px;
    font-size: 0.8rem;
}

/* 「▲ページの先頭へ」リンク*/
.PageTopMove {
    width: 170px;
    color: blue;
    text-decoration: underline;
}

/* -------------------------------------------------------------------- */
/*コンボボックス */
/* -------------------------------------------------------------------- */
/* 共通コンボボックス */
.SelectItem {
    height: 24px;
    background-color: var(--bg-color-inp);
    border-radius: var(--mud-default-borderradius); /* 好きな角丸 */
    overflow: hidden;
}

    .SelectItem .mud-input-root {
        padding-top: 1px !important;
        padding-bottom: 0px !important;
    }

    .SelectItem .mud-input-root,
    .SelectItem .mud-select-input {
        height: 24px;
        font-size: 0.9rem;
    }

    .SelectItem .mud-input.mud-input-outlined.mud-input-adorned-end {
        padding-right: 5px;
        padding-inline-end: 5px;
        padding-inline-start: unset;
    }

    .SelectItem .mud-input-outlined-border {
        border: 1px var(--border-color) solid !important;
    }

.SelectItems .mud-list-item-text p {
    font-size: 0.9rem;
}

/* 年コンボボックス */
.SelectYear {
    width: 130px;
}

/* 月コンボボックス */
.SelectMonth {
    width: 100px;
}

/* -------------------------------------------------------------------- */
/*チェックボックス */
/* -------------------------------------------------------------------- */
/* 条件-チェックボックス */
.ChkJoken label, .ChkJoken div {
    height: 20px;
}

.ChkJoken p {
    line-height: 20px;
}

/* 明細行-チェックボックス */
.ChkDetail span {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.ChkDetail .mud-input-control-input-container {
    margin: auto;
}

.ChkDetail .mud-button-root {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

/*全選択・全解除用チェックボックス*/
.ChkJoken .mud-checkbox .mud-icon-root,
.ChkDetail .mud-checkbox .mud-icon-root,
.AllCheck .mud-checkbox .mud-icon-root {
    background-color: white !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    border-radius: var(--mud-default-borderradius);
}

.ChkJoken .mud-input-control-input-container,
.ChkDetail .mud-input-control-input-container,
.AllCheck .mud-input-control-input-container {
    margin: auto;
}

/* -------------------------------------------------------------------- */
/*ラジオボタン */
/* -------------------------------------------------------------------- */
.RadioJoken label, .RadioJoken div {
    height: 20px;
}

.RadioJoken p {
    line-height: 20px;
    font-size: 0.9rem;
}

.RadioJoken .mud-icon-root {
    border-radius: 999px !important;
    background: #FFFFFF !important;
}

/* -------------------------------------------------------------------- */
/*日付項目 */
/* -------------------------------------------------------------------- */
.InputDate {
    border-radius: var(--mud-default-borderradius);
}

    .InputDate .mud-input {
        height: 20px;
    }

/* ヘッダー(年月＋ナビ)を非表示 */
.mud-picker-toolbar {
    display: none !important;
}
/* -------------------------------------------------------------------- */
/*一覧 */
/* -------------------------------------------------------------------- */

/* 通常一覧用 - 固定行,スクロールなし*/
.mud-table-detail table,
.mud-table-detail thead,
.mud-table-detail tbody,
.mud-table-detail tr,
.mud-table-detail th,
.mud-table-detail td {
    border: 0 !important;
}

.mud-table-detail table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}

.mud-table-detail th,
.mud-table-detail td {
    border: 1px solid var(--border-color) !important;
}

/* 一覧用 - 固定行,スクロールあり*/
/* 外枠(div)：スクロールさせない */
.mud-table-detail-container {
    border: 1px solid var(--border-color);
    background: var(--mud-palette-surface);
    overflow: hidden;
}
/* スクロールはMudTable内部 */
.mud-table-detail-sc .mud-table-container {
    overflow: auto;
    padding-top: 0 !important;
    padding-bottom: 0 !important; /* 透け/隙間対策 */
    border-top: 0 !important;
    border-bottom: 0 !important; /* 透け/隙間対策 */
}
/* テーブル */
.mud-table-detail-sc table {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}
/* 通常セル罫線 */
.mud-table-detail-sc th,
.mud-table-detail-sc td {
    border-right: 1px solid var(--border-color) !important;
    border-bottom: 1px solid var(--border-color) !important;
}
    /* 左端・上端は外枠に任せる */
    .mud-table-detail-sc th:first-child,
    .mud-table-detail-sc td:first-child {
        border-left: 0 !important;
    }

.mud-table-detail-sc thead th {
    border-top: 0 !important;
}
/* 固定ヘッダ：不透明（th＋中身）＋境界線は疑似要素で描く */
.mud-table-detail-sc thead th {
    position: sticky;
    top: 0;
    z-index: 30;
    box-shadow: none !important;
    background: var(--bg-color-outLbl) !important;
}

    .mud-table-detail-sc thead th .mud-table-cell {
        background: var(--bg-color-outLbl) !important;
    }

    .mud-table-detail-sc thead th.InputLabel {
        position: sticky;
        top: 0;
        z-index: 30;
        box-shadow: none !important;
        background: var(--bg-color-inpLbl) !important;
    }

        .mud-table-detail-sc thead th.InputLabel .mud-table-cell {
            background: var(--bg-color-inpLbl) !important;
        }

    .mud-table-detail-sc thead th.Type1Label {
        position: sticky;
        top: 0;
        z-index: 30;
        box-shadow: none !important;
        background: var(--bg-color-Type1Lbl) !important;
    }

        .mud-table-detail-sc thead th.Type1Label .mud-table-cell {
            background: var(--bg-color-Type1Lbl) !important;
        }

    .mud-table-detail-sc thead th.Type2Label {
        position: sticky;
        top: 0;
        z-index: 30;
        box-shadow: none !important;
        background: var(--bg-color-Type2Lbl) !important;
    }

        .mud-table-detail-sc thead th.Type2Label .mud-table-cell {
            background: var(--bg-color-Type2Lbl) !important;
        }

    .mud-table-detail-sc thead th::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 1px;
        background: var(--border-color);
    }
/* 固定フッタ：不透明（td＋中身）＋境界線は疑似要素で描く */
.mud-table-detail-sc tfoot td.OutputLabel {
    position: sticky;
    bottom: 0;
    z-index: 30;
    box-shadow: none !important;
    background: var(--bg-color-outLbl) !important;
    color: black;
}

    .mud-table-detail-sc tfoot td .OutputLabel.mud-table-cell {
        background: var(--bg-color-outLbl) !important;
        color: black;
    }

.mud-table-detail-sc tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 30;
    box-shadow: none !important;
    background: var(--mud-palette-surface) !important;
}

    .mud-table-detail-sc tfoot td .mud-table-cell {
        background: var(--mud-palette-surface) !important;
    }

    .mud-table-detail-sc tfoot td::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 1px;
        background: var(--border-color);
    }


/* 一覧用 - マウスオーバー時背景色変更*/
.mud-table-body tr.Row:not(.Row-Selected):hover > td {
    background-color: #F0FFF0 !important;
}
/* 一覧用 - 選択行背景色変更*/
.Row-Selected td {
    background-color: #DBFF8E !important;
}

/* 0件時：NoRecords行(=tbody内)とtfootの罫線だけ消す（theadは残す） */
.no-lines .mud-table-container tbody td,
.no-lines .mud-table-container tbody th,
.no-lines .mud-table-container tfoot td,
.no-lines .mud-table-container tfoot th {
    border: 0 !important;
    box-shadow: none !important;
}

/*特定項目に線を引く*/
.OnBorder {
    border: 1px solid var(--border-color) !important;
}
/*特定項目の線を消す*/
.OffBorder {
    border: none !important;
}

td.OffBorder,
th.OffBorder {
    border: none !important;
}

/* -------------------------------------------------------------------- */
/*モーダル画面(ダイアログ) */
/* -------------------------------------------------------------------- */
/* ダイアログエリア */
.DialogArea {
    max-width: none !important;
}
    /* 余白制限 */
    .DialogArea .mud-dialog-title {
        padding: 3px !important;
    }

    .DialogArea .mud-dialog-content {
        padding: 16px !important;
    }

/* ダイアログ.タイトル */
.Dialog-Title {
    height: 32px;
    line-height: 32px;
    font-size: 1rem;
    font-weight: bold;
    color: white;
    background: var(--bg-color-dialog) !important;
    border-radius: var(--mud-default-borderradius);
}

/* -------------------------------------------------------------------- */
/*オートコンプリート */
/* -------------------------------------------------------------------- */
.AutoCompleteItem {
    background-color: var(--bg-color-inp);
    border-radius: var(--mud-default-borderradius); /* 好きな角丸 */
    overflow: hidden;
    min-width: 300px !important;
    max-width: 800px !important;
}
    .AutoCompleteItem .mud-list-item {
        min-height: 24px !important;
        padding: 0px 0px 0px 5px;
        white-space: normal;
        word-break: break-word;
    }