@charset "utf-8";

/*紅 red rgba(244, 67, 54, .85)*/ /*粉 pink rgba(255, 150, 220, .85)*/

/*紫 purple rgba(156, 39, 176, .85)*/ /*深紫 deeppurple rgba(103, 58, 183, .85)*/

/*靛青 indigo rgba(63, 81, 181, .85)*/ /*藍 blue rgba(33, 150, 243, .85)*/ /*淺藍 lightblue rgba(3, 169, 244, .85)*/

/*青色 cyan rgba(0, 188, 212, .85)*/ /*藍綠色 teal rgba(0, 150, 136, .85)*/

/*綠 green rgba(76, 175, 80, .85)*/ /*淺綠 lightgreen rgba(139, 195, 74, .85)*/ /*檸檬綠 lime rgba(205, 220, 57, .85)*/

/*黃色 yellow rgba(255, 235, 59, .85)*/ /*琥珀色 amber rgba(255, 193, 7, .85)*/ /*橙色 orange rgba(255, 152, 0, .85)*/ /*深橙 deeporange rgba(255, 87, 34, .85)*/

/*棕色 brown rgba(121, 85, 72, .85)*/ /*灰色 grey rgba(158, 158, 158, .85)*/ /*灰藍 bluegrey rgba(96, 125, 139, .85)*/

/*============================================================================*/

.pl-antcss { position: fixed; top: calc(100% / 2 - 0px) !important; left: calc(100% / 2 - 0px) !important; }

.pl-antcss .banter-loader { zoom: 50%; position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin-left: -36px; margin-top: -36px; }

.pl-antcss .banter-loader__box { float: left; position: relative; margin-right: 6px; width: 20px; height: 20px; border-radius: 3px; }

.pl-antcss .banter-loader__box:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; /*background: rgba(3, 169, 244, .8);*/ }

.pl-antcss .banter-loader__box:nth-child(3n) { margin-right: 0; margin-bottom: 6px; }

.pl-antcss .banter-loader__box:nth-child(1):before,
.banter-loader__box:nth-child(4):before { margin-left: 26px; }

.pl-antcss .banter-loader__box:nth-child(3):before { margin-top: 52px; }

