/*=================================================
 * CSS for PC
 * ================================================= */

main{
	padding-bottom: 10px;
}


/** companion **/

#companion{
	width: 1060px;
	margin:0 auto;
	text-align: left;
}

#companion ul{
	font-size: 0;
	line-height: 0;
}

#companion li{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 244px;
	margin: 0 10px 20px 10px;
}
#companion li:after{
	content: '';
	width: calc(100% - 20px);
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	position: absolute;
	top: 346px;
	left: 10px;
}

#companion .photo{
	border-width: 1px;
	border-style: solid;
}

#companion .prof{
	font-size: 12px;
	line-height: 22px;
	text-align: center;
	padding: 3px 0;
}

#companion .prof .sp{	display: none;}

#companion .icon{
	position: absolute;
	top: 284px;
	left: 204px;
}

#companion .icon img{
	width: 35px;
	height: auto;
}

/*=================================================
 * CSS for SP
 * ================================================= */

@media screen and (max-width: 650px) {
	main{
		padding-bottom: 0;
	}

	/** companion **/
	#companion{
		width: 100%;
		text-align: left;
		padding: 0 1.5px 0 1.5px;
	}
	#companion ul{	padding: 0;}
	#companion li{
		width: calc(100% / 2 - 3px);
		height: auto;
		margin: 0 1.5px 10px 1.5px;
	}
	#companion li:after{	display: none;}
	#companion li:nth-of-type(4n){	margin-right: 1.5px;}
	#companion .photo{
	}
	#companion .photo img{
		width: 100%;
		height: auto;
	}
	#companion .prof{
		font-size: 11px;
		line-height: 14px;
		padding: 2px 0;
	}
	#companion .prof a{	font-size: 12px;}
	#companion .prof .sp{	display: inline;}
	#companion .prof .pc{	display: none;}
	#companion .icon{
		position: absolute;
		top: auto;
		left: auto;
		bottom: 49px;
		right: 2px;
	}
	#companion .icon img{
		width: 25px;
		height: auto;
	}
}