/* ****************************************************************
styles-site.css （ダイナースカード）
2008/06/10 - 2008/06/16
**************************************************************** */

/* 初期化、一般要素
---------------------------------------------------------------- */
body, h1, h2, h3, h4, h5, h6,
p, ul, ol, dl, dt, dd, li, table, th, td,
form, select, option, address, pre,
strong, em, caption, cite, code, dfn, var {
    font-size: 100%;
    font-style: normal;
    font-weight: normal;
    margin: 0;
    padding: 0;
    text-decoration: none;
}

img {
    border: 0;
    background-color: transparent;
    vertical-align: bottom;
}

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

ol, ul { list-style: none; }

strong { font-weight: bold; }
em { color: #f00; font-style: normal; }
span { background: #ff6; }

p { margin: 0 }

a {
    color: #00f;
    outline: 0;
    text-decoration: underline;
}

a:hover {
    text-decoration: underline;
}

a:link {  }
a:visited {  }
a:active {  }


/* body, wrapper, container
---------------------------------------------------------------- */
body {
    font-size: 13px;
    font-family: ＭＳ Ｐ ゴシック;
    line-height: 1.4em;
    background: #f6f6ff;
}

div#wrapper {
    margin: 0 auto;
    padding: 0;
    text-align: center;
    width: 770px;
    border: 0;
    background: url(./image/shadow.gif);
}

div#container {
    margin: 0 auto;
    padding: 0;
    text-align: left;
    width: 750px;
    border: solid 1px #999;
    border-top: 0;
    background: #fff;
}


/* header
---------------------------------------------------------------- */
div#header {
    width: 750px;
    height: 90px;
    margin: 0;
    padding: 0;
    background: #ccf url(./image/header.jpg);
    position: relative;
}

div#header h1 {
    font-size: 13px;
    padding-left: 10px;
    line-height: 18px;
    color: #666;
}

div#header h1 a {
    color: #666;
    text-decoration: none;
}

div#header h1 a:hover {
}

div#header div#banner {
    position: absolute;
    width: 468px;
    height: 60px;
    top: 20px;
    right: 15px;
    background: #fff;
}


/* pageBody, content
---------------------------------------------------------------- */
div#pageBody {
    width: 750px;
    margin: 0;
    padding: 20px 0 15px 0;
}

div#content {
    width: 690px;
    margin :0;
    padding: 0 30px;
}


/* content内　lead, outline
---------------------------------------------------------------- */
div#lead {
    width: 688px;
    margin: 10px 0 15px 0;
    padding: 0;
    border: solid 1px #999;
}

div#lead div#capture {
    width: 100px;
    padding: 20px;
    float: left;
}

div#lead div#desc {
    width: 528px;
    margin: 0;
    padding: 10px;
}

div#lead div#desc h2 {
    padding: 2px 5px;
    font-size: 110%;
    font-weight: bold;
    background: #f60;
    color: #fff;
}

div#lead div#desc ul.check {
    padding: 10px 0 5px 15px;
}

div#lead div#desc ul.check li {
    padding: 8px 0 5px 25px;
    font-weight: bold;
    background: url(./image/check.gif) top left no-repeat;
}


div#lead p.right {
    text-align: right;
    padding: 0 10px;
}


div#outline {
    width: 690px;
}

div#outline p {
    padding: 10px 0;
}

div#outline ul {
    list-style: inside disc;
}

div#outline table {
    width: 100%;
    border: solid 1px #999;
}

div#outline table th {
    text-align: center;
    font-weight: bold;
    border-bottom: solid 1px #999;
    border-right: dotted 1px #999;
    background: #ccf;
}

div#outline table th.w10 {
    width: 10%;
}

div#outline table th.w15 {
    width: 15%;
}

div#outline table th.w20 {
    width: 20%;
}
div#outline table th.w25 {
    width: 25%;
}

div#outline table td {
    padding: 0 5px;
    border-bottom: solid 1px #999;
    border-right: dotted 1px #999;
}


/* content内　ranking
---------------------------------------------------------------- */
div#ranking {
    width: 690px;
    margin: 20px 0 20px 0;

}

div#ranking h3 {
    padding: 5px 0;
    font-size: 120%;
    font-weight: bold;
}

div#ranking div.ranking_each {
    width: 688px;
    margin: 5px 0;
    border: solid 1px #ccc;
    clear: both;
}

