@charset "utf-8";

/* ==========================================================================
   EC-CUBE 既存カスタマイズ用CSS（絶対に書き換えない領域）
   ========================================================================== */

.ec-eyecatchRole__image img{
    width:100% !important;
    max-width:700px;
    height:auto !important;
    display:block;
}

.ec-eyecatchRole{
    display:flex;
    align-items:center;
    gap:60px;
}

.ec-eyecatchRole__intro{
    width:45%;
}

.ec-topicRole__list{
    display:flex;
    gap:20px;
    justify-content:space-between;
    flex-wrap:nowrap;
}

.ec-topicRole__listItem{
    width:32%;
}

.ec-topicRole__listItem img{
    width:100%;
    border-radius:20px;
    display:block;
}

/* SUNIVA ヘッダー検索BOX */
.ec-headerSearch{
    border-radius:999px;
}

.ec-headerSearch .ec-select select{
    background:#EAF7EC !important;
    color:#4E7F5A !important;
    border:none !important;
    border-radius:999px 0 0 999px !important;
}

.ec-headerSearch .ec-input input{
    background:#ffffff !important;
    border:1px solid #DDEADD !important;
    border-left:none !important;
    border-radius:0 !important;
}

.ec-headerSearch__keywordBtn{
    background:#ffffff !important;
    border:1px solid #DDEADD !important;
    border-left:none !important;
    border-radius:0 999px 999px 0 !important;
}

.ec-headerSearch__keywordBtn img{
    opacity:.55;
}

.ec-headerSearch{
max-width:320px;
transform:scale(.92);
transform-origin:left center;
}

/* SUNIVA ロゴ周り余白調整 */
.ec-headerRole{
    margin-top:20px !important;
    margin-bottom:20px !important;
}

.ec-headerTitle__title h1{
    margin:0 !important;
}

.ec-headerTitle__title img{
    width:380px !important;
    max-width:80% !important;
}

/* カテゴリナビを少し上へ */
.ec-categoryNaviRole{
    margin-top:10px !important;
    margin-bottom:18px !important;
}

/* SUNIVA スライダー演出 */
.main_visual .slick-slide img{
    transform:scale(1);
    transition:transform 7s ease;
}

.main_visual .slick-active img{
    transform:scale(1.05);
}

