/*==== SPカラム幅 ====*/
@media screen and (max-width: 768px) {
	/*-- SP表示で1カラムに --*/
	.lx_col_sp100 > div.column ,
	.lx_col1_sp100 > div.column1 ,
	.lx_col2_sp100 > div.column2 ,
	.lx_col3_sp100 > div.column3 ,
	.lx_col4_sp100 > div.column4 ,
	.lx_col5_sp100 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp100 {
		width: calc(100% * var(--mainarea-base));
		max-width: calc(var(--mainarea-width));
	}

	/* SP表示で4/5カラムに */
	.lx_col1_sp80 > div.column1 ,
	.lx_col2_sp80 > div.column2 ,
	.lx_col3_sp80 > div.column3 ,
	.lx_col4_sp80 > div.column4 ,
	.lx_col5_sp80 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp80 {
		width: calc(100% * var(--mainarea-base) - ((100% * var(--mainarea-base) - 4 * var(--column-side-margin)) / 5) - var(--column-side-margin));
		max-width: calc(var(--mainarea-width) - ((var(--mainarea-width) - 4 * var(--column-side-margin)) / 5) - var(--column-side-margin));
	}

	/* SP表示で3/4カラムに */
	.lx_col1_sp75 > div.column1 ,
	.lx_col2_sp75 > div.column2 ,
	.lx_col3_sp75 > div.column3 ,
	.lx_col4_sp75 > div.column4 ,
	.lx_col5_sp75 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp75 {
		width: calc(100% * var(--mainarea-base) - ((100% * var(--mainarea-base) - 3 * var(--column-side-margin)) / 4) - var(--column-side-margin));
		max-width: calc(var(--mainarea-width) - ((var(--mainarea-width) - 3 * var(--column-side-margin)) / 4) - var(--column-side-margin));
	}

	/* SP表示で2/3カラムに */
	.lx_col1_sp66 > div.column1 ,
	.lx_col2_sp66 > div.column2 ,
	.lx_col3_sp66 > div.column3 ,
	.lx_col4_sp66 > div.column4 ,
	.lx_col5_sp66 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp66 {
		width: calc(100% * var(--mainarea-base) - ((100% * var(--mainarea-base) - 2 * var(--column-side-margin)) / 3) - var(--column-side-margin));
		max-width: calc(var(--mainarea-width) - ((var(--mainarea-width) - 2 * var(--column-side-margin)) / 3) - var(--column-side-margin));
	}

	/* SP表示で3/5カラムに */
	.lx_col1_sp60 > div.column1 ,
	.lx_col2_sp60 > div.column2 ,
	.lx_col3_sp60 > div.column3 ,
	.lx_col4_sp60 > div.column4 ,
	.lx_col5_sp60 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp60 {
		width: calc( (100% * var(--mainarea-base) - 4 * var(--column-side-margin)) / 5 * 3 + 2 * var(--column-side-margin) - var(--column-side-margin));
		max-width: calc( (var(--mainarea-width) - 4 * var(--column-side-margin)) / 5 * 3 + 2 * var(--column-side-margin) - var(--column-side-margin));
	}

	/* SP表示で2カラムに */
	.lx_col_sp50 > div.column ,
	.lx_col1_sp50 > div.column1 ,
	.lx_col2_sp50 > div.column2 ,
	.lx_col3_sp50 > div.column3 ,
	.lx_col4_sp50 > div.column4 ,
	.lx_col5_sp50 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp50 {
		width: calc((100% * var(--mainarea-base) - 1 * var(--column-side-margin)) / 2);
		max-width: calc((var(--mainarea-width) - 1 * var(--column-side-margin)) / 2);
	}

	/* SP表示で2/5カラムに */
	.lx_col1_sp40 > div.column ,
	[id=index] [role="main"] > div.lx_col_sp40 {
		width: calc( (100% * var(--mainarea-base) - 4 * var(--column-side-margin)) / 5 * 2 + 1 * var(--column-side-margin) );
		max-width: calc( (var(--mainarea-width) - 4 * var(--column-side-margin)) / 5 * 2 + 1 * var(--column-side-margin) );
	}

	/* SP表示で3カラムに */
	.lx_col_sp33 > div.column ,
	.lx_col1_sp33 > div.column1 ,
	.lx_col2_sp33 > div.column2 ,
	.lx_col3_sp33 > div.column3 ,
	.lx_col4_sp33 > div.column4 ,
	.lx_col5_sp33 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp33 {
		width: calc((100% * var(--mainarea-base) - 2 * var(--column-side-margin)) / 3);
		max-width: calc((var(--mainarea-width) - 2 * var(--column-side-margin)) / 3);
	}

	/* SP表示で4カラムに */
	.lx_col_sp25 > div.column ,
	.lx_col1_sp25 > div.column1 ,
	.lx_col2_sp25 > div.column2 ,
	.lx_col3_sp25 > div.column3 ,
	.lx_col4_sp25 > div.column4 ,
	.lx_col5_sp25 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp25 {
		width: calc((100% * var(--mainarea-base) - 3 * var(--column-side-margin)) / 4);
		max-width: calc((var(--mainarea-width) - 3 * var(--column-side-margin)) / 4);
	}

	/* SP表示で5カラムに */
	.lx_col_sp20 > div.column ,
	.lx_col1_sp20 > div.column1 ,
	.lx_col2_sp20 > div.column2 ,
	.lx_col3_sp20 > div.column3 ,
	.lx_col4_sp20 > div.column4 ,
	.lx_col5_sp20 > div.column5 ,
	[id=index] [role="main"] > div.lx_col_sp20 {
		width: calc((100% * var(--mainarea-base) - 4 * var(--column-side-margin)) / 5);
		max-width: calc((var(--mainarea-width) - 4 * var(--column-side-margin)) / 5);
	}
}