/*================ 色の定義 ================*/
/*
Brown
  50:  #f8f5f3
  900: #443532
  900-opacity-50: rgba(68, 53, 50, 0.5)
Orange
  100: #ffedd5
  500: #fd6617
Yellow
  200: #fffae1
  300: #ffb238
Teal
  200: #a8eaef
  500: #26acb1
Red
  50:  #fdf2f2
  100: #f6eae7
  400: #ff565d
  300: #E8B7B2
  700: #cf0000
Gray
  50:  #fafafa
  200: #e2e8f0
  600: #5C5C5C
Black: #000000
White:
  #ffffff
  opacity-60: rgba(255, 255, 255, 0.6)
LINE
  #06c755
*/
/*=========================================*/

/*================= Primary =================*/
.text-primary           { color: #ff809a; }
.bg-primary  { background-color: #ff809a; }
.border-primary  { border-color: #ff809a; }

/*================= Secondary =================*/
.text-secondary          { color: #26acb1; }
.bg-secondary { background-color: #26acb1; }
.border-secondary { border-color: #26acb1; }



/*================= Brown =================*/
/* 50 */
.text-brown-50          { color: #f8f5f3; }
.bg-brown-50 { background-color: #f8f5f3; }
.border-brown-50 { border-color: #f8f5f3; }

/* 200 */
.text-brown-200         { color: #d0c6b8; }
.bg-brown-200 { background-color: #d0c6b8; }
.border-brown-200 { border-color: #d0c6b8; }

/* 900 */
.text-brown-900          { color: #443532; }
.bg-brown-900 { background-color: #443532; }
.border-brown-900 { border-color: #443532; }

/* 900 opacity-50 */
.text-brown-900-opacity-50          { color: rgba(68, 53, 50, 0.5); }
.bg-brown-900-opacity-50 { background-color: rgba(68, 53, 50, 0.5); }
.border-brown-900-opacity-50 { border-color: rgba(68, 53, 50, 0.5); }
/*=========================================*/


/*================= Orange =================*/
/* 100 */
.text-orange-100          { color: #ffedd5; }
.bg-orange-100 { background-color: #ffedd5; }
.border-orange-100 { border-color: #ffedd5; }

/* 500 */
.text-orange-500          { color: #fd6617; }
.bg-orange-500 { background-color: #fd6617; }
.border-orange-500 { border-color: #fd6617; }
/*==========================================*/


/*================= Yellow =================*/
/* 200 */
.text-yellow-200          { color: #fffae1; }
.bg-yellow-200 { background-color: #fffae1; }
.border-yellow-200 { border-color: #fffae1; }

/* 300 */
.text-yellow-300          { color: #ffb238; }
.bg-yellow-300 { background-color: #ffb238; }
.border-yellow-300 { border-color: #FFB238; }
/*==========================================*/


/*================== Teal ==================*/
/* 200 */
.text-teal-200          { color: #a8eaef; }
.bg-teal-200 { background-color: #a8eaef; }
.border-teal-200 { border-color: #a8eaef; }

/* 500 */
.text-teal-500          { color: #26acb1; }
.bg-teal-500 { background-color: #26acb1; }
.border-teal-500 { border-color: #26acb1; }
/*==========================================*/


/*================== Red ==================*/
/* 50 */
.text-red-50          { color: #fdf2f2; }
.bg-red-50 { background-color: #fdf2f2; }
.border-red-50 { border-color: #fdf2f2; }

/* 100 */
.text-red-100          { color: #f6eae7; }
.bg-red-100 { background-color: #f6eae7; }
.border-red-100 { border-color: #f6eae7; }

/* 300 */
.text-red-300          { color: #E8B7B2; }
.bg-red-300 { background-color: #E8B7B2; }
.border-red-300 { border-color: #E8B7B2; }

/* 400 */
.text-red-400          { color: #FF565D; }
.bg-red-400 { background-color: #FF565D; }
.border-red-400 { border-color: #FF565D; }

/* 700 */
.text-red-700          { color: #cf0000; }
.bg-red-700 { background-color: #cf0000; }
.border-red-700 { border-color: #cf0000; }
/*=========================================*/


/*================== Gray ==================*/
/* 50 */
.text-gray-50          { color: #fafafa; }
.bg-gray-50 { background-color: #fafafa; }
.border-gray-50 { border-color: #fafafa; }

/* 100 */
.text-gray-100          { color: #F0F0F0; }
.bg-gray-100 { background-color: #F0F0F0; }
.border-gray-100 { border-color: #F0F0F0; }

/* 200 */
.text-gray-200          { color: #e2e8f0; }
.bg-gray-200 { background-color: #e2e8f0; }
.border-gray-200 { border-color: #e2e8f0; }

/* 600 */
.text-gray-600          { color: #5C5C5C; }
.bg-gray-600 { background-color: #5C5C5C; }
.border-gray-600 { border-color: #5C5C5C; }
/*==========================================*/


/*================= Black =================*/
.text-black { color: #000000; }
.bg-black { background-color: #000000; }
.border-black { border-color: #000000; }
/*=========================================*/


/*================= White =================*/
.text-white          { color: #ffffff; }
.bg-white { background-color: #ffffff; }
.border-white { border-color: #ffffff; }

/* opacity-60 */
.text-white-opacity-60          { color: rgba(255, 255, 255, 0.6); }
.bg-white-opacity-60 { background-color: rgba(255, 255, 255, 0.6); }
.border-white-opacity-60 { border-color: rgba(255, 255, 255, 0.6); }

/* opacity-80 */
.text-white-opacity-80          { color: rgba(255, 255, 255, 0.8); }
.bg-white-opacity-80 { background-color: rgba(255, 255, 255, 0.8); }
.border-white-opacity-80 { border-color: rgba(255, 255, 255, 0.8); }
/*=========================================*/


/*================= LINE ==================*/
.text-line          { color: #06c755; }
.bg-line { background-color: #06c755; }
.border-line { border-color: #06c755; }
/*=========================================*/