/* ページトップボタン SUNIVA化 */
.ec-blockTopBtn a{
    background:linear-gradient(135deg,#9EDBB2 0%,#7CCB97 100%) !important;
    color:#fff !important;
    border-radius:999px !important;
    box-shadow:0 8px 24px rgba(124,203,151,.28);
    border:none !important;
}

.ec-blockTopBtn a:hover{
    transform:translateY(-2px);
    opacity:.92;
}

.suniva-wrap{
max-width:1100px;
margin:auto;
padding:30px;
}

.card{
background:#fff;
border-radius:20px;
padding:25px;
margin-bottom:20px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
border:1px solid #eee;
}

.card h3{
font-size:38px;
margin-bottom:10px;
}

.card p{
color:#666;
margin-bottom:20px;
}

.card button{
width:60px;
height:60px;
font-size:30px;
border:none;
border-radius:50%;
background:#f2f2f2;
cursor:pointer;
}

.card span{
display:inline-block;
width:80px;
text-align:center;
font-size:30px;
font-weight:bold;
}

.fixed-bar{
position:sticky;
bottom:0;
background:white;
padding:25px;
box-shadow:0 -10px 30px rgba(0,0,0,.1);
text-align:center;
margin-top:40px;
border-radius:20px;
}

.fixed-bar button{
background:#2d6cff;
color:white;
border:none;
padding:20px 50px;
font-size:24px;
border-radius:50px;
margin-top:20px;
}

.counter{
display:flex;
align-items:center;
gap:20px;
justify-content:center;
margin-top:20px;
}

.counter button{
width:60px;
height:60px;
border-radius:999px;
background:#f5f5f5;
font-size:30px;
}

.counter span{
font-size:30px;
font-weight:bold;
width:80px;
text-align:center;
}

.suniva-wrap .card{
background:#fff !important;
padding:30px !important;
margin-bottom:30px !important;
border-radius:25px !important;
box-shadow:0 10px 35px rgba(0,0,0,.08) !important;
border:1px solid #eee !important;
}

.suniva-wrap .card h3{
font-size:46px !important;
margin-bottom:15px !important;
}

.suniva-wrap .counter{
display:flex !important;
align-items:center !important;
gap:20px !important;
margin-top:25px !important;
}

.suniva-wrap .counter button{
width:56px !important;
height:56px !important;
border-radius:999px !important;
border:none !important;
font-size:28px !important;
background:#f2f2f2 !important;
}

.suniva-wrap .counter span{
font-size:32px !important;
font-weight:bold !important;
width:60px !important;
text-align:center !important;
}

.fixed-bar{
position:sticky !important;
bottom:0 !important;
background:white !important;
padding:25px !important;
border-radius:25px !important;
box-shadow:0 -10px 30px rgba(0,0,0,.08) !important;
}

.suniva-menu-wrap{
    padding:28px 22px 34px;
    background:linear-gradient(180deg,#ffffff 0%,#f7fff4 45%,#eefbea 100%);
}

.suniva-menu-logo{
    text-align:center;
    padding:18px 0 26px;
}

.suniva-menu-logo h2{
    font-size:28px;
    letter-spacing:.16em;
    color:#314a42;
    margin:0 0 10px;
}

.suniva-menu-logo p{
    font-size:13px;
    line-height:1.9;
    color:#6b7d70;
}

.suniva-menu-list a{
    display:block;
    position:relative;
    padding:16px 16px 16px 20px;
    margin-bottom:10px;
    background:rgba(255,255,255,.82);
    border:1px solid rgba(120,170,130,.18);
    border-radius:18px;
    color:#263b34;
    text-decoration:none;
    font-size:16px;
    box-shadow:0 8px 24px rgba(80,120,90,.06);
}

.suniva-menu-list a span{
    display:block;
    margin-top:5px;
    font-size:12px;
    color:#7a8b80;
    line-height:1.5;
}

.suniva-menu-list a:before{
    content:"";
    position:absolute;
    left:0;
    top:18px;
    width:4px;
    height:34px;
    border-radius:999px;
    background:linear-gradient(180deg,#b9e7a3,#6ec7a5);
}

/* SUNIVA footer */
.ec-footerRole {
    background:linear-gradient(180deg,#F8FFF8 0%,#EEF9F0 28%,#DFF3E4 68%,#CFE8D5 100%) !important;
    padding: 70px 20px 50px !important;
}

.ec-footerRole__inner,
.ec-footerTitle,
.ec-footerTitle *,
.ec-footerNavi,
.ec-footerNavi__link {
    opacity: 1 !important;
    color:#4E7F5A !important;
}

.ec-footerNavi__link a {
    color: #123B28 !important;
    opacity: 1 !important;
    font-weight: 800 !important;
    text-decoration: underline !important;
    text-underline-offset: 6px !important;
}

.ec-footerNavi__link a:hover {
    color: #1F8F4D !important;
}

.ec-footerTitle__copyright,
.ec-footerRole__copyright {
    color: #6E8D76 !important;
    opacity: 1 !important;
}

/* 🌱 SUNIVA ボタン統一デザイン */
.ec-blockBtn--action,
.ec-blockBtn--cancel,
button.ec-blockBtn--action,
button.ec-blockBtn--cancel,
a.ec-blockBtn--action,
a.ec-blockBtn--cancel,
button[type="submit"],
.ec-inlineBtn,
.ec-cartButton,
.ec-cartRole__actions a,
.ec-cartRole__actions button {
    background: linear-gradient(135deg,#6BB37B 0%,#4E8D5D 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow:0 10px 30px rgba(78,141,93,.22) !important;
    transition: all .25s ease !important;
    font-weight: 700 !important;
    letter-spacing: .03em !important;
}

.ec-blockBtn--action:hover,
button[type="submit"]:hover {
    transform: translateY(-2px);
    opacity: .93;
    box-shadow:0 14px 34px rgba(78,141,93,.28) !important;
}

a.ec-blockBtn--cancel,
button.ec-blockBtn--cancel,
.ec-blockBtn--cancel {
    background: linear-gradient(135deg,#EEF8F0 0%,#DFF0E3 100%) !important;
    background-color:#EEF8F0 !important;
    color: #4E7F5A !important;
    border: 1px solid #D3E6D7 !important;
    box-shadow:0 8px 24px rgba(78,141,93,.08) !important;
}

.counter button,
.ec-numberInput button {
    border-radius: 999px !important;
    background: #EEF7F0 !important;
    color: #4E7F5A !important;
    border: none !important;
}

.ec-inlineBtn {
    padding: 10px 18px !important;
    border-radius: 999px !important;
}

/* スマホナビ横ズレ修正 */
@media (max-width: 768px) {
    html, body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }
    .ec-layoutRole,
    .ec-layoutRole__header,
    .ec-layoutRole__contents {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    .suniva-mega-nav {
        width: 100vw !important;
        max-width: 100vw !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        box-sizing: border-box !important;
        padding: 10px 14px !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .suniva-mega-nav::-webkit-scrollbar { display: none !important; }
    .suniva-mega-nav .suniva-item,
    .suniva-mega-nav .suniva-main-link { flex: 0 0 auto !important; white-space: nowrap !important; }
}

/* スマホヘッダー強制修正 */
@media (max-width: 768px) {
    .ec-layoutRole__header {
        width: 100vw !important;
        max-width: 100vw !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }
    .ec-layoutRole__header nav,
    .ec-layoutRole__header ul,
    .ec-layoutRole__header .ec-categoryNaviRole,
    .ec-layoutRole__header .ec-categoryNaviRole ul,
    .ec-layoutRole__header .ec-categoryNaviRole__list {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 !important;
        transform: none !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        padding: 0 12px !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .ec-layoutRole__header nav::-webkit-scrollbar,
    .ec-layoutRole__header ul::-webkit-scrollbar,
    .ec-layoutRole__header .ec-categoryNaviRole::-webkit-scrollbar,
    .ec-layoutRole__header .ec-categoryNaviRole ul::-webkit-scrollbar { display: none !important; }
    .ec-layoutRole__header li,
    .ec-layoutRole__header a,
    .ec-layoutRole__header .ec-categoryNaviRole__listItem { flex: 0 0 auto !important; white-space: nowrap !important; float: none !important; }
}

/* ==========================================================================
   🌏 SUNIVA WORLD - Phase2 新画面ゲームステージ＆共通アセットアライメント
   ========================================================================== */
.suniva-world-stage {
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 430px !important;
    height: 100vh !important;
    min-height: 760px !important;
    margin: 0 auto !important;
    border-radius: 32px !important;
}

.suniva-layer {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
}

/* ⑤ 指示項目: z-indexをポータル20、プレイヤー30へ修正 */
.suniva-bg-layer          { z-index: 1 !important; }
.suniva-portal-layer      { z-index: 20 !important; pointer-events: auto !important; } /* 修正: 20 */
.suniva-world-player-layer { z-index: 30 !important; } /* 修正: 30 */
.suniva-effect-layer      { z-index: 40 !important; }
.suniva-ui-layer          { z-index: 50 !important; pointer-events: auto !important; }

.suniva-world-bg-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* 主人公待機アニメーション */
.suniva-world-player-layer {
    position: absolute !important;
    left: 50% !important;
    bottom: -40px !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

.suniva-world-player-img {
    width: 260px !important;
    height: auto !important;
    display: block !important;
    transform-origin: center bottom !important;
    animation: sunivaPlayerIdle 4s ease-in-out infinite !important;
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .28)) !important;
}

@keyframes sunivaPlayerIdle {
    0%   { transform: translateY(0) rotate(0deg) scale(1); }
    25%  { transform: translateY(-4px) rotate(-0.8deg) scale(1.01); }
    50%  { transform: translateY(0) rotate(0deg) scale(1); }
    75%  { transform: translateY(-3px) rotate(0.8deg) scale(1.01); }
    100% { transform: translateY(0) rotate(0deg) scale(1); }
}

/* 強化版デバッグモニターHUD */
.suniva-gps-debug-hud {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    background: rgba(0, 0, 0, 0.85) !important;
    color: #00ff66 !important;
    font-family: monospace !important;
    font-size: 11px !important;
    padding: 12px !important;
    border-radius: 10px !important;
    border: 2px solid #00ff66 !important;
    pointer-events: none !important;
    box-shadow: 0 6px 16px rgba(0,0,0,0.6) !important;
    line-height: 1.4 !important;
    min-width: 200px !important;
    z-index: 9999 !important;
}
.suniva-gps-debug-hud .hud-title {
    font-weight: bold !important;
    border-bottom: 1px solid #00ff66 !important;
    padding-bottom: 4px !important;
    margin-bottom: 6px !important;
    color: #ffffff !important;
    display: flex !important;
    justify-content: space-between !important;
}
.suniva-gps-debug-hud.error { color: #ff3333 !important; border-color: #ff3333 !important; }
.hud-alert-row { background: rgba(255, 51, 51, 0.2) !important; padding: 4px !important; border-radius: 4px !important; margin-top: 4px !important; word-break: break-all !important; }

/* 🌸 Layer2: ポータル配置用追加スタイル */
.suniva-portal-container {
    position: absolute !important;
    top: 35% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.8) !important;
}
.suniva-portal-icon { font-size: 32px !important; animation: portalFloat 3s ease-in-out infinite alternate !important; }
.suniva-portal-name { font-size: 14px !important; font-weight: bold !important; margin-top: 4px !important; background: rgba(0,0,0,0.5) !important; padding: 2px 8px !important; border-radius: 12px !important; white-space: nowrap !important; }
.suniva-portal-distance { font-size: 12px !important; margin-top: 2px !important; background: #4E8D5D !important; padding: 1px 8px !important; border-radius: 10px !important; font-weight: bold !important; }
.suniva-portal-container.checkable .suniva-portal-distance { background: #ff3366 !important; animation: pulseCheckin 1s infinite alternate !important; }

/* 固定HTMLテスト用CSS */
.suniva-portal-test {
    position: absolute !important;
    top: 45% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: rgba(0, 0, 0, 0.7) !important;
    color: #ffcc00 !important;
    padding: 5px 12px !important;
    border-radius: 10px !important;
    font-weight: bold !important;
    font-size: 14px !important;
    z-index: 25 !important;
}

/* ==========================================================================
   🌸 SUNIVA WORLD - Phase2-8 ポータル・チェックインボタン最前面配置（CSS差分）
   ========================================================================== */

.suniva-portal-layer {
    position: absolute !important;
    inset: 0 !important;
    z-index: 80 !important;
    pointer-events: auto !important;
}

.suniva-portal-container {
    position: absolute !important;
    top: 45% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 90 !important;
    background: rgba(255,255,255,0.95) !important;
    padding: 12px 16px !important;
    border-radius: 16px !important;
    font-weight: bold !important;
    text-align: center !important;
    pointer-events: auto !important;
}

#sunivaCheckinBtn {
    position: relative !important;
    z-index: 100 !important;
    display: block !important;
}

/* ==========================================================================
   🌸 SUNIVA WORLD - Phase2-8 UIレイヤー固定マウント専用スタイル
   ========================================================================== */
.suniva-ui-layer {
    position: absolute !important;
    inset: 0 !important;
    z-index: 9999 !important;
    pointer-events: none !important;
}

.suniva-checkin-mount {
    position: absolute !important;
    left: 50% !important;
    bottom: 120px !important;
    transform: translateX(-50%) !important;
    z-index: 10000 !important;
    pointer-events: auto !important;
}

#sunivaCheckinBtn {
    display: block !important;
    padding: 12px 28px !important;
    border-radius: 999px !important;
    border: none !important;
    background: linear-gradient(135deg,#ff5e62,#ff9966) !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 16px !important;
    box-shadow: 0 6px 16px rgba(255,94,98,.45) !important;
    cursor: pointer !important;
}

.suniva-checkin-mount {
    position: absolute !important;
    left: 50% !important;
    bottom: 120px !important;
    transform: translateX(-50%) !important;
    z-index: 99999 !important;
    pointer-events: auto !important;
}

#sunivaCheckinBtn {
    display: block !important;
    padding: 14px 30px !important;
    border-radius: 999px !important;
    border: none !important;
    background: #ff5e62 !important;
    color: white !important;
    font-weight: bold !important;
    font-size: 16px !important;
}
/* 1/1 ここから チェックインボタン押下許可 */
.suniva-checkin-mount,
#sunivaCheckinMount,
#sunivaCheckinBtn {
    pointer-events: auto !important;
}

#sunivaCheckinMount {
    position: absolute !important;
    left: 50% !important;
    bottom: 120px !important;
    transform: translateX(-50%) !important;
    z-index: 10000 !important;
}

#sunivaCheckinBtn {
    border: none !important;
    border-radius: 999px !important;
    padding: 14px 28px !important;
    background: linear-gradient(135deg, #ff6b9a, #ff9966) !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    box-shadow: 0 10px 24px rgba(255, 92, 130, .35) !important;
    cursor: pointer !important;
}
/* 1/1 ここまで */
/* SUNIVA ARRIVAL EXPERIENCE 20260726 */
.suniva-portal-container.checkable {
    filter:
        drop-shadow(0 0 12px rgba(255, 222, 125, .95))
        drop-shadow(0 0 30px rgba(218, 169, 62, .72));
    animation:
        sunivaArrivalLight 1.4s
        ease-in-out infinite alternate;
}

.suniva-portal-container.checkable
.suniva-portal-distance {
    color: #3a2b11 !important;
    background:
        linear-gradient(
            135deg,
            #fff8d8,
            #e8bd54
        ) !important;
    box-shadow:
        0 0 0 5px rgba(255,255,255,.38),
        0 0 28px rgba(230,183,75,.72) !important;
}

#sunivaCheckinMount {
    position: absolute !important;
    right: 18px !important;
    bottom:
        max(
            112px,
            calc(env(safe-area-inset-bottom) + 94px)
        ) !important;
    left: 18px !important;
    z-index: 100000 !important;
    width: auto !important;
    transform: none !important;
    pointer-events: none !important;
}

#sunivaCheckinBtn {
    display: block !important;
    width: 100% !important;
    min-height: 58px !important;
    padding: 14px 22px !important;
    border: 1px solid rgba(201,151,45,.72) !important;
    border-radius: 999px !important;
    color: #3c2b0d !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    background:
        linear-gradient(
            135deg,
            #fff9df,
            #e9bd52
        ) !important;
    box-shadow:
        0 15px 38px rgba(148,104,23,.28),
        0 0 24px rgba(255,223,132,.55) !important;
    pointer-events: auto !important;
}

#sunivaCheckinBtn:disabled {
    color: #817a70 !important;
    border-color: rgba(255,255,255,.66) !important;
    background:
        rgba(255,255,255,.82) !important;
    box-shadow:
        0 12px 30px rgba(31,58,63,.12) !important;
    cursor: default !important;
}

@keyframes sunivaArrivalLight {
    from {
        transform:
            translate(-50%, -50%)
            scale(1);
    }

    to {
        transform:
            translate(-50%, -50%)
            scale(1.035);
    }
}

@media (max-width: 767px) {
    #sunivaCheckinMount {
        right: 16px !important;
        bottom:
            max(
                108px,
                calc(env(safe-area-inset-bottom) + 88px)
            ) !important;
        left: 16px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .suniva-portal-container.checkable {
        animation: none !important;
    }
}
/* =========================================
   SUNIVA PORTAL BUKEYASHIKI V1
========================================= */

.suniva-world-bg-img {
    object-position: center center !important;
    filter:
        saturate(.96)
        contrast(1.02)
        brightness(.94) !important;
}

/*
 * 背景画像に描かれた門の木製看板へ
 * 動的なポータル名を重ねる。
 */
.suniva-portal-container {
    top: 60.2% !important;
    z-index: 24 !important;
    width: min(48vw, 210px) !important;
    transform: translate(-50%, -50%) !important;
    text-align: center !important;
    pointer-events: none !important;
}

.suniva-portal-title {
    display: -webkit-box !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 34px !important;
    max-height: 42px !important;
    margin: 0 !important;
    padding: 4px 10px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #f7dda0 !important;
    font-family:
        "Yu Mincho",
        "Hiragino Mincho ProN",
        "Noto Serif JP",
        serif !important;
    font-size: clamp(11px, 3.2vw, 16px) !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    letter-spacing: .04em !important;
    text-align: center !important;
    white-space: normal !important;
    text-shadow:
        0 1px 1px rgba(0,0,0,.96),
        0 2px 4px rgba(0,0,0,.92),
        0 0 8px rgba(201,151,45,.28) !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

.suniva-portal-distance {
    display: inline-block !important;
    width: auto !important;
    max-width: min(74vw, 300px) !important;
    margin-top: 9px !important;
    padding: 5px 12px !important;
    border: 1px solid rgba(255,255,255,.34) !important;
    border-radius: 999px !important;
    background: rgba(18,43,39,.78) !important;
    color: #fff !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    box-shadow: 0 5px 15px rgba(0,0,0,.18) !important;
    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

.suniva-portal-container.checkable
.suniva-portal-distance {
    border-color: rgba(255,226,133,.72) !important;
    background:
        linear-gradient(
            135deg,
            rgba(174,45,85,.92),
            rgba(214,89,92,.92)
        ) !important;
    box-shadow:
        0 0 22px rgba(255,121,145,.35) !important;
}

@media (min-width: 768px) {
    .suniva-portal-container {
        top: 60.5% !important;
        width: min(29vw, 260px) !important;
    }

    .suniva-portal-title {
        min-height: 42px !important;
        max-height: 50px !important;
        padding: 5px 14px !important;
        font-size: clamp(14px, 1.55vw, 20px) !important;
    }
}


/* =========================================
   SUNIVA PORTAL NAMEPLATE V2
========================================= */

/* 従来の名称だけを隠し、到着案内は残す */
body
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-container
.suniva-portal-title {
    display: none !important;
}

/* 画像内の木製看板へ重ねる動的名称 */
body
.suniva-world-stage
.suniva-portal-nameplate {
    position: absolute !important;
    top: 54.4% !important;
    left: 50% !important;
    z-index: 25 !important;
    display: -webkit-box !important;
    align-items: center !important;
    justify-content: center !important;
    width: min(41vw, 184px) !important;
    min-height: 29px !important;
    max-height: 38px !important;
    margin: 0 !important;
    padding: 3px 9px !important;
    overflow: hidden !important;
    transform: translate(-50%, -50%) !important;
    color: #f7dda0 !important;
    font-family:
        "Yu Mincho",
        "Hiragino Mincho ProN",
        "Noto Serif JP",
        serif !important;
    font-size: clamp(11px, 3vw, 15px) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: .035em !important;
    text-align: center !important;
    text-shadow:
        0 1px 1px rgba(0,0,0,1),
        0 2px 4px rgba(0,0,0,.95),
        0 0 7px rgba(215,169,74,.32) !important;
    pointer-events: none !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

/* 門と看板が見えるように旅人を少し小さくする */
body
.suniva-world-stage
.suniva-world-player-layer
.suniva-world-player-img {
    width: min(46vw, 190px) !important;
}

/* 到着メッセージは従来位置を維持 */
body
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-container {
    top: 31% !important;
    width: auto !important;
}

body
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-container
.suniva-portal-distance {
    margin-top: 0 !important;
}

@media (min-width: 768px) {
    body
    .suniva-world-stage
    .suniva-portal-nameplate {
        top: 54.7% !important;
        width: min(25vw, 245px) !important;
        min-height: 38px !important;
        max-height: 48px !important;
        padding: 4px 13px !important;
        font-size: clamp(14px, 1.45vw, 19px) !important;
    }

    body
    .suniva-world-stage
    .suniva-world-player-layer
    .suniva-world-player-img {
        width: min(22vw, 220px) !important;
    }
}


/* =========================================
   SUNIVA PORTAL NAVIGATOR CENTER V4
========================================= */

/*
 * 親レイヤーの座標に依存させず、
 * 端末画面の中央へ直接配置する。
 */
html.suniva-world-page
#sunivaPortalNavigator.suniva-portal-navigator {
    position: fixed !important;
    top: max(
        112px,
        calc(env(safe-area-inset-top) + 92px)
    ) !important;
    right: auto !important;
    left: 50vw !important;
    z-index: 100003 !important;
    display: grid !important;
    grid-template-columns:
        42px minmax(0, 1fr) 42px !important;
    align-items: center !important;
    gap: 7px !important;
    box-sizing: border-box !important;
    width: min(
        calc(100vw - 32px),
        360px
    ) !important;
    min-width: 0 !important;
    max-width: 360px !important;
    margin: 0 !important;
    padding: 7px !important;
    overflow: hidden !important;
    transform: translateX(-50%) !important;
    border: 1px solid rgba(255,255,255,.52) !important;
    border-radius: 999px !important;
    background: rgba(20,42,57,.78) !important;
    box-shadow:
        0 10px 30px rgba(0,0,0,.20) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}

html.suniva-world-page
#sunivaPortalNavigator[hidden] {
    display: none !important;
}

html.suniva-world-page
#sunivaPortalNavigator
.suniva-portal-navigator__arrow {
    display: grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.14) !important;
    color: #fff !important;
    font-size: 27px !important;
    line-height: 1 !important;
}

html.suniva-world-page
#sunivaPortalNavigator
.suniva-portal-navigator__summary {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 2px 5px !important;
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    text-align: center !important;
}

html.suniva-world-page
#sunivaPortalCount,
html.suniva-world-page
#sunivaPortalSelectedName {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html.suniva-world-page
#sunivaPortalCount {
    margin-bottom: 2px !important;
    color: #f0d99d !important;
    font-size: 9px !important;
    letter-spacing: .06em !important;
}

html.suniva-world-page
#sunivaPortalSelectedName {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

/* コンパスと切替案内が重ならない配置 */
@media (max-width: 390px) {
    html.suniva-world-page
    #sunivaPortalNavigator.suniva-portal-navigator {
        top: max(
            118px,
            calc(env(safe-area-inset-top) + 98px)
        ) !important;
        width: calc(100vw - 24px) !important;
    }
}