.pl-antcss .banter-loader__box:last-child { margin-bottom: 0; }
.pl-antcss .banter-loader__box:nth-child(1) { background: rgba(244, 67, 54, .8); box-shadow: 0 0 3px 1px rgba(244, 67, 54, .35); animation: preloader-moveBox-1 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(2) { background: rgba(139, 195, 74, .8); box-shadow: 0 0 3px 1px rgba(139, 195, 74, .35); animation: preloader-moveBox-2 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(3) { background: rgba(121, 85, 72, .8); box-shadow: 0 0 3px 1px rgba(121, 85, 72, .35); animation: preloader-moveBox-3 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(4) { background: rgba(63, 81, 181, .8); box-shadow: 0 0 3px 1px rgba(63, 81, 181, .35); animation: preloader-moveBox-4 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(5) { background: rgba(255, 152, 0, .8); box-shadow: 0 0 3px 1px rgba(255, 152, 0, .35); animation: preloader-moveBox-5 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(6) { background: rgba(0, 188, 212, .8); box-shadow: 0 0 3px 1px rgba(0, 188, 212, .35); animation: preloader-moveBox-6 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(7) { background: rgba(96, 125, 139, .8); box-shadow: 0 0 3px 1px rgba(96, 125, 139, .35); animation: preloader-moveBox-7 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(8) { background: rgba(156, 39, 176, .8); box-shadow: 0 0 3px 1px rgba(156, 39, 176, .35); animation: preloader-moveBox-8 4s infinite; }
.pl-antcss .banter-loader__box:nth-child(9) { background: rgba(255, 235, 59, .8); box-shadow: 0 0 3px 1px rgba(255, 235, 59, .35); animation: preloader-moveBox-9 4s infinite; }

@keyframes preloader-moveBox-1 {
	9.0909090909% { transform: translate(-26px, 0); }
	18.1818181818% { transform: translate(0px, 0); }
	27.2727272727% { transform: translate(0px, 0); }
	36.3636363636% { transform: translate(26px, 0); }
	45.4545454545% { transform: translate(26px, 26px); }
	54.5454545455% { transform: translate(26px, 26px); }
	63.6363636364% { transform: translate(26px, 26px); }
	72.7272727273% { transform: translate(26px, 0px); }
	81.8181818182% { transform: translate(0px, 0px); }
	90.9090909091% { transform: translate(-26px, 0px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-2 {
	9.0909090909% { transform: translate(0, 0); }
	18.1818181818% { transform: translate(26px, 0); }
	27.2727272727% { transform: translate(0px, 0); }
	36.3636363636% { transform: translate(26px, 0); }
	45.4545454545% { transform: translate(26px, 26px); }
	54.5454545455% { transform: translate(26px, 26px); }
	63.6363636364% { transform: translate(26px, 26px); }
	72.7272727273% { transform: translate(26px, 26px); }
	81.8181818182% { transform: translate(0px, 26px); }
	90.9090909091% { transform: translate(0px, 26px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-3 {
	9.0909090909% { transform: translate(-26px, 0); }
	18.1818181818% { transform: translate(-26px, 0); }
	27.2727272727% { transform: translate(0px, 0); }
	36.3636363636% { transform: translate(-26px, 0); }
	45.4545454545% { transform: translate(-26px, 0); }
	54.5454545455% { transform: translate(-26px, 0); }
	63.6363636364% { transform: translate(-26px, 0); }
	72.7272727273% { transform: translate(-26px, 0); }
	81.8181818182% { transform: translate(-26px, -26px); }
	90.9090909091% { transform: translate(0px, -26px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-4 {
	9.0909090909% { transform: translate(-26px, 0); }
	18.1818181818% { transform: translate(-26px, 0); }
	27.2727272727% { transform: translate(-26px, -26px); }
	36.3636363636% { transform: translate(0px, -26px); }
	45.4545454545% { transform: translate(0px, 0px); }
	54.5454545455% { transform: translate(0px, -26px); }
	63.6363636364% { transform: translate(0px, -26px); }
	72.7272727273% { transform: translate(0px, -26px); }
	81.8181818182% { transform: translate(-26px, -26px); }
	90.9090909091% { transform: translate(-26px, 0px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-5 {
	9.0909090909% { transform: translate(0, 0); }
	18.1818181818% { transform: translate(0, 0); }
	27.2727272727% { transform: translate(0, 0); }
	36.3636363636% { transform: translate(26px, 0); }
	45.4545454545% { transform: translate(26px, 0); }
	54.5454545455% { transform: translate(26px, 0); }
	63.6363636364% { transform: translate(26px, 0); }
	72.7272727273% { transform: translate(26px, 0); }
	81.8181818182% { transform: translate(26px, -26px); }
	90.9090909091% { transform: translate(0px, -26px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-6 {
	9.0909090909% { transform: translate(0, 0); }
	18.1818181818% { transform: translate(-26px, 0); }
	27.2727272727% { transform: translate(-26px, 0); }
	36.3636363636% { transform: translate(0px, 0); }
	45.4545454545% { transform: translate(0px, 0); }
	54.5454545455% { transform: translate(0px, 0); }
	63.6363636364% { transform: translate(0px, 0); }
	72.7272727273% { transform: translate(0px, 26px); }
	81.8181818182% { transform: translate(-26px, 26px); }
	90.9090909091% { transform: translate(-26px, 0px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-7 {
	9.0909090909% { transform: translate(26px, 0); }
	18.1818181818% { transform: translate(26px, 0); }
	27.2727272727% { transform: translate(26px, 0); }
	36.3636363636% { transform: translate(0px, 0); }
	45.4545454545% { transform: translate(0px, -26px); }
	54.5454545455% { transform: translate(26px, -26px); }
	63.6363636364% { transform: translate(0px, -26px); }
	72.7272727273% { transform: translate(0px, -26px); }
	81.8181818182% { transform: translate(0px, 0px); }
	90.9090909091% { transform: translate(26px, 0px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-8 {
	9.0909090909% { transform: translate(0, 0); }
	18.1818181818% { transform: translate(-26px, 0); }
	27.2727272727% { transform: translate(-26px, -26px); }
	36.3636363636% { transform: translate(0px, -26px); }
	45.4545454545% { transform: translate(0px, -26px); }
	54.5454545455% { transform: translate(0px, -26px); }
	63.6363636364% { transform: translate(0px, -26px); }
	72.7272727273% { transform: translate(0px, -26px); }
	81.8181818182% { transform: translate(26px, -26px); }
	90.9090909091% { transform: translate(26px, 0px); }
	100% { transform: translate(0px, 0px); }
}

@keyframes preloader-moveBox-9 {
	9.0909090909% { transform: translate(-26px, 0); }
	18.1818181818% { transform: translate(-26px, 0); }
	27.2727272727% { transform: translate(0px, 0); }
	36.3636363636% { transform: translate(-26px, 0); }
	45.4545454545% { transform: translate(0px, 0); }
	54.5454545455% { transform: translate(0px, 0); }
	63.6363636364% { transform: translate(-26px, 0); }
	72.7272727273% { transform: translate(-26px, 0); }
	81.8181818182% { transform: translate(-52px, 0); }
	90.9090909091% { transform: translate(-26px, 0); }
	100% { transform: translate(0px, 0); }
}

/*----------------------------------------------------------------------------*/

/*不支援 自選顏色*/

/*----------------------------------------------------------------------------*/

/*============================================================================*/