.img_gallery{
	display: flex;
    flex-wrap: wrap;
	width:100%;
	box-sizing: border-box;
}

.gallery_item:hover {
    cursor: zoom-in;
}

.img_gallery .img_item {
	width:100%;
	height:100%;
}

.img_gallery .img_item img{
	width:100%;
	height:100%;
	object-fit: cover;
	display: block;
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    image-rendering: -webkit-optimize-contrast;
    font-family: "object-fit: cover;";
}

.gallery_item{
	position: relative;
}

.sub_item.mode4h:nth-child(n+5) {
	display: none;
}

.gallery_item.mode4h:not(:nth-child(4)) .mask {
	display: none;
}

.mode4v.gallery_item:not(:nth-child(3)) .mask,
.mode4v.sub_item:nth-child(n+4) 
{
	display: none;
}

@media screen and (min-width: 37.5em){
	.img_gallery{
		height:630px;
	}

	.main_item.mode4h {
		width: 100%;
		padding: 2.5px;
		height:420px;
	}

	.sub_item.mode4h {
		width: 33.3333%;
		padding: 2.5px;
		height:210px;
		box-sizing: border-box;
	}

	.main_item.mode3h {
		width: 100%;
		padding: 2.5px;
		height:315px;
	}

	.sub_item.mode3h {
		width: 50%;
		padding: 2.5px;
		height:315px;
		box-sizing: border-box;
	}

	.mode3v.main_item {
		height: 100%;
		padding: 2.5px;
		width:50%;
		box-sizing: border-box;
	}
	
	.mode3v.sub_item {
		height: 100%;
		width:50%;
		
	}

	.mode4v.main_item {
		height: 100%;
		padding: 2.5px;
		width:420px;
		box-sizing: border-box;
	}
	
	.mode4v.sub_item {
		height: 33.33333%;
		width:210px;
		box-sizing: border-box;
		padding: 2.5px;
	}	

	.gallery_item.sub_items{
		height: 100%;
		width:210px;
		box-sizing: border-box;
	}

	.img_gallery .mode4v.sub_item .img_item
	{
		width:100%;
		height:100%;
	}

	.img_gallery .mode3v.sub_item .img_item 
	{
		width:100%;
		height:50%;
		padding: 2.5px;
		box-sizing: border-box;
	}
}

@media screen and (max-width: 37.5em){
	.img_gallery{
		height:calc(100vw - 30px);
	}

	.main_item.mode4h {
		width: 100%;
		padding: 2.5px;
		height:calc((100vw - 30px)*2/3);
	}

	.sub_item.mode4h {
		width: 33.3333%;
		padding: 2.5px;
		height:calc((100vw - 30px)*1/3);
		box-sizing: border-box;
	}

	.main_item.mode3h {
		width: 100%;
		padding: 2.5px;
		height:calc((100vw - 30px)*1/2);
	}

	.sub_item.mode3h {
		width: 50%;
		padding: 2.5px;
		height:calc((100vw - 30px)*1/2);
		box-sizing: border-box;
	}


	.main_item.mode4v {
		height: 100%;
		padding: 2.5px;
		width:calc((100vw - 30px)*2/3);
		box-sizing: border-box;
	}

	.sub_item.mode4v {
		height: 33.3333%;
		padding: 2.5px;
		width:100%;
		box-sizing: border-box;
	}

	.main_item.mode3v {
		height: 100%;
		padding: 2.5px;
		width:50%;
		box-sizing: border-box;
	}

	.sub_item.mode3v {
		height: 100%;
		width:50%;
	}

	.gallery_item.sub_items{
		height: 100%;
		width:calc((100vw - 30px)*1/3);
		box-sizing: border-box;
	}

	.img_gallery .mode4v.sub_item .img_item
	{
		width:100%;
		height:100%;
	}

	.img_gallery .mode3v.sub_item .img_item 
	{
		height:50%;
		width:100%;
		padding: 2.5px;
		box-sizing: border-box;
	}
}

.gallery_item .mask{
color: rgb(255, 255, 255);
	display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.5);
	top: 2.5px;
    right: 2.5px;
    bottom: 2.5px;
    left: 2.5px;
    position: absolute;
	pointer-events: none;
}

.gallery_item .mask .remain_count{
	font-size: 28px;
    margin: 0px;
	color: rgb(255, 255, 255);
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}