/* =========================================
   SUNIVA PORTAL NAVIGATOR DIRECT V5
========================================= */

#sunivaPortalNavigator {
    position: fixed !important;
    top: max(
        112px,
        calc(env(safe-area-inset-top) + 92px)
    ) !important;
    right: 16px !important;
    left: 16px !important;
    z-index: 100003 !important;

    display: grid !important;
    grid-template-columns:
        42px minmax(0, 1fr) 42px !important;
    align-items: center !important;
    gap: 7px !important;

    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 360px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding: 7px !important;

    overflow: hidden !important;
    transform: none !important;

    border: 1px solid rgba(255,255,255,.52) !important;
    border-radius: 999px !important;
    background: rgba(20,42,57,.78) !important;
    box-shadow:
        0 10px 30px rgba(0,0,0,.20) !important;

    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}

#sunivaPortalNavigator[hidden] {
    display: none !important;
}

#sunivaPortalPrevious,
#sunivaPortalNext {
    display: grid !important;
    place-items: center !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.14) !important;
    color: #fff !important;
    font-size: 27px !important;
    line-height: 1 !important;
    transform: none !important;
}

#sunivaPortalSummary {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 2px 5px !important;
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    text-align: center !important;
    transform: none !important;
}

#sunivaPortalCount,
#sunivaPortalSelectedName {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#sunivaPortalCount {
    margin-bottom: 2px !important;
    color: #f0d99d !important;
    font-size: 9px !important;
    letter-spacing: .06em !important;
}

