:root {
    --tint-color: #259cca;

    --all-color: #333;
    --notice-color: #259cca;
    --addon-color: #67ca25;
    --press-color: #ca8825;
}

#notice_list {
    width: 100%;
    display: block;
}
.frame .date {
    display: inline-block;
    flex-shrink: 0;
    margin-bottom: 0 !important;
    height: fit-content;
}
.category {
    display: inline-block;
    flex-shrink: 0;
    border-radius: 5px;
    user-select: none;
    text-align: center;
    height: fit-content;
}
.notice {
    background-color: var(--notice-color);
    color: #fff;
}
.addon {
    background-color: var(--addon-color);
    color: #fff;
}
.press {
    background-color: var(--press-color);
    color: #fff;
}
.news-content {
    display: inline-block;
    height: fit-content;
    user-select: none;
    width: auto;
    margin-bottom: 0 !important;
}
.in-box {
    margin: 0;
    margin-bottom: 0 !important;
}

#radio_all {
    color: var(--all-color);
}
#radio_all:checked + label {
    background: var(--all-color);
    border: 2px solid var(--all-color);
}
#radio_notice {
    color: var(--notice-color);
}
#radio_notice:checked + label {
    background: var(--notice-color);
    border: 2px solid var(--notice-color);
}
#radio_addon {
    color: var(--addon-color);
}
#radio_addon:checked + label {
    background: var(--addon-color);
    border: 2px solid var(--addon-color);
}
#radio_press {
    color: var(--press-color);
}
#radio_press:checked + label {
    background: var(--press-color);
    border: 2px solid var(--press-color);
}
.radio1 {
    display: none;
    user-select: none;
}
.label1 {
    border: 2px solid #fff;
    user-select: none;
}
.radio1:checked + label {
    /*background: var(--tint-color);/* マウス選択時の背景色を指定する */
    /*border: 2px solid var(--tint-color);*/
    color: #ffffff; /* マウス選択時のフォント色を指定する */
    border-radius: 5px;
}
.label1:hover {
    background-color: #E2EDF9; /* マウスオーバー時の背景色を指定する */
}
.unit-up {
    display: flex;
}


/*835px以上*/
@media screen and (min-width: 835px) {
    .label1 {
        margin: 5px; /* ラベル外側の余白を指定する */
        padding: 5px 10px;
        font-weight: bold;
        border-radius: 5px;
    }
    .notice_unit {
        display: flex;
        border-top: 2px dashed #cccccc;
        min-height: 4em;
    }
    .frame .date {
        margin: auto 0 !important;
        width: 130px;
        padding: 5px 0;
        font-weight: bold;
    }
    .category {
        margin: auto 0;
        padding: 2px 5px;
        width: 120px;
        font-weight: bold;
    }
    .news-content {
        margin: auto 25px !important;
        margin-right: 0 !important;
        padding: 0.5em 0;
    }
    #button_box {
        margin: 1.2em 0;
    }
    .radio-br {
        display: none;
    }
    .in-box {
        font-size: 16px;
    }
}

/*834px以下*/
@media screen and (max-width: 834px) {
    .label1 {
        padding: 5px 5px;
        border-radius: 5px;
    }
    .notice_unit {
        padding-top: 0.6em;
        border-top: 2px dashed #cccccc;
        min-height: 4em;
    }
    .frame .date {
        margin: auto 0 !important;
        width: 200px;
        padding: 5px 0;
    }
    .category {
        margin: auto 0;
        padding: 2px 5px;
        width: 120px;
    }
    .news-content {
        margin: auto 0 !important;
        padding: 0.5em 0;
    }
    .content-block {

    }
    #button_box {
        margin: 0.2em 0;
    }
    .radio-br {
        font-size: 5px;
    }
}