@charset "utf-8";

/*
 * Custom slide show
 */


div.SlideShowFrame {
    height: 400px;
    margin-bottom: 10px;
    border-style: none;
    /* border-radius: 5px; */
    /* border-width: 5px; */
    position: relative;	/* imgのposition起点 */
}

div.SlideShowFrame img {
    animation: show 20s infinite;
    width: 100%;
    height: 400px;
    position: absolute;
    opacity: 0;
    /* left: 0; */
    /* top: 0; */
    object-fit: contain;
    object-position: center center;
}

@keyframes show {
      0% {opacity: 0} /* 透明 */
     15% {opacity: 1} /* 不透明 ここにかけてフェードイン */
     20% {opacity: 1}
     45% {opacity: 0} /* ここにかけてフェードアウト */
}
 
.SlideShowFrame img:nth-of-type(1) {
    animation-delay: 0s;
}

.SlideShowFrame img:nth-of-type(2) {
    animation-delay: 5s;
}
 
.SlideShowFrame img:nth-of-type(3) {
    animation-delay: 10s;
}
 
.SlideShowFrame img:nth-of-type(4) {
    animation-delay: 15s;
}

#sp img {
  max-width: 100%;
  height: auto;
}