#sunivaPortalSelectedName {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}


/* =========================================
   SUNIVA PORTAL VISUAL FINISH V6
========================================= */

/*
 * 近隣ポータル案内を少し下げ、
 * コンパスの距離表示との重なりを解消
 */
#sunivaPortalNavigator {
    top: max(
        132px,
        calc(env(safe-area-inset-top) + 112px)
    ) !important;
}

/*
 * 画像に描かれた門中央の木製看板へ
 * ポータル名を正確に配置
 */
.suniva-world-stage
.suniva-portal-nameplate {
    position: absolute !important;
    top: 62.3% !important;
    left: 50% !important;
    z-index: 26 !important;

    display: -webkit-box !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;
    width: min(35vw, 150px) !important;
    min-height: 22px !important;
    max-height: 31px !important;
    margin: 0 !important;
    padding: 2px 7px !important;
    overflow: hidden !important;

    border: 0 !important;
    border-radius: 2px !important;
    background: transparent !important;

    color: #f4d68c !important;
    font-family:
        "Yu Mincho",
        "Hiragino Mincho ProN",
        "Noto Serif JP",
        serif !important;
    font-size: clamp(9px, 2.65vw, 13px) !important;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    letter-spacing: .02em !important;
    text-align: center !important;

    text-shadow:
        0 1px 1px rgba(0,0,0,1),
        0 2px 3px rgba(0,0,0,.96),
        0 0 7px rgba(212,162,60,.34) !important;

    transform: translate(-50%, -50%) !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

/*
 * 既存の屋根上ポータル名を確実に非表示
 */
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-title,
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-name {
    display: none !important;
}

/*
 * 到着案内をパールホワイトと淡いゴールドへ
 */
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-container {
    position: absolute !important;
    top: 31.5% !important;
    left: 50% !important;
    z-index: 95 !important;

    box-sizing: border-box !important;
    width: min(76vw, 310px) !important;
    margin: 0 !important;
    padding: 8px 12px !important;

    border: 1px solid rgba(220,181,89,.54) !important;
    border-radius: 999px !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.96),
            rgba(255,248,228,.94)
        ) !important;

    box-shadow:
        0 12px 32px rgba(97,68,21,.13),
        0 0 28px rgba(255,218,117,.25) !important;

    transform: translate(-50%, -50%) !important;

    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;

    animation:
        sunivaArrivalMessage
        5.5s ease forwards !important;
}

