.content-body {
    margin-bottom: 5em;
}

.ribbonBox {
    width: 100%;
}

.ribbonBox ul {
    width: 60%;
    display: flex;
    flex-direction: row;
    gap: 10%;
}

/* .ribbonBox li:hover {
    filter: brightness(1.3) contrast(1.6)
} */

.leadBox {
    width: 100%;
    font-size: clamp(1.25rem, 0.848rem + 1.786vw, 2.188rem); /* 20px～35px（360px～1200px）*/
    margin: 2em auto 0;
    line-height: 1.4;
    text-align: center;
}

.keyBox {
    width: 85%;
    margin: 3em auto 0;
}

.titleWrap {
    /* display: flex;
    flex-direction: row;
    justify-content: space-between; */
    margin-top: 2em;
}

.titleBox {
    width: 100%;
}

.eventTitleBox {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 2%;
    margin-top: 3em;
}

.eventWrap {
    position: relative;
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
    border: 10px solid #aee2ec;
    /* padding: 0 1em; */
}

.ribWrap {
    display: flex;
    flex-direction: row;
    margin: 0 auto;
    width: 95%;
}

.rib_live {
    /* position: absolute;
    left: 20px;
    height: auto; */
    transform: translateY(-16%);
    width: 35%;
    min-width: 23%;
}

.logoBox {
    display: block;
    width: 80%;
    margin: 2em auto 1em;
}

.event-Wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    transform: translateY(0%);
    /* padding-top: 1em; */
}

.event-Wrap .date {
    color: #3ebfd5;
    /* font-size: clamp(1.25rem, 1.089rem + 0.714vw, 1.625rem); */
    font-family: urw-din, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: clamp(1.563rem, -1.237rem + 4.566vw, 2.188rem);
    /* 25px～35px（981px～1200px）*/
}

.event-Wrap .eventTitle {
    display: flex;
    flex-direction: column;
    font-variation-settings: "wght" 600;
    margin-top: 0.5em;
}

.eventTitle .title-a {
    font-size: clamp(0.813rem, 0.732rem + 0.357vw, 1rem);
}

.eventTitle .title-b {
    font-variation-settings: "wght" 800;
    /* font-size: clamp(1.438rem, 1.089rem + 1.548vw, 2.25rem); */
    /* font-size: 40px; */
    color: #5f5045;
    margin-top: 5px;
}

.eventTitle .title-b span {
    /* font-size: 22px; */
    font-size: clamp(0.938rem, 0.75rem + 0.833vw, 1.375rem);
    /* 15px～22px（360px～1200px）*/
}

.place-txt {
    font-variation-settings: "wght" 450;
    margin: 0.5em auto 0.7em;
    font-size: clamp(1.438rem, -0.522rem + 3.196vw, 1.875rem);
    /* 23px～30px（981px～1200px）*/
}

/* .event-Wrap .eventTitle span {
    font-variation-settings: "wght" 400;
    font-size: 18px;
    color: #5f5045;
} */

.txtWrap {
    width: 100%;
    margin-top: 3em;
    color: #5f5045;
}

p.detail {
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: source-han-sans-jp-variable, sans-serif;
    font-variation-settings: "wght" 350;
    /* font-size: clamp(0.875rem, 0.821rem + 0.238vw, 1rem); */
    /* 15-19 / 851-2300 */
    font-size: clamp(0.813rem, 0.732rem + 0.357vw, 1rem);
    /* 13px～16px（360px～1200px）*/
    font-feature-settings: palt;
    -webkit-font-feature-settings: "palt";
    color: #4c4c4c;
    line-height: 1.8;
    letter-spacing: 1px;
    text-align: left;
    text-justify: inter-ideograph;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

p.caution {
    width: 93%;
    margin: 5px 0;
    padding: 0;
    font-family: source-han-sans-jp-variable, sans-serif;
    font-variation-settings: "wght" 350;
    font-size: clamp(0.75rem, 0.696rem + 0.238vw, 0.875rem);
    color: #5f5045;
    text-align: left;
    text-indent: -1em;
    padding-left: 1em;
    line-height: 1.6;
}

p.detail span {
    font-variation-settings: "wght" 500;
}

li {
    list-style: none;
    margin: 5px 0 0 0;
    padding: 0;
    font-family: source-han-sans-jp-variable, sans-serif;
    font-variation-settings: "wght" 350;
    font-size: clamp(0.813rem, 0.702rem + 0.21vw, 1rem);
    /* 13-16 / 851-2300 */
    color: #5f5045;
    text-align: left;
    text-indent: -1em;
    padding-left: 1em;
    line-height: 1.6;
}

.content-body a:link {
    background-color: transparent;
    color: #5f5045;
    text-decoration: underline;
}

.content-body a:visited {
    background-color: transparent;
    color: #5f5045;
    text-decoration: none;
}

.content-body a:active {
    background-color: transparent;
    color: #5f5045;
    text-decoration: none;
}

.content-body a:hover {
    background-color: transparent;
    color: #5f5045;
    text-decoration: none;
}

@media (max-width:980px) {

    .sectionWrap {
        width: 90%;
        margin: 0 auto;
    }

    .ribbonBox ul {
        width: 75%;
    }

    .keyBox {
        width: 100%;
    }

    .eventTitleBox {
        margin-top: 3em;
    }

    .eventWrap {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .rib_live {
        transform: translateY(-17%);
    }

    .event-Wrap {
        width: 100%;
        padding-top: 0.7em;
    }

    .logoBox {
        width: 80%;
    }

    p.detail {}

    p.caution {}

    li {}
}

@media (max-width:750px) {

    .title {
        width: 35%;
    }
}

@media (max-width:500px) {

    .leadBox {
        margin-top: 1em;
    }

    .keyBox {
        width: 100%;
        margin-top: 1em;
    }

    .eventTitleBox {
        flex-direction: column;
    }

    .eventWrap {
        width: 100%;
        margin-bottom: 2em;
    }

    .logoBox {
        width: 70%;
        margin-top: 1em;
    }

    .txtWrap {
        margin-top: 1em;
    }

    .place-txt {
        font-size: clamp(1.125rem, 0.944rem + 0.806vw, 1.438rem); /* 18px～23px（360px～980px）*/
    }



    p.detail {
        line-height: 1.6;
    }

    p.caution {
        line-height: 1.6;
    }

    li {}

}