@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP&family=Zen+Old+Mincho&display=swap');
@font-face {
    font-family: "RizomaM";
    src: url("/assets/font/RizomaM-Regular.woff2") format("woff2"),
        url("/assets/font/RizomaM-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "RizomaM";
    src: url("/assets/font/RizomaM-Italic.woff2") format("woff2"),
        url("/assets/font/RizomaM-Italic.woff") format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
/* ==================================================
common
================================================== */
html, body {
	width: 100%;
    height: 100%;
    color: var(--black-bg-text-color);
    background: #000000;
    touch-action: manipulation;
    overflow-x: hidden;
    overflow-x: clip;
    --black-bg-text-color: #E9E9E9;
    --sub-text-color: #6F6F6F;
    --border-color: #454545;
}
body {
    font-family: "RizomaM", "Zen Old Mincho", "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variant-ligatures: common-ligatures contextual;
    font-feature-settings: "liga" 1, "clig" 1, "calt" 1;
    line-height: 1.5;
    overflow-wrap: break-word;
    word-break: break-word;
}
html[lang="en"] body {
    line-height: 1.4;
    letter-spacing: 0.03em;
}
.bg-white {
    color: #484848;
    background-color: #FFFFFF;
    --border-color: #EBEBEB;
}
.bg-black {
    color: var(--black-bg-text-color);
    background-color: #000000;
}
/* PC, Tablet */
@media screen and (min-width: 768px) , print {
    html, body {
        font-size: clamp(14px, 1.111vw, 16px);
    }
    .br-sp {
        display: none;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    html, body {
        font-size: clamp(11px, 3.733vw, 14px);
    }
    .br-pc {
        display: none;
    }
}
/* --------------------------------------------------
font, text
-------------------------------------------------- */
dl dt {
    font-weight: normal;
}
sup, sub {
    font-size: 0.5em;
}
sup {
    top: -1.5em;
}
sub {
    bottom: -0.25em;
}
em, i {
    font-style: italic;
}
b, strong {
    font-weight: unset;
}
small, .small {
    font-size: 0.8em;
}
small {
    display: block;
}
.txt-right {
    text-align: right !important;
}
.txt-center {
    text-align: center !important;
}
.txt-dash {
    position: relative;
    top: -0.1em;
    margin: 0 0.1em;
}
.txt-empty {
    color: var(--sub-text-color);
    text-align: center;
    padding: 6em;
}
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}
budoux-ja {
    display: contents;
}
/* SP */
@media screen and (max-width: 767px) {
    small, .small {
        font-size: 10px;
    }
}
/* --------------------------------------------------
link, btn
-------------------------------------------------- */
a {
    cursor: pointer;
    text-underline-offset: 0.222em;
    text-decoration-thickness: 1px;
    text-decoration-skip-ink: auto;
}
a .hover-line {
    text-underline-offset: inherit;
    text-decoration-thickness: inherit;
}
:focus,
:focus-visible {
    outline: none;
}
a .hover-line {
    text-decoration-line: underline;
}
a:hover .hover-line {
    text-decoration-line: none;
}
/* --------------------------------------------------
img, video
-------------------------------------------------- */
img {
    width: 100%;
    height: auto;
}
picture {
    display: block;
}
figure {
    position: relative;
}
figure figcaption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    font-size: 10px;
    text-align: right;
    color: #E9E9E9;
    padding: 1em;
    z-index: 1;
}
video {
    width: 100%;
    height: auto;
}
/* --------------------------------------------------
w
-------------------------------------------------- */
.w01, .w02 {
    padding: 0 2.5rem;
    margin: 0 auto;
}
/* PC, Tablet */
@media screen and (min-width: 768px) , print {
    .w01 {
        max-width: 70.5rem;
    }
    .w02 {
        max-width: 61rem;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    .w01 {
        padding: 0 5.333vw;
    }
    .w02 {
        padding: 0 8vw;
    }
}
/* --------------------------------------------------
site-ttl
-------------------------------------------------- */
.site-ttl-wrap,
.site-ttl-wrap a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
}
.site-ttl {
    font-size: 1.6875rem;
    width: 1.25em;
    letter-spacing: 0.2em;
    writing-mode: vertical-rl;
}
.site-ttl-wrap.is-en .site-ttl {
    display: none;
}
.site-ttl-en {
    font-size: 0.875rem;
    text-align: center;
    letter-spacing: 0.03em;
    line-height: 1;
}
.site-ttl-wrap.is-en .site-ttl-en {
    font-size: 1.75rem;
}
/* SP */
@media screen and (max-width: 767px) {
    .site-ttl {
        font-size: 5.333vw;
    }
    .site-ttl-en {
        font-size: 2.666vw;
    }
    .site-ttl-wrap.is-en .site-ttl-en {
        font-size: 5.333vw;
    }
}
/* --------------------------------------------------
nav
-------------------------------------------------- */
.g-nav-list {
    display: flex;
    flex-direction: column;
    text-align: center;
}
.g-nav-item {
    font-size: 1.3125rem;
    line-height: 1.4;
}
.g-nav-item a {
    display: block;
    padding: 0.5em 0;
    transition: opacity 0.3s cubic-bezier(0.22,0.61,0.36,1);
}
.g-nav-list:hover .g-nav-item a {
    opacity: 0.6;
}
.g-nav-list:hover .g-nav-item a:hover {
    opacity: 1;
}
.lan-nav-list {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 0.5em;
}
.lan-nav-list .lan-nav-item::before {
    content: '｜';
    margin-right: 0.5em;
}
.lan-nav-list .lan-nav-item:first-child:before {
    display: none;
}
.lan-nav-list .lan-nav-item a {
    text-decoration: none;
    text-underline-offset: 0.2em;
}
.lan-nav-list .lan-nav-item.current a {
    text-decoration: underline;
}
/* SP */
@media screen and (max-width: 767px) {
    .g-nav-item {
        font-size: 1.285rem;
    }
}

/* ==================================================
loader
================================================== */
#loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000000;
    transition: opacity 4.5s cubic-bezier(0.39,0.57,0.56,1), visibility 0s 4.5s;
}
#loader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
#loader .loader-logo {
    width: 70%;
    height: 90%;
    opacity: 0;
    -webkit-animation: loader-fade-in 0.6s cubic-bezier(0.22,0.61,0.36,1) forwards;
    animation: loader-fade-in 0.6s cubic-bezier(0.22,0.61,0.36,1) forwards;
}
@-webkit-keyframes loader-fade-in {
    to {
        opacity: 0.5;
    }
}
@keyframes loader-fade-in {
    to {
        opacity: 0.5;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    #loader .loader-logo {
        width: 95%;
    }
}

/* ==================================================
header
================================================== */
#menu-btn {
    position: fixed;
    top: 0;
    right: 0;
    display: block;
    width: 4.25rem;
    height: 4.25rem;
    text-indent: -9999%;
    color: #484848;
    background-color: transparent;
    z-index: 999;
    overflow: hidden;
    transition: opacity 0.3s cubic-bezier(0.22,0.61,0.36,1);
}
#menu-btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.25rem;
    height: 1.25rem;
    transform: translate(-50%, -50%);
    background-color: currentColor;
    -webkit-mask: url("/assets/img/icon_menu.svg") center / contain no-repeat;
    mask: url("/assets/img/icon_menu.svg") center / contain no-repeat;
}
body.menu-open #menu-btn::before,
body:has(.contents-wrap > .bg-black) #menu-btn::before {
    color: var(--black-bg-text-color);
}
#menu-btn.is-open::before {
    width: 1.25rem;
    height: 1.25rem;
    -webkit-mask-image: url("/assets/img/icon_close.svg");
    mask-image: url("/assets/img/icon_close.svg");
}
#menu-btn:hover {
    opacity: 0.6;
}
#menu {
    position: fixed;
    inset: 0;
    z-index: 99;
    height: 100vh;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 1.5s cubic-bezier(0.39,0.57,0.56,1), visibility 0s 1.5s;
}
#menu::before {
    content: '';
    position: fixed;
    inset: 0;
    display: block;
    width: 100%;
    height: 100vh;
    background-image: url("/assets/img/menu.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    z-index: 0;
}
html.menu-locked,
html.page-transition-open,
html.lightbox-open {
    overflow: hidden;
    overscroll-behavior: none;
}
body.menu-locked,
body.lightbox-open,
body.page-transition-open {
    padding-right: var(--scrollbar-width, 0px);
}
body.menu-open #menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.9s cubic-bezier(0.39,0.57,0.56,1), visibility 0s;
}
#menu .menu-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 3em;
    box-sizing: border-box;
    width: 100%;
    min-height: 100vh;
    padding: 1.5rem;
    z-index: 1;
}
#menu.is-nav-disabled .g-nav {
    pointer-events: none;
}
#menu .g-nav {
    padding-bottom: 3em;
}
/* SP */
@media screen and (max-width: 767px) {
    #menu-btn {
        width: 15.466vw;
        height: 15.466vw;
    }
    #menu-btn::before {
        width: 4.8vw;
        height: 4.8vw;
    }
    #menu,
    #menu::before {
        height: 100dvh;
    }
    #menu::before {
        background-image: url("/assets/img/menu_sp.jpg");
    }
    #menu .menu-inner {
        min-height: 100dvh;
    }
    #menu .menu-inner {
        padding: 5.333vw;
    }
    #menu .g-nav {
        padding-bottom: 2em;
    }
}

