<div class="cp_iptxt">
<input type="text" placeholder="お名前">
<i class="fa fa-user fa-lg fa-fw" aria-hidden="true"></i>
</div>
<div class="cp_iptxt">
<input type="text" placeholder="E-Mail">
<i class="fa fa-envelope fa-lg fa-fw" aria-hidden="true"></i>
</div>
.cp_iptxt {
position: relative;
width: 27.33%;
margin: 40px 3%;
}
.cp_iptxt input[type='text'] {
font: 15px/24px sans-serif;
box-sizing: border-box;
width: 100%;
padding: 0.3em;
padding-left: 40px;
letter-spacing: 1px;
border: 0;
}
.cp_iptxt input[type='text']:focus {
outline: none;
}
.cp_iptxt input[type='text']:focus::after {
outline: none;
}
.cp_iptxt i {
position: absolute;
top: 0;
left: 0;
padding: 9px 5px;
transition: 0.3s;
color: #aaaaaa;
}
.cp_iptxt::after {
display: block;
width: 100%;
height: 4px;
margin-top: -1px;
content: '';
border-width: 0 1px 1px 1px;
border-style: solid;
border-color: #da3c41;
}