.ja-slideshow .container {
  position: absolute;
  left: 50%;
  top: 0;
  height: 100%;
}
@media (min-width: 768px) {
  .ja-slideshow .container {
    margin-left: -340px;
    width: 680px;
  }
}
@media (min-width: 992px) {
  .ja-slideshow .container {
    margin-left: -470px;
    width: 940px;
  }
}
@media (min-width: 1200px) {
  .ja-slideshow .container {
    margin-left: -570px;
    width: 1140px;
  }
}
.ja-ss-sprite img {
  width: auto;
  background: none;
  display: inline-block;
}
.ja-ss-sprite.first img {
  max-width: 100%;
  width: auto;
  -webkit-transition: width 300ms ease-in-out;
  -o-transition: width 300ms ease-in-out;
  transition: width 300ms ease-in-out;
}
@media (max-width: 1199px) {
  .ja-ss-sprite.first img {
    max-width: 70%;
  }
}
.ja-ss-item-bg {
  position: relative;
  z-index: 1;
}
.ja-ss-sprite,
.ja-ss-desc {
  position: absolute;
  z-index: 2;
  opacity: 0;
}
.leftright .ja-ss-sprite.first {
  bottom: 10%;
  left: -10%;
}
.leftright .ja-ss-sprite.second {
  bottom: 10%;
  left: 110%;
}
.active.leftright .ja-ss-sprite.first {
  left: 40%;
}
.active.leftright .ja-ss-sprite.second {
  left: 60%;
}
.leftleft .ja-ss-sprite.first,
.leftleft .ja-ss-sprite.second {
  bottom: 20%;
  left: -10%;
}
.active.leftleft .ja-ss-sprite.first {
  left: 40%;
}
.active.leftleft .ja-ss-sprite.second {
  left: 60%;
}
.rightright .ja-ss-sprite.first,
.rightright .ja-ss-sprite.second {
  bottom: auto;
  top: 30%;
  right: -110%;
  left: auto;
}
@media (max-width: 1200px) {
  .rightright .ja-ss-sprite.first,
  .rightright .ja-ss-sprite.second {
    width: 50%;
  }
}
.rightright .ja-ss-desc {
  top: 30%;
  width: 50%;
}
.rightright.active .ja-ss-sprite.first {
  right: 0;
}
.rightright.active .ja-ss-sprite.second {
  left: 60%;
}
.rightright.active .ja-ss-desc {
  width: 50%;
  left: 0;
}
.updown .ja-ss-sprite.first {
  left: 0;
  bottom: -10%;
}
.updown .ja-ss-sprite.second {
  left: 60%;
  bottom: 110%;
}
.updown .ja-ss-desc {
  top: auto;
  left: auto;
  right: -50%;
  bottom: 18%;
}
.updown.active .ja-ss-desc {
  right: 0;
  bottom: 18%;
  top: auto;
  width: 50%;
  left: auto;
  padding-left: 28px;
}
.updown.active .ja-ss-sprite.first {
  bottom: 0;
  left: 0;
}
.updown.active .ja-ss-sprite.second {
  bottom: 20%;
}
.downdown .ja-ss-sprite.first {
  left: 40%;
  bottom: 110%;
}
.downdown .ja-ss-sprite.second {
  left: 60%;
  bottom: 110%;
}
.downdown .ja-ss-desc {
  width: 100%;
  text-align: center;
  left: 0;
  right: 0;
  top: -30px;
}
.downdown.active .ja-ss-desc {
  top: 30%;
  left: 0;
}
.active.downdown .ja-ss-sprite.first {
  bottom: 20%;
}
.active.downdown .ja-ss-sprite.second {
  bottom: 20%;
}
.rupdown .ja-ss-sprite.first {
  -webkit-transform-origin: -200% 70%;
  -moz-transform-origin: -200% 70%;
  -o-transform-origin: -200% 70%;
  transform-origin: -200% 70%;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  left: 40%;
  bottom: 20%;
}
.rupdown .ja-ss-sprite.second {
  -webkit-transform-origin: 200% 70%;
  -moz-transform-origin: 200% 70%;
  -o-transform-origin: 200% 70%;
  transform-origin: 200% 70%;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  left: 60%;
  bottom: 20%;
}
.active.rupdown .ja-ss-sprite.first,
.active.rupdown .ja-ss-sprite.second {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.rupup .ja-ss-sprite.first {
  -webkit-transform-origin: -200% 70%;
  -moz-transform-origin: -200% 70%;
  -o-transform-origin: -200% 70%;
  transform-origin: -200% 70%;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  left: 40%;
  bottom: 20%;
}
.rupup .ja-ss-sprite.second {
  -webkit-transform-origin: 200% 70%;
  -moz-transform-origin: 200% 70%;
  -o-transform-origin: 200% 70%;
  transform-origin: 200% 70%;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  left: 60%;
  bottom: 20%;
}
.active.rupup .ja-ss-sprite.first,
.active.rupup .ja-ss-sprite.second {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.active .ja-ss-sprite {
  opacity: 1;
}
.ja-ss-desc {
  top: 30%;
  left: -20%;
  opacity: 0;
  color: rgba(255, 255, 255, 0.8);
  width: 540px;
  font-size: 16px;
  line-height: 1.75;
  padding: 0;
  font-weight: 300;
  background: none;
}
@media (min-width: 1200px) {
  .ja-ss-desc {
    font-size: 24px;
  }
}
.ja-ss-desc h3 {
  font-size: 34px;
  font-weight: 300;
  line-height: 1.7;
  color: #ffffff;
}
@media (min-width: 1200px) {
  .ja-ss-desc h3 {
    font-size: 50px;
  }
}
.ja-ss-desc .btn {
  margin-top: 0;
}
@media (min-width: 1200px) {
  .ja-ss-desc .btn {
    margin-top: 14px;
  }
}
.active .ja-ss-desc {
  left: 20%;
}
.active .ja-ss-desc {
  opacity: 1;
}
.ja-ss-thumbs-wrap {
  background: none;
  position: absolute;
  bottom: 0;
  z-index: 999;
}
.ja-ss-thumbs {
  width: 200px;
  text-align: center;
  position: absolute;
  left: 50%;
  margin-left: -100px;
}
.ja-ss-thumbs .ja-ss-thumb {
  width: 10px;
  height: 10px;
  border: 0;
  background: url("../../templates/ja_sugite/images/ja-ss-thumb.png");
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.ja-ss-thumbs .ja-ss-thumb.active {
  border: 0;
  opacity: 1;
  filter: alpha(opacity=100);
}
.ja-ss-btns {
  position: absolute;
  top: 50%;
  left: 0;
  display: none;
}
.ja-ss-btns span {
  position: absolute;
  float: none;
  width: 22px;
  height: 61px;
}
.ja-ss-btns .ja-ss-prev {
  left: 0;
  margin-left: 28px;
}
.ja-ss-btns .ja-ss-prev:hover {
  background-position: 0 -61px;
}
.ja-ss-btns .ja-ss-next {
  right: 0;
  margin-right: 28px;
  background-position: -22px 0;
}
.ja-ss-btns .ja-ss-next:hover {
  background-position: -22px -61px;
}
.ja-slideshow:hover .ja-ss-btns {
  display: block;
}
.custom .ja-ss-item {
  opacity: 0;
}
.custom .ja-ss-item img {
  background: none;
}
.custom .ja-ss-item.curr {
  opacity: 1;
}
.custom .ja-ss-item.prev {
  left: 0%;
}
.custom .ja-ss-item.next {
  left: 0%;
}
.custom .ja-ss-item.curr {
  left: 0%;
}
.duration300 {
  -webkit-transition-duration: 300ms;
  -moz-transition-duration: 300ms;
  -o-transition-duration: 300ms;
  transition-duration: 300ms;
}
.delay300 {
  -webkit-transition-delay: 300ms;
  -moz-transition-delay: 300ms;
  -o-transition-delay: 300ms;
  transition-delay: 300ms;
}
.ie8 .custom .rightright .ja-ss-desc.animate,
.ie9 .custom .rightright .ja-ss-desc.animate,
.old-ie .custom .rightright .ja-ss-desc.animate {
  left: 0 !important;
}
.ie8 .custom .rightright .ja-ss-sprite.animate.first,
.ie9 .custom .rightright .ja-ss-sprite.animate.first,
.old-ie .custom .rightright .ja-ss-sprite.animate.first {
  right: 0 !important;
  bottom: 10% !important;
  left: auto !important;
}
.ie8 .custom .updown .ja-ss-desc.animate,
.ie9 .custom .updown .ja-ss-desc.animate,
.old-ie .custom .updown .ja-ss-desc.animate {
  left: auto !important;
  right: 0 !important;
}
.ie8 .custom .updown .ja-ss-sprite.animate.first,
.ie9 .custom .updown .ja-ss-sprite.animate.first,
.old-ie .custom .updown .ja-ss-sprite.animate.first {
  left: 0 !important;
  bottom: 0 !important;
}
.ie8 .custom .downdown .ja-ss-desc.animate,
.ie9 .custom .downdown .ja-ss-desc.animate,
.old-ie .custom .downdown .ja-ss-desc.animate {
  left: 0 !important;
}