div#ranking div.ranking_each div.rank {
    width: 80px;
    float: left;
}

div#ranking div.ranking_each div.capture {
    width: 100px;
    float: left;
    padding: 10px 20px;
}

div#ranking div.ranking_each div.desc {
    width: 443px;
    padding: 5px 10px 10px 5px;
}

div#ranking div.ranking_each div.desc h4 {
    font-size: 110%;
    font-weight: bold;
    padding: 0 0 5px 0;
}

div#ranking div.ranking_each div.desc ul.check {
    padding: 5px 0 5px 5px;
}

div#ranking div.ranking_each div.desc ul.check li {
    padding: 5px 0 5px 25px;
    font-weight: bold;
    background: url(./image/check.gif) top left no-repeat;
}

div#ranking div.ranking_each div.desc div.button {
    padding: 5px 0 0 0;
    position: relative;
}

div#ranking div.ranking_each div.desc div.button a.btn_mou {
    display: block;
    width: 80px;
    height: 20px;
    float: left;
    text-indent: -100em;
    overflow: hidden;
    background: url(./image/btn_mou.gif) #fcc;
    position: absolute;
    right: 100px;
}

div#ranking div.ranking_each div.desc div.button a.btn_sho {
    display: block;
    width: 80px;
    height: 20px;
    margin: 0 0 0 20px;
    float: left;
    text-indent: -100em;
    overflow: hidden;
    background: url(./image/btn_sho.gif) #ccf;
    position: absolute;
    right: 0px;
}


/* footer
---------------------------------------------------------------- */
div#footer {
    clear: both;
    margin: 0;
    padding: 15px 0 0 0;
}

div#footer ul {
    padding-right: 10px;
    text-align: right;
}

div#footer a {
    color: #999;
    text-decoration: none;
}


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

/* ランキング部分 */
div#content div#ranking {
    margin: 0;
    padding: 10px 20px 10px 20px;
}

div#content div#ranking h3 {
    margin: 10px 0;
    padding: 0;
    font-size: 18px;
    color: #333;
}


/* 1位 */
div#content div.ranking_1st {
    height: 220px;
    margin: 5px 0 5px 0;
    border: solid 1px #c33;
    overflow: hidden;
}

div#content div.ranking_1st div.rank {
    float: left;
    width: 50px;
    height: 50px;
    padding: 75px 10px;
    background: #fff;
}

div#content div.ranking_1st div.capture {
    float: left;
    width: 120px;
    height: 80px;
    padding: 60px 10px;
    background: #fff;
}

div#content div.ranking_1st div.capture img {
    width: 120px;
}

div#content div.ranking_1st div.desc {
    float: left;
    width: 438px;
    height: 220px;
    padding: 10px;
    background: #fff;
}

div#content div.ranking_1st div.desc h4 {
    font-size: 15px;
    padding: 2px 0;
}

div#content div.ranking_1st div.desc p {
    margin: 0;
    padding: 2px 0;
}

div#content div.ranking_1st div.desc a.btn_mou {
    display: block;
    width: 120px;
    height: 30px;
    margin-top: 5px;
    padding: 0;
    overflow: hidden;
    background: url(images/btn_mou.gif) top left no-repeat;
   /* text-indent: -100em;*/
    float: left;
}

div#content div.ranking_1st div.desc a.btn_mou:hover {
    background-position: 0 -30px;
}

div#content div.ranking_1st div.desc a.btn_sho {
    display: block;
    width: 120px;
    height: 30px;
    margin: -12px 0 0 30px;     /* ? */
    padding: 0;
    overflow: hidden;
    background: url(images/btn_sho.gif) top left no-repeat;
  /*  text-indent: -100em;*/
    float: left;
}

div#content div.ranking_1st div.desc a.btn_sho:hover {
    background-position: 0 -30px;
}
/*ranking追加*/

div#content div.ranking_1st h2 {
    padding: 2px 5px;
    font-size: 110%;
    font-weight: bold;
    background: #f60;
    color: #fff;
}

div#content div.ranking_1st ul.check {
    padding: 10px 0 5px 15px;
}

div#content div.ranking_1st ul.check li {
    padding: 8px 0 5px 25px;
    font-weight: bold;
    background: url(./image/check.gif) top left no-repeat;
}


div#content div.ranking_1st p.right {
    text-align: right;
    padding: 0 10px;
}