.mc-type {
	width: 100%;
	position: relative;
	margin-bottom: 50px;
}
@media only screen and (max-width: 767px) {
	.mc-type {
		margin-bottom: 0px;
	}
}

.mc-type_List {
	display: flex;
	justify-content: center;
}
@media only screen and (max-width: 767px) {
	.mc-type_List {
		display: block;
	}
}


.mc-type_Item {
	width: 360px;
	position: relative;
	
}
@media only screen and (max-width: 767px) {
	.mc-type_Item {
		width: 100%;
		min-height: calc(80 / 800 * 100vw);
	}
}
.mc-type_Item:hover {
	background-color: rgba(240, 240, 228, .7);
} 








.mc-type_Item:hover .mc-type_Item::before {
	opacity: .7;
}

.mc-type_Item + .mc-type_Item {
	margin-left: 40px;
}
@media only screen and (max-width: 767px) {
	.mc-type_Item + .mc-type_Item {
		margin-left: 0;
		margin-top: 1.5rem;
	}
}


.mc-type_Title {
	color: inherit;
	text-decoration: none;
	width: 100%;
	min-height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
	border: 1px solid #000;
	padding: 1em 1em 1em 30px;
	background-color: rgb(240, 240, 228);
	cursor: pointer;
	font-weight: bold;
	font-size: 1.8rem;
}
@media only screen and (max-width: 767px) {
	.mc-type_Title {
		font-size: calc((30 / 800) * 100vw);
		min-height: calc((100 / 800) * 100vw);
	}
}
.mc-type_Title::before {
	content: '';
	border-top: 1px solid #000;
	border-right: 1px solid #000;
	width: 9px;
	height: 9px;
	transform: rotate(45deg);
	margin: auto;
	position: absolute;
	top: 50%;
	left: 15px;
	margin-top: -4px;
	z-index: 2;
}



.mc-type_Item:hover .mc-type_Title {
	opacity: 0.7;
}

.mc-type_select {
	position: absolute;
	top: 80px;
	left: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	font-size: 1.8rem;
	background-color: rgb(235, 235, 235);
	display: none;
}

@media only screen and (max-width: 767px) {
	.mc-type_select {
		position: relative;
		top: auto;
		left: auto;
		width: 100%;
		display: flex;
		flex-direction: column;
		font-size: calc((30 / 800) * 100vw);
		background-color: rgb(235, 235, 235);
		display: block;
	}
}


.mc-type_select.isActive {
	display: block;
}

.mc-type_select li a {
	display: block;
	text-decoration: none;
	padding: 1rem;
	opacity: 1;
	position: relative;
}

.mc-type_select li a::after {
	content: '';
	border-top: 1px solid #000;
	border-right: 1px solid #000;
	width: 9px;
	height: 9px;
	transform: rotate(45deg);
	margin: auto;
	position: absolute;
	top: 50%;
	right: 15px;
	margin-top: -4px
}
.mc-type_select li a:hover {
	background-color: #589279;
	color: #fff;
}

