@charset "utf-8";
/* CSS Document */

/**** tag ****/
a { text-decoration: none; color: #333; }
h3 { padding-top: 10px; text-align: center; }

/**** class ****/

#carProfile ol { counter-reset: counter-name; padding: 40px 0 20px 0; }
#carProfile ol::after {
  content: "";
  display: block;
  clear: both;
}

#carProfile li { width: 32%; float: left; display: block; margin: 0 20px 30px 0; padding: 20px; position: relative;/*リストの項目の位置を基準に*/ box-shadow: 0px 0px 4px -0.5px rgba(0, 0, 0, 0.8);}
#carProfile li:nth-child(3n) { margin-right: 0px; }
#carProfile li:last-child,li:nth-last-child(2):nth-child(odd) { margin-bottom: 0; }
#carProfile li:before {
	counter-increment: counter-name;
	content: counter(counter-name); 
	/*装飾*/
	border-radius: 50%;
	background: #666;
	font-weight: 600; font-size: 1.2em; text-align: center; color: #ffffff;
	z-index: 1;	
	position: absolute; /*リストの基準から移動させる*/	
	margin: 0;
	width: 1.8em; height: 1.8em; /*heightとwidthと同じ数値に。数値変更した場合はline-heightで調整*/ line-height: 1.8; /*数字の位置あわせで数値を指定*/
	left: 45%; top:-1em; /*項目の基準*/
}
@media screen and ( max-width:480px) { 
	#carProfile li { width: auto; float: none; margin:0 0 40px 0; }
}
@media screen and (min-width:481px) and ( max-width:896px) { 
	#carProfile li { width: 48% !important; margin-right: 20px; }
	#carProfile li:before { left: 44%; }
	#carProfile li:nth-child(2n) { margin-right: 0px; }
	#carProfile li:nth-child(3n) { margin-right: 20px; }
}
/*
@media screen and (min-width:897px) and (max-width: 1024px) {
}
*/

#carProfile dl { margin-bottom: 10px; }
#carProfile dt { padding-bottom: 10px; }
#carProfile img { border: #ccc 1px solid; }
#carProfile dd { padding-bottom: 5px; }
#carProfile .maker { font-size: 0.8em; display:block; padding-bottom: 5px; }


#favorite::after {
  content: "";
  display: block;
  clear: both;
}