/* イベント案内（スラッグ: event）専用CSS。セレクタは全て .ksa-event から始める。 */
.ksa-event {
    --ksa-event-accent: #1d5a73;
    --ksa-event-cta: #b4532a;
    --ksa-event-cta-hover: #96441f;
    max-width: 55.2rem;
    margin-right: auto;
    margin-left: auto;
}

.ksa-event .ksa-event__lead {
    margin-bottom: 2rem;
}

.ksa-event .ksa-event__heading {
    margin: 0 0 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--ksa-event-accent);
}

/* プログラム */
.ksa-event .ksa-event__program {
    margin: 0 0 1.25rem;
    padding: 1rem;
    border: 1px solid var(--ksa-color-line, #d9e0e3);
    border-radius: 6px;
    background: var(--ksa-color-bg-soft, #f4f7f8);
}

.ksa-event .ksa-event__program-title {
    margin: 0 0 0.5rem;
    padding-left: 0.625rem;
    border-left: 4px solid var(--ksa-event-accent);
}

.ksa-event .ksa-event__program-text {
    margin: 0 0 0.75rem;
}

.ksa-event .ksa-event__list {
    margin: 0;
    padding: 0;
}

.ksa-event .ksa-event__row {
    display: grid;
    grid-template-columns: 3.5rem 1fr;
    gap: 0 0.75rem;
    padding: 0.5rem 0;
    border-top: 1px solid var(--ksa-color-line, #d9e0e3);
}

.ksa-event .ksa-event__term {
    margin: 0;
    color: var(--ksa-event-accent);
    font-weight: 700;
}

.ksa-event .ksa-event__desc {
    min-width: 0;
    margin: 0;
}

.ksa-event .ksa-event__sub {
    display: block;
    color: var(--ksa-color-muted, #5b6b72);
}

.ksa-event .ksa-event__note {
    margin: 0 0 0.25rem;
}

/* 番号付き注記（1）、2））は、折り返し行を番号の幅だけ字下げする */
.ksa-event .ksa-event__note--num {
    padding-left: 1.5em;
    text-indent: -1.5em;
}

.ksa-event .ksa-event__desc .ksa-event__note:last-child {
    margin-bottom: 0;
}

/* 受付開始の帯 */
.ksa-event .ksa-event__banner {
    margin: 2rem 0 1.5rem;
    padding: 1rem;
    border-radius: 6px;
    background: var(--ksa-color-heading, #1f3f4d);
    text-align: center;
}

.ksa-event .ksa-event__banner-text {
    margin: 0;
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.5;
}

/* 参加申込み */
.ksa-event .ksa-event__apply-title {
    margin-bottom: 0.25rem;
}

.ksa-event .ksa-event__cta {
    margin: 1.25rem 0 2rem;
    text-align: center;
}

.ksa-event .ksa-event__button {
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    max-width: 20rem;
    padding: 0.875rem 1.5rem;
    border-radius: 6px;
    background: var(--ksa-event-cta);
    color: #ffffff;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
}

.ksa-event .ksa-event__button:hover,
.ksa-event .ksa-event__button:focus {
    background: var(--ksa-event-cta-hover);
    color: #ffffff;
}

/* 問い合わせ先 */
.ksa-event .ksa-event__contact {
    padding: 1rem;
    border-top: 2px solid var(--ksa-event-accent);
    background: var(--ksa-color-bg-soft, #f4f7f8);
}

.ksa-event .ksa-event__contact-title {
    margin: 0 0 0.25rem;
    color: var(--ksa-color-heading, #1f3f4d);
    font-weight: 700;
}

.ksa-event .ksa-event__contact-name {
    margin: 0 0 0.25rem;
}

.ksa-event .ksa-event__contact-line {
    margin: 0;
}

@media (min-width: 48rem) {
    .ksa-event .ksa-event__program {
        padding: 1.25rem 1.5rem;
    }

    .ksa-event .ksa-event__row {
        grid-template-columns: 4rem 1fr;
    }

    .ksa-event .ksa-event__banner-text {
        font-size: 1.25rem;
    }
}

/* 問い合わせ先のメールアドレス（画像）。画像の下端から文字の基線までの距離（6px）だけ下げて、行の文字の基線にそろえる。 */
.ksa-event .ksa-event__email-img {
    max-width: 100%;
    height: auto;
    vertical-align: -6px;
}