@charset "UTF-8";

:root {
--page-yellow: #FFFE00;
--card-yellow: #FFE200;
--card-cream: #fffed0;
--ink: #707070;
}   .date-nav {
display: flex;
gap: 2rem;
margin: 0 0 34px 0;
font-size: clamp(2rem, 4vw, 3.8rem);
font-weight: 800;
letter-spacing: -0.04em;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
}
@media (max-width: 768px) {
.date-nav {
font-size: 3.5rem;
}
}
.date-nav button {
padding: 0;
border: 0;
color: inherit;
background: transparent;
font: inherit;
cursor: pointer;
}
.date-nav button[aria-selected=false] {
opacity: 0.35;
}
@media (max-width: 768px) {
.date-nav {
margin-left: 0;
}
}   .timetable-scroll {
overflow-x: auto;
overflow-y: hidden;
padding-bottom: 12px;
overscroll-behavior-inline: contain;
-webkit-overflow-scrolling: touch;
}    .timetable-grid {
--venue-count: 4;
--slot-count: 36;
--time-width: 76px;
--venue-width: 260px;
--header-height: 68px;
--slot-height: 24px;
position: relative;
display: grid;
grid-template-columns: var(--time-width) repeat(var(--venue-count), minmax(var(--venue-width), 1fr));
grid-template-rows: var(--header-height) repeat(var(--slot-count), var(--slot-height));
min-width: calc(var(--time-width) + var(--venue-count) * var(--venue-width));
isolation: isolate; }
.timetable-grid:after {
position: absolute;
top: var(--header-height);
right: 0;
bottom: 0;
content: "";
border-right: 1px solid var(--ink);
pointer-events: none;
z-index: 10;
}
.timetable-grid { }
.timetable-grid > .schedule-time:first-of-type {
padding-top: 6px;
transform: translateY(0);
}
@media (max-width: 768px) {
.timetable-grid {
--time-width: 62px;
--venue-width: 220px;
--slot-height: 22.5px;
}
}   .time-column-layer {
grid-column: 1;
grid-row: 2/-1;
align-self: stretch;
justify-self: stretch;
box-sizing: border-box;
width: var(--time-width);
background: var(--page-yellow);
border-right: 1px solid var(--ink);
pointer-events: none;
z-index: 11; }
@media (max-width: 768px) {
.time-column-layer {
position: sticky;
left: 0;
z-index: 30;
}
}   .timetable-corner {
position: sticky;
top: 0;
left: 0;
grid-column: 1;
grid-row: 1;
background: var(--page-yellow);
z-index: 40;
}
.venue-header {
position: sticky;
top: 0;
display: flex;
align-items: flex-end;
grid-row: 1;
padding: 0 16px 12px;
background: var(--page-yellow);
white-space: nowrap;
font-size: 3rem;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
z-index: 15;
}
@media (max-width: 768px) {
.venue-header {
padding-right: 12px;
padding-left: 12px;
font-size: 2.4rem;
}
}   .schedule-time {
align-self: start;
justify-self: end;
grid-column: 1;
padding-right: 18px;
font-size: 2rem;
line-height: 1;
transform: translateY(-50%);
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal; z-index: 12;
}
.schedule-time.is-last {
align-self: end;
transform: translateY(50%);
}
@media (max-width: 768px) {
.schedule-time {
position: sticky;
left: 0;
justify-self: stretch;
box-sizing: border-box;
width: var(--time-width);
padding-right: 12px; background: transparent;
text-align: right;
font-size: 1.6rem; z-index: 31;
}
}    .schedule-line {
display: none;
}   .venue-divider {
align-self: stretch;
justify-self: start;
width: 0;
min-width: 0;
border-left: 1px solid var(--ink);
pointer-events: none;
z-index: 10;
}   .schedule-event {
position: relative;
min-width: 0;
margin: 0;
border: 0;
overflow: hidden;
background: var(--card-cream);
z-index: 5;
}
.schedule-event[data-tone=yellow] {
background: var(--card-yellow);
}
.schedule-event a {
display: flex;
box-sizing: border-box;
height: 100%;
flex-direction: column;
justify-content: center;
padding: 10px 14px;
color: inherit;
text-decoration: none;
}
.schedule-event h3 {
margin: 0;
font-size: 1.6rem;
line-height: 1.25;
overflow-wrap: anywhere;
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
}
.schedule-event time {
display: block;
margin-top: 6px;
font-size: 1.6rem;
line-height: 1;
letter-spacing: 0.02em;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
}
.schedule-event { }
.schedule-event.is-compact a {
justify-content: flex-start;
padding-block: 6px;
}
.schedule-event.is-compact time {
margin-top: 2px;
}
.schedule-event { }
.schedule-event.is-invalid {
outline: 3px solid #d00;
background: #fff;
}
@media (max-width: 768px) {
.schedule-event a {
padding-right: 12px;
padding-left: 12px;
}
.schedule-event h3 {
font-size: 1.4rem;
}
.schedule-event time {
font-size: 1.3rem;
}
}   .notes {
max-width: 900px;
margin: 28px 0 0 calc(var(--time-width) + 16px);
font-size: 0.92rem;
line-height: 1.75;
}
.notes code {
padding: 0.1em 0.35em;
background: rgba(255, 255, 255, 0.65);
}
@media (max-width: 768px) {
.notes {
margin-left: 0;
}
}   @media (prefers-reduced-motion: no-preference) {
.schedule-event a {
transition: filter 160ms ease, transform 160ms ease;
}
.schedule-event a:hover {
filter: brightness(0.96);
transform: translateY(-1px);
}
}   .timetable-panel {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.5s ease, transform 0.5s ease;
will-change: opacity, transform;
}
.timetable-panel.is-active {
opacity: 1;
transform: translateY(0);
}
.timetable-panel[hidden] {
display: none;
} @media (prefers-reduced-motion: reduce) {
.timetable-panel {
opacity: 1;
transform: none;
transition: none;
}
}   .tab_category_change_box {
margin-top: 90px;
margin-bottom: 60px;
}
.tab_category_change_box .list {
display: -ms-flexbox;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: center;
}
.tab_category_change_box .list li button {
position: relative;
padding: 0;
border: 0;
color: inherit;
background: transparent;
cursor: pointer;
opacity: 0.35;
font-size: 2rem;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.tab_category_change_box .list li button:before {
content: "|";
padding-left: 0.6em;
padding-right: 0.6em;
}
.tab_category_change_box .list li button.is-active, .tab_category_change_box .list li button[aria-pressed=true] {
opacity: 1;
}
.tab_category_change_box .list li button.is-active:after, .tab_category_change_box .list li button[aria-pressed=true]:after {
transform: scaleX(1);
}
.tab_category_change_box .list li button:hover {
opacity: 1;
}
.tab_category_change_box .list li button:focus-visible {
outline: 2px solid currentColor;
outline-offset: 6px;
}
.tab_category_change_box .list li:last-child button:after {
content: "|";
padding-left: 0.6em;
}
@media (max-width: 768px) {
.tab_category_change_box {
margin-bottom: 35px;
}
.tab_category_change_box .list {
gap: 10px;
}
.tab_category_change_box .list li button {
font-size: 1.6rem;
}
}   .exhibition_post_list_box {
padding-bottom: 450px;
}
@media (max-width: 768px) {
.exhibition_post_list_box {
padding-bottom: 0px;
}
}
.exhibition_post_list_box.is-filter-ready .post_column_3_list > li {
opacity: 0;
transform: translateY(40px);
transition: opacity 0.3s ease, transform 0.3s ease;
}
.exhibition_post_list_box.is-filter-ready .post_column_3_list > li.is-filter-show {
opacity: 1;
transform: translateY(0);
}
.exhibition_post_list_box.is-filter-ready .post_column_3_list > li[hidden] {
display: none !important;
}
@media (prefers-reduced-motion: reduce) {
.exhibition_post_list_box.is-filter-ready .post_column_3_list > li {
opacity: 1;
transform: none;
transition: none;
}
}   .date_box .date_ttl {
margin-bottom: 0.3em;
text-align: center;
font-size: 6rem;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
}
@media (max-width: 768px) {
.date_box .date_ttl {
font-size: 4rem;
}
}   .sp_scroll_guide_box {
padding-top: 35px;
padding-bottom: 35px;
overflow: hidden;
}
.sp_scroll_guide_box .inner {
display: flex;
align-items: center;
gap: 25px;
width: 100%;
}
.sp_scroll_guide_box .arrow_window {
position: relative;
flex: 1;
height: 40px;
min-width: 0;
overflow: hidden;
}
.sp_scroll_guide_box .arrow_group {
position: absolute;
top: 50%;
left: 0;
display: flex;
align-items: center;
gap: 18px;
width: max-content;
transform: translateY(-50%);
animation: scroll-guide-arrow 3.4s ease-in-out infinite;
will-change: left, transform;
}
.sp_scroll_guide_box .arrow_group img {
display: block;
flex: 0 0 auto;
width: 118px;
height: auto;
}
.sp_scroll_guide_box .txt {
flex: 0 0 auto;
margin: 0;
font-size: 2.6rem;
line-height: 1;
white-space: nowrap;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
}
@media (max-width: 768px) {
.sp_scroll_guide_box {
padding-top: 25px;
padding-bottom: 25px;
}
.sp_scroll_guide_box .inner {
gap: 15px;
}
.sp_scroll_guide_box .arrow_window {
height: 30px;
}
.sp_scroll_guide_box .arrow_group {
gap: 14px;
}
.sp_scroll_guide_box .arrow_group img {
width: 90px;
}
.sp_scroll_guide_box .txt {
font-size: 2rem;
}
}   @keyframes scroll-guide-arrow { 0%, 15% {
left: 0;
transform: translateX(0) translateY(-50%);
} 42% {
left: 100%;
transform: translateX(0) translateY(-50%);
} 42.01% {
left: 0;
transform: translateX(-100%) translateY(-50%);
} 69% {
left: 0;
transform: translateX(0) translateY(-50%);
} 100% {
left: 0;
transform: translateX(0) translateY(-50%);
}
} @media (prefers-reduced-motion: reduce) {
.sp_scroll_guide_box .arrow_group {
animation: none;
}
}   .schedule-modal {
position: fixed;
inset: 0;
box-sizing: border-box;
width: 100%;
height: 100vh;
height: 100dvh;
max-width: none;
max-height: none;
margin: 0;
padding: 0;
overflow-x: hidden;
overflow-y: auto;
border: 0;
border-radius: 0;
background-color: #FFFE00;
color: inherit; z-index: 9000;
opacity: 0;
transform: translateY(30px);
transition: opacity 0.35s ease, transform 0.35s ease, display 0.35s allow-discrete;
}
.schedule-modal[open] {
opacity: 1;
transform: translateY(0);
}
@starting-style {
.schedule-modal[open] {
opacity: 0;
transform: translateY(30px);
}
}
@media (max-width: 768px) {
.schedule-modal { width: 100%;
height: 100dvh;
max-width: none;
max-height: none;
}
}
.schedule-modal__inner {
position: relative;
box-sizing: border-box;
min-height: 100%;
max-width: 1100px;
margin: auto;
margin: calc(var(--site-header-height, 0px) + 70px) auto 55px;
}
@media (max-width: 768px) {
.schedule-modal__inner {
padding: calc(var(--site-header-height, 0px) + 10px) 25px 35px;
}
}
.schedule-modal__content .obi_num {
display: inline-block;
margin-bottom: 0.7em;
border: 1px solid #000;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
padding: 0.5em 1.2em;
line-height: 1;
}
.schedule-modal__content .post_info {
display: -ms-flexbox;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
line-height: 1;
}
.schedule-modal__content .post_info .date {
font-size: 3rem;
}
.schedule-modal__content .post_info .time {
font-size: 1.6rem;
margin-top: auto;
margin-left: 1em;
}
.schedule-modal__content .post_info .cate_list {
display: -ms-flexbox;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: auto;
margin-left: 1em;
font-size: 1.6rem;
}
@media (max-width: 768px) {
.schedule-modal__content .post_info .cate_list {
margin-left: auto;
}
}
.schedule-modal__content .post_info .cate_list li:after {
content: "|";
padding-right: 0.5em;
padding-left: 0.5em;
}
.schedule-modal__content .post_info .cate_list li:last-child:after {
content: none;
}
.schedule-modal__content .ttl {
margin-bottom: 0.4em;
margin-top: 0.7em;
font-size: 3rem;
line-height: 1.4;
}
@media (max-width: 768px) {
.schedule-modal__content .ttl {
font-size: 2.3rem;
}
}
.schedule-modal__content .place {
margin-top: 0.5em;
margin-bottom: 1em;
font-size: 1.8rem;
}
@media (max-width: 768px) {
.schedule-modal__content .place {
margin-bottom: 1.2em;
font-size: 1.6rem;
}
}
.schedule-modal__content .catch {
margin-bottom: 2em;
font-size: 2rem;
}
@media (max-width: 768px) {
.schedule-modal__content .catch {
margin-bottom: 1.2em;
font-size: 1.6rem;
}
}
.schedule-modal__content .catch p {
font-size: 1em;
line-height: 2;
}
.schedule-modal__content .icatch {
margin-bottom: 35px;
}
@media (max-width: 768px) {
.schedule-modal__content .icatch {
margin-bottom: 20px;
}
}
.schedule-modal__content .right .name {
margin-bottom: 0.2em;
}
.schedule-modal__content .right .position {
margin-bottom: 1em;
}
.schedule-modal__content .the_content {
margin-bottom: 3em;
font-size: 1.6rem;
}
@media (max-width: 768px) {
.schedule-modal__content .the_content {
font-size: 1.4rem;
}
}
.schedule-modal__content .the_content p {
margin-bottom: 1em;
font-size: 1em;
line-height: 2em;
}
.schedule-modal__content .the_content p:last-child {
margin-bottom: 0;
}
.schedule-modal__body {
margin-top: 30px;
}
.schedule-modal__body p {
font-size: 1.6rem;
line-height: 1.8;
}   .schedule-modal__close--icon {
position: absolute;
top: 0;
right: 0;
width: 44px;
height: 44px;
padding: 0;
border: 0;
background: transparent;
cursor: pointer;
}
.schedule-modal__close--icon span {
position: absolute;
top: 50%;
left: 50%;
display: block;
width: 36px;
height: 1px;
background-color: currentColor;
}
.schedule-modal__close--icon span:first-child {
transform: translate(-50%, -50%) rotate(45deg);
}
.schedule-modal__close--icon span:last-child {
transform: translate(-50%, -50%) rotate(-45deg);
}
.schedule-modal__close--icon:hover {
opacity: 0.6;
}
.schedule-modal__close--icon:focus-visible {
outline: 2px solid currentColor;
outline-offset: 4px;
}
@media (max-width: 768px) {
.schedule-modal__close--icon {
top: 15px;
right: 15px;
}
}   .schedule-modal__close-button {
display: block;
min-width: 180px;
margin: 50px auto 0;
padding: 12px 25px;
background: transparent;
color: inherit;
font-size: 2rem;
cursor: pointer;
font-family: "Barlow Condensed", sans-serif;
font-weight: 500;
font-style: normal;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.schedule-modal__close-button:hover {
color: var(--page-yellow);
background-color: #000;
}
.schedule-modal__close-button:focus-visible {
outline: 2px solid currentColor;
outline-offset: 4px;
}   body.is-modal-open {
overflow: hidden;
}
@media (prefers-reduced-motion: reduce) {
.schedule-modal {
transition: none;
transform: none;
}
}