body {
    display: block;
    text-align: left;
}

main {
    padding-top: 80px; /* ヘッダーの高さに合わせる */
    padding-right: 20px;
    padding-left: 20px;
}

@media (max-width: 992px) {
    main {
        padding-top: 60px; /* ヘッダーの高さに合わせる */
        padding-right: 10px;
        padding-left: 10px;
    }
}
    footer {
        background-color: #ff8000;
        color: #fff;
        text-align: center;
        height: 70px;
    }

    body,
    #wrapper {
        min-height: 90vh; /*内容領域における高さ最小値を指定*/
    }

    /*基本のボタン*/
.btn-square-pop {
    border: none;
    font-size: 1.2rem;
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #FFF;
    background: #fd9535; /*背景色*/
    border-bottom: solid 2px #d27d00; /*少し濃い目の色に*/
    border-radius: 4px; /*角の丸み*/
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
    font-weight: bold;
    padding: 0.4rem 1.2rem;
}
        .btn-square-pop:hover {
            color: #FFF;
            background: #c15019; /*背景色*/
            border-bottom: solid 2px #a0640b; /*少し濃い目の色に*/
        }

    /* 赤　ボタン*/

.btn-red-pop {
    border: none;
    font-size: 1.2rem;
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #FFF;
    background: #f62f2f; /*背景色*/
    border-bottom: solid 2px #b00b15; /*少し濃い目の色に*/
    border-radius: 4px; /*角の丸み*/
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
    font-weight: bold;
    padding: 0.4rem 1.2rem;
}

    .btn-red-pop:hover {
        color: #FFF;
        background: #ad1414; /*背景色*/
        border-bottom: solid 2px #970e16; /*少し濃い目の色に*/
    }

    /* 青　ボタン*/
.btn-blue-pop {
    border: none;
    font-size: 1.2rem;
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #FFF;
    background: #2e66ff; /*背景色*/
    border-bottom: solid 2px #0b5ab0; /*少し濃い目の色に*/
    border-radius: 4px; /*角の丸み*/
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
    font-weight: bold;
    padding: 0.4rem 1.2rem;
}
        .btn-blue-pop:hover {
            color: #FFF;
            background: #1637a5; /*背景色*/
            border-bottom: solid 2px #0e2c80; /*少し濃い目の色に*/
        }

/*ボタン点滅用*/
.btn-news {
    animation: blink 0.8s ease-in-out infinite alternate;
}
/*（不透明度）が0（非表示）、終了時には1（表示）*/
@keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
    /* */
    [draggable] {
        user-select: none;
    }

    #wayPointColumns {
        list-style-type: decimal;
    }

    .column {
        width: 200px;
        padding-bottom: 5px;
        padding-top: 5px;
        text-align: left;
        cursor: move;
    }

        .column item {
            height: 20px;
            width: 200px;
        }

        .column.over {
            border-top: 2px solid blue;
        }

    /*ローディング*/
    #overlay {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999; /* 重なり順指定 */
        width: 100%;
        height: 100%;
        display: none;
        background: rgba(0,0,0,0.6);
    }

    .cv-spinner {
        height: 100%;
        display: flex;
        color: #FFF;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .spinner {
        width: 80px;
        height: 80px;
        border: 4px #ddd solid;
        border-top: 4px #ff7733 solid;
        border-radius: 50%;
        animation: sp-anime 1s infinite linear;
    }

    @keyframes sp-anime {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    /*ポップアップ*/
    .ConfirmationPopup, .RegisterCompletionPopup, .ErrorPopup {
        text-align: center;
        display: none; /*最初は非表示に*/
        z-index: 999; /* 重なり順指定 */
        height: 100vh; /*【height:100vh】【width:100%】の2つで画面全体を指定*/
        width: 100%;
        background: rgba(0,0,0,0.6);
        position: fixed;
        top: 0;
        left: 0;
    }

    .ConfirmationContent {
        background: #fff;
        border-radius: 5px; /*角の丸み*/
        padding: 5px;
        width: 30%;
    }

    .ConfirmationShow {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #ConfirmationTitle {
        font-size: 26px;
        font-weight: bold;
        background: #ff7733;
        color: white;
        width: 100%;
    }

    #ConfirmationErrorTitle {
        font-size: 26px;
        font-weight: bold;
        background: #ff3333;
        color: white;
        width: 100%;
    }

    #ConfirmationMassage, #ConfirmationErrorMassage {
        padding: 10px;
        font-size: 22px;
    }

/*テーブル*/
.table {
    font-size: 22px;
}

.table-orange {
    font-size: 20px;
    --bs-table-bg: #fa8c31;
    color: #FFF;
    border-bottom: solid 1px #787878;
    text-align: center;
}

#mstTable tr:hover {
    background-color: #d4f0fd;
}

/*選択時*/
.tableSelected {
    background: #d4f0fd;
}

