/* common
----------------------------------------------- */
body {
background-image: url(../images/bg.gif);
background-repeat: repeat;
margin:0;
padding:0;
}

#page{
width:900px;
margin:0 auto;
padding:0;
background-color:#FFFFFF;
}

#page:after{
content:".";
display:block;
clear:both;
height:0;
visibility:hidden;
}

.header{
margin:0;
padding:0;
}

#main{
width:680px;
margin:0;
padding:0;
float:left;
background-color:#FFFFFF;
}

#right{
width:210px;
float:left;
margin:0 0 10px 0;
padding:0;
background-color:#FFFFFF;
}

h1{
background: url(../images/h2wide.gif) no-repeat;
width:860px;
height:25px;
font-size:14px;
font-weight:bold;
padding:3px 0 0 20px;
margin:0 0 0 20px;
}

h2{
background: url(../images/h2.gif) no-repeat;
width:660px;
height:25px;
font-size:14px;
font-weight:bold;
padding:3px 0 0 20px;
margin:0 0 0 10px;
}

/* right
----------------------------------------------- */
#search-area {
width:205px;
height:355px;
padding-top:10px;
background:url(../images/search-bg.gif) no-repeat;
}

#search-area{
font-size:75%;
}

#search-area .search-title{
width:190px;
margin:5px auto 0 auto;
text-align:center;
font-weight:bold;
}


#search-area table.search-menu, #search-area form{
margin:0;
padding:0;
line-height:150%;
}

#search-area table.search-menu input, #search-area table.search-menu select{
margin:1px 0;
font-size:12px;
}

#howto-area{
width:100px;
margin:0 auto;
}

#howto-area a{
display:block;
text-indent:-9999px;
overflow:hidden;
height:25px;
}

#howto-area a.howto{
background:url(../images/use.gif) no-repeat;
}

#howto-area a:hover.howto{
background:url(../images/use.gif) no-repeat 0 -25px;
}

/* form
----------------------------------------------- */
form.login, form.passsend{
width:500px;
height:200px;
border:1px solid #333333;
background-color:#EFEFEF;
margin:10px auto 30px auto;
}

form table.search, form.login table{
margin:30px 0 0 0;
font-size:14px;
}

form.passsend table{
margin:10px 0 0 0;
font-size:14px;
}

form table th{
font-weight:normal;
}

.loginbutton{
width:150px;
height:30px;
margin:15px 0 0 100px;
}

.forget{
font-size:12px;
text-align:center;
margin:20px 0 0 0;
}

.info{
width:420px;
font-size:14px;
margin:0 auto 10px auto;
}

.text{
width:800px;
font-size:14px;
line-height:150%;
margin:10px auto 30px auto;
}

ul.text-list{
width:800px;
font-size:14px;
list-style:disc inside;
}

ul.text-list li{
margin:0 0 30px 10px;
line-height:150%;
}


.tosearch input{
width:250px;
margin:20px 0 0 300px;
height:40px;
}

/* width
----------------------------------------------- */
.w90per{
width:90%;
}

.w180{
width:180px;
}

.w120{
width:120px;
}

.w100{
width:100px;
}

.w60{
width:60px;
}

.w30{
width:30px;
}

/* download
----------------------------------------------- */
.dl-button a{
display:block;
text-indent:-9999px;
overflow:hidden;
width:100px;
height:25px;
}

.dl-button a.dl{
background:url(../images/dl.gif) no-repeat;
}

.dl-button a:hover.dl{
background:url(../images/dl.gif) no-repeat 0 -25px;
}



/* change
----------------------------------------------- */
.chg-button a{
display:block;
text-indent:-9999px;
overflow:hidden;
width:100px;
height:25px;
}

.chg-button a.dl{
background:url(../images/chg.gif) no-repeat;
}

.chg-button a:hover.dl{
background:url(../images/chg.gif) no-repeat 0 -25px;
}

/* search
----------------------------------------------- */
.condition{
border:1px solid #999999;
width:620px;
margin:10px auto;
padding:5px;
font-size:80%;
}

.search_page{
border:1px solid #9ACD32;
background-color:#CCFF99;
width:610px;
margin:5px auto 10px 10px;
font-size:90%;
height:25px;
padding:7px 10px 0 20px;
}

.search_page span{
margin:0 0 0 10px;
}

/* magazin
----------------------------------------------- */
.maga-list{
width:640px;
font-size:12px;
margin:5px 0 10px 10px;
border-bottom:1px dotted #333333;
padding:0 0 13px 0;
clear:both;
}

.maga-list .title{
font-size:14px;
font-weight:bold;
width:610px;
margin:5px 0 0 10px;
padding:0 0 0 10px;
border-bottom:1px solid #333333;
border-left:10px solid #333333;
}

.maga-list .gaiyou{
margin:20px 0 0 20px;
width:450px;
float:left;
line-height:160%;
}

.maga-list .gaiyou span{
font-size:14px;
}

.maga-list .dl-button{
margin:20px 0 0 20px;
float:left;
}
.maga-list .chg-button{
margin:100px 0 0 20px;
float:right;
}

.maga-list:after{
content:".";
display:block;
clear:both;
height:0;
visibility:hidden;
}

.maga-list .dl-button img, .maga-detail .dl-button img{
border:0;
}

.maga-list .list-img{
width:140px;
height:190px;
float:left;
margin:10px 0 0 10px;
}

.maga-detail{
width:600px;
font-size:12px;
margin:10px 0 0 20px;
}


.maga-detail .title{
font-size:14px;
font-weight:bold;
width:580px;
margin:20px 0 0 0;
padding:0 0 0 10px;
border-bottom:1px solid #333333;
border-left:10px solid #333333;
clear:both;
}

.maga-detail .detail-img{
width:140px;
height:190px;
float:left;
margin:10px 0 20px 10px;
}

.maga-detail .gaiyou{
margin:10px 0 10px 10px;
width:390px;
float:left;
}

.maga-detail .dl-button{
margin:10px 0 30px 10px;
float:left;
}

.maga-detail:after{
content:'';
clear:both;
display: block;
margin-bottom:1rem;
}

.display{
width:500px;
font-size:12px;
margin:0 0 10px 25px;
}

/* kanri
----------------------------------------------- */
#kanri-area {
width:205px;
height:355px;
padding-top:10px;
background:url(../images/kanri-bg.gif) no-repeat;
}

#kanri-area{
font-size:75%;
}

#kanri-area .kanri-title{
width:190px;
margin:5px auto 0 auto;
text-align:center;
font-weight:bold;
}

#kanri-area ul.kanri-menu{
width:170px;
margin:20px 0 0 0px;
padding:0 0 0 30px;
list-style-image: url(../images/chapter.gif); 
}

#kanri-area ul.kanri-menu li{
margin:0 0 15px 0;
padding:0 0 0 10px;
}

.let-red{
color:#cf0000;

}

.old{
background-color:#eeeeee;
}