/*  SECTIONS  ============================================================================= */

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  GROUPING  ============================================================================= */

.group::after {
	content: '';
	clear: both;
	display: block;
}
.group {
	zoom :1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float: left;
	margin: 1% 0 1% 1.6%;
}
.gutter .col {
	margin: 1% 0;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
.span_1_of_2:nth-of-type(2n+1) { margin-left: 0; }
.span_1_of_3:nth-of-type(3n+1) { margin-left: 0; }
.span_1_of_4:nth-of-type(4n+1) { margin-left: 0; }
.span_1_of_5:nth-of-type(5n+1) { margin-left: 0; }
.span_1_of_6:nth-of-type(6n+1) { margin-left: 0; }
.span_1_of_7:nth-of-type(7n+1) { margin-left: 0; }
.span_1_of_8:nth-of-type(8n+1) { margin-left: 0; }
.span_1_of_9:nth-of-type(9n+1) { margin-left: 0; }
.span_1_of_10:nth-of-type(10n+1) { margin-left: 0; }
.span_1_of_11:nth-of-type(11n+1) { margin-left: 0; }
.span_1_of_12:nth-of-type(12n+1) { margin-left: 0; }

/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col {
		margin: 1% 0 1% 0%;
	}
}


/*******************************************************************************************
* 2カラム
********************************************************************************************/
.span_2_of_2 {
	width: 100%;
}
.span_1_of_2 {
	width: 49.2%;
}

.gutter .span_2_of_2 {
	width: 100%;
}
.gutter .span_1_of_2 {
	width: 50%;
}


/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_2_of_2 {
		width: 100%;
	}
	.span_1_of_2 {
		width: 100%;
	}

	.gutter .span_2_of_2 {
		width: 100%;
	}
	.gutter .span_1_of_2 {
		width: 100%;
	}
}


/*******************************************************************************************
* 3カラム
********************************************************************************************/
.span_3_of_3 {
	width: 100%;
}
.span_2_of_3 {
	width: 66.13%;
}
.span_1_of_3 {
	width: 32.26%;
}

.gutter .span_3_of_3 {
	width: 100%;
}
.gutter .span_2_of_3 {
	width: 66.66%;
}
.gutter .span_1_of_3 {
	width: 33.33%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_3_of_3 {
		width: 100%;
	}
	.span_2_of_3 {
		width: 100%;
	}
	.span_1_of_3 {
		width: 100%;
	}

	.gutter .span_3_of_3 {
		width: 100%;
	}
	.gutter .span_2_of_3 {
		width: 100%;
	}
	.gutter .span_1_of_3 {
		width: 100%;
	}
}


/*******************************************************************************************
* 4カラム
********************************************************************************************/
.span_4_of_4 {
	width: 100%;
}
.span_3_of_4 {
	width: 74.6%;
}
.span_2_of_4 {
	width: 49.2%;
}
.span_1_of_4 {
	width: 23.8%;
}

.gutter .span_4_of_4 {
	width: 100%;
}
.gutter .span_3_of_4 {
	width: 75%;
}
.gutter .span_2_of_4 {
	width: 50%;
}
.gutter .span_1_of_4 {
	width: 25%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_4_of_4 {
		width: 100%;
	}
	.span_3_of_4 {
		width: 100%;
	}
	.span_2_of_4 {
		width: 100%;
	}
	.span_1_of_4 {
		width: 100%;
	}

	.gutter .span_4_of_4 {
		width: 100%;
	}
	.gutter .span_3_of_4 {
		width: 100%;
	}
	.gutter .span_2_of_4 {
		width: 100%;
	}
	.gutter .span_1_of_4 {
		width: 100%;
	}
}


/*******************************************************************************************
* 5カラム
********************************************************************************************/
.span_5_of_5 {
	width: 100%;
}
.span_4_of_5 {
	width: 79.68%;
}
.span_3_of_5 {
	width: 59.36%;
}
.span_2_of_5 {
	width: 39.04%;
}
.span_1_of_5 {
	width: 18.72%;
}

