@charset "UTF-8";
/*-------------------------
-------------------------*/
.clearfix:after{
content    : ".";    /* <- 1.cssの疑似要素afterを使って親要素の後に新たに要素を追加。 */
display    : block;  /* <- 2.追加した要素をblock要素に */
clear      : both;   /* <- 3.cler: both;を適用。 */
height     : 0;      /* <- 4.後に続く部分のレイアウトに影響しない様、heghtを0に。 */
visibility : hidden; /* <- 5.追加した要素を非表示に。 */
}

.clearfix {
min-height:1px; /* <- 6.:afterが効かないIEでは、要素の幅か高さを指定すると、floatした子要素の高さも含めるバグを利用。 */


}

* html .clearfix {
height   : 1px;   /* <- 7.ただし、IE6以前ではmin-heightを利用できないので、親要素の高さが、内包する子要素の高さに押し広げられるバグを 利用。 */
/*\*//*/          /* <- 8.さらに、MacIE4,5のための記述も追加。 */
height   : auto;
overflow : hidden;
/**/
}

/*-------------------------
-------------------------*/

* {
    margin  : 0;
    padding : 0;
}

body {
    font-family         : monospace;
    font-size           : medium;
    text-align          : center;
    color               : #333;
    background-color    : #fff;
background-image    : url('../img/bg.png');
background-position : 0 0;
background-repeat   : repeat;
}

div, p, img, a, td, ul, ol {
    font-size : 100%; 
}

ol {
    margin-left  : 1em;
    padding-left : 1em;
}

ol li {
    margin-left : 1em;
    padding     : 0 0 0.5em 0.3em;
    list-style  : decimal;
}

h1, h2, h3, h4 {
font-family : monospace;
}

h1 { font-size: 218%; }
h2 { font-size: 164%; }
h3 { font-size: 145%; }
h4 { font-size: 118%; letter-spacing: .15em }

p { padding: 0 0 0.5em; }

a, a:link { 
    text-decoration : none;
    color           : #69c;
    /*
border-bottom   : 1px dotted #69c;
*/
}

a:visited { color: #669; border-color: #669; }
a:hover   { color: #693; border-color: #693; text-decoration: none; }
a:active  { color: #c33; border-color: #c33; }

a img, img {
    border : none;
}

ul {
    list-style : none;
    margin     : 0 0 20px 1em;
}

li {
    list-style    : none;
    padding-left  : 0em;
    margin-bottom : 3px;
}

body div#main {
width            : 924px;
margin           : 0px auto;
background-color : #fff;
padding          : 0;
/*
border-left  : 2px solid #6cf;
border-right : 2px solid #6cf;
*/
}

/*-------------------------
-------------------------*/
.floatLeft{
float : left;
}

.floatRight{
float : right;
}

/*-------------------------
-------------------------*/

.alignLeft   { text-align:left;       }
.alignCenter { text-align:center;     }
.alignRight  { text-align:right;      }
.alignTop    { vertical-align:top;    }
.alignMiddle { vertical-align:middle; }
.alignBottom { vertical-align:bottom; }

/*-------------------------
-------------------------*/

.colorHeader     { background-color:#143F90; }
.colorNavigation { background-color:#F2F8E7; }
.colorHelpButton { background-color:#FF5B00; }
.colorMsg        { background-color:#F0EFEF; }
.colorOdd        { background-color:#ffffff; }
.colorEven       { background-color:#F1F5FA; }

/*-------------------------
-------------------------*/

.widthAuto  { width:auto;  }
.width100   { width:100%;  }
.width20    { width:20%;   }
.width40    { width:40%;   }
.width50    { width:50%;   }
.width60    { width:60%;   }
.width80    { width:80%;   }
.width900px { width:900px; }
.width880px { width:880px; }
.width800px { width:800px; }
.width500px { width:500px; }