@charset "UTF-8";

#scroll + section .content_wrapper{
    max-width: 100%!important;
    padding:0;
}

.top-experience__image-list{
    position: relative;
    width: 100vw;
    width: auto;
    overflow: hidden;
    margin: 0 auto;
    padding: 20px;
    height: 100%;
    min-height: 813px;
    min-height:100vw;
}

.top-experience__image-list .image-list__inner {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo, .top-experience__image-list .image-list__inner-photo2 .image-item__photo {
    position: absolute;
    z-index: 2;
    /*opacity: 0;*/
    opacity: 1;
    height: 100%;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo img {
    vertical-align: top;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo01, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo01 {
    top: 12.3333333333%;
    top:13vw;
    left: -300px;
    left: -50vw;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo01 img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo01 img {
    width: auto;
    height: 48%;
    height: 55vw;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo02, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo02 {
    top: 62.8888888889%;
    top: 77vw;
    left: 209px;
    left: 23vw;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo02 img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo02 img {
    width: auto;
    height: 32.2222222222%;
    height: 50vw;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo03, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo03 {
    top: 2.7777777778%;
    left: 996px;
    left: 40vw;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo03 img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo03 img {
    width: auto;
    height: 45vw;
}

.top-experience__image-list .image-list__inner-photo, .top-experience__image-list .image-list__inner-photo2 {
    position: relative;
    width: 2400px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-height: 813px;
    z-index: 8;
}

/*
.loop3 {
    -webkit-animation: loopAnime 80s linear infinite;
    animation: loopAnime 80s linear infinite;
}

.blur-image {
    -webkit-animation-name: blurImageAnime;
    animation-name: blurImageAnime;
    -webkit-animation-duration: 5s;
    animation-duration: 5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    opacity: 0;
}
*/

@media screen and (min-width: 768px){
.top-experience__image-list{
    min-height: 813px;
}

.top-experience__image-list .image-list__inner-photo, .top-experience__image-list .image-list__inner-photo2 {
    min-height: 900px;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo01, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo01 {
    top: 112px;
    left: -257px;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo01 img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo01 img {
    width: auto;
    height: 432px;
    height: 26.5vw;
    max-height:432px;
    min-height: 400px;
}


.top-experience__image-list .image-list__inner-photo .image-item__photo.photo02, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo02 {
    top: 566px;
    left: 209px;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo02 img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo02 img {
    width: auto;
    height: 500px;
    height: 30.6vw;
    max-height:500px;
    min-height: 400px;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo03, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo03 {
    top: 0;
    left: 996px;
    left: 53vw;
}

.top-experience__image-list .image-list__inner-photo .image-item__photo.photo03 img, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo03 img {
    width: auto;
    height: 500px;
    height: 26.5vw;
    max-height:500px;
    min-height: 340px;
}

}

@media screen and (min-width: 1900px){
  .top-experience__image-list .image-list__inner-photo .image-item__photo.photo03, .top-experience__image-list .image-list__inner-photo2 .image-item__photo.photo03 {
    left: 996px;
  }
}

@keyframes loopAnime{
    0%{
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
    100%{
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
}

@keyframes blurImageAnime{
    0%{
      -webkit-filter: blur(20px);
      filter: blur(20px);
      opacity: 0;
      perspective: 1000;
      -webkit-perspective: 1000;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
    }
    100%{
      -webkit-filter: blur(0);
      filter: blur(0);
      opacity: 1;
      perspective: 1000;
      -webkit-perspective: 1000;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
    }
}