/* ==================================================
footer
================================================== */
#footer {
    position: relative;
}
#footer::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 70%;
    height: 90%;
    background-image: url("/assets/img/logo_siro.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    z-index: 0;
    opacity: 0;
}
#footer.is-logo-shown::after {
    opacity: 0.25;
    transition: opacity 1.5s cubic-bezier(0.39,0.57,0.56,1);
}
#footer .footer-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 3em;
    padding: 4.5rem 0 1.5rem;
    z-index: 1;
}
#footer .footer-copy-wrap {
    margin-top: 3em;
}
#footer .footer-copy-wrap,
#footer .footer-link-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5em;
}
#footer .footer-copy-wrap,
#footer .footer-copy-wrap small {
    font-size: 10px;
}
#footer .footer-link-list .footer-link-item::before {
    content: '｜';
    margin-right: 0.5em;
}
#footer .footer-link-item a {
    text-decoration-line: underline;
}
#footer .footer-link-item a:hover {
    text-decoration: none;
}
.contents-wrap:has(> #ceramics-and-heart) + #footer {
    display: none;
}
/* SP */
@media screen and (max-width: 767px) {
    #footer::after {
        width: 95%;
    }
    #footer .footer-inner {
        padding: 12vw 0 8vw;
    }
    #footer .footer-copy-wrap {
        margin-top: 2em;
    }
}

/* ==================================================
comp
================================================== */
.comp-img {
    width: 100%;
}
.comp-img.is-image-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 3/2;
    background-color: var(--image-bg-color, #000000);
    overflow: hidden;
}
.comp-img.is-image-bg img {
    width: 100%;
    height: 100%;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    padding: 5%;
}
.comp-txt-wrap {
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.comp-txt-wrap a,
.comp-editor-wrap a {
    text-decoration-line: underline;
}
.comp-txt-wrap a:hover,
.comp-editor-wrap a:hover {
    text-decoration: none;
}
.comp-txt-wrap p,
.comp-editor-wrap p {
    line-height: 2;
}
html[lang="en"] .comp-txt-wrap p,
html[lang="en"] .comp-editor-wrap p {
    line-height: 1.7;
}
.comp-editor-wrap hr {
    color: rgba(255, 255, 255, 0);
    border: none;
    height: 1em;
}
.comp-txt-wrap blockquote,
.comp-editor-wrap blockquote {
    position: relative;
    padding-left: 6.25em;
    display: flex;
    flex-direction: column;
    gap: 0.25em;
}
.comp-txt-wrap blockquote::before,
.comp-editor-wrap blockquote::before {
    content: "";
    position: absolute;
    top: 1em;
    left: 0;
    display: block;
    width: 5.25rem;
    height: 0;
    border-top: 1px solid currentColor;
}
.comp-txt-wrap blockquote cite,
.comp-editor-wrap blockquote cite {
    font-style: normal;
    color: var(--sub-text-color);
    margin-top: 0.5em;
}
.comp-txt-wrap small,
.comp-editor-wrap small {
    display: block;
    line-height: 1.75;
}
.comp-txt-wrap ul,
.comp-txt-wrap ol,
.comp-editor-wrap ul,
.comp-editor-wrap ol {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    font-size: 0.875rem;
}
.comp-txt-wrap ul,
.comp-editor-wrap ul {
    list-style: disc;
    padding-left: 1.25em;
}
.comp-txt-wrap ol,
.comp-editor-wrap ol {
    list-style: decimal;
    padding-left: 1.25em;
}
.comp-txt-wrap li,
.comp-editor-wrap li {
    line-height: 1.75;
}
html[lang="en"] .comp-txt-wrap li,
html[lang="en"] .comp-editor-wrap li {
    line-height: 1.6;
}
.comp-txt-wrap dl,
.comp-editor-wrap dl {
    display: grid;
    font-size: 0.875rem;
    grid-template-columns: auto 1fr;
}
.comp-txt-wrap dt,
.comp-txt-wrap dd,
.comp-editor-wrap dt,
.comp-editor-wrap dd {
    padding: 1rem 0;
    border-bottom: 1px solid var(--border-color);
    line-height: 1.75;
}
html[lang="en"] .comp-txt-wrap dt,
html[lang="en"] .comp-txt-wrap dd,
html[lang="en"] .comp-editor-wrap dt,
html[lang="en"] .comp-editor-wrap dd {
    line-height: 1.6;
}
html[lang="en"] .comp-txt-wrap dt *,
html[lang="en"] .comp-txt-wrap dd *,
html[lang="en"] .comp-editor-wrap dt *,
html[lang="en"] .comp-editor-wrap dd * {
    line-height: inherit;
}
.comp-txt-wrap dt,
.comp-editor-wrap dt {
    min-width: 5.25rem;
    max-width: 12.5rem;
    padding-right: 2rem;
}
.comp-txt-wrap dd h1,
.comp-txt-wrap dd h2,
.comp-txt-wrap dd h3,
.comp-txt-wrap dd h4,
.comp-txt-wrap dd h5,
.comp-txt-wrap dd h6,
.comp-editor-wrap dd h1,
.comp-editor-wrap dd h2,
.comp-editor-wrap dd h3,
.comp-editor-wrap dd h4,
.comp-editor-wrap dd h5,
.comp-editor-wrap dd h6 {
    font-size: 1em;
}
.comp-txt-wrap dl dt:last-of-type,
.comp-txt-wrap dl dd:last-of-type,
.comp-editor-wrap dl dt:last-of-type,
.comp-editor-wrap dl dd:last-of-type {
    border-bottom: 0;
}
.comp-editor-wrap > * + * {
    margin-top: 3em;
}
.comp-editor-wrap > p + p,
.comp-editor-wrap > h1 + p,
.comp-editor-wrap > h2 + p,
.comp-editor-wrap > h3 + p,
.comp-editor-wrap > h4 + p,
.comp-editor-wrap > h5 + p,
.comp-editor-wrap > h6 + p,
.comp-editor-wrap > h1 + h1,
.comp-editor-wrap > h1 + h2,
.comp-editor-wrap > h1 + h3,
.comp-editor-wrap > h1 + h4,
.comp-editor-wrap > h1 + h5,
.comp-editor-wrap > h1 + h6,
.comp-editor-wrap > h2 + h1,
.comp-editor-wrap > h2 + h2,
.comp-editor-wrap > h2 + h3,
.comp-editor-wrap > h2 + h4,
.comp-editor-wrap > h2 + h5,
.comp-editor-wrap > h2 + h6,
.comp-editor-wrap > h3 + h1,
.comp-editor-wrap > h3 + h2,
.comp-editor-wrap > h3 + h3,
.comp-editor-wrap > h3 + h4,
.comp-editor-wrap > h3 + h5,
.comp-editor-wrap > h3 + h6,
.comp-editor-wrap > h4 + h1,
.comp-editor-wrap > h4 + h2,
.comp-editor-wrap > h4 + h3,
.comp-editor-wrap > h4 + h4,
.comp-editor-wrap > h4 + h5,
.comp-editor-wrap > h4 + h6,
.comp-editor-wrap > h5 + h1,
.comp-editor-wrap > h5 + h2,
.comp-editor-wrap > h5 + h3,
.comp-editor-wrap > h5 + h4,
.comp-editor-wrap > h5 + h5,
.comp-editor-wrap > h5 + h6,
.comp-editor-wrap > h6 + h1,
.comp-editor-wrap > h6 + h2,
.comp-editor-wrap > h6 + h3,
.comp-editor-wrap > h6 + h4,
.comp-editor-wrap > h6 + h5,
.comp-editor-wrap > h6 + h6,
.comp-editor-wrap > h1 + ul,
.comp-editor-wrap > h1 + ol,
.comp-editor-wrap > h2 + ul,
.comp-editor-wrap > h2 + ol,
.comp-editor-wrap > h3 + ul,
.comp-editor-wrap > h3 + ol,
.comp-editor-wrap > h4 + ul,
.comp-editor-wrap > h4 + ol,
.comp-editor-wrap > h5 + ul,
.comp-editor-wrap > h5 + ol,
.comp-editor-wrap > h6 + ul,
.comp-editor-wrap > h6 + ol,
.comp-editor-wrap > ul + ul,
.comp-editor-wrap > ul + ol,
.comp-editor-wrap > ul + p,
.comp-editor-wrap > p + ul,
.comp-editor-wrap > ol + ol,
.comp-editor-wrap > ol + ul,
.comp-editor-wrap > ol + p,
.comp-editor-wrap > p + ol,
.comp-editor-wrap > .comp-box + .comp-box {
    margin-top: 1em;
}
.comp-editor-wrap > :not(:first-child):is(h1, h2) {
    margin-top: 3em;
}
.comp-editor-wrap h1,
.comp-editor-wrap h2 {
    font-size: 1.666em;
}
.comp-editor-wrap h3 {
    font-size: 1.333em;
}
.comp-editor-wrap h4,
.comp-editor-wrap h5,
.comp-editor-wrap h6 {
    font-size: 1.111em;
}
.comp-editor-wrap ul,
.comp-editor-wrap ol {
    font-size: 1rem;
}
.comp-editor-wrap .comp-img-wrap,
.comp-editor-wrap .comp-video-wrap,
.comp-editor-wrap .comp-map-wrap {
    margin-left: auto;
    margin-right: auto;
}
.comp-editor-wrap .comp-img-wrap figcaption,
.comp-editor-wrap .comp-video-wrap figcaption,
.comp-editor-wrap .comp-map-wrap figcaption {
    position: relative;
    bottom: unset;
    padding: 0.5em 0 0 0;
    color: inherit;
}
.comp-editor-wrap .comp-img-wrap ul {
    list-style: none;
    padding-left: 0;
}
.comp-editor-wrap .comp-img-column01-s {
    width: 70%;
}
.comp-editor-wrap .comp-img-column01-l,
.comp-editor-wrap .comp-img-column02,
.comp-editor-wrap .comp-img-column03 {
    margin-left: calc((min(100vw, 70.5rem) - min(100vw, 61rem)) / -2);
    margin-right: calc((min(100vw, 70.5rem) - min(100vw, 61rem)) / -2);
}
.comp-editor-wrap .comp-img-column01-s .comp-img-list,
.comp-editor-wrap .comp-img-column01-m .comp-img-list,
.comp-editor-wrap .comp-img-column01-l .comp-img-list {
    display: grid;
    gap: 1rem;
}
.comp-editor-wrap .comp-img-column02 .comp-img-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}
.comp-editor-wrap .comp-img-column03 .comp-img-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.comp-editor-wrap .comp-img-slide {
    --slide-w: 60%;
    position: relative;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    padding-top: 3em;
    padding-bottom: 3em;
}
.comp-editor-wrap .comp-img-slide .comp-img-list {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    transition: transform 0.6s cubic-bezier(0.22,0.61,0.36,1);
    will-change: transform;
}
.comp-editor-wrap .comp-img-slide .comp-img-list > li {
    flex: 0 0 var(--slide-w);
    width: var(--slide-w);
}
.comp-editor-wrap .comp-img-slide img {
    aspect-ratio: 3/2;
    object-fit: contain;
}
.comp-editor-wrap .comp-img-slide figcaption {
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s cubic-bezier(0.22,0.61,0.36,1), visibility 0s 0.6s;
}
.comp-editor-wrap .comp-img-slide .is-active figcaption {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.6s cubic-bezier(0.22,0.61,0.36,1) 0.3s;
}
.comp-img-slide-nav {
    position: absolute;
    top: 0;
    bottom: 0;
    width: calc((100% - var(--slide-w)) / 2);
    padding: 0;
    border: 0;
    background: transparent;
    z-index: 2;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}
