@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ラッパー */
.workGallery { --thumb-gap: 8px; }

/* メイン */
.workGallery .workGallery-main { width: 100%; margin-bottom: 12px; }
.workGallery .workGallery-main .swiper-slide { aspect-ratio: 16/9; overflow: hidden; }
.workGallery .workGallery-main img {
  width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 8px;
}

/* サムネ列 */
.workGallery .workGallery-thumbs .swiper-slide {
  cursor: pointer; opacity: .6; border: 2px solid transparent; border-radius: 6px;
}
.workGallery .workGallery-thumbs .swiper-slide-thumb-active {
  opacity: 1; border-color: var(--color_main, #0ea5e9);
}
.workGallery .workGallery-thumbs img {
  width: 100%; height: auto; object-fit: cover; border-radius: 6px; display: block;
}

/* レスポンシブ */
@media (max-width: 640px){
  .workGallery .workGallery-main .swiper-slide { aspect-ratio: 4/3; }
  .workGallery .workGallery-thumbs img { height: 52px; }
}