@charset "utf-8";
/* CSS Document */
.cuisine_imgs_wrap,.cuisine_imgs_wrap *{
    box-sizing: border-box;
}
.cuisine_imgs_wrap{
    display: grid;
    gap: clamp(5px,2vw,30px);
}
.cuisine_imgs_wrap img{
    width: 100%;
    height: auto;
    object-fit: cover;
}
.obj-posi-top{object-position: 50% 0%;}
.obj-posi-top5{object-position: 50% 5%;}
.obj-posi-top10{object-position: 50% 10%;}
.obj-posi-top15{object-position: 50% 15%;}
.obj-posi-top20{object-position: 50% 20%;}

.obj-posi-bottom{object-position: 50% 100%;}

.pc-cols-12 .main-img{
    aspect-ratio: 6 / 4;
}
.pc-cols-12 .sub-img{
    aspect-ratio: 6 / 3;
}
    .colspan-2{grid-column: span 2;}
    .colspan-3{grid-column: span 3;}
    .colspan-4{grid-column: span 4;}
    .colspan-5{grid-column: span 5;}
    .colspan-6{grid-column: span 6;}
    .colspan-7{grid-column: span 7;}
    .colspan-8{grid-column: span 8;}
    .colspan-9{grid-column: span 9;}
    .colspan-10{grid-column: span 10;}
    .colspan-11{grid-column: span 11;}
    .colspan-12{grid-column: span 12;}
    .colspan-full{grid-column: span 12;}

@media screen and (min-width:960px){
    .cuisine_imgs_wrap{
        grid-template-columns: repeat(12,minmax(0,1fr));
    }
    .pc-cols-12{
        grid-template-columns: repeat(12,minmax(0,1fr));
    }
    .pc-cols-12 .text_wrap,
    .pc-cols-12 .main-img{
        grid-column: span 6;
    }
    .pc-cols-12 .text_wrap h3{
        margin-bottom: 15px;
    }
    .pc-colspan-2{grid-column: span 2;}
    .pc-colspan-3{grid-column: span 3;}
    .pc-colspan-4{grid-column: span 4;}
    .pc-colspan-5{grid-column: span 5;}
    .pc-colspan-6{grid-column: span 6;}
    .pc-colspan-7{grid-column: span 7;}
    .pc-colspan-8{grid-column: span 8;}
    .pc-colspan-9{grid-column: span 9;}
    .pc-colspan-10{grid-column: span 10;}
    .pc-colspan-11{grid-column: span 11;}
    .pc-colspan-12{grid-column: span 12;}
    .pc-colspan-full{grid-column: span 12;}
}
@media screen and (max-width:959px){
    .cuisine_imgs_wrap{
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .pc-cols-12 .text_wrap,
    .pc-cols-12 .main-img{
        grid-column: 1 / -1;
    }
    .sp-colspan-2{grid-column: span 2;}
    .sp-colspan-3{grid-column: span 3;}
    .sp-colspan-4{grid-column: span 4;}
    .sp-colspan-5{grid-column: span 5;}
    .sp-colspan-6{grid-column: span 6;}
    .sp-colspan-7{grid-column: span 7;}
    .sp-colspan-8{grid-column: span 8;}
    .sp-colspan-9{grid-column: span 9;}
    .sp-colspan-10{grid-column: span 10;}
    .sp-colspan-11{grid-column: span 11;}
    .sp-colspan-12{grid-column: span 12;}
    .sp-colspan-full{grid-column: span 12;}
}

/*swiper*/
.swiper{
  width: 100%;
  height: auto;
	margin: 0 auto;	
}

.swiper-wrapper {
  /* wrapperのサイズを調整 */
  width: 100%;
/*  height: 300px;*/
}
.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  color: #ffffff;
  width: 100%;
  height: 100%;
  text-align: center;
/*  line-height: 300px;*/
}

/*swiperカスタマイズ*/
:root {
    --swiper-theme-color: #fff;
    --swiper-navigation-size: 22px;
    --swiper-pagination-bullet-color: #fff;
    --swiper-pagination-bullet-inactive-color: #fff;
    --swiper-pagination-bullet-opacity: 1;
    --swiper-pagination-bullet-horizontal-gap: 8px;
}