.comp-editor-wrap .comp-video-wrap video,
.comp-editor-wrap .comp-video-wrap iframe {
    display: block;
    width: 100%;
    border: 0;
    background-color: #000000;
}
.comp-editor-wrap .comp-video-wrap iframe {
    height: 100%;
}
.comp-editor-wrap .comp-video-embed {
    aspect-ratio: 16 / 9;
    background-color: #000000;
}
.comp-editor-wrap .comp-map-wrap iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}
.comp-editor-wrap .comp-map-embed {
    aspect-ratio: 16 / 9;
    background-color: var(--border-color);
}
/* PC, Tablet */
@media screen and (min-width: 768px) , print {
    .comp-img-slide-prev {
        left: 0;
        cursor: url("/assets/img/icon_arrow_cursor_prev.svg") 7 13, w-resize;
    }
    .comp-img-slide-next {
        right: 0;
        cursor: url("/assets/img/icon_arrow_cursor_next.svg") 7 13, e-resize;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-editor-wrap h1,
    .comp-editor-wrap h2 {
        font-size: 1.285rem;
    }
    .comp-editor-wrap h3 {
        font-size: 1.142rem;
    }
    .comp-editor-wrap h4,
    .comp-editor-wrap h5,
    .comp-editor-wrap h6 {
        font-size: 1.076rem;
    }
    .comp-txt-wrap ul,
    .comp-txt-wrap ol,
    .comp-editor-wrap ul,
    .comp-editor-wrap ol {
        font-size: 0.928rem;
    }
    .comp-txt-wrap dl,
    .comp-editor-wrap dl {
        font-size: 0.928rem;
        grid-template-columns: 1fr;
    }
    .comp-txt-wrap dt,
    .comp-editor-wrap dt {
        font-size: 0.857rem;
        color: var(--sub-text-color);
        max-width: none;
        padding: 4vw 0 0.25em;
        border-bottom: 0;
    }
    .comp-txt-wrap dd,
    .comp-editor-wrap dd {
        padding: 0 0 4vw;
    }
    .comp-txt-wrap dl dt:first-child,
    .comp-editor-wrap dl dt:first-child {
        padding-top: 0;
    }
    .comp-txt-wrap dl dd:last-child,
    .comp-editor-wrap dl dd:last-child {
        padding-bottom: 0;
    }
    .comp-txt-wrap blockquote,
    .comp-editor-wrap blockquote {
        padding-left: 2.5em;
    }
    .comp-txt-wrap blockquote::before,
    .comp-editor-wrap blockquote::before {
        width: 2em;
    }
    .comp-editor-wrap .comp-img-column01-s {
        width: 80%;
    }
    .comp-editor-wrap .comp-img-column01-l,
    .comp-editor-wrap .comp-img-column02,
    .comp-editor-wrap .comp-img-column03 {
        margin-left: -4vw;
        margin-right: -4vw;
    }
    .comp-editor-wrap .comp-img-column01-s .comp-img-list,
    .comp-editor-wrap .comp-img-column01-m .comp-img-list,
    .comp-editor-wrap .comp-img-column01-l .comp-img-list {
        gap: 2.666vw;
    }
    .comp-editor-wrap .comp-img-column02 .comp-img-list {
        gap: 2.666vw;
    }
    .comp-editor-wrap .comp-img-column03 .comp-img-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 2.666vw;
    }
    .comp-editor-wrap .comp-img-slide .comp-img-list {
        gap: 2.666vw;
    }
    .comp-editor-wrap .comp-img-slide {
        --slide-w: 75%;
        touch-action: pan-y;
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }
    .comp-img-slide-nav {
        display: none;
    }
}
/* --------------------------------------------------
comp-dialogue
-------------------------------------------------- */
.comp-dialogue-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
html[lang="en"] .comp-dialogue-wrap {
    gap: 1em;
}
.comp-dialogue {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1em;
}
.comp-dialogue-name {
    min-width: 5.25rem;
    max-width: 12.5rem;
    color: var(--sub-text-color);
    line-height: 2;
}
.comp-dialogue-body > * + * {
    margin-top: 1em;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-dialogue-wrap {
        gap: 2em;
    }
    .comp-dialogue {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .comp-dialogue-name {
        font-size: 0.857rem;
        line-height: 1.5;
        max-width: none;
        padding: 0 0 0.5em;
        border-bottom: 0;
    }
}
/* --------------------------------------------------
comp-box
-------------------------------------------------- */
.comp-box {
    border: var(--border-color) 1px solid;
    padding: 3rem 3.5rem;
}
.comp-box-inner {
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.comp-box h1,
.comp-box h2,
.comp-box h3,
.comp-box h4,
.comp-box h5,
.comp-box h6 {
    font-size: 1rem;
}
.comp-box .comp-txt-wrap {
    gap: 0.75em;
}
html[lang="en"] .comp-box .comp-txt-wrap {
    gap: 0.5em;
}
.comp-box .comp-txt-wrap p {
    font-size: 0.875rem;
    line-height: 1.75;
}
.comp-box .comp-btn-wrap {
    margin-top: 0.25em;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-box {
        padding: 8vw 5.333vw;
        margin-left: -4vw;
        margin-right: -4vw;
    }
    .comp-box h1,
    .comp-box h2,
    .comp-box h3,
    .comp-box h4,
    .comp-box h5,
    .comp-box h6 {
        font-size: 1.076rem;
    }
    .comp-box .comp-txt-wrap p {
        font-size: 0.857rem;
        line-height: 2;
    }
}
html[lang="en"] .comp-box .comp-txt-wrap p {
    line-height: 1.6;
}
/* --------------------------------------------------
comp-btn
-------------------------------------------------- */
.comp-btn a,
.comp-btn {
    display: inline-block;
    font-size: 0.875rem;
    text-decoration: none !important;
    line-height: 1;
    letter-spacing: 0.03em;
    padding: 0.75em 1.5em;
    border: 1px solid currentColor;
    border-radius: 3em;
    transition: border-color 0.3s cubic-bezier(0.22,0.61,0.36,1);
}
.comp-btn a:hover,
.comp-btn:hover {
    border-color: var(--border-color);
}
.comp-btn.comp-sub-btn {
    border-color: var(--border-color);
}
.comp-txtbtn a,
.comp-txtbtn {
    font-size: 1.125rem;
    text-decoration-line: underline;
}
.comp-txtbtn a:hover,
.comp-txtbtn:hover {
    text-decoration-line: none;
}
.comp-cat-list {
    display: flex;
    flex-wrap: wrap;
    font-size: 0.8125rem;
}
.comp-cat-item::after {
    content: '/';
    margin: 0 0.25em;
}
.comp-cat-list .comp-cat-item:last-child::after {
    display: none;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-btn a,
    .comp-btn {
        font-size: 0.928rem;
    }
    .comp-txtbtn a,
    .comp-txtbtn {
        font-size: 1rem;
    }
    .comp-cat-list {
        font-size: 0.857rem;
    }
}
/* --------------------------------------------------
comp-cate-btn
-------------------------------------------------- */
.comp-catbtn-list-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.25em;
}
.comp-catbtn-list-wrap .comp-catbtn-list::before {
    content: '｜';
    color: #EBEBEB;
}
.comp-catbtn-list-wrap .page-category::before {
    display: none;
}
.comp-catbtn-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.25em;
}
.comp-catbtn-item a {
    display: inline-block;
    font-size: 0.9375rem;
    line-height: 1;
    padding: 0.5em 1em;
    border: var(--border-color) 1px solid;
    border-radius: 3em;
}
.comp-catbtn-item.current a {
    border-color: currentColor;
}
.comp-catbtn-select-wrap {
    display: none;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-catbtn-list-wrap[data-select-ready] .comp-catbtn-list[data-select-source] {
        display: none;
    }
    .comp-catbtn-list-wrap[data-select-ready] {
        justify-content: center;
    }
    .comp-catbtn-list-wrap[data-select-ready] .comp-catbtn-list::before {
        display: none;
    }
    .comp-catbtn-select-wrap {
        position: relative;
        display: inline-block;
        max-width: 100%;
    }
    .comp-catbtn-select-wrap::after {
        content: '';
        position: absolute;
        top: 50%;
        right: 1em;
        width: 0.666em;
        height: 0.666em;
        background-color: currentColor;
        -webkit-mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
        mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
        transform: translateY(-50%) rotate(90deg);
        pointer-events: none;
    }
    .comp-catbtn-select {
        max-width: 100%;
        font-size: 0.928rem;
        line-height: 1.25;
        color: inherit;
        padding: 0.5em 2em 0.5em 1em;
        border: 1px solid currentColor;
        border-radius: 3em;
        background-color: transparent;
        appearance: none;
        -webkit-appearance: none;
    }
    .comp-catbtn-list-wrap[data-current-tab="true"] .comp-catbtn-select {
        border-color: var(--border-color);
    }
    .comp-catbtn-select-sizer {
        position: absolute;
        left: -9999px;
        top: 0;
        visibility: hidden;
        white-space: nowrap;
        font: inherit;
        font-size: 0.928rem;
        line-height: 1.25;
        padding: 0.5em 2em 0.5em 1em;
        border: 1px solid transparent;
    }
    .comp-catbtn-item a {
        font-size: 0.928rem;
        line-height: 1.25;
    }
}
/* --------------------------------------------------
comp-pager
-------------------------------------------------- */
.comp-pager-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.comp-pager {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1em;
    width: 100%;
    color: #6F6F6F;
}
.comp-pager-item a,
.comp-pager-item span,
.comp-pager-prev,
.comp-pager-next {
    display: block;
    line-height: 1;
    padding: 0.75em;
}
.comp-pager-item.current span,
.comp-pager-prev,
.comp-pager-next {
    color: #484848;
}
.comp-pager-prev,
.comp-pager-next {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}
.comp-pager-prev {
    justify-self: start;
}
.comp-pager-next {
    justify-self: end;
}
.comp-pager-prev::before,
.comp-pager-next::after {
    content: '';
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
    mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
}
.comp-pager-prev::before {
    transform: rotate(180deg);
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-pager-prev,
    .comp-pager-next {
        gap: 0;
        font-size: 0;
    }
    .comp-pager-prev::before,
    .comp-pager-next::after {
        width: 1rem;
        height: 1rem;
    }
    .comp-pager-item a,
    .comp-pager-item span,
    .comp-pager-prev,
    .comp-pager-next {
        padding: 2vw;
    }
}
/* --------------------------------------------------
comp-work
-------------------------------------------------- */
.comp-work-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    row-gap: 4.5rem;
    column-gap: 1px;
}
.comp-work-list.comp-archive-list {
    grid-template-columns: repeat(4, 1fr);
}
.comp-work-item {
    width: 100%;
}
.comp-work-list.is-reveal-ready .comp-work-item {
    opacity: 0;
    transition: opacity 0.6s cubic-bezier(0.22,0.61,0.36,1);
    transition-delay: 0s;
}
.comp-work-list.is-reveal-started .comp-work-item {
    opacity: 1;
    transition-delay: calc(var(--work-reveal-index, 0) * 0.45s);
}
.comp-work-item a {
    display: block;
}
.comp-work-item .comp-inner {
    display: flex;
    flex-direction: column;
    gap: 1.25em;
}
.comp-work-item .comp-img img {
    aspect-ratio: 5/7;
    object-fit: cover;
}
.comp-work-item .comp-ttl-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.125em;
    padding: 0 3rem;
    transition: opacity 0.6s cubic-bezier(0.39,0.57,0.56,1);
}
.comp-work-item .comp-ttl-wrap * {
    text-align: center;
}
.comp-work-item .comp-year {
    font-size: 0.8125rem;
}
.comp-work-item .comp-collection {
    font-size: 11px;
}
.comp-work-item .comp-collection::before {
    content: '（';
}
.comp-work-item .comp-collection::after {
    content: '）';
}
.comp-work-slide-wrap {
    --slide-w: 60%;
    --slide-gap: 1px;
    position: relative;
    width: 100%;
    overflow: hidden;
}
.comp-work-slide {
    display: flex;
    gap: var(--slide-gap);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.comp-work-slide::-webkit-scrollbar {
    display: none;
}
.comp-work-slide::before,
.comp-work-slide::after {
    content: '';
    flex: 0 0 calc((100% - var(--slide-w)) / 2 - var(--slide-gap));
}
.comp-work-slide.is-loop::before,
.comp-work-slide.is-loop::after {
    display: none;
}
.comp-work-slide-item {
    flex: 0 0 var(--slide-w);
    width: var(--slide-w);
    scroll-snap-align: center;
}
.comp-work-slide-item a {
    display: block;
}
.comp-work-slide-item .comp-inner {
    display: flex;
    flex-direction: column;
    gap: 1.25em;
}
.comp-work-slide-item img {
    aspect-ratio: 7 / 5;
    object-fit: cover;
}
.comp-work-slide .comp-ttl {
    text-align: center;
    font-size: 1rem;
}
.comp-work-slide.is-loop .comp-work-slide-item {
    opacity: 0.8;
    transition: opacity 0.6s cubic-bezier(0.22,0.61,0.36,1);
}
.comp-work-slide.is-loop .comp-work-slide-item.is-center {
    opacity: 1;
}
.comp-work-slide.is-loop .comp-ttl {
    opacity: 0;
    transition: opacity 0.6s cubic-bezier(0.22,0.61,0.36,1) 0.3s;
}
.comp-work-slide.is-loop .comp-work-slide-item.is-center .comp-ttl {
    opacity: 1;
}
.comp-work-slide.is-loop .comp-work-slide-item {
    pointer-events: none;
}
.comp-work-slide.is-loop .comp-work-slide-item.is-center {
    pointer-events: auto;
}
.comp-work-slide-nav {
    position: absolute;
    top: 0;
    bottom: 0;
    width: calc((100% - var(--slide-w)) / 2);
    z-index: 2;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}
/* PC, Tablet */
@media screen and (min-width: 768px) , print {
    .comp-work-item .comp-ttl-wrap {
        opacity: 0;
    }
    .comp-work-item:hover .comp-ttl-wrap {
        opacity: 1;
    }
    .comp-work-slide-prev {
        left: 0;
        background: linear-gradient(to right, #000000, transparent);
        cursor: url("/assets/img/icon_arrow_cursor_prev.svg") 7 13, w-resize;
    }
    .comp-work-slide-next {
        right: 0;
        background: linear-gradient(to left, #000000, transparent);
        cursor: url("/assets/img/icon_arrow_cursor_next.svg") 7 13, e-resize;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-work-list {
        grid-template-columns: 1fr;
        row-gap: 12vw
    }
    .comp-work-item .comp-ttl-wrap {
        padding: 0 8vw;
    }
    .comp-work-item .comp-ttl {
        font-size: 1.142rem;
    }
    .comp-work-item .comp-year {
        font-size: 0.928rem;
    }
    .comp-work-list.comp-archive-list {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 8vw
    }
    .comp-work-item .comp-collection {
        font-size: 10px;
    }
    .comp-work-list.comp-archive-list .comp-work-item .comp-ttl {
        font-size: 1rem;
    }
    .comp-work-slide {
        touch-action: pan-y;
    }
    .comp-work-slide-nav {
        display: none;
    }
    .comp-work-slide-wrap {
        --slide-w: 80%;
    }
}
/* --------------------------------------------------
comp-exhibition-img
-------------------------------------------------- */
.comp-exhibition-img-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 4.5rem;
    column-gap: 1px;
}
.comp-exhibition-img-item > a {
    display: block;
}
.comp-exhibition-img-item .comp-inner {
    display: flex;
    flex-direction: column;
    gap: 1.25em;
}
.comp-exhibition-img-item .comp-img img {
    aspect-ratio: 3/2;
    object-fit: cover;
}
.comp-exhibition-img-item .comp-ttl-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
    margin: 0 auto;
    padding: 0 3rem;
}
.comp-exhibition-img-item .comp-ttl-wrap * {
    text-align: center;
}
.comp-exhibition-img-item .comp-ttl {
    font-size: 1.25rem;
}
.comp-exhibition-img-item .comp-info-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    font-size: 0.8125rem;
    color: var(--sub-text-color);
}
/* PC, Tablet */
@media screen and (min-width: 768px) , print {
    #exhibitions-current .comp-exhibition-img-list {
        grid-template-columns: 1fr;
    }
    #exhibitions-current .comp-exhibition-img-item .comp-ttl-wrap {
        width: 50%;
    }
    #exhibitions-current .comp-exhibition-img-item .comp-ttl {
        font-size: 1.5rem;
    }
    #exhibitions-current .comp-exhibition-img-item .comp-info-wrap {
        font-size: 0.875rem;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-exhibition-img-list {
        grid-template-columns: 1fr;
        row-gap: 12vw;
    }
    .comp-exhibition-img-item .comp-ttl-wrap {
        gap: 0.5em;
        padding: 0 8vw;
    }
    .comp-exhibition-img-item .comp-ttl {
        font-size: 1.285rem;
    }
    .comp-exhibition-img-item .comp-info-wrap {
        font-size: 0.857rem;
    }
    #exhibitions-current .comp-exhibition-img-list {
        margin-left: -5.333vw;
        margin-right: -5.333vw;
    }
    #exhibitions-upcoming .comp-exhibition-img-list {
        padding-left: 5.333vw;
        padding-right: 5.333vw;
    }
}
/* --------------------------------------------------
comp-exhibition-txt
-------------------------------------------------- */
.comp-exhibition-txt-list,
.comp-commission-txt-list {
    display: grid;
    column-gap: 2rem;
    margin: -0.75rem 0;
}
.comp-exhibition-txt-list {
    grid-template-columns: 5.25rem 1fr 1fr 5.25rem;
}
.comp-commission-txt-list {
    grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) 5.25rem;
}
.comp-exhibition-txt-item,
.comp-commission-txt-item,
.comp-exhibition-txt-item > a,
.comp-commission-txt-item > a,
.comp-exhibition-txt-item .comp-inner,
.comp-commission-txt-item .comp-inner {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
}
.comp-exhibition-txt-item,
.comp-commission-txt-item {
    border-bottom: var(--border-color) 1px solid;
}
.comp-exhibition-txt-list .comp-exhibition-txt-item:last-child,
.comp-commission-txt-list .comp-commission-txt-item:last-child {
    border: none;
}
.comp-exhibition-txt-item .comp-inner,
.comp-commission-txt-item .comp-inner {
    align-items: center;
}
.comp-exhibition-txt-item .comp-ttl-wrap,
.comp-commission-txt-item .comp-ttl-wrap {
    display: grid;
    align-items: center;
    padding: 1.5rem 0;
}
.comp-exhibition-txt-item .comp-ttl-wrap {
    grid-column: 1 / 4;
    grid-template-columns: subgrid;
}
.comp-commission-txt-item .comp-ttl-wrap {
    grid-column: 1 / 3;
    grid-template-columns: subgrid;
    column-gap: 2rem;
    min-width: 0;
}
.comp-exhibition-txt-item .comp-cat-list,
.comp-exhibition-txt-item .comp-venue,
.comp-commission-txt-item .comp-venue {
    font-size: 0.875rem;
}
.comp-exhibition-txt-item .comp-img-wrap,
.comp-commission-txt-item .comp-img-wrap {
    padding: 0.75rem 0;
}
.comp-exhibition-txt-item .comp-img-wrap {
    grid-column: 4;
}
.comp-commission-txt-item .comp-img-wrap {
    grid-column: 3;
}
.comp-exhibition-txt-item .comp-img img,
.comp-commission-txt-item .comp-img img {
    aspect-ratio: 3/2;
    object-fit: cover;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-exhibition-txt-list,
    .comp-commission-txt-list {
        grid-template-columns: 1fr 22vw;
        column-gap: 4vw;
        margin: -4vw 0;
    }
    .comp-exhibition-txt-item .comp-inner,
    .comp-commission-txt-item .comp-inner {
        align-items: center;
        padding: 4vw 0;
    }
    .comp-exhibition-txt-item .comp-ttl-wrap,
    .comp-commission-txt-item .comp-ttl-wrap {
        grid-column: 1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5em;
        padding: 1.333vw 0;
    }
    .comp-exhibition-txt-item .comp-cat-list {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: baseline;
    }
    .comp-exhibition-txt-item .comp-cat-list {
        font-size: 0.857rem;
    }
    .comp-exhibition-txt-item .comp-venue {
        font-size: 0.857rem;
        color: var(--sub-text-color);
    }
    .comp-exhibition-txt-item .comp-img-wrap,
    .comp-commission-txt-item .comp-img-wrap {
        grid-column: 2;
        padding: 0;
    }
    .comp-exhibition-txt-item .comp-img.is-image-bg,
    .comp-commission-txt-item .comp-img.is-image-bg {
        aspect-ratio: 1/1;
    }
    .comp-exhibition-txt-item .comp-img img,
    .comp-commission-txt-item .comp-img img {
        aspect-ratio: 1/1;
    }
}
/* --------------------------------------------------
comp-media
-------------------------------------------------- */
.comp-media-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 4.5rem;
    column-gap: 1px;
}
.comp-media-item > a {
    display: block;
}
.comp-media-item .comp-inner {
    display: flex;
    flex-direction: column;
    gap: 1.25em;
}
.comp-media-item .comp-img img {
    aspect-ratio: 3/2;
    object-fit: cover;
}
.comp-media-item .comp-ttl-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
    padding: 0 3rem;
}
.comp-media-item .comp-ttl-wrap * {
    text-align: center;
}
.comp-media-item .comp-info-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    font-size: 0.8125rem;
    color: var(--sub-text-color);
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-media-list {
        grid-template-columns: 1fr;
        row-gap: 12vw;
    }
    .comp-media-item .comp-ttl-wrap {
        gap: 0.75em;
        padding: 0 8vw;
    }
    .comp-media-item .comp-info-wrap {
        font-size: 0.857rem;
    }
}
/* --------------------------------------------------
comp-news
-------------------------------------------------- */
.comp-news-list {
    display: grid;
    grid-template-columns: auto auto 1fr;
    column-gap: 2rem;
    margin: -1.5rem 0;
}
.comp-news-item,
.comp-news-item > a,
.comp-news-item .comp-inner {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
}
.comp-news-item {
    border-bottom: var(--border-color) 1px solid;
}
.comp-news-list .comp-news-item:last-child {
    border: none;
}
.comp-news-item .comp-inner {
    align-items: baseline;
    padding: 1.5rem 0;
}
.comp-news-item .comp-date,
.comp-news-item .comp-category {
    min-width: 5.25rem;
    max-width: 12.5rem;
    font-size: 0.875rem;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-news-list {
        display: flex;
        flex-direction: column;
    }
    .comp-news-list {
        gap: 0;
        margin: -4vw 0;
    }
    .comp-news-item,
    .comp-news-item > a,
    .comp-news-item .comp-inner {
        display: grid;
        grid-template-columns: auto auto 1fr;
    }
    .comp-news-item .comp-inner {
        align-items: stretch;
        column-gap: 0.5em;
        row-gap: 0.5em;
        padding: 4vw 0;
    }
    .comp-news-item .comp-date,
    .comp-news-item .comp-category {
        min-width: 0;
        max-width: none;
        font-size: 0.857rem;
        color: var(--sub-text-color);
    }
    .comp-news-item .comp-date {
        grid-column: 1;
    }
    .comp-news-item .comp-date::after {
        content: '｜';
        margin-left: 0.5em;
    }
    .comp-news-item .comp-category {
        grid-column: 2;
    }
    .comp-news-item .comp-ttl {
        grid-column: 1 / -1;
        line-height: 1.75;
    }
}
/* --------------------------------------------------
comp-chronology
-------------------------------------------------- */
.comp-chronology-list {
    display: grid;
    grid-template-columns: auto 1fr;
    margin: -1rem 0;
    font-size: 0.875rem;
    line-height: 1.75;
}
.comp-chronology-item {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
    align-items: stretch;
    gap: 2rem;
    position: relative;
}
.comp-chronology-item::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: calc(100% - 14.5rem);
    border-bottom: var(--border-color) 1px solid;
}
.comp-chronology-list .comp-chronology-item:last-child::after {
    display: none;
}
.comp-chronology-item .comp-year,
.comp-chronology-item .comp-age,
.comp-chronology-item .comp-body .comp-body-inner {
    padding: 1rem 0;
}
.comp-chronology-item .comp-year-wrap {
    display: flex;
    flex-wrap: nowrap;
    gap: 2rem;
}
.comp-chronology-item .comp-year,
.comp-chronology-item .comp-age {
    width: 5.25rem;
}
.comp-chronology-item .comp-body {
    grid-column: 2;
    display: grid;
    grid-template-columns: 1fr 12.5rem;
    column-gap: 2rem;
}
.comp-chronology-item .comp-body .comp-body-inner {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
}
.comp-chronology-item .comp-body a {
    text-decoration-line: underline;
}
.comp-chronology-item .comp-body a:hover {
    text-decoration: none;
}
.comp-chronology-item .comp-img-wrap {
    display: flex;
    flex-direction: column;
    gap: 1em;
    align-self: start;
    padding: 0.5em 2rem;
}
.comp-chronology-item .comp-img-wrap img {
    width: 100%;
    height: auto;
    aspect-ratio: 3/2;
    object-fit: contain;
    filter: grayscale(100%);
}
.comp-chronology-item .comp-img-wrap .is-link a {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    text-decoration: none;
}
.comp-chronology-item .comp-img-wrap .is-link a:hover img {
    filter: none;
}
.comp-chronology-item .comp-img-wrap figcaption {
    font-size: 11px;
    line-height: 1.5;
    position: static;
    text-align: center;
    padding: 0;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-chronology-list {
        grid-template-columns: 22vw 1fr;
        column-gap: 1em;
        margin: -4vw 0;
        font-size: 0.928rem;
    }
    .comp-chronology-item {
        display: grid;
        grid-template-columns: subgrid;
        gap: 0;
    }
    .comp-chronology-item::after {
        width: 100%;
    }
    .comp-chronology-item .comp-year-wrap {
        grid-column: 1;
        display: flex;
        flex-wrap: nowrap;
        gap: 1em;
        padding: 4vw 0;
    }
    .comp-chronology-item .comp-year {
        min-width: 2em;
    }
    .comp-chronology-item .comp-year,
    .comp-chronology-item .comp-age,
    .comp-chronology-item .comp-body .comp-body-inner {
        width: auto;
        padding: 0;
    }
    .comp-chronology-item .comp-body {
        grid-column: 2;
        display: flex;
        flex-direction: column;
        gap: 5.333vw;
        padding: 4vw 0;
    }
    .comp-chronology-item .comp-img-wrap {
        width: 100%;
        gap: 1.5em;
        padding: 0;
        margin-bottom: 1.333vw;
    }
}
/* --------------------------------------------------
comp-form
-------------------------------------------------- */
.comp-form-wrap,
.comp-form-wrap .js-input-only,
.comp-form-wrap .js-confirm-only {
    display: flex;
    flex-direction: column;
    gap: 3em;
}
#contact .contact-step-intro {
    margin-bottom: 3em;
}
.comp-form-list {
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
.comp-form-item {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.comp-form-list.comp-form-confirm .comp-form-item {
    padding-bottom: 1.5em;
    border-bottom: var(--border-color) 1px solid;
}
.comp-form-list.comp-form-confirm .comp-form-item:last-child {
    border: none;
    padding-bottom: 0;
}
.comp-form-item .comp-required {
    font-size: 0.8em;
}
.comp-form-item .comp-required::before {
    content: '［';
}
.comp-form-item .comp-required::after {
    content: '］';
}
.comp-form-item .comp-input input,
.comp-form-item .comp-input select,
.comp-form-item .comp-input textarea {
    width: 100%;
    padding: 1.25em;
    border: var(--border-color) 1px solid;
    background-color: transparent;
}
.comp-form-item .comp-input input::placeholder,
.comp-form-item .comp-input textarea::placeholder {
    color: #393939;
    opacity: 1;
}
.comp-form-item .comp-input select {
    padding-right: 3em;
    border-color: currentColor;
    appearance: none;
    -webkit-appearance: none;
}
.comp-form-item .comp-input:has(select) {
    position: relative;
}
.comp-form-item .comp-input:has(select)::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 1.25em;
    transform: translateY(-50%) rotate(90deg);
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
    mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
    pointer-events: none;
}
.comp-form-agreement {
    display: flex;
}
.comp-form-agreement label {
    display: inline-flex;
    align-items: center;
    gap: 0.75em;
    cursor: pointer;
}
.comp-form-agreement a {
    text-decoration-line: underline;
}
.comp-form-agreement a:hover {
    text-decoration: none;
}
.comp-form-agreement input[type="checkbox"] {
    position: relative;
    width: 1.5em;
    height: 1.5em;
    border: 1px solid currentColor;
    background-color: transparent;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    flex-shrink: 0;
    border-radius: 50%;
}
.comp-form-agreement input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0.75em;
    height: 0.75em;
    background-color: currentColor;
    border-radius: 50%;
}
.comp-form-submit {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 0.75em;
    padding-bottom: 9rem;
}
.comp-form-submit .cf7-cf-turnstile {
    position: absolute;
    bottom: 0;
}
.comp-form-submit .comp-btn {
    padding: 1em 2em;
}
.comp-form-submit .wpcf7-spinner {
    position: absolute;
    top: 50%;
    right: 0;
    margin: 0;
    transform: translateY(-50%);
}
.js-input-only[hidden],
.js-confirm-only[hidden],
.is-input-only[hidden],
.is-confirm-only[hidden],
.is-complete-only[hidden],
.comp-form-wrap .wpcf7-form[hidden] {
    display: none;
}
#contact .is-confirm-only {
    margin-bottom: 3em;
}
.comp-form-wrap .js-validation-error,
.comp-form-wrap .wpcf7-not-valid-tip {
    font-size: 0.85em;
    color: #dc3232;
    margin-top: 0.75em;
}
.comp-form-agreement .js-validation-error,
.comp-form-agreement .wpcf7-not-valid-tip {
    margin-top: 0;
}
.comp-form-wrap .wpcf7-list-item {
    margin: 0;
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-form-item .comp-label {
        font-size: 0.857rem;
    }
    .comp-form-item .comp-input input,
    .comp-form-item .comp-input select,
    .comp-form-item .comp-input textarea {
        font-size: 16px;
        padding: 1em;
    }
}
/* --------------------------------------------------
comp-cah
-------------------------------------------------- */
.comp-cah-slide-wrap {
    position: relative;
    width: 100%;
    height: 100vh;
    touch-action: pan-y;
    overflow: hidden;
    background-image:
        linear-gradient(rgba(0, 0, 0, 0.666), rgba(0, 0, 0, 0.666)),
        url(/assets/img/about.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.comp-cah-slide-list {
    position: relative;
    width: 100%;
    height: 100%;
}
.comp-cah-slide-item {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 1.25rem;
    padding: 0 6rem;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.6s cubic-bezier(0.39,0.57,0.56,1), visibility 0s 0.6s;
}
.comp-cah-slide-item.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.6s cubic-bezier(0.39,0.57,0.56,1);
}
.comp-cah-slide-item .comp-inner {
    height: 23em;
    max-height: 80vh;
    max-height: 80dvh;
    line-height: 2;
    writing-mode: vertical-rl;
}
.comp-cah-slide-item p {
    text-align: justify;
}
#ceramics-and-heart.is-en .comp-cah-slide-item {
    padding: 4rem 8rem;
}
#ceramics-and-heart.is-en .comp-cah-slide-item .comp-inner {
    width: min(48rem, 100%);
    height: auto;
    max-height: 72vh;
    max-height: 72dvh;
    overflow-y: auto;
    padding-right: 0.5em;
    line-height: 1.75;
    writing-mode: horizontal-tb;
}
#ceramics-and-heart.is-en .comp-cah-slide-item p {
    line-height: 1.6;
    text-align: center;
}
#ceramics-and-heart.is-en .comp-cah-slide-item .comp-credit {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    text-align: center;
}
#ceramics-and-heart.is-en .comp-cah-slide-item .comp-ttl-wrap {
    flex-direction: column;
    gap: 0.75em;
    text-align: center;
}
#ceramics-and-heart.is-en .comp-cah-slide-item .comp-ttl {
    font-size: 2rem;
}
.comp-cah-slide-item .comp-ttl-wrap {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 3em;
}
.comp-cah-slide-item .comp-ttl {
    font-size: 2.4375rem;
    letter-spacing: 0.03em;
}
.comp-cah-slide-item .comp-author {
    letter-spacing: 0.03em;
}
.comp-cah-slide-item .comp-credit {
    display: block;
    text-align: end;
}
.comp-cah-slide-item .comp-upright {
    -webkit-text-orientation: upright;
    text-orientation: upright;
    font-family: "Zen Old Mincho", "Noto Serif JP", serif;
    line-height: 1;
    letter-spacing: 0;
    vertical-align: 10%;
}
.comp-cah-slide-item .comp-tcy {
    -webkit-text-combine: horizontal;
    text-combine-upright: all;
    display: inline-block;
    font-family: "Zen Old Mincho", "Noto Serif JP", serif;
    line-height: 1;
    vertical-align: 10%;
}
.comp-cah-slide-item .comp-ellipsis {
    vertical-align: 0.375em;
    line-height: 1;
}
.comp-cah-arrow {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6rem;
    font-size: 0;
    line-height: 1;
    color: inherit;
    cursor: pointer;
    transition: opacity 0.3s cubic-bezier(0.22,0.61,0.36,1);
}
.comp-cah-arrow::before {
    content: '';
    width: 0.875rem;
    height: 1.75rem;
    background-color: currentColor;
    -webkit-mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
    mask: url("/assets/img/icon_arrow.svg") center / contain no-repeat;
}
.comp-cah-arrow:hover {
    opacity: 0.6;
}
.comp-cah-arrow.is-disabled {
    opacity: 0;
    pointer-events: none;
}
.comp-cah-prev {
    left: 0;
}
.comp-cah-prev::before {
    transform: scaleX(-1);
}
.comp-cah-next {
    right: 0;
}
.comp-cah-progress {
    position: absolute;
    left: 50%;
    bottom: 1.5rem;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    justify-content: flex-end;
    width: 10rem;
    height: 1px;
    background-color: rgba(233, 233, 233, 0.25);
    border-radius: 1px;
    overflow: hidden;
}
#ceramics-and-heart.is-en .comp-cah-progress {
    justify-content: flex-start;
}
.comp-cah-progress-bar {
    display: block;
    width: 0;
    height: 100%;
    background-color: currentColor;
    transition: width 0.3s cubic-bezier(0.22,0.61,0.36,1);
}
/* SP */
@media screen and (max-width: 767px) {
    .comp-cah-slide-wrap {
        height: 100svh;
        height: 100dvh;
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.666), rgba(0, 0, 0, 0.666)),
            url(/assets/img/about_sp.jpg);
    }
    .comp-cah-slide-item {
        font-size: 1rem;
        padding: 0 22vw 0 20vw;
    }
    .comp-cah-slide-item .comp-inner {
        height: 27em;
    }
    #ceramics-and-heart.is-en .comp-cah-slide-item {
        padding: 0 16vw;
        font-size: 0.875rem;
    }
    #ceramics-and-heart.is-en .comp-cah-slide-item .comp-inner {
        width: 100%;
        height: auto;
        max-height: 72dvh;
        line-height: 1.75;
    }
    .comp-cah-arrow {
        width: 15.466vw;
    }
    .comp-cah-arrow::before {
        width: 4.8vw;
        height: 4.8vw;
    }
    .comp-cah-progress {
        width: 24vw;
        bottom: 5.333vw;
    }
    .comp-cah-slide-item .comp-ttl {
        font-size: 2rem;
    }
}

