@charset "utf-8";

	.env_icon{
		margin-top: 2em;
		margin-bottom: 2em;
		padding-left: 0.5em;
	}
	.env_icon li {
		margin-bottom: 1.25em;
	}
	.env_icon li a{
		position: relative;
		display: block;
		box-sizing: border-box;
		line-height: 1.4em;
		margin-bottom: 1em;
		padding: 0.6em 0.5em 0.6em 3.5em;
		color: rgb(85, 85, 85);
		font-size: 1rem;
		font-weight: bold;
		border-radius: 0.25em;
		background: #fff;
		box-shadow: 0 0 1px 1px rgba(230, 230, 230, 1);
		transition: all 0.3s;
		word-break: keep-all;
		text-indent: -1em;
	}



	.env_icon li a::before,
	.env_icon li a::after
	{
		content: '';
		position: absolute;
		display: inline-block;
		box-sizing: border-box;
		top: -0.28em;
		left: calc(0.28em - 1em);
		width: 3em;
		height: 3em;
		border-radius: 50%;
		border: 0.28em solid #88aa00;
		box-shadow: 0 0 0rem 0.28em #fff;
		background: left center url(../products/images/green.svg) #fff no-repeat;
		background-size: contain;
		z-index: 5;
	}


	.env_icon li.for_member a::before,
	.env_icon li.for_member a::after
	{
		border: 0.28em solid rgb(1, 112, 193);
		background: left center url(../products/images/green_blue.svg) #fff no-repeat;
	}

	.env_icon li a::after,
	.env_icon li.for_member a::after
	{
		content: '';
		top: calc( -0.28em * 2);
		left: -1em;
		border: 0 solid #fff;
		background:  rgba(255, 255, 255, 1);
		width: calc(3em + 0.28em + 0.28em);
		height: calc(3em + 0.28em + 0.28em);
		box-shadow: 0 0 1px 1px rgba(230, 230, 230, 1);
		border-radius: 50%;
		z-index: -3;
	}



	.env_icon li a:hover
	{
		background-color: #f3faec;
		text-decoration: none;
	}

	.env_icon li a:hover::before
	{
		background-color: #f3faec;
		box-shadow:  0 0 0rem 0.28em #f3faec;
	}

	.env_icon li.for_member a:hover
	{
		background-color: rgb(244, 250, 255);
		text-decoration: none;
	}

	.env_icon li.for_member a:hover::before
	{
		background-color: rgb(244, 250, 255);
		box-shadow:  0 0 0rem 0.28em rgb(244, 250, 255);
	}

	.env_icon li.for_member a span
	{
		font-size: 0.9em;
	}