(日本的)
@charset 'UTF-8';
/* RESET */
html, body,
div,
ul, ol, li,
dl, dt, dd, td, th,
h1, h2, h3, h4, h5, h6,
p, pre, blockquote, fieldset,
form, input, button, textarea {
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6,
pre, code, address, caption, cite, code,
em, strong, th {
font-size: 1.0em;
font-weight: normal;
font-style: normal;
}
ul, ol, li {
list-style: none;
}
fieldset, img {
border: none;
}
img {
-ms-interpolation-mode: bicubic;
}
caption, th {
text-align: left;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
input,textarea,select {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
}
input,textarea,select {
*font-size: 100%;
}
button {
background-color: transparent;
text-decoration: none;
}
label {
cursor: pointer;
}
/* IEPNGFIX */
img { behavior: url(lib/iepngfix.htc); }
/* ELEMENT */
body {
clear: both;
background-color: #ffffff;
text-align: center;
color: #333;
font-size: 12px;
font-weight: normal;
font-style: normal;
line-height: 1.6em;
font-family :
Meiryo,
'メイリオ',
'Lucida Grande',
Verdana,
'Hiragino Kaku Gothic Pro',
'ヒラギノ角ゴ Pro W3',
'MS Pゴシック',
"MS P Gothic",
sans-serif;
}
body div {
text-align: left;
}
a {
color: #006DBE;
font-weight: normal;
font-style: normal;
text-decoration: none;
}
a:link, a:visited, a:active {
text-decoration: none;
}
a:active,
a:focus {
outline:none;
}
a:hover {
color: #15A7E7;
text-decoration: underline;
cursor: pointer;
}
strong, b {
font-weight: bold;
}
em, i {
font-style: italic;
}
/* Default Class */
.left {
float: left;
}
.right {
float: right;
}
.center {
text-align: center;
}
.text-right {
text-align: right;
}
.text-left {
text-align: right;
}
.image-left {
float: left;
padding: 0 10px 10px 0;
}
.image-right {
float: right;
padding: 0 10px 0 10px;
}
.clear {
clear: both;
}
.display-none {
display: none;
}
.hidden {
visibility: hidden;
}
.red {
color: #c7003b;
}
.strong,
.bold {
font-weight: bold;
}
.vAlign-middle {
display: table-cell;
vertical-align: middle;
}
* html .vAlign-middle {
display: inline;
zoom: 1;
}
*+html .vAlign-middle {
display: inline;
zoom: 1;
}
/* <a href="#" class="tooltip">Tooltip<span>This is the crazy little Easy Tooltip Text.</span></a> */
a.tooltip span {
display: none;
padding: 5px;
margin-left: 8px;
width: 130px;
}
a.tooltip:hover span {
display: inline;
position: absolute;
background: #ffffff;
border: 1px solid #cccccc;
color: #6c6c6c;
}
.image-resize {
max-width: 200px;
max-height: 200px;
}
* html body .image-resize {
width: expression(this.width >= this.height ? "200px" : "auto");
height: expression(this.width <= this.height ? "200px" : "auto");
}
*+html body .image-resize {
width: expression(this.width >= this.height ? "200px" : "auto");
height: expression(this.width <= this.height ? "200px" : "auto");
}
/* <a href="#" class="image-zoom"><img src="sample.jpg" /></a> */
a.image-zoom img {
max-width: 100px;
max-height: 100px;
}
* html body a.image-zoom img {
width: expression(this.width >= this.height ? "100px" : "auto");
height: expression(this.width <= this.height ? "100px" : "auto");
}
*+html body a.image-zoom img {
width: expression(this.width >= this.height ? "100px" : "auto");
height: expression(this.width <= this.height ? "100px" : "auto");
}
a.image-zoom:hover img {
max-width: 200px;
max-height: 200px;
}
* html body a.image-zoom:hover img {
width: expression(this.width >= this.height ? "200px" : "auto");
height: expression(this.width <= this.height ? "200px" : "auto");
}
*+html body a.image-zoom:hover img {
width: expression(this.width >= this.height ? "200px" : "auto");
height: expression(this.width <= this.height ? "200px" : "auto");
}