@charset "UTF-8";
/* CSS Document */

/*
 * Copyright (c) 2006-2019 LeARU Inc
 */


/*蛍光ペンの設定
---------------------------------------------------------------------------*/

/*蛍光ペン(黄色)*/
.mk-yellow  { 
background-image: linear-gradient(transparent 50%, rgb(252,238,33) 50%);
}
/*アニメーション蛍光ペン（黄色・太）*/
.mk-yellow1 {
background-image: -webkit-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: -moz-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: -ms-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: -o-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-repeat: repeat-x;
background-size: 200% .8em;
background-position: 0 .5em;
transition: all 2s ease;
}
.mk-yellow1.start {
background-position: -100% .5em;
}
/*アニメーション蛍光ペン（黄色・細）*/
.mk-yellow2 {
background-image: -webkit-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: -moz-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: -ms-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: -o-linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-image: linear-gradient(left, transparent 50%, rgb(252,238,33) 50%);
background-repeat: repeat-x;
background-size: 200% .3em;
background-position: 0 .9em;
transition: all 2s ease;
}
.mk-yellow2.start {
background-position: -100% .9em;
}
/*蛍光ペン(ピンク)*/
.mk-pink  { 
background-image: linear-gradient(transparent 50%, rgb(250,212,213) 50%);
}
/*アニメーション蛍光ペン（ピンク・太）*/
.mk-pink1 {
background-image: -webkit-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: -moz-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: -ms-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: -o-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-repeat: repeat-x;
background-size: 200% .8em;
background-position: 0 .5em;
transition: all 2s ease;
}
.mk-pink1.start {
background-position: -100% .5em;
}
/*アニメーション蛍光ペン（ピンク・細）*/
.mk-pink2 {
background-image: -webkit-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: -moz-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: -ms-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: -o-linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-image: linear-gradient(left, transparent 50%, rgb(250,212,213) 50%);
background-repeat: repeat-x;
background-size: 200% .3em;
background-position: 0 .9em;
transition: all 2s ease;
}
.mk-pink2.start {
background-position: -100% .9em;
}
/*蛍光ペン(青)*/
.mk-blue  { 
background-image: linear-gradient(transparent 50%, rgb(202,227,248) 50%);
}
/*アニメーション蛍光ペン（ピンク・太）*/
.mk-blue1 {
background-image: -webkit-linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-image: -moz-linear-gradient(left, transparent 50%, rgb(202,227,248)) 50%);
background-image: -ms-linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-image: -o-linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-image: linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-repeat: repeat-x;
background-size: 200% .8em;
background-position: 0 .5em;
transition: all 2s ease;
}
.mk-blue1.start {
background-position: -100% .5em;
}
/*アニメーション蛍光ペン（ピンク・細）*/
.mk-blue2 {
background-image: -webkit-linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-image: -moz-linear-gradient(left, transparent 50%, rgb(202,227,248)) 50%);
background-image: -ms-linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-image: -o-linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-image: linear-gradient(left, transparent 50%, rgb(202,227,248) 50%);
background-repeat: repeat-x;
background-size: 200% .3em;
background-position: 0 .9em;
transition: all 2s ease;
}
.mk-blue2.start {
background-position: -100% .9em;
}

