@charset "utf-8";

/*---------------------------
-/car-kaitori/ranking/
---------------------------*/
/*----------------------
.pageRanking
----------------------*/
.pageRanking .rankingArea {
	margin-bottom:30px;
}
.pageRanking .rankingArea ol > li {
	padding-bottom:15px;
	border-top:1px solid #CCC;
	overflow:hidden;
}
.pageRanking .rankingArea ol > li:last-child {
	border-bottom:1px solid #CCC;
}
.pageRanking .rankingArea ol > li h3 {
	padding:7px;
	font-size:152%;
}
.pageRanking #contents ol > li:first-child h3 {
	background-image:linear-gradient(180deg,rgb(254,247,224) 0%,rgb(255,255,255) 97%);
}
.pageRanking #contents ol > li:nth-child(2) h3 {
	background-image:linear-gradient(180deg,rgb(243,243,243) 0%,rgb(255,255,255) 97%);
}
.pageRanking #contents ol > li:nth-child(3) h3 {
	background-image:linear-gradient(180deg,rgb(247,239,230) 0%,rgb(255,255,255) 96%);
}
.pageRanking .rankingArea ol > li h3 a {
	display:inline-block;
	font-weight:bold;
	vertical-align:middle;
}
.pageRanking .rankingArea ol > li h3 img {
	margin-right:5px;
	vertical-align:middle;
}
.pageRanking .rankingArea ol > li:nth-child(n+4) h3 img {
	margin:0 11px 0 5px;
	height:30px;
	width:30px;
}

.pageRanking .detail .star {
	margin:5px 0 15px;
	padding:15px 10px;
	border-radius:4px;
	background:#F5F5F5;
	letter-spacing:-.4em;
	vertical-align:top;
	text-align: center;
	box-sizing:border-box;
}
.pageRanking .detail .star .item {
	display:inline-block;
	vertical-align:middle;
	letter-spacing:normal;
	font-size: 130%;
}
.pageRanking .detail .star .item:after {
	content:"";
	margin:0 20px 0 26px;
	display:inline-block;
	height:32px;
	width:1px;
	background:#CCC;
	vertical-align:middle;
}
.pageRanking .detail .star > span {
	margin-right:10px;
	display:inline-block;
	height: 38px;
	width: 40px;
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/star_off.png) no-repeat left center;
	background-size:auto 100%;
	vertical-align:middle;
}
.pageRanking .detail .star span span {
	display:block;
	height: 38px;
	width: 40px;
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/star.png) no-repeat left center;
	background-size:auto 100%;
	font-size:0;
}
.pageRanking .detail .star .number {
	padding-left:26px;
	display:inline-block;
	font-size:152%;
	letter-spacing:normal;
	vertical-align:middle;
	position: relative;
	top: .3em;
}
.pageRanking .detail .star .number .rating {
	padding-right:5px;
	color:#F60;
	font-weight:bold;
	font-size:152%;
	line-height:1;
}
.pageRanking .rankingArea .detail .otherRank {
	margin-bottom: 15px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.pageRanking .rankingArea .detail .otherRank-item {
	min-width: 120px;
	font-size: 100%;
	box-sizing: border-box;
}
.pageRanking .rankingArea .detail .otherRank-item .text:before {
	content: "";
	display: inline-block;
	margin-right: 6px;
	vertical-align: middle;
	background-image: url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/ranking/icon_tel.png);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: left top;
	height: 20px;
	width: 20px;
	position: relative;
	top: -0.1em;
}
.pageRanking .rankingArea .detail .otherRank-item:nth-child(2) .text:before {
	background-image: url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/ranking/icon_people.png);
}
.pageRanking .rankingArea .detail .otherRank-item:nth-child(3) .text:before {
	background-image: url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/ranking/icon_note.png);
}
.pageRanking .rankingArea .detail .otherRank-item:nth-child(4) .text:before {
	background-image: url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/ranking/icon_yen_mark.png);
}
.pageRanking .rankingArea .detail .otherRank-item .value {
	display: inline-block;
	vertical-align: middle;
	margin-left: 12px;
	font-weight: bold;
	position: relative;
	top: 0.1em;
}

.pageRanking .rankingArea .detail .comment {
	margin:5px;
}
.pageRanking .rankingArea .detail .comment .faceBold {
	font-weight:bold;
	font-size:116%;
}


.pageRanking .radarchart {
	margin:5px;
	border:1px solid #EEE;
	height:158px;
	width:200px;
	position:relative;
	box-sizing:border-box;
	float:right;
}
.pageRanking .radarchart canvas {
	margin:15px 35px;
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/rader_bg.png) no-repeat 50% 52%;
	background-size:77%;
}	
.pageRanking .radarchart [class^="label"] {
	position:absolute;
	font-size:63%;
	color:#666;
	width:3em;
	text-align:center;
}
.pageRanking .radarchart .label01 {
	bottom:87%;
	left:0;
	width:100%;
}
.pageRanking .radarchart .label02 {
	top:calc(50% - 1em);
	right:4%;
}
.pageRanking .radarchart .label03 {
	top:88%;
	left:0;	
	width:100%;
}
.pageRanking .radarchart .label04 {
	top:calc(50% - .5em);
	left:4%;
}
.pageRanking .note {
	margin-bottom:30px;
	padding-top:5px;
	font-size:85%;
	text-align:right;
}

