@charset "utf-8";

body {
	margin: 0;
	padding: 0;
}
.back {
	position: fixed;
	bottom: 10px;
	right: 10px;
}

.grid {
	max-width: 1000px;
	margin: 0 auto;
}
.grid-item {
	position: relative;
	margin: 10px;
}
.grid-item img {
	display:block;
}
.grid-item_w140 {
	width: 140px;
}
.grid-item_w300 {
	width: 300px;
}
.grid-item_20per {
	width: 20%;
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
}
.grid-item_33per {
	width: 20%;
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
}
.grid-item_50per {
	width: 50%;
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
}
.grid-item_40per {
	width: 40%;
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
}
.grid-item_66per {
	width: 66%;
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
}
.grid-item_20per img,
.grid-item_33per img,
.grid-item_50per img,
.grid-item_66per img,
.grid-item_40per img {
	width: 100%;
	height: auto;
}
.grid-item_sizer {
	width: 20%;
}
@media screen and (max-width: 768px) {
	.grid-item_20per {
		width: 33.333%;
	}
	.grid-item_40per {
		width: 66.666%;
	}
	.grid-item_33per {
		width: 50%;
	}
	.grid-item_66per {
		width: 100%;
	}
	.grid-item_sizer {
		width: 50%;
	}
}
.grid-other {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	color: #ffffff;
	background: #333333;
}
.grid-item_gutter {
	margin-left: 0;
	margin-right: 0;
}
.grid-item_text {
	position: absolute;
	left: 15px;
	bottom: 15px;
	margin: 0;
}
