@charset "utf-8";

/* 全体的な設定 */
body {
    font-size: 14px;
    font-family: "Noto Sans JP", "Helvetica Neue", Helvetica, Arial, "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

/* フォーム */
form {
    margin: 0px;
}

/* アンカー */
a {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}

/* ラベル */
label {
    font-size: 14px;
    font-weight: bold;
    margin: 0px;
}

/* ホバー時にカーソルを変える */
.hover_cursor_pointer:hover {
    cursor: pointer;
}

/* インプットボックス */
input[type="text"] {
    font-size: 14px;
    padding: 0px 10px;
    margin: 0px;
}
input[type="password"] {
    font-size: 14px;
    padding: 0px 10px;
    margin: 0px;
}
input[type="date"] {
    font-size: 14px;
    padding: 0px 10px;
    width: auto;
    margin: 0px;
}
input[type="file"] {
    font-size: 14px;
    padding: 0px 10px;
    margin: 0px;
}
input[type="file"] + img {
    /* file の隣の img の垂直配置 */
    vertical-align: middle;
}
input[type="checkbox"] {
    margin: 0px;
    transform: scale(1.5);
}
input[type="checkbox"] + label {
    /* checkbox の隣の label は横に並べて配置する */
    display: inline-block;
}

/* テキストエリア */
textarea {
    font-size: 14px;
    padding: 10px;
    margin: 0px;
    height: 100px;
}

/* セレクトボックス */
select {
    font-size: 14px;
    margin: 0px;
    height: 30px;
    width: auto;
}

/* ボタン */
button {
    /* マテリアルデザインで勝手に大文字になるのを防止する */
    text-transform: none;
    /* 基本のフォント設定 */
    height: auto;
    font-weight: normal;
    font-size: 14px;
    border: none;
    box-shadow: 2px 2px 5px gray;
    margin: 0px;
}
.button_blue {
    color: white;
    background-color: #418AB3;
}
.button_green {
    color: white;
    background-color: #A6B727;
}
.button_white {
    color: gray;
    background-color: white;
}

/* テキストの色 */
.text_red {
    color: red;
}

/* 必須マーク */
.required_mark {
    color: red;
    padding: 0px 10px;
}

/* 説明書き */
.explanation {
    font-size: 12px;
}

/* フラッシュメッセージ */
.flash_area {
    margin: 20px 0px;
}
.flash-danger {
    color: red;
}
.flash-success {
    color: #A6B727;
}

/* ----------------------------------------- */

/* ログイン */

/* ロゴエリア */
#login_logo_area {
    text-align: center;
    padding: 50px 0px;
    border-bottom: 5px solid #A6B727;
}

/* 入力エリア */
#login_input_area {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0px;
}

/* フォームエリア */
#login_form_area {
    width: 400px;
}
.login_form_item {
    margin-bottom: 20px;
}
.login_form_button {
    margin-bottom: 40px;
}

/* Submit ボタン */
#login_submit_button {
    width: 100%;
    font-size: 20px;
    margin-top: 50px;
    padding: 10px 0px;
}

/* ----------------------------------------- */

/* フッター */

/* ログイン画面用 */
#footer_copyright_login {
    color: #D7DE9A;
    font-size: 12px;
    text-align: center;
    margin-top: 40px;
}

/* ログイン画面以外 */
footer {
    font-size: 12px;
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px 0px;
    background-color: #A6B727;
    color: white;
    z-index: 999;
}

/* ----------------------------------------- */

/* loading */

#loader-bg {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: #000000;
    z-index: 99998;
    opacity: 0.6;
}

#loader {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    margin-top: -100px;
    margin-left: -100px;
    text-align: center;
    color: #ffffff;
    z-index: 99999;
}

/* ----------------------------------------- */

/* 検索エリア */
.search_area {
    background-color: white;
    padding: 20px 10px;
    /* display: flex; */
    /* position: fixed; */
    width: 100%;
    z-index: 999;
}
.search_condition {
    padding: 0px 20px;
}
.search_condition label {
    margin-right: 20px;
}
.search_condition_table {
    display: flex;
    align-items: center;
    margin: 5px 0px;
}
.search_condition_table .th {
    text-align: right;
    flex-basis: 150px;
    padding: 2px 5px;
    display: block;
}
.search_condition_table .th div {
    width: 100%;
    text-align: right;
}
.search_condition_table .td {
    flex-basis: auto;
    padding: 2px 5px;
    display: flex;
    align-items: center;
}
.search_condition_table .td div {
    width: 100%;
}

/* ----------------------------------------- */

/* 一覧エリア */
.list_area {
    padding: 20px 20px 60px 20px;
}

/* ----------------------------------------- */