.gutter .span_5_of_5 {
	width: 100%;
}
.gutter .span_4_of_5 {
	width: 80%;
}
.gutter .span_3_of_5 {
	width: 60%;
}
.gutter .span_2_of_5 {
	width: 40%;
}
.gutter .span_1_of_5 {
	width: 20%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_5_of_5 {
		width: 100%;
	}
	.span_4_of_5 {
		width: 100%;
	}
	.span_3_of_5 {
		width: 100%;
	}
	.span_2_of_5 {
		width: 100%;
	}
	.span_1_of_5 {
		width: 100%;
	}

	.gutter .span_5_of_5 {
		width: 100%;
	}
	.gutter .span_4_of_5 {
		width: 100%;
	}
	.gutter .span_3_of_5 {
		width: 100%;
	}
	.gutter .span_2_of_5 {
		width: 100%;
	}
	.gutter .span_1_of_5 {
		width: 100%;
	}
}


/*******************************************************************************************
* 6カラム
********************************************************************************************/
.span_6_of_6 {
	width: 100%;
}
.span_5_of_6 {
	width: 83.06%;
}
.span_4_of_6 {
	width: 66.13%;
}
.span_3_of_6 {
	width: 49.2%;
}
.span_2_of_6 {
	width: 32.26%;
}
.span_1_of_6 {
	width: 15.33%;
}

.gutter .span_6_of_6 {
	width: 100%;
}
.gutter .span_5_of_6 {
	width: 83.3%;
}
.gutter .span_4_of_6 {
	width: 66.64%;
}
.gutter .span_3_of_6 {
	width: 49.98%;
}
.gutter .span_2_of_6 {
	width: 33.32%;
}
.gutter .span_1_of_6 {
	width: 16.66%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_6_of_6 {
		width: 100%;
	}
	.span_5_of_6 {
		width: 100%;
	}
	.span_4_of_6 {
		width: 100%;
	}
	.span_3_of_6 {
		width: 100%;
	}
	.span_2_of_6 {
		width: 100%;
	}
	.span_1_of_6 {
		width: 100%;
	}

	.gutter .span_6_of_6 {
		width: 100%;
	}
	.gutter .span_5_of_6 {
		width: 100%;
	}
	.gutter .span_4_of_6 {
		width: 100%;
	}
	.gutter .span_3_of_6 {
		width: 100%;
	}
	.gutter .span_2_of_6 {
		width: 100%;
	}
	.gutter .span_1_of_6 {
		width: 100%;
	}
}

/*******************************************************************************************
* 7カラム
********************************************************************************************/
.span_7_of_7 {
	width: 100%;
}
.span_6_of_7 {
	width: 85.48%;
}
.span_5_of_7 {
	width: 70.97%;
}
.span_4_of_7 {
	width: 56.45%;
}
.span_3_of_7 {
	width: 41.94%;
}
.span_2_of_7 {
	width: 27.42%;
}
.span_1_of_7 {
	width: 12.91%;
}

.gutter .span_7_of_7 {
	width: 100%;
}
.gutter .span_6_of_7 {
	width: 85.71%;
}
.gutter .span_5_of_7 {
	width: 71.425%;
}
.gutter .span_4_of_7 {
	width: 57.14%;
}
.gutter .span_3_of_7 {
	width: 42.855%;
}
.gutter .span_2_of_7 {
	width: 28.57%;
}
.gutter .span_1_of_7 {
	width: 14.285%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_7_of_7 {
		width: 100%;
	}
	.span_6_of_7 {
		width: 100%;
	}
	.span_5_of_7 {
		width: 100%;
	}
	.span_4_of_7 {
		width: 100%;
	}
	.span_3_of_7 {
		width: 100%;
	}
	.span_2_of_7 {
		width: 100%;
	}
	.span_1_of_7 {
		width: 100%;
	}

	.gutter .span_7_of_7 {
		width: 100%;
	}
	.gutter .span_6_of_7 {
		width: 100%;
	}
	.gutter .span_5_of_7 {
		width: 100%;
	}
	.gutter .span_4_of_7 {
		width: 100%;
	}
	.gutter .span_3_of_7 {
		width: 100%;
	}
	.gutter .span_2_of_7 {
		width: 100%;
	}
	.gutter .span_1_of_7 {
		width: 100%;
	}
}