/* ==================================================
contents
================================================== */
.contents-body {
    display: flex;
    flex-direction: column;
    gap: 6rem;
    padding-top: 1.5rem;
    padding-bottom: 9rem;
}
.cont-section-wrap {
    display: flex;
    flex-direction: column;
    gap: 9rem;
    padding-top: 4.5rem;
}
.cont-section .cont-inner {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}
.cont-section .cont-header-inner {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}
.cont-section-wrap .cont-section .cont-body,
.cont-section-wrap .cont-section .cont-ttl01,
.cont-section-wrap .cont-section .cont-header .comp-btn-wrap {
    opacity: 0;
}
.cont-section-wrap .cont-section .cont-body,
.cont-section-wrap .cont-section .cont-ttl01,
.cont-section-wrap .cont-section .cont-header .comp-btn-wrap {
    transition: opacity 1.2s cubic-bezier(0.39,0.57,0.56,1);
}
.cont-section-wrap .cont-section .cont-body.is-reveal-visible,
.cont-section-wrap .cont-section .cont-ttl01.is-reveal-visible,
.cont-section-wrap .cont-section .cont-header .comp-btn-wrap.is-reveal-visible {
    opacity: 1;
}
.cont-sub-section-wrap {
    display: flex;
    flex-direction: column;
    gap: 4.5rem;
}
.cont-sub-section .cont-inner {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}
.cont-sub-section h1,
.cont-sub-section h2,
.cont-sub-section h3,
.cont-sub-section h4,
.cont-sub-section h5,
.cont-sub-section h6 {
    font-size: 1.0625rem;
}
/* SP */
@media screen and (max-width: 767px) {
    .contents-body {
        gap: 12vw;
        padding-top: 4vw;
        padding-bottom: 24vw;
    }
    .cont-section-wrap {
        gap: 24vw;
        padding-top: 18.666vw;
    }
    .cont-section .cont-inner {
        gap: 8vw;
    }
    .cont-section .cont-header .comp-btn {
        font-size: 10px;
    }
    .cont-sub-section-wrap {
        gap: 16vw;
    }
    .cont-sub-section .cont-inner {
        gap: 5.333vw;
    }
    .cont-sub-section h1,
    .cont-sub-section h2,
    .cont-sub-section h3,
    .cont-sub-section h4,
    .cont-sub-section h5,
    .cont-sub-section h6 {
        font-size: 1.076rem;
    }
}
/* --------------------------------------------------
ttl
-------------------------------------------------- */
#contents-ttl {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    font-size: 1.3125rem;
    line-height: 1;
    text-align: center;
    padding: 1.5rem;
    z-index: 999;
    transition: opacity 0.3s cubic-bezier(0.39,0.57,0.56,1);
}
#contents-ttl.is-hidden {
    opacity: 0;
    pointer-events: none;
}
#contents-ttl.is-transition-hidden {
    opacity: 0;
    pointer-events: none;
}
body.menu-open #contents-ttl {
    z-index: 98;
}
.cont-ttl01 h2 {
    font-size: 1.875rem;
    letter-spacing: 0.03em;
}
/* SP */
@media screen and (max-width: 767px) {
    #contents-ttl {
        font-size: 1.428rem;
        padding: 5.333vw;
    }
    .cont-ttl01 h2 {
        font-size: 1.428rem;
    }
}
/* --------------------------------------------------
list
-------------------------------------------------- */
.list-body {
    transition: opacity 0.6s cubic-bezier(0.39,0.57,0.56,1);
}
.list-body.is-swapping {
    opacity: 0;
}
/* --------------------------------------------------
page
-------------------------------------------------- */
.page-header .page-ttl-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    padding: 3rem 0 0;
}
.page-header .page-ttl-wrap * {
    text-align: center;
}
.page-header .page-ttl {
    font-size: 1.625rem;
}
.page-footer .page-footer-meta .comp-txt-wrap {
    font-size: 0.875rem;
    line-height: 1.75;
    color: var(--sub-text-color);
    gap: 0;
}
html[lang="en"] .page-ttl-ja {
    display: none;
}
/* SP */
@media screen and (max-width: 767px) {
    .page-header .page-ttl-wrap {
        padding: 12vw 0 0;
    }
    .page-header .page-ttl {
        font-size: 1.285rem;
    }
    .page-footer .page-footer-meta .comp-txt-wrap {
        font-size: 0.857rem;
    }
}
/* --------------------------------------------------
detail
-------------------------------------------------- */
.detail-header .detail-ttl-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
    padding: 3rem 0;
}
.detail-header .detail-ttl-wrap * {
    text-align: center;
}
.detail-header .comp-cat-list {
    font-size: 1rem;
    justify-content: center;
}
.detail-header .detail-ttl {
    font-size: 1.625rem;
}
.detail-header .detail-header-meta {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    font-size: 1rem;
    color: var(--sub-text-color);
}
.detail-header .detail-header-meta budoux-ja {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
}
.detail-header .detail-visual.is-image-bg figure {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 3/2;
    background-color: var(--image-bg-color, #000000);
    overflow: hidden;
}
.detail-header .detail-visual.is-image-bg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 5%;
}
.detail-body .cont-section-wrap .cont-section .cont-body,
.detail-body .cont-section-wrap .cont-section .cont-ttl01,
.detail-body .cont-section-wrap .cont-section .cont-header .comp-btn-wrap {
    opacity: 1;
}
.detail-footer .detail-footer-inner {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}
.detail-footer .detail-footer-meta .comp-txt-wrap {
    font-size: 0.875rem;
    line-height: 1.75;
    color: var(--sub-text-color);
    gap: 0;
}
.detail-footer .detail-footer-profile {
    display: flex;
    flex-direction: column;
}
.detail-footer .detail-footer-profile .profile-name {
    font-size: 1.25rem;
}
.detail-footer .detail-footer-profile .profile-name-en {
    font-size: 0.875rem;
}
.detail-footer .detail-footer-profile .comp-box {
    border-left: none;
    border-right: none;
    border-bottom: none;
}
.detail-footer .detail-footer-profile .comp-box:last-child {
    border-bottom: var(--border-color) 1px solid;
}
/* PC, Tablet */
@media screen and (min-width: 768px) , print {
    .detail-body dt,
    #archive-detail dt {
        padding-top: 1.25rem;
    }
    .detail-body dd,
    #archive-detail dd {
        font-size: 1rem;
    }
    .detail-footer .detail-footer-profile .comp-box {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}
