div.card {
		display : grid;
		grid-template-columns : 50px 1fr 1fr;
		grid-template-rows : 400px 50px auto;
		justify-items : center;
		align-items : center;
		width : 90%;
		min-width : 600px;
		margin : 20px auto;
		border : 1px solid #3c6690;
		overflow : hidden;
	}
	div.pic {
		grid-column : 1 / 4;
		grid-row : 1 / 2;
	}
	div.pic img {
		width : 100%;
		height : 100%;
		object-fit : scale-down;
	}
	div.icon img {
		height : 100%;
		object-fit : scale-down;
	}
	div.title {
		grid-column : 2 / 4;
		font-size : x-large;
	}
	div.link {
		grid-column : 1 / 4;
		width : 100%;
		height : 100%;
		display : grid;
		grid-template-columns : repeat(auto-fill,155px);
		align-items : center;
		justify-items : center;
		border-bottom : 1px solid;
	}
	div.download {
		grid-column : 1 / 3;
		display : grid;
		grid-template-columns : 1fr 1fr 1fr;
		grid-auto-rows : 50px;
		align-items : center;
		width : 100%;
		height : 100%;
		border-right : 1px solid;
		text-align : center;
	}
	div.download div#name {
		grid-column : 1 / 4;
		font-size : x-large;
	}
	div.dousa {
		display : grid;
		grid-template-columns : 1fr 2fr;
		grid-auto-rows : 50px;
		align-items : center;
		width : 100%;
		height : 100%;
		border-right : 1px solid;
		text-align : center;
	}
	div.dousa div#name {
		grid-column : 1 / 3;
		font-size : x-large;
	}

	div.button {
		width : 100%;
		height : 95%;
		display : grid;
		justify-items : center;
		align-items : center;
		border-radius : 4px;
		text-align : center;
		color : rgb(220,220,220);
		overflow : hidden;
		cursor :  pointer;
		user-select : none;
		text-decoration : none;
		transition : .3s;
	}
	div.button#one {
		background : rgb(130,120,010);
		&:hover {
			background : rgb(180,170,060);
		}
	}
	div.button#two {
		background : rgb(010,130,130);
		&:hover {
			background : rgb(060,180,180);
		}
	}
	div.button#three {
		background : rgb(200,050,050);
		&:hover {
			background : rgb(240,100,100);
		}
	}
	div.button#four {
		background : rgb(170,050,200);
		&:hover {
			background : rgb(220,100,250);
		}
	}

	a.button {
		width : 98%;
		display : block;
		text-decoration : none;
	}


	/*カードの幅より小さくなった場合*/
	@media screen and (max-width: 600px) {
		div.card {
			width : 95%;
			min-width : initial;
			grid-template-columns : 50px 1fr;
			grid-template-rows : auto 50px auto;
		}
		div.pic {
			grid-column : 1 / 3;
			padding : 5px 0;
		}
		div.title {
			grid-column : 2 / 3;
		}
		div.link {
			grid-column : 1 / 3;
			justify-content : space-evenly;
			padding : 5px 0;
		}
		div.download {
			grid-column : 1 / 3;
			border-bottom : 1px solid;
			font-size : small;
		}
		div.dousa {
			grid-column : 1 / 3;
		}
	}