/** * CURIOSTUDIO i18n - スタイルシート */ /* FOUC対策（PHP側のインライン出力が主体だが、保険としてCSSファイル側にも定義） */ html.csi18n-loading body { visibility: hidden !important; } /* ===== 言語スイッチャー（フローティングボタン） ===== */ .csi18n-switcher { position: fixed; top: 16px; right: 16px; z-index: 99999; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; -webkit-font-smoothing: antialiased; } .csi18n-switcher-toggle { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: none; border-radius: 50%; background: #ffffff; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18); cursor: pointer; font-size: 20px; line-height: 1; transition: transform 0.15s ease, box-shadow 0.15s ease; } .csi18n-switcher-toggle:hover { transform: scale(1.06); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.24); } .csi18n-switcher-toggle:focus-visible { outline: 2px solid #1a73e8; outline-offset: 2px; } .csi18n-switcher-menu { position: absolute; top: 52px; right: 0; min-width: 170px; background: #ffffff; border-radius: 10px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2); padding: 6px; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease; } .csi18n-switcher.is-open .csi18n-switcher-menu { opacity: 1; visibility: visible; transform: translateY(0); } .csi18n-switcher-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; border: none; border-radius: 6px; background: transparent; cursor: pointer; font-size: 14px; color: #333333; text-align: left; white-space: nowrap; } .csi18n-switcher-item:hover { background: #f2f2f2; } .csi18n-switcher-item.is-active { background: #eef5ff; color: #1a73e8; font-weight: 600; } .csi18n-flag { font-size: 18px; line-height: 1; } .csi18n-label { font-size: 13px; } /* モバイル表示時は少しコンパクトに */ @media (max-width: 600px) { .csi18n-switcher { top: 10px; right: 10px; } .csi18n-switcher-toggle { width: 38px; height: 38px; font-size: 17px; } .csi18n-switcher-menu { top: 46px; } }