@charset "utf-8";
/* CSS Document */

@media only screen and (min-width : 500px){
}
@media only screen and (min-width : 768px){
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
}
@media all and (-ms-high-contrast:none){
}



/*2段組
*****************************************************/
.column2{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 2%;/*間隔*/
	}
.column2 > *{
	flex-shrink:1;
	width:49%;
	}
.column2 > * > a{
	height:100%;
	}

@media only screen and (min-width : 768px){
	.column2{
		gap:20px 2%;/*間隔*/
		}
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
	.column2{
		gap:20px 40px;/*間隔*/
		}
	.column2 > *{
		width:calc((100% - 40px) / 2);
		}
}

/*1-2
*****************************************************/
.column1-2{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 0;/*間隔*/
	}
.column1-2 > *{
	flex-shrink:1;
	width:100%;
	}
.column1-2 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column1-2{
		gap:20px 2%;/*間隔*/
		}
	.column1-2 > *{
		width:49%;
		}
}
@media only screen and (min-width : 1200px){
	.column1-2{
		gap:20px 40px;/*間隔*/
		}
	.column1-2 > *{
		width:calc((100% - 40px) / 2);
		}
}



/*3段組
*****************************************************/
.column3{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 2%;/*間隔*/
	}
.column3 > *{
	flex-shrink:1;
	width:32%;
	}
.column3 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column3{
		gap:20px 2%;/*間隔*/
		}
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
	.column3{
		gap:20px 30px;/*間隔*/
		}
	.column3 > *{
		width:calc((100% - 60px) / 3);
		}
}


/*1-3
*****************************************************/
.column1-3{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 0;/*間隔*/
	}
.column1-3 > *{
	flex-shrink:1;
	width:100%;
	}
.column1-3 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column1-3{
		gap:20px 2%;/*間隔*/
		}
	.column1-3 > *{
		flex-shrink:1;
		width:32%;
		}
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
	.column1-3{
		gap:20px 30px;/*間隔*/
		}
	.column1-3 > *{
		width:calc((100% - 60px) / 3);
		}
}



/*2-3
*****************************************************/
.column2-3{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 2%;/*間隔*/
	}
.column2-3 > *{
	flex-shrink:1;
	width:49%;
	}
.column2-3 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column2-3{
		gap:20px 2%;/*間隔*/
		}
}
@media only screen and (min-width : 1024px){
	.column2-3 > *{
		flex-shrink:1;
		width:32%;
		}
}
@media only screen and (min-width : 1200px){
	.column2-3{
		gap:20px 30px;/*間隔*/
		}
	.column2-3 > *{
		width:calc((100% - 60px) / 3);
		}
}

/*1-2-3
*****************************************************/
.column1-2-3{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 0;/*間隔*/
	}
.column1-2-3 > *{
	flex-shrink:1;
	width:100%;
	}
.column1-2-3 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column1-2-3{
		gap:20px 2%;/*間隔*/
		}
	.column1-2-3 > *{
		flex-shrink:1;
		width:49%;
		}
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
	.column1-2-3{
		gap:20px 30px;/*間隔*/
		}
	.column1-2-3 > *{
		width:calc((100% - 60px) / 3);
		}
}


/*4段組
*****************************************************/
.column4{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 2%;/*間隔*/
	}
.column4 > *{
	flex-shrink:1;
	width:23.5%;
	}
.column4 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column4{
		gap:20px 2%;/*間隔*/
		}
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
}



/*2-4
*****************************************************/
.column2-4{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 2%;/*間隔*/
	}
.column2-4 > *{
	flex-shrink:1;
	width:49%;
	}
.column2-4 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column2-4{
		gap:20px 2%;/*間隔*/
		}
}
@media only screen and (min-width : 1024px){
	.column2-4 > *{
		flex-shrink:1;
		width:23.5%;
		}
}
@media only screen and (min-width : 1200px){
}


/*2-3-5
*****************************************************/
.column2-3-5{
	display:flex;
	flex-wrap: wrap;/*折返*/
	gap:10px 2%;/*間隔*/
	}
.column2-3-5 > *{
	flex-shrink:1;
	width:49%;
	}
.column2-3-5 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column2-3-5{
		gap:20px 2%;/*間隔*/
		}
	.column2-3-5 > *{
		flex-shrink:1;
		width:32%;
		}
}
@media only screen and (min-width : 1024px){
}
@media only screen and (min-width : 1200px){
	.column2-3-5{
		gap:20px 1%;/*間隔*/
		}
	.column2-3-5 > *{
		width:calc(96% / 5);
		}
}

/*5段組（PCで5列）
*****************************************************/
.column5{
	display:flex;
	flex-wrap: wrap;/*折返*/
	justify-content: space-between;
	gap:10px 1%;/*間隔*/
	}
.column5 > *{
	flex: auto;
	}
.column5 > * > a{
	height:100%;
	}
@media only screen and (min-width : 768px){
	.column5{
		gap:20px 1%;/*間隔*/
		}
}
@media only screen and (min-width : 1024px){
.column5 > *{
	flex-shrink:1;
	width:19.2%;
	}
}
@media only screen and (min-width : 1200px){
}


/*数不明(均等配置・幅指定なし)
*****************************************************/
.column-nn{
	display:flex;
	flex-wrap: wrap;/*折返*/
	justify-content: space-between;
	gap:10px 1%;/*間隔*/
	}
.column-nn > *{
	flex: auto;
	}
.column-nn > * > a{
	height:100%;
	}

@media only screen and (min-width : 768px){
}
@media only screen and (min-width : 1024px){
	.column-nn > *{
		min-width:18%;
		}
}
@media only screen and (min-width : 1200px){
}