body {
}

.textarea01 {
    width:500px;
}

.body01 {
    margin: 0;
}

.slick-header-columns {
    background-image: none;
    height: auto;
    width: auto;
}
.slick-header-column {
    background-image: none;
    background-color: #eaeaea;
    padding: 0px;
    margin: 0px;
}

.slick-header-column:hover {
    background-image: none;
    background-color: #D4EEFF;
}

.slick-column-name {
    flex-wrap: wrap;
}

.div-body01 {
    background-image: none;
    background-color: white;
}

.cell-title {
    font-weight: bold;
}

.cell-effort-driven {
    text-align: center;
}

.sagyo-comment {
    flex-wrap: wrap;
}
.fontsize09 {
    font-size: 09px;
    font-family: "メイリオ";
}
.fontsize10 {
    font-size: 10px;
    font-family: "メイリオ";
}
.fontsize11 {
    font-size: 11px;
    font-family: "メイリオ";
}
.fontsize12 {
    font-size: 12px;
    font-family: "メイリオ";
}
.fontsize14 {
    font-size: 14px;
    font-family: "メイリオ";
}
.fontsize16 {
    font-size: 16px;
    font-family: "メイリオ";
}
.fontsize16:disabled {
    color: #000; /* 黒文字に変更 */
    background-color: #ffffff; /* 背景を少し明るく */
    opacity: 1; /* グレーアウトを防ぐ */
}
.fontsize18 {
    font-size: 18px;
    font-family: "メイリオ";
    font-weight: bold;
}

.fontsize24 {
    font-size: 24px;
    font-family: "メイリオ";
}
.fontsize32 {
    font-size: 32px;
    font-family: "メイリオ";
}
.fontsize48 {
    font-size: 48px;
    font-family: "メイリオ";
}
.label_fontsize24 {
    font-size: 24px;
    font-family: "メイリオ";
    border: 0px solid black;
    background-color: red;

}
.label_fontsize48 {
    font-size: 48px;
    font-family: "メイリオ";
    border: 0px solid black;
    /*
    background-color: White;
    border-collapse: collapse;
    */
    /*border-radius: 10px; *角丸*/
    /*margin: 10px 0px 0px 0px; * 上　右　下　左 */
    /*padding: 3px 2px 3px 2px; * 上　右　下　左 */
}
.form-item {
    font-size: 16px;
    font-family: "メイリオ";
    /*color : blue; */
}

input[type="submit"] {
    /*--type="submit"のinput要素にのみ適用されます--*/
    font-size: 16px;
    font-family: "メイリオ";

}
.error-message {
    font-size: 14px;
    font-family: "メイリオ";
    color: red;
}

input,
select,
textarea {
    max-width: 1000px;
}

input[type="button"] {
    font-size: 14px;
    font-family: "メイリオ";
}

.gridbtn {
    height: 21px;
    vertical-align: middle;
    margin-top:0px
}

.gridminibtn {
    text-align: center;
    width: 25px;
    height: 21px;
    vertical-align: middle;
}
.cellBackground_Red {
    background-color: Red;
}
input[type="time"].cellBackground_Red2 {
    background-color: red;
}

.cellBackground_White {
    background: white;
}
.cellBackground_Yellow {
    background: yellow;
}
.cellBackground_LightGray {
    background: lightgray;
}
.cellBackground_LightBlue {
    background: lightBlue;
}

.cellBackground_LightPink {
    background: lightpink;
}
.cellBackground_LightGreen {
    background: lightgreen;
}
.btn-flat-border {
    display: inline-block;
    padding: 0.3em 1em;
    text-decoration: none;
    background: #668ad8; /*ボタン色*/
    color: white;
    border: solid 2px #627295;
    border-radius: 5px;
    transition: .4s;
}

.btn-flat-border:disabled {
    display: inline-block;
    padding: 0.3em 1em;
    text-decoration: none;
    background: #6b6c6d; /*ボタン色*/
    color: white;
    border: solid 2px #627295;
    border-radius: 5px;
    transition: .4s;
}

.btn-flat-border:hover {
    background: #a1ff67;
    color: black;
}
.btn-flat-border-dis {
    display: inline-block;
    padding: 0.3em 1em;
    text-decoration: none;
    background: #6b6c6d; /*ボタン色*/
    color: white;
    border: solid 2px #627295;
    border-radius: 5px;
    transition: .4s;
}
.btn-frk-border {
    display: inline-block;
    padding: 0.3em 1em;
    text-decoration: none;
    border: solid 2px #627295;
    border-radius: 5px;
    transition: .4s;
    background: Yellow; /*背景色*/
    color: black;
    -webkit-appearance: none; /* iPhone 対応 */
    vertical-align: middle; /*中央揃え*/

    -webkit-animation: cell-Yellow-Frk 1.2s linear infinite;
    animation: cell-Yellow-Frk 1.2s linear infinite;
}
.btn-frk-border:hover {
    background: #a1ff67;
    color: black;
}
.slickgrid,
.slickgrid *,
.slick-header-column {
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
}
.slick-header-column {
    font-size: 10px; /* お好みのサイズに調整可能 */
}
.align-left-header {
    text-align: left !important;
    padding-left: 8px; /* 任意で余白調整 */
}
/* --------------  領域固定とスクロール　*/
.container {
    /*height: 1200px; */ /* 全体の高さ */
    height: auto;
    max-height: none;
    display: flex;
    flex-direction: column;
    border: 1px solid #ccc;
}

