WatchItLater

動画を見る前にマイリストに登録したいGreasemonkey (Chrome/Fx用)

目前為 2014-06-03 提交的版本,檢視 最新版本

// ==UserScript==
// @name           WatchItLater
// @namespace      https://github.com/segabito/
// @description    動画を見る前にマイリストに登録したいGreasemonkey (Chrome/Fx用)
// @include        http://www.nicovideo.jp/*
// @include        http://i.nicovideo.jp/*
// @include        http://ch.nicovideo.jp/*
// @include        http://ext.nicovideo.jp/thumb/*
// @exclude        http://ads*.nicovideo.jp/*
// @exclude        http://live*.nicovideo.jp/*
// @exclude        http://dic.nicovideo.jp/*
// @exclude        http://www.upload.nicovideo.jp/*
// @exclude        http://upload.nicovideo.jp/*
// @exclude        http://ch.nicovideo.jp/tool/*
// @exclude        http://flapi.nicovideo.jp/*
// @match          http://www.nicovideo.jp/*
// @match          http://ch.nicovideo.jp/*
// @match          http://i.nicovideo.jp/*
// @match          http://*.nicovideo.jp/*
// @match          http://ext.nicovideo.jp/*
// @match          http://search.nicovideo.jp/*
// @grant          GM_xmlhttpRequest
// @version        1.140603
// ==/UserScript==

/**
 *
 *
 * やりたい事・アイデア
 * ・検索画面にコミュニティ動画一覧を表示 (チャンネルより難しい。力技でなんとかする)
 * ・シークバーのサムネイルを並べて表示するやつ   (単体スクリプトのほうがよさそう)
 * ・キーワード検索/タグ検索履歴の改修
 * ・ユーザーの投稿動画一覧に「xxさんのニコレポ」という架空のマイリストフォルダを出す
 * ・動画ランキングを「ニコニコ動画さん」という架空ユーザーの公開マイリストにする
 * ・「ニコニコチャンネルさん」という架空ユーザーを作って各ジャンルの新着を架空マイリストにする
 * ・横スクロールを賢くする
 * ・お気に入りユーザーの時は「@ジャンプ」許可
 * ・軽量化
 * ・綺麗なコード
 *
 * ・タグ領域の圧縮方法をShinjukuWatch形式にする
 */
//
// * ver 1.140524
// * ver 1.140522
// - 本家のサムネイル仕様変更に対応

// * ver 1.140428
// - 本家の仕様変更で使えなくなっていた、プレイリストのブックマーク保存機能を復活

// * ver 1.140319
// - 謎の技術によって、ニコメンドがなくても説明文の動画リンクにサムネイルを出せるように
// - 細かなスタイル調整

// * ver 1.140303
// - 動画選択画面で再生リストの開閉が記憶されなくなったのに対抗
// - 動画切換え時に一番上までスクロールするようになったのに対抗
// - 本家の内部仕様変更(jQuery ver up等)に対応

// * ver 1.140227
// - タグ検索のソート順が毎回リセットされるようになったのに対抗

// * ver 1.140218
// - コメント重複を勝手に直してたけど不要になったので除去
// - 二本目以降の動画だけ自動再生を追加

// * ver 1.140207
// - テレビちゃんメニューの表示修正
// - スレッドIDのリンクからもタグを取得できるように(watchページ内のみ)
// - マイリスト選択メニュー部分の右クリックでとりマイの位置に戻る隠し機能

// * ver 1.140122
// - テレビちゃんメニューをShinjukuWatch仕様に

// * ver 1.140110
// - 検索フォームのオートコンプリートを調整
// - ニコメンドまわりのコード除去
// - 微妙にNicorenizerとの相性を改善

