@charset "UTF-8";

/* =========================================================
   白狼うるる 公式サイト  /  style.css
   コンセプト：ぜんぶ天井から吊り下がっている
   テーマ：水色 × 白 × 黄色　きらきら星
   ========================================================= */

:root{
  --c-blue:      #59bfe4;
  --c-blue-deep: #2f8fb8;
  --c-blue-soft: #b6e6f6;
  --c-blue-pale: #e6f7fd;
  --c-yellow:    #ffd23f;
  --c-yellow-soft:#fff2b8;
  --c-white:     #ffffff;
  --c-text:      #3d5a68;
  --c-text-thin: #7d97a4;

  --cord-color: #9ad8ee;

  --radius:  26px;
  --radius-s:15px;
  --shadow:   0 14px 34px rgba(89, 191, 228, .22);
  --shadow-s: 0 5px 16px rgba(89, 191, 228, .18);

  --font: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Yu Gothic UI",
          "Meiryo", system-ui, sans-serif;
  --font-en: "Kaisei Decol", "Zen Maru Gothic", serif;

  --ceiling-h: 106px;   /* 天井＋吊りナビの高さ */

  /* --- 飾り用アイコン（絵文字だと端末ごとに見た目が変わるのでSVGにしている） --- */
  --ic-star:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4l3 6.2 6.8.9-4.9 4.8 1.2 6.8L12 17.9l-6.1 3.2 1.2-6.8L2.2 9.5l6.8-.9z' fill='%23ffd23f' stroke='%23fff' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ic-star-white:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4l3 6.2 6.8.9-4.9 4.8 1.2 6.8L12 17.9l-6.1 3.2 1.2-6.8L2.2 9.5l6.8-.9z' fill='%23fff' stroke='%23b6e6f6' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ic-star-blue: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.4l3 6.2 6.8.9-4.9 4.8 1.2 6.8L12 17.9l-6.1 3.2 1.2-6.8L2.2 9.5l6.8-.9z' fill='%23b6e6f6' stroke='%23fff' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ic-sparkle:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.6c.8 5.9 3.7 8.8 9.6 9.6-5.9.8-8.8 3.7-9.6 9.6-.8-5.9-3.7-8.8-9.6-9.6C8.3 10.4 11.2 7.5 12 1.6z' fill='%23ffd23f' stroke='%23fff' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ic-flip:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 0 1-14.6 5.9M3.5 12a8.5 8.5 0 0 1 14.6-5.9'/%3E%3Cpath d='M18.4 2.6v4h-4M5.6 21.4v-4h4'/%3E%3C/svg%3E");
  --ic-phone:     url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6' y='2' width='12' height='20' rx='2.6' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Cline x1='10.5' y1='5.2' x2='13.5' y2='5.2' stroke='%23fff' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  --ic-phone-b:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6' y='2' width='12' height='20' rx='2.6' fill='none' stroke='%232f8fb8' stroke-width='2'/%3E%3Cline x1='10.5' y1='5.2' x2='13.5' y2='5.2' stroke='%232f8fb8' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");

}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; scroll-padding-top: calc(var(--ceiling-h) + 20px); }