/*
 * 到着案内の内側にあった赤い表示を解除
 */
.suniva-world-stage
.suniva-portal-layer
.suniva-portal-container
.suniva-portal-distance {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 3px 7px !important;

    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;

    color: #674b26 !important;
    font-family:
        "Yu Mincho",
        "Hiragino Mincho ProN",
        "Noto Serif JP",
        serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: .03em !important;
    text-align: center !important;
    white-space: normal !important;

    text-shadow: none !important;
    box-shadow: none !important;
    animation: none !important;
}

/*
 * チェックイン可能時も赤色へ戻さない
 */
.suniva-world-stage
.suniva-portal-container.checkable
.suniva-portal-distance {
    border: 0 !important;
    background: transparent !important;
    color: #674b26 !important;
    box-shadow: none !important;
}

/*
 * しばらく表示してから、
 * 光の中へ静かに溶ける
 */
@keyframes sunivaArrivalMessage {
    0%,
    68% {
        opacity: 1;
        transform:
            translate(-50%, -50%)
            translateY(0);
    }

    100% {
        opacity: 0;
        transform:
            translate(-50%, -50%)
            translateY(-7px);
        visibility: hidden;
    }
}

@media (min-width: 768px) {
    .suniva-world-stage
    .suniva-portal-nameplate {
        top: 62.4% !important;
        width: min(18vw, 190px) !important;
        min-height: 27px !important;
        max-height: 37px !important;
        font-size: clamp(11px, 1.2vw, 16px) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .suniva-world-stage
    .suniva-portal-layer
    .suniva-portal-container {
        animation: none !important;
    }
}


/* =========================================
   SUNIVA PORTAL POSITION FINISH V7
========================================= */

/*
 * コンパス距離表示と重ならない位置まで
 * 近隣ポータル案内を下げる
 */
#sunivaPortalNavigator {
    top: max(
        172px,
        calc(env(safe-area-inset-top) + 152px)
    ) !important;
}