.pageRanking .matrixSubInfo {
	margin: 10px;
	font-size:85%;
}
.pageRanking .matrixSubInfo li {
	margin-left:1em;
	text-indent:-1em;
}
.pageRanking .matrixSubInfo li:before {
	content:"・";
}

.pageRanking .catch {
}
.pageRanking .catch .caution {
	color:#666;
	font-size:85%;
}
.pageRanking .catch-arrow {
	position:relative;
	font-weight:bold;
	font-size:162%;
	text-align:center;
}
.pageRanking .catch-arrow span {
	color:#F00;
	font-weight:bold;
}
.pageRanking .catch-arrow:after {
	content:"";
	margin:10px auto -10px;
	border-top:28px solid #F90;
	border-right:90px solid transparent;
	border-bottom:28px solid transparent;
	border-left:90px solid transparent;
	display:block;
	height:56px;
	width:180px;
	box-sizing:border-box;
}
.pageRanking .catch-visual {
	margin-bottom:10px;
	border:1px solid #76C132;
	text-align:right;
}
.pageRanking .catch-visual span {
	padding:15px 0;
	display:block;
	background:#76C132;
	text-align:center;
}
.pageRanking .catch-visual span img {
	vertical-align:top;
}
.pageRanking .catch-visualBox {
	padding:15px 10px;
	background:#EEF9E6 url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/ranking/catch_bg_woman.png) no-repeat 24px bottom;
	text-align:right;
}
.pageRanking .catch-visualBox a {
	display:inline-block;
	font-size:0;
	vertical-align:top;
}
.pageRanking .catch-visualBox a:hover {
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/satei-souba/button_start_hover.png) no-repeat center center;
}
.pageRanking #contentsWrapper .catch-visualBox a:hover img {
	opacity:0;
}


/*----------------------
.comNav
----------------------*/
#nav .comNav {
	margin-bottom:20px;
	padding-bottom:5px;
	border:1px solid #E7E6E3;
	border-radius:4px;
	box-shadow:0px 0px 4px #DBDBDB;
	-ms-filter:progid:DXImageTransform.Microsoft.Shadow(color='#DBDBDB', Direction=180, Strength=4);
	background-color:#FFFFFF;
}

#nav .comNav .title {
	padding:11px 5px 8px 42px;
	border-radius:4px 4px 0 0;
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -1040px -1800px;
	color:#FFF;
	font-size:122%;
	font-weight:bold;
}

#nav .comNav ul {
	margin:0 5px;
	border-bottom:1px dotted #CCC !important;
}

#nav .comNav ul li {
	padding:5px;
	border-bottom:1px solid #FFF !important;
	background:linear-gradient(to bottom,#FFFFFF,#F3F3F3);
	background:-webkit-linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
	-pie-background:linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
	display:block;
	line-height:1;
	vertical-align:bottom;
	position:relative;
}

#nav .comNav ul li a {
	padding:11px 5px 12px 35px;
	display:block;
	color:#333;
	font-weight:bold;
}

#nav .comNav ul li.list,
#nav .comNav ul li.ranking {
	border-top:1px dotted #CCC !important;
}

#nav .comNav ul li.top a {
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
}

#nav .comNav ul li.area a {
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
	letter-spacing: -0.05em;
}

#nav .comNav ul li.list a {
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
}

#nav .comNav ul li.ranking a {
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
}

#nav .comNav ul li a:hover {
	padding:11px 5px 12px 35px;
	border-radius:3px;
	background-color:#999;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
}

#nav .comNav ul li.top a:hover {
	background:#999 url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
}

#nav .comNav ul li.list a:hover {
	background:#999 url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
}

#nav .comNav ul li.ranking a:hover {
	background:#999 url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
}

.pageRanking #nav .comNav ul li.ranking a {
	padding:11px 5px 12px 35px;
	border-radius:3px;
	background:#999 url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/sidenav_icon.gif) no-repeat -773px 6px;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
}


/*----------------------
.pageRanking.type
----------------------*/
.pageRanking.type ol li .detail {
	float:none;
}
.pageRanking.type .detail .star {
	margin:5px;
	display:inline-block;
	vertical-align:middle;
}
.pageRanking.type .detail .otherValue {
	display:inline-block;
	width:200px;
	vertical-align:middle;
	line-height:1.6;
}
.pageRanking.type .linkPoint {
	display:block;
	text-align:right;
}
.pageRanking.type .linkPoint a {
	padding-left:15px;
	background:url(https://img.phoenix.webcrew.co.jp/4160/car-kaitori/images/icon_link.gif) no-repeat left center;
	
}