/* Date */
.dates {
    container-type: inline-size;
}
.date {
    display: flex;
    flex-direction: column;
    gap:10px;
    padding:var(--padding);
    border-radius: var(--radius-inner-2);
    border:solid 3px var(--color-white);
    background:var(--color-white);
    font-size:2.3cqw;
    color:var(--color-black);
    margin-top:20px;
}
a.date:hover {
    color:var(--color-black);
    border:solid 3px var(--color-blue);
}
.date h2 {
    font-size:1.4em;
    display:flex;
    align-items: center;
    justify-content: flex-start;
    gap:10px;
    line-height:1.4;
}
.date h2 span {
    background:var(--color-blue);
    line-height:1;
    padding:5px 10px;
    border-radius:6px;
    color:var(--color-white);
    font-size:0.8em;
    text-align:center;
}
.date time {
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size:3em;
    line-height: 1;
    display:flex;
    align-items: center;
    justify-content: flex-start;
    gap:10px;
    margin:0;
}
.date time small {
    font-size:0.5em;
}
.date time div {
    display: flex;
    flex-direction: column;
    gap:2px;
    font-size:0.4em;
    font-weight:bold;
    font-family: 'Noto Sans JP', sans-serif;
}
.date .sat { color:#0DBCF2; }
.date .sun { color:#F05647; }
.date address {
    font-size:1.4em;
    font-weight:bold;
    margin:0;
}
.date address span {
    display: block;
    margin-top:10px;
    font-size:0.8em;
}

.date .year {
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size:1.4em;
    line-height:1;
    margin-top:0;
}
.date > div {
    font-size:0.9em;
    display:flex;
    justify-content: space-between;
    gap:var(--gap);
    margin-top:0;
}
.date h2 {
    font-size:1.6em;
}

.entry {
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size:2em;
    line-height:1;
    color:var(--color-white);
    text-align: center;
    padding:var(--padding);
    margin:0 calc(var(--padding) * -1) calc(var(--padding) * -1) calc(var(--padding) * -1);
    border-end-start-radius: var(--radius-inner-2);
    border-end-end-radius: var(--radius-inner-2);
    background:var(--color-red);
}
main .event-detail .entry {
    margin:20px 0 0 0;
    border-radius:100px;
    font-size:1.6em;
}
.entry .button {
    width:100%;
}
.date .entry-end {
    display:none;
}

.pdf.buttons {
    padding:0;
}
.pdf.buttons .button {
    flex:1;
}

main .event-detail {
    font-size:2.6cqw;
    padding:0;
}
main .event-detail h1 {
    font-size:2em;
    color:var(--color-blue);
}
main .event-detail h1.days {
    background:var(--color-blue);
    padding:5px 20px;
    border-radius:999px;
    color:var(--color-white);
}
main .event-detail .lead {
    text-align:center;
    font-weight:bold;
    font-size:1.4em;
}
main .event-detail .shop-list h2 {
    color:var(--ctg-color);
    text-align:center;
    font-family: 'M PLUS Rounded 1c', sans-serif;
}
main .event-detail .shop-list ol {
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap:10px;
}
main .event-detail .shop-list ol li {
    color:var(--ctg-color);
    display:flex;
    align-items: center;
    justify-content: flex-start;
    gap:10px;
}
main .event-detail .shop-list ol li span {
    background:var(--ctg-color);
    color:var(--color-white);
    padding:5px;
    border-radius:8px;
    min-width:3em;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    text-align:center;
}
main .event-detail .shop-list ol li div {
    margin:0;
    line-height:1.2;
    font-weight:bold;
    text-align: left;
}

main .event-detail iframe {
    border-radius: var(--radius-inner-2);
}

main .flyer {
    border-radius:var(--radius-inner-2);
    overflow: hidden;
}

@media (max-width:920px ) {
    .video-wrap ,
    .video {
        aspect-ratio: 2 / 3;
    }

    #index .dates {
        justify-content: center;
        width:100%;
    }
}
@media (max-width:720px ) {

}
@media (max-width:520px ) {
    .pdf.buttons .button {
        flex:auto;
        margin:0;
        min-width:auto;
    }
}