@charset 'utf-8';

html,body{ max-width:100%; overflow-x:hidden; }
*,*::before,*::after{ box-sizing:border-box; }

#mobile-head { width:100%; }

  main { padding-bottom:0; }
@media screen and (min-width:768px) {
  main { padding-bottom:80px; }
}


/*基本の形*/
.contents .contents_inner .contents_text { width:auto; }
.contents .contents_inner .contents_text .title_en { font-size:45px; letter-spacing:0.05em; }
.contents .contents_inner .contents_text .h2_wrap { position:relative; margin-bottom:2.5rem; z-index:6; }
.contents .contents_inner .contents_text .h2_wrap h2 { font-size:14px; margin-top:1.75rem;margin-bottom:2.625rem; display:flex; align-items:center; font-family: "Zen Kaku Gothic New", sans-serif;}

.contents .contents_inner .contents_text .h2_wrap .title_copy { font-size:24px; line-height:2em; margin-bottom:2.5rem; /*position:absolute; top:0; left:0;*/ }
.contents .contents_inner .contents_text .title_copy_wide { font-size:24px; line-height:1.5em; margin-bottom:2rem; }
.contents .contents_inner .contents_text .title_lead { font-size:16px; line-height:2em; margin-bottom:2.5rem; text-align:justify;}
.contents .contents_inner .contents_text .title_lead_wide  { font-size:16px; line-height:2em; }
@media screen and (min-width:768px) {
    .contents .contents_inner .contents_text .title_en { font-size:80px; }
    .contents .contents_inner .contents_text .title_en { line-height:1.1em; }
    .contents .contents_inner .contents_text .h2_wrap { margin-top:initial; }
    .contents .contents_inner .contents_text .h2_wrap h2 { font-size:20px; margin-bottom:5.125rem;}
    .contents .contents_inner .contents_text .title_copy { font-size:40px; margin-bottom:4rem; }

    .contents .contents_inner .contents_text .title_copy .inline_sp { display:block; }
    .contents .contents_inner .contents_text .h2_wrap .title_copy { font-size:40px; }
    .contents .contents_inner .contents_text .title_copy_wide { font-size:40px; margin-bottom:2rem; }
    .contents .contents_inner .contents_text .title_lead { font-size:18px; /*margin-top:4rem;*/ line-height:2.16em; }
    .contents .contents_inner .contents_text .title_lead_wide { font-size:24px; /*margin-top:4rem;*/ line-height:2.16em; }
}
@media screen and (min-width:1280px) {
   .contents .contents_inner .contents_text .title_copy_wide { font-size:60px; }
       .contents .contents_inner .contents_text .title_copy .inline_sp { display:none; }

}
.border-top { border-top:1px solid var(--border-color); }
/*.border-bottom { border-bottom:1px solid var(--border-color); }*/
.photo_box { width:100%; display:flex; justify-content: space-between; }
.photo_box li img { width:100%; height:100%; object-fit: cover; /*border:1px solid #434343;*/ object-position:70% center;}

