:root {
    /*buttonボーダーカラー*/
    --pp-btn-border-color: #8CB2BB;
    /*ホワイト*/
    --pp-white: #ffffff;
    /*ブラック*/
    --pp-black: #212121;
    /*オレンジ*/
    --pp-orange: #ef8000;
    /*クロムイエロー*/
    --pp-chorome-yellow: #ffb400;
    /*ターコイズブルー*/
    --pp-turquoise-blue: #02c2b8;
    /*グリーン*/
    --pp-green: #06bc6e;
    /*アンバーホワイト*/
    --pp-amber-white: #fef3e7;
    /*エクルベージュ*/
    --pp-ecru-beige: #f9ead9;
    /*とりのこいろ*/
    --pp-torinoko: #fff9e1;
    /*うのはないろ*/
    --pp-unohana: #e7fdfc;
    /*スノーホワイト*/
    --pp-snow-white: #ebfcf5;
    /*さくらいろ*/
    --pp-sakura: #fceff3;
    /*レッド*/
    --pp-red: #ff0000;
    /*ローズ*/
    --pp-rose: #f12b68;
    /*Whitesmoke*/
    --pp-whitesmoke: #f5f5f5;
    /*Azure*/
    --pp-azure: #f0ffff;
    /*Ghostwhite*/
    --pp-ghostwhite: #f8f8ff;
    /*うすみどり*/
    --pp-light-green: #cee6c1;
}

/*ホワイト*/
.bg-pp-white {
    background-color: var(--pp-white) !important;
    color: var(--pp-black) !important;
}

.font-pp-white {
    color: var(--pp-white) !important;
}

/*ブラック*/
.bg-pp-black {
    background-color: var(--pp-black) !important;
    color: var(--pp-white);
}

.font-pp-black {
    color: var(--pp-black) !important;
}

/*オレンジ*/
.bg-pp-orange {
    background-color: var(--pp-orange) !important;
}

/*クロムイエロー*/
.bg-pp-chorome-yellow {
    background-color: var(--pp-chorome-yellow) !important;
}

.font-pp-chorome-yellow {
    color: var(--pp-chorome-yellow) !important;
}

/*ターコイズブルー*/
.bg-pp-turquoise-blue {
    background-color: var(--pp-turquoise-blue) !important;
}

/*グリーン*/
.bg-pp-green {
    background-color: var(--pp-green) !important;
}

/*アンバーホワイト*/
.bg-pp-amber-white {
    background-color: var(--pp-amber-white) !important;
}

/*エクルベージュ*/
.bg-pp-ecru-beige {
    background-color: var(--pp-ecru-beige) !important;
}

/*とりのこいろ*/
.bg-pp-torinoko {
    background-color: var(--pp-torinoko) !important;
}

/*うのはないろ*/
.bg-pp-unohana {
    background-color: var(--pp-unohana) !important;
}

/*スノーホワイト*/
.bg-pp-snow-white {
    background-color: var(--pp-snow-white) !important;
}

/*さくらいろ*/
.bg-pp-sakura {
    background-color: var(--pp-sakura) !important;
}

/*レッド*/
.bg-pp-red {
    background-color: var(--pp-red) !important;
}

/*ローズ*/
.bg-pp-rose {
    background-color: var(--pp-rose) !important;
}

/*Whitesmoke*/
.bg-pp-whitesmoke {
    background-color: var(--pp-whitesmoke) !important;
}

/*Azure*/
.bg-pp-azure {
    background-color: var(--pp-azure) !important;
}

/*Ghostwhite*/
.bg-pp-ghostwhite {
    background-color: var(--pp-ghostwhite) !important;
}

/*うすみどり*/
.bg-pp-light-green {
    background-color: var(--pp-light-green) !important;
}