/*
 * 実画面の武家屋敷画像に合わせ、
 * ポータル名を門の黒い木製看板へ移動
 */
.suniva-portal-nameplate {
    position: absolute !important;
    top: 69.2% !important;
    left: 50% !important;
    z-index: 27 !important;

    display: -webkit-box !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;
    width: min(35vw, 150px) !important;
    min-height: 21px !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 2px 7px !important;
    overflow: hidden !important;

    border: 0 !important;
    border-radius: 2px !important;
    background: transparent !important;

    color: #f3d486 !important;
    font-family:
        "Yu Mincho",
        "Hiragino Mincho ProN",
        "Noto Serif JP",
        serif !important;
    font-size: clamp(9px, 2.55vw, 13px) !important;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    letter-spacing: .01em !important;
    text-align: center !important;
    white-space: normal !important;

    text-shadow:
        0 1px 1px rgba(0,0,0,1),
        0 2px 3px rgba(0,0,0,.98),
        0 0 6px rgba(214,163,59,.34) !important;

    transform: translate(-50%, -50%) !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

/* 長い名称は看板内へ収まるように縮小 */
.suniva-portal-nameplate.is-long-name {
    width: min(39vw, 168px) !important;
    padding-right: 5px !important;
    padding-left: 5px !important;
    font-size: clamp(8px, 2.15vw, 11px) !important;
    letter-spacing: 0 !important;
}

@media (max-width: 390px) {
    #sunivaPortalNavigator {
        top: max(
            164px,
            calc(env(safe-area-inset-top) + 144px)
        ) !important;
    }

    .suniva-portal-nameplate {
        top: 69.1% !important;
        width: min(36vw, 142px) !important;
    }

    .suniva-portal-nameplate.is-long-name {
        width: min(40vw, 158px) !important;
    }
}

