@charset "UTF-8";
/* ©SCHNEID
映画『存在のすべてを』 オフィシャルサイト
Kazumi Nishibayashi */
/*------------------------------------------------------------*/
.en {
 font-family: "Noto Serif JP", serif;
 font-optical-sizing: auto;
 font-weight: 400;
 font-style: normal;
 letter-spacing: .5px;
}
:root {
 --base-white: #fdf9ee;
 --base-gray: #e9e4e1;
 --base-darkgray: #4a4642;
 --base-black: #010101;
 --base-beige: #3b98bc;
 --base-bluegray: #96a3ad;
}
/*------------------------------------------------------------
	Reset
------------------------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, nav, section, time, mark, audio, video {
 font-size: 1em;
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 background: transparent;
 vertical-align: bottom;
}
* {
 box-sizing: border-box;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {
 display: block;
}
html {
 font-size: 62.5%;
 scroll-padding-top: 30px;
 scroll-behavior: smooth;
 overflow-x: hidden;
}
body, table, input, textarea, select, option, h1, h2, h3, h4, h5, h6, p {
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 margin: 0;
 padding: 0;
}
h1, h2, h3, h4, h5, h6 {
 font-weight: 600;
 font-feature-settings: "palt"1;
 letter-spacing: 1px;
}
table, input, textarea, select, option {
 line-height: 1.1;
}
ol, ul {
 list-style: none;
}
blockquote, q {
 quotes: none;
}
:focus {
 outline: 0;
}
ins {
 text-decoration: none;
}
del {
 text-decoration: line-through;
}
hr {
 height: 0;
 margin: 0;
 padding: 0;
 border: 0;
}
a {
 color: inherit;
 text-decoration: none;
 -webkit-transition: all 100ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
 transition: all 100ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
 display: inline-block;
}
a:hover {
 cursor: pointer;
 -webkit-transition: all 100ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
 transition: all 100ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}
img {
 max-width: 100%;
 width: 100%;
 height: auto;
 vertical-align: bottom;
 display: block;
}
figure, img {
 pointer-events: none;
}
/*------------------------------------------------------------
	layout
------------------------------------------------------------*/
body {
 font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", sans-serif;
 font-size: 1.6rem;
 line-height: 2em;
 background-color: var(--base-white);
 color: var(--base-black);
 font-style: inherit;
 font-weight: 400;
 -ms-text-size-adjust: 100%;
 -webkit-text-size-adjust: 100%;
 text-rendering: geometricPrecision;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 -webkit-tap-highlight-color: transparent;
}
html.fixed, body.fixed {
 overflow: hidden;
 height: 100%;
}
/* Loading（白背景シンプル・フェードアウト） */
.loading {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 z-index: 9999;
 background: #fff;
 display: flex;
 justify-content: center;
 align-items: center;
 overflow: hidden;
 transition: opacity 1s ease;
}
.loading.is-hidden {
 opacity: 0;
 pointer-events: none;
}
/* 背景グラデーションが動くアニメーション（#container::before で使用） */
@keyframes gradientBG {
 0% {
  background-position: 0% 50%;
 }
 50% {
  background-position: 100% 50%;
 }
 100% {
  background-position: 0% 50%;
 }
}
.loading-inner {
 opacity: 0;
 animation: fadeInText 0.8s forwards;
 width: 50%;
 max-width: 340px;
 display: block;
 margin: auto;
}
@keyframes fadeInText {
 to {
  opacity: 1;
 }
}
.blur-in {
 opacity: 0;
 /* 15pxのブラー ＋ わずかな拡大（1.05倍に調整） */
 filter: blur(15px);
 transition: opacity 1.8s cubic-bezier(0.33, 1, 0.68, 1), filter 2.2s cubic-bezier(0.16, 1, 0.3, 1), transform 2.5s cubic-bezier(0.16, 1, 0.3, 1);
 will-change: opacity, filter, transform;
}
.blur-in.is-active {
 opacity: 1;
 filter: blur(0);
 transform: scale(1);
}
/*-- //アニメーション --*/
/* ------------------------------
	コンテンツ
------------------------------ */
#container {
 width: 100%;
 min-height: 100%;
 padding: 0;
 margin: 0 auto;
 position: relative;
 z-index: 1;
}
#container::before {
 content: "";
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 z-index: -1;
 background: linear-gradient(45deg, #fff, #eee);
 background-size: 400% 400%;
 animation: gradientBG 10s ease infinite;
 opacity: 0;
 transition: opacity 1.2s ease;
 pointer-events: none;
}
#container.is-darken::before {
 opacity: 1;
}
#container::after {
 position: fixed;
 content: "";
 background-image: url("../images/bg.jpg");
 background-image: -webkit-image-set(url("../images/bg.webp") 1x, url("../images/bg.jpg") 1x);
 background-image: image-set(url("../images/bg.webp") type("image/webp"), url("../images/bg.jpg") type("image/jpeg"));
 background-size: 50% auto;
 top: 0;
 left: 0;
 width: 100%;
 min-height: 100%;
 height: 100vh;
 z-index: -2;
}
/* ------------------------------
	フッター
------------------------------ */
.footer {
 width: 100%;
 padding: 0 0 30px;
 /* #container は z-index:1 のスタッキングコンテキストのため、WPでTOP本文の貼り付けが
    </div> で閉じられて footer が #container の外に出ると、固定背景（::after）に隠れて
    見えなくなる。footer 自身に重ね順を与え、#container の内外どちらでも表示を保証する */
 position: relative;
 z-index: 2;
}
.copyright {
 text-align: center;
 color: var(--base-darkgray);
 font-size: clamp(1rem, 1.2vw, 1.2rem);
}
@media screen and (max-width: 768px) {
 .footer {}
}
/* ------------------------------
	公式SNS（X）
------------------------------ */
.sns-x {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 44px;
 height: 44px;
 border-radius: 50%;
 border: 1px solid rgba(74, 70, 66, 0.35);
 color: var(--base-black);
 transition: opacity 0.3s ease;
}
.sns-x svg {
 display: block;
 width: 20px;
 height: 20px;
}
.sns-x:hover {
 opacity: 0.6;
}
.news-header-sns .sns-x {
 border: none;
 background-color: #fff;
}
/* アコーディオンメニュー：ORIGINAL の直後に続けて配置（同じスタッガーで表示） */
.nav-sns {
 display: flex;
 justify-content: center;
 margin-top: 20px;
 opacity: 0;
 transform: translateX(-16px);
 transition: opacity 0.5s ease, transform 0.5s ease;
}
.nav-sns.active {
 opacity: 1;
 transform: translateX(0);
}
/* フッター copyright 上 */
.footer-sns {
 display: flex;
 justify-content: center;
 margin: 12px auto;
}
/* ------------------------------------------------------------
    Navigation (Header / Hamburger) - PC/SP共通
------------------------------------------------------------ */
#header {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 0;
 z-index: 1005;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 transition: opacity 0.5s ease, visibility 0.5s;
}
/* 少しスクロールすると表示される状態 */
#header.is-visible {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;
}
/* ハンバーガーボタン（細い3本線・ラベルなし・左上） */
.nav-button {
 position: fixed;
 top: 0;
 left: 0;
 width: clamp(56px, 5vw, 66px);
 height: clamp(56px, 5vw, 66px);
 padding: 0;
 border: 0;
 background: rgba(150, 163, 173, 0.9);
 -webkit-backdrop-filter: blur(14px);
 backdrop-filter: blur(14px);
 z-index: 10000;
 cursor: pointer;
 z-index: 1010;
 display: flex;
 align-items: center;
 justify-content: center;
}
.btn-menu__icon {
 position: relative;
 display: block;
 width: 30px;
 height: 2px;
 background: #fff;
 transition: background 0.2s ease;
}
.btn-menu__icon::before, .btn-menu__icon::after {
 content: "";
 position: absolute;
 left: 0;
 width: 100%;
 height: 2px;
 background: #fff;
 transition: transform 0.35s cubic-bezier(0.85, 0, 0.15, 1), top 0.35s cubic-bezier(0.85, 0, 0.15, 1);
}
.btn-menu__icon::before {
 top: -9px;
}
.btn-menu__icon::after {
 top: 9px;
}
.nav-button.active .btn-menu__icon {
 background: transparent;
}
.nav-button.active .btn-menu__icon::before {
 top: 0;
 transform: rotate(45deg);
}
.nav-button.active .btn-menu__icon::after {
 top: 0;
 transform: rotate(-45deg);
}
/* 左スライドインメニュー（白ブラーパネル／PC・SP共通） */
.nav-wrap {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 height: 100dvh;
 z-index: 1000;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 background: rgba(18, 20, 24, 0);
 transition: opacity 0.5s ease, background 0.5s ease, visibility 0.5s;
}
.nav-wrap.open {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;
 background: rgba(18, 20, 24, 0.35);
}
.nav-wrap-content {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 max-width: 400px;
 height: 100%;
 background: rgba(253, 249, 238, 0.82);
 -webkit-backdrop-filter: blur(14px);
 backdrop-filter: blur(14px);
 box-shadow: 0 0 30px rgba(0, 0, 0, 0.12);
 transform: translateX(-100%);
 transition: transform 0.55s cubic-bezier(0.85, 0, 0.15, 1);
 display: flex;
 flex-direction: column;
 justify-content: center;
 overflow-y: auto;
}
.nav-wrap.open .nav-wrap-content {
 transform: translateX(0);
}
.menu.en {
 display: flex;
 flex-direction: column;
 width: 74%;
 margin: 0 auto;
}
.menu-item {
 opacity: 0;
 transform: translateX(-16px);
 transition: opacity 0.5s ease, transform 0.5s ease;
 border-bottom: 1px solid rgba(74, 70, 66, 0.35);
}
.menu-item.active {
 opacity: 1;
 transform: translateX(0);
}
.menu-item a {
 display: block;
 font-family: "Noto Serif JP", serif;
 font-weight: 400;
 font-size: clamp(1.5rem, 1.5vw, 1.8rem);
 letter-spacing: 0.35em;
 color: var(--base-black);
 text-align: center;
 line-height: 3.6em;
}
.menu-item a:hover {
 opacity: 0.6;
}
/* SP：ハンバーガーは左上隅に接するボックス（サイズのみ調整） */
@media screen and (max-width: 768px) {
 .nav-button {
  width: 54px;
  height: 54px;
 }
 .menu.en {
  width: 78%;
 }
}
.news-more {
 display: flex;
 justify-content: flex-end;
 margin-top: clamp(2rem, 3vw, 3rem);
}
.news-more-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 200px;
 padding: 0.2em 2.4em;
 border: 1px solid rgba(74, 70, 66, 0.35);
 border-radius: 2px;
 font-size: clamp(1.4rem, 1.5vw, 1.6rem);
 letter-spacing: 0.16em;
 color: var(--base-black);
 transition: opacity 0.3s ease, background 0.3s ease;
 text-align: center;
}
.news-more-btn:hover {
 opacity: 0.6;
}