@charset "utf-8";

/* ------------------------- TOC 
01 Setup
02 CSS Hack
03 wrap around the contents (base layout box)
04 site (global) navigation
05 contents
06 footer
07 others
 ------------------------- */

/* ============================== 01 Setup */
* { margin: 0; padding: 0; text-decoration: none; text-align: left; border: none; font-weight: normal; color: #630; font-family: "Lucida Grande", "Hiragino Kaku Gothic Pro", "MS PGothic", Osaka, sans-serif; font-size: small; font-style: normal; }
body { margin:10px; color:#630; text-align: center; }
ul, ol, dl, li, dt, dd { list-style: none; }
a { text-decoration: none; }
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover, a:active { text-decoration: none; }
a img, a:link img, a:visited img, a:hover img, a:active img { border: none; text-decoration: none; }
table { border-collapse: collapse; }
input { vertical-align: bottom; }

/* ============================== 02 CSS Hack */
/* floating box clear */
.clr:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clr { display: inline-table; min-height: 1%; }
/* Hide from mac IE5*/
* html .clr { height: 1%; }
.clr { display: block; }
/* End Hide from mac IE5 */

/* hide text */
.hidetxt { text-indent: -9999px; overflow: hidden; }
.hidetxt a { text-decoration: none; }


/* ============================== 03 wrap around the contents (base layout box) */

/* 共通 */
.denizens #container_out { text-align:center; width:100%; }
.denizens #container_top { margin: 0 auto; width:560px; }
.denizens #container_in { margin: 0 auto; width:560px; }
.denizens h1 { margin: 0 auto; width:560px; }

.denizens { line-height: 1.25em; }
.denizens .spacing { padding-bottom: 1em; }
.small { font-size: x-small; }

.denizens #contents #outline a { text-decoration: none; }
.denizens #contents #outline a:link { color: #399; border-bottom: #399 solid 1px; }
.denizens #contents #outline a:visited { color: #399; border-bottom: #399 solid 1px; }
.denizens #contents #outline a:hover, .denizens #contents #outline a:active { color: #066; border-bottom: #066 solid 1px; }
.denizens #outline a img, .denizens #outline a:link img, .denizens #outline a:visited img, .denizens a:hover #outline img, .denizens a:active #outline img { border: none; text-decoration: none; }

/* トップページ */
#idx_jp #contents_top { background: url(../../jpn/special/denizens/img/bg_idx.gif) no-repeat left top; height: 416px; }
#idx_en #contents_top { background: url(../../eng/special/denizens/img/bg_idx.gif) no-repeat left top; height: 416px; }

.jp #nav_area { width:149px; padding: 276px 0 0 206px }
.en #nav_area { width:149px; padding: 261px 0 0 206px }

.jp #nav00 a { display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../../jpn/special/denizens/img/btn.gif); width: 149px; height: 25px; }
.jp #nav00 a:hover, .jp #nav00 a:active { background-position: 0 -25px; }

.jp #nav01 a { display: block; background-position: 0 -50px; background-repeat: no-repeat; background-image: url(../../jpn/special/denizens/img/btn.gif); width: 149px; height: 25px; }
.jp #nav01 a:hover, .jp #nav01 a:active { background-position: -0 -75px; }

.jp #nav02 a { display: block; background-position: 0 -100px; background-repeat: no-repeat; background-image: url(../../jpn/special/denizens/img/btn.gif); width: 149px; height: 25px; }
.jp #nav02 a:hover, .jp #nav02 a:active { background-position: -0 -125px; }

.en #nav00 a { display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../../eng/special/denizens/img/btn.gif); width: 149px; height: 30px; }
.en #nav00 a:hover, .en #nav00 a:active { background-position: 0 -30px; }

.en #nav01 a { display: block; background-position: 0 -60px; background-repeat: no-repeat; background-image: url(../../eng/special/denizens/img/btn.gif); width: 149px; height: 30px; }
.en #nav01 a:hover, .en #nav01 a:active { background-position: -0 -90px; }

.en #nav02 a { display: block; background-position: 0 -120px; background-repeat: no-repeat; background-image: url(../../eng/special/denizens/img/btn.gif); width: 149px; height: 30px; }
.en #nav02 a:hover, .en #nav02 a:active { background-position: -0 -150px; }

/* 第2階層 */
.denizens #contents { background: url(../special/denizens/bg_frame.gif) repeat-y left top; padding: 0 13px 0 0; margin: 0; }

.sub_nav { border-bottom: 1px dotted #492b00; padding: 0 0 15px 0; }
.sub_nav ul { list-style-type: none; padding-bottom: 10px; }
.sub_nav li { float: left; margin-right: 5px; font-size: x-small; }
.sub_nav li a { font-size: x-small; }

/* 本文 */
.denizens #outline, .denizens #outline_form { width: 520px; margin-left: 20px; padding: 10px 0; }
.denizens #outline em, .denizens #outline_form em { color: #96c; }
.denizens #outline strong, .denizens #outline_form strong { font-weight: bold; }

#story_idx .lead { padding-top: 10px; margin-bottom:20px; }
#story_idx h2 {  margin-bottom:18px; }
#story_idx .list { margin-left:40px; width:440px; border-bottom: 1px dotted #492b00; padding: 13px 0 11px 0; }
#story_idx .first { border-top: 1px dotted #492b00; }
#story_idx .last { margin-bottom:10px; }
#story_idx .list p { margin-left:84px; padding-left:17px; background-image: url(../special/denizens/icon.gif); background-repeat: no-repeat; }
#story_idx .list span.date { font-size: x-small; }

#story h2 { margin-top:20px; }
#story h3 { margin-left:40px; width:440px; margin-top:15px; margin-bottom:20px; text-align:center; padding-top:12px; border-top: 1px dotted #492b00; }
#story h4 { margin-top:15px; margin-bottom:20px; text-align:center; }
#story h3 img, #story h3 img { margin-right:5px; vertical-align: top; }
#story .body { margin-left:40px; width:440px; margin-bottom:10px; }
#story .body .leftcol { width:280px; float:left; }
#story .body .rightcol { width:160px; float:right; text-align:right; }
#story .body p.mb { margin-bottom:1.25em; }

.page_nav ul { margin-left:40px; width:440px; list-style-type: none; padding-top: 10px; }
.page_nav li#back { float: left; font-size: x-small; }
.page_nav li#next { float: right; font-size: x-small; }
.page_nav li a { font-size: x-small; }

#doll .set { padding-top: 10px; min-height: 470px; _height: 470px; }
#doll .line { border-bottom: 1px dotted #7a4500; padding-bottom:15px; }
#doll .body { height: auto !important; height: 292px; min-height: 192px; }
#doll h2 { padding-bottom: 5px; font-weight: bold; color: #d69; }
#list { border-bottom: 1px dotted #7a4500; padding: 15px 0 15px 0; height: auto !important; }
#list ul { padding-bottom: 5px; }
#list li { margin-bottom: 10px; line-height: 1.2em; }

#purchase .set { padding-top: 10px; margin-bottom: 10px; height: auto !important; }
#purchase .line { border-bottom: 1px dotted #7a4500; padding-bottom:15px; }
#purchase h2 { padding-bottom: 5px; font-weight: bold; color: #d69; }
#purchase table { float: right; width: 110px; margin-left: 10px; }
#purchase table p { font-size: x-small; margin: 5px 0 10px 0; }

#purchase #contents #outline_form p a { text-decoration: none; }
#purchase #contents #outline_form p a:link { color: #399; border-bottom: #399 solid 1px; }
#purchase #contents #outline_form p a:visited { color: #399; border-bottom: #399 solid 1px; }
#purchase #contents #outline_form p a:hover, #purchase  #contents #outline_form p a:active { color: #066; border-bottom: #066 solid 1px; }

.jp .lottery_area { margin: 10px 0 9px 0; width: 140px; }
.jp .lottery_area a, .jp .lottery_area a:link, #pri_ala_purchase .jp .lottery_area a:visited { display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../../jpn/special/denizens/img/btn_form.gif); height: 29px; }
.jp .lottery_area a:hover, .jp .lottery a:active { background-position: 0 -29px; }
.en .lottery_area { margin: 10px 0 9px 0; width: 140px; }
.en .lottery_area a, .en .lottery_area a:link, #pri_ala_purchase .en .lottery_area a:visited { display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../../eng/special/denizens/img/btn_form.gif); height: 29px; }
.en .lottery_area a:hover, .en .lottery a:active { background-position: 0 -29px; }

#form .set { padding-top: 10px; }
#form h2 { padding-bottom: 5px; font-weight: bold; color: #d69; }
#form .set table { float: right; width: 110px; margin-left: 10px; }
#form .set table p { font-size: x-small; margin: 5px 0 10px 0; }

.info { font-size: x-small; }

#form #outline .form_area { width: 506px; }

#form #outline .form_area table { margin: 5px 0 6px 5px; width: 506px; }
#form #outline .form_area th { border: 1px solid #ccc; padding: 5px 5px; font-size: small; }
#form #outline .form_area td { border: 1px solid #ccc; padding: 5px 5px; font-size: small; }
#form #outline .form_area td select { border: 1px solid #ccc; font-size: small; }

#form input.gray { border: 1px solid #999; padding: 0.2em; }
#form .medium { width: 200px; }
#form .medium02 { width: 140px; }
#form .long { width: 320px; }
#form .short { width: 100px; }

#form #err { margin-top:10px; margin-left: 10px; }
#form #err p { color:#f00; font-size:x-small; }

#button_submit { margin: 20px 0 0 0; text-align: center; }
#button_submit input { color: #333; border: 1px solid #999999; margin: 0 5px; padding: 1px; width: 100px; text-align: center; }

.button_back { margin: 10px 0 0 493px; width: 44px; }
.button_back a, .button_back a:link, .button_back a:visited 
{ display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../special/denizens/btn_back.gif); height: 11px; line-height: 1%; text-indent: -9999px; font-size: 1; }
.button_back a:hover, .button_back a:active { background-position: 0 -11px; }

/* フッタ */
#footer { line-height: 1em; width: 560px; margin-top: 5px; }
#footer .credit { font-size:x-small; text-align: center; color: #630; }

#footer .button_area { margin: 0 0 0 504px; width: 46px; }
#footer .button_area a, #footer .button_area a:link, #footer .button_area a:visited
{ display: block; background-position: 0 0; background-repeat: no-repeat; background-image: url(../special/denizens/btn_close.gif); height: 12px; border-bottom: 0; line-height: 1%; text-indent: -9999px; font-size: 1; }
#footer .button_area a:hover, #footer .button_area a:active { background-position: 0 -12px; }