/* 統一されたランキングページ購入ボタンスタイル - CSS競合回避のため最高優先度 */ /* 購入ボタンのおしゃれなデザイン - 最強優先度 */ body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchaseButton, .statItem.purchaseButton { position: relative !important; z-index: 999 !important; background: linear-gradient(45deg, #667eea 0%, #764ba2 100%) !important; border-radius: 20px !important; padding: 0 !important; margin-left: 8px !important; overflow: visible !important; box-shadow: 0 6px 24px rgba(102, 126, 234, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important; transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important; border: none !important; width: 65px !important; height: 32px !important; min-width: 65px !important; max-width: 65px !important; backdrop-filter: blur(10px) !important; cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important; } /* ホバー時の光エフェクトは削除されました */ .statItem.purchaseButton:hover { background: linear-gradient(45deg, #7209b7 0%, #a663cc 100%) !important; transform: translateY(-4px) scale(1.02) !important; box-shadow: 0 12px 40px rgba(102, 126, 234, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important; } body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchaseButton .purchase-link, .statItem.purchaseButton .purchase-link { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important; text-decoration: none !important; color: white !important; font-weight: 600 !important; font-size: 0.7rem !important; letter-spacing: 0 !important; position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; z-index: 1000 !important; white-space: nowrap !important; text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important; pointer-events: auto !important; cursor: pointer !important; text-align: center !important; padding: 0 !important; margin: 0 !important; gap: 0 !important; } /* カートアイコンは削除されました */ body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchaseButton .purchase-link span, .statItem.purchaseButton .purchase-link span { text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important; font-weight: 600 !important; text-align: center !important; display: inline !important; line-height: 1 !important; margin: 0 !important; padding: 0 !important; } /* 購入済みボタンの視認性改善 - 最強優先度 */ body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchasedButton, .statItem.purchasedButton { background: linear-gradient(45deg, #2ecc71 0%, #27ae60 100%) !important; border: none !important; box-shadow: 0 6px 24px rgba(46, 204, 113, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important; z-index: 999 !important; position: relative !important; padding: 0 !important; border-radius: 20px !important; margin-left: 8px !important; backdrop-filter: blur(10px) !important; overflow: visible !important; width: 65px !important; height: 32px !important; min-width: 65px !important; max-width: 65px !important; display: flex !important; align-items: center !important; justify-content: center !important; } body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchasedButton .purchased-link, body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchasedButton span, .statItem.purchasedButton .purchased-link, .statItem.purchasedButton span { color: #ffffff !important; font-weight: 600 !important; text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important; display: flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 1000 !important; margin: 0 !important; padding: 0 !important; text-align: center !important; font-size: 0.7rem !important; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important; width: 100% !important; height: 100% !important; line-height: 32px !important; text-decoration: none !important; } /* 追加のスタイル強制適用 */ body .statItem.purchaseButton .purchase-link span, body .statItem.purchaseButton span { margin: 0 !important; padding: 0 !important; display: inline !important; } /* 購入済みボタンの文字表示を強制 - 完全中央配置 */ body .rankingHeader ~ .contentsWrap .videoItem .videoStats .statItem.purchasedButton span, body .statItem.purchasedButton span { color: #ffffff !important; display: block !important; font-size: 0.6rem !important; font-weight: 600 !important; line-height: 32px !important; text-align: center !important; margin: 0 !important; padding: 0 !important; opacity: 1 !important; visibility: visible !important; z-index: 1001 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; width: 100% !important; height: 100% !important; white-space: nowrap !important; overflow: hidden !important; box-sizing: border-box !important; transform: translateX(-1px) !important; } /* ランキングタイトルの統一スタイル */ .rankingHeader h1 { font-size: 1.8rem !important; font-weight: 700 !important; margin-bottom: 0.5rem !important; text-align: center !important; background: linear-gradient(45deg, #667eea, #764ba2) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } .rankingHeader .seoSubHeading { font-size: 0.9rem !important; color: #cccccc !important; margin-bottom: 1rem !important; text-align: center !important; font-weight: 400 !important; }