@charset "utf-8";

/* # GALLERY
================================ */

#page-works .swiper-custom-parent {
  width: 100%;
  margin: 0;
  padding: 0 0 10px;
  position: relative;
}
#page-works .swiper-container {
  width: 96%;
  margin: 0 auto;
}
#page-works .swiper-slide {
  text-align: center;
  border: solid 3px #f39800;
  padding: 10px;
  background: #fdf3e9;
}
#page-works .swiper-slide img {
  width: auto;
  height: auto;
  max-height: 250px;
}
#page-works .swiper-slide .cmt {
  padding: 15px;
  line-height: 1.5;
  margin-top: 10px;
}
#page-works .swiper-button-prev:after,
#page-works .swiper-button-next:after {
  display: none;
}
#page-works .swiper-button-prev,
#page-works .swiper-button-next {
  width: 45px !important;
  height: 55px !important;
  background-size: 45px 55px;
  margin-top: -22.5px;
}
#page-works .swiper-button-prev.cm {
  left: -50px !important;
}
#page-works .swiper-button-next.cm {
  right: -50px !important;
}
#page-works .swiper-button-next {
  background-image: url(../image/base/arw-right.png);
  margin-right: 30px;
}
#page-works .swiper-button-prev {
  background-image: url(../image/base/arw-left.png);
  margin-left: 30px;
}
#page-works .swiper-container {
  width: 100%;
  max-width: 900px;
}
#page-works .swiper-container.slider-thumbnail .swiper-wrapper .swiper-slide img {
  width: 100%;
  height: 40px;
  object-fit: cover;
}
.swp-tb {
  display: flex;
  flex-wrap: wrap;
}
.swp-tb a {
  display: flex;
  width: 19%;
  margin-right: 1.25%;
  margin-bottom: 8px;
  overflow: hidden;
  border: solid 3px #fff;
}
.swp-tb a:nth-of-type(5n) {
  margin-right: 0;
}
.swp-tb a img {
  width: 100%;
  height: 50px;
  object-fit: cover;
}
.swp-tb a.tb-active {
  border: solid 3px #eb5a28;
}
@media ( min-width: 766px) {
    #page-works .swiper-slide img {
      max-height: 500px;
      height: 500px;
      width: auto;
      max-width: 100%;
    }
    #page-works .swiper-slide .cmt {
      min-height: 55px;
    }
    #page-works .swiper-container.slider {
      /*height: 651px;*/
    }
    #page-works .swiper-container.slider-thumbnail {
      height: 130px;
    }
    #page-works .swiper-container.slider-thumbnail .swiper-wrapper .swiper-slide img {
      width: 100%;
      height: 120px;
      object-fit: cover;
    }
    .swp-tb a img {
      width: 100%;
      height: 100px;
      object-fit: cover;
    }    
}
#page-works .swiper-container.slider-thumbnail .swiper-wrapper .swiper-slide {
  width: 25%;
  height: 100%;
  opacity: 0.5;
  overflow: hidden;
  border: none;
}
#page-works .swiper-container.slider-thumbnail .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
  opacity: 1;
}
#page-works .swiper-container.slider-thumbnail .swiper-wrapper .swiper-slide.swiper-slide-thumb-active img {
  border: solid 2px #d12d59;
}
#page-works .swiper-slide-active {
  opacity: 1;
  z-index: 1;
  transform: scale(1);
}