/* SP */
@media screen and (max-width: 767px) {
    .detail-header .detail-ttl-wrap {
        padding: 12vw 0 0;
    }
    .detail-header .detail-ttl {
        font-size: 1.285rem;
    }
    .detail-header .detail-visual {
        margin-top: 8vw;
    }
    .detail-header .detail-visual.is-image-bg figure {
        aspect-ratio: 1/1;
    }
    .detail-header .detail-visual.is-image-bg img {
        padding: 10%;
    }
    .detail-header .comp-cat-list {
        font-size: 0.928rem;
    }
    .detail-header .detail-header-meta {
        font-size: 0.857rem;
    }
    .detail-footer .detail-footer-inner {
        gap: 12vw;
    }
    .detail-footer .detail-footer-meta .comp-txt-wrap {
        font-size: 0.857rem;
    }
    .detail-footer .detail-footer-profile .profile-name {
        font-size: 1.076rem;
    }
    .detail-footer .detail-footer-profile .profile-name-en {
        font-size: 0.857rem;
    }
}
/* --------------------------------------------------
page-transition
-------------------------------------------------- */
#page-transition {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background-color: #000000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 1.5s cubic-bezier(0.39,0.57,0.56,1), visibility 0s 1.5s;
}
#page-transition.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0s, visibility 0s;
}
#page-transition .page-transition-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    opacity: 0;
    transition: opacity 0.9s cubic-bezier(0.39,0.57,0.56,1);
}
#page-transition .page-transition-img.is-shown {
    opacity: 1;
}
#menu.is-transitioning {
    z-index: 1000;
    opacity: 1;
    visibility: visible;
}
#menu.is-fading {
    z-index: 1000;
    visibility: visible;
    opacity: 0;
    transition: opacity 1.5s cubic-bezier(0.39,0.57,0.56,1);
}
#menu .menu-inner {
    transition: opacity 0.3s cubic-bezier(0.39,0.57,0.56,1);
}
#menu.inner-hidden .menu-inner {
    opacity: 0;
    pointer-events: none;
}
#menu .menu-transition-img {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-color: #000000;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    opacity: 0;
    transition: opacity 0.9s cubic-bezier(0.39,0.57,0.56,1);
}
#menu .menu-transition-img.is-shown {
    opacity: 1;
}
/* SP */
@media screen and (max-width: 767px) {
    #page-transition .page-transition-img,
    #menu .menu-transition-img {
        height: 100lvh;
    }
}
#page-transition .page-transition-ttl,
#menu .menu-transition-ttl {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    font-size: 1.3125rem;
    line-height: 1;
    text-align: center;
    padding: 1.5rem;
    z-index: 2;
    color: var(--black-bg-text-color);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.9s cubic-bezier(0.39,0.57,0.56,1);
}
#page-transition .page-transition-ttl.is-shown,
#menu .menu-transition-ttl.is-shown {
    opacity: 1;
}
#menu-btn.is-over {
    z-index: 1001;
}
#menu-btn.is-hidden {
    opacity: 0;
    pointer-events: none;
}
/* SP */
@media screen and (max-width: 767px) {
    #page-transition .page-transition-ttl,
    #menu .menu-transition-ttl {
        font-size: 1.428rem;
        padding: 5.333vw;
    }
}
/* --------------------------------------------------
lightbox
-------------------------------------------------- */
#lightbox {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background-color: #000000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 1.5s cubic-bezier(0.39,0.57,0.56,1), visibility 0s 1.5s;
}
#lightbox.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.9s cubic-bezier(0.39,0.57,0.56,1);
}
#lightbox:has(#ceramics-and-heart) {
    overflow: hidden;
}
#lightbox:has(#archive-detail) {
    overflow-y: auto;
}
.lightbox-body {
    width: 100%;
    min-height: 100%;
}
.lightbox-close {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 20;
}
body.menu-locked,
body.lightbox-open,
body.page-transition-open {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
    overscroll-behavior: none;
    touch-action: none;
}
.close-btn {
    display: block;
    width: 4.25rem;
    height: 4.25rem;
    font-size: 0;
    line-height: 1;
    color: var(--black-bg-text-color);
    cursor: pointer;
    background-color: transparent;
    transition: opacity 0.3s cubic-bezier(0.22,0.61,0.36,1);
}
.close-btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.25rem;
    height: 1.25rem;
    background-color: currentColor;
    -webkit-mask: url("/assets/img/icon_close.svg") center / contain no-repeat;
    mask: url("/assets/img/icon_close.svg") center / contain no-repeat;
    transform: translate(-50%, -50%);
}
.close-btn:hover {
    opacity: 0.6;
}
/* SP */
@media screen and (max-width: 767px) {
    .close-btn {
        width: 15.466vw;
        height: 15.466vw;
    }
    .close-btn::before {
        width: 4.8vw;
        height: 4.8vw;
    }
}

