@charset "Shift_JIS";

/*--------------------------------------------------------------------------------
	.photo-sample-1301
--------------------------------------------------------------------------------*/
.mod-include .photo-sample-1301 .sample {
	margin: 30px auto 40px;
	width: 414px;
}

.mod-include .photo-sample-1301 .sample.narrow {
	text-align: center;
}

.mod-include .photo-sample-1301 img {
	transition: opacity 0.3s ease-out;
	-moz-transition: opacity 0.3s ease-out;
	-webkit-transition: opacity 0.3s ease-out;
	-ms-transition: opacity 0.3s ease-out;
	-o-transition: opacity 0.3s ease-out;
	vertical-align: top;
}

.mod-include .photo-sample-1301 img:hover {
	opacity: 0.7;
}

.mod-include .photo-sample-1301 p.exif {
	margin: 5px 0 0 0;
}

.mod-include .photo-sample-1301 p.note {
	margin: 8px auto 0;
	font-size: 90%;
	text-align: left;
}

.mod-include .photo-sample-1301 em.note {
	display: block;
	margin: 4px auto 0;
	font-style: normal;
	font-size: 85%;
	text-align: left;
	color: #666;
}

.mod-include .photo-sample-1301 .sample p.note,
.mod-include .photo-sample-1301 .sample em.note {
	width: 420px;
}

.mod-include .photo-sample-1301 .sample.narrow p.note,
.mod-include .photo-sample-1301 .sample.narrow em.note {
	width: 320px;
}


@media (max-width:640px) {
	.mod-include .photo-sample-1301 .sample {
		width: 100%;
		text-align: center;
	}
	.mod-include .photo-sample-1301 img {
		width: 100%;
		max-width: 400px;
	}
	.mod-include .photo-sample-1301 .narrow img {
		max-width: 300px;
	}
	.mod-include .photo-sample-1301 p.exif {
		font-size: 90%;
	}
	.mod-include .photo-sample-1301 p.note {
		display: inline-block;
		width: auto;
		font-size: 80%;
	}
	.mod-include .photo-sample-1301 em.note {
		display: inline-block;
		width: auto;
		font-size: 75%;
	}
	.mod-include .photo-sample-1301 .sample p.note,
	.mod-include .photo-sample-1301 .sample em.note {
		width: auto;
	}
	.mod-include .photo-sample-1301 .sample.narrow p.note,
	.mod-include .photo-sample-1301 .sample.narrow em.note {
		width: auto;
	}
}



/*--------------------------------------------------------------------------------
	.photo-sample-1308
--------------------------------------------------------------------------------*/
.mod-include .photo-sample-1308 .sample {
	margin: 30px auto 40px;
	width: 466px;
}

.mod-include .photo-sample-1308 .sample.narrow {
	text-align: center;
}

.mod-include .photo-sample-1308 img {
	transition: opacity 0.3s ease-out;
	-moz-transition: opacity 0.3s ease-out;
	-webkit-transition: opacity 0.3s ease-out;
	-ms-transition: opacity 0.3s ease-out;
	-o-transition: opacity 0.3s ease-out;
	vertical-align: top;
}

.mod-include .photo-sample-1308 img:hover {
	opacity: 0.7;
}

.mod-include .photo-sample-1308 p.exif {
	margin: 5px 0 0 0;
}

.mod-include .photo-sample-1308 p.note {
	margin: 8px auto 0;
	font-size: 90%;
	text-align: left;
}

.mod-include .photo-sample-1308 em.note {
	display: block;
	margin: 4px auto 0;
	font-style: normal;
	font-size: 85%;
	text-align: left;
	color: #666;
}

.mod-include .photo-sample-1308 .sample p.note,
.mod-include .photo-sample-1308 .sample em.note {
	width: 466px;
}

.mod-include .photo-sample-1308 .sample.narrow p.note,
.mod-include .photo-sample-1308 .sample.narrow em.note {
	width: 466px;
}


@media (max-width:640px) {
	.mod-include .photo-sample-1308 .sample {
		width: 100%;
		text-align: center;
	}
	.mod-include .photo-sample-1308 img {
		width: 100%;
		max-width: 400px;
	}
	.mod-include .photo-sample-1308 .narrow img {
		max-width: 300px;
	}
	.mod-include .photo-sample-1308 p.exif {
		font-size: 90%;
	}
	.mod-include .photo-sample-1308 p.note {
		display: inline-block;
		width: auto;
		font-size: 80%;
	}
	.mod-include .photo-sample-1308 em.note {
		display: inline-block;
		width: auto;
		font-size: 75%;
	}
	.mod-include .photo-sample-1308 .sample p.note,
	.mod-include .photo-sample-1308 .sample em.note {
		width: auto;
	}
	.mod-include .photo-sample-1308 .sample.narrow p.note,
	.mod-include .photo-sample-1308 .sample.narrow em.note {
		width: auto;
	}
}