body {
}

h4 {
    margin-top: 20px;
}

/* FontAwesomeなどのアイコンフォントの、文字としての「行高」対応 */
i {
    line-height: 1;
}

.list-area th {
    min-width: 80px;
}


.injection-bk-color {
    background-color: #ffe6e6 !important;
}

.item-cursor-pointer:hover {
    color: #333;
    opacity: 0.5 !important;
}

.item-cursor-pointer {
    cursor: pointer;
}

/*メッセージ帯の閉じるボタンサイズ*/
.btn-close-small {
    font-size: 10px;
}

.btn-width {
    width: 80px;
}

/*横幅*/
.width-80 {
    width: 80px;
}
.width-100 {
    width: 100px;
}
.width-150 {
    width: 150px;
}
.width-170 {
    width: 170px;
}

.width-200 {
    width: 200px;
}


.font-size-xxsmail {
    font-size: xx-small;
}

.display-hide {
    display: none;
}





/* 基本色 */

:root {
    --main-color: #807e7d;
    --main-color-dark: #595857;
    --main-color-deep-dark: #4d4c4b;
    --main-sub-color: #e6e3e1;
}


/* header */
.header-color {
    background-color: var(--main-sub-color);
}








/* 背景色 */


.text-color-dafault {
    color: var(--main-color-dark);
}

.bg-color-dafault {
    color: var(--main-color-dark);
}

.bg-default {
    background-color: var(--main-color-deep-dark);
}
.bg-default-subtle {
    background-color: var(--main-sub-color);
}
/* button */
.btn-default {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--main-color);
    --bs-btn-border-color: var(--main-color-dark);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--main-color-dark);
    --bs-btn-hover-border-color: var(--main-color-deep-dark);
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--main-color-deep-dark);
    --bs-btn-active-border-color: #51585e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #6c757d;
    --bs-btn-disabled-border-color: #6c757d;
}

.btn-outline-default {
    --bs-btn-color: var(--main-color);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: var(--main-color-dark);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--main-color);
    --bs-btn-hover-border-color: var(--main-color-dark);
    --bs-btn-focus-shadow-rgb: 108, 117, 125;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--main-color-dark);
    --bs-btn-active-border-color: var(--main-color-deep-dark);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #6c757d;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #6c757d;
    --bs-gradient: none;
}

.btn-alert {
    --bs-btn-color: #fff;
    --bs-btn-bg: #ec6d71;
    --bs-btn-border-color: #ed474d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ed474d;
    --bs-btn-hover-border-color: #ed2f36;
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #ed2f36;
    --bs-btn-active-border-color: #ed2f36;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #6c757d;
    --bs-btn-disabled-border-color: #6c757d;
}

/* border */
.border-default {
    border-color: var(--main-color) !important;
}



/* 検知ステータス */
.detect-status {
    color: #fddea5;
}

/* 並べ替え設定 */
/* ドラッグ中の行全体の影 */
.ui-sortable-helper {
    background-color: white !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    opacity: 0.9;
}





/*画面解像度によって表示画面サイズを変更する*/

@media (max-width: 768px) {
    .width-md-50 {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .width-md-50 {
        width: 50%;
    }
}

@media (max-width: 992px) {
    .width-lg-50 {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .width-lg-50 {
        width: 50%;
    }
}

/* 点滅 */
.blinking {
    -webkit-animation: blink 1.5s ease-in-out infinite alternate;
    -moz-animation: blink 1.5s ease-in-out infinite alternate;
    animation: blink 1.5s ease-in-out infinite alternate;
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


/* 影赤点滅 */
@keyframes alert-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.4);
        border-color: rgba(220, 53, 69, 0.8);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(220, 53, 69, 0);
        border-color: rgba(220, 53, 69, 0.2);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0);
        border-color: rgba(220, 53, 69, 0.8);
    }
}

.alert-warning-blink {
    border: 2px solid #dc3545 ; /* BootstrapのDanger色 */
    animation: alert-pulse 2s infinite !important;
}