@charset "utf-8";
/* CSS Document */


/*-------------------------------------------------------------------------
scroll_x
*/
.sp_scrolling > figure{
  overflow-x: scroll;
  padding-bottom: 30px;
}
.scroll_x_wrap {
  position: relative;
  margin-bottom: 10px;
  overflow: auto;
  -webkit-overflow-scrolling : touch;
}
.scroll_x_wrap .sp_scrolling {
  width: 100%;
}
.scroll_x_wrap .scroll_x_overlay {
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .7;
}
.scroll_x_wrap .scroll_x_btn {
  content: '';
  /*font-size: 1rem;*/
	font-size: 4.26vw;
  font-weight: bold;
  display: inline-block;
  position: absolute;
  left:calc(50% - 2.6667vw);
  top: calc(50% - 0.5em);
}
.scroll_x_wrap .scroll_x_btn span {
  display: table-cell;
  width: 100%;
  height: 100%;
  color: #fff;
  vertical-align: middle;
}
.scroll_x_wrap .scroll_x_btn:before {
  content: '';
  position: absolute;
  left: -29.3333vw;
  top: -5.3333vw;
  width: 39.0667vw;
  height: 15.7333vw;
  background: url(/individual/unyou/toushi/tsumitatelife/images/icon_swipe.png) no-repeat center center;
  background-size: contain;
}
.scroll_x_wrap .scroll_x_btn:before {
  -webkit-animation-name: swipe;
          animation-name: swipe;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
}
@-webkit-keyframes swipe {
  0% {
    -webkit-transform: translateX(-1.6vw);
            transform: translateX(-1.6vw);
  }
  50% {
    -webkit-transform: translateX(1.6vw);
            transform: translateX(1.6vw);
  }
  100% {
    -webkit-transform: translateX(-1.6vw);
            transform: translateX(-1.6vw);
  }
}

@keyframes swipe {
  0% {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
  50% {
    -webkit-transform: translateX(6px);
            transform: translateX(6px);
  }
  100% {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
}
.scroll_x_wrap::-webkit-scrollbar {
  height: 5px;
}
.scroll_x_wrap::-webkit-scrollbar-track {
  background: #F1F1F1;
}
.scroll_x_wrap::-webkit-scrollbar-thumb {
  background: #BCBCBC;
}

