@charset "UTF-8";

@keyframes fill-select-frames
{
	from
	{
		opacity: 0;
	}
	to
	{
		opacity: 1;
	}
}

/********************/
/* fill-select      */
/********************/
.fill-select
{
	display: table;
	position: relative;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	user-select: none;
}
.sp-content .fill-select
{
	display: block;
	height: 100%;
}

/********************/
/* fill-select-main */
/********************/
.fill-select .fill-select-main
{
	display: table-cell;
	position: relative;
	width: 100%;
	height: 100%;
	color: #000;
	background-color: #FFF;
	border: solid 1px #767676;
	text-align: left;
	padding-left: 15%;
	padding-right: 15px;
	vertical-align: middle;
}
.fill-select .fill-select-main::after
{
	position: absolute;
	top: 45%;
	right: 5px;
	width: 0px;
	content: "";
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	border-top: 5px solid #666;
	pointer-events: none;
}

.sp-content .fill-select .fill-select-main
{
	position: relative;
	background-color: #FFF;
	border: solid 1px #767676;
	text-align: left;
	padding-left: 15%;
	padding-right: 15px;
	vertical-align: middle;
}


/********************/
/* fill-select-list */
/********************/
.fill-select .fill-select-list
{
	display: none;
	position: absolute;
	width: 100%;
	min-width: 120px;
	color: #000;
	box-shadow: 2px 2px 6px 2px rgba(0, 0, 0, 0.4);
	z-index: 10;
}
.fill-select .fill-select-list.opened
{
	display: table;
	animation: fill-select-frames 0.1s linear 0s;
	box-sizing: border-box;
}

/********************/
/* fill-select-row  */
/********************/
.fill-select .fill-select-list .fill-select-row
{
	display: table-row;
	background-color: #EAEAED;
}
.fill-select .fill-select-row:not(:first-of-type)
{
	border-top: solid 1px #D0D0D3;
}

/********************/
/* fill-select-item */
/********************/
.fill-select .fill-select-list .fill-select-item
{
	display: table-cell;
	height: 30px;
	text-align: left;
	padding-left: 15%;
	vertical-align: middle;
}
.fill-select .fill-select-list .fill-select-item:hover
{
	color: #FFF;
	background-color: #477EEB;
}
.sp-content .fill-select .fill-select-list .fill-select-item
{
	height: 40px;
}
