@charset "UTF-8";

/* 横スクロール防止：万一何かがはみ出してもページ全体が横にスクロールしないように */
html, body {
    overflow-x: hidden;
    max-width: 100%;
}

.bg-noise {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E");
}

/* PC用：背景画像 + グラデーションオーバーレイ */
.bg-fv-custom {
    background-color: #000; /* 画像読み込み失敗時のフォールバック */
    background-image: 
        linear-gradient(rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.8) 100%),
        url('bg.png'); 
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* スマホ用：オーバーレイを濃くしてテキスト可読性を確保 */
@media (max-width: 768px) {
    .bg-fv-custom {
        background-color: #000;
        background-image: 
            linear-gradient(rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.78) 50%, rgba(0, 0, 0, 0.88) 100%),
            url('bg.png'); 
        background-position: 75% center;
    }

    /* スマホでFV内のテキストに微シャドウを入れて、画像上でも確実に読めるように */
    #fv h1,
    #fv p {
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 12px rgba(0, 0, 0, 0.6);
    }
}

details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }

/* phrase: 文節単位の改行コントロール。
   通常は nowrap で文節を割らないが、画面が狭くて入りきらない場合は
   普通に折り返す（はみ出しを防ぐ）。 */
.phrase { 
    display: inline-block; 
    white-space: nowrap; 
    vertical-align: top; 
    max-width: 100%;
}

/* 小型スマホ（〜480px）では nowrap を解除して、はみ出しを防ぐ。
   見た目より「画面に収まる」ことを優先。 */
@media (max-width: 480px) {
    .phrase {
        white-space: normal;
        word-break: auto-phrase; /* 対応ブラウザは文節単位、非対応はnormal */
        overflow-wrap: break-word;
    }
}

.kerning-palt { font-feature-settings: "palt"; }