/* top slide caption */

.slick-outer{
  position:relative;
}
.slick-content{
  position: absolute;
  top: 50%;left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  z-index: 150;
  color: #fff;
  /*img{width: 100%;}*/
  margin: 0 10px;padding: 0;
  p{margin: 0;padding: 0;}
  h2{margin: 0;padding: 0;}
}

/* top slide small caption */
.sp-cap{
  position:absolute;
  left:0;
  top:0;
}

/* fade in contents */
.fadein-once, 
.fadein-again{
  opacity:0;
}
.hide-cap{
  right:5px;
  left:5px;
  bottom:5px;
}
.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }
  to {
    opacity: 1;
  transform: translateY(0);
  }
}
/* one still image */
.banner_bk {
  width: 100%;
  /*height: 100vh;*/
  background-image: url(media/n-banner_center/common/bk_aomugi-1920x1410.jpg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

@media (min-width:1200px){
  .img-chg li:nth-child(1) { 
    background-image: url(../../n-banner_center/common/bk_kamome-1920x1080.jpg)
  }
  .img-chg li:nth-child(2) {
    background-image: url(../../n-banner_center/common/bk_aomugi-1920x1080.jpg);
    -webkit-animation-delay: 10s;
    animation-delay: 10s;
  }
  .img-chg li:nth-child(3) {
    background-image: url(../../n-banner_center/common/bk_umi-1920x1080.jpg);
    -webkit-animation-delay: 20s;
    animation-delay: 20s;
  }
  .img-chg li:nth-child(4) {
    background-image: url(../../n-banner_center/common/bk_kamome2-1920x1080.jpg);
    -webkit-animation-delay: 30s;
    animation-delay: 30s;
  }
  .img-chg li:nth-child(5) {
    background-image: url(../../n-banner_center/common/bk_ki-1920x1080.jpg);
    -webkit-animation-delay: 40s;
    animation-delay: 40s;
  }
}

@media (max-width:1199px){
  .img-chg li:nth-child(1) { 
    background-image: url(../../n-banner_center/common/bk_kamome-991x2958.jpg)
  }
  .img-chg li:nth-child(2) {
    background-image: url(../../n-banner_center/common/bk_aomugi-991x2958.jpg);
    -webkit-animation-delay: 10s;
    animation-delay: 10s;
  }
  .img-chg li:nth-child(3) {
    background-image: url(../../n-banner_center/common/bk_umi-991x2958.jpg);
    -webkit-animation-delay: 20s;
    animation-delay: 20s;
  }
  .img-chg li:nth-child(4) {
    background-image: url(../../n-banner_center/common/bk_kamome2-991x2958.jpg);
    -webkit-animation-delay: 30s;
    animation-delay: 30s;
  }
  .img-chg li:nth-child(5) {
    background-image: url(../../n-banner_center/common/bk_ki-991x2958.jpg);
    -webkit-animation-delay: 40s;
    animation-delay: 40s;
  }
}

@media (max-width:575px){
  .img-chg li:nth-child(1) { 
    background-image: url(../../n-banner_center/common/bk_kamome-414x1680.jpg)
  }
  .img-chg li:nth-child(2) {
    background-image: url(../../n-banner_center/common/bk_aomugi-414x1680.jpg);
    -webkit-animation-delay: 10s;
    animation-delay: 10s;
  }
  .img-chg li:nth-child(3) {
    background-image: url(../../n-banner_center/common/bk_umi-414x1680.jpg);
    -webkit-animation-delay: 20s;
    animation-delay: 20s;
  }
  .img-chg li:nth-child(4) {
    background-image: url(../../n-banner_center/common/bk_kamome2-414x1680.jpg);
    -webkit-animation-delay: 30s;
    animation-delay: 30s;
  }
  .img-chg li:nth-child(5) {
    background-image: url(../../n-banner_center/common/bk_ki-414x1680.jpg);
    -webkit-animation-delay: 40s;
    animation-delay: 40s;
  }
}

@-webkit-keyframes anime { 
    0% {
        -webkit-animation-timing-function: ease-in;
        opacity: 0;
    }
    10% {
        -webkit-transform: scale(1.1);
        opacity: 1;
    }
    40% {
        -webkit-transform: scale(1.2);
            -webkit-animation-timing-function: ease-out;
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(1.3);
        opacity: 0;
    }
    100% { opacity: 0 }
}
@keyframes anime { 
    0% {
        animation-timing-function: ease-in;
        opacity: 0;
    }
    10% {
        transform: scale(1.1);
        opacity: 1;
    }
    40% {
        transform: scale(1.2);
            animation-timing-function: ease-out;
        opacity: 1;
    }
    50% {
        transform: scale(1.3);
        opacity: 0;
    }
    100% { opacity: 0 }
}
