/* 写真枠の基本（本番でも必要。以前は review.css にあった） */
html,body{height:auto!important}
.islot{position:relative;width:100%;overflow:hidden;background:#e9e6df}
.islot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* ヘッダーは写真の演出より常に手前 */
header{position:relative;z-index:50}
/* 参陽商会 motion v04 — ロゴの「ティック（短い線）」をモチーフにした穏やかな動き＋演出表 v01 のスクロール演出
   隠すためのクラス（mv-f / mv-m / mv-c / mv-l …）はすべて motion.js が付ける。スクリプトが動かなければ何も隠れない。
   v04.1：transition は「出るとき（.mv-in）」側だけに書く。隠す瞬間は即時（見えていた物が消えてから出る逆再生を防ぐ） */
/* スマホでは PC 画面の縮小表示にする（Chrome 等の文字自動拡大を止める）［QA Q-01］ */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:root{--mv-ez:cubic-bezier(.16,1,.3,1);--mv-eo:cubic-bezier(.2,.7,.2,1)}

/* ---------- 既存（v03から維持） ---------- */
.mv-tickbar{clip-path:inset(-20px 100% -20px 0)}
.mv-tickbar.mv-in{clip-path:inset(-20px 0 -20px 0);transition:clip-path .9s cubic-bezier(.6,.05,.25,1)}
.mv-kb img{animation:mv-kb 10s cubic-bezier(.2,.6,.2,1) both}
@keyframes mv-kb{from{transform:scale(1.08)}to{transform:scale(1)}}
.mv-spin{transform-origin:50% 50%;animation:mv-spin 90s linear infinite}
.mv-spin-slow{transform-origin:50% 50%;animation:mv-spin 160s linear infinite}
@keyframes mv-spin{to{transform:rotate(360deg)}}
.mv-ring line{transition:opacity .5s ease}
.mv-ring.mv-pre line{opacity:0}
canvas.mv-sway{position:absolute;left:0;width:100%;pointer-events:none;display:block}
.mv-swayhost{overflow:visible!important}
.mv-herotick{position:absolute;left:0;right:0;bottom:0;height:52px;pointer-events:none;z-index:2}
canvas.mv-wave{position:absolute;left:0;bottom:0;width:100%;pointer-events:none;display:block}

/* ---------- 01 フェードイン／03 スタッガーの各項目／白カード（01・24px版）／02 スライドイン ----------
   移動は transform ではなく個別プロパティ translate を使い、要素がもともと持つ transform と競合させない */
.mv-f{opacity:0;translate:0 var(--mv-dy,12px)}
.mv-f:not(.mv-in){opacity:0!important}   /* インラインの opacity（例 .95）があっても隠す。mv-in 後はインラインの値へフェード */
.mv-f.mv-sl{translate:var(--mv-dx,24px) 0}
.mv-f.mv-in{opacity:1;translate:0 0;transition:opacity var(--mv-dur,.7s) var(--mv-eo),translate var(--mv-dur,.7s) var(--mv-ez)}

/* ---------- 05 マスクリビール（clip-path を開く向きに＋内側の写真 1.06→1） ---------- */
.mv-m.mv-ml{clip-path:inset(-40px 100% -40px 0)}
.mv-m.mv-mr{clip-path:inset(-40px 0 -40px 100%)}
.mv-m.mv-mu{clip-path:inset(100% -40px -40px -40px)}
.mv-m.mv-in{clip-path:inset(-40px -40px -40px -40px);transition:clip-path var(--mv-dur,1s) var(--mv-ez)}
.mv-m.mv-z img{scale:1.06}
.mv-m.mv-z.mv-in img{scale:1;transition:scale 1.2s var(--mv-ez)}

/* ---------- 04 テキストリビール（欧文＝1字ずつ／日本語＝行ごと。マスクの中からせり上がる） ---------- */
.mv-w{display:inline-block;white-space:nowrap;clip-path:inset(-.35em -.25em -.3em -.25em)}
.mv-ch{display:inline-block;translate:0 110%;opacity:0}
.mv-c.mv-in .mv-ch{translate:0 0;opacity:1;transition:translate .7s var(--mv-ez),opacity .7s var(--mv-ez);transition-delay:var(--mv-cd,0ms)}
.mv-ln{display:block;clip-path:inset(-1em -1em 0 -1em)}
.mv-lni{display:block;translate:0 100%}
.mv-l.mv-in .mv-lni{translate:0 0;transition:translate .8s var(--mv-ez);transition-delay:var(--mv-ld,0ms)}
.mv-done .mv-w,.mv-done .mv-ln,.mv-m.mv-done{clip-path:none}

/* ---------- 13 SVGラインドロー（世界地図：大陸 → 航路 → 港ドット） ---------- */
.mv-map .mv-land{opacity:0}
.mv-map .mv-route{stroke-dasharray:1 1;stroke-dashoffset:1}
.mv-map .mv-dot{opacity:0}
.mv-map.mv-in .mv-land{opacity:1;transition:opacity .6s var(--mv-eo)}
.mv-map.mv-in .mv-route{stroke-dashoffset:0;transition:stroke-dashoffset 1.6s cubic-bezier(.33,1,.68,1) .3s}
.mv-map.mv-in .mv-dot{opacity:1;transition:opacity .5s var(--mv-eo) var(--mv-dd,1.9s)}

/* ---------- 13 署名上のティック帯（背景のティックを左から引き、署名を 01 で） ---------- */
.mv-sig{position:relative;background-image:none!important}
.mv-sigbar{position:absolute;left:0;top:0;width:100%;height:7px;pointer-events:none;clip-path:inset(0 100% 0 0)}
.mv-sig>:not(.mv-sigbar){opacity:0;translate:0 12px}
.mv-sig.mv-in .mv-sigbar{clip-path:inset(0 0 0 0);transition:clip-path .9s cubic-bezier(.6,.05,.25,1)}
.mv-sig.mv-in>:not(.mv-sigbar){opacity:1;translate:0 0;transition:opacity .7s var(--mv-eo) .35s,translate .7s var(--mv-ez) .35s}

/* ---------- 動きを減らす設定：すべて静止・最終状態 ---------- */
@media (prefers-reduced-motion:reduce){
 .mv-f,.mv-f:not(.mv-in),.mv-m,.mv-tickbar,.mv-ch,.mv-lni,.mv-sig>*,.mv-sigbar,.mv-map *{opacity:1!important;translate:none!important;clip-path:none!important;transition:none!important}
 .mv-m img{scale:none!important}
 .mv-map .mv-route{stroke-dashoffset:0!important}
 .mv-kb img,.mv-spin,.mv-spin-slow{animation:none!important}
}