@media (min-width: 768px) {
    #sunivaPortalNavigator {
        top: max(
            182px,
            calc(env(safe-area-inset-top) + 162px)
        ) !important;
    }

    .suniva-portal-nameplate {
        top: 69.3% !important;
        width: min(18vw, 190px) !important;
        min-height: 27px !important;
        max-height: 37px !important;
        font-size: clamp(11px, 1.18vw, 16px) !important;
    }

    .suniva-portal-nameplate.is-long-name {
        width: min(21vw, 220px) !important;
        font-size: clamp(10px, 1vw, 14px) !important;
    }
}


/* =========================================
   SUNIVA NAMEPLATE LOWER V8
========================================= */

/*
 * 実機表示を基準に、
 * 屋根上から門中央の黒い看板まで下げる
 */
.suniva-portal-nameplate {
    top: 74.8% !important;
}

/* 小さいiPhone */
@media (max-width: 390px) {
    .suniva-portal-nameplate {
        top: 74.6% !important;
    }
}

/* PC・タブレット */
@media (min-width: 768px) {
    .suniva-portal-nameplate {
        top: 74.9% !important;
    }
}


/* =========================================
   SUNIVA GATE NAMEPLATE V9
========================================= */

/* 屋根上に残っている従来名称をすべて隠す */
.suniva-portal-title,
.suniva-portal-name,
.suniva-portal-nameplate {
    display: none !important;
}