.header {
    flex: 0 0 auto;
    background-color: #f9f9f9;
    padding: 2px;
    border-bottom: 1px solid #ccc;
    position: sticky;
    top: 0;
    z-index: 1;
}

.content {
    flex: 1 1 auto;
    overflow-y: auto;
}
.div_center {
    width: 360px;
    margin: auto;
    border: 0px solid blue;
    /*background-color: lightyellow;*/
}

/* -------------------------------------
 * Anime 
 * 赤い点滅（赤とグレーを交互表示）
 * -------------------------------------*/
.cell-Red-Frk {
    /*width: 20%;*/
    background: RED; /*背景色*/
    border-radius: 0px; /*角丸*/
    display: inline-block;
    /*padding: 12px 2px;*/
    /*margin: 1px 1px 1px 0px;*/ /* 上 右 下 左 */
    text-decoration: none;
    color: White;
    transition: .4s;
    /*font-size: 18px;*/
    -webkit-appearance: none; /* iPhone 対応 */
    vertical-align: middle; /*中央揃え*/

    -webkit-animation: cell-Red-Frk 0.5s linear infinite;
            animation: cell-Red-Frk 0.5s linear infinite;
}

@-webkit-keyframes cell-Red-Frk {
    0% {
        background: gray;
        color: White;
    }

    100% {
        background: Red;
        color: White;
    }
}

@keyframes cell-Red-Frk {
    0% {
        background: gray;
        color: white;
    }

    100% {
        background: Red;
        color: White;
    }
}
/* -------------------------------------
 * Anime 
 * Greenの点滅（GreenとYellowを交互表示）
 * -------------------------------------*/
.cell-Green-Frk {
    /*width: 20%;*/
    background: lightgreen; /*背景色*/
    border-radius: 0px; /*角丸*/
    display: inline-block;
    /*padding: 12px 2px;*/
    /*margin: 1px 1px 1px 0px;*/ /* 上 右 下 左 */
    text-decoration: none;
    color: black;
    transition: .4s;
    /*font-size: 18px;*/
    -webkit-appearance: none; /* iPhone 対応 */
    vertical-align: middle; /*中央揃え*/

    -webkit-animation: cell-Green-Frk 1.2s linear infinite;
            animation: cell-Green-Frk 1.2s linear infinite;
}

@-webkit-keyframes cell-Green-Frk {
    0% {
        background: yellow;
        color: black;
    }

    100% {
        background: lightgreen;
        color: black;
    }
}

@keyframes cell-Green-Frk {
    0% {
        background: yellow;
        color: black;
    }

    100% {
        background: lightgreen;
        color: black;
    }
}
/* -------------------------------------
 * Anime 
 * Yellowの点滅（YellowとWhiteを交互表示）
 * -------------------------------------*/
.cell-Yellow-Frk {
    /*width: 20%;*/
    background: Yellow; /*背景色*/
    border-radius: 0px; /*角丸*/
    display: inline-block;
    /*padding: 12px 2px;*/
    /*margin: 1px 1px 1px 0px;*/ /* 上 右 下 左 */
    text-decoration: none;
    color: black;
    transition: .4s;
    /*font-size: 18px;*/
    -webkit-appearance: none; /* iPhone 対応 */
    vertical-align: middle; /*中央揃え*/

    -webkit-animation: cell-Yellow-Frk 1.2s linear infinite;
    animation: cell-Yellow-Frk 1.2s linear infinite;
}

@-webkit-keyframes cell-Yellow-Frk {
    0% {
        background: white;
        color: black;
    }

    100% {
        background: yellow;
        color: black;
    }
}

@keyframes cell-Yellow-Frk {
    0% {
        background: white;
        color: black;
    }

    100% {
        background: yellow;
        color: black;
    }
}

/*音源のクレジット表記スタイル*/
.OtoLogic_Credit {
    text-align: right ;
    color: gray;
}

.dialogMenu::backdrop {
    background-color: #FAB36750; /* ぼかし効果 */
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px); /* Safari */
}
.dialogDemo::backdrop {
    background-color: #FAB36750; /* ぼかし効果 */
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px); /* Safari */
}
.Menu_Header {
    height: 40px;
    background-color: olivedrab;
    text-align: center;
    color: white;
}

.Menu_Item {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.Menu_Item:hover {
    background: #a1ff67;
    color: black;
}
.Menu_Row {
    height: 50px;
    text-align: left;
    color: black;
}