@charset "utf-8";

/*--------------Media-------------*/
@media screen and (max-width:767px) {
	.top, .maincontent{
		color: #ffe6b3;
		padding-top: 10px;
		padding-left: 5%;
		padding-right: 5%;
		font-size: 1.6rem;
		line-height: 1.3;
		clear: both;
	}
	*{
    	box-sizing: border-box;
	}
	.box {
	  	float: left;
	  	width: 25%; 
	  	height: 100px;
	  	padding: 5% 2%; 
	  	text-align: center;

	}
	
	ol li{
		padding-bottom: 20px;
	}
	.footer{
		clear: both;
	}
a:link {
	color: ##FFFF00;
	text-decoration: none;
	font-style:italic;
}
a:visited {
	color: ##FFFF00; 
	text-decoration: none;
	font-style:italic;
}
a:hover {
	color: ##FFFF00;
	text-decoration: none;
	font-style:italic;
}
a:active {
	color: #FFFF00; 
	text-decoration: none;
	font-style:italic;
}
}
	
/*--------------PC-------------*/
@media screen and (min-width:768px) {
	.top, .maincontent{
		color: #ffe6b3;
		padding-top: 10px;
		padding-left: 20%;
		padding-right: 20%;
		font-size: 1.6rem;
		line-height: 1.3;
		clear: both;
	}
	*{
    	box-sizing: border-box;
	}
	.box {
	  	float: left;
	  	width: 25%; 
	  	height: 100px;
	  	padding: 5% 2%; 
	  	text-align: center;

	}
	
	ol li{
		padding-bottom: 20px;
	}
	.footer{
		clear: both;
	}
a:link {
	color: #FFFF00;
	text-decoration: none;
}
a:visited {
	color: #FFFF00; 
	text-decoration: none;
}
a:hover {
	color: #FFFF00;
	text-decoration: none;
}
a:active {
	color: #FFFF00; 
	text-decoration: none;
}
}