html, body{height:100%; margin:0;padding:0}
 
.meinput {
	background: #FAFAFA;
}
.input-date {
	width: 10%;
	border: 1px solid #ced4da;
	height: calc(2.25rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
}
.sp {
	display: none;
}
.input-ket {
	width: 100%;
	border: 1px solid #ced4da;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
}
.spc {
	height: 10px;
}
.progressme {
	background:#579DFF;
	width: 0px;	
	font-size: 60%;
	color:#fff;
	padding:5px;
	min-height: 20px;
	display: none;
}
.filename_input {
	width: 20%;
	border: 1px solid #ced4da;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
}
.myfoto {
	width: 300px;
	height: 300px;
}

.view_content {
	width: 60%;
	border:1px solid #bbb;
	margin:auto;
	padding: 5px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.value {
	background: #BFBFBF;
	padding-right: 3px;
	padding-left: 4px;
}
.view_content table tr td{
	padding-bottom: 10px;
}


@media screen and (max-width: 780px) { /* Responsive Area */
.input-date {
	width: 20%;
	border: 1px solid #ced4da;
	height: calc(2.25rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
}
.sp {
	display: inline;
	height: 20px;
}
.input-ket {
	width: 100%;
	border: 1px solid #ced4da;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
}
.filename_input {
	width: 45%;
	border: 1px solid #ced4da;
    padding: .375rem .75rem;
    font-size: 1rem;
    border-radius: .25rem;
}
.view_content {
	width: 100%;
	overflow: auto;
	border:1px solid #bbb;
	margin:auto;
	padding: 5px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.value {
	background: #BFBFBF;
	padding-right: 3px;
	padding-left: 4px;
}
.view_content table tr td{
	padding-bottom: 10px;
}

}