input[type="text"], input[type="password"] {
	width: 90%;
}

input[type="submit"] {
	width: 100%;
}

.div-bg {
	width: 100%;
	height: 100%;
	position: relative;
}

.div-bg:before {
	content: ' ';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url("/member/image/login_bg.jpg") center no-repeat;
	background-size: 100% 100%;
	opacity: 0.4;
}

.center_element {
	position: relative;
	width: 30%;
	margin-left: 35%;
	margin-right: 35%;
	min-width: 300px;
	max-width: 30vw; 
	padding-top: 25vh;
	text-align: center;
}

.scaling {
	width: 25vw;
	min-width: 250px;
}

/* use following style when device screen's width lower than 1024px */
/* -- landscape -- */
@media only screen and (max-device-width: 1023px) and (orientation:landscape) {
	.scaling {
		width: 40vw;
		min-width: 0px;
	}
	
	.center_element {
		width: 50%;
		margin-left: 25%;
		margin-right: 25%;
		min-width: 0px;
		max-width: 100vw; 
		padding-top: 25vh;
		text-align: center;
	}
}

/* use following style when device screen's width lower than 1024px */
/* -- portrait -- */
@media only screen and (max-device-width: 1023px) and (orientation:portrait) {
	.scaling {
		width: 50vw;
		min-width: 0px;
	}
	
	.center_element {
		width: 80%;
		margin-left: 10%;
		margin-right: 10%;
		min-width: 0px;
		max-width: 100vw; 
		padding-top: 25vh;
		text-align: center;
	}
}