/* 門の黒い木製看板専用 */
#sunivaGateNameplate {
    position: absolute !important;
    top: 60.6% !important;
    left: 50% !important;
    z-index: 100 !important;

    display: -webkit-box !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;
    width: min(35vw, 150px) !important;
    min-height: 21px !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 2px 7px !important;
    overflow: hidden !important;

    border: 0 !important;
    border-radius: 2px !important;
    background: transparent !important;

    color: #f5d889 !important;
    font-family:
        "Yu Mincho",
        "Hiragino Mincho ProN",
        "Noto Serif JP",
        serif !important;
    font-size: clamp(9px, 2.5vw, 13px) !important;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    letter-spacing: .01em !important;
    text-align: center !important;
    white-space: normal !important;

    text-shadow:
        0 1px 1px rgba(0,0,0,1),
        0 2px 3px rgba(0,0,0,.98),
        0 0 6px rgba(218,167,62,.38) !important;

    transform: translate(-50%, -50%) !important;
    pointer-events: none !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#sunivaGateNameplate.is-long-name {
    width: min(40vw, 168px) !important;
    padding-right: 5px !important;
    padding-left: 5px !important;
    font-size: clamp(8px, 2.1vw, 11px) !important;
    letter-spacing: 0 !important;
}

@media (max-width: 390px) {
    #sunivaGateNameplate {
        top: 60.5% !important;
        width: min(36vw, 142px) !important;
    }

    #sunivaGateNameplate.is-long-name {
        width: min(41vw, 158px) !important;
    }
}

@media (min-width: 768px) {
    #sunivaGateNameplate {
        top: 60.7% !important;
        width: min(18vw, 190px) !important;
        min-height: 27px !important;
        max-height: 37px !important;
        font-size: clamp(11px, 1.15vw, 16px) !important;
    }

    #sunivaGateNameplate.is-long-name {
        width: min(21vw, 220px) !important;
        font-size: clamp(10px, 1vw, 14px) !important;
    }
}


/* =========================================
   SUNIVA OLD PORTAL LAYER REMOVE V10
========================================= */

/*
 * 旧AR表示用の名称・距離レイヤーは使用しない。
 * 上部ナビゲーションと門の木製看板へ一本化する。
 */
.suniva-world-stage > .suniva-portal-layer,
.suniva-world-stage .suniva-portal-container,
.suniva-world-stage #portal-1 {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* =========================================
   SUNIVA DUPLICATE GATE NAME REMOVE V11
========================================= */

/*
 * V9で追加した名称は屋根上へ重複表示されたため使用しない。
 * 木製看板内の既存nameplateだけを正式表示とする。
 */
#sunivaGateNameplate {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/*
 * 木製看板内の既存名称を明示的に表示する。
 * hidden属性よりこちらを優先する。
 */
.suniva-world-stage .suniva-portal-nameplate {
    display: -webkit-box !important;
    visibility: visible !important;
    opacity: 1 !important;
}


/* =========================================
   SUNIVA GATE POSITION V12
========================================= */

/*
 * 実機表示を基準に、ポータル名を
 * 屋根下から門中央の黒い木製看板へ移動する。
 */
.suniva-world-stage .suniva-portal-nameplate {
    top: 83.4% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

/* 小さいiPhone */
@media (max-width: 390px) {
    .suniva-world-stage .suniva-portal-nameplate {
        top: 83.2% !important;
    }
}

/* PC・タブレット */
@media (min-width: 768px) {
    .suniva-world-stage .suniva-portal-nameplate {
        top: 83.5% !important;
    }
}


/* Android 水やり・光モーダル 縦スクロール修正 20260814 */
@media (max-width: 768px) {
  #swuCare:not([hidden]) {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483600 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important;
    padding: max(12px, env(safe-area-inset-top)) 12px max(24px, calc(env(safe-area-inset-bottom) + 18px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }
  #swuCare .swu-care__backdrop {
    position: fixed !important;
    inset: 0 !important;
  }
  #swuCare .swu-care__sheet {
    position: relative !important;
    z-index: 1 !important;
    flex: 0 0 auto !important;
    width: min(100%, 430px) !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: auto 0 !important;
    padding-bottom: max(28px, calc(env(safe-area-inset-bottom) + 20px)) !important;
    overflow: visible !important;
  }
}
@media (max-width: 768px) and (max-height: 700px) {
  #swuCare .swu-care__sheet {
    margin: 0 !important;
  }
  #swuCare .swu-care__choice {
    margin-top: 10px !important;
    padding: 10px !important;
  }
  #swuCare .swu-care__sheet h2 {
    margin: 6px 0 10px !important;
    font-size: 22px !important;
  }
}