/*この色の考案者：massangoさん、ありがとう！！ Спасибо!!!!*/
body{
	background-image: linear-gradient(to top, #A8EDEA 0%, #FED6E3 100%);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;

	margin: 0px;
}

.HEADER > .ACCOUNT > a > img{
	width: 45px;
}

.SERVICE_LIST{
	margin-top: calc(var(--HEADER_HEIGHT) + 50px);
	margin-left: auto;
	margin-right: auto;

	width: 800px;

	display: grid;
	grid-template-columns: repeat(auto-fill, 200px);
	gap: 5px;
	grid-auto-rows: minmax(200px, auto);
	justify-content: center;

	margin-top: 50px;
}

.SERVICE_LIST > a{
	color: black;
	text-decoration: none;
}

.SERVICE_ITEM{
	transition: 0.3s;

	border: solid;
	border-width: 1px;

	text-align: center;

	background-color: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(1px);

	width: 100%;
	height: 100%;
}

.SERVICE_ITEM:hover{
	box-shadow: 0 0 10px rgb(0, 0, 0);
	transform:translateY(5px);

	cursor:pointer;
}

.SERVICE_ITEM:hover > .DESC{
	opacity: 1;
}

.SERVICE_ITEM > .DESC{
	transition: 0.3s;

	opacity: 0;
}

@media (max-width: 750px){
	.SERVICE_LIST{
		display: block;

		width: 100vw;
		height: fit-content;
	}

	.SERVICE_ITEM{
		margin-left: 10px;
		margin-right: auto;

		width: calc(100vw - 40px);
	}
}