(function() {
  var isNativeGM = true;
  var monkey =
  (function(isNativeGM){
    var w;
    try { w = unsafeWindow || window; } catch (e) { w = window;}
    var document = w.document;

    var conf = {
      autoBrowserFull: false, // 再生開始時に自動全画面化
      disableAutoBrowserFullIfNicowari: false, // ユーザーニコ割があるときは自動全画面化しない
      autoNotFull: true, // 再生完了時にフルスクリーン解除(原宿と同じにする)
      autoTagPin: false,
      topPager: true, // 検索ボックスのページャを上にする
      hideLeftIchiba: false,
      autoClosePlaylistInFull: true, // 全画面時にプレイリストを自動で閉じる
      autoOpenSearch: false, // 再生開始時に自動検索画面
      autoScrollToPlayer: true, // プレイヤー位置に自動スクロール(自動全画面化オフ時)
      hideNewsInFull: true, // 全画面時にニュースを閉じる
      wideCommentPanel: false, // コメントパネルをワイドにする
      removeLeftPanel: true, // 左パネルを消滅させる
      leftPanelJack: false, // 左パネルに動画情報を表示
      rightPanelJack: true, // 右パネルに動画情報を表示
      headerViewCounter: false, // ヘッダに再生数コメント数を表示
      popupViewCounter: 'full', // 動画切り替わり時にポップアップで再生数を表示
      ignoreJumpCommand: false, // @ジャンプ無効化
      nicoSSeekCount: -1, // @ジャンプによるシーク(ループなど)を許可する回数 -1=無限 0以上はその回数だけ許可
      doubleClickScroll: true, // 空白部分ををダブルクリックで動画の位置にスクロールする
      hidePlaylist: true, // プレイリストを閉じる
      hidePlaylistInVideoExplorer: true, // 動画選択画面でプレイリストを閉じる
      hidariue: false, // てれびちゃんメニュー内に、原宿以前のランダム画像復活
      videoExplorerHack: true, // 検索画面を乗っ取る
      squareThumbnail: true, // 検索画面のサムネを4:3にする
      enableFavTags: false, // 動画検索画面にお気に入りタグを表示
      enableFavMylists: false, // 動画検索画面にお気に入りマイリストを表示
      searchPageItemCount: 50, // 検索モードの1ページあたりの表示数
      enableMylistDeleteButton: false, // 動画検索画面で、自分のマイリストから消すボタンを追加する
      enableHoverPopup: true, // 動画リンクのマイリストポップアップを有効にする
      enableAutoTagContainerHeight: false, // タグが2行以内なら自動で高さ調節(ピン留め時のみ
      autoSmallScreenSearch: false, // ポップアップからのタグ検索でもプレイヤーを小さくする
      enableNewsHistory: false, // ニコニコニュースの履歴を保持する
      defaultSearchOption: '', // 検索時のデフォルトオプション
      autoPlayIfWindowActive: 'no', // 'yes' = ウィンドウがアクティブの時だけ自動再生する
      autoPlay2ndVideo: false, // 2本目以降の動画だけ自動再生
      enableYukkuriPlayButton: false, // スロー再生ボタンを表示する
      noNicoru: false, // ニコるボタンをなくす
      enoubleTouchPanel: false, // タッチパネルへの対応を有効にする
      mouseClickWheelVolume: 0, // マウスボタン+ホイールで音量調整を有効にする 1 = 左ボタン 2 = 右ボタン
      enableQTouch: false, // タッチパネルモード有効
      commentVisibility: 'visible', // 'visible', 'hidden', 'lastState'
      lastCommentVisibility: 'visible',
      controllerVisibilityInFull: '', // 全画面時に操作パネルとコメント入力欄を出す設定
      enableTrueBrowserFull: false, // フチなし全画面モードにする (Chromeは画面ダブルクリックで切り替え可能)
      enableSharedNgSetting: false, //
      hideNicoNews: false, // ニコニコニュースを消す
      hashPlaylistMode: 0,    // location.hashにプレイリストを保持 0 =無効 1=連続再生時 2=常時
      storagePlaylistMode: '', // localStorageにプレイリストを保持
      compactVideoInfo: true, //
      hoverMenuDelay: 0.4, // リンクをホバーした時のメニューが出るまでの時間(秒)
      enableFullScreenMenu: true, // 全画面時にホイールでメニューを出す
      enableHeatMap: false, //
      heatMapDisplayMode: 'hover', // 'always' 'hover'
      replacePopupMarquee: true, //
      enableRelatedTag: true, // 関連タグを表示するかどうか
//      playerTabAutoOpenNicommend: 'enable', // 終了時にニコメンドを自動で開くかどうか 'enable' 'auto' 'disable'
      autoPauseInvisibleInput: true, //
      customPlayerSize: '', //
      removeCommentPanelHoverEvent: false, //
      disableVideoExplorer: false, //
      disableTagReload: false, //
      disableHorizontalScroll: false, // 横スクロールバーを出なくする
      hideCommentPanelSocialButtons: false, // コメントパネル下のソーシャルボタンを隠す
      mylistPanelPosition: '',
      enableDescriptionThumbnail: false, // 説明文の動画リンクにサムネイルとタイトル表示

      enableLocalMylistCache: false,

      rankingCategory_g_ent2_Close:     true,
      rankingCategory_g_life2_Close:    true,
      rankingCategory_g_tech_Close:     true,
      rankingCategory_g_culture2_Close: true,
      rankingCategory_g_other_Close:    true,

      searchEngine:              'sugoi', // 'normal' 'sugoi'
      searchStartTimeRange:      '', //
      searchLengthSecondsRange:  '', //
      searchMusicDlFilter:       false, //

      hideVideoExplorerExpand: true, // 「動画をもっと見る」ボタンを小さくする
//      nicommendVisibility: 'visible', // ニコメンドの表示 'visible', 'underIchiba', 'hidden'
      ichibaVisibility:    'visible', // 市場の表示 '',   'visible', 'hidden'
      reviewVisibility:    'visible', // レビューの表示   'visible', 'hidden'
      bottomContentsVisibility: 'hidden', // 動画下のコンテンツ表示表示非表示
      hideMenuInFull: 'hide', // 全画面時にマイリストメニューを隠す '', 'hide' = 目立たなくする, 'hideAll' = 完全非表示

      flatDesignMode: '',  // 'on' グラデーションや角丸をなくす。 7/25からQwatchがフラットデザインになったので不要になった
      playerBgStyle: '',  // ↑ の後継パラメータ 'gray' 'white' ''

      shortcutTogglePlay:         {char: 'P', shift: false, ctrl: false, alt: true,  enable: false}, // 停止/再生
      shortcutDefMylist:          {char: 'M', shift: true,  ctrl: false, alt: false, enable: false}, // とりマイ登録のショートカット
      shortcutMylist:             {char: 'M', shift: false, ctrl: true , alt: false, enable: false}, // マイリスト登録のショートカット
      shortcutOpenSearch:         {char: 'S', shift: true,  ctrl: false, alt: false, enable: false}, // 検索オープンのショートカット
      shortcutOpenDefMylist:      {char: 'D', shift: true,  ctrl: false, alt: false, enable: false}, // とりマイオープンのショートカット
      shortcutOpenRecommend:      {char: 'R', shift: true,  ctrl: false, alt: false, enable: false}, // 関連動画(オススメ)を開くショートカット
      shortcutCommentVisibility:  {char: 'V', shift: true,  ctrl: false, alt: false, enable: false}, // コメント表示ON/OFFのショートカット
      shortcutScrollToNicoPlayer: {char: 'P', shift: true,  ctrl: false, alt: false, enable: false}, // プレイヤーまでスクロールのショートカット
      shortcutShowOtherVideo:     {char: 'U', shift: true,  ctrl: false, alt: false, enable: false}, // 投稿者の関連動画表示のショートカット
      shortcutMute:               {char: 'T', shift: true,  ctrl: false, alt: false, enable: false}, // 音量ミュートのショートカット
      shortcutDeepenedComment:    {char: 'B', shift: true,  ctrl: false, alt: false, enable: false}, // コメント背面表示
      shortcutToggleStageVideo:   {char: 'H', shift: true,  ctrl: false, alt: false, enable: false}, // ハードウェアアクセラレーション(StageVideo)のショートカット

      shortcutInvisibleInput:     {char: 'C', shift: false, ctrl: false,  alt: true, enable: true}, // 停止/再生

      watchCounter: 0, // お前は今までに見た動画の数を覚えているのか?をカウントする
      forceEnableStageVideo: false,
      forceExpandStageVideo: false,
      enableAutoPlaybackContinue: false, // 一定時間操作しなかくても自動再生を続行
      lastLeftTab: 'videoInfo',
      lastRightTab: 'w_videoInfo',
      lastRightTabInExplorer: 'comment',
      lastControlPanelPosition: '',
      enableSortTypeMemory: true, // 検索のソート順を記憶する
      searchSortType: 'n', //
      searchSortOrder: 'd', // 'd'=desc 'a' = asc
      fxInterval: 40, // アニメーションのフレームレート 40 = 25fps
      enableGpuLayer: false, // 一部の要素でGPU描画を有効にしてみる?
      debugMode: false
    };


  //===================================================
  //===================================================
  //===================================================

    function addStyle(styles, id) {
      var elm = document.createElement('style');
      window.setTimeout(function() {
        elm.type = 'text/css';
        if (id) { elm.id = id; }

        var text = styles.toString();
        text = document.createTextNode(text);
        elm.appendChild(text);
        var head = document.getElementsByTagName('head');
        head = head[0];
        head.appendChild(elm);
      }, 0);
      return elm;
    }

    if (!isNativeGM) {
      this.GM_xmlhttpRequest = function(options) {
        try {
          var req = new XMLHttpRequest();
          var method = options.method || 'GET';
          req.onreadystatechange = function() {
            if (req.readyState === 4) {
              if (typeof options.onload === "function") options.onload(req);
            }
          };
          req.open(method, options.url, true);
          if (options.headers) {
            for (var h in options.headers) {
              req.setRequestHeader(h, options.headers[h]);
            }
          }

          req.send(options.data || null);
        } catch (e) {
          if (conf.debugMode) console.log(e);
        }
      };
    }

  (function() { // 各ページ共通
    var __css__ = (function() {/*
      .tagItemsPopup {
        background: #eef;
      }
      .popupMenu {
        position: absolute;
        min-width: 200px;
        font-Size: 12pt;
        z-index: 2000000;
        box-shadow: 2px 2px 2px #888;
      }
      .popupMenu ul,   .popupMenu ul li {
        position: relative;
        list-style-type: none;
        margin: 0; padding: 0;
        white-space: nowrap;
      }
      .tagItemsPopup .icon{
        width: 17px;
        height: 15px;
      }
      .tagItemsPopup .nicodic, .tagItemsPopup .newsearch {
        margin: 1px 4px 1px 1px;
      }
      .tagItemsPopup .nicodic:hover, .tagItemsPopup .newsearch:hover {
        margin: 0px 3px 0px 0px;
        border: 1px outset;
      }

      .mylistListPopup {
        position:absolute;
        background: #fff;
        overflow: visible;
        padding: 8px;
        border: 1px outset #333;
        transition: opacity 0.3s ease;
      }
      .mylistListPopup.popupMenu ul li {
        position: relative;
        margin: 2px 8px;
        overflow-y: visible;
      }
      .mylistListPopup:not(.show) {
        left: -9999px;
        top: -9999px;
        opacity: 0;
      }
      .mylistListPopup.show {
        opacity: 1;
      }
      .mylistListPopup .listInner {
        -webkit-column-width: auto; -moz-column-width: auto;
        -webkit-column-count: 1 !important; {* Chromeだけバグるので *}
      }
      .mylistListPopup .icon {
        display: inline-block;
        width: 18px;
        height: 14px;
        margin: -4px 4px 0 0;
        vertical-align: middle;
        margin-right: 15px;
        background: url("http://uni.res.nimg.jp/img/zero_my/icon_folder_default.png") no-repeat scroll 0 0 transparent;
        transform: scale(1.5); -webkit-transform: scale(1.5);
        transform-origin: 0 0 0; -webkit-transform-origin: 0 0 0;
        transition: transform 0.1s ease, box-shadow 0.1s ease;
        -webkit-transition: -webkit-transform 0.1s ease, box-shadow 0.1s ease;
        cursor: pointer;
      }
      .mylistListPopup .icon:hover {
        background-color: #ff9;
        transform: scale(2); -webkit-transform: scale(2);
      }
      .mylistListPopup .icon:after {
        content: '開く';
        position: absolute;
        bottom: 0px;
        right: 12px;
        padding: 2px;
        opacity: 0;
        transform: scale(0.5); -webkit-transform: scale(0.5);
        z-index: -1;
      }
      .mylistListPopup .icon:hover:after {
                {*box-shadow: 2px 2px 2px #888;*}
        background: #fff;
        z-index: 100;
        opacity: 1;
      }
      .mylistListPopup .deflist .icon { background-position: 0 -253px; }
      .mylistListPopup .folder1 .icon { background-position: 0 -23px;}
      .mylistListPopup .folder2 .icon { background-position: 0 -46px;}
      .mylistListPopup .folder3 .icon { background-position: 0 -69px;}
      .mylistListPopup .folder4 .icon { background-position: 0 -92px;}
      .mylistListPopup .folder5 .icon { background-position: 0 -115px;}
      .mylistListPopup .folder6 .icon { background-position: 0 -138px;}
      .mylistListPopup .folder7 .icon { background-position: 0 -161px;}
      .mylistListPopup .folder8 .icon { background-position: 0 -184px;}
      .mylistListPopup .folder9 .icon { background-position: 0 -207px;}


      .mylistListPopup .name {
        display: inline-block;
        vertical-align: middle;
        font-size: 110%;
        color: #666;
        text-derocation: none !important;
      }
      .mylistListPopup .name:hover {
        color: #000;
        background-color: #ff9;
      }
      .mylistListPopup .name:after {
        content: ' に登録';
        font-size: 75%;
        color: #fff;
      }
      .mylistListPopup .name.exist:after {
        content: ' に登録済';
        color: #933;
      }
      .mylistListPopup .name:hover:after {
        color: #666;
      }

    {* マイリスト登録パネル *}
      .mylistPopupPanel {
        height: 24px;
        z-index: 10000;
        {*border: 1px solid silver;
        border-radius: 3px; *}
        padding: 0;
        margin: 0;
        overflow: hidden;
        display: inline-block;
        background: #eee;
      }
      .mylistPopupPanel.fixed {
        position: fixed; right: 0; bottom: 0;
        transition: right 0.1s ease-out;
      }
      .mylistPopupPanel.fixed.left {
        right: auto;
        left: 0;
      }
      .mylistPopupPanel.fixed.top {
        bottom: auto;
        top: 0;
      }

      .mylistPopupPanel.fixed>* {
        transition: opacity 0.1s ease-out;
      }
      .mylistPopupPanel>*>* {
        transition: background 0.5s ease 0.5s, color 0.5s ease 0.5s;
      }
        .full_with_browser .mylistPopupPanel,   .mylistPopupPanel.black {
          background: #000; border: 0;
        }
        body.full_with_browser .mylistPopupPanel *,body .mylistPopupPanel.black.fixed * {
          background: #000; color: #888; border-color: #333;
        }
        .full_with_browser .mylistPopupPanel.hideAllInFull{
          display: none;
        }
        .full_with_browser .mylistPopupPanel.hideInFull.fixed:not(:hover) {
          right: -100px;
          transition: right 0.8s ease-in-out 0.5s;
        }
        .full_with_browser .mylistPopupPanel.hideInFull.fixed.right:not(:hover) {
          left: -100px; right: auto;
          transition: left 0.8s ease-in-out 0.5s;
        }
        .full_with_browser .mylistPopupPanel.hideInFull:not(:hover)>*{
          opacity: 0;
          transition: opacity 0.3s ease-out 1s;
        }
      .mylistPopupPanel.w_touch {
        height: 40px;
      }
      iframe.popup {
        position: absolute;
      }
    {* マウスホバーで出るほうのマイリスト登録パネル *}
      .mylistPopupPanel.popup {
        position: absolute;
        z-index: 1000000;
        box-shadow: 2px 2px 2px #888;
      }
    {* マイリスト登録パネルの中の各要素 *}
      .mylistPopupPanel .mylistSelect {
        width: 64px;
        margin: 0;
        padding: 0;
        font-size: 80%;
        white-space: nowrap;
        {*background: #eee;*}
        border: 1px solid silver;
      }
        .mylistSelect:focus {
          border-style: outset;
        }
    {* 誤操作を減らすため、とりマイの時だけスタイルを変える用 *}
      .mylistPopupPanel.w_touch button {
        padding: 8px 18px;
      }
      .mylistPopupPanel.w_touch .mylistSelect {
        font-size: 170%; width: 130px; border: none;
      }
      .mylistPopupPanel.w_touch .mylistSelect:focus {
        border: 1px dotted;
      }
      .mylistPopupPanel.deflistSelected button {
      }
      .mylistPopupPanel.mylistSelected  button {
        color: #ccf;
      }
      .mylistPopupPanel button {
        margin: 0;
        font-weight: bolder;
        cursor: pointer;
      }
      .mylistPopupPanel button:active, #outline .playlistToggle:active, #outline .openVideoExplorer:active, #content .openConfButton:active {
        border:1px inset !important
      }
      .mylistPopupPanel button:hover, #outline .playlistToggle:hover, #outline .openVideoExplorer:hover, #outline .openConfButton:hover, #yukkuriPanel .yukkuriButton:hover {
        border:1px outset
      }
      .mylistPopupPanel .mylistAdd, .mylistPopupPanel .tagGet, #yukkuriPanel .yukkuriButton {
        border:1px solid #777; cursor: pointer; font-family:arial, helvetica, sans-serif; padding: 0px 4px 0px 4px; text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; text-align: center; color: #eee; background-color: #888; margin: 0;
      }
      .mylistPopupPanel .mylistAdd:focus, .mylistPopupPanel .tagGet:focus, #yukkuriPanel .yukkuriButton:focus {
        border-style: outset; color: orange;
      }
      .mylistPopupPanel.deflistSelected {
        color: #ff9;
      }
      .mylistPopupPanel .deflistRemove, #yukkuriPanel .yukkuriButton.active{
        border:1px solid #ebb7b7; font-family:arial, helvetica, sans-serif; padding: 0px 6px 0px 6px; text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; text-align: center; color: #FFFFFF; background-color: #f7e3e3;
      }
      .mylistPopupPanel.deflistSelected {
        color: #ff9;
      }
      .mylistPopupPanel .deflistRemove, #yukkuriPanel .yukkuriButton.active{
        border:1px solid #ebb7b7; font-family:arial, helvetica, sans-serif; padding: 0px 6px 0px 6px; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-align: center; color: #FFFFFF; background-color: #f7e3e3;
      }
      .mylistPopupPanel.mylistSelected .deflistRemove {
        display: none;
      }
      .mylistPopupPanel .closeButton{
        color: #339;
        padding: 0;
        margin: 0;
        font-size: 80%;
        text-decoration: none;
      }
      .mylistPopupPanel .newTabLink{
        padding: 0 2px; text-decoration: underline; text-shadow: -1px -1px 0px #442B2B;
      }
      .mylistPopupPanel.fixed .newTabLink, .mylistPopupPanel.fixed .closeButton {
        display: none;
      }
      .w_fullScreenMenu .mylistPopupPanel.fixed { bottom: 2px; }

      {* ポイントが無いときは表示しない *}
      .item:not(.silver):not(.gold) .uadContainer {
        display: none !important;
      }

      .watchItLaterAPILoaderFrame {
        width: 1px;
        height: 1px;
        position: fixed;
        top: -100px;
        left: -100px;
        border: 0;
        overflow: hidden;
      }

    */}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1]
        .replace(/\{\*/g, '/*').replace(/\*\}/g, '*/');
     addStyle(__css__, 'watchItLaterCommonStyle');
 })(); // end of commoncss




  (function() { // watchページだけのstyle
    if (!w.WatchApp) { return; }
    var __css__ = (function() { /*
    {* 動画タグとプレイリストのポップアップ *}
      #videoTagPopupContainer {
      }
      #videoTagPopupContainer.w_touch {
        line-height: 200%; font-size: 130%;
      }
      #videoTagPopupContainer.w_touch .nicodic{
        margin: 4px 14px;
      }
      .playlistMenuPopup {
        background: #666; color: white; padding: 4px 8px;
      }
      .playlistMenuPopup.w_touch {
        line-height: 250%;
      }
      #playlistSaveDialog {
        display: none;
      }
      #playlistSaveDialog.show {
        display: block;
      }
      #playlistSaveDialog.show .shadow{
        position: fixed;
        top: 0; left: 0; width: 100%; height: 100%;
        background: #000; opacity: 0.5;
        z-index: 30000;
      }
      #playlistSaveDialog.show .formWindow{
        position: fixed;
        margin: 0 auto;
        text-align: center;
        width: 100%;
        top: 45%;
        z-index: 30001;
      }
      #playlistSaveDialog      .formWindow .formWindowInner{
        -webkit-transition: opacity 1s ease-out;
        transition: opacity 1s ease-out;
        opacity: 0;
      }
      #playlistSaveDialog.show .formWindow .formWindowInner{
        text-align: left;
        opacity: 1;
        margin: 0 auto;
        background: #f4f4f4;
        width: 500px;
        padding: 8px;
        border: 1px solid;
      }
      #playlistSaveDialog.show .formWindow .formWindowInner a{
        font-weight: bolder;
      }
      #playlistSaveDialog.show .formWindow .formWindowInner a:hover{
        text-decoration: underline; background: white;
      }
      #playlistSaveDialog.show .formWindow .formWindowInner label{
        margin: 8px;
      }
      #playlistSaveDialog.show .formWindow .formWindowInner input{

      }
      #playlistSaveDialog.show .formWindow .formWindowInner .desc{
        font-size: 80%;
      }
      .playlistMenuPopup ul li {
        cursor: pointer;
      }
      .playlistMenuPopup ul li.savelist {
        color: #aaa;
      }
      .playlistMenuPopup ul li:hover {
        text-decoration: underline; background: #888;
      }
      #yukkuriPanel .yukkuriButton.active {
        border:1px inset
      }

      #content .openConfButton {
        border:1px solid #bbb; cursor: pointer; font-family:arial, helvetica, sans-serif; padding: 4px; text-shadow: 1px 1px 0 rgba(0,0,0,0.3); text-align: center; color: #444; background-color: #ccc; margin: 0;
      }
      #outline .playlistToggle, #outline .openVideoExplorer, #outline .openConfButton {
        border:1px solid #444; cursor: pointer; font-family:arial, helvetica, sans-serif; padding: 0px 4px 0px 4px; box-shadow: 1px 1px 0 rgba(0,0,0,0.3); text-align: center; color: #444; background-color: #ccc; margin: 0;
        height: 24px; border-radius: 0 0 8px 8px;
      }
      #outline .openConfButton { padding: 0 8px; letter-spacing: 4px; width: 60px; }

      {* 全画面時にタグとプレイリストを表示しない時*}
      body.full_and_mini.full_with_browser #playerAlignmentArea{
        margin-bottom: 0 !important;
      }
      body.full_and_mini.full_with_browser #playlist{
        z-index: auto;
      }
      body.full_and_mini.full_with_browser .generationMessage{
        display: inline-block;
      }
      {* 全画面時にタグとプレイリストを表示する時 *}
      body.full_with_browser #playlist{
        z-index: 100;
      }
      body.full_with_browser .generationMessage{
        display: none;
      }
      body.full_with_browser .browserFullOption{
        padding-right: 200px;
      }
      {* 全画面時にニュースを隠す時 *}
      body.full_with_browser.hideNewsInFull #playerAlignmentArea{
        margin-bottom: -37px;
      }
      {* 少しでも縦スクロールを減らすため、動画情報を近づける。人によっては窮屈に感じるかも *}
      #outline {
        margin-top: -16px;
      }
      #outline #feedbackLink{

      }
      #outline .videoEditMenuExpand{
        position: absolute;right: 0;top: 26px; z-index: 1;
      }
      {* ヘッダに表示する再生数 *}
      #videoCounter {
        color: #ff9; font-size: 70%;
      }
      {* 右に表示する動画情報 *}
      .sidePanel .sideVideoInfo, .sidePanel .sideIchibaPanel, .sidePanel .sideReviewPanel  {
        padding: 0px 0px 0 0px; width: 196px; height: 100%; z-index: 10019;
        position:absolute; top:0; right:0; border: 1px solid #000;
        overflow-x: visible; overflow-y: auto;
      }
      {* 右に表示する動画情報 *}
      #playerTabWrapper.sidePanel .sideVideoInfo, #playerTabWrapper.sidePanel .sideIchibaPanel, #playerTabWrapper.sidePanel .sideReviewPanel  {
        padding: 0px 0px 0 0px; width: 324px; height: 100%;
        position: absolute; top: 0; right:0;
      }

      body:not(.full_with_browser) .w_wide #playerTabWrapper .sideVideoInfo,
      body:not(.full_with_browser) .w_wide #playerTabWrapper .sideIchibaPanel,
      body:not(.full_with_browser) .w_wide #playerTabWrapper .sideReviewPanel,
      .videoExplorer #playerTabWrapper .sideVideoInfo,
      .videoExplorer #playerTabWrapper .sideIchibaPanel,
      .videoExplorer #playerTabWrapper .sideReviewPanel {
        width: 418px;
      }
      #playerTabWrapper.w_videoInfo #appliPanel, #playerTabWrapper.w_ichiba #appliPanel, #playerTabWrapper.w_review #appliPanel  {
        top: -9999px;
      }
      .sidePanel .sideVideoInfo {
        background: #f4f4f4; text-Align:   left; overflow-x: hidden; overflow-Y: auto; box-shadow: none; font-size: 90%; border: 1px solid black;
      }
      .sidePanel .sideIchibaPanel, .sidePanel .sideReviewPanel  {
        background: #f4f4f4; text-Align: center; overflow-x: hidden; overflow-Y: auto; box-shadow: none; font-size: 90%;
      }
      .sidePanel .sideVideoInfo .sideVideoInfoInner {
        padding: 0 4px; position: relative;
      }
      .sidePanel .sideVideoInfo .videoTitleContainer {
        background: #ddd; text-align: center;  color: #000; margin: 6px 6px 0;
        border: solid; border-width: 2px 2px 0; border-color: #888;
      }
      .sidePanel .sideVideoInfo .videoOwnerInfoContainer {
        margin: 0 6px; border: solid; border-width: 0 2px 0; border-color: #888;
      }
      .sidePanel .sideVideoInfo .videoThumbnailContainer {
        background: #ddd; text-align: center; color: #000; margin: 0;
      }
      .sidePanel .sideVideoInfo .videoThumbnailContainer img {
        cursor: pointer;
      }
      .sidePanel .sideVideoInfo .videoTitle {
        padding: 8px;
      }
      .sidePanel .sideVideoInfo .videoPostedAt {
        color: #333;
      }
      .sidePanel .sideVideoInfo .videoStats{
        font-size:90%;
      }
      .sidePanel .sideVideoInfo .videoStats li{
        display: inline-block; margin: 0 2px;
      }
      .sidePanel .sideVideoInfo .videoStats li span{
        font-weight: bolder;
      }
      .sidePanel .sideVideoInfo .videoStats .ranking{
        display: none !important;
      }
      .sidePanel .sideVideoInfo .videoInfo{
        background: #ddd; text-align: center; padding: 4px; margin: 0 6px 6px;
        border: solid; border-width: 0 2px 2px; border-color: #888;
      }
      .sideVideoInfo .sideVideoInfoInner{
        -webkit-transition: opacity 1s ease-out, color 3s ease-out;
        transition: opacity 1s ease-out, color 3s ease-out;
        opacity: 0;
      }
      .sideVideoInfo.show .sideVideoInfoInner{
        opacity: 1;
      }
      .videoCount.blink {
        color: #ccc;
      }
      .sidePanel .videoCountDiff {
        position: absolute; color: white; right: 0; opacity: 0; z-index: 100; text-shadow: 1px 1px 0 orange;
      }
      .sidePanel .videoCountDiff.blink {
        opacity: 1; color: white;
      }
      #siteHeader .videoCount, #siteHeader .videoCountDiff {
        min-width: 32px; text-align: right; display: inline-block;
      }
      #siteHeader .videoCountDiff, #trueBrowserFullShield .videoCountDiff {
        position: absolute; color: yellow; opacity: 0; font-weight: bolder; text-shadow: 1px 1px 0 red;
      }
      #siteHeader .videoCountDiff.blink, #trueBrowserFullShield .videoCountDiff.blink {
        opacity: 1; color: yellow;
      }
      #trueBrowserFullShield .blink, #videoCounter .blink {
        color: #000;
      }
      .videoCountDiff:before      {content: '+';}
      .videoCountDiff.down:before {content: ''; }
      #popupMarquee .videoCountDiff {display: none;}
      .sidePanel .sideVideoInfo .videoDescription{
        overflow-x: hidden; text-align: left;
      }
      .sidePanel .sideVideoInfo .videoDescriptionInner{
        margin: 0 8px;
      }
      .sidePanel .sideVideoInfo .videoDetails{
        min-width: 150px;
      }
      .sidePanel .sideVideoInfo .videoDetails a{
        margin: auto 4px;
      }
      .sidePanel .sideVideoInfo .videoDetails a:visited{
        color: #04618c;
      }
      .sidePanel .sideVideoInfo .videoDetails a.watch{
        margin: auto 30px auto 4px;
        display:inline-block;
      }
      .sideVideoInfo .userName, .sideVideoInfo .channelName{
        display: block;
        font-size: 120%;
        cursor: pointer;
      }
      .sideVideoInfo .userIconContainer, .sideVideoInfo .channelIconContainer {
        background: #ddd; width: 100%; text-align: center; float: none;
      }
      .sidePanel .userIcon, .sidePanel .channelIcon{
        min-width: 128px; max-width: 150px; width: auto; height: auto; border: 0;
        box-shadow: 0 0 4px #666; cursor: pointer;
      }
      .sideVideoInfo .descriptionThumbnail {
        text-align: left; font-size: 90%; padding: 4px; background: #ddd;
        min-height: 50px; margin: 4px 8px; font-weight: normal; color: black;
      }
      .sideVideoInfo .descriptionThumbnail p {
        margin: 0 8px;
        font-weight: bolder;
      }
      .sideVideoInfo .descriptionThumbnail .uploadAt {
        font-size: 90%;
        margin: 4px;
        color: #333;
      }
      .sideVideoInfo .descriptionThumbnail .counterContainer {
        text-align: center;
      }
      .sideVideoInfo .descriptionThumbnail .view,
      .sideVideoInfo .descriptionThumbnail .comment,
      .sideVideoInfo .descriptionThumbnail .mylist
      {
        font-size: 90%;
        white-space: nowrap;
        margin-right: 4px;
        color: #333;
      }
      .sideVideoInfo .descriptionThumbnail .count {
        font-weight: bolder;
      }

      .sideVideoInfo .descriptionThumbnail.video img{
        height: 50px; cursor: pointer; float: left;
      }
      .sideVideoInfo .descriptionThumbnail.mylist img{
        height: 40px; cursor: pointer;
      }
      .sideVideoInfo .descriptionThumbnail.illust img{
        height: 60px; cursor: pointer;
      }
      .sideVideoInfo a.otherSite {
        font-weight: bolder; text-decoration: underline;
      }
      body:not(.videoExplorer) #leftPanel.removed {
        display: none; left: 0px;
      }
      body:not(.videoExplorer) #leftPanel.removed .sideVideoInfo {
        display: none; width: 0px !important; border: none; margin: 0; padding: 0; right: auto;
      }
      .sideVideoInfo .userIconContainer.isUserVideoPublic .notPublic { display: none; }
      .sideVideoInfo .userIconContainer                    .isPublic { display: none; }
      .sideVideoInfo .userIconContainer.isUserVideoPublic  .isPublic { display: inline; }
      body.videoExplorer #content.w_adjusted .sideIchibaPanel .ichiba_mainitem,
      .sidePanel .sideIchibaPanel .ichiba_mainitem {
        width: 180px; display:inline-block; vertical-align: top;
        margin: 4px 3px; border 1px solid silver;
      }

      body.videoExplorer #content.w_adjusted .sideIchibaPanel .ichiba_mainitem .thumbnail span {
        font-size: 60px;
      }
      body.videoExplorer #content.w_adjusted .sideIchibaPanel .ichiba_mainitem>div>dt {
        height: 50px;position: relative;
      }
      body.videoExplorer #content.w_adjusted .sideIchibaPanel .ichiba_mainitem .balloonUe {
        position: absolute;width: 100%;
      }
      body.videoExplorer #content.w_adjusted .sideIchibaPanel .ichiba_mainitem .balloonUe {
        position: absolute;
      }
      body.videoExplorer #content.w_adjusted .sideIchibaPanel .ichiba_mainitem .balloonShita {
        position: absolute;
      }

      .sidePanel.videoInfo, .sidePanel.ichiba{
        background: none;
      }

      .sideVideoInfo.isFavorite .userName:after, .sideVideoInfo.isFavorite.isChannel .videoOwnerInfoContainer .channelName:after{
        content: ' ★ '; color: gold; text-shadow: 1px 1px 1px black;
      }

      .sidePanel.videoInfo  #leftPanelContent, .sidePanel.ichiba  #leftPanelContent {
        display: none;
      }
      .sidePanel.w_comment    #playerTabContainer,
      .sidePanel.videoInfo    .sideVideoInfo,
      .sidePanel.ichiba       .sideIchibaPanel,
      .sidePanel.w_videoInfo  .sideVideoInfo,
      .sidePanel.w_ichiba     .sideIchibaPanel,
      .sidePanel.w_review     .sideReviewPanel {
        display: block; z-index: 10060;
      }
      .sidePanel:not(.w_comment) .watchWatchContainer {
        display: none;
      }

      #leftPanelTabContainer {
        display:none; background: #666; position: absolute; right: 4px; top: -27px; list-style-type: none; padding: 4px 6px 3px 60px; height: 20px;
      }
      #sidePanelTabContainer {
        display: none;
        position: absolute; list-style-type: none;
        padding: 5px 10px 0; right: -408px; top: 0; width: 350px; height: 34px;
                transform: rotate(90deg);         transform-origin: 0 0 0;
        -webkit-transform: rotate(90deg); -webkit-transform-origin: 0 0 0;
        z-index: 1000;
      }
      .full_with_browser #sidePanelTabContainer {
        background: #000 !important;
      }
      body:not(.videoExplorer):not(.full_with_browser) #sidePanelTabContainer.left {
        background: #000; right: auto; left: -375px; padding: 0; height: 27px;
                transform: rotate(-90deg);         transform-origin: 100% 0 0;
        -webkit-transform: rotate(-90deg); -webkit-transform-origin: 100% 0 0;
      }

      #leftPanelTabContainer.w_touch {
        top: -40px; height: 33px;
      }
      .sidePanel:hover #sidePanelTabContainer, .sidePanel:hover #leftPanelTabContainer {
        display: block;
      }
      #leftPanelTabContainer .tab{
        display: inline-block; cursor: pointer; background: #999; padding: 2px 4px 0px; border-width: 2px 2px 0px;
      }
        #leftPanelTabContainer.w_touch .tab, #sidePanelTabContainer.w_touch .tab {
          padding: 8px 12px 8px;
        }
      #sidePanelTabContainer .tab {
        background: none repeat scroll 0 0 #999999; border-width: 2px 2px 0; cursor: pointer;
        display: inline-block; font-size: 13px; padding: 5px 10px 8px;
        border-radius: 8px 8px 0px 0px;
      }
      body:not(.videoExplorer):not(.full_with_browser) #sidePanelTabContainer.left .tab {
        display: inline-block; font-size: 13px; padding: 5px 10px 0px;
      }
      #leftPanel.videoInfo .tab.videoInfo, #leftPanel.ichiba .tab.ichiba {
        background: #f4f4f4;    border-style: outset;
      }
      #playerTabWrapper.w_comment   .tab.comment,
      #playerTabWrapper.w_videoInfo .tab.videoInfo,
      #playerTabWrapper.w_ichiba    .tab.ichiba,
      #playerTabWrapper.w_review    .tab.review
      {
        background: #dfdfdf; border-style: outset;
      }

      #playerTabWrapper.w_videoInfo #playerCommentPanel,
      #playerTabWrapper.w_ichiba #playerCommentPanel,
      #playerTabWrapper.w_review #playerCommentPanel {
        {*display: none;*} top: -9999px;
      }
      .sidePanel.ichibaEmpty  .tab.ichiba, .sidePanel.reviewEmpty .tab.review {
        color: #ccc;
      }

      .sideIchibaPanel .ichibaPanelInner {
        margin:0; color: #666;
      }
      .sideIchibaPanel .ichibaPanelHeader .logo{
        text-shadow: 1px 1px 1px #666; cursor: pointer; padding: 4px 0px 4px; font-size: 125%;
      }
      .sideIchibaPanel .ichibaPanelFooter{
        text-align: center;
      }
      .sideIchibaPanel .ichiba_mainitem {
        margin: 0 0 8px 0; background: white; border-bottom : 1px dotted #ccc;
      }
      .sideIchibaPanel .ichiba_mainitem a:hover{
        background: #eef;
      }
      .sideIchibaPanel .ichiba_mainitem>div {
        max-width: 266px; margin: auto; text-align: center;
      }
      .sideIchibaPanel .ichiba_mainitem .blomagaArticleNP {
        background: url("http://ichiba.nicovideo.jp/embed/zero/img/bgMainBlomagaArticleNP.png") no-repeat scroll 0 0 transparent;
        height: 170px;
        margin: 0 auto;
        width: 180px;
      }
      .sideIchibaPanel .ichiba_mainitem .blomagaLogo {
        color: #FFFFFF;font-size: 9px;font-weight: bold;padding-left: 10px;padding-top: 8px;
      }
      .sideIchibaPanel .ichiba_mainitem .blomagaLogo span{
        background: none repeat scroll 0 0 #AAAAAA;padding: 0 3px;
      }
      .sideIchibaPanel .ichiba_mainitem .blomagaText {
        color: #666666;font-family: 'HGS明朝E','MS 明朝';font-size: 16px;height: 100px;
        padding: 7px 25px 0 15px;text-align: center;white-space: normal;word-break: break-all;word-wrap: break-word;
      }
      .sideIchibaPanel .ichiba_mainitem .blomagaAuthor {
        color: #666666; font-size: 11px;padding: 0 20px 0 10px;text-align: right;
      }
      .sideIchibaPanel .ichiba_mainitem .balloonUe{
        bottom: 12px; display: block; max-width: 266px;
      }
      .sideIchibaPanel .ichiba_mainitem .balloonUe a{
        background: url("/img/watch_zero/ichiba/imgMainBalloonUe.png") no-repeat scroll center top transparent;
        color: #666666 !important;
        display: block;
        font-size: 108%;
        line-height: 1.2em;
        margin: 0 auto;
        padding: 8px 15px 3px;
        text-align: center;
        text-decoration: none;
        word-wrap: break-word;
      }
      .sideIchibaPanel .ichiba_mainitem .balloonShita{
        height: 12px; bottom: 0; left: 0;
      }
      .sideIchibaPanel .ichiba_mainitem .balloonShita img{
        vertical-align: top !important;
      }
      .sideIchibaPanel .ichiba_mainitem .ichibaMarquee {
        display: none;
      }
      .sideIchibaPanel .ichiba_mainitem .thumbnail span {
        font-size: 22px; color: #0066CC;
        font-family: 'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','MS P明朝','MS PMincho',serif;
      }
      .sideIchibaPanel .ichiba_mainitem .action {
        font-size: 85%;
      }
      .sideIchibaPanel .ichiba_mainitem .action .buy {
        font-weight: bolder; color: #f60;
      }
      .sideIchibaPanel .ichiba_mainitem .itemname {
        font-weight: bolder;
      }
      .sideIchibaPanel .ichiba_mainitem .maker {
        font-size: 77%; margin-bottom: 2px;
      }
      .sideIchibaPanel .ichiba_mainitem .price {
      }
      .sideIchibaPanel .ichiba_mainitem .action .click {
        font-weight: bolder;
      }
      .sideIchibaPanel .ichiba_mainitem .goIchiba {
        font-size: 77%; margin: 5px 0;
      }
      .sideIchibaPanel .addIchiba, .sideIchibaPanel .reloadIchiba {
        cursor: pointer;
      }
      .sideIchibaPanel .noitem {
        cursor: pointer;
      }

      #outline .bottomAccessContainer {
        position: absolute; top: 12px;
      }
      #outline .bottomConfButtonContainer {
        position: absolute; top: 12px; right: 0px;
      }
      body.videoExplorer .bottomAccessContainer{
        display: none;
      }
      #outline.under960 .bottomAccessContainer{
        right: 60px;
      }
      .watchItLaterSettingMenu {
        font-weight: bolder;
        white-space: nowrap;
      }
      #outline .sidebar {
        -webkit-transition: margin-top 0.3s ease-out;
        transition:         margin-top 0.3s ease-out;
      }
      #outline.under960 .sidebar {
        margin-top: 24px;
      }
      #videoHeader.menuClosed .watchItLaterMenu, #videoHeader.menuClosed .hidariue { display: none; }
      #videoHeader .watchItLaterMenu {
        position: absolute; width: 100px; left: -55px; top: 32px;
      }
      {* タイトルクリックでヘッダが開閉できるのをわかりやすく *}
      .videoDetailToggleButton:hover {
        text-decoration: underline;
      }
      .videoDetailToggleButton:hover:after {
        content: '▼';
        position: absolute;
        width: 32px;
        height: 20px;
        top: 0;
        bottom: 0;
        right: -32px;
        margin: auto;
        color: #888;
        font-size: 80%;
      }
      .infoActive .videoDetailToggleButton:hover:after {
        content: '▲';
      }

      {* プレイリスト出したり隠したり *}
      #playlist>* {
        -webkit-transition: opacity 0.6s; transition: opacity 0.6s;
      }
      body:not(.full_with_browser):not(.videoExplorer) #playlist.w_closing>* {
        opacity: 0;
      }
      body:not(.full_with_browser):not(.videoExplorer) #playlist:not(.w_show){
        position: absolute; top: -9999px;
      }
      #playlist.w_show{
        {*max-height: 180px;*}
      }
      .playlistToggle:after {
        content: "▼";
      }
      .playlistToggle.w_show:after {
        content: "▲";
      }

      body.videoExplorer #content.w_adjusted #playlist .playlistInformation {
        white-space: nowrap;
      }
      body.videoExplorer #content.w_adjusted #playlist .playlistInformation  .playbackOption {
        position: absolute;
      }
      body.videoExplorer #content.w_adjusted #playlist .playlistInformation  .generationMessage{
        margin-left: 90px; max-width: 350px; overflow: hidden; text-overflow: ellipsis;
      }
      body.videoExplorer #content.w_adjusted #playlist .playlistInformation .browserFullOption {
        position: absolute; right: 0; top: 0;
      }
      body.videoExplorer #content.w_adjusted #playlist .playlistInformation .browserFullOption a {
        background: #444;
      }
      #playlistContainerInner .thumbContainer, #playlistContainerInner .balloon{
        cursor: move;
      }


      {* ページャーの字が小さくてクリックしにくいよね *}
      #resultPagination {
        padding: 5px; font-weight: bolder; border: 1px dotted silter; font-size: 130%;
      }

      #playlistContainer #playlistContainerInner .playlistItem .balloon {
        bottom: auto; top: -2px; padding: auto;
      }

      body.w_channel #leftPanel .userIconContainer{
        display: none;
      }
      {* WatchItLater設定パネル *}
      #watchItLaterConfigPanel {
        position: fixed; bottom: 0px; right: 16px; z-index: 10001;
        width: 460px; padding: 0;
        transition: transform 0.4s ease-in-out; -webkit-transition: -webkit-transform 0.4s ease-in-out;
        transform-origin: 50% 0; -webkit-transform-origin: 50% 0;
        transform: scaleY(0);  -webkit-transform: scaleY(0);
      }
      #watchItLaterConfigPanel.open {
        transform: scaleY(1); -webkit-transform: scaleY(1);
      }
      #watchItLaterConfigPanelShadow {
        position: fixed; bottom: 16px; right: 16px; z-index: 10000;
        width: 460px; height: 559px; padding: 0;
        background: #000; {*box-shadow: 0 0 2px black; border-radius: 8px;*} -webkit-filter: opacity(70%);
        transition: transform 0.4s ease-in-out; -webkit-transition: -webkit-transform 0.4s ease-in-out;
        transform-origin: 50% 0; -webkit-transform-origin: 50% 0;
        transform: scaleY(0); -webkit-transform: scaleY(0);
      }
      #watchItLaterConfigPanelShadow.open {
        transform: scaleY(1); -webkit-transform: scaleY(1);
      }
      #watchItLaterConfigPanelShadowTop {
        position: fixed; bottom: 563px; right:0px; z-index: 10000; background: #333;
        width: 492px; height: 20px; padding: 0; border-radius: 32px; -webkit-filter: opacity(90%); display: none;
      }
      #watchItLaterConfigPanelOverShadow {
        position: fixed; bottom: 575px; right: 0px; width: 488px; height: 8px;
        box-shadow: 0 4px 16px #333;z-index: 10002; display: none;
      }
      #watchItLaterConfigPanel .head {
        background-color: #CCCCCC;border-radius: 0;color: black;height: 50px;
        overflow: hidden;padding: 5px 0 0 16px;position: relative;
      }
      #watchItLaterConfigPanel .head h2 {
        font-size: 135%;
      }
      #watchItLaterConfigPanel .inner{
        height: 500px; overflow-y: auto;border-width: 4px 16px 16px 16px; border-radius: 0 0 16px 16px;
        border-style: solid;border-color: #ccc;
      }
      #watchItLaterConfigPanel ul{
        border-style: inset; border-color: #ccc; border-width: 0 1px 0;
      }
      #watchItLaterConfigPanel ul.shortcutContainer{
        border-width: 0 1px 1px;
      }
      #watchItLaterConfigPanel ul.videoStart{
        border-width: 1px 1px 0;
      }
      #watchItLaterConfigPanel li{
      }
      #watchItLaterConfigPanel li:hover{
        {*background: #ddd;*}
      }
      #watchItLaterConfigPanel li.buggy{
        color: #888;
      }
      #watchItLaterConfigPanel label{
        margin: 0 5px;
      }
      #watchItLaterConfigPanel label:hover{
      }
      #watchItLaterConfigPanel .foot {
        text-align: right; padding: 0 12px;
      }
      #watchItLaterConfigPanel .closeButton{
        border: 0 none;border-radius: 0 0 4px 4px;box-shadow: 0 1px 2px white;color: #666; border: 1px solid #999;
        cursor: pointer;float: right;margin-top: 8px;position: absolute;right: 16px;
        text-shadow: 0 1px 0 white;top: -10px; width: 60px;
      }
      #watchItLaterConfigPanel.autoBrowserFull_false .disableAutoBrowserFullIfNicowari,
      #watchItLaterConfigPanel.autoBrowserFull_true .autoScrollToPlayer,
      #watchItLaterConfigPanel.autoBrowserFull_true .autoOpenSearch,
      #watchItLaterConfigPanel.removeLeftPanel_true .leftPanelJack  {
        color: #ccc; text-shadow: -1px -1px 0 #888;
      }
      #watchItLaterConfigPanel .reload .title:after {
        content: ' (※)'; font-size: 80%; color: #900;
      }
      #watchItLaterConfigPanel .debugOnly {
        display: none;
      }
      #watchItLaterConfigPanel.debugMode .debugOnly {
        display: block; background: #888;
      }
      #watchItLaterConfigPanel .section {
        border-style: solid;border-width: 10px 12px 10px 12px;color: white; font-size: 135%; position: relative;
        font-weight: bolder; cursor: pointer; {*text-shadow: 2px 2px 1px #000000;*}
        transition: border-width 0.2s ease-in-out 0.4s, color 0.3s; -webkit-transition: border-width 0.2s ease-in-out 0.4s, color 0.4s;
      }
      #watchItLaterConfigPanel .open .section {
        border-width: 20px 12px 12px 12px;
        transition: border-width 0.2s ease-in-out     ; -webkit-transition: border-width 0.2s ease-in-out     ;
      }
      #watchItLaterConfigPanel .section:hover:after {
        content: '▼';
        position: absolute; top: 0px; right: 10px; font-size: 150%;
        transition: transform 0.2s ease-in-out 0.4s; -webkit-transition: -webkit-transform 0.2s ease-in-out 0.4s;
      }
      #watchItLaterConfigPanel .open .section:after {
        content: '▼';
        position: absolute; top: 0px; right: 10px; font-size: 150%;
        transform: rotate(180deg); -webkit-transform: rotate(180deg);
        transition: transform 0.2s ease-in-out     ; -webkit-transition: -webkit-transform 0.2s ease-in-out;
      }
      #watchItLaterConfigPanel .section > div {
        padding: 8px 0 8px 12px; box-shadow: 0 0 4px black;
      }
      #watchItLaterConfigPanel .section > div > span {
        {*background: #333;*}
      }
      #watchItLaterConfigPanel li:not(.section) {
        background: #fff; border-width: 0px 0px 0px 24px; border-style: solid; border-color: #fff;
        max-height: 0px; overflow: hidden;
        transition: max-height 0.4s ease-in-out     , border-width 0.4s ease-in-out;
      }
       #watchItLaterConfigPanel .open li:not(.section) {
        max-height: 100px; border-width: 4px 0px 4px 24px;
        transition: max-height 0.4s ease-in-out 0.2s, border-width 0.4s ease-in-out 0.2s;
      }
      #watchItLaterConfigPanel .section .description{
        display: block; font-size: 80%;;
      }
      #watchItLaterConfigPanel .shortcutSetting:not(.enable) span :not(.enable){
        color: silver;
      }
      #watchItLaterConfigPanel .shortcutSetting .enable {
        cursor: pointer; margin: auto 10px;
      }
      #watchItLaterConfigPanel .shortcutSetting        .enable:before {
        content: '○ ';
      }
      #watchItLaterConfigPanel .shortcutSetting.enable .enable:before {
        content: '㋹ '; color: blue;
      }
      #watchItLaterConfigPanel .shortcutSetting      .ctrl, #watchItLaterConfigPanel .shortcutSetting     .alt, #watchItLaterConfigPanel .shortcutSetting       .shift {
        cursor: pointer; border: 2px outset; margin: 4px 4px; padding: 2px 4px; width: 180px; border-radius: 4px;background: #eee;
      }
      #watchItLaterConfigPanel .shortcutSetting.ctrl .ctrl, #watchItLaterConfigPanel .shortcutSetting.alt .alt, #watchItLaterConfigPanel .shortcutSetting.shift .shift {
        border: 2px inset; color: blue;
      }
      #watchItLaterConfigPanel .hoverMenuDelay input {
        width: 50px; ime-mode: disabled; text-align: center;
      }


      {* 動画検索画面に出るお気に入りタグ・お気に入りマイリスト *}
      .videoExplorerMenu .watchItLaterMenu.open,
      .videoExplorerMenu .watchItLaterMenu.opening {
        background: -moz-linear-gradient(center top , #D1D1D1, #FDFDFD) repeat scroll 0 0 transparent !important;
        background: -webkit-gradient(linear, left top, left bottom, from(#D1D1D1), to(#FDFDFD)) !important;
        border-bottom: 0 !important;
      }
      .videoExplorerMenu .watchItLaterMenu {
        position: relative;
        {*background: -moz-linear-gradient(center top , whitesmoke 0%, #E1E1E1 100%) repeat scroll 0 0 transparent;*}
        {*box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1) inset;*}
        {*background: #f5f5f5;*}
        border-bottom: 1px solid #CCCCCC;
      }
      .videoExplorerMenu .watchItLaterMenu:hover{
        background: #dbdbdb;
      }
      .videoExplorerMenu .watchItLaterMenu {
        padding: 0 12px; display: block; color: black;
      }
      .videoExplorerMenu .slideMenu{
        width: 100%; height: auto !important;
        overflow-x: hidden;
        overflow-y: auto;
        padding: 0;
        background: #fdfdfd;
        border-top: 0 !important;
        display: block;
        max-height: 0;
        transition: max-height 0.5s ease-in-out;
      }
      .videoExplorerMenu .slideMenu.open {
        max-height: 2000px;
        transition: max-height   1s ease-in-out;
      }
      .videoExplorerMenu .toggleVideoExplorerMenu a {
        color: black; display: block;
      }
      .videoExplorerMenu .toggleVideoExplorerMenu a:after {
        content: "▼"; position: absolute; background: none; top: 0px; right: 10px; color: #ccc;
      }
      .videoExplorerMenu .toggleVideoExplorerMenu.open a:after {
        content: "▲";
      }

      .videoRankingList .isCategory {
        position: relative;
      }

      .rankingCategoryToggle {
        position: absolute;
        display: none;
        height: 20px;
        padding: 0px 8px;
        right: 14px;
        top: 0;
        cursor: pointer;
        border: 1px solid;
        color: #666;
        outline: none;
      }
      .rankingCategoryToggle::-moz-focus-inner {
        border: 0px;
      }
      .slideMenu.open  .isCategory:hover .rankingCategoryToggle {
        display: block;
      }
      .categoryClose .rankingCategoryToggle .close, .rankingCategoryToggle .open{
        display: none;
      }
      .categoryClose .rankingCategoryToggle .open{
        display: inline;
      }
      .videoRankingList li:not(.isCategory) {
        transition: max-height 0.5s;
        max-height: 50px; overflow:hidden;
        margin-left: 8px;
      }
      .videoRankingList .categoryClose:not(.isCategory) {
        max-height: 0px;
      }


      .videoExplorerMenu .slideMenu ul{
      }
      .videoExplorerMenu .slideMenu ul li{
        background: #fdfdfd; padding: 0; border: 0;font-size: 90%; height: auto !important;
      }
      .videoExplorerMenu .slideMenu ul li a{
        line-height: 165%; background: none; display: block;
      }
      .videoExplorerMenu.w_touch .slideMenu ul li a{
        line-height: 300%; font-size: 120%; color: black;
      }
        .videoExplorerMenu .slideMenu ul li a:before{
          background: url("http://uni.res.nimg.jp/img/zero_my/icon_folder_default.png") no-repeat scroll 0 0 transparent;
          display: inline-block;
          height: 14px;
          margin: -4px 4px 0 0;
          vertical-align: middle;
          width: 18px;
          content: ""
        }
        .videoExplorerMenu .slideMenu ul li          a.defMylist:before{ background-position: 0 -253px;}
        .videoExplorerMenu .slideMenu ul li.folder0  a:before{ background-position: 0 0;}
        .videoExplorerMenu .slideMenu ul li.folder1  a:before{ background-position: 0 -23px;}
        .videoExplorerMenu .slideMenu ul li.folder2  a:before{ background-position: 0 -46px;}
        .videoExplorerMenu .slideMenu ul li.folder3  a:before{ background-position: 0 -69px;}
        .videoExplorerMenu .slideMenu ul li.folder4  a:before{ background-position: 0 -92px;}
        .videoExplorerMenu .slideMenu ul li.folder5  a:before{ background-position: 0 -115px;}
        .videoExplorerMenu .slideMenu ul li.folder6  a:before{ background-position: 0 -138px;}
        .videoExplorerMenu .slideMenu ul li.folder7  a:before{ background-position: 0 -161px;}
        .videoExplorerMenu .slideMenu ul li.folder8  a:before{ background-position: 0 -184px;}
        .videoExplorerMenu .slideMenu ul li.folder9  a:before{ background-position: 0 -207px;}

        .videoExplorerMenu .slideMenu ul li.g_ent2 a:before     {  background-position: 0 -23px;}
        .videoExplorerMenu .slideMenu ul li.g_life2 a:before    {  background-position: 0 -46px;}
        .videoExplorerMenu .slideMenu ul li.g_politics a:before {  background-position: 0 -69px;}
        .videoExplorerMenu .slideMenu ul li.g_tech a:before     {  background-position: 0 -92px;}
        .videoExplorerMenu .slideMenu ul li.g_culture2 a:before {  background-position: 0 -115px;}
        .videoExplorerMenu .slideMenu ul li.g_other a:before    {  background-position: 0 -138px;}
        .videoExplorerMenu .slideMenu ul li.r18 a:before        {  background-position: 0 -207px;}
        .videoExplorerMenu .slideMenu ul li.all        a.all,
        .videoExplorerMenu .slideMenu ul li.g_ent2     a.g_ent2,
        .videoExplorerMenu .slideMenu ul li.g_life2    a.g_life2,
        .videoExplorerMenu .slideMenu ul li.g_politics a.g_politics,
        .videoExplorerMenu .slideMenu ul li.g_tech     a.g_tech,
        .videoExplorerMenu .slideMenu ul li.g_culture2 a.g_culture2,
        .videoExplorerMenu .slideMenu ul li.g_other    a.g_other,
        .videoExplorerMenu .slideMenu ul li.r18        a.r18
        { font-weight: bolder; border-top: 1px dotted #ccc; }


      .videoExplorerMenu .slideMenu ul li a:after{
        background: none !important;
      }
      .videoExplorerMenu .slideMenu ul li a:hover{
        background: #f0f0ff;
      }
      .videoExplorerMenu .slideMenu ul .reload{
        cursor: pointer; border: 1px solid; padding: 0;
      }

      .videoExplorerMenu .tagSearchHistory {
        border-radius: 0px; margin-top: 2px; padding: 4px; background: #ccc;
      }
      .videoExplorerMenu .itemList > li, #videoExplorerExpand {
        background: #f5f5f5;
      }
      .videoExplorerMenu .itemList ul > li:hover {
        background: #e7e7e7;
      }
      .videoExplorerMenu .itemList ul > li.active {
        background: #343434;
      }


      {* 動画タグが1行以下の時 *}
      body:not(.full_with_browser) .tag1Line  #videoTagContainer .tagInner #videoHeaderTagList .toggleTagEdit {
        height: 12px; padding: 6px 4px 2px;
      }
      body:not(.full_with_browser) .tag1Line  #videoTagContainer .tagInner #videoHeaderTagList .toggleTagEdit .toggleText{
        display: none;
      }
      {* 動画タグが2行以下の時 *}
      body:not(.full_with_browser) .tag2Lines #videoTagContainer .tagInner #videoHeaderTagList .toggleTagEdit {
        height: 36px;
      }
      {* タグ領域とプレイヤーの隙間をなくす *}
      body:not(.full_with_browser) #videoTagContainer, body:not(.full_with_browser) #videoHeader .videoMenuToggle {
        margin-bottom: -10px;
      }
      #videoHeaderMenu .searchContainer .searchText {
        margin-top: -8px;
      }

      body.size_small #playerContainerWrapper {
        padding: 0;
      }

      {* ニュース履歴 *}
      body.videoExplorer #textMarquee .openNewsHistory, body.videoExplorer #textMarquee .newsHistory {
        display: none;
      }
      #textMarquee .openNewsHistory {
        position: absolute; width: 30px;
        font-size: 13px; padding: 0; margin: 0; height: 28px;
        cursor: pointer;
        bottom: 0;
        background: none repeat scroll 0 0 transparent;
        border: 1px none;
        border-radius: 2px 2px 2px 2px;
        cursor: pointer;
        right: 18px;
        z-index: 200;
      }
      #textMarquee .newsHistory {
        position: absolute;
        bottom: 0px; right: 0px; width: 100%;
        max-height: 132px;
        min-height: 40px;
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 1;
        padding: 4px;
        display: none;
        background: #333;
        text-align: left;
        font-size: 14px;
        padding: 0;
      }
      #textMarquee .newsHistory li{
        padding: 0 2px;
      }
      #textMarquee .newsHistory li:nth-child(odd){
        background: #444;
      }
      #textMarquee .newsHistory li:nth-child(even){
        background: #333;
      }
      body.full_with_browser.hideNewsInFull #textMarquee .newsHistory {
        display: none !important;
      }
      body #popupMarquee {
        width: 360px;
      }
      {* 半透明だとflashの上に来ると描画されないので強制的に黒にする(Chromeは平気) *}
      body.full_with_browser #popupMarquee.popupMarqueeBottomLeft {
        background: #000 !important; width: 400px; opacity: 1;
      }
      body.full_with_browser #playerContainer {
        margin-left: 0 !important;
      }
      body:not(.full_with_browser) #playerContainer {
        {*top: -8px;*}
      }
      body:not(.full_with_browser) #playerContainerWrapper {
        padding: 0px;
      }
      body.full_with_browser #playerContainer, body.size_small #playerContainer {
        top: auto;
      }
      body.full_with_browser.no_setting_panel .videoExplorerMenu {
        display:none;
      }


      body:not(.videoExplorer) {*#playlist:not(.nico-bucket-videoExplorer-b)*} #videoExplorerExpand {
        display: none;
      }
      #outline .openVideoExplorer {
        display: none;
      }
      #outline.w_hideSearchExpand .openVideoExplorer {
        display: inline-block;
      }

      .videoExplorerMenu .quickSearchInput {
        background: none repeat scroll 0 0 #F4F4F4;
        border: 1px inset silver;
        left