@charset "utf-8";

/* specBtn */
.specBtn{
	width:1100px;
	margin: 0 auto;
	margin-bottom:50px;
}
.specBtn ul{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.specBtn ul li{
	width:18%;
	margin-bottom: 10px;
}
.specBtn ul li a{
	display: block;
	color: #0078ad;
	background: linear-gradient(90deg,#c7dee4,#98c6dc);
	padding: 5px;
	position: relative;
	transition:0.3s all;
}
.specBtn ul li a:hover,
.specBtn ul li a:active{
	color: #fff;
	background: linear-gradient(90deg,#95b6e0,#0178bf);
	transition:0.3s all;
}
.specBtn ul li a:before{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.specBtn ul li a .btnInner{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10px 0;
	background: linear-gradient(135deg,#98c6dc,#c7dee4);
	transition:0.3s all;
}
.specBtn ul li a:hover .btnInner,
.specBtn ul li a:active .btnInner{
	background: linear-gradient(135deg,#0178bf,#95b6e0);
	transition:0.3s all;
}
.specBtn ul li a .btnInner span:first-of-type{
	font-family: "Marcellus", serif;
	font-size: 1em;
	letter-spacing: 0.1em;
}
.specBtn ul li a .btnInner span:last-of-type{
	font-size: 0.75em;
}
@media (max-width:1200px){
	.specBtn{
		width:90%;
	}
}
@media (max-width:1024px){
	.specBtn ul li{
		width:19%;
	}
	.specBtn ul li a .btnInner span:first-of-type{
		font-size: 0.9em;
	}
}
@media (max-width:768px){
	.specBtn ul li{
		width:48%;
	}
	.specBtn ul li a .btnInner span:first-of-type{
		font-size: 1em;
	}
}