/*	12 COLUMN : RESPONSIVE GRID SYSTEM
	DEVELOPER : DENIS LEBLANC
	URL : http://responsive.gs
	VERSION : 3.0
	LICENSE : GPL & MIT */


/* 	SET ALL ELEMENTS TO BOX-SIZING : BORDER-BOX */
* { 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	*behavior: url(/scripts/boxsizing.htc); 
	/*	If you need support for IE7 and lower make 
		sure the boxsizing.htc file is linked properly.
		More info here:  https://github.com/Schepp/box-sizing-polyfill */
}


/*	MAIN CONTAINER 
	Set the width to whatever you want the width of your site to be. */
.container { 
	max-width: 100%;
	margin: 0 auto; 
}



/*	SELF CLEARING FLOATS - CLEARFIX METHOD */
.container:after,
.row:after, 
.col:after, 
.clr:after, 
.group:after { 
	content: ""; 
	display: table; 
	clear: both; 
}

/* 	DEFAULT ROW STYLES 
	Set bottom padding according to preference */
.row { padding-bottom: 0em; }
			
								  
/* DEFAULT COLUMN STYLES */
.col { 
	display: block;
	float: left;
}

.gutters .span_1 { width: 55px; }
.gutters .span_2 { width: 130px; }
.gutters .span_3 { width: 205px; }
.gutters .span_4 { width: 280px; }
.gutters .span_5 { width: 355px; }
.gutters .span_6 { width: 430px; }
.gutters .span_7 { width: 505px; }
.gutters .span_8 { width: 580px; }
.gutters .span_9 { width: 655px; }
.gutters .span_10 { width: 730px; }
.gutters .span_11 { width: 805px; }
.gutters .span_12 { width: 880px; }
	
.gutters .col { margin-left: 20px; }
.gutters .col:first-child { margin-left: 0; }

/* 活動事例リスト */
.gutters .span2_3 {
	width: 21%;
	float: left;
	display: block;
	clear: left;
}
.gutters .span2_9 { 
	width: 79%;
	float: left;
	display: block;
}

.clearfix:after{
	content: "";
	clear: both;
	display: block;
}

/*	
@media ( min-width : 768px ) {
	.gutters .col { margin-left: 2%; }
	.gutters .col:first-child { margin-left: 0; }
}
*/