/* **************************************************
  photoOverlapSS style start
************************************************** */
.js-photoOverlapSS{
  position: relative;
  margin: 0;
  padding: 0;
  /* スライダーの大きさ */
  width: 500px;
  height: 500px;
}
.js-photoOverlapSS *{
  margin: 0;
  padding: 0;
}
.js-photoOverlapSS ul{
  position: relative;
  width: 100%;
  height: 100%;
}
.js-photoOverlapSS ul li{
  list-style: none;
  position: absolute;
  top: 0;
  left: 0;
}
.js-photoOverlapSS ul li.smooth{ /* 写真の捌ける速度と加速度 */
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.js-photoOverlapSS ul li.left{
  transform: translateX(-100%);
}
.js-photoOverlapSS ul li.right{
  transform: translateX(100%);
}
.js-photoOverlapSS ul li img{
  width: 100%;
  height: 100%;
}
.js-photoOverlapSS .changeBtn{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.js-photoOverlapSS .changeBtn img{
  transition: 0.3s;
}
.js-photoOverlapSS .changeBtn .left{
  float: left;
  width: 50%;
  height: 100%;
}
.js-photoOverlapSS .changeBtn .left:hover img{
  transform: translateX(-8px);
}
.js-photoOverlapSS .changeBtn .right{
  float: right;
  width: 50%;
  height: 100%;
}
.js-photoOverlapSS .changeBtn .right:hover img{
  transform: translateX(8px);
}
/* **************************************************
  photoOverlapSS style end
************************************************** */