/* dataTables */

/* 文字寄せ */
.dt-left {
    text-align: left !important;
}
.dt-right {
    text-align: right !important;
}
.dt-center {
    text-align: center !important;
}

/* ヘッダのスタイルを変更 */
.dataTable th {
    background-color: #A6B727 !important;
    color: white !important;
}

/* background-color を透明にする */
div.dt-scroll div.dtfc-top-blocker, div.dt-scroll div.dtfc-bottom-blocker, div.dtfh-floatingparent div.dtfc-top-blocker, div.dtfh-floatingparent div.dtfc-bottom-blocker {
    background-color: transparent !important;
}
table.dataTable thead tr>.dtfc-fixed-start, table.dataTable thead tr>.dtfc-fixed-end, table.dataTable tfoot tr>.dtfc-fixed-start, table.dataTable tfoot tr>.dtfc-fixed-end {
    background-color: transparent !important;
}
table.dataTable tbody tr>.dtfc-fixed-start, table.dataTable tbody tr>.dtfc-fixed-end {
    background-color: transparent !important;
}

/* ページングボタンの調整 */
div.dt-container .dt-paging .dt-paging-button {
    padding: 0px 10px;
    margin: 2px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
div.dt-container .dt-paging .dt-paging-button.current {
    background-color: #A6B727;
    color: white !important;
}
div.dt-container .dt-paging .dt-paging-button.current:hover, 
div.dt-container .dt-paging .dt-paging-button.disabled:hover,
div.dt-container .dt-paging .dt-paging-button:hover {
    background-color: #606c76 !important;
    border-color: gray;
    color: white !important;
    background: transparent;
}

/* 画像を垂直中央寄せにする */
.dataTable img {
    vertical-align: middle;
}

/* ----------------------------------------- */

/* ダイアログ */

/* ダイアログ全体の設定 */
.ui-dialog {
    font-family: inherit !important;  /* Body の設定を使用 */
    background-color: #f0f8ff;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3); /* 影を追加 */
    padding: 0px;
    border: none !important;
}

/* ダイアログ内の入力部品の設定 */
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
    font-family: inherit !important;  /* Body の設定を使用 */
}

/* ダイアログ内のコンテンツの余白 */
.ui-dialog-content {
    padding: 0px !important;
}

/* ダイアログのタイトル部分を消す */
.ui-dialog-titlebar {
    display: none;
}

/* オーバーレイの設定 */
.ui-widget-overlay {
    z-index: 9999 !important;  /* 他の要素よりも上に */
    background: rgba(0, 0, 0, 0.9) !important;  /* 色を濃く */
}

.dialog_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 10px;
    background-color: gray;
    color: white;
    line-height: normal;
}
.dialog_title img {
    vertical-align: middle;
}
.dialog_body {
    padding: 10px;
}
.dialog_row {
    margin: 10px 0px;
}
.dialog_row.flex {
    display: flex;
}
.dialog_row.center {
    text-align: center;
}
.dialog_row_table {
    display: flex;
    align-items: center;
}
.dialog_row_table.top {
    align-items: flex-start;
}
.dialog_row_table .th {
    /* flex-basis: 30%; */
    flex-basis: 220px;
    padding: 2px 5px;
    display: block;
}
.dialog_row_table .th div {
    width: 100%;
    text-align: right;
}
.dialog_row_table .td {
    flex-basis: 100%;
    padding: 2px 5px;
    display: block;
}
.dialog_row_table .td div {
    width: 100%;
}
.dialog_row_table .td .explain {
    color: red;
    font-size: 10px;
}
.dialog_row_table table {
    margin: 0px;
}
.dialog_row_table table th {
    padding: 0px;
}
.dialog_row_table table td {
    padding: 1px;
    vertical-align: top;
}


/* ----------------------------------------- */

/* ボタンのデザイン */

/* 丸みの少ないボタン */
.btn_less_rounded_button {
    color: white;
    background-color: #A6B727;
    border-radius: 5px;
    margin-left: 20px;
}
.btn_less_rounded_button.red {
    background-color: red;
}
.btn_less_rounded_button:hover {
    background-color: #606c76;
}
.btn_less_rounded_button img {
    margin-left: 10px;
    vertical-align: middle;
}

/* ----------------------------------------- */

/* スタブ用 */
.stub_area {
    padding: 20px 20px 60px 20px;
}
.stub_area div {
    margin: 10px 0px;
}
.stub_area .flex {
    display: flex;
}
.stub_area .flex label {
    margin-right: 10px;
}
.stub_area .flex input[type="radio"] {
    margin-right: 5px;
}
.stub_area pre {
    margin: 0px;
    padding: 10px;
}