.slick-dots {
  bottom: 20px;
}

.slick-dotted.slick-slider {
  margin-bottom: 0;
}
.slick-dots li{
  margin: 0 15px;
}

.slick-dots li button:before{
  color: #fff;
  content: "";
  background: #fff;
  border-radius: 20px;
  width: 10px;
  height: 10px;
  display: block;
  opacity: 1;
}

.slick-dots li.slick-active button:before{
  padding: 5px;
  opacity: 1;
  top: -5px;
  left: -5px;
}

@keyframes animation-01 {
  0% {
    clip-path: polygon(0% 30%, 100% 30%, 100% 30%, 0% 30%); }
  35% {
    clip-path: polygon(0% 30%, 100% 30%, 100% 45%, 0% 45%); }
  80% {
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 0% 75%); }
  100% {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); } }
@keyframes animation-02 {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 1; } }
@keyframes animation-03 {
  0% {
    opacity: 0; }
  50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
#mainView .mainSlide {
  background-image: url(../img/top/main/main_base.jpg);
  background-size: contain;
  background-repeat: no-repeat; }
  #mainView .mainSlide .cell-01.slick-active .baseimg {
    background-image: url(../img/top/main/main_base.jpg);
    background-size: contain;
    background-repeat: no-repeat; }
    #mainView .mainSlide .cell-01.slick-active .baseimg img {
      animation-name: animation-01;
      animation-duration: 7s;
      animation-iteration-count: 1; }
  #mainView .mainSlide .cell-02 .baseimg {
    background-image: url(../img/top/main/main_img3.jpg);
    background-size: contain;
    background-repeat: no-repeat; }
  #mainView .mainSlide .cell-02.slick-active .baseimg {
    position: relative; }
    #mainView .mainSlide .cell-02.slick-active .baseimg img {
      animation-name: animation-02;
      animation-duration: 10s;
      animation-timing-function: ease-in-out;
      animation-iteration-count: 1; }
    #mainView .mainSlide .cell-02.slick-active .baseimg:after {
      content: "";
      padding: 50% 50%;
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      background-image: url(../img/top/main/main_img6.jpg);
      background-size: contain;
      background-repeat: no-repeat;
      animation-name: animation-03;
      animation-duration: 5s;
      animation-timing-function: ease-in-out;
      animation-iteration-count: 1; }
  #mainView .mainSlide .cell-03 .baseimg {
    background-image: url(../img/top/main/main_img7.jpg);
    background-size: contain;
    background-repeat: no-repeat; }

/*# sourceMappingURL=top-slide.css.map */
