@charset "utf-8";
:root {
    --backcolor-white: #fff;
    /** base.css */
    --font-normal: 400;
    --font-bold: 700;
    
    /* メインカラー */
    --color-main: #037dd1;
    --color-main-medium: #bee4ff;
    --color-main-light: #f4fafe;

    /* アクセントカラー1 */
    --color-accent1: #f23f0f;
    --color-accent1-light: #fcf2f0;

    /* アクセントカラー2 */
    --color-accent2: #fc822e;
    --color-accent2-light: #fff6d8;

    /* テーマカラー */
    --color-gray: #a8a8a8;
    --color-gray-medium: #c9caca;
    --color-gray-light: #f7f7f7;
    
    /* 線の色 */
    --color-black: #000;
    --color-red: #e60012;

    /* 文字色 */
    --text-red: #e60012;
    --text-link: #172a88;
    --text-link-light: #037dd1;
    --text-light-gray: #d0d0d0;
    --text-gray: #7e7e7e;

    /** 商品テキスト色 */
    --item-text: #3a3a3a;
    --item-text-note: #dd0606;
    --item-text-rmtaxprice: #dd0606;
    --item-text-price: #000;

    /* お気に入りアイコン */
    --fav-bgcolor1: var(--color-main);
    --fav-bgcolor2: var(--color-main-medium);
    
    /* 配送便 受付 */
    --deliverytime-much-bgcolor: var(--color-accent1);
    --deliverytime-few-bgcolor: var(--color-main);

    /* 配送方法指定 */
    --receive-delivery-bgcolor: var(--color-main-light);
    --receive-store-bgcolor: var(--color-accent1-light);    

    /* マイページ アイコン色 */
    --mypage-icon-color: var(--color-main);

    /* 戻る等のリンクバンド 背景色 */
    --linkband-bgcolor: #f6f6f6;

    /* ハンバーガーメニュー */
    --hamburgermenu-color: #3a3a3a;

    /* スクロールバー */
    --scroll-color: #cacaca;
    
    /* stepフロー */
    --stepbar-color: #9fa0a0;
    
    /* 店舗トップ ポップアップクーポン */
    --coupon-popup-text: #f23f0f;
    --coupon-popup-color: #fbccbf;
    --coupon-popup-bgcolor: #f23f0f;

    /* ヘッダー 追加注文中の帯 */
    --after-ordering-change-label: var(--color-accent1);

    /* ヘッダー クーポン */
    --coupon-header-text: var(--color-accent1);
    --coupon-header-color: var(--color-accent1);
    --coupon-header-bgcolor: var(--color-accent1-light);

    /* ページトップへボタン */
    --gotop-bgcolor: var(--color-gray-medium);

    /* 緊急表示 */
    --warning-bgcolor: var(--color-accent1-light);
    --warning-text: var(--text-red);

    /* サイトトップTOPイメージ */
    --sitetop-topinfo-bgcolor: var(--color-gray-light);

    /* 登録フォーム */
    --form-bgcolor: #fafafa;
    --form-error-color: #cc0606;
    --form-error-text: #cc0606;
    --form-error-bgcolor: #f9d7db;
    --form-label-text: #595757;
    --form-notice-text: #898989;

    /* タブ */
    --tab-color: #e3e3e3;
    --tab-text: #9e9e9e;

    --box-bgcolor: #f0f0f0; 
    --itemcheck-bgcolor: #f2f2f2;

    /** layout.css */
    --nav-bgcolor-current: #efefef;
    --nav-bgcolor-group: #f7f7f7;
    --nav-icon-color: #3a3a3a;
  
    /** mypage.css */
    --fs_pc_s1: 1.4rem;
    --fs_tab_s1: calc(1.2rem + 2 * (100vw - 520px)/440);
    --fs_sp_s1: 1.2rem;
    --fs_pc_df: 1.6rem;
    --fs_tab_df: calc(1.4rem + 2 * (100vw - 520px)/440);
    --fs_sp_df: 1.4rem;
    --fs_pc_l2: 2.4rem;
    --fs_tab_l2: calc(1.7rem + 7 * (100vw - 520px)/440);
    --fs_sp_l2: 1.7rem;

    /* 区切り線 */
    --separator-color: #d6d6d6;
    --separator-color-light: #efefef;
  
    /** カート背景色 */
    --cart-bgcolor: #f0f0f0;
    --cart-separator-bgcolor: #5b5b5b;

    /** 商品名表示行数 */
    --item-name-line-clamp: 2;
}