@chraset: SIFT-JIS;

input#modal {
	display: none;
}
input#modal + label {
	width: 100%;
	height: 120%;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 99999;
	background: rgba(0, 0, 0, 0.5);
	cursor: pointer;
}
input#modal + label div {
	position: fixed;
	width: 300px;
	top: 50%;
	left: 50%;
	margin: -217px 0 0 -150px;
	background: none;
	border: none;
}
input#modal + label div::before {
	content: "�~ Close";
	position: absolute;
	bottom: -25%;
	right: 50%;
	margin: 0 -60px 0 0;
	font-size: 2em;
	font-weight: bold;
	color: #ffffff;
}
input#modal:checked + label {
	display: none;
}
div.modal label div img {
	width: 100%;
}
/* 700�ȏ� */
@media screen and (min-width: 700px) {
	input#modal + label div {
		width: 560px;
		margin: -330px 0 0 -280px; /*�摜�̍����ƕ��̔��� margin���}�C�i�X */
	}
	input#modal + label div::before {
		bottom: -14%;
		font-size: 3em;
	}
}