/*区切り線
---------------------------------------------------------------------------*/
hr.style1{border-top: 1px solid #8c8b8b;}
hr.style2 {border-top: 3px double #8c8b8b;}
hr.style3 {border-top: 1px dashed #8c8b8b;}
hr.style4 {border-top: 1px dotted #8c8b8b;}
hr.style5 {background-color: #fff;border-top: 2px dashed #8c8b8b;}
hr.style6 {background-color: #fff;border-top: 2px dotted #8c8b8b;}
hr.style7 {border-top: 1px solid #8c8b8b;border-bottom: 1px solid #fff;}
hr.style8 {border-top: 1px solid #8c8b8b;border-bottom: 1px solid #fff;}
hr.style8:after {
	content: '';
	display: block;
	margin-top: 2px;
	border-top: 1px solid #8c8b8b;
	border-bottom: 1px solid #fff;
}
hr.style9 {border-top: 1px dashed #8c8b8b;border-bottom: 1px dashed #fff;}
hr.style10 {border-top: 1px dotted #8c8b8b;border-bottom: 1px dotted #fff;}
hr.style11 {height: 6px;background: url(http://ibrahimjabbari.com/english/images/hr-11.png) repeat-x 0 0;border: 0;}
hr.style12 {height: 6px;background: url(http://ibrahimjabbari.com/english/images/hr-12.png) repeat-x 0 0;border: 0;}
hr.style13 {height: 10px;border: 0;box-shadow: 0 10px 10px -10px #8c8b8b inset;}
hr.style14 { 
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
}

/*角丸
---------------------------------------------------------------------------*/
.kadomaru5 {border-radius: 5px;}
.kadomaru10 {border-radius: 10px;}
.kadomaru15 {border-radius: 15px;}
.kadomaru20 {border-radius: 20px;}
.kadomaru25 {border-radius: 25px;}
.kadomaru30 {border-radius: 30px;}
.kadomaru35 {border-radius: 35px;}
.kadomaru40 {border-radius: 40px;}
.kadomaru45 {border-radius: 45px;}
.kadomaru50 {border-radius: 50px;}

/*ボーダーのタイプ
---------------------------------------------------------------------------*/
/*直線*/
.sol1 { border: 1px solid;}
.sol2 { border: 2px solid;}
.sol3 { border: 3px solid;}
.sol4 { border: 4px solid;}
.sol5 { border: 5px solid;}

/*直線・下線のみ*/
.sol1-b { border-bottom: 1px solid;}
.sol2-b { border-bottom:: 2px solid;}
.sol3-b { border-bottom:: 3px solid;}
.sol4-b { border-bottom:: 4px solid;}
.sol5-b { border-bottom:: 5px solid;}

/*点線*/
.das1 { border: 1px dashed;}
.das2 { border: 2px dashed;}
.das3 { border: 3px dashed;}
.das4 { border: 4px dashed;}
.das5 { border: 5px dashed;}

/*点線・下線のみ*/
.das1-b { border-bottom:: 1px dashed;}
.das2-b { border-bottom:: 2px dashed;}
.das3-b { border-bottom:: 3px dashed;}
.das4-b { border-bottom:: 4px dashed;}
.das5-b { border-bottom:: 5px dashed;}


/*フォトフレーム
---------------------------------------------------------------------------*/
/*写真（右寄せ／枠・シャドウ付き）*/
.photo01-r{
    float: right;
    margin:0 0 20px 20px;
    padding: 10px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
	box-shadow: 0px 3px 7px 1px rgba(0,0,0,.2);
}
/*写真（左寄せ／枠・シャドウ付き）*/
.photo01-l{
    float: left;
    margin:0px 20px 20px 0px;
    padding: 10px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
	box-shadow: 0px 3px 7px 1px rgba(0,0,0,.2);
}
/*写真（右寄せ／枠・シャドウなし）*/
.photo02-r{
    float: right;
    margin:0 0 20px 20px;
    padding: 10px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
}
/*写真（左寄せ／枠・シャドウなし）*/
.photo02-l{
    float: left;
    margin:0px 20px 20px 0px;
    padding: 10px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
}
/*写真（右寄せ／枠なし・シャドウ付き）*/
.photo03-r{
    float: right;
    margin:0 0 20px 20px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
	box-shadow: 0px 3px 7px 1px rgba(0,0,0,.2);

}
/*写真（左寄せ／枠なし・シャドウ付き）*/
.photo03-l{
    float: left;
    margin:0px 20px 20px 0px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
	box-shadow: 0px 3px 7px 1px rgba(0,0,0,.2);

}
/*写真（右寄せ／枠なし・シャドウなし）*/
.photo04-r{
    float: right;
    margin:0 0 20px 20px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
}
/*写真（左寄せ／枠なし・シャドウなし）*/
.photo04-l{
    float: left;
    margin:0px 20px 20px 0px;
    background: #fff;
    background: radial-gradient(at center, transparent, transparent 5px, #fff 6px);
    background: -webkit-gradient(radial, center center, 5, center center, 6, from(#fff), color-stop(100%,#fff), color-stop(0%,rgba(255,255,255,0)));
    background-position: -10px -10px;
    background-size: 20px 20px;
	width: 220px;
}
@media only screen and (max-width: 768px) {
.photo01-r,.photo02-r,.photo03-r,.photo04-r{
	width: 120px;
	margin:0 0 10px 10px;
}
.photo01-l,.photo02-l,.photo03-l,.photo04-l{
	width: 120px;
	margin:0px 10px 10px 0px;
}
}

/*チェックリスト
---------------------------------------------------------------------------*/
.list1 ul,.list2 ul,.list3 ul,.list4 ul,.list5 ul,.list6 ul,.list7 ul,.list8 ul,.list9 ul,.list10 ul,.list11 ul,.list12 ul,.list13 ul,.list14 ul,.list15 ul,.list16 ul,.list17 ul,.list18 ul,.list19 ul,.list20 ul {
  padding: 0em 1em 0em 1.3em;
  position: relative;
}
.list1 ul li,.list2 ul li,.list3 ul li,.list4 ul li,.list5 ul li,.list6 ul li,.list7 ul li,.list8 ul li,.list9 ul li,.list10 ul li,.list11 ul li,.list12 ul li,.list13 ul li,.list14 ul li,.list15 ul li,.list16 ul li,.list17 ul li,.list18 ul li,.list19 ul li,.list20 ul li {
  line-height: 1.5;
  padding: 0.25em 0;
  list-style-type: none!important;
}
/*チェック（赤）*/
.list1 ul li:before {
  font-family: FontAwesome;
  content: "\f046";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*チェック（緑）*/
.list2 ul li:before {
  font-family: FontAwesome;
  content: "\f046";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*チェック枠なし（赤）*/
.list3 ul li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*チェック枠なし（緑）*/
.list4 ul li:before {
  font-family: FontAwesome;
  content: "\f00c";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*チェック丸（赤）*/
.list5 ul li:before {
  font-family: FontAwesome;
  content: "\f058";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*チェック丸（緑）*/
.list6 ul li:before {
  font-family: FontAwesome;
  content: "\f058";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*注意マーク丸（赤）*/
.list7 ul li:before {
  font-family: FontAwesome;
  content: "\f06a";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*注意マーク丸（黄色）*/
.list8 ul li:before {
  font-family: FontAwesome;
  content: "\f06a";
  position: absolute;
  left : 0em; 
  color: #e1aa13; 
}
/*注意マーク三角（赤）*/
.list9 ul li:before {
  font-family: FontAwesome;
  content: "\f071";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*注意マーク三角（黄色）*/
.list10 ul li:before {
  font-family: FontAwesome;
  content: "\f071";
  position: absolute;
  left : 0em; 
  color: #e1aa13; 
}
/*クエスチョン（赤）*/
.list11 ul li:before {
  font-family: FontAwesome;
  content: "\f059";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*クエスチョン（緑）*/
.list12 ul li:before {
  font-family: FontAwesome;
  content: "\f059";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*矢印枠なし（赤）*/
.list13 ul li:before {
  font-family: FontAwesome;
  content: "\f061";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*矢印枠なし（緑）*/
.list14 ul li:before {
  font-family: FontAwesome;
  content: "\f061";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*矢印丸（赤）*/
.list15 ul li:before {
  font-family: FontAwesome;
  content: "\f0a9";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*矢印丸（緑）*/
.list16 ul li:before {
  font-family: FontAwesome;
  content: "\f0a9";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*矢印二重（赤）*/
.list17 ul li:before {
  font-family: FontAwesome;
  content: "\f101";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}
/*矢印二重（緑）*/
.list18 ul li:before {
  font-family: FontAwesome;
  content: "\f101";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}
/*バツマーク（赤）*/
.list19 ul li:before {
  font-family: FontAwesome;
  content: "\f057";
  position: absolute;
  left : 0em; 
  color: #cb360d; 
}

/*メモ（緑）*/
.list20 ul li:before {
  font-family: FontAwesome;
  content: "\f040";
  position: absolute;
  left : 0em; 
  color: #3d9435; 
}


/*デフォルトカラー設定
---------------------------------------------------------------------------*/

/*ベースカラー（メインカラー）
------------------------------------------------*/
.base1{color: var(--base1)}
.bg-base1 { background-color: var(--base1) }
.base2{color: var(--base2)}
.bg-base2 { background-color: var(--base2) }

/*サブカラー
------------------------------------------------*/
.sc1{color: var(--sc1)}
.bg-sc1 { background-color: var(--sc1) }
.sc1{color: var(--sc2)}
.bg-sc2 { background-color: var(--sc2) }
.sc1{color: var(--sc3)}
.bg-sc3 { background-color: var(--sc3) }

 
/*メタリックカラー設定
---------------------------------------------------------------------------*/

/*テキスト設定
------------------------------------------------*/
.g-gold1{
  background: -moz-linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%);
  background: -webkit-linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%);
  background: linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.g-gold2{
  background: -moz-linear-gradient(to right, #BF953F, #e2b566, #B38728, #d99e4c, #AA771C);
  background: -webkit-linear-gradient(to right, #BF953F, #e2b566, #B38728, #d99e4c, #AA771C);
  background: linear-gradient(to right, #BF953F, #e2b566, #B38728, #d99e4c, #AA771C);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.g-gold3{
  background: -moz-repeating-linear-gradient(90deg, #BF953F 0%,#b09a51 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #BF953F 95%, #B38728 100%);
  background: -webkit-repeating-linear-gradient(90deg, #BF953F 0%,#b09a51 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #BF953F 95%, #B38728 100%);
  background: repeating-linear-gradient(90deg, #BF953F 0%,#b09a51 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #BF953F 95%, #B38728 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.g-gold4{
  background: -moz-linear-gradient(to right, #BF953F, #FCF6BA, #BF953F);
  background: -webkit-linear-gradient(to right, #BF953F, #FBF5B7, #AA771C);
  background: linear-gradient(to right, #BF953F, #FCF6BA, #BF953F);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
/*背景設定
------------------------------------------------*/
.bg-g-gold1{
  background: -moz-linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%);
  background: -webkit-linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%);
  background: linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%);
}
.bg-g-gold2{
  background: -moz-linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
  background: -webkit-linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
  background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
}
.bg-g-gold3{
  background: -moz-repeating-linear-gradient(90deg, #472819 0%,#472819 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #2c1b14 95%, #2c1b14 100%);
  background: -webkit-repeating-linear-gradient(90deg, #472819 0%,#472819 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #2c1b14 95%, #2c1b14 100%);
  background: repeating-linear-gradient(90deg, #472819 0%,#472819 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #2c1b14 95%, #2c1b14 100%);
}
.bg-g-gold4{
  background: -moz-linear-gradient(to right, #BF953F, #FCF6BA, #BF953F);
  background: -webkit-linear-gradient(to right, #BF953F, #FBF5B7, #AA771C);
  background: linear-gradient(to right, #BF953F, #FCF6BA, #BF953F);
}

/*ボーダー設定
------------------------------------------------*/
.bd-g-gold1{
  border-image: -moz-linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%)1;
  border-image: -webkit-linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%)1;
  border-image: linear-gradient(360deg, #8e7a3f 10%, #b09a51 360%)1;
}
.bd-g-gold2{
  border-image:  -moz-linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C)1;
  border-image: -webkit-linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C)1;
  border-image: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C)1;
}
.bd-g-gold3{
  border-image: -moz-repeating-linear-gradient(90deg, #472819 0%,#472819 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #2c1b14 95%, #2c1b14 100%)1;
  border-image: -webkit-repeating-linear-gradient(90deg, #472819 0%,#472819 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #2c1b14 95%, #2c1b14 100%)1;
  border-image: repeating-linear-gradient(90deg, #472819 0%,#472819 2%, #d99e4c 23%, #a87b32 29%, #865c25 33%, #e2b566 61%, #efdf80 66%, #9f7c3c 79%, #2c1b14 95%, #2c1b14 100%)1;
}

/*ホワイトの定義
---------------------------------------------------------------------------*/
:root {
  --white: #fff;
}
.white { color: var(--white,#fff) }
.bg-white { background-color: var(--white,#fff) }
.bd-white { border-color: var(--white,#fff) }

/*ボーダーカラー
---------------------------------------------------------------------------*/
.bd-base { border-color: var(--base) }
.bd-base1 { border-color: var(--base1) }
.bd-base2 { border-color: var(--base2) }
.bd-sc1 { border-color: var(--sc1) }
.bd-sc2 { border-color: var(--sc2) }
.bd-sc3 { border-color: var(--sc3) }
.bd-black { border-color: var(--black) }
.bd-gray0 { border-color: var(--gray0) }
.bd-gray1 { border-color: var(--gray1) }
.bd-gray2 { border-color: var(--gray2) }
.bd-gray3 { border-color: var(--gray3) }
.bd-gray4 { border-color: var(--gray4) }
.bd-gray5 { border-color: var(--gray5) }
.bd-gray6 { border-color: var(--gray6) }
.bd-gray7 { border-color: var(--gray7) }
.bd-gray8 { border-color: var(--gray8) }
.bd-gray9 { border-color: var(--gray9) }
.bd-blue0 { border-color: var(--blue0) }
.bd-blue1 { border-color: var(--blue1) }
.bd-blue2 { border-color: var(--blue2) }
.bd-blue3 { border-color: var(--blue3) }
.bd-blue4 { border-color: var(--blue4) }
.bd-blue5 { border-color: var(--blue5) }
.bd-blue6 { border-color: var(--blue6) }
.bd-blue7 { border-color: var(--blue7) }
.bd-blue8 { border-color: var(--blue8) }
.bd-blue9 { border-color: var(--blue9) }
.bd-indigo0 { border-color: var(--indigo0) }
.bd-indigo1 { border-color: var(--indigo1) }
.bd-indigo2 { border-color: var(--indigo2) }
.bd-indigo3 { border-color: var(--indigo3) }
.bd-indigo4 { border-color: var(--indigo4) }
.bd-indigo5 { border-color: var(--indigo5) }
.bd-indigo6 { border-color: var(--indigo6) }
.bd-indigo7 { border-color: var(--indigo7) }
.bd-indigo8 { border-color: var(--indigo8) }
.bd-indigo9 { border-color: var(--indigo9) }
.bd-violet0 { border-color: var(--violet0) }
.bd-violet1 { border-color: var(--violet1) }
.bd-violet2 { border-color: var(--violet2) }
.bd-violet3 { border-color: var(--violet3) }
.bd-violet4 { border-color: var(--violet4) }
.bd-violet5 { border-color: var(--violet5) }
.bd-violet6 { border-color: var(--violet6) }
.bd-violet7 { border-color: var(--violet7) }
.bd-violet8 { border-color: var(--violet8) }
.bd-violet9 { border-color: var(--violet9) }
.bd-fuschia0 { border-color: var(--fuschia0) }
.bd-fuschia1 { border-color: var(--fuschia1) }
.bd-fuschia2 { border-color: var(--fuschia2) }
.bd-fuschia3 { border-color: var(--fuschia3) }
.bd-fuschia4 { border-color: var(--fuschia4) }
.bd-fuschia5 { border-color: var(--fuschia5) }
.bd-fuschia6 { border-color: var(--fuschia6) }
.bd-fuschia7 { border-color: var(--fuschia7) }
.bd-fuschia8 { border-color: var(--fuschia8) }
.bd-fuschia9 { border-color: var(--fuschia9) }
.bd-pink0 { border-color: var(--pink0) }
.bd-pink1 { border-color: var(--pink1) }
.bd-pink2 { border-color: var(--pink2) }
.bd-pink3 { border-color: var(--pink3) }
.bd-pink4 { border-color: var(--pink4) }
.bd-pink5 { border-color: var(--pink5) }
.bd-pink6 { border-color: var(--pink6) }
.bd-pink7 { border-color: var(--pink7) }
.bd-pink8 { border-color: var(--pink8) }
.bd-pink9 { border-color: var(--pink9) }
.bd-red0 { border-color: var(--red0) }
.bd-red1 { border-color: var(--red1) }
.bd-red2 { border-color: var(--red2) }
.bd-red3 { border-color: var(--red3) }
.bd-red4 { border-color: var(--red4) }
.bd-red5 { border-color: var(--red5) }
.bd-red6 { border-color: var(--red6) }
.bd-red7 { border-color: var(--red7) }
.bd-red8 { border-color: var(--red8) }
.bd-red9 { border-color: var(--red9) }
.bd-orange0 { border-color: var(--orange0) }
.bd-orange1 { border-color: var(--orange1) }
.bd-orange2 { border-color: var(--orange2) }
.bd-orange3 { border-color: var(--orange3) }
.bd-orange4 { border-color: var(--orange4) }
.bd-orange5 { border-color: var(--orange5) }
.bd-orange6 { border-color: var(--orange6) }
.bd-orange7 { border-color: var(--orange7) }
.bd-orange8 { border-color: var(--orange8) }
.bd-orange9 { border-color: var(--orange9) }
.bd-yellow0 { border-color: var(--yellow0) }
.bd-yellow1 { border-color: var(--yellow1) }
.bd-yellow2 { border-color: var(--yellow2) }
.bd-yellow3 { border-color: var(--yellow3) }
.bd-yellow4 { border-color: var(--yellow4) }
.bd-yellow5 { border-color: var(--yellow5) }
.bd-yellow6 { border-color: var(--yellow6) }
.bd-yellow7 { border-color: var(--yellow7) }
.bd-yellow8 { border-color: var(--yellow8) }
.bd-yellow9 { border-color: var(--yellow9) }
.bd-lime0 { border-color: var(--lime0) }
.bd-lime1 { border-color: var(--lime1) }
.bd-lime2 { border-color: var(--lime2) }
.bd-lime3 { border-color: var(--lime3) }
.bd-lime4 { border-color: var(--lime4) }
.bd-lime5 { border-color: var(--lime5) }
.bd-lime6 { border-color: var(--lime6) }
.bd-lime7 { border-color: var(--lime7) }
.bd-lime8 { border-color: var(--lime8) }
.bd-lime9 { border-color: var(--lime9) }
.bd-green0 { border-color: var(--green0) }
.bd-green1 { border-color: var(--green1) }
.bd-green2 { border-color: var(--green2) }
.bd-green3 { border-color: var(--green3) }
.bd-green4 { border-color: var(--green4) }
.bd-green5 { border-color: var(--green5) }
.bd-green6 { border-color: var(--green6) }
.bd-green7 { border-color: var(--green7) }
.bd-green8 { border-color: var(--green8) }
.bd-green9 { border-color: var(--green9) }
.bd-teal0 { border-color: var(--teal0) }
.bd-teal1 { border-color: var(--teal1) }
.bd-teal2 { border-color: var(--teal2) }
.bd-teal3 { border-color: var(--teal3) }
.bd-teal4 { border-color: var(--teal4) }
.bd-teal5 { border-color: var(--teal5) }
.bd-teal6 { border-color: var(--teal6) }
.bd-teal7 { border-color: var(--teal7) }
.bd-teal8 { border-color: var(--teal8) }
.bd-teal9 { border-color: var(--teal9) }
.bd-cyan0 { border-color: var(--cyan0) }
.bd-cyan1 { border-color: var(--cyan1) }
.bd-cyan2 { border-color: var(--cyan2) }
.bd-cyan3 { border-color: var(--cyan3) }
.bd-cyan4 { border-color: var(--cyan4) }
.bd-cyan5 { border-color: var(--cyan5) }
.bd-cyan6 { border-color: var(--cyan6) }
.bd-cyan7 { border-color: var(--cyan7) }
.bd-cyan8 { border-color: var(--cyan8) }
.bd-cyan9 { border-color: var(--cyan9) }


/*背景グラデーション設定
---------------------------------------------------------------------------*/

/*baseから透明*/
.bg-g-r-base{
  background: -moz-linear-gradient(to right, var(--base), transparent);
  background: -webkit-linear-gradient(to right, var(--base), transparent);
  background: linear-gradient(to left, var(--base), transparent);
}
.bg-g-l-base{
  background: -moz-linear-gradient(to left, var(--base), transparent);
  background: -webkit-linear-gradient(to left, var(--base), transparent);
  background: linear-gradient(to right, var(--base), transparent);
}
.bg-g-t-base{
  background: -moz-linear-gradient(to top, var(--base), transparent);
  background: -webkit-linear-gradient(to right, var(--base), transparent);
  background: linear-gradient(to bottom, var(--base), transparent);
}
.bg-g-b-base{
  background: -moz-linear-gradient(to bottom, var(--base), transparent);
  background: -webkit-linear-gradient(to bottom, var(--base), transparent);
  background: linear-gradient(to top, var(--base), transparent);
}
/*blackから透明*/
.bg-g-r-black{
  background: -moz-linear-gradient(to right, var(--black), transparent);
  background: -webkit-linear-gradient(to right, var(--black), transparent);
  background: linear-gradient(to left, var(--black), transparent);
}
.bg-g-l-black{
  background: -moz-linear-gradient(to left, var(--black), transparent);
  background: -webkit-linear-gradient(to left, var(--black), transparent);
  background: linear-gradient(to right, var(--black), transparent);
}
.bg-g-t-black{
  background: -moz-linear-gradient(to top, var(--black), transparent);
  background: -webkit-linear-gradient(to right, var(--black), transparent);
  background: linear-gradient(to bottom, var(--black), transparent);
}
.bg-g-b-black{
  background: -moz-linear-gradient(to bottom, var(--black), transparent);
  background: -webkit-linear-gradient(to bottom, var(--black), transparent);
  background: linear-gradient(to top, var(--black), transparent);
}
/*gray5から透明*/
.bg-g-r-gray5{
  background: -moz-linear-gradient(to right, var(--gray5), transparent);
  background: -webkit-linear-gradient(to right, var(--gray5), transparent);
  background: linear-gradient(to left, var(--gray5), transparent);
}
.bg-g-l-gray5{
  background: -moz-linear-gradient(to left, var(--gray5), transparent);
  background: -webkit-linear-gradient(to left, var(--gray5), transparent);
  background: linear-gradient(to right, var(--gray5), transparent);
}
.bg-g-t-gray5{
  background: -moz-linear-gradient(to top, var(--gray5), transparent);
  background: -webkit-linear-gradient(to right, var(--gray5), transparent);
  background: linear-gradient(to bottom, var(--gray5), transparent);
}
.bg-g-b-gray5{
  background: -moz-linear-gradient(to bottom, var(--gray5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--gray5), transparent);
  background: linear-gradient(to top, var(--gray5), transparent);
}
/*blue5から透明*/
.bg-g-r-blue5{
  background: -moz-linear-gradient(to right, var(--blue5), transparent);
  background: -webkit-linear-gradient(to right, var(--blue5), transparent);
  background: linear-gradient(to left, var(--blue5), transparent);
}
.bg-g-l-blue5{
  background: -moz-linear-gradient(to left, var(--blue5), transparent);
  background: -webkit-linear-gradient(to left, var(--blue5), transparent);
  background: linear-gradient(to right, var(--blue5), transparent);
}
.bg-g-t-blue5{
  background: -moz-linear-gradient(to top, var(--blue5), transparent);
  background: -webkit-linear-gradient(to right, var(--blue5), transparent);
  background: linear-gradient(to bottom, var(--blue5), transparent);
}
.bg-g-b-blue5{
  background: -moz-linear-gradient(to bottom, var(--blue5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--blue5), transparent);
  background: linear-gradient(to top, var(--blue5), transparent);
}
/*indigo5から透明*/
.bg-g-r-indigo5{
  background: -moz-linear-gradient(to right, var(--indigo5), transparent);
  background: -webkit-linear-gradient(to right, var(--indigo5), transparent);
  background: linear-gradient(to left, var(--indigo5), transparent);
}
.bg-g-l-indigo5{
  background: -moz-linear-gradient(to left, var(--indigo5), transparent);
  background: -webkit-linear-gradient(to left, var(--indigo5), transparent);
  background: linear-gradient(to right, var(--indigo5), transparent);
}
.bg-g-t-indigo5{
  background: -moz-linear-gradient(to top, var(--indigo5), transparent);
  background: -webkit-linear-gradient(to right, var(--indigo5), transparent);
  background: linear-gradient(to bottom, var(--indigo5), transparent);
}
.bg-g-b-indigo5{
  background: -moz-linear-gradient(to bottom, var(--indigo5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--indigo5), transparent);
  background: linear-gradient(to top, var(--indigo5), transparent);
}
/*violet5から透明*/
.bg-g-r-violet5{
  background: -moz-linear-gradient(to right, var(--violet5), transparent);
  background: -webkit-linear-gradient(to right, var(--violet5), transparent);
  background: linear-gradient(to left, var(--violet5), transparent);
}
.bg-g-l-violet5{
  background: -moz-linear-gradient(to left, var(--violet5), transparent);
  background: -webkit-linear-gradient(to left, var(--violet5), transparent);
  background: linear-gradient(to right, var(--violet5), transparent);
}
.bg-g-t-violet5{
  background: -moz-linear-gradient(to top, var(--violet5), transparent);
  background: -webkit-linear-gradient(to right, var(--violet5), transparent);
  background: linear-gradient(to bottom, var(--violet5), transparent);
}
.bg-g-b-violet5{
  background: -moz-linear-gradient(to bottom, var(--violet5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--violet5), transparent);
  background: linear-gradient(to top, var(--violet5), transparent);
}
/*fuschia5から透明*/
.bg-g-r-fuschia5{
  background: -moz-linear-gradient(to right, var(--fuschia5), transparent);
  background: -webkit-linear-gradient(to right, var(--fuschia5), transparent);
  background: linear-gradient(to left, var(--fuschia5), transparent);
}
.bg-g-l-fuschia5{
  background: -moz-linear-gradient(to left, var(--fuschia5), transparent);
  background: -webkit-linear-gradient(to left, var(--fuschia5), transparent);
  background: linear-gradient(to right, var(--fuschia5), transparent);
}
.bg-g-t-fuschia5{
  background: -moz-linear-gradient(to top, var(--fuschia5), transparent);
  background: -webkit-linear-gradient(to right, var(--fuschia5), transparent);
  background: linear-gradient(to bottom, var(--fuschia5), transparent);
}
.bg-g-b-fuschia5{
  background: -moz-linear-gradient(to bottom, var(--fuschia5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--fuschia5), transparent);
  background: linear-gradient(to top, var(--fuschia5), transparent);
}
/*pink5から透明*/
.bg-g-r-pink5{
  background: -moz-linear-gradient(to right, var(--pink5), transparent);
  background: -webkit-linear-gradient(to right, var(--pink5), transparent);
  background: linear-gradient(to left, var(--pink5), transparent);
}
.bg-g-l-pink5{
  background: -moz-linear-gradient(to left, var(--pink5), transparent);
  background: -webkit-linear-gradient(to left, var(--pink5), transparent);
  background: linear-gradient(to right, var(--pink5), transparent);
}
.bg-g-t-pink5{
  background: -moz-linear-gradient(to top, var(--pink5), transparent);
  background: -webkit-linear-gradient(to right, var(--pink5), transparent);
  background: linear-gradient(to bottom, var(--pink5), transparent);
}
.bg-g-b-pink5{
  background: -moz-linear-gradient(to bottom, var(--pink5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--pink5), transparent);
  background: linear-gradient(to top, var(--pink5), transparent);
}
/*red5から透明*/
.bg-g-r-red5{
  background: -moz-linear-gradient(to right, var(--red5), transparent);
  background: -webkit-linear-gradient(to right, var(--red5), transparent);
  background: linear-gradient(to left, var(--red5), transparent);
}
.bg-g-l-red5{
  background: -moz-linear-gradient(to left, var(--red5), transparent);
  background: -webkit-linear-gradient(to left, var(--red5), transparent);
  background: linear-gradient(to right, var(--red5), transparent);
}
.bg-g-t-red5{
  background: -moz-linear-gradient(to top, var(--red5), transparent);
  background: -webkit-linear-gradient(to right, var(--red5), transparent);
  background: linear-gradient(to bottom, var(--red5), transparent);
}
.bg-g-b-red5{
  background: -moz-linear-gradient(to bottom, var(--red5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--red5), transparent);
  background: linear-gradient(to top, var(--red5), transparent);
}
/*orange5から透明*/
.bg-g-r-orange5{
  background: -moz-linear-gradient(to right, var(--orange5), transparent);
  background: -webkit-linear-gradient(to right, var(--orange5), transparent);
  background: linear-gradient(to left, var(--orange5), transparent);
}
.bg-g-l-orange5{
  background: -moz-linear-gradient(to left, var(--orange5), transparent);
  background: -webkit-linear-gradient(to left, var(--orange5), transparent);
  background: linear-gradient(to right, var(--orange5), transparent);
}
.bg-g-t-orange5{
  background: -moz-linear-gradient(to top, var(--orange5), transparent);
  background: -webkit-linear-gradient(to right, var(--orange5), transparent);
  background: linear-gradient(to bottom, var(--orange5), transparent);
}
.bg-g-b-orange5{
  background: -moz-linear-gradient(to bottom, var(--orange5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--orange5), transparent);
  background: linear-gradient(to top, var(--orange5), transparent);
}
/*yellow5から透明*/
.bg-g-r-yellow5{
  background: -moz-linear-gradient(to right, var(--yellow5), transparent);
  background: -webkit-linear-gradient(to right, var(--yellow5), transparent);
  background: linear-gradient(to left, var(--yellow5), transparent);
}
.bg-g-l-yellow5{
  background: -moz-linear-gradient(to left, var(--yellow5), transparent);
  background: -webkit-linear-gradient(to left, var(--yellow5), transparent);
  background: linear-gradient(to right, var(--yellow5), transparent);
}
.bg-g-t-yellow5{
  background: -moz-linear-gradient(to top, var(--yellow5), transparent);
  background: -webkit-linear-gradient(to right, var(--yellow5), transparent);
  background: linear-gradient(to bottom, var(--yellow5), transparent);
}
.bg-g-b-yellow5{
  background: -moz-linear-gradient(to bottom, var(--yellow5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--yellow5), transparent);
  background: linear-gradient(to top, var(--yellow5), transparent);
}
/*lime5から透明*/
.bg-g-r-lime5{
  background: -moz-linear-gradient(to right, var(--lime5), transparent);
  background: -webkit-linear-gradient(to right, var(--lime5), transparent);
  background: linear-gradient(to left, var(--lime5), transparent);
}
.bg-g-l-lime5{
  background: -moz-linear-gradient(to left, var(--lime5), transparent);
  background: -webkit-linear-gradient(to left, var(--lime5), transparent);
  background: linear-gradient(to right, var(--lime5), transparent);
}
.bg-g-t-lime5{
  background: -moz-linear-gradient(to top, var(--lime5), transparent);
  background: -webkit-linear-gradient(to right, var(--lime5), transparent);
  background: linear-gradient(to bottom, var(--lime5), transparent);
}
.bg-g-b-lime5{
  background: -moz-linear-gradient(to bottom, var(--lime5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--lime5), transparent);
  background: linear-gradient(to top, var(--lime5), transparent);
}
/*green5から透明*/
.bg-g-r-green5{
  background: -moz-linear-gradient(to right, var(--green5), transparent);
  background: -webkit-linear-gradient(to right, var(--green5), transparent);
  background: linear-gradient(to left, var(--green5), transparent);
}
.bg-g-l-green5{
  background: -moz-linear-gradient(to left, var(--green5), transparent);
  background: -webkit-linear-gradient(to left, var(--green5), transparent);
  background: linear-gradient(to right, var(--green5), transparent);
}
.bg-g-t-green5{
  background: -moz-linear-gradient(to top, var(--green5), transparent);
  background: -webkit-linear-gradient(to right, var(--green5), transparent);
  background: linear-gradient(to bottom, var(--green5), transparent);
}
.bg-g-b-green5{
  background: -moz-linear-gradient(to bottom, var(--green5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--green5), transparent);
  background: linear-gradient(to top, var(--green5), transparent);
}/*teal5から透明*/
.bg-g-r-teal5{
  background: -moz-linear-gradient(to right, var(--teal5), transparent);
  background: -webkit-linear-gradient(to right, var(--teal5), transparent);
  background: linear-gradient(to left, var(--teal5), transparent);
}
.bg-g-l-teal5{
  background: -moz-linear-gradient(to left, var(--teal5), transparent);
  background: -webkit-linear-gradient(to left, var(--teal5), transparent);
  background: linear-gradient(to right, var(--teal5), transparent);
}
.bg-g-t-teal5{
  background: -moz-linear-gradient(to top, var(--teal5), transparent);
  background: -webkit-linear-gradient(to right, var(--teal5), transparent);
  background: linear-gradient(to bottom, var(--teal5), transparent);
}
.bg-g-b-teal5{
  background: -moz-linear-gradient(to bottom, var(--teal5), transparent);
  background: -webkit-linear-gradient(to bottom, var(--teal5), transparent);
  background: linear-gradient(to top, var(--teal5), transparent);
}
.bg-g-r-base-black{
  background: -moz-linear-gradient(to right, var(--black), var(--base));
  background: -webkit-linear-gradient(to right, var(--black), var(--base));
  background: linear-gradient(to left, var(--black), var(--base));
}
.bg-g-l-base-black{
  background: -moz-linear-gradient(to left, var(--black), var(--base));
  background: -webkit-linear-gradient(to left, var(--black), var(--base));
  background: linear-gradient(to right, var(--black), var(--base));
}
.bg-g-t-base-black{
  background: -moz-linear-gradient(to top, var(--black), var(--base));
  background: -webkit-linear-gradient(to right, var(--black), var(--base));
  background: linear-gradient(to bottom, var(--black), var(--base));
}
.bg-g-b-base-black{
  background: -moz-linear-gradient(to bottom, var(--black), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--black), var(--base));
  background: linear-gradient(to top, var(--black), var(--base));
}
/*gray5からbase*/
.bg-g-r-base-gray5{
  background: -moz-linear-gradient(to right, var(--gray5), var(--base));
  background: -webkit-linear-gradient(to right, var(--gray5), var(--base));
  background: linear-gradient(to left, var(--gray5), var(--base));
}
.bg-g-l-base-gray5{
  background: -moz-linear-gradient(to left, var(--gray5), var(--base));
  background: -webkit-linear-gradient(to left, var(--gray5), var(--base));
  background: linear-gradient(to right, var(--gray5), var(--base));
}
.bg-g-t-base-gray5{
  background: -moz-linear-gradient(to top, var(--gray5), var(--base));
  background: -webkit-linear-gradient(to right, var(--gray5), var(--base));
  background: linear-gradient(to bottom, var(--gray5), var(--base));
}
.bg-g-b-base-gray5{
  background: -moz-linear-gradient(to bottom, var(--gray5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--gray5), var(--base));
  background: linear-gradient(to top, var(--gray5), var(--base));
}
/*blue5からbase*/
.bg-g-r-base-blue5{
  background: -moz-linear-gradient(to right, var(--blue5), var(--base));
  background: -webkit-linear-gradient(to right, var(--blue5), var(--base));
  background: linear-gradient(to left, var(--blue5), var(--base));
}
.bg-g-l-base-blue5{
  background: -moz-linear-gradient(to left, var(--blue5), var(--base));
  background: -webkit-linear-gradient(to left, var(--blue5), var(--base));
  background: linear-gradient(to right, var(--blue5), var(--base));
}
.bg-g-t-base-blue5{
  background: -moz-linear-gradient(to top, var(--blue5), var(--base));
  background: -webkit-linear-gradient(to right, var(--blue5), var(--base));
  background: linear-gradient(to bottom, var(--blue5), var(--base));
}
.bg-g-b-base-blue5{
  background: -moz-linear-gradient(to bottom, var(--blue5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--blue5), var(--base));
  background: linear-gradient(to top, var(--blue5), var(--base));
}
/*indigo5からbase*/
.bg-g-r-base-indigo5{
  background: -moz-linear-gradient(to right, var(--indigo5), var(--base));
  background: -webkit-linear-gradient(to right, var(--indigo5), var(--base));
  background: linear-gradient(to left, var(--indigo5), var(--base));
}
.bg-g-l-base-indigo5{
  background: -moz-linear-gradient(to left, var(--indigo5), var(--base));
  background: -webkit-linear-gradient(to left, var(--indigo5), var(--base));
  background: linear-gradient(to right, var(--indigo5), var(--base));
}
.bg-g-t-base-indigo5{
  background: -moz-linear-gradient(to top, var(--indigo5), var(--base));
  background: -webkit-linear-gradient(to right, var(--indigo5), var(--base));
  background: linear-gradient(to bottom, var(--indigo5), var(--base));
}
.bg-g-b-base-indigo5{
  background: -moz-linear-gradient(to bottom, var(--indigo5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--indigo5), var(--base));
  background: linear-gradient(to top, var(--indigo5), var(--base));
}
/*violet5からbase*/
.bg-g-r-base-violet5{
  background: -moz-linear-gradient(to right, var(--violet5), var(--base));
  background: -webkit-linear-gradient(to right, var(--violet5), var(--base));
  background: linear-gradient(to left, var(--violet5), var(--base));
}
.bg-g-l-base-violet5{
  background: -moz-linear-gradient(to left, var(--violet5), var(--base));
  background: -webkit-linear-gradient(to left, var(--violet5), var(--base));
  background: linear-gradient(to right, var(--violet5), var(--base));
}
.bg-g-t-base-violet5{
  background: -moz-linear-gradient(to top, var(--violet5), var(--base));
  background: -webkit-linear-gradient(to right, var(--violet5), var(--base));
  background: linear-gradient(to bottom, var(--violet5), var(--base));
}
.bg-g-b-base-violet5{
  background: -moz-linear-gradient(to bottom, var(--violet5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--violet5), var(--base));
  background: linear-gradient(to top, var(--violet5), var(--base));
}
/*fuschia5からbase*/
.bg-g-r-base-fuschia5{
  background: -moz-linear-gradient(to right, var(--fuschia5), var(--base));
  background: -webkit-linear-gradient(to right, var(--fuschia5), var(--base));
  background: linear-gradient(to left, var(--fuschia5), var(--base));
}
.bg-g-l-base-fuschia5{
  background: -moz-linear-gradient(to left, var(--fuschia5), var(--base));
  background: -webkit-linear-gradient(to left, var(--fuschia5), var(--base));
  background: linear-gradient(to right, var(--fuschia5), var(--base));
}
.bg-g-t-base-fuschia5{
  background: -moz-linear-gradient(to top, var(--fuschia5), var(--base));
  background: -webkit-linear-gradient(to right, var(--fuschia5), var(--base));
  background: linear-gradient(to bottom, var(--fuschia5), var(--base));
}
.bg-g-b-base-fuschia5{
  background: -moz-linear-gradient(to bottom, var(--fuschia5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--fuschia5), var(--base));
  background: linear-gradient(to top, var(--fuschia5), var(--base));
}
/*pink5からbase*/
.bg-g-r-base-pink5{
  background: -moz-linear-gradient(to right, var(--pink5), var(--base));
  background: -webkit-linear-gradient(to right, var(--pink5), var(--base));
  background: linear-gradient(to left, var(--pink5), var(--base));
}
.bg-g-l-base-pink5{
  background: -moz-linear-gradient(to left, var(--pink5), var(--base));
  background: -webkit-linear-gradient(to left, var(--pink5), var(--base));
  background: linear-gradient(to right, var(--pink5), var(--base));
}
.bg-g-t-base-pink5{
  background: -moz-linear-gradient(to top, var(--pink5), var(--base));
  background: -webkit-linear-gradient(to right, var(--pink5), var(--base));
  background: linear-gradient(to bottom, var(--pink5), var(--base));
}
.bg-g-b-base-pink5{
  background: -moz-linear-gradient(to bottom, var(--pink5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--pink5), var(--base));
  background: linear-gradient(to top, var(--pink5), var(--base));
}
/*red5からbase*/
.bg-g-r-base-red5{
  background: -moz-linear-gradient(to right, var(--red5), var(--base));
  background: -webkit-linear-gradient(to right, var(--red5), var(--base));
  background: linear-gradient(to left, var(--red5), var(--base));
}
.bg-g-l-base-red5{
  background: -moz-linear-gradient(to left, var(--red5), var(--base));
  background: -webkit-linear-gradient(to left, var(--red5), var(--base));
  background: linear-gradient(to right, var(--red5), var(--base));
}
.bg-g-t-base-red5{
  background: -moz-linear-gradient(to top, var(--red5), var(--base));
  background: -webkit-linear-gradient(to right, var(--red5), var(--base));
  background: linear-gradient(to bottom, var(--red5), var(--base));
}
.bg-g-b-base-red5{
  background: -moz-linear-gradient(to bottom, var(--red5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--red5), var(--base));
  background: linear-gradient(to top, var(--red5), var(--base));
}
/*orange5からbase*/
.bg-g-r-base-orange5{
  background: -moz-linear-gradient(to right, var(--orange5), var(--base));
  background: -webkit-linear-gradient(to right, var(--orange5), var(--base));
  background: linear-gradient(to left, var(--orange5), var(--base));
}
.bg-g-l-base-orange5{
  background: -moz-linear-gradient(to left, var(--orange5), var(--base));
  background: -webkit-linear-gradient(to left, var(--orange5), var(--base));
  background: linear-gradient(to right, var(--orange5), var(--base));
}
.bg-g-t-base-orange5{
  background: -moz-linear-gradient(to top, var(--orange5), var(--base));
  background: -webkit-linear-gradient(to right, var(--orange5), var(--base));
  background: linear-gradient(to bottom, var(--orange5), var(--base));
}
.bg-g-b-base-orange5{
  background: -moz-linear-gradient(to bottom, var(--orange5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--orange5), var(--base));
  background: linear-gradient(to top, var(--orange5), var(--base));
}
/*yellow5からbase*/
.bg-g-r-base-yellow5{
  background: -moz-linear-gradient(to right, var(--yellow5), var(--base));
  background: -webkit-linear-gradient(to right, var(--yellow5), var(--base));
  background: linear-gradient(to left, var(--yellow5), var(--base));
}
.bg-g-l-base-yellow5{
  background: -moz-linear-gradient(to left, var(--yellow5), var(--base));
  background: -webkit-linear-gradient(to left, var(--yellow5), var(--base));
  background: linear-gradient(to right, var(--yellow5), var(--base));
}
.bg-g-t-base-yellow5{
  background: -moz-linear-gradient(to top, var(--yellow5), var(--base));
  background: -webkit-linear-gradient(to right, var(--yellow5), var(--base));
  background: linear-gradient(to bottom, var(--yellow5), var(--base));
}
.bg-g-b-base-yellow5{
  background: -moz-linear-gradient(to bottom, var(--yellow5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--yellow5), var(--base));
  background: linear-gradient(to top, var(--yellow5), var(--base));
}
/*lime5からbase*/
.bg-g-r-base-lime5{
  background: -moz-linear-gradient(to right, var(--lime5), var(--base));
  background: -webkit-linear-gradient(to right, var(--lime5), var(--base));
  background: linear-gradient(to left, var(--lime5), var(--base));
}
.bg-g-l-base-lime5{
  background: -moz-linear-gradient(to left, var(--lime5), var(--base));
  background: -webkit-linear-gradient(to left, var(--lime5), var(--base));
  background: linear-gradient(to right, var(--lime5), var(--base));
}
.bg-g-t-base-lime5{
  background: -moz-linear-gradient(to top, var(--lime5), var(--base));
  background: -webkit-linear-gradient(to right, var(--lime5), var(--base));
  background: linear-gradient(to bottom, var(--lime5), var(--base));
}
.bg-g-b-base-lime5{
  background: -moz-linear-gradient(to bottom, var(--lime5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--lime5), var(--base));
  background: linear-gradient(to top, var(--lime5), var(--base));
}
/*green5からbase*/
.bg-g-r-base-green5{
  background: -moz-linear-gradient(to right, var(--green5), var(--base));
  background: -webkit-linear-gradient(to right, var(--green5), var(--base));
  background: linear-gradient(to left, var(--green5), var(--base));
}
.bg-g-l-base-green5{
  background: -moz-linear-gradient(to left, var(--green5), var(--base));
  background: -webkit-linear-gradient(to left, var(--green5), var(--base));
  background: linear-gradient(to right, var(--green5), var(--base));
}
.bg-g-t-base-green5{
  background: -moz-linear-gradient(to top, var(--green5), var(--base));
  background: -webkit-linear-gradient(to right, var(--green5), var(--base));
  background: linear-gradient(to bottom, var(--green5), var(--base));
}
.bg-g-b-base-green5{
  background: -moz-linear-gradient(to bottom, var(--green5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--green5), var(--base));
  background: linear-gradient(to top, var(--green5), var(--base));
}/*teal5からbase*/
.bg-g-r-base-teal5{
  background: -moz-linear-gradient(to right, var(--teal5), var(--base));
  background: -webkit-linear-gradient(to right, var(--teal5), var(--base));
  background: linear-gradient(to left, var(--teal5), var(--base));
}
.bg-g-l-base-teal5{
  background: -moz-linear-gradient(to left, var(--teal5), var(--base));
  background: -webkit-linear-gradient(to left, var(--teal5), var(--base));
  background: linear-gradient(to right, var(--teal5), var(--base));
}
.bg-g-t-base-teal5{
  background: -moz-linear-gradient(to top, var(--teal5), var(--base));
  background: -webkit-linear-gradient(to right, var(--teal5), var(--base));
  background: linear-gradient(to bottom, var(--teal5), var(--base));
}
.bg-g-b-base-teal5{
  background: -moz-linear-gradient(to bottom, var(--teal5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--teal5), var(--base));
  background: linear-gradient(to top, var(--teal5), var(--base));
}
/*cyan5からbase*/
.bg-g-r-base-cyan5{
  background: -moz-linear-gradient(to right, var(--cyan5), var(--base));
  background: -webkit-linear-gradient(to right, var(--cyan5), var(--base));
  background: linear-gradient(to left, var(--cyan5), var(--base));
}
.bg-g-l-base-cyan5{
  background: -moz-linear-gradient(to left, var(--cyan5), var(--base));
  background: -webkit-linear-gradient(to left, var(--cyan5), var(--base));
  background: linear-gradient(to right, var(--cyan5), var(--base));
}
.bg-g-t-base-cyan5{
  background: -moz-linear-gradient(to top, var(--cyan5), var(--base));
  background: -webkit-linear-gradient(to right, var(--cyan5), var(--base));
  background: linear-gradient(to bottom, var(--cyan5), var(--base));
}
.bg-g-b-base-cyan5{
  background: -moz-linear-gradient(to bottom, var(--cyan5), var(--base));
  background: -webkit-linear-gradient(to bottom, var(--cyan5), var(--base));
  background: linear-gradient(to top, var(--cyan5), var(--base));
}





/*baseからblack*/
.bg-g-a-base-black {
	-webkit-animation: bg-g-a-base-black 4s linear infinite alternate both;
	        animation: bg-g-a-base-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-black {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-base-gray5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--black);
  }
}
/*baseからgray5*/
.bg-g-a-base-gray5 {
	-webkit-animation: bg-g-a-base-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-base-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-gray5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-base-gray5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--gray5);
  }
}
/*baseからblue5*/
.bg-g-a-base-blue5 {
	-webkit-animation: bg-g-a-base-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-base-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-blue5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-base-blue5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--blue5);
  }
}
/*baseからindigo5*/
.bg-g-a-base-indigo5 {
	-webkit-animation: bg-g-a-base-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-base-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-indigo5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-base-indigo5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--indigo5);
  }
}/*baseからviolet5*/
.bg-g-a-base-violet5 {
	-webkit-animation: bg-g-a-base-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-base-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-violet5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-base-violet5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--violet5);
  }
}
/*baseからpink5*/
.bg-g-a-base-pink5 {
	-webkit-animation: bg-g-a-base-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-base-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-pink5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-base-pink5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--pink5);
  }
}
/*baseからfuschia5*/
.bg-g-a-base-fuschia5 {
	-webkit-animation: bg-g-a-base-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-base-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-fuschia5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-base-fuschia5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--fuschia5);
  }
}/*baseからred5*/
.bg-g-a-base-red5 {
	-webkit-animation: bg-g-a-base-red5 4s linear infinite alternate both;
	        animation: bg-g-a-base-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-red5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-base-red5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--red5);
  }
}/*baseからorange5*/
.bg-g-a-base-orange5 {
	-webkit-animation: bg-g-a-base-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-base-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-orange5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-base-orange5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--orange5);
  }
}/*baseからyellow5*/
.bg-g-a-base-yellow5 {
	-webkit-animation: bg-g-a-base-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-base-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-yellow5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-base-yellow5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--yellow5);
  }
}
/*baseからlime5*/
.bg-g-a-base-lime5 {
	-webkit-animation: bg-g-a-base-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-base-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-lime5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-base-lime5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--lime5);
  }
}
/*baseからgreen5*/
.bg-g-a-base-green5 {
	-webkit-animation: bg-g-a-base-green5 4s linear infinite alternate both;
	        animation: bg-g-a-base-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-green5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-base-green5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--green5);
  }
}
/*baseからteal5*/
.bg-g-a-base-teal5 {
	-webkit-animation: bg-g-a-base-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-base-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-teal5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-base-teal5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--teal5);
  }
}
/*baseからcyan5*/
.bg-g-a-base-cyan5 {
	-webkit-animation: bg-g-a-base-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-base-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-base-cyan5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-base-cyan5 {
  0% {
    background: var(--base);
  }
  100% {
    background: var(--cyan5);
  }
}
/*blackからblack*/
.bg-g-a-black-black {
	-webkit-animation: bg-g-a-black-black 4s linear infinite alternate both;
	        animation: bg-g-a-black-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-black {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-black-gray5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--black);
  }
}
/*blackからgray5*/
.bg-g-a-black-gray5 {
	-webkit-animation: bg-g-a-black-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-black-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-gray5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-black-gray5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--gray5);
  }
}
/*blackからblue5*/
.bg-g-a-black-blue5 {
	-webkit-animation: bg-g-a-black-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-black-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-blue5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-black-blue5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--blue5);
  }
}
/*blackからindigo5*/
.bg-g-a-black-indigo5 {
	-webkit-animation: bg-g-a-black-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-black-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-indigo5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-black-indigo5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--indigo5);
  }
}/*blackからviolet5*/
.bg-g-a-black-violet5 {
	-webkit-animation: bg-g-a-black-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-black-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-violet5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-black-violet5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--violet5);
  }
}
/*blackからpink5*/
.bg-g-a-black-pink5 {
	-webkit-animation: bg-g-a-black-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-black-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-pink5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-black-pink5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--pink5);
  }
}
/*blackからfuschia5*/
.bg-g-a-black-fuschia5 {
	-webkit-animation: bg-g-a-black-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-black-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-fuschia5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-black-fuschia5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--fuschia5);
  }
}/*blackからred5*/
.bg-g-a-black-red5 {
	-webkit-animation: bg-g-a-black-red5 4s linear infinite alternate both;
	        animation: bg-g-a-black-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-red5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-black-red5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--red5);
  }
}/*blackからorange5*/
.bg-g-a-black-orange5 {
	-webkit-animation: bg-g-a-black-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-black-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-orange5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-black-orange5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--orange5);
  }
}/*blackからyellow5*/
.bg-g-a-black-yellow5 {
	-webkit-animation: bg-g-a-black-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-black-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-yellow5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-black-yellow5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--yellow5);
  }
}
/*blackからlime5*/
.bg-g-a-black-lime5 {
	-webkit-animation: bg-g-a-black-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-black-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-lime5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-black-lime5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--lime5);
  }
}
/*blackからgreen5*/
.bg-g-a-black-green5 {
	-webkit-animation: bg-g-a-black-green5 4s linear infinite alternate both;
	        animation: bg-g-a-black-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-green5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-black-green5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--green5);
  }
}
/*blackからteal5*/
.bg-g-a-black-teal5 {
	-webkit-animation: bg-g-a-black-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-black-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-teal5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-black-teal5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--teal5);
  }
}
/*blackからcyan5*/
.bg-g-a-black-cyan5 {
	-webkit-animation: bg-g-a-black-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-black-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-black-cyan5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-black-cyan5 {
  0% {
    background: var(--black);
  }
  100% {
    background: var(--cyan5);
  }
}

/*gray5からblack*/
.bg-g-a-gray5-black {
	-webkit-animation: bg-g-a-gray5-black 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-black {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-gray5-gray5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--black);
  }
}
/*gray5からgray5*/
.bg-g-a-gray5-gray5 {
	-webkit-animation: bg-g-a-gray5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-gray5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-gray5-gray5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--gray5);
  }
}
/*gray5からblue5*/
.bg-g-a-gray5-blue5 {
	-webkit-animation: bg-g-a-gray5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-blue5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-gray5-blue5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--blue5);
  }
}
/*gray5からindigo5*/
.bg-g-a-gray5-indigo5 {
	-webkit-animation: bg-g-a-gray5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-indigo5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-gray5-indigo5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--indigo5);
  }
}/*gray5からviolet5*/
.bg-g-a-gray5-violet5 {
	-webkit-animation: bg-g-a-gray5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-violet5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-gray5-violet5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--violet5);
  }
}
/*gray5からpink5*/
.bg-g-a-gray5-pink5 {
	-webkit-animation: bg-g-a-gray5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-pink5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-gray5-pink5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--pink5);
  }
}
/*gray5からfuschia5*/
.bg-g-a-gray5-fuschia5 {
	-webkit-animation: bg-g-a-gray5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-fuschia5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-gray5-fuschia5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*gray5からred5*/
.bg-g-a-gray5-red5 {
	-webkit-animation: bg-g-a-gray5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-red5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-gray5-red5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--red5);
  }
}/*gray5からorange5*/
.bg-g-a-gray5-orange5 {
	-webkit-animation: bg-g-a-gray5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-orange5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-gray5-orange5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--orange5);
  }
}/*gray5からyellow5*/
.bg-g-a-gray5-yellow5 {
	-webkit-animation: bg-g-a-gray5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-yellow5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-gray5-yellow5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*gray5からlime5*/
.bg-g-a-gray5-lime5 {
	-webkit-animation: bg-g-a-gray5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-lime5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-gray5-lime5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--lime5);
  }
}
/*gray5からgreen5*/
.bg-g-a-gray5-green5 {
	-webkit-animation: bg-g-a-gray5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-green5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-gray5-green5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--green5);
  }
}
/*gray5からteal5*/
.bg-g-a-gray5-teal5 {
	-webkit-animation: bg-g-a-gray5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-teal5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-gray5-teal5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--teal5);
  }
}
/*gray5からcyan5*/
.bg-g-a-gray5-cyan5 {
	-webkit-animation: bg-g-a-gray5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-gray5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-gray5-cyan5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-gray5-cyan5 {
  0% {
    background: var(--gray5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*blue5からblack*/
.bg-g-a-blue5-black {
	-webkit-animation: bg-g-a-blue5-black 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-black {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-blue5-gray5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--black);
  }
}
/*blue5からgray5*/
.bg-g-a-blue5-gray5 {
	-webkit-animation: bg-g-a-blue5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-gray5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-blue5-gray5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--gray5);
  }
}
/*blue5からblue5*/
.bg-g-a-blue5-blue5 {
	-webkit-animation: bg-g-a-blue5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-blue5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-blue5-blue5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--blue5);
  }
}
/*blue5からindigo5*/
.bg-g-a-blue5-indigo5 {
	-webkit-animation: bg-g-a-blue5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-indigo5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-blue5-indigo5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--indigo5);
  }
}/*blue5からviolet5*/
.bg-g-a-blue5-violet5 {
	-webkit-animation: bg-g-a-blue5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-violet5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-blue5-violet5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--violet5);
  }
}
/*blue5からpink5*/
.bg-g-a-blue5-pink5 {
	-webkit-animation: bg-g-a-blue5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-pink5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-blue5-pink5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--pink5);
  }
}
/*blue5からfuschia5*/
.bg-g-a-blue5-fuschia5 {
	-webkit-animation: bg-g-a-blue5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-fuschia5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-blue5-fuschia5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*blue5からred5*/
.bg-g-a-blue5-red5 {
	-webkit-animation: bg-g-a-blue5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-red5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-blue5-red5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--red5);
  }
}/*blue5からorange5*/
.bg-g-a-blue5-orange5 {
	-webkit-animation: bg-g-a-blue5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-orange5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-blue5-orange5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--orange5);
  }
}/*blue5からyellow5*/
.bg-g-a-blue5-yellow5 {
	-webkit-animation: bg-g-a-blue5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-yellow5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-blue5-yellow5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*blue5からlime5*/
.bg-g-a-blue5-lime5 {
	-webkit-animation: bg-g-a-blue5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-lime5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-blue5-lime5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--lime5);
  }
}
/*blue5からgreen5*/
.bg-g-a-blue5-green5 {
	-webkit-animation: bg-g-a-blue5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-green5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-blue5-green5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--green5);
  }
}
/*blue5からteal5*/
.bg-g-a-blue5-teal5 {
	-webkit-animation: bg-g-a-blue5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-teal5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-blue5-teal5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--teal5);
  }
}
/*blue5からcyan5*/
.bg-g-a-blue5-cyan5 {
	-webkit-animation: bg-g-a-blue5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-blue5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-blue5-cyan5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-blue5-cyan5 {
  0% {
    background: var(--blue5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*indigo5からblack*/
.bg-g-a-indigo5-black {
	-webkit-animation: bg-g-a-indigo5-black 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-black {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-indigo5-gray5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--black);
  }
}
/*indigo5からgray5*/
.bg-g-a-indigo5-gray5 {
	-webkit-animation: bg-g-a-indigo5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-gray5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-indigo5-gray5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--gray5);
  }
}
/*indigo5からblue5*/
.bg-g-a-indigo5-blue5 {
	-webkit-animation: bg-g-a-indigo5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-blue5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-indigo5-blue5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--blue5);
  }
}
/*indigo5からindigo5*/
.bg-g-a-indigo5-indigo5 {
	-webkit-animation: bg-g-a-indigo5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-indigo5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-indigo5-indigo5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--indigo5);
  }
}/*indigo5からviolet5*/
.bg-g-a-indigo5-violet5 {
	-webkit-animation: bg-g-a-indigo5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-violet5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-indigo5-violet5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--violet5);
  }
}
/*indigo5からpink5*/
.bg-g-a-indigo5-pink5 {
	-webkit-animation: bg-g-a-indigo5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-pink5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-indigo5-pink5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--pink5);
  }
}
/*indigo5からfuschia5*/
.bg-g-a-indigo5-fuschia5 {
	-webkit-animation: bg-g-a-indigo5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-fuschia5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-indigo5-fuschia5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*indigo5からred5*/
.bg-g-a-indigo5-red5 {
	-webkit-animation: bg-g-a-indigo5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-red5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-indigo5-red5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--red5);
  }
}/*indigo5からorange5*/
.bg-g-a-indigo5-orange5 {
	-webkit-animation: bg-g-a-indigo5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-orange5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-indigo5-orange5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--orange5);
  }
}/*indigo5からyellow5*/
.bg-g-a-indigo5-yellow5 {
	-webkit-animation: bg-g-a-indigo5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-yellow5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-indigo5-yellow5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*indigo5からlime5*/
.bg-g-a-indigo5-lime5 {
	-webkit-animation: bg-g-a-indigo5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-lime5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-indigo5-lime5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--lime5);
  }
}
/*indigo5からgreen5*/
.bg-g-a-indigo5-green5 {
	-webkit-animation: bg-g-a-indigo5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-green5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-indigo5-green5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--green5);
  }
}
/*indigo5からteal5*/
.bg-g-a-indigo5-teal5 {
	-webkit-animation: bg-g-a-indigo5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-teal5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-indigo5-teal5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--teal5);
  }
}
/*indigo5からcyan5*/
.bg-g-a-indigo5-cyan5 {
	-webkit-animation: bg-g-a-indigo5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-indigo5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-indigo5-cyan5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-indigo5-cyan5 {
  0% {
    background: var(--indigo5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*violet5からblack*/
.bg-g-a-violet5-black {
	-webkit-animation: bg-g-a-violet5-black 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-black {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-violet5-gray5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--black);
  }
}
/*violet5からgray5*/
.bg-g-a-violet5-gray5 {
	-webkit-animation: bg-g-a-violet5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-gray5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-violet5-gray5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--gray5);
  }
}
/*violet5からblue5*/
.bg-g-a-violet5-blue5 {
	-webkit-animation: bg-g-a-violet5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-blue5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-violet5-blue5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--blue5);
  }
}
/*violet5からindigo5*/
.bg-g-a-violet5-indigo5 {
	-webkit-animation: bg-g-a-violet5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-indigo5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-violet5-indigo5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--indigo5);
  }
}/*violet5からviolet5*/
.bg-g-a-violet5-violet5 {
	-webkit-animation: bg-g-a-violet5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-violet5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-violet5-violet5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--violet5);
  }
}
/*violet5からpink5*/
.bg-g-a-violet5-pink5 {
	-webkit-animation: bg-g-a-violet5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-pink5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-violet5-pink5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--pink5);
  }
}
/*violet5からfuschia5*/
.bg-g-a-violet5-fuschia5 {
	-webkit-animation: bg-g-a-violet5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-fuschia5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-violet5-fuschia5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*violet5からred5*/
.bg-g-a-violet5-red5 {
	-webkit-animation: bg-g-a-violet5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-red5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-violet5-red5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--red5);
  }
}/*violet5からorange5*/
.bg-g-a-violet5-orange5 {
	-webkit-animation: bg-g-a-violet5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-orange5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-violet5-orange5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--orange5);
  }
}/*violet5からyellow5*/
.bg-g-a-violet5-yellow5 {
	-webkit-animation: bg-g-a-violet5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-yellow5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-violet5-yellow5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*violet5からlime5*/
.bg-g-a-violet5-lime5 {
	-webkit-animation: bg-g-a-violet5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-lime5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-violet5-lime5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--lime5);
  }
}
/*violet5からgreen5*/
.bg-g-a-violet5-green5 {
	-webkit-animation: bg-g-a-violet5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-green5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-violet5-green5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--green5);
  }
}
/*violet5からteal5*/
.bg-g-a-violet5-teal5 {
	-webkit-animation: bg-g-a-violet5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-teal5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-violet5-teal5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--teal5);
  }
}
/*violet5からcyan5*/
.bg-g-a-violet5-cyan5 {
	-webkit-animation: bg-g-a-violet5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-violet5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-violet5-cyan5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-violet5-cyan5 {
  0% {
    background: var(--violet5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*fuschia5からblack*/
.bg-g-a-fuschia5-black {
	-webkit-animation: bg-g-a-fuschia5-black 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-black {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-fuschia5-gray5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--black);
  }
}
/*fuschia5からgray5*/
.bg-g-a-fuschia5-gray5 {
	-webkit-animation: bg-g-a-fuschia5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-gray5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-fuschia5-gray5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--gray5);
  }
}
/*fuschia5からblue5*/
.bg-g-a-fuschia5-blue5 {
	-webkit-animation: bg-g-a-fuschia5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-blue5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-fuschia5-blue5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--blue5);
  }
}
/*fuschia5からindigo5*/
.bg-g-a-fuschia5-indigo5 {
	-webkit-animation: bg-g-a-fuschia5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-indigo5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-fuschia5-indigo5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--indigo5);
  }
}/*fuschia5からviolet5*/
.bg-g-a-fuschia5-violet5 {
	-webkit-animation: bg-g-a-fuschia5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-violet5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-fuschia5-violet5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--violet5);
  }
}
/*fuschia5からpink5*/
.bg-g-a-fuschia5-pink5 {
	-webkit-animation: bg-g-a-fuschia5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-pink5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-fuschia5-pink5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--pink5);
  }
}
/*fuschia5からfuschia5*/
.bg-g-a-fuschia5-fuschia5 {
	-webkit-animation: bg-g-a-fuschia5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-fuschia5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-fuschia5-fuschia5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*fuschia5からred5*/
.bg-g-a-fuschia5-red5 {
	-webkit-animation: bg-g-a-fuschia5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-red5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-fuschia5-red5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--red5);
  }
}/*fuschia5からorange5*/
.bg-g-a-fuschia5-orange5 {
	-webkit-animation: bg-g-a-fuschia5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-orange5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-fuschia5-orange5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--orange5);
  }
}/*fuschia5からyellow5*/
.bg-g-a-fuschia5-yellow5 {
	-webkit-animation: bg-g-a-fuschia5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-yellow5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-fuschia5-yellow5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*fuschia5からlime5*/
.bg-g-a-fuschia5-lime5 {
	-webkit-animation: bg-g-a-fuschia5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-lime5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-fuschia5-lime5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--lime5);
  }
}
/*fuschia5からgreen5*/
.bg-g-a-fuschia5-green5 {
	-webkit-animation: bg-g-a-fuschia5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-green5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-fuschia5-green5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--green5);
  }
}
/*fuschia5からteal5*/
.bg-g-a-fuschia5-teal5 {
	-webkit-animation: bg-g-a-fuschia5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-teal5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-fuschia5-teal5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--teal5);
  }
}
/*fuschia5からcyan5*/
.bg-g-a-fuschia5-cyan5 {
	-webkit-animation: bg-g-a-fuschia5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-fuschia5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-fuschia5-cyan5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-fuschia5-cyan5 {
  0% {
    background: var(--fuschia5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*pink5からblack*/
.bg-g-a-pink5-black {
	-webkit-animation: bg-g-a-pink5-black 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-black {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-pink5-gray5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--black);
  }
}
/*pink5からgray5*/
.bg-g-a-pink5-gray5 {
	-webkit-animation: bg-g-a-pink5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-gray5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-pink5-gray5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--gray5);
  }
}
/*pink5からblue5*/
.bg-g-a-pink5-blue5 {
	-webkit-animation: bg-g-a-pink5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-blue5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-pink5-blue5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--blue5);
  }
}
/*pink5からindigo5*/
.bg-g-a-pink5-indigo5 {
	-webkit-animation: bg-g-a-pink5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-indigo5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-pink5-indigo5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--indigo5);
  }
}/*pink5からviolet5*/
.bg-g-a-pink5-violet5 {
	-webkit-animation: bg-g-a-pink5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-violet5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-pink5-violet5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--violet5);
  }
}
/*pink5からpink5*/
.bg-g-a-pink5-pink5 {
	-webkit-animation: bg-g-a-pink5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-pink5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-pink5-pink5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--pink5);
  }
}
/*pink5からfuschia5*/
.bg-g-a-pink5-fuschia5 {
	-webkit-animation: bg-g-a-pink5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-fuschia5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-pink5-fuschia5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*pink5からred5*/
.bg-g-a-pink5-red5 {
	-webkit-animation: bg-g-a-pink5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-red5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-pink5-red5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--red5);
  }
}/*pink5からorange5*/
.bg-g-a-pink5-orange5 {
	-webkit-animation: bg-g-a-pink5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-orange5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-pink5-orange5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--orange5);
  }
}/*pink5からyellow5*/
.bg-g-a-pink5-yellow5 {
	-webkit-animation: bg-g-a-pink5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-yellow5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-pink5-yellow5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*pink5からlime5*/
.bg-g-a-pink5-lime5 {
	-webkit-animation: bg-g-a-pink5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-lime5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-pink5-lime5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--lime5);
  }
}
/*pink5からgreen5*/
.bg-g-a-pink5-green5 {
	-webkit-animation: bg-g-a-pink5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-green5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-pink5-green5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--green5);
  }
}
/*pink5からteal5*/
.bg-g-a-pink5-teal5 {
	-webkit-animation: bg-g-a-pink5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-teal5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-pink5-teal5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--teal5);
  }
}
/*pink5からcyan5*/
.bg-g-a-pink5-cyan5 {
	-webkit-animation: bg-g-a-pink5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-pink5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-pink5-cyan5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-pink5-cyan5 {
  0% {
    background: var(--pink5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*red5からblack*/
.bg-g-a-red5-black {
	-webkit-animation: bg-g-a-red5-black 4s linear infinite alternate both;
	        animation: bg-g-a-red5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-black {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-red5-gray5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--black);
  }
}
/*red5からgray5*/
.bg-g-a-red5-gray5 {
	-webkit-animation: bg-g-a-red5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-gray5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-red5-gray5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--gray5);
  }
}
/*red5からblue5*/
.bg-g-a-red5-blue5 {
	-webkit-animation: bg-g-a-red5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-blue5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-red5-blue5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--blue5);
  }
}
/*red5からindigo5*/
.bg-g-a-red5-indigo5 {
	-webkit-animation: bg-g-a-red5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-indigo5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-red5-indigo5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--indigo5);
  }
}/*red5からviolet5*/
.bg-g-a-red5-violet5 {
	-webkit-animation: bg-g-a-red5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-violet5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-red5-violet5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--violet5);
  }
}
/*red5からpink5*/
.bg-g-a-red5-pink5 {
	-webkit-animation: bg-g-a-red5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-pink5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-red5-pink5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--pink5);
  }
}
/*red5からfuschia5*/
.bg-g-a-red5-fuschia5 {
	-webkit-animation: bg-g-a-red5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-fuschia5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-red5-fuschia5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*red5からred5*/
.bg-g-a-red5-red5 {
	-webkit-animation: bg-g-a-red5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-red5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-red5-red5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--red5);
  }
}/*red5からorange5*/
.bg-g-a-red5-orange5 {
	-webkit-animation: bg-g-a-red5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-orange5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-red5-orange5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--orange5);
  }
}/*red5からyellow5*/
.bg-g-a-red5-yellow5 {
	-webkit-animation: bg-g-a-red5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-yellow5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-red5-yellow5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*red5からlime5*/
.bg-g-a-red5-lime5 {
	-webkit-animation: bg-g-a-red5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-lime5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-red5-lime5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--lime5);
  }
}
/*red5からgreen5*/
.bg-g-a-red5-green5 {
	-webkit-animation: bg-g-a-red5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-green5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-red5-green5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--green5);
  }
}
/*red5からteal5*/
.bg-g-a-red5-teal5 {
	-webkit-animation: bg-g-a-red5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-teal5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-red5-teal5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--teal5);
  }
}
/*red5からcyan5*/
.bg-g-a-red5-cyan5 {
	-webkit-animation: bg-g-a-red5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-red5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-red5-cyan5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-red5-cyan5 {
  0% {
    background: var(--red5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*orange5からblack*/
.bg-g-a-orange5-black {
	-webkit-animation: bg-g-a-orange5-black 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-black {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-orange5-gray5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--black);
  }
}
/*orange5からgray5*/
.bg-g-a-orange5-gray5 {
	-webkit-animation: bg-g-a-orange5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-gray5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-orange5-gray5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--gray5);
  }
}
/*orange5からblue5*/
.bg-g-a-orange5-blue5 {
	-webkit-animation: bg-g-a-orange5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-blue5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-orange5-blue5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--blue5);
  }
}
/*orange5からindigo5*/
.bg-g-a-orange5-indigo5 {
	-webkit-animation: bg-g-a-orange5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-indigo5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-orange5-indigo5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--indigo5);
  }
}/*orange5からviolet5*/
.bg-g-a-orange5-violet5 {
	-webkit-animation: bg-g-a-orange5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-violet5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-orange5-violet5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--violet5);
  }
}
/*orange5からpink5*/
.bg-g-a-orange5-pink5 {
	-webkit-animation: bg-g-a-orange5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-pink5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-orange5-pink5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--pink5);
  }
}
/*orange5からfuschia5*/
.bg-g-a-orange5-fuschia5 {
	-webkit-animation: bg-g-a-orange5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-fuschia5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-orange5-fuschia5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*orange5からred5*/
.bg-g-a-orange5-red5 {
	-webkit-animation: bg-g-a-orange5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-red5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-orange5-red5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--red5);
  }
}/*orange5からorange5*/
.bg-g-a-orange5-orange5 {
	-webkit-animation: bg-g-a-orange5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-orange5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-orange5-orange5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--orange5);
  }
}/*orange5からyellow5*/
.bg-g-a-orange5-yellow5 {
	-webkit-animation: bg-g-a-orange5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-yellow5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-orange5-yellow5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*orange5からlime5*/
.bg-g-a-orange5-lime5 {
	-webkit-animation: bg-g-a-orange5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-lime5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-orange5-lime5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--lime5);
  }
}
/*orange5からgreen5*/
.bg-g-a-orange5-green5 {
	-webkit-animation: bg-g-a-orange5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-green5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-orange5-green5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--green5);
  }
}
/*orange5からteal5*/
.bg-g-a-orange5-teal5 {
	-webkit-animation: bg-g-a-orange5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-teal5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-orange5-teal5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--teal5);
  }
}
/*orange5からcyan5*/
.bg-g-a-orange5-cyan5 {
	-webkit-animation: bg-g-a-orange5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-orange5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-orange5-cyan5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-orange5-cyan5 {
  0% {
    background: var(--orange5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*yellow5からblack*/
.bg-g-a-yellow5-black {
	-webkit-animation: bg-g-a-yellow5-black 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-black {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-yellow5-gray5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--black);
  }
}
/*yellow5からgray5*/
.bg-g-a-yellow5-gray5 {
	-webkit-animation: bg-g-a-yellow5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-gray5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-yellow5-gray5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--gray5);
  }
}
/*yellow5からblue5*/
.bg-g-a-yellow5-blue5 {
	-webkit-animation: bg-g-a-yellow5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-blue5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-yellow5-blue5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--blue5);
  }
}
/*yellow5からindigo5*/
.bg-g-a-yellow5-indigo5 {
	-webkit-animation: bg-g-a-yellow5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-indigo5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-yellow5-indigo5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--indigo5);
  }
}/*yellow5からviolet5*/
.bg-g-a-yellow5-violet5 {
	-webkit-animation: bg-g-a-yellow5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-violet5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-yellow5-violet5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--violet5);
  }
}
/*yellow5からpink5*/
.bg-g-a-yellow5-pink5 {
	-webkit-animation: bg-g-a-yellow5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-pink5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-yellow5-pink5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--pink5);
  }
}
/*yellow5からfuschia5*/
.bg-g-a-yellow5-fuschia5 {
	-webkit-animation: bg-g-a-yellow5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-fuschia5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-yellow5-fuschia5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*yellow5からred5*/
.bg-g-a-yellow5-red5 {
	-webkit-animation: bg-g-a-yellow5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-red5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-yellow5-red5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--red5);
  }
}/*yellow5からorange5*/
.bg-g-a-yellow5-orange5 {
	-webkit-animation: bg-g-a-yellow5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-orange5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-yellow5-orange5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--orange5);
  }
}/*yellow5からyellow5*/
.bg-g-a-yellow5-yellow5 {
	-webkit-animation: bg-g-a-yellow5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-yellow5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-yellow5-yellow5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*yellow5からlime5*/
.bg-g-a-yellow5-lime5 {
	-webkit-animation: bg-g-a-yellow5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-lime5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-yellow5-lime5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--lime5);
  }
}
/*yellow5からgreen5*/
.bg-g-a-yellow5-green5 {
	-webkit-animation: bg-g-a-yellow5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-green5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-yellow5-green5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--green5);
  }
}
/*yellow5からteal5*/
.bg-g-a-yellow5-teal5 {
	-webkit-animation: bg-g-a-yellow5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-teal5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-yellow5-teal5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--teal5);
  }
}
/*yellow5からcyan5*/
.bg-g-a-yellow5-cyan5 {
	-webkit-animation: bg-g-a-yellow5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-yellow5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-yellow5-cyan5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-yellow5-cyan5 {
  0% {
    background: var(--yellow5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*lime5からblack*/
.bg-g-a-lime5-black {
	-webkit-animation: bg-g-a-lime5-black 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-black {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-lime5-gray5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--black);
  }
}
/*lime5からgray5*/
.bg-g-a-lime5-gray5 {
	-webkit-animation: bg-g-a-lime5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-gray5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-lime5-gray5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--gray5);
  }
}
/*lime5からblue5*/
.bg-g-a-lime5-blue5 {
	-webkit-animation: bg-g-a-lime5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-blue5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-lime5-blue5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--blue5);
  }
}
/*lime5からindigo5*/
.bg-g-a-lime5-indigo5 {
	-webkit-animation: bg-g-a-lime5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-indigo5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-lime5-indigo5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--indigo5);
  }
}/*lime5からviolet5*/
.bg-g-a-lime5-violet5 {
	-webkit-animation: bg-g-a-lime5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-violet5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-lime5-violet5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--violet5);
  }
}
/*lime5からpink5*/
.bg-g-a-lime5-pink5 {
	-webkit-animation: bg-g-a-lime5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-pink5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-lime5-pink5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--pink5);
  }
}
/*lime5からfuschia5*/
.bg-g-a-lime5-fuschia5 {
	-webkit-animation: bg-g-a-lime5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-fuschia5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-lime5-fuschia5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*lime5からred5*/
.bg-g-a-lime5-red5 {
	-webkit-animation: bg-g-a-lime5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-red5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-lime5-red5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--red5);
  }
}/*lime5からorange5*/
.bg-g-a-lime5-orange5 {
	-webkit-animation: bg-g-a-lime5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-orange5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-lime5-orange5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--orange5);
  }
}/*lime5からyellow5*/
.bg-g-a-lime5-yellow5 {
	-webkit-animation: bg-g-a-lime5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-yellow5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-lime5-yellow5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*lime5からlime5*/
.bg-g-a-lime5-lime5 {
	-webkit-animation: bg-g-a-lime5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-lime5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-lime5-lime5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--lime5);
  }
}
/*lime5からgreen5*/
.bg-g-a-lime5-green5 {
	-webkit-animation: bg-g-a-lime5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-green5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-lime5-green5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--green5);
  }
}
/*lime5からteal5*/
.bg-g-a-lime5-teal5 {
	-webkit-animation: bg-g-a-lime5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-teal5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-lime5-teal5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--teal5);
  }
}
/*lime5からcyan5*/
.bg-g-a-lime5-cyan5 {
	-webkit-animation: bg-g-a-lime5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-lime5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-lime5-cyan5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-lime5-cyan5 {
  0% {
    background: var(--lime5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*green5からblack*/
.bg-g-a-green5-black {
	-webkit-animation: bg-g-a-green5-black 4s linear infinite alternate both;
	        animation: bg-g-a-green5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-black {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-green5-gray5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--black);
  }
}
/*green5からgray5*/
.bg-g-a-green5-gray5 {
	-webkit-animation: bg-g-a-green5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-gray5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-green5-gray5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--gray5);
  }
}
/*green5からblue5*/
.bg-g-a-green5-blue5 {
	-webkit-animation: bg-g-a-green5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-blue5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-green5-blue5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--blue5);
  }
}
/*green5からindigo5*/
.bg-g-a-green5-indigo5 {
	-webkit-animation: bg-g-a-green5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-indigo5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-green5-indigo5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--indigo5);
  }
}/*green5からviolet5*/
.bg-g-a-green5-violet5 {
	-webkit-animation: bg-g-a-green5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-violet5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-green5-violet5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--violet5);
  }
}
/*green5からpink5*/
.bg-g-a-green5-pink5 {
	-webkit-animation: bg-g-a-green5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-pink5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-green5-pink5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--pink5);
  }
}
/*green5からfuschia5*/
.bg-g-a-green5-fuschia5 {
	-webkit-animation: bg-g-a-green5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-fuschia5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-green5-fuschia5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*green5からred5*/
.bg-g-a-green5-red5 {
	-webkit-animation: bg-g-a-green5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-red5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-green5-red5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--red5);
  }
}/*green5からorange5*/
.bg-g-a-green5-orange5 {
	-webkit-animation: bg-g-a-green5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-orange5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-green5-orange5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--orange5);
  }
}/*green5からyellow5*/
.bg-g-a-green5-yellow5 {
	-webkit-animation: bg-g-a-green5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-yellow5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-green5-yellow5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*green5からlime5*/
.bg-g-a-green5-lime5 {
	-webkit-animation: bg-g-a-green5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-lime5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-green5-lime5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--lime5);
  }
}
/*green5からgreen5*/
.bg-g-a-green5-green5 {
	-webkit-animation: bg-g-a-green5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-green5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-green5-green5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--green5);
  }
}
/*green5からteal5*/
.bg-g-a-green5-teal5 {
	-webkit-animation: bg-g-a-green5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-teal5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-green5-teal5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--teal5);
  }
}
/*green5からcyan5*/
.bg-g-a-green5-cyan5 {
	-webkit-animation: bg-g-a-green5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-green5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-green5-cyan5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-green5-cyan5 {
  0% {
    background: var(--green5);
  }
  100% {
    background: var(--cyan5);
  }
}
/*teal5からblack*/
.bg-g-a-teal5-black {
	-webkit-animation: bg-g-a-teal5-black 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-black {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-teal5-gray5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--black);
  }
}
/*teal5からgray5*/
.bg-g-a-teal5-gray5 {
	-webkit-animation: bg-g-a-teal5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-gray5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-teal5-gray5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--gray5);
  }
}
/*teal5からblue5*/
.bg-g-a-teal5-blue5 {
	-webkit-animation: bg-g-a-teal5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-blue5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-teal5-blue5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--blue5);
  }
}
/*teal5からindigo5*/
.bg-g-a-teal5-indigo5 {
	-webkit-animation: bg-g-a-teal5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-indigo5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-teal5-indigo5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--indigo5);
  }
}/*teal5からviolet5*/
.bg-g-a-teal5-violet5 {
	-webkit-animation: bg-g-a-teal5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-violet5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-teal5-violet5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--violet5);
  }
}
/*teal5からpink5*/
.bg-g-a-teal5-pink5 {
	-webkit-animation: bg-g-a-teal5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-pink5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-teal5-pink5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--pink5);
  }
}
/*teal5からfuschia5*/
.bg-g-a-teal5-fuschia5 {
	-webkit-animation: bg-g-a-teal5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-fuschia5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-teal5-fuschia5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*teal5からred5*/
.bg-g-a-teal5-red5 {
	-webkit-animation: bg-g-a-teal5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-red5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-teal5-red5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--red5);
  }
}/*teal5からorange5*/
.bg-g-a-teal5-orange5 {
	-webkit-animation: bg-g-a-teal5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-orange5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-teal5-orange5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--orange5);
  }
}/*teal5からyellow5*/
.bg-g-a-teal5-yellow5 {
	-webkit-animation: bg-g-a-teal5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-yellow5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-teal5-yellow5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*teal5からlime5*/
.bg-g-a-teal5-lime5 {
	-webkit-animation: bg-g-a-teal5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-lime5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-teal5-lime5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--lime5);
  }
}
/*teal5からgreen5*/
.bg-g-a-teal5-green5 {
	-webkit-animation: bg-g-a-teal5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-green5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-teal5-green5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--green5);
  }
}
/*teal5からteal5*/
.bg-g-a-teal5-teal5 {
	-webkit-animation: bg-g-a-teal5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-teal5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-teal5-teal5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--teal5);
  }
}
/*teal5からcyan5*/
.bg-g-a-teal5-cyan5 {
	-webkit-animation: bg-g-a-teal5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-teal5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-teal5-cyan5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-teal5-cyan5 {
  0% {
    background: var(--teal5);
  }
  100% {
    background: var(--cyan5);
  }
}/*cyan5からblack*/
.bg-g-a-cyan5-black {
	-webkit-animation: bg-g-a-cyan5-black 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-black 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-black {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--black);
  }
}
@keyframes bg-g-a-cyan5-gray5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--black);
  }
}
/*cyan5からgray5*/
.bg-g-a-cyan5-gray5 {
	-webkit-animation: bg-g-a-cyan5-gray5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-gray5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-gray5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--gray5);
  }
}
@keyframes bg-g-a-cyan5-gray5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--gray5);
  }
}
/*cyan5からblue5*/
.bg-g-a-cyan5-blue5 {
	-webkit-animation: bg-g-a-cyan5-blue5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-blue5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-blue5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--blue5);
  }
}
@keyframes bg-g-a-cyan5-blue5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--blue5);
  }
}
/*cyan5からindigo5*/
.bg-g-a-cyan5-indigo5 {
	-webkit-animation: bg-g-a-cyan5-indigo5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-indigo5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-indigo5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--indigo5);
  }
}
@keyframes bg-g-a-cyan5-indigo5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--indigo5);
  }
}/*cyan5からviolet5*/
.bg-g-a-cyan5-violet5 {
	-webkit-animation: bg-g-a-cyan5-violet5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-violet5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-violet5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--violet5);
  }
}
@keyframes bg-g-a-cyan5-violet5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--violet5);
  }
}
/*cyan5からpink5*/
.bg-g-a-cyan5-pink5 {
	-webkit-animation: bg-g-a-cyan5-pink5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-pink5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-pink5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--pink5);
  }
}
@keyframes bg-g-a-cyan5-pink5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--pink5);
  }
}
/*cyan5からfuschia5*/
.bg-g-a-cyan5-fuschia5 {
	-webkit-animation: bg-g-a-cyan5-fuschia5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-fuschia5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-fuschia5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--fuschia5);
  }
}
@keyframes bg-g-a-cyan5-fuschia5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--fuschia5);
  }
}/*cyan5からred5*/
.bg-g-a-cyan5-red5 {
	-webkit-animation: bg-g-a-cyan5-red5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-red5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-red5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--red5);
  }
}
@keyframes bg-g-a-cyan5-red5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--red5);
  }
}/*cyan5からorange5*/
.bg-g-a-cyan5-orange5 {
	-webkit-animation: bg-g-a-cyan5-orange5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-orange5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-orange5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--orange5);
  }
}
@keyframes bg-g-a-cyan5-orange5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--orange5);
  }
}/*cyan5からyellow5*/
.bg-g-a-cyan5-yellow5 {
	-webkit-animation: bg-g-a-cyan5-yellow5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-yellow5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-yellow5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--yellow5);
  }
}
@keyframes bg-g-a-cyan5-yellow5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--yellow5);
  }
}
/*cyan5からlime5*/
.bg-g-a-cyan5-lime5 {
	-webkit-animation: bg-g-a-cyan5-lime5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-lime5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-lime5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--lime5);
  }
}
@keyframes bg-g-a-cyan5-lime5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--lime5);
  }
}
/*cyan5からgreen5*/
.bg-g-a-cyan5-green5 {
	-webkit-animation: bg-g-a-cyan5-green5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-green5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-green5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--green5);
  }
}
@keyframes bg-g-a-cyan5-green5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--green5);
  }
}
/*cyan5からteal5*/
.bg-g-a-cyan5-teal5 {
	-webkit-animation: bg-g-a-cyan5-teal5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-teal5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-teal5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--teal5);
  }
}
@keyframes bg-g-a-cyan5-teal5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--teal5);
  }
}
/*cyan5からcyan5*/
.bg-g-a-cyan5-cyan5 {
	-webkit-animation: bg-g-a-cyan5-cyan5 4s linear infinite alternate both;
	        animation: bg-g-a-cyan5-cyan5 4s linear infinite alternate both;
}
@-webkit-keyframes bg-g-a-cyan5-cyan5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--cyan5);
  }
}
@keyframes bg-g-a-cyan5-cyan5 {
  0% {
    background: var(--cyan5);
  }
  100% {
    background: var(--cyan5);
  }
}


/* カラーパレット
----------------------------------------------------------- */ 
.color-box-wpap{
font-size: 80%;
padding: 10px;
}
.color-box{
margin-top: 5px;
height: 25px;
}