@charset "UTF-8";

/* ART LIBRARY | THE STORY CONTINUES
   PC・SP共通：画面全体の縦罫線と浮遊する作品画像
   他のセクションに影響しないよう .al-history-finale 内に限定
------------------------------------------------------------------------------------------- */
.al-history-finale,
.al-history-finale *,
.al-history-finale *::before,
.al-history-finale *::after {
box-sizing: border-box;
}

.al-history-finale {
position: relative;
isolation: isolate;
width: 100%;
max-width: 100%;
height: 100vh;
height: 100svh;
margin: 0 auto;
overflow: hidden;
color: #303030;
background: #f8f8f6;
}

.al-history-finale__grid {
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background-image: linear-gradient(to right, #e3e3df 1px, transparent 1px);
background-size: 20% 100%;
background-position: center top;
}

.al-history-finale__stream {
position: absolute;
inset: 0;
z-index: 1;
pointer-events: none;
overflow: hidden;
}

.al-history-finale__work {
position: absolute;
top: 0;
left: 0;
display: block;
margin: 0;
transform: translate3d(0, 0, 0);
will-change: transform;
}

.al-history-finale__work img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
}

.al-history-finale__veil {
position: absolute;
inset: 0;
z-index: 2;
pointer-events: none;
background: radial-gradient(ellipse 66% 43% at 50% 50%,
rgba(248,248,246,.995) 0%,
rgba(248,248,246,.98) 45%,
rgba(248,248,246,.76) 69%,
rgba(248,248,246,0) 100%);
opacity: 0.8;
}

.al-history-finale__content {
position: relative;
z-index: 3;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 88%;
max-width: 850px;
height: 100%;
margin: 0 auto;
text-align: center;
pointer-events: none;
}

.al-history-finale__title {
margin: 0;

font-family: "minion-pro-display", serif;
font-weight: 400;
font-style: normal;


font-size: clamp(33px, 8.6vw, 48px);
font-weight: 400;
line-height: 1.15;
}

.al-history-finale__text {
max-width: 440px;
margin: 25px auto 0;
font-family: "Noto Serif JP", "Yu Mincho", serif;
font-size: 13px;
font-weight: 500;
line-height: 1.85;
}

.al-history-finale__button,
.al-history-finale__button:visited {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 48px;
margin-top: 20px;
padding: 0 26px;
border: 1px solid #303030;
color: #303030;
background: rgba(248,248,246,.78);

font-family: "minion-pro-display", serif;
font-weight: 400;
font-style: normal;

font-size: 16px;
line-height: 48px;
text-decoration: none;

transition: color .3s ease, background-color .3s ease;
pointer-events: auto;
}




.al-history-finale__button:hover,
.al-history-finale__button:focus-visible {
color: #fff;
background: #303030;
}

@media (prefers-reduced-motion: reduce) {
.al-history-finale__work { will-change: auto; }
.al-history-finale__button { transition: none; }
}

/* PC
------------------------------------------------------------------------------------------- */
@media screen and (min-width: 768px) {


.al-history-finale__grid { background-size: 12.5% 100%; }

.al-history-finale__veil {
background: radial-gradient(ellipse 49% 43% at 50% 52%,
rgba(248,248,246,.995) 0%,
rgba(248,248,246,.98) 35%,
rgba(248,248,246,.88) 58%,
rgba(248,248,246,.4) 79%,
rgba(248,248,246,0) 100%);
}

.al-history-finale__content { width: 90%; }
.al-history-finale__title { font-size: 50px; line-height: 1.12; }
.al-history-finale__text {
max-width: 640px;
margin-top: 20px;
font-size: clamp(13px, 1.05vw, 16px);
line-height: 1.7;
}

.al-history-finale__button,
.al-history-finale__button:visited {
min-height: 53px;
margin-top: clamp(26px, 3.2vw, 44px);
font-size: 18px;
}



}/* PC 終了 */