.client{position: relative;}
.client ._bg{position: absolute;z-index: -1;width: 100%;height: 120%;top: 0;left: 0;}
.client ._bg img{width: 100%;height: 100%;object-fit: cover;}
.clientList{height: 0;width: 100%;padding-bottom: 45%;position: relative;}
.clientList ._logo{width: 19.86111111111111%;position: absolute;top: 20%;left: 50%;transform: translateX(-50%);}
.clientList ._logo>div{width: 100%;height: 0;padding-bottom: 100%;background-color: #5face3;border-radius: 50%;position: relative;}
.clientList ._logo ._cir{position: absolute;top: 0;left: 0;width:100%;height:100%;border:1px solid rgba(255,255,255,0.8);border-radius: 50%;
animation: spread1 10s linear infinite;opacity:0;will-change: transform;z-index: 1;}
@keyframes spread1 {
    0% {
    	transform: scale(1);
        opacity: .2
    }
    100% {
        transform: scale(5);
        opacity: 0
    }
}
.clientList ._logo ._cir.j1{animation-delay: 0s;}
.clientList ._logo ._cir.j2{animation-delay: 2s;}
.clientList ._logo ._cir.j3{animation-delay: 4s;}
.clientList ._logo ._cir.j4{animation-delay: 6s;}
.clientList ._logo ._cir.j5{animation-delay: 8s;}
.clientList ._logo img{    position: absolute;
    top: 50%;
    width: 80%;
    left: 10%;
    transform: translateY(-50%);}
@keyframes spin1{
    to{transform: rotate(1turn);}
}
@keyframes spin2{
    to{transform: rotate(-1turn);}
}
.clientList ._brand{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.clientList ._brand ._item{position: absolute;transform-origin: 40% 40%;animation: spin1 9s infinite linear;will-change: transform;}
.clientList ._brand ._item ._pal{width: 100%;height: 100%;justify-content: center;align-items: center;animation-duration: 1.5s;text-align: center;
background-color: #fff;border-radius: 50%;overflow: hidden;padding: .2rem;box-shadow: 0 .15rem .3rem rgba(255,147,51,.05);will-change: transform;}
.clientList ._brand ._item ._pal img{max-width: 100%;max-height: 100%;object-fit: contain;width: 100%;height: 100%;}
.clientList ._brand ._item.cir1{left: 2%;top: 14%;width: 100px;height:100px;animation: spin1 7s infinite linear;}
.clientList ._brand ._item.cir1 ._pal img{animation: spin1 7s infinite linear reverse;}
.clientList ._brand ._item.cir2{left: 3%;top: 63%;width: 110px;height: 110px;animation: spin2 5s infinite linear;}
.clientList ._brand ._item.cir2 ._pal img{animation: spin2 5s infinite linear reverse;}
.clientList ._brand ._item.cir3{left: 11%;top: 40%;width: 130px;height: 130px;animation: spin2 9s infinite linear;}
.clientList ._brand ._item.cir3 ._pal img{animation: spin2 9s infinite linear reverse;}
.clientList ._brand ._item.cir4{left: 27%;top: 62%;width: 170px;height: 170px;animation: spin2 6s infinite linear;}
.clientList ._brand ._item.cir4 ._pal img{animation: spin2 6s infinite linear reverse;}
.clientList ._brand ._item.cir5{left: 24%;top: 20%;width: 150px;height:150px;animation: spin1 8s infinite linear;}
.clientList ._brand ._item.cir5 ._pal img{animation: spin1 8s infinite linear reverse;}
.clientList ._brand ._item.cir6{left: 17%;top: -5%;width: 140px;height: 140px;animation: spin2 10s infinite linear;}
.clientList ._brand ._item.cir6 ._pal img{animation: spin2 10s infinite linear reverse;}
.clientList ._brand ._item.cir7{right: 27%;top: 2%;width:150px;height:150px;animation: spin1 9s infinite linear;}
.clientList ._brand ._item.cir7 ._pal img{animation: spin1 9s infinite linear reverse;}
.clientList ._brand ._item.cir8{right: 23%;top: 48%;width: 150px;height: 150px;animation: spin2 7s infinite linear;}
.clientList ._brand ._item.cir8 ._pal img{animation: spin2 7s infinite linear reverse;}
.clientList ._brand ._item.cir9{right: 13%;top: 20%;width: 150px;height: 150px;animation: spin1 10s infinite linear;}
.clientList ._brand ._item.cir9 ._pal img{animation: spin1 10s infinite linear reverse;}
.clientList ._brand ._item.cir10{right: 4%;top: 68%;width: 150px;height: 150px;animation: spin2 5s infinite linear;}
.clientList ._brand ._item.cir10 ._pal img{animation: spin2 5s infinite linear reverse;}
.clientList ._brand ._item.cir11{right: 0%;top: 40%;width: 130px;height: 130px;animation: spin2 8s infinite linear;}
.clientList ._brand ._item.cir11 ._pal img{animation: spin2 8s infinite linear reverse;}
.clientList ._brand ._item.cir12{right: 6%;top: -8%;width: 120px;height: 120px;animation: spin1 6s infinite linear;}
.clientList ._brand ._item.cir12 ._pal img{animation: spin1 6s infinite linear reverse;}



@media screen and (max-width:768px){
.clientList ._brand{position: static;flex-wrap: wrap;display: flex;width: calc(100% + .2rem);margin-top: .6rem;}
	.clientList ._logo{position: static;transform: none;}
	.clientList ._brand ._item{position: static;animation:none !important;
	width:50% !important;height:auto !important;padding-bottom: 10px;padding-right:10px;}
	.clientList ._brand ._item ._pal{border-radius:5px;height:60px;}
	.clientList ._brand ._item ._pal img{animation:none !important;}
	.client{padding: 1.2rem 0;}
	.clientList ._logo{width: 150px;margin: 0 auto;}
	.escortBox ._tel{font-size: .4rem;margin-top: .25rem;}
  
  .clientList{padding-bottom: 140%;}
  
  
}