* {
	box-sizing: border-box;
}
body, html {
	background-color: #fafafa;
	width: 100vw;
	height:  100vh;
	padding: 0;
	margin: 0;
}
a, a:hover { text-decoration: none; color:#000; }
.h-100	{ height: 100%; }

.w-5	{ width: 5%; }
.w-10	{ width: 10%; }
.w-15	{ width: 15%; }
.w-50	{ width: 50%; }
.w-100	{ width: 100%; }
/* display */
.d-flex {
	display: flex;
}
.d-flex-h-center {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}
.d-none, .d-sm-none {
	display: none;
}
.d-block, .d-sm-block {
	display: none;
}
.d-table, .d-sm-table {
	display: table;
}
/* text */
.text-center	{ text-align: center; }
.text-start	{ text-align: left; }
.text-end	{ text-align: right; }
/* border */
.border-black {
	border: 1px solid #000;
}
.border-rounded {
	border-radius: 5px;
}
/* padding|margin */
.p-2	{ padding: .5em .5em; }
.mt-2	{ padding-top: .5em; }
/* form */
.std-form {
	border: 1px solid #000;
	border-radius: 5px;
	padding: .5em .5em;
	margin-top: .5em;
}

@media only screen and (min-width: 768px) {
	.d-md-none		{ display: none; }
	.d-md-block		{ display: block; }
	.d-md-inline-block	{ display: inline-block; }
	.d-md-table		{ display: table; }
}

@media only screen and (min-width: 993px) {
	.d-lg-none		{ display: none; }
	.d-lg-block		{ display: block; }
	.d-lg-inline-block	{ display: inline-block; }
	.d-lg-table		{ display: table; }
}

@media only screen and (min-width: 1200px) {
	.d-xl-none		{ display: none; }
	.d-xl-block		{ display: block; }
	.d-xl-inline-block	{ display: inline-block; }
	.d-xl-table		{ display: table; }
}