/* ==================================================
home
================================================== */
#home .contents-body {
    padding-top: 0;
}
#home-kv {
    position: relative;
    width: 100%;
    height: 120vh;
}
#home-kv::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 25%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
    pointer-events: none;
    z-index: 1;
}
#home-kv .home-kv-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
#home-kv picture {
    display: block;
    width: 100%;
    height: 100%;
}
#home-kv .site-ttl-wrap {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    padding: 1.5rem;
}
#home-media video,
#home-media img,
#home-about img {
    aspect-ratio: 16/9;
    object-fit: cover;
    overflow: hidden;
}
/* SP */
@media screen and (max-width: 767px) {
    #home-kv .site-ttl-wrap {
        padding: 5.333vw;
    }
    #home-media video,
    #home-media img,
    #home-about img {
        aspect-ratio: 7/5;
    }
}

/* ==================================================
about
================================================== */
#about .contents-body {
    padding-top: 0;
    padding-bottom: 0;
    gap: 0;
}
#about-kv {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100vh;
}
#about-kv img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#about-kv picture {
    display: block;
    width: 100%;
    height: 100%;
}
#about-cah,
#about .cont-section-wrap {
    position: relative;
    z-index: 1;
}
#about-cah {
    width: 100%;
    height: 100vh;
    background: linear-gradient(to bottom, transparent 0%, transparent 33%, #000000 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
#about-cah .about-cah-inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
#about-cah .cah-txt {
    font-size: 1.5rem;
    line-height: 1.75;
}
html[lang="en"] #about-cah .cah-txt {
    line-height: 1.6;
}
#about .cont-section-wrap {
    background-color: #000000;
    padding-bottom: 9rem;
}
#about .about-visual {
    opacity: 0;
    transition: opacity 1.5s cubic-bezier(0.39,0.57,0.56,1);
}
#about .about-visual.is-reveal-visible {
    opacity: 1;
}
#about-profile .profile-portrait {
    width: 100%;
    height: auto;
    aspect-ratio: 3/2;
    object-fit: contain;
}
#about-profile .profile-name {
    font-size: 1.25rem;
}
#about-profile .profile-name-en {
    font-size: 0.875rem;
}
#about-message .message-name {
    margin-top: 1em;
}
#about-acknowledgements .comp-txt-wrap ul,
#about-partnership .comp-txt-wrap ul {
    font-size: 1rem;
    list-style: none;
    padding-left: 0;
    margin-top: 1em;
}
/* SP */
@media screen and (max-width: 767px) {
    #about-kv {
        height: 100lvh;
    }
    #about-cah {
        height: 100svh;
    }
    #about-cah .cah-txt {
        font-size: 1.142rem;
    }
    #about-profile .profile-portrait {
        aspect-ratio: 1/1;
    }
    #about-profile .profile-name {
        font-size: 1.285rem;
    }
    #about-profile .profile-name-en {
        font-size: 0.928rem;
    }
    #about .about-visual img {
        aspect-ratio: 7/5;
        object-fit: cover;
    }
    #about .cont-section-wrap {
        padding-bottom: 24vw;
    }
}

