Font icon does not show

Question

I created a font using the Inkscape app. and then converted it into a site that I don’t remember at the time... while I am using this font in visual studio, the font shows perfectly, as shown in the following image:

however when I publish the project, and run it on the local IIS, it does not show the icone, only the letter. as shown in the following image:

someone knows how I can do to show the icone, as in the first picture?

this is the CSS, using:

@font-face {
    font-family: 'Smc';
    src: url('../fonts/ismc.eot');
    src: url('../fonts/ismc.eot?#iefix') format('embedded-opentype'), url('../fonts/ismc.woff') format('woff'), url('../fonts/ismc.ttf') format('truetype'), url('../fonts/ismc.svg') format('svg');
    src: local('☺'), url('../fonts/ismc.woff') format('woff'), url('../fonts/ismc.ttf') format('truetype');
}

.smc:before {
    content: 'S'
}

.smc:before {
    font-size: 60px;
    font-family: 'Smc';
    font-style: normal;
    color: #114876;
}