/* ------------------------------
　　CSS変数
------------------------------ */
:root {

/* カラー */
--color-primary         : #1b120f;
--color-primary-light   : #e5f5ff;
--color-primary-bg      : var(--color-primary-light);
--color-primary-hover   : #525252;

--color-secondary       : #e7190a;
--color-secondary-hover : #f55e3c;

--color-tertiary       : #f1f1eb;
--color-tertiary-light : #f8f8f5;
--color-tertiary-bg    : #efefec;

--color-white           : #FFF;
--color-black           : #333333;

--color-gray10          : #f8f8f5;
--color-gray20          : #f1f1eb;
--color-gray30          : #efefec;
--color-gray40          : #eee9e7;
--color-gray50          : #d2cdcb;
--color-gray60          : #b7b3b1;
--color-gray70          : #6a6663;
--color-gray80          : #534741;
--color-gray90          : #424141;
--color-gray100         : #2d2d2d;

--color-form-bg          : var(--color-gray10);
--color-form-border      : var(--color-gray40);
--color-text-base        : var(--color-primary);
--color-text-placeholder : #cccccc;
--color-border-base      : #cccccc;
--color-bg-light         : var(--color-tertiary-bg);
--color-border-light     : var(--color-tertiary-bg);

--color-link            : #0061d1;

--color-required        : #c92d2d;
--color-error           : var(--color-required);
--color-text-danger     : var(--color-required);

--color-text            : var(--color-gray100);
--color-text-side       : var(--color-gray90);
--color-text-inverse    : var(--color-white);

--color-text-primary    : var(--color-primary);
--color-text-secondary  : var(--color-secondary);

--color-text-point      : #676767;

--box-shadow-error      : 0 0 0 2px rgba(201, 45, 45, .4);
}