body{
  margin:0;
  font-family:var(--font);
  color:var(--c-text);
  background:
    linear-gradient(180deg, #d3effb 0%, #eafaff 24%, #ffffff 58%, #f2fbff 100%);
  line-height:1.9;
  letter-spacing:.02em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,p{ margin:0; }

/* =========================================================
   共通：ひも と ゆれ
   ========================================================= */
.cord,
.ceiling__cord, .hangNav__cord, .plate__cord, .hero__cord,
.hangTag__cord, .hang__cord, .miniPlate__cord, .ornament__cord,
.tanzaku__cord, .belt__cord{
  display:block; width:2px; margin:0 auto;
  background:linear-gradient(180deg, rgba(154,216,238,.25), var(--cord-color));
  border-radius:2px;
}

/* 揺れ：ひもの根本（上端）を軸に回転 */
@keyframes swing{
  0%   { transform:rotate(-1.6deg); }
  100% { transform:rotate(1.6deg); }
}
@keyframes swingBig{
  0%   { transform:rotate(-4.5deg); }
  100% { transform:rotate(4.5deg); }
}
@keyframes twinkle{
  0%,100%{ opacity:1;   transform:scale(1); }
  50%    { opacity:.55; transform:scale(.86); }
}
/* 吊り下がってくるとき：上からストンと落ちて揺れる */
@keyframes dropIn{
  0%   { opacity:0; transform:translateY(-40px) rotate(-3deg); }
  60%  { opacity:1; transform:translateY(0)     rotate(2.4deg); }
  80%  {            transform:rotate(-1.4deg); }
  100% { opacity:1; transform:translateY(0)     rotate(0deg); }
}

/* =========================================================
   ロード画面
   ========================================================= */
.loader{
  position:fixed; inset:0; z-index:200;
  display:grid; place-items:center;
  background:linear-gradient(170deg, #8fd9f0 0%, #b9e8f8 42%, #eafaff 100%);
  transition:opacity .6s ease, visibility .6s ease;
}
.loader.is-done{ opacity:0; visibility:hidden; }

/* うっすら光る空 */
.loader__sky{
  position:absolute; inset:0;
  background:
    radial-gradient(38% 42% at 22% 14%, rgba(255,255,255,.85), transparent 70%),
    radial-gradient(32% 38% at 80% 8%,  rgba(255,242,184,.75), transparent 70%),
    radial-gradient(60% 45% at 50% 100%,rgba(255,255,255,.7),  transparent 70%);
}

.loader__inner{
  position:relative; z-index:1;
  display:flex; flex-direction:column; align-items:center;
  animation: loaderIn .7s ease both;
}
@keyframes loaderIn{
  from{ opacity:0; transform:translateY(14px); }
  to  { opacity:1; transform:none; }
}

/* 画面のいちばん上から垂れてくる星（サイト本体と同じモチーフ） */
.loader__hang{
  position:absolute; top:0; left:50%; z-index:1;
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 3.4s ease-in-out infinite alternate;
}
.loader__hang--b{ left:calc(50% - 82px); animation-delay:-1.1s; }
.loader__hang--c{ left:calc(50% + 82px); animation-delay:-2.2s; }
.loader__cord{
  display:block; width:2px; height:clamp(70px,14vh,130px);
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.9));
}
.loader__hang--b .loader__cord{ height:clamp(44px,9vh,86px); }
.loader__hang--c .loader__cord{ height:clamp(56px,11vh,104px); }
.loader__star{
  width:30px; height:30px;
  background:var(--ic-star) center/contain no-repeat;
  filter:drop-shadow(0 4px 8px rgba(47,143,184,.4));
  animation: twinkle 1.6s ease-in-out infinite;
}
.loader__star--2{ width:22px; height:22px; background-image:var(--ic-star-white); animation-delay:-.5s; }
.loader__star--3{ width:24px; height:24px; background-image:var(--ic-sparkle);    animation-delay:-1s; }

.loader__logo{
  width:min(300px, 66vw); height:auto;
  filter:drop-shadow(0 8px 18px rgba(47,143,184,.4));
}
.loader__text{
  margin-top:14px;
  font-family:var(--font-en);
  font-size:12px; letter-spacing:.32em; color:#fff;
  text-shadow:0 2px 6px rgba(47,143,184,.5);
  animation: loaderText 1.6s ease-in-out infinite;
}
@keyframes loaderText{
  0%,100%{ opacity:1; }
  50%    { opacity:.45; }
}

/* きらきら流れるバー */
.loader__bar{
  margin-top:14px; width:min(190px,56vw); height:6px;
  border-radius:999px; background:rgba(255,255,255,.55); overflow:hidden;
}
.loader__bar span{
  display:block; width:45%; height:100%; border-radius:999px;
  background:linear-gradient(90deg, rgba(255,255,255,.2), #fff 45%, var(--c-yellow));
  animation: loaderBar 1.3s ease-in-out infinite;
}
@keyframes loaderBar{
  0%  { transform:translateX(-110%); }
  100%{ transform:translateX(240%); }
}

/* =========================================================
   背景（空・降る星）
   ========================================================= */
.sky{ position:fixed; inset:0; z-index:-2; pointer-events:none; overflow:hidden; }
.sky__glow{
  position:absolute; inset:-20% -10% auto -10%; height:70vh;
  background:
    radial-gradient(45% 55% at 18% 8%,  rgba(255,255,255,.9), transparent 70%),
    radial-gradient(40% 50% at 82% 4%,  rgba(255,242,184,.7), transparent 70%),
    radial-gradient(60% 60% at 50% -10%,rgba(182,230,246,.9), transparent 70%);
}
.star-field{ position:absolute; inset:0; }

.fstar{
  position:absolute; top:-8vh; opacity:0;
  background:var(--ic-star) center/contain no-repeat;
  animation: fall linear infinite;
  will-change: transform, opacity;
}
.fstar--blue{  background-image:var(--ic-star-blue); }
.fstar--white{ background-image:var(--ic-star-white); }
.fstar--sparkle{ background-image:var(--ic-sparkle); }

@keyframes fall{
  0%   { transform:translate3d(0,0,0) rotate(0deg);          opacity:0; }
  10%  { opacity:.95; }
  90%  { opacity:.7; }
  100% { transform:translate3d(-40px,112vh,0) rotate(320deg); opacity:0; }
}

/* =========================================================
   天井（固定）と吊り下げナビ
   ========================================================= */
.ceiling{
  position:fixed; top:0; left:0; right:0; z-index:60;
  height:var(--ceiling-h);
  pointer-events:none;
}
.ceiling__rail{
  position:absolute; top:0; left:0; right:0; height:26px;
  background:linear-gradient(180deg, rgba(255,255,255,.96) 40%, rgba(255,255,255,.55) 75%, rgba(255,255,255,0));
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:2px solid var(--c-blue-soft);
  box-shadow:0 4px 16px rgba(89,191,228,.16);
}
.ceiling__rail::after{
  content:""; position:absolute; left:0; right:0; top:26px; height:2px;
  background:repeating-linear-gradient(90deg, var(--c-blue-soft) 0 6px, transparent 6px 14px);
  opacity:.6;
}

/* 左上：アイコン（トップへ戻る） */
.ceiling__home{
  position:absolute; top:22px; left:clamp(12px,3vw,30px);
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0; pointer-events:auto;
  animation: swing 5.2s ease-in-out infinite alternate;
}
.ceiling__cord{ height:16px; }
.ceiling__icon img{
  width:52px; height:52px; border-radius:50%;
  border:3px solid #fff; background:var(--c-blue-pale);
  box-shadow:var(--shadow-s); object-fit:cover;
  transition:transform .25s ease;
}
.ceiling__home:hover .ceiling__icon img{ transform:scale(1.08) rotate(-6deg); }

/* 吊り下げナビ本体 */
.hangNav{
  position:absolute; top:22px; right:clamp(12px,3vw,30px);
  display:flex; align-items:flex-start; gap:clamp(6px,1.4vw,18px);
  pointer-events:auto;
}
.hangNav__item{
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 4.6s ease-in-out infinite alternate;
  animation-delay:var(--delay, 0s);
}
.hangNav__cord{ height:var(--cord, 34px); transition:height .35s ease; }
.hangNav__tag{
  display:flex; align-items:center; gap:5px;
  padding:6px 15px; border-radius:999px;
  background:#fff; border:2px solid var(--c-blue-soft);
  box-shadow:var(--shadow-s);
  font-size:12px; font-weight:700; letter-spacing:.06em;
  color:var(--c-blue-deep); white-space:nowrap;
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.hangNav__tag b{ display:inline-block; width:12px; height:12px; flex:0 0 auto;
  background:var(--ic-star) center/contain no-repeat; }
.hangNav__tag b.ph{ background-image:var(--ic-phone-b); }
.hangNav__tag b.sp{ background-image:var(--ic-sparkle); }
.hangNav__item:hover{ animation-duration:1.1s; }
.hangNav__item:hover .hangNav__tag{
  transform:scale(1.08);
  background:var(--c-yellow-soft); border-color:var(--c-yellow);
}
/* スクロールするとひもが短くなる */
.ceiling.is-compact .hangNav__cord{ height:14px; }
.ceiling.is-compact .ceiling__cord{ height:8px; }

.navToggle{
  display:none; position:absolute; top:30px; right:clamp(12px,3vw,30px);
  width:46px; height:46px; border:2px solid var(--c-blue-soft); border-radius:50%;
  background:#fff; box-shadow:var(--shadow-s); cursor:pointer;
  pointer-events:auto; padding:0;
  flex-direction:column; justify-content:center; align-items:center; gap:5px;
}
.navToggle span{
  display:block; width:20px; height:2.5px; border-radius:3px;
  background:var(--c-blue-deep); transition:transform .3s, opacity .3s;
}
.navToggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.navToggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.navToggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  padding: calc(var(--ceiling-h) + 10px) clamp(16px,4vw,40px) clamp(50px,7vw,90px);
}
/* 背景で揺れる小さな星のモビール */
.mobile{ position:absolute; inset:0 0 auto 0; height:340px; pointer-events:none; z-index:0; }
.mobile__item{
  position:absolute; top:0;
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swingBig 4.4s ease-in-out infinite alternate;
}
.mobile__cord{
  width:1.5px; background:linear-gradient(180deg, rgba(154,216,238,0), var(--cord-color));
  border-radius:2px;
}
.mobile__star{
  width:20px; height:20px;
  background:var(--ic-star) center/contain no-repeat;
  filter:drop-shadow(0 3px 6px rgba(255,210,63,.5));
  animation: twinkle 2.8s ease-in-out infinite;
}
.mobile__star--w{ background-image:var(--ic-star-white); }
.mobile__star--s{ background-image:var(--ic-sparkle); }

.hero__stage{
  position:relative; z-index:1;
  max-width:860px; margin:0 auto; text-align:center;
}

/* 名前プレート */
.plate{ display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0; animation: swing 6.5s ease-in-out infinite alternate; }
.plate__cord{ height:var(--cord, 60px); }
.plate__board{
  position:relative;
  padding:20px clamp(24px,5vw,54px) 24px;
  /* ロゴが白系なので、板の中を水色に沈ませて白い文字が浮くようにする */
  background:linear-gradient(165deg, #8fd9f0 0%, #b9e8f8 45%, #dff5fd 100%);
  border:4px solid #fff;
  border-radius:var(--radius);
  box-shadow:var(--shadow), inset 0 -8px 20px rgba(47,143,184,.14);
}
.plate__board::before,
.plate__board::after{
  content:""; position:absolute; top:-14px; width:20px; height:20px; background:var(--ic-star) center/contain no-repeat;
  filter:drop-shadow(0 3px 5px rgba(255,210,63,.55));
}
.plate__board::before{ left:16px; }
.plate__board::after{  right:16px; }
.plate__sub{
  display:inline-block;
  font-size:12px; font-weight:700; letter-spacing:.16em; color:var(--c-blue-deep);
  background:rgba(255,255,255,.75); border-radius:999px; padding:3px 16px;
}
.plate__logo{ margin:12px 0 2px; }
.plate__logo img{
  width:clamp(230px, 42vw, 420px); height:auto; margin:0 auto;
  filter:drop-shadow(0 6px 14px rgba(47,143,184,.35));
}

/* メインビジュアル */
.hero__visual{
  position:relative; width:min(360px, 78vw); margin:0 auto;
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 7.5s ease-in-out infinite alternate;
  animation-delay:-2s;
}
.hero__cord{ height:34px; }
.hero__frame{
  position:relative; border-radius:var(--radius); overflow:visible;
  background:#fff; padding:10px 10px 14px;
  border:2px solid var(--c-blue-soft);
  box-shadow:0 18px 40px rgba(89,191,228,.3);
}
.hero__frame img{ width:100%; border-radius:18px; }
.hero__clip{
  position:absolute; top:-16px; left:50%; transform:translateX(-50%);
  width:26px; height:26px;
  background:var(--ic-star) center/contain no-repeat;
  filter:drop-shadow(0 3px 5px rgba(255,210,63,.6));
  animation: twinkle 3s ease-in-out infinite;
}
.hero__chibi{
  position:absolute; width:clamp(84px,12vw,128px); height:auto; z-index:2;
  filter:drop-shadow(0 8px 16px rgba(89,191,228,.35));
  animation: swingBig 5s ease-in-out infinite alternate;
  transform-origin:50% 0;
}
.hero__chibi--1{ left:-22%;  bottom:6%;  animation-delay:-1.2s; }
.hero__chibi--2{ right:-20%; top:22%;    animation-delay:-2.6s; }

/* 小さな吊りタグの列 */
.tagRow{
  display:flex; justify-content:center; align-items:flex-start;
  gap:clamp(10px,3vw,28px); margin-top:6px; flex-wrap:wrap;
}
.hangTag{
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 4.8s ease-in-out infinite alternate;
  animation-delay:var(--delay, 0s);
}
.hangTag__cord{ height:var(--cord, 30px); }
.hangTag__body{
  padding:7px 16px; border-radius:999px;
  background:#fff; border:2px dashed var(--c-blue-soft);
  box-shadow:var(--shadow-s);
  font-size:11.5px; color:var(--c-text-thin); white-space:nowrap;
}
.hangTag__body b{ display:block; font-size:14px; color:var(--c-blue-deep); }

.hero__lead{ margin-top:26px; font-size:clamp(14px,1.6vw,16px); }
.hero__btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; justify-content:center; }

.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 30px; border-radius:999px;
  font-weight:700; font-size:15px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.btn--primary{
  background:linear-gradient(135deg, var(--c-blue) 0%, #7fd6ef 100%);
  color:#fff; box-shadow:0 8px 20px rgba(89,191,228,.45);
}
.btn--primary::after{ content:""; flex:0 0 auto; width:15px; height:15px;
  background:var(--ic-star) center/contain no-repeat; }
.btn--ghost{
  background:#fff; color:var(--c-blue-deep);
  border:2px solid var(--c-blue-soft); box-shadow:var(--shadow-s);
}
.btn:hover{ transform:translateY(-3px); }

/* =========================================================
   吊り下げセクション
   ========================================================= */
.hang{
  position:relative;
  width:min(920px, 100%);
  margin:0 auto clamp(56px,8vw,104px);
  padding:0 clamp(16px,4vw,40px);
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 9s ease-in-out infinite alternate;
}
/* 左右にずらして非対称のリズムをつくる */
.hang--left  { margin-left:max(0px, calc(50% - 520px)); margin-right:auto; }
.hang--right { margin-right:max(0px, calc(50% - 520px)); margin-left:auto; }
.hang--wide  { width:min(1180px, 100%); }
.hang--left  { animation-delay:-1.5s; }
.hang--right { animation-delay:-4s; }

.hang__cord{ height:var(--cord, 50px); }
.hang__board{
  position:relative; width:100%;
  padding:clamp(26px,4vw,44px) clamp(20px,4vw,44px) clamp(30px,4vw,46px);
  background:rgba(255,255,255,.92);
  border:3px solid var(--c-blue-soft);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
/* ボードの上にささる星のピン */
.hang__board::before{
  content:""; position:absolute; top:-17px; left:50%; transform:translateX(-50%);
  width:26px; height:26px; background:var(--ic-star) center/contain no-repeat; filter:drop-shadow(0 3px 6px rgba(255,210,63,.6));
}
/* 背景なしのボード（NEWS / SNS / GALLERY 用） */
.hang__board--bare{
  background:transparent; border:0; box-shadow:none; padding-top:16px;
}
.hang__board--bare::before{ top:-26px; }

.hang__title{
  text-align:center; margin-bottom:clamp(20px,3vw,34px); line-height:1.2;
}
.hang__title span{
  display:block; font-family:var(--font-en);
  font-size:clamp(26px,4.6vw,42px); letter-spacing:.14em;
  color:var(--c-blue); opacity:.6;
}
.hang__title em{
  display:inline-block; font-style:normal; margin-top:4px;
  font-size:clamp(15px,2.2vw,19px); font-weight:700; color:var(--c-blue-deep);
}
.hang__title em::before{ content:""; display:inline-block; width:15px; height:15px;
  vertical-align:-2px; margin-right:7px; background:var(--ic-star) center/contain no-repeat; }
.hang__title em::after{ content:""; display:inline-block; width:14px; height:14px;
  vertical-align:-2px; margin-left:7px; background:var(--ic-sparkle) center/contain no-repeat; }
.hang__note{
  text-align:center; font-size:12.5px; color:var(--c-text-thin); margin-top:-18px; margin-bottom:14px;
}

/* 落ちてくる登場アニメ */
.dropTarget{ opacity:0; }
/* opacity は animation とは別に指定しておく。
   （アニメが走らない環境でも中身が消えたままにならないように） */
/* fill-mode は付けないこと。付けるとアニメが走らない環境で opacity:0 のまま固まる */
.dropTarget.is-in{
  opacity:1;
  animation: dropIn 1s cubic-bezier(.34,1.4,.5,1);
}

/* =========================================================
   PROFILE
   ========================================================= */
.profile{
  display:grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(18px,3.5vw,40px); align-items:start;
}
/* --- タップでひっくり返る立ち絵カード --- */
.flip{
  position:relative; display:block; width:100%; padding:0;
  margin-bottom:24px;   /* 下にはみ出すヒント用のゆとり */
  background:transparent; border:0; cursor:pointer;
  perspective:1200px;
  -webkit-tap-highlight-color:transparent;
}
.flip__inner{
  position:relative; display:block; width:100%; aspect-ratio:3 / 4;
  transform-style:preserve-3d;
  transition:transform .75s cubic-bezier(.4,.1,.25,1.1);
}
.flip[aria-pressed="true"] .flip__inner{ transform:rotateY(180deg); }

.flip__face{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
  border-radius:var(--radius-s); overflow:hidden;
  background:linear-gradient(180deg,#fff, var(--c-blue-pale));
  border:4px solid #fff;
  box-shadow:var(--shadow-s);
}
.flip__face--back{ transform:rotateY(180deg); }
.flip__face img{ width:100%; height:100%; object-fit:contain; }

/* 何枚目かの表示 */
.flip__label{
  position:absolute; top:10px; left:10px;
  font-size:11px; font-weight:700; color:var(--c-blue-deep);
  background:rgba(255,255,255,.9); border:2px solid var(--c-blue-soft);
  border-radius:999px; padding:2px 11px;
}

/* 「押せる」ことがわかるヒント（文字なしの丸バッジ） */
.flip__hint{
  position:absolute; left:50%; bottom:-14px; transform:translateX(-50%);
  z-index:2; display:grid; place-items:center;
  width:46px; height:46px; border-radius:50%;
  background:linear-gradient(135deg, var(--c-blue), #7fd6ef);
  border:3px solid #fff;
  box-shadow:0 8px 18px rgba(89,191,228,.5);
  animation: hintPulse 2.4s ease-in-out infinite;
}
.flip__hintIcon{ display:block; width:22px; height:22px;
  background:var(--ic-flip) center/contain no-repeat;
  animation: hintSpin 3.2s ease-in-out infinite; }
@keyframes hintPulse{
  0%,100%{ transform:translateX(-50%) translateY(0)    scale(1); }
  50%    { transform:translateX(-50%) translateY(-4px) scale(1.05); }
}
@keyframes hintSpin{
  0%,70%,100%{ transform:rotate(0deg); }
  85%        { transform:rotate(180deg); }
}
.flip:hover .flip__face,
.flip:focus-visible .flip__face{ border-color:var(--c-yellow-soft); }
.flip:focus-visible{ outline:3px solid var(--c-yellow); outline-offset:6px; border-radius:var(--radius-s); }
/* 一度でも押したらヒントは控えめに */
.flip.is-used .flip__hint{ animation:none; }
.profile__catch{
  font-size:clamp(14px,2vw,18px); font-weight:700;
  color:var(--c-blue-deep); text-align:center;
  padding-bottom:12px; border-bottom:2px dashed var(--c-blue-soft);
}
.profile__text{ margin-top:14px; font-size:15px; }

.profile__list{
  margin-top:18px; border-radius:var(--radius-s); overflow:hidden;
  background:var(--c-blue-pale);
}
.profile__list div{
  display:grid; grid-template-columns:120px 1fr; gap:10px;
  padding:11px 18px; border-bottom:1px dashed rgba(89,191,228,.4);
  font-size:14.5px;
}
.profile__list div:last-child{ border-bottom:0; }
.profile__list dt{ font-weight:700; color:var(--c-blue-deep); }
.profile__list dd{ word-break:break-word; }

.oshima{
  margin-top:22px; padding:18px 22px;
  background:linear-gradient(135deg, var(--c-yellow-soft), #fff);
  border:2px solid var(--c-yellow); border-radius:var(--radius-s);
  font-size:14px;
}
.oshima__title{ font-weight:700; color:#c99400; margin-bottom:6px; }

/* =========================================================
   NEWS（短冊）
   ========================================================= */
.tanzaku{ display:flex; flex-direction:column; align-items:center; gap:4px; width:100%; }
.tanzaku__item{
  display:flex; flex-direction:column; align-items:center; width:100%;
  transform-origin:50% 0;
  animation: swing 5.6s ease-in-out infinite alternate;
}
.tanzaku__cord{ height:var(--cord, 26px); }
.tanzaku__paper{
  position:relative; width:100%;
  display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:14px;
  padding:15px 26px;
  background:#fff; border-radius:8px 8px 14px 14px;
  border:2px solid var(--c-blue-soft);
  border-top:5px solid var(--c-blue);
  box-shadow:var(--shadow-s);
}
.tanzaku__paper::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:10px;
  background:
    radial-gradient(circle at 8px -4px, transparent 8px, #fff 8px) repeat-x;
  background-size:16px 10px;
}
.tanzaku__date{ font-size:12.5px; color:var(--c-text-thin); letter-spacing:.06em; }
.tanzaku__tag{
  font-size:11.5px; font-weight:700; color:#fff;
  border-radius:999px; padding:3px 12px; white-space:nowrap;
  background:var(--c-blue);
}
.tanzaku__tag--info { background:var(--c-blue); }
.tanzaku__tag--live { background:#f5a3c7; }
.tanzaku__tag--goods{ background:#f0b429; }
.tanzaku__text{ font-size:15px; }
.tanzaku__text a{ color:var(--c-blue-deep); text-decoration:underline; }

/* =========================================================
   STREAM（吊り下げプレート）
   ========================================================= */
.plates{
  position:relative; display:flex; justify-content:center; align-items:flex-start;
  flex-wrap:wrap; gap:clamp(10px,2vw,22px); padding-top:16px; margin-bottom:8px;
}
.plates__rail{
  position:absolute; top:12px; left:6%; right:6%; height:2px;
  background:repeating-linear-gradient(90deg, var(--c-blue-soft) 0 8px, transparent 8px 16px);
}
.miniPlate{
  display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 4.2s ease-in-out infinite alternate;
  animation-delay:var(--delay, 0s);
}
.miniPlate__cord{ height:var(--cord, 26px); }
.miniPlate__body{
  min-width:150px; text-align:center; padding:16px 16px 18px;
  background:linear-gradient(180deg,#fff,#f6fdff);
  border:2px solid var(--c-blue-soft); border-radius:var(--radius-s);
  box-shadow:var(--shadow-s);
  transition:transform .25s ease;
}
.miniPlate:hover{ animation-duration:1.1s; }
.miniPlate:hover .miniPlate__body{ transform:scale(1.04); }
.miniPlate__label{
  display:inline-block; font-size:11.5px; font-weight:700; color:#fff;
  background:var(--c-blue); border-radius:999px; padding:2px 13px;
}
.miniPlate__big{
  margin-top:9px; font-size:clamp(15px,1.9vw,19px); font-weight:900;
  color:var(--c-blue-deep); line-height:1.4;
}
.miniPlate__note{ font-size:12px; color:var(--c-text-thin); }

.rules{
  margin-top:26px; padding:clamp(18px,3vw,28px);
  background:var(--c-blue-pale); border-radius:var(--radius-s);
  border:2px dashed var(--c-blue-soft);
}
.rules__title{
  text-align:center; font-weight:700; color:var(--c-blue-deep);
  font-size:15.5px; margin-bottom:12px;
}
.rules__list{ display:grid; gap:9px; max-width:640px; margin:0 auto; }
.rules__list li{ position:relative; padding-left:29px; font-size:14.5px; }
.rules__list li::before{ content:""; position:absolute; left:0; top:5px;
  width:15px; height:15px; background:var(--ic-star) center/contain no-repeat; }

/* =========================================================
   SNS（吊りオーナメント）
   ========================================================= */
.ornaments{
  position:relative; display:flex; flex-wrap:wrap; justify-content:center;
  align-items:flex-start; gap:clamp(12px,2.6vw,30px); padding-top:18px;
}
.ornaments__rail{
  position:absolute; top:14px; left:2%; right:2%; height:2px;
  background:repeating-linear-gradient(90deg, var(--c-blue-soft) 0 8px, transparent 8px 16px);
}
.ornament{
  display:flex; flex-direction:column; align-items:center; width:112px;
  transform-origin:50% 0;
  animation: swing 4.4s ease-in-out infinite alternate;
  animation-delay:var(--delay, 0s);
}
.ornament__cord{ height:var(--cord, 30px); }
.ornament__ball{
  position:relative; width:78px; height:78px; border-radius:50%;
  display:grid; place-items:center; color:#fff;
  box-shadow:0 10px 20px rgba(0,0,0,.16), inset 0 -6px 14px rgba(0,0,0,.14);
  border:4px solid #fff;
  transition:transform .28s ease;
}
.ornament__ball::before{
  content:""; position:absolute; top:11px; left:15px; width:20px; height:12px;
  border-radius:50%; background:rgba(255,255,255,.6); filter:blur(2px);
}
.ornament__ball::after{
  content:""; position:absolute; top:-11px; left:50%; transform:translateX(-50%);
  width:14px; height:11px; border-radius:3px;
  background:linear-gradient(180deg,#fff,#dff3fb); border:2px solid var(--c-blue-soft);
}
.ornament__ball svg{ width:32px; height:32px; fill:currentColor; }
.ornament:hover{ animation-duration:1s; }
.ornament:hover .ornament__ball{ transform:scale(1.1); }
.ornament__name{
  margin-top:11px; font-size:13px; font-weight:700; color:var(--c-blue-deep);
  text-align:center; line-height:1.4;
}
.ornament__id{
  font-size:11px; color:var(--c-text-thin); text-align:center;
  max-width:112px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* =========================================================
   GALLERY（流れる星のベルト）
   ========================================================= */
.gallerySec{ margin-bottom:clamp(56px,8vw,104px); }
.gallerySec .hang{ margin-bottom:8px; }

/* カテゴリーごとの行
   grid の子は min-width:auto なので、中の長いベルトに引っぱられて
   行ごと横に伸びてしまう。minmax(0,1fr) と min-width:0 で止める。 */
.belts{ display:grid; grid-template-columns:minmax(0,1fr); gap:clamp(18px,3vw,34px); }
.beltRow{ min-width:0; }
.belts__empty{
  text-align:center; color:var(--c-text-thin); font-size:14px; padding:24px 16px;
}
.beltRow__label{
  text-align:center; margin-bottom:2px;
}
.beltRow__label span{
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 22px; border-radius:999px;
  font-size:13px; font-weight:700; letter-spacing:.06em;
  color:var(--c-blue-deep); background:rgba(255,255,255,.92);
  border:2px solid var(--c-blue-soft);
  box-shadow:var(--shadow-s);
}
.beltRow__label span::before{ content:""; width:13px; height:13px; flex:0 0 auto; background:var(--ic-star) center/contain no-repeat; }

.belt{
  position:relative; width:100%;
  padding:0 0 24px; overflow:hidden;
}
.belt__rail{
  position:absolute; top:8px; left:0; right:0; height:3px;
  background:repeating-linear-gradient(90deg, var(--c-blue-soft) 0 10px, transparent 10px 20px);
}
.belt__track{
  display:flex; align-items:flex-start; gap:clamp(14px,2.4vw,30px);
  padding:8px clamp(14px,3vw,30px) 0;
  width:max-content;
  animation: flow 46s linear infinite;
}
@keyframes flow{
  from{ transform:translateX(0); }
  to  { transform:translateX(var(--shift, -50%)); }
}
/* 1行おきに逆向きに流す */
.belt__track--rev{ animation-direction:reverse; }

.belt:hover .belt__track,
.belt:focus-within .belt__track{ animation-play-state:paused; }

.hangPic{
  flex:0 0 auto; display:flex; flex-direction:column; align-items:center;
  transform-origin:50% 0;
  animation: swing 4.6s ease-in-out infinite alternate;
  animation-delay:var(--delay, 0s);
}
.hangPic__cord{
  display:block; width:2px; height:var(--cord, 26px); margin:0 auto;
  background:linear-gradient(180deg, rgba(154,216,238,.25), var(--cord-color));
}
.hangPic__btn{
  position:relative; padding:9px 9px 12px; border:2px solid var(--c-blue-soft);
  background:#fff; border-radius:14px; cursor:pointer;
  box-shadow:var(--shadow-s);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.hangPic__btn::before{
  content:""; position:absolute; top:-15px; left:50%; transform:translateX(-50%);
  width:17px; height:17px; background:var(--ic-star) center/contain no-repeat; filter:drop-shadow(0 2px 4px rgba(255,210,63,.6));
}
.hangPic__btn img{
  width:auto; height:clamp(150px,20vw,224px); border-radius:8px;
  background:var(--c-blue-pale);
}
.hangPic__btn:hover{
  transform:translateY(4px) scale(1.03);
  border-color:var(--c-yellow); box-shadow:var(--shadow);
}
.hangPic__cap{
  margin-top:7px; font-size:11.5px; color:var(--c-text-thin); text-align:center;
}

/* ライトボックス */
.lightbox{
  position:fixed; inset:0; z-index:100;
  display:flex; align-items:center; justify-content:center; gap:10px; padding:24px;
  background:rgba(38,72,90,.86);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.lightbox[hidden]{ display:none; }
.lightbox__fig{ margin:0; max-width:min(880px,86vw); text-align:center; }
.lightbox__fig img{
  max-height:78vh; width:auto; margin:0 auto;
  border-radius:var(--radius-s); background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.4);
}
.lightbox__fig figcaption{ color:#fff; font-size:14px; margin-top:14px; }
.lightbox__close,
.lightbox__nav{
  flex:0 0 auto; width:48px; height:48px; border:0; border-radius:50%;
  background:rgba(255,255,255,.92); color:var(--c-blue-deep);
  font-size:26px; line-height:1; cursor:pointer;
  transition:transform .2s ease, background .2s ease;
}
.lightbox__close{ position:absolute; top:18px; right:18px; font-size:24px; }
.lightbox__close:hover,
.lightbox__nav:hover{ transform:scale(1.1); background:var(--c-yellow); }

/* =========================================================
   WALLPAPER（カレンダー壁紙の配布）
   ========================================================= */
.wall{
  display:flex; align-items:center; justify-content:center;
  gap:clamp(20px,4vw,44px); flex-wrap:wrap;
}

/* スマホの形をした枠 */
.phone{
  position:relative; flex:0 0 auto;
  width:min(230px,58vw); aspect-ratio:9 / 19.5;
  padding:9px; border-radius:30px;
  background:linear-gradient(160deg,#fff,#dff3fb);
  border:3px solid var(--c-blue-soft);
  box-shadow:0 16px 34px rgba(89,191,228,.35);
  transform:rotate(-2deg);
  transition:transform .3s ease, box-shadow .3s ease;
}
.phone::before{   /* 上のノッチ */
  content:""; position:absolute; top:14px; left:50%; transform:translateX(-50%);
  width:52px; height:7px; border-radius:999px; background:var(--c-blue-soft); z-index:2;
}
.phone:hover{ transform:rotate(0deg) translateY(-6px); box-shadow:0 22px 44px rgba(89,191,228,.45); }
.phone img{
  width:100%; height:100%; object-fit:cover;
  border-radius:22px; background:var(--c-blue-pale);
}

.wall__body{ flex:1 1 240px; min-width:0; }
.wall__badge{
  display:inline-block; font-size:11.5px; font-weight:700; color:#fff;
  background:linear-gradient(135deg,var(--c-blue),#7fd6ef);
  border-radius:999px; padding:3px 14px;
}
.wall__label{
  margin-top:8px; font-size:clamp(18px,2.6vw,24px); font-weight:900;
  color:var(--c-blue-deep); line-height:1.4;
}
.wall__date{ font-size:12.5px; color:var(--c-text-thin); }
.wall__size{ font-size:12px; color:var(--c-text-thin); margin-top:2px; }
.wall__dl{
  display:inline-flex; align-items:center; gap:9px; margin-top:16px;
  padding:14px 32px; border-radius:999px;
  font-weight:700; font-size:15px; color:#fff;
  background:linear-gradient(135deg,var(--c-blue) 0%,#7fd6ef 100%);
  box-shadow:0 8px 20px rgba(89,191,228,.45);
  transition:transform .2s ease;
}
.wall__dl::before{ content:""; flex:0 0 auto; width:17px; height:17px;
  background:var(--ic-phone) center/contain no-repeat; }
.wall__dl:hover{ transform:translateY(-3px); }

/* これまでのぶん */
.wallPast{ margin-top:34px; padding-top:24px; border-top:2px dashed var(--c-blue-soft); }
.wallPast__title{
  text-align:center; font-size:13px; font-weight:700; color:var(--c-blue-deep);
  margin-bottom:16px;
}
.wallPast__title::before{ content:""; display:inline-block; width:13px; height:13px;
  vertical-align:-2px; margin-right:6px; background:var(--ic-star) center/contain no-repeat; }
.wallPast__grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(116px,1fr));
  gap:clamp(12px,2vw,20px); justify-items:center;
}
.wallMini{ display:block; width:100%; max-width:130px; text-align:center; }
.wallMini__frame{
  position:relative; width:100%; aspect-ratio:9 / 19.5;
  padding:5px; border-radius:16px;
  background:#fff; border:2px solid var(--c-blue-soft);
  box-shadow:var(--shadow-s);
  transition:transform .25s ease, border-color .25s ease;
}
.wallMini__frame img{ width:100%; height:100%; object-fit:cover; border-radius:11px; background:var(--c-blue-pale); }
.wallMini:hover .wallMini__frame{ transform:translateY(-5px); border-color:var(--c-yellow); }
.wallMini__label{ margin-top:7px; font-size:11.5px; font-weight:700; color:var(--c-blue-deep); line-height:1.4; }
.wallMini__date{ font-size:10.5px; color:var(--c-text-thin); }

@media (max-width:560px){
  .wall{ flex-direction:column; text-align:center; }
  .wall__body{ flex:1 1 auto; }
  .wallPast__grid{ grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); }
}

/* =========================================================
   CONTACT
   ========================================================= */
.contact{
  display:grid; grid-template-columns:190px 1fr; align-items:center;
  gap:clamp(16px,3.5vw,36px);
}
.contact__chibi{ width:100%; filter:drop-shadow(0 10px 18px rgba(89,191,228,.3)); }
.contact__lead{ font-size:15px; }
.contact__links{ display:flex; flex-wrap:wrap; gap:12px; margin-top:18px; }
.contactBtn{
  display:inline-flex; align-items:center; gap:10px;
  padding:12px 22px; border-radius:999px; font-weight:700; font-size:14px;
  background:var(--c-blue-pale); color:var(--c-blue-deep);
  border:2px solid var(--c-blue-soft);
  transition:transform .2s ease, background .2s ease, color .2s ease;
}
.contactBtn svg{ width:18px; height:18px; fill:currentColor; }
.contactBtn:hover{ transform:translateY(-3px); background:var(--c-blue); color:#fff; border-color:var(--c-blue); }
.contactBtn--static{ cursor:default; }
.contactBtn--static:hover{ transform:none; background:var(--c-blue-pale); color:var(--c-blue-deep); }

/* =========================================================
   フッター（落ちた星が積もる）
   ========================================================= */
.footer{
  position:relative; text-align:center; padding:70px 20px 44px; overflow:hidden;
  /* 白いロゴが沈まないように、下にいくほど水色を濃くする */
  background:linear-gradient(180deg, rgba(230,247,253,0) 0%, rgba(182,230,246,.75) 45%, rgba(126,203,232,.9) 100%);
}
.footer__pile{ position:absolute; inset:auto 0 0 0; height:70px; pointer-events:none; }
.footer__pile span{
  position:absolute; bottom:0;
  background:var(--ic-star) center/contain no-repeat;
  filter:drop-shadow(0 2px 3px rgba(89,191,228,.35));
}
.footer__pile span.w{ background-image:var(--ic-star-white); }
.footer__pile span.s{ background-image:var(--ic-sparkle); }
.footer__icon{
  position:relative; width:72px; height:72px; margin:0 auto 12px; border-radius:50%;
  border:3px solid #fff; box-shadow:var(--shadow-s); object-fit:cover;
}
.footer__logo{
  position:relative; width:min(300px,70vw); height:auto; margin:0 auto;
  filter:drop-shadow(0 3px 8px rgba(47,143,184,.45));
}
.footer__mark{ position:relative; font-size:15px; margin-top:2px; }
.footer__copy{ position:relative; margin-top:8px; font-size:12px; color:var(--c-text-thin); }

.toTop{
  position:fixed; right:18px; bottom:18px; z-index:40;
  width:52px; height:52px; border-radius:50%;
  display:grid; place-items:center;
  background-color:#fff; box-shadow:var(--shadow);
  background-image:var(--ic-star);
  background-size:22px 22px; background-position:center; background-repeat:no-repeat;
  border:2px solid var(--c-blue-soft);
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .3s, transform .3s, visibility .3s;
}
.toTop.is-show{ opacity:1; visibility:visible; transform:translateY(0); }
.toTop:hover{ background-color:var(--c-yellow-soft); }

/* =========================================================
   レスポンシブ
   ========================================================= */
@media (max-width:1100px){
  .hang--left, .hang--right{ margin-left:auto; margin-right:auto; }
}

/* 項目が多いので、狭い画面ではタグを詰めてアイコンに重ならないようにする */
@media (max-width:1000px){
  .hangNav{ gap:6px; }
  .hangNav__tag{ font-size:11px; padding:5px 11px; letter-spacing:.02em; }
  .hangNav__tag b{ display:none; }
}

@media (max-width:860px){
  :root{ --ceiling-h:88px; }

  .navToggle{ display:flex; }
  .hangNav{
    position:fixed; top:26px; left:0; right:0;
    flex-direction:column; align-items:center; gap:0;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
    padding:14px 0 20px; border-bottom:2px solid var(--c-blue-soft);
    box-shadow:0 18px 30px rgba(89,191,228,.2);
    transform:translateY(-150%); transition:transform .35s ease;
  }
  .hangNav.is-open{ transform:translateY(0); }
  .hangNav__item{ animation:none; width:100%; }
  .hangNav__cord{ height:12px !important; }
  .hangNav__tag{ font-size:14px; padding:9px 22px; }

  .profile{ grid-template-columns:1fr; }
  .flip{ max-width:320px; margin:0 auto 30px; }

  .contact{ grid-template-columns:1fr; text-align:center; }
  .contact__chibi{ max-width:170px; margin:0 auto; }
  .contact__links{ justify-content:center; }

  .tanzaku__paper{ grid-template-columns:auto auto; row-gap:6px; padding:14px 18px; }
  .tanzaku__text{ grid-column:1 / -1; }

  .hero__chibi--1{ left:-14%; }
  .hero__chibi--2{ right:-12%; }
}

@media (max-width:560px){
  .miniPlate{ width:calc(50% - 8px); }
  .miniPlate__body{ min-width:0; width:100%; padding:13px 8px 15px; }
  .miniPlate__big{ font-size:14.5px; }
  .plates__rail{ display:none; }
  .ornament{ width:88px; }
  .ornament__ball{ width:64px; height:64px; }
  .ornament__ball svg{ width:26px; height:26px; }
  .ornaments__rail{ display:none; }
  .profile__list div{ grid-template-columns:96px 1fr; padding:10px 14px; font-size:14px; }
  .lightbox{ padding:12px; gap:4px; }
  .lightbox__close,.lightbox__nav{ width:40px; height:40px; font-size:22px; }
  .hang__board{ padding:24px 16px 28px; }
}

/* タッチ端末：ベルトは自動で流さず、指でスクロール */
@media (hover:none){
  .belt{ overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; }
  .belt__track{ animation:none; }
  .hangPic{ scroll-snap-align:center; }
}

/* アニメーションを減らす設定の人向け */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .fstar,
  .ceiling__home, .hangNav__item, .plate, .hero__visual, .hero__chibi, .hero__clip,
  .hangTag, .hang, .tanzaku__item, .miniPlate, .ornament, .hangPic,
  .belt__track, .mobile__item, .mobile__star, .dropTarget.is-in{
    animation:none !important;
  }
  .fstar{ opacity:.5; }
  .dropTarget{ opacity:1; }
  .belt{ overflow-x:auto; }

  /* 立ち絵カードは動かさず、切り替えだけ効くようにする */
  .flip__inner{ transition:none; }
  .flip__hint, .flip__hintIcon, .flip::after{ animation:none !important; }

  /* ロード画面は動かさない（表示・非表示だけ） */
  .loader__inner, .loader__hang, .loader__star, .loader__text, .loader__bar span{
    animation:none !important;
  }
  .loader{ transition:none; }
}