@charset "utf-8";
:root {
    --font-family:
    "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;

    /* 全体の背景色 */
    --background-color-base: #202633;
    --background-color-base-rgb: 32,38,51;
    --background-color-base-hover: #313a50;
    --background-color-light: #293040;
    --background-color-light2: #293040;
    --background-color-light-hover: #394051;

    /* ヘッダー・フッターカラー */
    --header-background-color: #202633;
    --header-bar-border-color: transparent;
    --header-link-color:#fff;
    --header-link-hover-color:#fff;
    --header-link-border-color:#4b8ee3;
    --hedder-text-color-light:#b2b2b2;
    --hedder-text-color-light2:#8b8b8b;
    --header-icon-color:#bebebe;
    --header-icon-color-hover: #e1e1e1;
    --hedder-input-color:#394354;
    --hedder-input-text-color:#fff;
    --hedder-text-color-default:#ffffff;
    --header-border-color-dark:#2f394c;
    --footer-text-color-light:#4b8ee3;
    --header-bottom-background-color: #293040;
    --header-bottom-link-color:#e7eaee;
    /* ヘッダーポイント */
    --header-point-color: var(--header-link-color);
    --header-point-color-hover: var(--header-icon-color-hover);
    --header-point-color-icon: var(--header-point-color);
    
    /* drawer */
    --drawer-logo-arrow-border-color:var(--text-color-light2);
    --drawer-logo-border-bottom-color:var(--border-color-light);
    --drawer-login-list-background-color:var(--background-color-light);
    --drawer-login-btn-background-color:var(--background-color-base);
    /* suggest */
    --suggest-background-color:var(--background-color-light);
    --suggest-border-color:var(--border-color-dark);
    
    /* アイコンなど */
    --icon-color: #a6aec1;
    --icon-color-hover: #d1d6e2;

    /* ボタンカラー */
    --btn-color-disabled: #474b56;
    --btn-color-disabled-text: #71747a;
    --btn-color-delete: #6d7287;
    --btn-color-delete-text: #000;
    --btn-color-delete-hover: #868b9e;
    --btn-color-gray: #293040;
    --btn-color-gray-border: #404B64;
    --btn-color-gray-hover: #404B64;
    --btn-color-gray-text: #e7eaee;
    --btn-color-cover: #4b8ee3;
    --btn-color-cover-text: #fff;
    --btn-color-cover-hover: #3251d9;
    /* 罫線カラー */
    --border-color-light: #353c4d;
    --border-color-dark: #353c4d;

    /* メイン、アクセントカラー#257cec */
    --color-main: #4b8ee3;
    /* --color-main: #5771df; */
    --color-main-rgb: 51,51,51;
    --color-main-hover: #3251d9;
    --color-accent:#ef6786;

     /* タグフィルター選択時の背景 */
     --filter-tag-check-bg: #272f3f;
     --filter-tag-check-mark: var(--color-accent);

    /* ハンバーガーメニュー展開時の全面カバーなど */
    --color-cover-rgb: 0,0,0;

    /* システムメッセージのカラー */
    --system-message-color: #3cba75;
    --system-message-text-color: #fff;
    --warning-border-color: #ffd64f;
    --warning-background-color: #ffd64f;
    --warning-text-color: #4a4432;
    --error-color:#ef6786;
    --error-text-color:#fff;
    --error-color-hover:#EA3B64;
    --cart-btn-popup-background-color:rgb(57 67 84 / 90%);
    --cart-btn-popup-arrow-background-color:#364051;
    --cart-btn-popup-arrow-border-color:#6b7485;
    --cart-btn-popup-text-color:#fff;
    --cart-btn-popup--shadow: 0 0 0 1px #5e6b83;

    /* テキストカラー */
    --text-color-default: #e7eaee;
    --text-color-light: #84909e;
    --text-color-light2: #84909e;
    --text-color-placeholder:#7c858e;
    /* 背景色付き要素のテキストカラー */
    --text-color-with-background:#fff;

    /* Referrence price */
    --pefprice-text: var(--color-accent);

    /* リンクテキストカラー */
    --link-color-default: #e0e4eb;
    --link-color-default-hover: #ffffff;
    --link-color-colored: #4b8ee3;
    --link-color-light: #c5cbd3;

    /* input、textarea、select要素の背景色 */
    --input-color:rgb(57 67 84);
    --input-text-color:var(--text-color-default);
    --input-border: 1px solid #434b5a;
    --input-disabled-background-color:#444444;
    --input-disabled-text-color: #808080;
    --input-disabled-border: 1px solid #5b5b5b;
    --input-color-border: #434b5a;
    
    /* 動画一覧 */
    --text-videolist-price: var(--color-accent);

    /* 動画サムネイル 無料アイコン*/
    --icon-color-free:#264ba2;
    --icon-color-free-text:#e9ebf2;
    --icon-color-free-border-color:transparent;

    /* 動画サムネイル 見放題アイコン */
    --icon-color-subscription:#f1238a;
    --icon-color-subscription-text:#fff;
    --icon-color-subscription-border-color:transparent;

    /* 動画サムネイル 新作・準新作 */
    --icon-color-recent:#000000;
    --icon-color-recent-text:#ffffff;
    --icon-color-recent-border-color:transparent;

    /* video-icon */
    --icon-color-8k:linear-gradient(135deg,#ffd64f 0%, #ffd64f 50%, #fff 50%, #fff 100%);
    --icon-color-8k:transparent;
    --icon-color-8k-text:#ffd64f;
    --icon-color-8k-border-color:#ffd64f;
    
    --icon-color-4k:#ffd64f;
    --icon-color-4k-text:var(--background-color-base);
    --icon-color-4k-border-color:transparent;


    --icon-color-full-hd:transparent;
    --icon-color-full-hd-text:hsl(196.62deg 100% 65%);
    --icon-color-full-hd-border-color:hsl(196.62deg 100% 65% / 70%);

    --icon-color-hd:hsl(196.62deg 100% 65% / 80%);
    --icon-color-hd-text:var(--background-color-base);
    --icon-color-hd-border-color:transparent;

    --icon-color-high:hsl(196.62deg 100% 65% / 55%);
    --icon-color-high-text:#fff;
    --icon-color-high-border-color:transparent;
    
    --icon-color-middle:hsl(196.62deg 100% 80% / 25%);
    --icon-color-middle-text:#fff;
    --icon-color-middle-border-color:transparent;

    /* トップページ ランキングアイコン */
    --icon-color-rank1:#ffc300;
    --icon-color-rank2:#c3c3c3;
    --icon-color-rank3:#dc7c46;
    
    /* icon_required */
    --icon-required-text-color:#fff;
    --icon-required-background-color:var(--color-accent);
    --icon-required-border-color:transparent;
    /* ページトップへ戻るボタン */
    --pagetop-color:0,0,0;
    --pagetop-color-arrow:#fff;

    /* 動画一覧スライダーの前へ・次へボタンカラー */
    --video-slider-color:0,0,0;
    --video-slider-color-arrow:#fff;
    
    --avatar-icon-border-color:var(--border-color-light);
    --avatar-icon-border-color-on-primary-bg:var(--header-border-color-dark);
    --avatar-icon-background-color:var(--background-color-base);
    /* ローディング */
    --loading-back-color:var(--background-color-light);
    --loading-icon-base-color: rgb(255 255 255 / 25%);;
    --loading-icon-accent-color:rgb(255 255 255 / 70%);

    /* まとめ販売・金額と購入エリア */
    --group-detail-price-background: transparent;
    --group-detail-price-border: transparent;
    --group-detail-price-under-border: var(--border-color-light);
    /* まとめ販売ラベル */
    --group-label-purchased-background: var(--border-color-light);
    --group-label-purchased-text: var(--text-color-light);
    --group-label-purchased-border: 1px solid var(--border-color-light);
    /* まとめ販売・作品詳細 */
    --group-detail-border: var(--border-color-light);
    --group-detail-title-border: var(--border-color-light);
    --group-detail-title-icon: var(--text-color-default);
    --group-detail-background: transparent;
    --group-detail-more-text: var(--color-accent);
    --group-detail-more-text-hover: var(--color-accent);
    --group-detail-more-background: transparent;
    --group-detail-more-background-hover: #f2f2f2;
    /* まとめ販売・プレイリスト */
    --playlist-note-text: var(--text-color-light2);
    --playlist-active-background: #4b8ee342;
    --playlist-hover-background: #4b8de318;
    --playlist-time-background: #333;
    --playlist-time-text:#fff;
    --playlist-playing-icon: var(--color-accent);
    --playlist-dl-background: var(--color-main);
    --playlist-dl-text: var(--text-color-with-background);
    --playlist-paid-label-base-background: #393e4b;
    --playlist-paid-label-base-text: #636363;
    /* まとめ販売購入後ラベル */
    --group-detail-purchaselabel-background: var(--group-label-purchased-background);
    --group-detail-purchaselabel-text: var(--group-label-purchased-text);
      /* まとめ販売プレイリストの文字オーバーレイ表示 */
    --playlist-overlay-background:var(--background-color-base);
    --playlist-overlay-border:var(--border-color-light);
    --playlist-overlay-text: var(--text-color-default);
    --playlist-overlay-shadow: 0 0 14px rgba(0,0,0,.6);

      /* 購入ボタンエリア */
      --purchase-btnarea-bg: var(--background-color-light2);

      /* 見放題エリア */
      --unlimited-block-bg: var(--background-color-light2);
      --unlimited-block-radius: 6px;
      --unlimited-block-border: var(--color-accent);
      --unlimited-inner-bg: #202633;
      --unlimited-price-text: var(--pefprice-text);
      --unlimited-price-label: var(--text-color-light);
  
      /* まとめ特別価格 */
      --member-limitedprice-block-bg: #026b70;
      --member-limitedprice-block-radius: 6px;
      --member-limitedprice-inner-bg: #202633;
      --member-limitedprice-border: #373e4e;

      /* 見放題ユーザー向け表示 */
      --unlimited-paid-mark: #fff;
      --unlimited-paid-mark-bg: #2FD1B8;
      --unlimited-paid-raidus: 6px;
  
      /* ボタン角丸 */
      --btn-radius: 50px;
      --btn-font-size: 1.4rem;
      --btn-font-weight: bold;
      /* 購入ボタン - カートにいれる */
      --purchase-btn-cart-bg: var(--background-color-base);
      --purchase-btn-cart-bg-hover: rgba(var(--color-main-rgb), 0.07);
      --purchase-btn-cart-text: var(--color-main);
      --purchase-btn-cart-text-hover: var(--color-main);
      --purchase-btn-cart-border:var(--color-main);
      --purchase-btn-cart-border-hover:var(--color-main);
      /* 購入ボタン - 今すぐ購入 */
      --purchase-btn-buy-bg: var(--color-accent);
      --purchase-btn-buy-bg-hover: var(--color-accent);
      --purchase-btn-buy-text: var(--text-color-with-background);
      --purchase-btn-buy-text-hover: var(--text-color-with-background);
      --purchase-btn-buy-border: var(--color-accent);
      --purchase-btn-buy-border-hover: var(--color-accent);
  
      /* 購入ボタン - 見放題購入ボタン */
      --unlimited-btn-bg:  var(--color-accent);
      --unlimited-btn-bg-hover: var(--color-accent);
      --unlimited-btn-text:var(--text-color-with-background);
      --unlimited-btn-text-hover:var(--text-color-with-background);
      --unlimited-btn-border:1px solid var(--color-accent);
      --unlimited-btn-border-hover:1px solid var(--color-accent);
      --unlimited-btn-radius: 3px;

    /* レビューの星 */
    --star-color-back:#d8d8d8;
    --star-color-front:#ffc300;

    /* Gritter （ポップアップ） */
    /* --gritter-background: #353d52; */
    --gritter-background: rgba(12,14,21 , .8);
    --gritter-box-shadow: 0 0 10px rgba(21,27,40,.9);

    /* 決済画面 */
    --payment-select-background: #30374b;
    --payment-select-background-check: #3b4357;

    /* ポイント履歴 */
    --pointbalance-current-background: var(--background-color-light2);
    --pointbalance-icon: #F7C41C;
    --pointbalance-color-expiry: #ef6786;
    --pointbalance-tab-active-color: var(--text-color-default);
    --pointbalance-tab-active-border: #3251d9;
    --pointbalance-tab-active-background: #2c3958;
    --pointbalance-tab-default-border: var(--border-color-light);
    --pointbalance-table-border: var(--border-color-light);
    --pointbalance-table-base-background: var(--background-color-light2);
    --pointbalance-table-odd-background: #2f3647;
    --pointbalance-pager-background:var(--background-color-base);
    --pointbalance-pager-background-hover:var( --btn-color-cover-hover);
    --pointbalance-pager-text:var(--text-color-default);
    --pointbalance-pager-text-hover: var(--text-color-default);
    --pointbalance-pager-border:var(--border-color-light);
    --pointbalance-pager-border-hover:var( --btn-color-cover-hover);
    --pointbalance-pager-text:var(--text-color-default);
    --pointbalance-list-add: var(--color-main);
    --pointbalance-list-use: #ef6786;

    /* 個別作品一覧エリア */
    --individual-video-lists-head-balloon-text: var(--color-accent);
    --individual-video-lists-head-balloon-back: var(--background-color-base);
    --individual-video-lists-head-balloon-border: var(--color-accent);
    --individual-video-lists-head-label-text: var(--text-color-with-background);
    --individual-video-lists-head-label-back: var(--color-main);
    --individual-video-lists-btn-text: var(--color-main);
    --individual-video-lists-btn-back: var(--background-color-base);
    --individual-video-lists-btn-border: var(--color-main);
    --individual-video-lists-btn-hover: rgba(var(--color-main-rgb), 0.07);

    /* まとめ作品一覧エリア */
    --group-video-lists-head-balloon-text: var(--color-accent);
    --group-video-lists-head-balloon-back: var(--background-color-base);
    --group-video-lists-head-balloon-border: var(--color-accent);
    --group-video-lists-head-label-text: var(--icon-color-subscription-text);
    --group-video-lists-head-label-back: var(--icon-color-subscription);
    --group-video-lists-head-label-border: transparent;
    --group-video-lists-lead-back: var(--background-color-light2);
    --group-video-lists-btn-text: var(--color-main);
    --group-video-lists-btn-back: var(--background-color-base);
    --group-video-lists-btn-border: var(--color-main);
    --group-video-lists-btn-hover: rgba(var(--color-main-rgb), 0.07);

    /* 新TOPページデザイン */
    --top-v2-search-background: var(--background-color-base);
    --top-v2-title-border: transparent;
    --top-v2-nav-border: var(--border-color-dark);
    --top-v2-nav-border-active: var(--color-accent);
    --top-v2-nav-border-size: 3px;
    --top-v2-nav-border-position: -3px;/*Just enter the same pixels as --top-v2-nav-border-size with a negative number*/
    --top-v2-nav-text: var(--text-color-light2);
    --top-v2-nav-text-active: var(--color-accent);
    --top-v2-nav-sp-overlay-background: background: rgb(var(--background-color-base-rgb));
    --top-v2-nav-sp-overlay-gradent: linear-gradient(90deg, rgba(var(--background-color-base-rgb),0) 0%, rgba(var(--background-color-base-rgb),.8) 100%);
    
    --top-v2-pager-background-active: transparent;
    --top-v2-pager-text-active: var(--color-main);
    --top-v2-pager-border-active: var(--color-main);
    /* 新TOPページデザイン - ランク等 */
    --top-v2-list-background: var(--background-color-base);
    --top-v2-list-border: var(--border-color-dark);
    --top-v2-rank-padding: 8px;
    --top-v2-rank-background: var(--background-color-base);
    --top-v2-rank-text: var(--header-link-color);
    --top-v2-rank-radius: 0px;

      /* Referrence price */
      --pefprice-text: var(--color-accent);

    /* sale */
    --sale-discount-badge-background: var(--color-accent);
    --sale-discount-badge-text-color: var(--text-color-with-background);  
    --sale-name-text-color: var(--color-accent);
    --on-sale-price-original-text-color: var(--text-color-light2);
    --sale-overview_wrap-background: var(--reserve-price-note-background);
    
      /* 予約 */
    --reserve-border: var(--color-accent);
    --reserve-background: #293040;
    --reserve-radius: 0px;
    --reserve-padding: 12px;
    --reserve-label-background: var(--background-color-base);
    --reserve-label-text: var(--color-accent);
    --reserve-label-border: 1px solid var(--color-accent);

    --reserve-price-note-background: #ef67863d;
    --reserve-price-note-text: #f2e0e4;
    --reserve-price-note-radius: 0;
    
    --reserve-price-title-background: var(--reserve-price-note-background);
    --reserve-price-title-text: var(--reserve-price-note-text);

    --reserve-pay-background:var(--background-color-light);
    --reserve-pay-border: 1px solid transparent;
    --reserve-pay-border-ischeck: 1px solid var(--color-main);
    --reserve-pay-radius: 4px;
    
    /* leave */
    --leave-notes-list-border: var(--warning-border-color);
    --leave-icon-background:var(--warning-background-color);
    --leave-icon-text:var(--background-color-base);
    --leave-notes-warning-background: var(--error-color);
    --leave-notes-warning-border:none;
    --leave-notes-warning-text-color:var(--error-text-color);
    --leave-notes-warning-text-strong-color:var(--error-text-color);

    /* pay_plan */
    --pay-plan-label-background-color:var(--background-color-light2);
    --pay-plan-label-text-color:var(--text-color-default);
    --pay-plan-label-border-color:var(--border-color-light);
    --pay-plan-label-active-border-color:var(--color-main);
    --pay-plan-cacheBox-title-text-color:var(--text-color-default);
    --pay-plan-cacheBox-title-active-text-color:var(--text-color-default);
    --pay-plan-paymentmethod-detail-border-color:var(--border-color-light);
    --pay-plan-currency-amount-text-color:var(--text-color-light2);
    --pay-plan-amount-text-color:var(--color-accent);
    --pay-plan-select-this-plan-background-color:var(--background-color-base);
    --pay-plan-select-this-plan-text-color:var(--text-color-default);
    --pay-plan-select-this-plan-border-color:var(--border-color-light);
    --pay-plan-select-this-plan-active-background-color:hsl(346.32deg 80.95% 67.06% / 6%);
    --pay-plan-select-this-plan-active-text-color:var(--color-accent);
    --pay-plan-select-this-plan-active-border-color:var(--color-accent);
    
    /* popup-upload */
    --popup-upload-form-text-color:var(--text-color-light2);
    --popup-upload-file-item-background:var(--background-color-light2);
    --popup-upload-file-media-dl-btn-background:var(--background-color-base);
    --popup-upload-file-media-dl-btn-text-color:var(--btn-color-gray-text);
    --popup-upload-file-media-dl-btn-border-color:var(--btn-color-gray-border);
    --popup-upload-file-media-dl-btn-hover-background:var(--btn-color-gray-hover);
    --popup-upload-file-media-delete-btn-background:var(--btn-color-delete);
    --popup-upload-file-media-delete-btn-text-color:var(--btn-color-delete-text);
    --popup-upload-file-media-delete-btn-hover-background:var(--btn-color-delete-hover);

    /* フッタ */
    --footer-payment-info: #fff;

    /* skeleton */
    --skeleton-background: var(--background-color-light);
    --skeleton-shimmer-gradient-transparent: rgba(var(--background-color-base-rgb),0);
    --skeleton-shimmer-gradient-background: rgba(var(--background-color-base-rgb),0.48);

    /* agree */
    --agree-label-border-color:var(--border-color-light);
    --agree-label-text-color:var(--text-color-default);
    --agree-label-background-color:transparent;
    
    --agree-label-main-background-color:var(--background-color-light2);
    
    --agree-checkbox-border-color:var(--text-color-default);
    --agree-checkbox-background-color:var(--background-color-base);
    
    --agree-checked-label-border-color:#3cba75;
    --agree-checked-label-text-color:var(--system-message-text-color);
    --agree-checked-label-background-color:transparent;
    
    --agree-checked-label-main-background-color:var(--system-message-color);
    
    --agree-checked-checkbox-border-color:transparent;
    --agree-checked-checkbox-background-color:#fff;
    
    --agree-checked-checkbox-mark-border-color:var(--agree-checked-label-border-color);

    /* monthly-plan-pr-area */
    --monthly-plan-pr-section-title-text-color:var(--text-color-default);
    --monthly-plan-pr-plan-banner-background-color:var(--background-color-light2);
    --monthly-plan-pr-video-count-bar-text-color:var(--text-color-default);
    --monthly-plan-pr-video-count-bar-border-color:var(--border-color-light);
    --monthly-plan-pr-video-count-bar-background-color:var(--background-color-base);
    --monthly-plan-pr-plan-info-border-color:var(--monthly-plan-pr-video-count-bar-border-color);
    --monthly-plan-pr-plan-info-background-color:var(--monthly-plan-pr-video-count-bar-background-color);
    --monthly-plan-pr-plan-price-text-color:var(--text-color-default);
    --monthly-plan-pr-plan-info-right-background-color:var(--background-color-light2);
    --monthly-plan-pr-join-btn-bg:var(--purchase-btn-buy-bg);
    --monthly-plan-pr-join-btn-text:var(--purchase-btn-buy-text);
    --monthly-plan-pr-join-btn-border:var(--purchase-btn-buy-border);
    --monthly-plan-pr-join-btn-bg-hover:var(--purchase-btn-buy-bg-hover);
    --monthly-plan-pr-join-btn-text-hover:var(--purchase-btn-buy-text-hover);
    --monthly-plan-pr-join-btn-border-hover:var(--purchase-btn-buy-border-hover);
    --monthly-plan-pr-unlimited_message-bg:transparent;
    --monthly-plan-pr-unlimited_message-text:inherit;
    --monthly-plan-pr-unlimited_message-border:var(--text-color-light);
    --monthly-plan-pr-plan-image-link-border-color:transparent;
    --monthly-plan-pr-plan-image-link-background-color:hsl(221.74deg 21.9% 24%);
    --monthly-plan-pr-plan-image-link-text-text-color:hsl(221.74deg 21.9% 12%); 

    /* plan */
    --pay-plan-monthly-main-color:#ec365d;
    
    --plan-info-title-text-color:var(--pay-plan-monthly-main-color);
    --plan-info-count-text-color:var(--pay-plan-monthly-main-color);
    --plan-info-count-date-text-color:var(--text-color-light2);
    
    --p-pay-selectPayment-background-color:#ffffff10;
    --p-pay-selectPayment-border-color:transparent;
    
    --pay-plan-list-background-color:var(--background-color-base);
    --pay-plan-list-border-color:rgba(0, 0, 0, 0.17);
    
    --pay-plan-list-selected-background-color:hsl(292.5deg 17.02% 18.43%);
    --pay-plan-list-selected-border-color:var(--pay-plan-monthly-main-color);
    
    --pay-plan-list-title-background-color:transparent;
    --pay-plan-list-title-border-color:rgba(0, 0, 0, 0.08);
    --pay-plan-list-title-text-color:var(--pay-plan-monthly-main-color);
    
    --pay-plan-list-recommend-background-color:var(--background-color-base);
    --pay-plan-list-recommend-border-color:var(--pay-plan-monthly-main-color);
    --pay-plan-list-recommend-text-color:var(--pay-plan-monthly-main-color);
    
    --pay-plan-list-descriptio-text-color:var(--text-color-light);
    
    --pay-plan-list-purchase-btn-background-color:var(--pay-plan-monthly-main-color);
    --pay-plan-list-purchase-btn-border-color:transparent;
    --pay-plan-list-purchase-btn-text-color:#fff;
    --pay-plan-list-purchase-btn-hover-background-color:hsl(347.14deg 82.73% 48%);
    --pay-plan-list-purchase-btn-hover-border-color:var(--pay-plan-list-purchase-btn-border-color);
    --pay-plan-list-purchase-btn-hover-text-color:var(--pay-plan-list-purchase-btn-text-color);
    
    --pay-plan-list-notice-background-color:var(--text-color-light2);
    
    --pay-plan-list-recommend-background-color:var(--background-color-base);
    --pay-plan-list-recommend-border-color:var(--pay-plan-monthly-main-color);
    --pay-plan-list-recommend-text-color:var(--pay-plan-monthly-main-color);

    --pay-plan-list-plan-feature-item-background-color:transparent;
    --pay-plan-list-plan-feature-item-border-color:var(--border-color-light);
    --pay-plan-list-plan-feature-item-box-shadow:0px 0px 14px 0px rgba(255, 255, 255, 0.06);

    /* plan_panel */
    --plan-panel-no-plan-background-color:var(--background-color-light2);
    --plan-panel-no-plan-text-color:var(--text-color-light);
    --plan-panel-no-plan-border-color:transparent;

    --plan-panel-plan-monthly-recommend-background-color:transparent;
    --plan-panel-plan-monthly-recommend-border-color:var(--border-color-dark);

    --plan-monthly-recommend-btn-background-color:var(--pay-plan-monthly-main-color);
    --plan-monthly-recommend-btn-border-color:transparent;
    --plan-monthly-recommend-btn-text-color:#fff;
    --plan-monthly-recommend-btn-hover-background-color:hsl(347.14deg 82.73% 50%);
    --plan-monthly-recommend-btn-hover-border-color:var(--plan-monthly-recommend-btn-border-color);
    --plan-monthly-recommend-btn-hover-text-color:var(--plan-monthly-recommend-btn-text-color);

    --plan-panel-cancel-link-text-color:var(--link-color-light);  

    --plan-panel-canceled-notice-icon-color:var(--warning-background-color);  
    
    --plan-panel-border-color: var(--border-color-dark);
    --plan-panel-bg: var(--background-color-base);
    --plan-panel-head-bg: var(--background-color-light2);
    --plan-panel-status-active-bg: var(--pay-plan-monthly-main-color);
    --plan-panel-status-canceled-bg: #808080;
    --plan-panel-status-active-text-color: #fff;
    --plan-panel-status-canceled-text-color: #333333;
    --plan-panel-info-list-canceled-next-color: #868686;
    --plan-panel-info-list-next-color: var(--text-color-light);

    /* plan-retention */
    --plan-retention-notice-bg: transparent;
    --plan-retention-notice-border-color:var(--color-accent);
    --plan-retention-notice-title-color: var(--color-accent);
    --plan-retention-plan-info-bg: hsl(221.74deg 21.9% 23%);
    --plan-retention-recommend-box-bg: var(--background-color-light2);
    --plan-retention-recommend-back-link-bg: #ffffff12;
    --plan-retention-recommend-back-link-bg-hover: #ffffff24;
    --plan-retention-action-btn-border: var(--color-accent);
    --plan-retention-action-btn-color:var(--color-accent);
    --plan-retention-action-btn-bg: var(--background-color-base);
    --plan-retention-action-btn-bg-hover: #000d2a;
    --plan-retention-arrow-border-color: var(--text-color-light);
    /* manager-edit-video */
    --manager-edit-video-title-notes-color:var(--error-text-color);

    /* release-date-note */
    --automatic-price-changes-wrap-background-color:transparent;
    --automatic-price-changes-wrap-text-color:var(--text-color-light);
    --automatic-price-changes-wrap-border-color:var(--release-date-note-border-color);
    --automatic-price-changes-wrap-head-text-color:var(--text-color-default);
    
    --release-date-notes_underline-background-color:hsl(221.05deg 12.9% 29.08%);;
    --release-date-notes_underline-text-color:var(--text-color-default);
    
    --release-date-note-lead-text-color:var(--automatic-price-changes-wrap-text-color);
    
    --release-date-note-background-color:transparent;
    --release-date-note-text-color:var(--automatic-price-changes-wrap-text-color);
    --release-date-note-border-color:var(--border-color-dark); 
    
    /* price_pattern_videos */
    --price-pattern-status-icon-new-background-color:var(--text-color-default);
    --price-pattern-status-icon-new-text-color:var(--background-color-base);
    --price-pattern-status-icon-new-border-color:transparent;

    --price-pattern-status-icon-recent-background-color:var(--background-color-base);
    --price-pattern-status-icon-recent-text-color:var(--text-color-default);
    --price-pattern-status-icon-recent-border-color:var(--text-color-default);

    --price-pattern-status-icon-normal-background-color:hsl(222 22% 40% / 1);;
    --price-pattern-status-icon-normal-text-color:var(--text-color-default);
    --price-pattern-status-icon-normal-border-color:transparent;
    
    --price-pattern-status-searchwrapper-background-color:var(--background-color-light2);
    --price-pattern-status-searchwrapper-border-color:transparent;

    --price-pattern-status-price-pattern-table-background-color:transparent;
    --price-pattern-status-price-pattern-table-text-color:inherit;
    --price-pattern-status-price-pattern-table-border-color:transparent;

    --price-pattern-status-price-pattern-th-background-color:var(--background-color-light2);
    --price-pattern-status-price-pattern-th-text-color:inherit;
    
    --price-pattern-status-price-pattern-tr-text-color:rgba(255, 255, 255, 0.3);
    
    --price-pattern-status-price-pattern-background-color:hsl(221.05deg 12.9% 29.08%);
    --price-pattern-status-price-pattern-text-color:inherit;

    --price-pattern-status-toolchip-background-color:var(--text-color-default);
    --price-pattern-status-toolchip-text-color:var(--background-color-base);
    --price-pattern-status-toolchip-box-shadow: 0px 4px 12px 0px rgba(255, 255, 255, 0.25);
    
    --price-pattern-status-submit-wrapper-background-color:var(--price-pattern-status-price-pattern-background-color);
    --price-pattern-status-submit-wrapper-text-color:inherit;
    --price-pattern-status-submit-wrapper-border-color:rgba(255, 255, 255, 0.2);
    --price-pattern-status-submit-wrapper-box-shadow: 0 -12px 12px -8px #ffffff17;

    --price-pattern-status-page-link-background-color:var(--text-color-default);
    --price-pattern-status-page-link-text-color:var(--background-color-base);
    --price-pattern-status-page-link-border-color:transparent;

    --price-pattern-status-page-link-current-background-color:var(--background-color-base);
    --price-pattern-status-page-link-current-text-color:var(--text-color-default);
    --price-pattern-status-page-link-current-border-color:var(--text-color-default);

    /* min_purchase_error */
    --min-purchase-error-bg-color:rgba(239, 103, 134, 0.13);
    --min-purchase-error-text-color:var(--color-accent);
    --min-purchase-error-border:1px solid transparent;

    --min-purchase-back-btn-bg-color:transparent;
    --min-purchase-back-btn-text-color:var(--color-accent);
    --min-purchase-back-btn-border:1px solid var(--color-accent);
    --min-purchase-back-btn-border-radius:4px;
    
    --min-purchase-back-btn-hover-bg-color:var(--background-color-base);
    --min-purchase-back-btn-hover-hover-text-color:var(--min-purchase-back-btn-text-color);
    --min-purchase-back-btn-hover-border:var(--min-purchase-back-btn-border);

    --min-purchase-back-btn-arrow-border:solid 1px currentColor;

    /* pay-select-recommendation-lists */
    --pay-select-recommendation-lists-bg-color:var(--background-color-base);
    --pay-select-recommendation-lists-border: 1px solid var(--border-color-dark);
    --pay-select-recommendation-lists-box-shadow:0 0 12px 0 #ffffff12;
    
    --pay-select-recommendation-lists-li-border: 1px solid var(--border-color-dark);

    /* video-member-only */
    --video-member-only-head-balloon-paid-member-only-bg-color:#F8F7F7;
    --video-member-only-head-balloon-paid-member-only-text-color:rgba(0, 0, 0, 0.8);

    --video-member-only-head-balloon-recurring-member-only-bg-color:#EC365D;
    --video-member-only-head-balloon-recurring-member-only-text-color:#fff;

    --video-member-only-head-balloon-recentry-paid-member-only-bg-color:#ffd64f;
    --video-member-only-head-balloon-recentry-paid-member-only-text-color:rgba(0, 0, 0, 0.8);
    
    --video-member-only-head-balloon-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.30);
    --video-member-only-btn-wrap-signup_link:var(--text-color-with-background);

    /* video-browser-notice */
    --video-browser-notice-bg-color:transparent;
    --video-browser-notice-border:1px solid var(--warning-border-color);
    --video-browser-notice-text-color:inherit;
}