/* select style */
.form-select {
	$size: lg;
	width: 100%;
	height: var(--#{$prefix}select-h-#{$size});
	padding: var(--#{$prefix}select-pd-#{$size});
	background-color: var(--#{$prefix}white);
	background-image: url(#{$url}/component/common/ico_select_#{$size}.svg);
	background-repeat: no-repeat;
	background-position: center right var(--#{$prefix}select-rn-#{$size});
	border: 1px solid var(--#{$prefix}gray-60);
	border-radius: var(--#{$prefix}select-rd-#{$size});
	font-family: inherit;
	font-size: var(--#{$prefix}select-fz-#{$size});;
	color: var(--#{$prefix}gray-90);
	opacity: 1;
	&:focus {
		border-color: var(--#{$prefix}primary);
		border-width: 2px;
		outline-offset: -.5rem;
	}
	&[disabled] {
		background-color: var(--#{$prefix}gray-30);
		border-color: var(--#{$prefix}gray-40);
		color: var(--#{$prefix}gray-60);
	}
	&.error {
		border-color: var(--#{$prefix}point);
		border-width: 2px;
	}
}

.is-error {
	.form-select {
		border-color: var(--#{$prefix}point);
		border-width: 2px;
	}
}