/* 공통 베이스 클래스 */
.wi {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;  /* 글자색을 따라감 */
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    vertical-align: -0.125em;  /* 텍스트 baseline 정렬 */
}

/* 개별 아이콘 */
.wi-distance {
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg width='16' height='15' viewBox='0 0 16 15' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M2.16699 11.1364C3.09332 11.1365 3.83291 11.8954 3.83301 12.818C3.83301 13.7406 3.09338 14.4995 2.16699 14.4996C1.24045 14.4996 0.5 13.7407 0.5 12.818C0.500095 11.8953 1.24051 11.1364 2.16699 11.1364Z' stroke='black'/><path d='M13.8337 0.5C14.7601 0.500178 15.4997 1.25909 15.4998 2.18164C15.4998 3.10427 14.7601 3.8631 13.8337 3.86328C12.9072 3.86328 12.1667 3.10438 12.1667 2.18164C12.1668 1.25898 12.9073 0.5 13.8337 0.5Z' stroke='black'/><path d='M3.33325 12.8181C10.3333 12.8181 5.66659 2.18176 12.6666 2.18176' stroke='black'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg width='16' height='15' viewBox='0 0 16 15' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M2.16699 11.1364C3.09332 11.1365 3.83291 11.8954 3.83301 12.818C3.83301 13.7406 3.09338 14.4995 2.16699 14.4996C1.24045 14.4996 0.5 13.7407 0.5 12.818C0.500095 11.8953 1.24051 11.1364 2.16699 11.1364Z' stroke='black'/><path d='M13.8337 0.5C14.7601 0.500178 15.4997 1.25909 15.4998 2.18164C15.4998 3.10427 14.7601 3.8631 13.8337 3.86328C12.9072 3.86328 12.1667 3.10438 12.1667 2.18164C12.1668 1.25898 12.9073 0.5 13.8337 0.5Z' stroke='black'/><path d='M3.33325 12.8181C10.3333 12.8181 5.66659 2.18176 12.6666 2.18176' stroke='black'/></svg>");
}