/* ==================================================
contact
================================================== */
#contact .cont-sub-section-wrap {
    gap: 2.5rem;
}
#contact .contact-note-body p {
    font-size: 0.875rem;
    line-height: 1.75;
}
html[lang="en"] #contact .contact-note-body p {
    line-height: 1.6;
}
/* SP */
@media screen and (max-width: 767px) {
    #contact .cont-sub-section-wrap {
        gap: 8vw;
    }
    #contact .contact-note-body p {
        font-size: 0.928rem;
    }
}

/* ==================================================
Works
================================================== */
/* --------------------------------------------------
detail
-------------------------------------------------- */
#works-detail .contents-body {
    padding-top: 0;
}
#works-detail-visual .works-detail-visual-sp {
    display: none;
}
#works-detail-visual figure.is-crop {
    height: 100vh;
}
#works-detail-visual figure.is-crop img {
    height: 100%;
    object-fit: cover;
}
#works-detail-visual figure.is-full-width img {
    height: auto;
    object-fit: contain;
}
#works-detail-visual figure.is-contain {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--contain-bg, #000);
}
#works-detail-visual figure.is-contain img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}
#works-detail-visual figure.is-contain.is-edge-blur img {
    -webkit-mask:
        linear-gradient(to right, transparent, #000 var(--contain-feather, 20%), #000 calc(100% - var(--contain-feather, 20%)), transparent),
        linear-gradient(to bottom, transparent, #000 var(--contain-feather, 20%), #000 calc(100% - var(--contain-feather, 20%)), transparent);
    -webkit-mask-composite: source-in;
    mask:
        linear-gradient(to right, transparent, #000 var(--contain-feather, 20%), #000 calc(100% - var(--contain-feather, 20%)), transparent),
        linear-gradient(to bottom, transparent, #000 var(--contain-feather, 20%), #000 calc(100% - var(--contain-feather, 20%)), transparent);
    mask-composite: intersect;
}
#page-transition.is-work-detail-transition .page-transition-ttl,
#menu.is-work-detail-transition .menu-transition-ttl {
    top: 50%;
    bottom: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
    transform: translateY(-50%);
}
#page-transition .transition-work-title,
#menu .transition-work-title {
    font-size: 2rem;
}
#page-transition .transition-work-year,
#menu .transition-work-year {
    font-size: 1rem;
}
/* SP */
@media screen and (max-width: 767px) {
    #works-detail-visual {
        margin-top: 0;
    }
    #works-detail-visual .works-detail-visual-pc {
        display: none;
    }
    #works-detail-visual .works-detail-visual-sp {
        display: block;
    }
    #works-detail-visual figure.is-crop {
        height: 100svh;
    }
    #works-detail-visual figure.is-contain {
        height: 100svh;
    }
    #page-transition .transition-work-title,
    #menu .transition-work-title {
        font-size: 1.714rem;
    }
}

