@charset "utf-8";

.tile.link-tile
{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;

	margin:calc(var(--grid-margin) * -1);
}

.tile.link-tile .tile-item-1{flex: 0 0 calc( 33.33333% - (var(--grid-margin) * 2));}
.tile.link-tile .tile-item-2{flex: 0 0 calc( 33.33333% - (var(--grid-margin) * 2));}
.tile.link-tile .tile-item-3{flex: 0 0 calc( 33.33333% - (var(--grid-margin) * 2));}
.tile.link-tile .tile-item-4{flex: 0 0 calc( 33.33333% - (var(--grid-margin) * 2));}
.tile.link-tile .tile-item-5{flex: 0 0 calc( 33.33333% - (var(--grid-margin) * 2));}

/* 小(スマートフォン) */
@media screen and (max-width:640px) {
	.tile.link-tile .tile-item-1{flex: 0 0 calc(100.00000% - (var(--grid-margin) * 2));}
	.tile.link-tile .tile-item-2{flex: 0 0 calc(100.00000% - (var(--grid-margin) * 2));}
	.tile.link-tile .tile-item-3{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
	.tile.link-tile .tile-item-4{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
	.tile.link-tile .tile-item-5{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
}

.tile.image-tile
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;

	margin:calc(var(--grid-margin) * -1);
}

.tile.image-tile .tile-item-1{flex: 0 0 calc( 60.00000% - (var(--grid-margin) * 2));}
.tile.image-tile .tile-item-2{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
.tile.image-tile .tile-item-3{flex: 0 0 calc( 33.33333% - (var(--grid-margin) * 2));}
.tile.image-tile .tile-item-4{flex: 0 0 calc( 25.00000% - (var(--grid-margin) * 2));}
.tile.image-tile .tile-item-5{flex: 0 0 calc( 20.00000% - (var(--grid-margin) * 2));}

.tile.image-tile .tile-item-thumbnail .img
{
	border:1px solid #CCCCCC;
}


/* 小(スマートフォン) */
@media screen and (max-width:640px) {
	.tile.image-tile .tile-item-1{flex: 0 0 calc(100.00000% - (var(--grid-margin) * 2));}
	.tile.image-tile .tile-item-2{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
	.tile.image-tile .tile-item-3{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
	.tile.image-tile .tile-item-4{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
	.tile.image-tile .tile-item-5{flex: 0 0 calc( 50.00000% - (var(--grid-margin) * 2));}
}