@charset "UTF-8";





/* ========BASIC======== */

body {

    margin:0;

    padding:0;

    background:#eee;

}



a {

    color:#369;

    text-decoration:none;

}



a:hover {

    color:#963;

    background: #eee;

    /*   text-decoration:underline; */

}



img {

    margin: 5px;

}





/* ========LAYOUT======== */



div#topbox {

/*    width:1024px; */

    margin:0 auto;

}



div#header {

    margin: 0px 0 0 0;

    padding: 30px 0 30px 30px;

    float:left;

    width:100%;

    position:relative;

/*  font-family: ‘Metrophobic’, Arial, serif; */

    font-family:"Hiragino Kaku Gothic Pro",HiraKakuPro-W3,"ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"MS P ゴシック",verdana,sans-serif;

    font-weight: 400;

    background:#666;

    border-right: solid 1px #ddd;

    border-bottom: solid 3px #aaa;

}



div#menu {

    background:#fff;

    float:left;

    width:100%;

    margin-top:0px;

    border-bottom: solid 1px #ddd;

    border-left: solid 1px #ddd;

    border-right: solid 1px #ddd;

    font-family: ‘Metrophobic’, Arial, serif;

    font-weight: 600;

}



div#contentsbox {

    margin:0;

    float:left;

    width:100%;

    background:#fff;

    border-left: solid 1px #ddd;

    border-right: solid 1px #ddd;

}





div#contents {

    margin:30px;

    float:left;

    width:90%;

    background:#fff;

    font-family:"Hiragino Kaku Gothic Pro",HiraKakuPro-W3,"ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"MS P ゴシック",verdana,sans-serif;

    font-size: 80%;

    color: #555;

}





div#footer {

    width:100%;

    font-family: ‘Metrophobic’, Arial, serif;

    font-weight: 400;

    font-size: 70%;

    color:#666;

    text-align: center;

}





div#contents hr {

    margin: 20px 80px 40px 0px;

}



div#contents h2 {

    margin-top:30px;

    margin-bottom:8px;

    line-height:1.3;

    font-size:100%;

    color:#444;

    border-bottom:1px dotted #aaa;

    

}



div#contents h3 {

    margin-top:30px;

    margin-bottom:8px;

    line-height:1.3;

    font-size:88%;/* 14px相当 */

    color:#444;

}













/* ========HEADER======== */

div#header h1 {

    margin: 0;

    padding:0;

    font-size:200%;

    font-weight: 700;

    color:#fff;

}



div#header h2 {

    margin-top: -2px;

    font-size: 100%;

    color:#fff;

}



div#header p {

    font-size: 70%;

    font-weitht: 300;

    font-style: italic;

    color:#fff;

}





/* ========MENU======== */

div#menu ul {

    margin: 0;

    padding:0;

    font-size:80%;

    list-style:none;

}



div#menu li {

    overflow:hidden;

    float:left;

    margin:0;

    padding:0;

    border: none;

    background:#fff;

}



div#menu li a {

    display:block;

    width:125px;

    padding:10px 0;

    text-align:center;

    outline:none;

    color:#666;

}



div#menu li a:hover {

    color:#fff;

    background:#aaa;

}



/* ========CONTENTS======== */

div#contents ul {

    margin:0;

}



div#contents li {

    margin: 5px 0 5px 0;

}



/* =================================== */

/* =================================== */

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

 * FONTSIZE MODEL *

 * ---------------------

 *  63% ->	10pxに相当

 *  70% ->	11pxに相当

 *  75% ->	12pxに相当

 *  82% ->	13pxに相当

 *  88% ->	14pxに相当

 *  94% ->	15pxに相当

 * 100% ->	16pxに相当

 * 107% ->	17pxに相当

 * 113% ->	18pxに相当

 * 119% ->	19pxに相当

 * 125% ->	20pxに相当

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

/* =================================== */