最初に指定しておくCSSをさらに修正しました。

修正したCSSは後述しますが、少しだけ解説しますと、今回追加したのは以下の部分です。

input, textarea, select {
font-size: 1em;
}

これはInternet Explorer（IE）のバグ（?）に関するものです。

通常IEでは本文のフォントサイズに関わらず、inputやtextarea内で同じ大きさで文字が表示されてしまいます。これだと、例えば、ユーザーがメールフォームなどを入力するときに文字を通常より大きくしたり、小さくしたりしたいと考えてもできず、とても不親切です。これを上のように、1em（1文字のサイズ）に指定しておくことで、IEでも問題なく文字サイズが変更できるようになります。

ということで、以下、修正したCSSです。

/* =reset
----------------------------------*/

body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,pre,form,
fieldset,legend,input,textarea,
p,blockquote,table,caption,
tbody,tfoot,thead,th,td,option{
margin:0;
padding:0;
}

table{
border-collapse:collapse;
border-spacing:0;
}

fieldset,img,
abbr,acronym{
border:0;
}

address,caption,cite,
code,dfn,th,var,
optgroup,strong,em,b,i{
font-style:normal;
font-weight:normal;
}

ol,ul{
list-style:none;
}

caption,th{
text-align:left;
}

h1,h2,h3,h4,h5,h6{
font-size:100%;
font-weight:normal;
}

q:before,q:after{
content:'';
}

a,ins,del{
text-decoration: none;
}

img{
vertical-align: bottom;
}

object,embed,th,td{
vertical-align: top;
}

input, textarea, select {
font-size: 1em;
}

/* =common
----------------------------------*/

body{
font-size: 12px;
font-family: font-family: Arial, Helvetica, Verdana, Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

* html body{
font-size: 75%;
}

*+html body{
font-size: 75%;
}

html{
overflow: scroll;
overflow: -moz-scrollbars-vertical;
overflow-x: scroll;
}

.fR{float: right;}
.fL{float: left;}
.cl{clear: both;}

/* =clearfix
----------------------------------*/

.clearfix:after{
content:".";
display:block;
visibility:hidden;
height:0.1px;
font-size:0.1em;
line-height:0;
clear:both;
}

.clearfix{
display:inline-block;
}

/* MacIE begin \*/
*+html .clearfix{
height:1%;
}

* html .clearfix{
height:1%;
}

.clearfix{
display: block;
}
/* Mac IE end */