.ch_child {
  width: 70px;
  height: 70px;
  padding: 7px 6px 7px 7px;
  border-right: 1px dashed #8a2457;
  border-bottom: 1px dashed #8a2457;
  position: absolute;
}

.can_set:hover {
  background-color: #bfffdf;
  animation: glow 3000ms ease-in infinite alternate;
  transition: background 0.4s ease;
}

.boardtop {
  height: 71px;
  border-top: 1px dashed #8a2457;
  position: absolute;
}

.boardleft {
  width: 71px;
  border-left: 1px dashed #8a2457;
  position: absolute;
}

.bc, .wc {
    width: 56px;
    height: 56px;
}

.bc > img{
    top: -15px;
    left: -15px;
}

.wc > img{
    top: -10px;
    left: -10px;
}

.lastest {
  animation: popChess 0.6s;
  -webkit-animation: popChess 0.6s;
}
@keyframes popChess
{
from   {-webkit-transform: rotateY(90deg);transform: rotateY(90deg);}
to     {-webkit-transform: rotateY(0deg);transform: rotateY(0deg);}
}
@-webkit-keyframes popChess
{
from   {-webkit-transform: rotateY(90deg);}
to     {-webkit-transform: rotateY(0deg);}
}

.hint {
  animation: popHint 0.4s;
  animation-delay: 0.1s;
  animation-iteration-count: 2;  
  -webkit-animation: popHint 0.4s;
  -webkit-animation-delay: 0.1s;
  -webkit-animation-iteration-count: 2;
}
@keyframes popHint
{
0%   {background: #c9a785;}
80%  {background: #bfffdf;}
100% {background: #c9a785;}
}
@-webkit-keyframes popHint
{
0%   {background: #c9a785;}
80%  {background: #bfffdf;}
100% {background: #c9a785;}
}