/*******************************************************************************************
* 8カラム
********************************************************************************************/
.span_8_of_8 {
	width: 100%;
}
.span_7_of_8 {
	width: 87.3%;
}
.span_6_of_8 {
	width: 74.6%;
}
.span_5_of_8 {
	width: 61.9%;
}
.span_4_of_8 {
	width: 49.2%;
}
.span_3_of_8 {
	width: 36.5%;
}
.span_2_of_8 {
	width: 23.8%;
}
.span_1_of_8 {
	width: 11.1%;
}

.gutter .span_8_of_8 {
	width: 100%;
}
.gutter .span_7_of_8 {
	width: 87.5%;
}
.gutter .span_6_of_8 {
	width: 75%;
}
.gutter .span_5_of_8 {
	width: 62.5%;
}
.gutter .span_4_of_8 {
	width: 50%;
}
.gutter .span_3_of_8 {
	width: 37.5%;
}
.gutter .span_2_of_8 {
	width: 25%;
}
.gutter .span_1_of_8 {
	width: 12.5%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_8_of_8 {
		width: 100%;
	}
	.span_7_of_8 {
		width: 100%;
	}
	.span_6_of_8 {
		width: 100%;
	}
	.span_5_of_8 {
		width: 100%;
	}
	.span_4_of_8 {
		width: 100%;
	}
	.span_3_of_8 {
		width: 100%;
	}
	.span_2_of_8 {
		width: 100%;
	}
	.span_1_of_8 {
		width: 100%;
	}

	.gutter .span_8_of_8 {
		width: 100%;
	}
	.gutter .span_7_of_8 {
		width: 100%;
	}
	.gutter .span_6_of_8 {
		width: 100%;
	}
	.gutter .span_5_of_8 {
		width: 100%;
	}
	.gutter .span_4_of_8 {
		width: 100%;
	}
	.gutter .span_3_of_8 {
		width: 100%;
	}
	.gutter .span_2_of_8 {
		width: 100%;
	}
	.gutter .span_1_of_8 {
		width: 100%;
	}
}


/*******************************************************************************************
* 9カラム
********************************************************************************************/
.span_9_of_9 {
	width: 100%;
}
.span_8_of_9 {
	width: 88.71%;
}
.span_7_of_9 {
	width: 77.42%;
}
.span_6_of_9 {
	width: 66.13%;
}
.span_5_of_9 {
	width: 54.84%;
}
.span_4_of_9 {
	width: 43.55%;
}
.span_3_of_9 {
	width: 32.26%;
}
.span_2_of_9 {
	width: 20.97%;
}
.span_1_of_9 {
	width: 9.68%;
}

.gutter .span_9_of_9 {
	width: 100%;
}
.gutter .span_8_of_9 {
	width: 88.888%;
}
.gutter .span_7_of_9 {
	width: 77.777%;
}
.gutter .span_6_of_9 {
	width: 66.666%;
}
.gutter .span_5_of_9 {
	width: 55.555%;
}
.gutter .span_4_of_9 {
	width: 44.444%;
}
.gutter .span_3_of_9 {
	width: 33.333%;
}
.gutter .span_2_of_9 {
	width: 22.222%;
}
.gutter .span_1_of_9 {
	width: 11.111%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_9_of_9 {
		width: 100%;
	}
	.span_8_of_9 {
		width: 100%;
	}
	.span_7_of_9 {
		width: 100%;
	}
	.span_6_of_9 {
		width: 100%;
	}
	.span_5_of_9 {
		width: 100%;
	}
	.span_4_of_9 {
		width: 100%;
	}
	.span_3_of_9 {
		width: 100%;
	}
	.span_2_of_9 {
		width: 100%;
	}
	.span_1_of_9 {
		width: 100%;
	}

	.gutter .span_9_of_9 {
		width: 100%;
	}
	.gutter .span_8_of_9 {
		width: 100%;
	}
	.gutter .span_7_of_9 {
		width: 100%;
	}
	.gutter .span_6_of_9 {
		width: 100%;
	}
	.gutter .span_5_of_9 {
		width: 100%;
	}
	.gutter .span_4_of_9 {
		width: 100%;
	}
	.gutter .span_3_of_9 {
		width: 100%;
	}
	.gutter .span_2_of_9 {
		width: 100%;
	}
	.gutter .span_1_of_9 {
		width: 100%;
	}
}