.borderline { width:100%; height:1px; border-top:1px solid #434343; }




/* 補間可能カスタムプロパティ */
@property --door-angle { syntax:"<angle>"; inherits:false; initial-value:0deg; }
@property --auto-angle { syntax:"<angle>"; inherits:false; initial-value:0deg; }

/* 角度の管理：自動は弱め / ホバーは深め */
:root{
  --door-open-auto:  -24deg; /* ←自動の開き量（弱め） */
  --door-open-hover: -35deg; /* ←ホバーの開き量（強め） */
}

.door{
  width:80px; position:relative; display:inline-block; perspective:1000px; border:0;
}
.door::before{
  content:""; position:absolute; top:-20px; left:-10px; width:44px; aspect-ratio:1/1;
  background:url("../img/door_kazari.png") no-repeat center / contain;
}

.door.message::before {content: "";position: absolute;top: -20px;left: 170px;width: 140px;aspect-ratio: 1 / 1;background: url("../img/fukidashi_message.svg") no-repeat center / contain;transform-origin: center bottom;animation: fukidashiShake 3s infinite;}
.door.about::before {content: "";position: absolute;top: -20px;left: 170px;width: 140px;aspect-ratio: 1 / 1;background: url("../img/fukidashi_lalahouse.svg") no-repeat center / contain;transform-origin: center bottom;animation: fukidashiShake 3s infinite;}
.door.lalapark::before {content: "";position: absolute;top: -20px;left: 170px;width: 140px;aspect-ratio: 1 / 1;background: url("../img/fukidashi_lalapark.svg") no-repeat center / contain;transform-origin: center bottom;animation: fukidashiShake 3s infinite;}


/* ===== 吹き出しが時々カクカク動く ===== */
@keyframes fukidashiShake {
  0%, 85%, 100% {
    transform: translateX(0) rotate(0deg);
  }
  88%  { transform: translateX(4px) rotate(3deg); }
  90%  { transform: translateX(-3px) rotate(-4deg); }
  92%  { transform: translateX(3px) rotate(2deg); }
  94%  { transform: translateX(-2px) rotate(-2deg); }
  96%  { transform: translateX(2px) rotate(1deg); }
  98%  { transform: translateX(0) rotate(0deg); }
}




.door .door_inner{ height:107px; position:relative; z-index:2; }

.door .tobira{
  height:107px; position:absolute; inset:0 0 auto 0; z-index:3;
  transform:rotateY(var(--door-angle));
  transform-origin:left center;
  backface-visibility:hidden;
  will-change:transform;

  /* ここでは “トランジションを付けない” → 自動の滑らかさを保つ */
  transition:none;

  /* 自動は --auto-angle を回す。表示用は常に --door-angle を参照 */
  animation:doorAuto 6.4s cubic-bezier(.4,0,.2,1) infinite;
  --door-angle:var(--auto-angle);
}

/* === ホバー中だけ、角度をトランジションで滑らかに変更 === */
.door:hover,
.photo_box:hover .tobira,
.contents.lalapark.border-top:hover .tobira,
.door:focus-within .tobira
 {
  /* ホバー時だけトランジションON（自動への干渉を最小化） */
  transition: --door-angle .55s cubic-bezier(.25,1,.5,1);
  --door-angle: var(--door-open-hover); /* ←深めに開く */
}


/* 自動開閉（--auto-angleを動かす。角度は弱め） */
@keyframes doorAuto{
  /* 角に丸みを出すため、節を少し増やす */
  0%, 18%    { --auto-angle: 0deg; }
  48%        { --auto-angle: var(--door-open-auto); } /* 開き */
  52%        { --auto-angle: var(--door-open-auto); } /* 少しタメ */
  82%        { --auto-angle: 0deg; }                  /* 戻り */
  100%       { --auto-angle: 0deg; }
}

@media (min-width:768px){
  .door{ width:160px; }
  .door .door_inner{ height:214px; }
  .door .tobira{ height:214px; }
}

/* お好み調整メモ
   - 自動をさらに弱める：--door-open-auto を -20deg などに
   - ホバーを強める：--door-open-hover を -38deg などに
   - 反応速度：.door:hover の transition 時間やイージングを微調整
*/








.photo_border { border:1px solid #434343; display:block; }


/*トップビジュアル*/
.contents.topvisual { width:100%; height:83vh; display:block; position:relative; margin:50px 0 0 0; }
.contents.topvisual .contents_inner .contents_text { width:100%; text-align:center; display:inline-block; }
.contents.topvisual .h1_wrap { width:90%; margin:100px auto 0 auto; display:block; }
.contents.topvisual .h1_wrap h1.inline_sp { font-size:14px; letter-spacing:0.1em; margin-top:2rem; margin-bottom:10px; text-align:left; display:block; }
.contents.topvisual .h1_wrap strong.inline_sp { display:block;margin-bottom:10px; }
.contents.topvisual .h1_wrap .maincopy { width:100%; display:block; font-size:16px; line-height:1.6em; font-weight:400; letter-spacing:0.1em; }
.contents.topvisual .h1_wrap .inline_pc { display:none; }
.contents.topvisual .h1_wrap .inline_sp { display:inline-block; font-size:46px; }
.contents.topvisual .fade-slideshow { display:none; }
.contents.topvisual .bird { width:20px; position:absolute; z-index:2; will-change:transform,opacity; animation:flyPath 6s linear infinite; }
.contents.topvisual .bird_wrap { width:100%; overflow-x:hidden;}
.contents.topvisual .bird1 { left:0; top:0; transform:rotate(20deg); animation-delay:0s; }
.contents.topvisual .bird2 { left:10%; top:5vh; transform:rotate(-20deg); animation-delay:0.7s; }
.contents.topvisual .bird3 { left:8%; top:10vh; transform:rotate(10deg); animation-delay:1.4s; }
.photo_border.inline_sp { display:block; }
@media screen and (min-width:768px) {
  .contents.topvisual { height:90vh; margin:initial; display:flex; flex-wrap:wrap; align-items:center; position:relative; }
  .contents.topvisual .fade-slideshow { position:absolute; inset:0; z-index:1; display:block; }
  .contents.topvisual .fade-slideshow::after {content: "";position: absolute;bottom:5vw; left:5vw;width:90%; height:120px; background: url("../img/slide_text.svg") no-repeat center / contain;pointer-events: none;  z-index: 9999;           }
  .contents.topvisual .bird { width:28px; position:absolute; z-index:2; will-change:transform,opacity; animation:flyPath 6s linear infinite; }
  .contents.topvisual .bird1 { left:-6%; top:35vh; transform:rotate(20deg); animation-delay:0s; }
  .contents.topvisual .bird2 { left:-10%; top:40vh; transform:rotate(-20deg); animation-delay:0.7s; }
  .contents.topvisual .bird3 { left:-8%; top:30vh; transform:rotate(10deg); animation-delay:1.4s; }
  .contents.topvisual .h1_wrap {width:100%; height:90vh;position:relative; z-index:2; display:flex; flex-direction:column; justify-content:center;margin:0; text-align:center;}
  .contents.topvisual .h1_wrap .maincopy { font-size:31px;  margin-top:70px; text-align:center; }
  .contents.topvisual .h1_wrap h1 { font-size:16px;  margin-top:70px; text-align:center; }
  .contents.topvisual .h1_wrap .inline_pc { display:block; }
  .contents.topvisual .h1_wrap .inline_sp { display:none; }
  .contents.topvisual .h1_wrap strong { font-size:70px; width:100%; display:block; }
  .contents.topvisual .title_lead { margin-bottom:0; }
  .contents.topvisual .h1_wrap h1.inline_sp { display:none; }
  .contents.topvisual .h1_wrap strong.inline_sp { display:none; }
  .photo_border.inline_sp { display:none; }
  .contents.topvisual .h1_wrap strong { font-size:8vw;}
}
@media screen and (min-width:1280px) {
  .contents.topvisual .fade-slideshow::after {bottom:5vw; left:5vw;width:900px; height:120px; background: url("../img/slide_text.svg") no-repeat center / cover;  }
  .contents.topvisual .h1_wrap strong { font-size:120px;}
}

/*トップビジュアルの線のアニメーションをspでは無効に*/
@media (max-width: 767px){
  .contents.topvisual.border-animate{ --line-duration:0s; }           /* 念のためアニメ時間もゼロ */
  .contents.topvisual.border-animate::after{ content:none !important; }/* 疑似要素ごと出さない */
}

.door.inline_pc { display:none; }
@media (max-width: 768px){
  .door.inline_pc { display:block; }
}


@keyframes flyPath { 0% { transform:translate(0,0) rotate(10deg); opacity:0; } 5% { opacity:1; } 15% { transform:translate(15vw,-6vh) rotate(12deg); } 20% { transform:translate(20vw,-4vh) rotate(8deg); } 30% { transform:translate(30vw,-12vh) rotate(6deg); } 35% { transform:translate(35vw,-9vh) rotate(4deg); } 50% { transform:translate(50vw,-18vh) rotate(0deg); } 55% { transform:translate(55vw,-15vh) rotate(-3deg); } 70% { transform:translate(70vw,-26vh) rotate(-6deg); } 75% { transform:translate(75vw,-22vh) rotate(-8deg); } 100% { transform:translate(102vw,-32vh) rotate(-5deg); opacity:0; } }


@media screen and (max-width:768px) {
  .contents.topvisual.border-animate { border-bottom:0; }
}




/* =============================
   PCスライドショー（ふわっと切替・3枚目で停止）
   ============================= */
/* =============================
   PCスライドショー（ふわっとループ）
   ============================= */
.contents.topvisual .fade-slideshow{
  height:90vh;
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  isolation:isolate;
}
.fade-slideshow.is-active{
  opacity:1;
  pointer-events:auto;
}

/* 各スライド設定 */
.fade-slideshow .slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  will-change:opacity;
  animation: fadeLoop 18s infinite;
  animation-timing-function:cubic-bezier(.4,0,.2,1);
}

/* ===== 各スライドの開始タイミング ===== */
.fade-slideshow .slide:nth-child(1){ animation-delay:0s; }
.fade-slideshow .slide:nth-child(2){ animation-delay:6s; }
.fade-slideshow .slide:nth-child(3){ animation-delay:12s; }

/* 画像設定 */
.fade-slideshow img{
  width:100%;
  height:100%;
  object-fit:cover;
  backface-visibility:hidden;
}

/* ===== フェードループアニメーション ===== */
@keyframes fadeLoop{
  0%, 100% { opacity:0; }
  10%, 30% { opacity:1; } /* ←ふわっと表示→キープ */
  40%, 90% { opacity:0; } /* ←次に切り替え */
}



/* h1 を“見せてから”消す：1秒待って → 1秒かけてフェード */
.h1_wrap {
  opacity: 1;
  visibility: visible;
  transition:
    opacity 1.8s cubic-bezier(.4, 0, .2, 1) 0.2s, /* ← 0.2s後にふわっと開始 */
    visibility 0s linear 2s;                      /* 0.2 + 1.8 = 2.0sでhidden */
}

.h1_wrap.is-hidden{ opacity:0; visibility:hidden; }





/* スライドはふわっと出る（少し遅らせてもOK） */
.fade-slideshow {
  opacity: 0;
  transition: opacity 1.8s cubic-bezier(.4, 0, .2, 1) 1s; /* やわらかく・少し遅めに */
}
.fade-slideshow.is-active {
  opacity: 1;
}


/*英字の文字アニメーション*/
.h1_wrap strong span,
.h2_wrap .title_en span {
  display: inline-block;
  transform: translateY(100%);
  opacity: 0;
  animation: slideIn 0.5s ease-out forwards;
}

/* small 自体を小さく。中の span は継承して小さくなります */
.h2_wrap .title_en small {
  font-size: 0.6em; /* 好みで調整 */
}

.h2_wrap .title_en:not(.inview) span {
  animation: none; /* 画面に入るまで待機 */
}

@keyframes slideIn {
  0% { transform: translateY(100%); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

/*横線のアニメーション*/
.border-animate{
	--line-delay:.35s;
	--line-duration:1.4s;
	display:flex;
	align-items:center;
	position:relative;
	flex-wrap:wrap;
}
.border-animate::after{
	content:"";
	position:absolute;
	inset:auto 0 0 0;
	height:1px;
	background:var(--border-color);
	transform-origin:left center;
	transform:scaleX(0)!important;
	transition:transform var(--line-duration) cubic-bezier(0.25,1,0.5,1) var(--line-delay);
	will-change:transform;
}
.border-animate.inview::after{
	transform:scaleX(1)!important;
}
/*
@media(prefers-reduced-motion:reduce){
	.border-animate::after{
		transition:none;
		transform:scaleX(1)!important;
	}
}
*/

/*縦線のアニメーション*/
/*.border-animate-vertical { display:none; }*/
@media screen and (min-width:768px) {
	.border-animate-vertical{--line-delay:.35s;--line-duration:1.4s;display:flex;align-items:center;position:relative;}
	.border-animate-vertical::after{content:"";position:absolute;inset:0 auto 0 0;width:1px;background:var(--border-color);transform-origin:top center;transform:scaleY(0)!important;transition:transform var(--line-duration) cubic-bezier(0.25,1,0.5,1) var(--line-delay);will-change:transform;}
	.border-animate-vertical.inview::after{transform:scaleY(1)!important;}
  .contents.about .contents_inner.border-animate-vertical::after { width:0 !important; }

}
@media screen and (min-width:1280px) {
  .contents.about .contents_inner.border-animate-vertical::after { width:1px !important; }

}





/*h1*/
.shippori-mincho-regular {
  display: inline-block;
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
}

.shippori-mincho-regular span {
  display: inline-block;
  opacity: 0;
  animation: fadeSoft 0.2s ease-in-out forwards;
}

@keyframes fadeSoft {
  0% { opacity: 0; }
  40% { opacity: 0.4; }
  100% { opacity: 1; }
}

.sp_link { width:100%; display:flex; align-items:center; }
.sp_link img { width:44px; margin-left:10px; }
@media screen and (min-width:1268px) {
  .sp_link { display:none; }
}



/*音楽ボタン*/
.contents.topvisual .audio-trigger { display:none; }
@media screen and (min-width:768px) {
.contents.topvisual .audio-trigger { width:204px; height:90px; display:block; position:fixed; bottom:25px; left:25px; z-index:5; border:1px solid var(--border-color); background:#fff; filter:drop-shadow(0px 3px 6px rgba(0,0,0,0.16)); text-align:center; transition:background-color 0.4s cubic-bezier(0.25,1,0.5,1); padding-top:5px; }
.contents.topvisual .audio-trigger:hover,
.contents.topvisual .audio-trigger:active { background-color:#d4dcbc; }
.contents.topvisual .audio-trigger .arrow_right { width:24px; }
.contents.topvisual .audio-trigger span { width:100%; font-size:14px; font-weight:bold; color:#9DC52C; margin-bottom:5px; }
.contents.topvisual .audio-trigger strong { width:100%; font-weight:bold; line-height:24px; }
.contents.topvisual .audio-trigger .onpu_left { width:9px; position:absolute; left:5%; top:10px; }
.contents.topvisual .audio-trigger .onpu_right { width:18px; position:absolute; right:5%; top:10px; }

.contents.topvisual .audio-trigger small { font-size:13px; margin:5px 0; }

.audio-trigger.is-playing { position:relative; }
.audio-trigger.is-playing::after {
  content:"";
  position:absolute;
  right:-225px;
  top:-30px; 
  width:300px;
  height:100px;
  background:url("../img/music_animation.png") no-repeat center/contain; /* ←画像パス変更 */
  pointer-events:none;
}
.audio-torigger-inner { position:relative; }


}






/* ====== トップのスライド ====== */
.slide_sp_wrap.is-oncefade {
  position: relative;
  width: 100%;
  height: 100vh; /* ←画面の高さに合わせる（または好みで調整） */
  overflow: hidden;
  z-index:-1;
  margin-top:-50px;
}

/* スライド本体 */
.slide_sp_wrap.is-oncefade .slide_sp {
  position: relative;
  width: 84%;
  height: 100%;
  margin-left:16%;
}

/* 画像設定 */
.slide_sp_wrap.is-oncefade .slide_sp img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;       /* ← coverからcontainに変更 */
  object-position: center top; /* ← 上寄せ（中央基準にしたいなら center center） */
  opacity: 0;
  animation: onceFade 12s ease-in-out forwards;
}

/* 3枚想定のディレイ */
.slide_sp_wrap.is-oncefade .slide_sp img:nth-child(1) { animation-delay: 0s; }
.slide_sp_wrap.is-oncefade .slide_sp img:nth-child(2) { animation-delay: 4s; }
.slide_sp_wrap.is-oncefade .slide_sp img:nth-child(3) { animation-delay: 8s; }

/* 最後の画像はフェードアウトしない */
.slide_sp_wrap.is-oncefade .slide_sp img:last-child {
  animation-name: onceFadeLast;
  animation-duration: 12s;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}

/* 上品フェード */
@keyframes onceFade {
  0% { opacity: 0; }
  10% { opacity: 1; }
  33% { opacity: 1; }
  43% { opacity: 0; }
  100% { opacity: 0; }
}

/* 最後の画像は消えない */
@keyframes onceFadeLast {
  0% { opacity: 0; }
  10% { opacity: 1; }
  100% { opacity: 1; }
}

/* 省モーション対応 */
@media (prefers-reduced-motion: reduce) {
  .slide_sp_wrap.is-oncefade .slide_sp img {
    animation-duration: 6s;
  }
  .slide_sp_wrap.is-oncefade .slide_sp img:nth-child(2) { animation-delay: 2s; }
  .slide_sp_wrap.is-oncefade .slide_sp img:nth-child(3) { animation-delay: 4s; }
}



@media screen and (min-width:768px) {
  .slide_sp_wrap { display:none; }
}
/* 再生中だけ動かすので最初は静止 */
.audio-trigger .onpu_left,
.audio-trigger .onpu_right {
  display: inline-block;
  vertical-align: middle;
  transform: translateY(0);
  will-change: transform;
}

/* 再生中に付くクラス */
.audio-trigger.is-playing .onpu_left {
  animation: onpu-bob 0.8s ease-in-out infinite alternate;
  animation-delay: 0s;
}
.audio-trigger.is-playing .onpu_right {
  animation: onpu-bob 0.8s ease-in-out infinite alternate;
  animation-delay: .55s; /* 逆相でズレて動く */
}

/* ふわっと上下 */
@keyframes onpu-bob {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-8px); } /* お好みで -6〜-12px に調整可 */
}

/* ユーザーが省モーション設定の場合は停止 */
@media (prefers-reduced-motion: reduce) {
  .audio-trigger.is-playing .onpu_left,
  .audio-trigger.is-playing .onpu_right {
    animation: none !important;
  }
}










/*ページの一番上のコンテンツ*/
.contents.top .photo_box { width:100%; flex-wrap:wrap; }
.contents.top .photo_box li:nth-child(1) { width:53%; margin-left:auto; order:2; margin-bottom:100px; }
.contents.top .photo_box li:nth-child(2) { width:61%; margin-right:auto; order:1; }
.contents.top .contents_inner { margin-top:0; }
.contents.top .contents_inner .contents_text { width:100%; }
.contents.top .contents_inner .contents_text .title_lead { width:100%; font-size:16px; line-height:2.43em; text-align:left; display:inline-block; }
@media screen and (min-width:768px) {
    .contents.top { position:relative; }
    .contents.top .suzume_walk { width:9%; position:absolute; top:130px; right:0; }
    .contents.top .contents_inner { margin-top:initial; }
    .contents.top .contents_inner .contents_text { font-size:24px; width:55%; }
    .contents.top .contents_inner .contents_text .title_lead { font-size:24px; margin-left:5%; text-align:left; }
    .contents.top .photo_box { width:67%; margin-top:initial; margin-left:33%; display:flex; justify-content: space-between;  position:absolute; z-index:2; bottom:0; right:5%; top:15vw; }
    .contents.top .photo_box li:nth-child(1) { width:36%; margin-top:45vh; margin-right:50px; margin-bottom:initial; position:relative; order:1; }
    .contents.top .photo_box { margin-top:100px; }
    .contents.top .photo_box li:nth-child(1) img { height:auto; display:block; }
    .contents.top .photo_box li:nth-child(2) { width:47%; aspect-ratio: 414 / 524; margin-right:0; position:relative; order:2; }
    .contents.top .photo_border { margin-bottom:-20vw; }
    .contents.top .borderline { position:absolute; bottom:4vh; }
    .contents.top .contents_inner { width:95%; margin-left:5%; border-left:1px solid #000; padding-top:150px; padding-bottom:200px; margin-top:0; }
}

/* === iPad 横向き（landscape）=== */
@media screen and (min-width: 768px) and (max-width:1279px) and (orientation: landscape) {
    .contents.top .photo_box li:nth-child(1) { width:36%; margin-top:40vh; }

}

@media screen and (min-width:1280px) {
    .contents.top .contents_inner .contents_text { width:50%; }
     .contents.top .contents_inner .contents_text .title_lead { margin-top:4.5rem; }
    .contents.top .photo_box li:nth-child(1) { width:36%; margin-top:35vh; margin-right:50px; margin-bottom:initial; position:relative; order:1; }
       .contents.top .photo_box li:nth-child(1) img { height:auto; display:block; }
}

/*代表メッセージ*/
.contents.message .photo_box{display:flex;flex-direction:column-reverse;}
.contents.message .photo_box .door{position:relative;right:initial;}
.contents.message .photo_box .door.inline_pc{display:none;}
.contents.message .photo_box li:nth-child(1){width:100%;}
.contents.message .photo_box li:nth-child(1) .suzume_walk{width:100px;height:auto;margin-left:20px;}
.contents.message .photo_box li:nth-child(2){width:100%;margin-bottom:2rem;}
.contents.message .photo_box li:nth-child(2) .photo_wrap{width:100%;flex-wrap:wrap;position:relative;z-index:2;bottom:0;margin-bottom:20px;}
.contents.message .photo_box li:nth-child(2) .photo_wrap .message_star{width:44px;height:61px;position:absolute;top:5%;right:5%;z-index:2;border:0;}
.photo_box li .door img{border:0;}
.contents.message .sp_link{margin-bottom:80px;}

@media screen and (min-width:768px) and (max-width:1111px){
.contents.message .photo_box{flex-direction:row;align-items:flex-end;position:relative;margin-top:-15vh;}
.contents.message .photo_box li:nth-child(1){width:initial;}
.contents.message .photo_box .door.inline_pc{position:absolute;left:0;bottom:0;top:190px;display:block;}
.contents.message .photo_box li:nth-child(2){width:58%;margin-bottom:0;margin-right:-18%;}
.contents.message .photo_box li:nth-child(2) .photo_wrap{bottom:-100px;margin-bottom:initial;}
.contents.message .photo_box li:nth-child(2) .photo_wrap img{width:100%;height:100%;object-fit:cover;}
.contents.message .contents_inner{width:75%;margin-left:5%;border-right:1px solid #000;margin-top:0;padding-top:130px;}
.contents.message .sp_link{display:none;}
.contents.message.border-animate{padding-bottom:50px;}
}





@media screen and (min-width:1112px){
.contents.message .photo_box{flex-direction:row;align-items:flex-end;position:relative;margin-top:-15vh;}
.contents.message .photo_box li:nth-child(1){width:initial; margin-bottom:50px; }
.contents.message .photo_box .door.inline_pc{position:absolute;left:0;bottom:0;top:190px;display:block;}
.contents.message .photo_box li:nth-child(2){width:58%;margin-bottom:0;margin-right:-18%;}
.contents.message .photo_box li:nth-child(2) .photo_wrap{bottom:-56px;margin-bottom:initial;}
.contents.message .photo_box li:nth-child(2) .photo_wrap img{width:100%;height:100%;object-fit:cover;}
.contents.message .contents_inner{width:75%;margin-left:5%;border-right:1px solid #000;}
.contents.message .sp_link{display:none;}
.contents.message.border-animate{padding-bottom:initial;}
.contents.message.border-animate.inview .contents_inner { margin-top:0; padding-top:130px;}
}

/* === iPad 縦向き（portrait）=== */
@media screen and (min-width: 768px) and (max-width: 1111px) and (orientation: portrait) {
  .contents.top .photo_box li:nth-child(1) { margin-top:30vh; }
  .contents.message .photo_box{margin-top:0;}
  .contents.message .photo_box li:nth-child(1){width:initial; margin-bottom:50px; }
}
/* === iPad 縦向き（portrait）=== */
@media screen and (min-width: 768px) and (max-width: 1111px) and (orientation: portrait) {
  .contents.message.border-animate.inview .contents_inner { margin-top:0; padding-top:130px;}
  .contents.message .photo_box li:nth-child(1){width:initial; margin-bottom:50px; }
}


/*ストーリー*/
.contents.story .title_copy { font-size:24px; line-height:2em; margin-bottom:40px; }
.contents.story .photo_box { margin-bottom:80px; }
.contents.story .photo_box li {width:228px;position:relative; margin:0 auto; }
.contents.story .photo_box { display:block; }
.contents.story .photo_box li:nth-child(1) { margin-bottom:20px; }

.contents.story .photo_box li:nth-child(1) .staff1_kazari {width:12%;height:auto;position:absolute;top:15%;right:15%;z-index:2;border:none;}
.contents.story .photo_box li:nth-child(2) .staff2_kazari {width:80%;height:auto;position:absolute;z-index:1;top:10%;left:10%;border:none;}
.contents.story .photo_box li .arch {width:228px;height:auto;overflow:hidden;border-radius:228px 228px 0 0;margin-bottom:10px;border:1px solid #434343;position:relative;}
.contents.story .photo_box li .arch img {width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.6s ease;}
.contents.story .photo_box li a:hover img {transform:scale(1.1);}
.contents.story .photo_box li strong.staff_title {font-size:18px;line-height:1.5em;position:absolute;z-index:10;}
.contents.story .photo_box li:nth-child(1) strong.staff_title {top:210px;left:-10px;}
.contents.story .photo_box li:nth-child(2) strong.staff_title {top:200px;left:-10px;}
.contents.story .photo_box li strong.staff_title span {display:inline-block;padding:0.1em 0.3em;line-height:1.2em;color:#fff;background:#406CE6;}
.contents.story .photo_box li:nth-child(2) strong.staff_title.pink span {background:#FF614D;}
@media screen and (min-width:768px){
  .contents.story .title_copy { font-size:32px; margin-bottom:initial; }
  .contents.story .contents_inner {width:82%;margin-left:7%; padding-top:130px; margin-top:initial; }
  .contents.story .contents_inner .photo_box {display:flex;justify-content:end; margin-top:80px; margin-bottom:200px;}
  .contents.story .photo_box {display:flex;flex-wrap:wrap;margin-bottom:2rem;}
  .contents.story .photo_box li {width:auto; margin:0 auto; }
  .contents.story .photo_box li:nth-child(1) {margin-right:0;}
  .contents.story .photo_box li:nth-child(2) {margin-left:72px;margin-top:-80px;}
  .contents.story .photo_box li strong.staff_title { font-size:26px; }
  .contents.story .photo_box li:nth-child(1) strong.staff_title {bottom:80px;left:-25px;top:auto;}
  .contents.story .photo_box li:nth-child(2) strong.staff_title {bottom:150px;left:-25px;top:auto;}
  .contents.story .photo_box li .arch {width:clamp(180px,28vw,350px);aspect-ratio:350/444;border-radius:9999px 9999px 0 0;overflow:hidden;margin-bottom:16px;}
  .contents.story .contents_text {margin-left:5%;}
  .contents.story .photo_box li:nth-child(1) strong.staff_title {left:-25px;}
  .contents.story .photo_box li:nth-child(2) strong.staff_title {left:-25px;}
}
@media screen and (min-width:1280px){
  .contents.story .contents_inner .photo_box { margin-top:200px; margin-bottom:200px;}
    .contents.story .photo_box li strong.staff_title { font-size:28px; }
}


.contents.story .bird { width:20px; position:absolute; z-index:2; will-change:transform,opacity; animation:flyPath 6s linear infinite; }
.contents.story .bird1 { left:50%; top:35vh; transform:rotate(20deg); animation-delay:0s; }
.contents.story .bird2 { left:55%; top:40vh; transform:rotate(-20deg); animation-delay:0.7s; }
.contents.story .bird3 { left:60%; top:30vh; transform:rotate(10deg); animation-delay:1.4s; }



/* 1行目と2行目の間に隙間を入れる */
.staff_title span + br + span {margin-top: 0.3em;display: inline-block;}
.staff_title { display: inline-block;}
.staff_info { display:flex; justify-content:space-between; align-items:center;}
.staff_info strong { display:inline-block; }
.staff_info .arrow_dot { width:43px; border:0; }
@media screen and (min-width:768px) {
    .staff_info .arrow_dot { width:67px; }
    .contents.story .photo_box li .staff_info li { margin-left:0; margin:0;}
}


/*ララハウスのこと*/
.contents.about .photo_box { flex-wrap:wrap; justify-content:initial; margin-top:3rem; }
.contents.about .photo_box .door { display:none; }
.contents.about .photo_box li:nth-child(1) { width:100%; order:3; margin-top:24px; }
.contents.about .photo_box li:nth-child(1) .suzume_walk.inline_sp { width:110px; height:auto; border:0; margin-left:30px; }
.contents.about .photo_box li:nth-child(2) { width:50%; order:1; margin-right:50%;  }
.contents.about .photo_box li:nth-child(2) .photo_wrap { height:215px; }
.contents.about .photo_box li:nth-child(3) { width:50%; order:2; margin-top:1.5rem; margin-left:50%; }
.contents.about .photo_box li:nth-child(3) a { width:20%; display:block; }

@media screen and (min-width: 768px) and (max-width:1112px) {
  .contents.message .photo_border.inline_sp { display:block; }

  .contents.about .contents_text { margin-left:0; padding-top:230px; }
  .contents.about .contents_inner{ margin-top:0; }
  .contents.about .sp_link { display:none; }
  .contents.about .contents_inner .contents_text .h2_wrap .title_copy { font-size:35px; }
  .contents.about .photo_box { padding-bottom:130px; }
    .contents.about .photo_box li:nth-child(1) { width:162px; order:1; margin-right:25%; position:relative; }
    .contents.about .photo_box li:nth-child(2) { width:30%; order:initial; order:3; margin:initial; margin-top:-7vw; position:relative; z-index:5; margin-left:auto;  }
    .contents.about .photo_box li:nth-child(2) .photo_wrap { height:357px; position:relative; }
    /*.contents.about .photo_box li:nth-child(2) .photo_wrap::after{content:"";position:absolute; top:20%; left:0;width:90%;height:auto;aspect-ratio:1/1;background:url("../img/illust_about3.png") no-repeat center/contain;}*/
    .contents.about .photo_box li:nth-child(3) { width:24%; order:initial; order:2; margin-left:initial; margin-right:5%; }

}
@media screen and (min-width:1280px){
  .contents.about .contents_text { padding-top:130px; }
}
/* iPad 縦方向 */
@media screen and (min-width: 768px) and (max-width: 1111px) and (orientation: portrait) {
  .contents.about .photo_box li:nth-child(2) { width:27%; margin-left:auto;  margin-top:-20vw; }
  .contents.about .photo_box li:nth-child(2) .photo_wrap  { height:300px; }
  .contents.about .contents_text { padding-top:130px; }

}


.contents.about .photo_border.inline_sp { width:100%; display:block; }
@media screen and (min-width: 768px){
  .contents.about .photo_border.inline_sp { display:none; }
  .contents.about .photo_box .door {  display:block; right:initial; }
}

@media screen and (min-width:1120px) {
    .contents.about .photo_box { margin-top:0; }
    
    .contents.about .photo_box li:nth-child(1) { width:162px; order:1; margin-right:25%; position:relative; }
    .contents.about .photo_box li:nth-child(2) { width:22%; order:initial; order:3; margin:initial; margin-top:-7vw; position:relative; z-index:5; }
    .contents.about .photo_box li:nth-child(2) .photo_wrap { height:357px; position:relative; }
    /*.contents.about .photo_box li:nth-child(2) .photo_wrap::after{content:"";position:absolute; top:20%; left:0;width:90%;height:auto;aspect-ratio:1/1;background:url("../img/illust_about3.png") no-repeat center/contain;}*/
    .contents.about .photo_box li:nth-child(3) { width:24%; order:initial; order:2; margin-left:initial; margin-right:5%; }
    .contents.about .contents_inner { padding-bottom:130px; margin-top:initial; }
    .contents.about .contents_inner {position: relative;}
    .contents.about .contents_inner.border-animate-vertical::after {content: "";position: absolute;top: 0;left: 80%; width: 1px; height: 0;background: #000;   pointer-events: none;z-index: 0;transition: height 1.2s ease-out;}
    .contents.about .contents_inner.border-animate-vertical.inview::after {height: 100%;}
    .contents.about .photo_border.inline_sp { display:none; }
    .contents.about .photo_box .door { right:initial; left:5%; display:block; }
     .contents.about .contents_text { padding-top:initial; padding-top:130px; }
    .contents.about .contents_inner .contents_text .h2_wrap .title_copy { font-size:40px; }
    .contents.about .photo_box { padding-bottom:initial; }

}

.contents.about .photo_box .bird_brown { display:none; }
@media screen and (min-width:768px) {
  .contents.about .photo_box .bird_brown {width: 27px;height: auto;border: none;position: absolute;bottom: 0;right: -70px;animation: hop 2.4s cubic-bezier(0.45, 0, 0.55, 1) infinite; display:block; }
  @keyframes hop {
    0% {
      transform: translateY(0) rotate(0);
    }
    10% {
      transform: translateY(-18px) rotate(-4deg); /* 一回目のジャンプ */
    }
    20% {
      transform: translateY(0) rotate(0deg);
    }
    35% {
      transform: translateY(-10px) rotate(3deg); /* 二回目は軽く跳ねる */
    }
    45% {
      transform: translateY(0) rotate(0deg);
    }
    100% {
      transform: translateY(0) rotate(0deg); /* ここで少し間が空く */
    }
  }
}



.contents.about .photo_wrap_side { width:100%; }
.contents.about .photo_wrap_side img { width:100%; height:100%; object-fit:cover;}
@media screen and (min-width:768px) {
    .contents.about .contents_inner { width:95%; margin-left:5%; justify-content: space-between;}
    .contents.about .photo_wrap_side { width:44.6%; aspect-ratio: 16 / 9.8; margin-top:-75vh; margin-right:0%; position:relative; z-index:5; margin-left:auto; }
    /*.contents.about .photo_wrap_side::after{content:"";position:absolute;top:-10px;left:2.5%;width:80%;height:auto;aspect-ratio:1/1;background:url("../img/illust_about1.png") no-repeat center/contain;z-index:2;}*/

}

/* === iPad 縦向き（portrait）=== */
@media screen and (min-width: 768px) and (max-width: 1111px) and (orientation: portrait) {
 .contents.about .photo_wrap_side { margin-top:-135vh; }
 
}



@media screen and (min-width:1280px) {
 .contents.about .photo_wrap_side img { width:100%; height:auto; object-fit:cover; display:block; }

}


/*ララパーク*/
.contents.lalapark .contents_inner { width:90%; margin:0 auto; display:block; display:flex; flex-wrap:wrap; }
.contents.lalapark .photo_box { width:90%; margin:0 auto; justify-content: initial; flex-wrap:wrap; }
.contents.lalapark .photo_box li:nth-child(1) { width:60%; order:2; margin-left:auto; margin-top:1.5rem; }
.contents.lalapark .photo_box li:nth-child(2) { width:50%; order:1; }
.contents.lalapark .photo_box li:nth-child(3) { width:100%; order:3; }
.contents.lalapark .door { display:none; }
.contents.lalapark .h2_wrap { padding-top:100px; }
@media screen and (min-width: 768px) {
  .contents.lalapark .door { right:0; right:initial; display:block; margin-right:0; }
  .contents.lalapark .contents_inner { width:100%; flex-wrap:initial; flex-direction:initial;}
  .contents.lalapark .h2_wrap { padding-top:initial; }
}

@media screen and (min-width:1112px) {
    .contents.lalapark .contents_inner { width:100%; flex-wrap:initial; flex-direction:initial;}
    .contents.lalapark .photo_box li:nth-child(1) { width:22%; margin-right:1%; order:initial; margin-left:initial; }
    .contents.lalapark .photo_box li:nth-child(2) { width:15%; margin-top:145px; order:initial; }
    .contents.lalapark .photo_box li:nth-child(3) { width:160px; margin-left:auto; order:initial; }
    .contents.lalapark .h2_wrap  { padding-top:initial; }
   

}
@media screen and (min-width:1280px) {
 .contents.lalapark .door { left:5%; right:initial; margin-right:15%;  }
}

.contents.lalapark .photo_wrap_side { width:100%; }
.contents.lalapark .photo_wrap_side img { width:100%; height:100%; object-fit:cover;}
.contents.lalapark .contents_inner .contents_text .br_pad { display:none; }
@media screen and (min-width:768px) {
    .contents.lalapark .photo_wrap_side { width:100%; height:auto; margin-top:-88px; margin-right:5%; position:relative;z-index:0;}
    .contents.lalapark .photo_wrap_side .lalapark2::before{content:"";position:absolute;top:-80px;left:60%;transform:translateX(-50%);width:70%;aspect-ratio:1/1;background:url("../img/illust_lalapark.png") no-repeat center/contain;z-index:2;}
    .contents.lalapark .photo_wrap_side .lalapark2 { width:40%; height:auto; margin-top:88px; position:relative; }
    .contents.lalapark .photo_wrap_side img { height:auto; }
    .contents.lalapark .contents_inner .contents_text { width:100%; padding-top:130px; }
    .contents.lalapark .contents_inner .contents_text .h2_wrap h2 { margin-bottom:50px; }
    .contents.lalapark .contents_inner .contents_text .title_en small { font-size:44px; }
    .lalapark_text { display:flex; justify-content: space-between; flex-wrap:wrap; }
    .lalapark_text .door { margin-right:-10%; }
    .contents.lalapark .lalapark_text .sp_link { display:none; }
}
/* === iPad 縦向き（landscape）=== */
@media screen and (min-width: 768px) and (max-width: 1111px) and (orientation: portrait) {
  .contents.lalapark .photo_wrap_side img { height:auto; }
  .contents.lalapark .contents_inner .contents_text { width:150%; }
  .contents.lalapark .contents_inner .contents_text .br_pad { display:inline-block; }
  .contents.lalapark .photo_wrap_side .lalapark2 { width:60%; margin-left:auto; }
  .contents.lalapark .contents_inner .contents_text .title_en { font-size:8vw; }
  .contents.lalapark .door { left:0; float:left; }
  .contents.lalapark .photo_wrap_side { width:60%; }
    .lalapark_text{ width:90%; }
}

/* === iPad 横向き（landscape）=== */
@media screen and (min-width: 768px) and (max-width:1279px) and (orientation: landscape) {
  .contents .contents_inner .contents_text .h2_wrap .title_copy { font-size:35px; }
   .contents.lalapark .photo_wrap_side { width:60%; }
  .contents.lalapark .contents_text .door { left:0; float:left; }
  .lalapark_text{ width:90%; }
  .lalapark_text .title_lead { width:100%; display:block; }
}



@media screen and (min-width:1280px) {
   .contents.lalapark .photo_wrap_side { width:33%; height:45vh;}
   .contents.lalapark .contents_inner .contents_text .br_pad { display:none; }
   .contents.lalapark .photo_wrap_side .lalapark2 { width:340px; }
    .lalapark_text .inline_sp { display:none; }
    .contents.lalapark .contents_inner .contents_text { width:55%; padding-top:130px; }
}
@media screen and (min-width:1280px) {
 .contents.lalapark .photo_wrap_side .lalapark2 { margin-left:20%; }
}



/*一番下のスライド*/
.slide_wrap_bottom { display:none; }
@media screen and (min-width:768px) {
    .slide_wrap_bottom { width:100%; height:auto; margin:200px 0 200px 0; display:block;  }
}

/*エントリー*/
.entry_wrap { width:90%; margin:0 auto 50px auto; display:flex; align-items:center; background:#9DC52C; border:1px solid #000; border-radius:12px; }
.entry_wrap a { width:100%; }
.entry_wrap a .entry_wrap_inner { width:90%; display:flex; margin:0 auto; padding:40px 5%; flex-wrap:wrap; }
.entry_wrap a .entry_wrap_inner li { width:50%; position:relative; }
.entry_wrap a .entry_wrap_inner li strong { font-size:48px; line-height:1.2em; display:block; color:#fff; }
.entry_wrap a .entry_wrap_inner li strong em { width:100%; font-size:18px; display:inline-block; }
.entry_wrap a .entry_wrap_inner li p { font-size:16px;display:inline-block; color:#000; }
.entry_wrap a .entry_wrap_inner li p.inline_pc { display:none; }
.entry_wrap a .entry_wrap_inner li .entry_illust { display:none; }
.entry_wrap a .entry_wrap_inner li .entry_kazari { top:50px;}
.entry_wrap a .entry_wrap_inner li .door { position:absolute; right:0; bottom: -20px;}
@media screen and (min-width:768px) {
  .entry_wrap { width:80%; }
  .entry_wrap a .entry_wrap_inner { width:80%; padding:100px 0;}
  .entry_wrap a:hover .door .tobira { transform: rotateY(-35deg); border:0px;}
  .entry_wrap a .entry_wrap_inner li { width:50%; position:relative;}
  .entry_wrap a .entry_wrap_inner li:nth-child(2) { margin-top: -4vw; }
  .entry_wrap a .entry_wrap_inner li strong { font-size:80px; margin-bottom:16px; line-height: 40px;}
  .entry_wrap a .entry_wrap_inner li strong em { width:auto;  }
  .entry_wrap a .entry_wrap_inner li p.inline_pc { font-size:24px; display:inline-block; line-height: 1.5;}
  .entry_wrap a .entry_wrap_inner li .entry_illust { width:130px; position:absolute; right:0%; display:block; }
  .entry_wrap a .entry_wrap_inner li .entry_illust .suzume_walk { width:100%; margin-top:30px; margin-left:20px; }
  .entry_wrap a .entry_wrap_inner li .entry_illust .text_fun { width:100%; opacity:0; }
  .entry_wrap a:hover .entry_wrap_inner li .entry_illust .text_fun { opacity:1; }
  .entry_wrap a:hover .entry_wrap_inner li .entry_illust .text_fun {opacity:1; animation:funSwing 1s ease-in-out infinite; transform-origin: center bottom; }
  .entry_wrap a .entry_wrap_inner li .door { right:32%; margin-left:auto; bottom: inherit;}
}

  @keyframes funSwing {
    0%   { transform: rotate(0deg); }
    25%  { transform: rotate(5deg); }
    50%  { transform: rotate(0deg); }
    75%  { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
  }


@media screen and (min-width:1280px) {
  .entry_wrap_inner .suzume_walk {display:block;  }
}



/*ページ下の無限スクロール*/
.scroll-infinity{ width: 100%; --gap:13px;--row-gap:13px;--speed-top: 60s; --speed-bottom: 60s;--items-per-view: 3;display: grid;gap: var(--row-gap);margin:0px 0 80px 0; }

.marquee-track{display: flex;gap: var(--gap);list-style: none;padding: 0;margin: 0;will-change: transform;}
.marquee-item{flex: 0 0 calc((100vw - (var(--gap) * (var(--items-per-view) - 1))) / var(--items-per-view));}
.marquee-item img{width:100%; height: auto;display: block;object-fit: cover;border:1px solid #000; }
@media (min-width: 768px) {
  .scroll-infinity { margin:150px 0; }
}

@keyframes marquee-left {
  from{ transform: translate3d(0,0,0); }
  to  { transform: translate3d(-50%,0,0); }
}
@keyframes marquee-right {
  from{ transform: translate3d(0,0,0); }
  to  { transform: translate3d( 50%,0,0); }
}
.marquee-row--left  .marquee-track{ animation: marquee-left  var(--speed-top)   linear infinite; }
.marquee-row--right .marquee-track{ animation: marquee-right var(--speed-bottom) linear infinite; }

@media (max-width: 767px){
  .scroll-infinity{ --items-per-view: 2; }
}

@media (prefers-reduced-motion: reduce){
  .marquee-track{ animation: none; }
}

@keyframes marquee-right {
  from { transform: translate3d(-50%,0,0); }
  to   { transform: translate3d(0,0,0); }
}

.marquee-item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border: 1px solid #000;
}

/* スマホ時のみ高さを高くする */
@media (max-width: 767px) {
  .marquee-item img {
    height:18.5vh; /* 画面の高さの45%に調整（好みで増減OK） */
    object-fit: cover; /* はみ出し部分をトリミング */
  }
    .scroll-infinity {
    --items-per-view: 2;
    --speed-top: 20s;       /* ← 速く（例：半分の速さ） */
    --speed-bottom: 20s;    /* ← 同様に速く */
  }

  .marquee-item img {
    height: 18.5vh;
    object-fit: cover;
  }
}



.marquee-row--right .marquee-track{ transform: translate3d(-50%,0,0); animation: marquee-right var(--speed-bottom) linear infinite;}



.footer_contents.inline_pc { display:block; }
@media (min-width: 768px) {
  .footer_contents.inline_pc { display:block; }
}