/* ==================================================
Archives
================================================== */
/* --------------------------------------------------
list
-------------------------------------------------- */
#archives .list-body .cont-section-wrap  {
    padding-top: 0;
}
#archives .cont-section-wrap {
    gap: 6rem;
}
#archives-lead .comp-txt-wrap {
    gap: 0.5em;
}
/* SP */
@media screen and (max-width: 767px) {
    #archives .cont-section-wrap {
        gap: 12vw;
    }
    #archives-lead {
        padding-bottom: 4vw;
    }
}
/* --------------------------------------------------
detail
-------------------------------------------------- */
#archive-detail {
    display: none;
}
#lightbox #archive-detail {
    display: block;
}
#archive-detail .archive-detail-inner {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}
#archive-detail-visual {
    width: 50%;
    height: 100%;
}
#archive-detail-visual figure {
    width: 100%;
    height: 100%;
}
#archive-detail-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#archive-detail-info {
    flex: 1;
    padding: 6rem;
    max-height: 100vh;
    overflow-y: auto;
}
/* SP */
@media screen and (max-width: 767px) {
    #archive-detail .archive-detail-inner {
        height: auto;
        min-height: 100svh;
        min-height: 100dvh;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
    }
    #archive-detail-visual {
        width: 100%;
        height: 100dvh;
    }
    #archive-detail-info {
        width: 100%;
        max-height: none;
        padding: 12vw 8vw;
        overflow-y: visible;
    }
}

/* ==================================================
Exhibitions
================================================== */
#exhibitions .list-body .cont-section-wrap,
#past-exhibitions .list-body .cont-section-wrap  {
    padding-top: 0;
}
/* --------------------------------------------------
past
-------------------------------------------------- */
#past-exhibitions .cont-section-wrap {
    gap: 6rem;
}
/* SP */
@media screen and (max-width: 767px) {
    #exhibitions .cont-section .cont-inner,
    #past-exhibitions .cont-section .cont-inner {
        gap: 5.666vw;
    }
    #past-exhibitions .cont-section-wrap {
        gap: 16vw;
    }
}

/* ==================================================
Media
================================================== */
#page-transition.is-media-transition .page-transition-ttl,
#menu.is-media-transition .menu-transition-ttl {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
    height: 80%;
    font-size: 0;
    background-image: url(/assets/img/logo_katte-ni-siro.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
}

/* SP */
@media screen and (max-width: 767px) {
    #page-transition.is-media-transition .page-transition-ttl,
    #menu.is-media-transition .menu-transition-ttl {
        height: 85%;
    }
}

/* ==================================================
animation
================================================== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        -webkit-animation-duration: 0.001ms !important;
        animation-duration: 0.001ms !important;
        -webkit-animation-delay: 0s !important;
        animation-delay: 0s !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.001ms !important;
        transition-delay: 0s !important;
    }
    .cont-section-wrap .cont-section .cont-body,
    .cont-section-wrap .cont-section .cont-ttl01,
    .cont-section-wrap .cont-section .comp-btn-wrap {
        transition: none;
    }
}