@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;700&display=swap');

body {
    font-family: "Inter", "Noto Sans JP", sans-serif;
    background-color: #f8fafc;
    color: #334155;
}

:root {
    --notice-fs-date: 0.875rem;
    --notice-fs-title: 0.9375rem;
    --notice-fs-file: 0.8125rem;
    --notice-lh-title: 1.4;
    --notice-space-section-gap: 3rem;
    --notice-space-row-gap: 0.35rem;
    --notice-space-row-pad-mobile: 1rem;
    --notice-space-row-pad-desktop: 1rem 1.5rem;
    --notice-space-row-gap-desktop: 1rem;
    --notice-space-file-ml: 0.45rem;
    --notice-space-file-icon-mr: 0.15rem;
    --notice-date-col-width: 8rem;
    --notice-tr-row-hover: background-color 0.15s ease;
}

.text-green-custom {
    color: #16a34a;
}

.text-red-custom,
.pdf-icon {
    color: #dc2626;
}

.notice-main {
    flex-grow: 1;
    padding-top: 3rem;
    padding-bottom: 3rem;
    background-color: #f8fafc;
}

.notice-main-content {
    display: flex;
    flex-direction: column;
    gap: var(--notice-space-section-gap);
}

.notice-lead {
    margin: 0;
    color: #475569;
    font-size: 0.9375rem;
    line-height: 1.8;
}

.notice-empty-state {
    padding: var(--notice-space-row-pad-mobile);
}

.notice-empty-copy {
    margin: 0;
    color: #64748b;
    font-size: var(--notice-fs-title);
    line-height: var(--notice-lh-title);
    text-align: center;
}

.notice-list {
    overflow: hidden;
    padding: 0;
}

.notice-list-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--notice-space-row-gap);
    padding: var(--notice-space-row-pad-mobile);
    transition: var(--notice-tr-row-hover);
}

.notice-list-item + .notice-list-item {
    border-top: 1px solid #f3f4f6;
}

.notice-list-item:hover {
    background-color: #f8fafc;
}

.notice-list-date {
    display: inline-block;
    color: #64748b;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: var(--notice-fs-date);
}

.notice-list-title-col {
    min-width: 0;
}

.notice-list-title {
    color: #334155;
    font-size: var(--notice-fs-title);
    font-weight: 400;
    line-height: var(--notice-lh-title);
    text-decoration: none;
}

.notice-list-title:hover {
    color: #2563eb;
}

.notice-list-file {
    margin-left: var(--notice-space-file-ml);
    color: #475569;
    font-size: var(--notice-fs-file);
    font-weight: 500;
    white-space: nowrap;
}

.notice-pdf-icon {
    margin-right: var(--notice-space-file-icon-mr);
    color: #dc2626;
}

@media (min-width: 768px) {
    .notice-empty-state {
        padding: var(--notice-space-row-pad-desktop);
    }

    .notice-list-item {
        flex-direction: row;
        align-items: center;
        gap: var(--notice-space-row-gap-desktop);
        padding: var(--notice-space-row-pad-desktop);
    }

    .notice-list-date {
        flex-shrink: 0;
        width: var(--notice-date-col-width);
    }

    .notice-list-title-col {
        flex-grow: 1;
    }
}