@charset "utf-8";

/*
************************************************************************
* タイトル
* @copyright Revolme Inc.
************************************************************************
*/

/*
************************************************************************
* コンテンツアンカー
************************************************************************
*/
#title .contents-anchor
{
	width:1120px;
	margin-top:50px;
	margin-left:auto;
	margin-right:auto;
}
#title .contents-anchor ul
{
	margin:0px;
	padding:0px;
	list-style:none;
}
#title .contents-anchor ul li
{
	display:block;
	float:left;
	width:23%;
	margin:0px;
	padding:0px;
}
#title .contents-anchor ul li a
{
	display:block;
	text-align:center;
	border:1px solid #e08c33;
	color:#000000;
}
#title .contents-anchor ul li a::before
{
	content:"";
	display:block;
	position:absolute;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	width:0%;
	height:100%;
	background-color:#e08c33;
	
	transition-duration:0.3s;
	transition-property:width;
	transition-timing-function:ease;
}
#title .contents-anchor ul li a::after
{
	content:"";
	display:block;
	position:absolute;
	top:50%;
	right:1.0em;
	
	width:0px;
	height:0px;
	
	border:0.5em solid transparent;
	border-top:0.5em solid #e08c33;
}
#title .contents-anchor ul li a > span
{
	display:inline-block;
	padding:0.7em;
}
#title .contents-anchor ul li a:hover
{
	text-decoration:none;
	color:#FFFFFF;
}
#title .contents-anchor ul li a:hover::before
{
	width:100%;
}
#title .contents-anchor ul li a:hover::after
{
	border-top:0.5em solid #FFFFFF;
}

/* == タブレットサイズ ==========================================================*/
@media screen and (max-width: 1200px) {
}
/* == スマートフォンサイズ ==========================================================*/
@media screen and (max-width: 640px) {
	#title .contents-anchor
	{
		width:100%;
		padding-left:6.25vw;
		padding-right:6.25vw;
		margin-top:5.46875vw;
	}
	#title .contents-anchor ul
	{
	}
	#title .contents-anchor ul li
	{
		width:48%;
	}
	#title .contents-anchor ul li a
	{
		font-size:0.8em;
	}
	#title .contents-anchor ul li a::before
	{
	}
	#title .contents-anchor ul li a::after
	{
	}
	#title .contents-anchor ul li a > span
	{
	}
	#title .contents-anchor ul li a:hover
	{
	}
	#title .contents-anchor ul li a:hover::before
	{
	}
	#title .contents-anchor ul li a:hover::after
	{
	}
}