/*******************************************************************************************
* 10カラム
********************************************************************************************/
.span_10_of_10 {
	width: 100%;
}
.span_9_of_10 {
	width: 89.84%;
}
.span_8_of_10 {
	width: 79.68%;
}
.span_7_of_10 {
	width: 69.52%;
}
.span_6_of_10 {
	width: 59.36%;
}
.span_5_of_10 {
	width: 49.2%;
}
.span_4_of_10 {
	width: 39.04%;
}
.span_3_of_10 {
	width: 28.88%;
}
.span_2_of_10 {
	width: 18.72%;
}
.span_1_of_10 {
	width: 8.56%;
}

.gutter .span_10_of_10 {
	width: 100%;
}
.gutter .span_9_of_10 {
	width: 90%;
}
.gutter .span_8_of_10 {
	width: 80%;
}
.gutter .span_7_of_10 {
	width: 70%;
}
.gutter .span_6_of_10 {
	width: 60%;
}
.gutter .span_5_of_10 {
	width: 50%;
}
.gutter .span_4_of_10 {
	width: 40%;
}
.gutter .span_3_of_10 {
	width: 30%;
}
.gutter .span_2_of_10 {
	width: 20%;
}
.gutter .span_1_of_10 {
	width: 10%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_10_of_10 {
		width: 100%;
	}
	.span_9_of_10 {
		width: 100%;
	}
	.span_8_of_10 {
		width: 100%;
	}
	.span_7_of_10 {
		width: 100%;
	}
	.span_6_of_10 {
		width: 100%;
	}
	.span_5_of_10 {
		width: 100%;
	}
	.span_4_of_10 {
		width: 100%;
	}
	.span_3_of_10 {
		width: 100%;
	}
	.span_2_of_10 {
		width: 100%;
	}
	.span_1_of_10 {
		width: 100%;
	}

	.gutter .span_10_of_10 {
		width: 100%;
	}
	.gutter .span_9_of_10 {
		width: 100%;
	}
	.gutter .span_8_of_10 {
		width: 100%;
	}
	.gutter .span_7_of_10 {
		width: 100%;
	}
	.gutter .span_6_of_10 {
		width: 100%;
	}
	.gutter .span_5_of_10 {
		width: 100%;
	}
	.gutter .span_4_of_10 {
		width: 100%;
	}
	.gutter .span_3_of_10 {
		width: 100%;
	}
	.gutter .span_2_of_10 {
		width: 100%;
	}
	.gutter .span_1_of_10 {
		width: 100%;
	}
}


/*******************************************************************************************
* 11カラム
********************************************************************************************/
.span_11_of_11 {
	width: 100%;
}
.span_10_of_11 {
	width: 90.76%;
}
.span_9_of_11 {
	width: 81.52%;
}
.span_8_of_11 {
	width: 72.29%;
}
.span_7_of_11 {
	width: 63.05%;
}

.span_6_of_11 {
	width: 53.81%;
}
.span_5_of_11 {
	width: 44.58%;
}
.span_4_of_11 {
	width: 35.34%;
}
.span_3_of_11 {
	width: 26.1%;
}
.span_2_of_11 {
	width: 16.87%;
}
.span_1_of_11 {
	width: 7.63%;
}

.gutter .span_11_of_11 {
	width: 100%;
}
.gutter .span_10_of_11 {
	width: 90.9%;
}
.gutter .span_9_of_11 {
	width: 81.81%;
}
.gutter .span_8_of_11 {
	width: 72.72%;
}
.gutter .span_7_of_11 {
	width: 63.63%;
}
.gutter .span_6_of_11 {
	width: 54.54%;
}
.gutter .span_5_of_11 {
	width: 45.45%;
}
.gutter .span_4_of_11 {
	width: 36.36%;
}
.gutter .span_3_of_11 {
	width: 27.27%;
}
.gutter .span_2_of_11 {
	width: 18.18%;
}
.gutter .span_1_of_11 {
	width: 9.09%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_11_of_11 {
		width: 100%;
	}
	.span_10_of_11 {
		width: 100%;
	}
	.span_9_of_11 {
		width: 100%;
	}
	.span_8_of_11 {
		width: 100%;
	}
	.span_7_of_11 {
		width: 100%;
	}
	.span_6_of_11 {
		width: 100%;
	}
	.span_5_of_11 {
		width: 100%;
	}
	.span_4_of_11 {
		width: 100%;
	}
	.span_3_of_11 {
		width: 100%;
	}
	.span_2_of_11 {
		width: 100%;
	}
	.span_1_of_11 {
		width: 100%;
	}

	.gutter .span_11_of_11 {
		width: 100%;
	}
	.gutter .span_10_of_11 {
		width: 100%;
	}
	.gutter .span_9_of_11 {
		width: 100%;
	}
	.gutter .span_8_of_11 {
		width: 100%;
	}
	.gutter .span_7_of_11 {
		width: 100%;
	}
	.gutter .span_6_of_11 {
		width: 100%;
	}
	.gutter .span_5_of_11 {
		width: 100%;
	}
	.gutter .span_4_of_11 {
		width: 100%;
	}
	.gutter .span_3_of_11 {
		width: 100%;
	}
	.gutter .span_2_of_11 {
		width: 100%;
	}
	.gutter .span_1_of_11 {
		width: 100%;
	}
}


/*******************************************************************************************
* 12カラム
********************************************************************************************/
.span_12_of_12 {
	width: 100%;
}
.span_11_of_12 {
	width: 91.53%;
}
.span_10_of_12 {
	width: 83.06%;
}
.span_9_of_12 {
	width: 74.6%;
}
.span_8_of_12 {
	width: 66.13%;
}
.span_7_of_12 {
	width: 57.66%;
}
.span_6_of_12 {
	width: 49.2%;
}
.span_5_of_12 {
	width: 40.73%;
}
.span_4_of_12 {
	width: 32.26%;
}
.span_3_of_12 {
	width: 23.8%;
}
.span_2_of_12 {
	width: 15.33%;
}
.span_1_of_12 {
	width: 6.86%;
}

.gutter .span_12_of_12 {
	width: 100%;
}
.gutter .span_11_of_12 {
	width: 91.663%;
}
.gutter .span_10_of_12 {
	width: 83.33%;
}
.gutter .span_9_of_12 {
	width: 74.997%;
}
.gutter .span_8_of_12 {
	width: 66.664%;
}
.gutter .span_7_of_12 {
	width: 58.331%;
}
.gutter .span_6_of_12 {
	width: 49.998%;
}
.gutter .span_5_of_12 {
	width: 41.665%;
}
.gutter .span_4_of_12 {
	width: 33.332%;
}
.gutter .span_3_of_12 {
	width: 24.999%;
}
.gutter .span_2_of_12 {
	width: 16.666%;
}
.gutter .span_1_of_12 {
	width: 8.333%;
}

/*  480px以下は１カラム（width:100%） */
@media only screen and (max-width: 480px) {
	.span_12_of_12 {
		width: 100%;
	}
	.span_11_of_12 {
		width: 100%;
	}
	.span_10_of_12 {
		width: 100%;
	}
	.span_9_of_12 {
		width: 100%;
	}
	.span_8_of_12 {
		width: 100%;
	}
	.span_7_of_12 {
		width: 100%;
	}
	.span_6_of_12 {
		width: 100%;
	}
	.span_5_of_12 {
		width: 100%;
	}
	.span_4_of_12 {
		width: 100%;
	}
	.span_3_of_12 {
		width: 100%;
	}
	.span_2_of_12 {
		width: 100%;
	}
	.span_1_of_12 {
		width: 100%;
	}

	.gutter .span_12_of_12 {
		width: 100%;
	}
	.gutter .span_11_of_12 {
		width: 100%;
	}
	.gutter .span_10_of_12 {
		width: 100%;
	}
	.gutter .span_9_of_12 {
		width: 100%;
	}
	.gutter .span_8_of_12 {
		width: 100%;
	}
	.gutter .span_7_of_12 {
		width: 100%;
	}
	.gutter .span_6_of_12 {
		width: 100%;
	}
	.gutter .span_5_of_12 {
		width: 100%;
	}
	.gutter .span_4_of_12 {
		width: 100%;
	}
	.gutter .span_3_of_12 {
		width: 100%;
	}
	.gutter .span_2_of_12 {
		width: 100%;
	}
	.gutter .span_1_of_12 {
		width: 100%;
	}
}