@charset "Shift_JIS";


/* base layout style
========================================================================= */
body {
  margin: 0;
  padding: 0;
  color: #666;
  font: 12px/1.333 "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS P Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Verdana", "Arial", "Helvetica", sans-serif;
  -webkit-text-size-adjust: none;
}
body#avatar {
  padding-left: 1px;
  background-image: url(//images.hange.jp/hangame/avatar/extra_bg/main_bg980.jpg);
}
body#avatar:nth-of-type(1) #selector {
  padding-left: 2px;
}
#container {
  position: relative;
  width: 960px;
  margin: 10px auto 0;
}


/* bodyArea
---------------------------------------------- */
#bodyArea {
  position: relative;
  width: 960px;
  margin: 0;
  padding: 0;
}
#bodyArea.top {
  margin-top: -10px;
}
#bodyArea:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}


/* contentsArea
---------------------------------------------- */
#contentsArea {
  position: relative;
  float: left;
  width: 740px;
  margin: 0;
  padding: 0;
  text-align: left;
}
#contentsArea .beginner {
  margin: -32px 0 0;
  text-align: right;
  height: 32px;
}


/* extraArea
---------------------------------------------- */
#extraArea:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#extraArea .mySpace {
  border: 1px solid #cecece;
  border-top: none;
  margin: 0 -1px;
  width: 208px;
}


/* communitySearch
----------------------*/
#extraArea #cmntySrchBox {
  width: 196px;
  margin: 12px auto 10px;
  background: url(//images.hange.jp/hangame/common/extraarea/bg_rbox196-top.gif) no-repeat 0 0;
  border: none;
}
#extraArea #cmntySrchBox .display {
  zoom: 1;
  padding: 0 0 10px 10px;
  background: url(//images.hange.jp/hangame/common/extraarea/bg_tomypage.gif) no-repeat left bottom;
}
#extraArea #cmntySrchBox .tabs li {
  font-size: 11px;
}


/* circleArea
----------------------*/
#circleArea {
  width: 208px;
  margin: 0 auto 15px;
}
#circleArea h2 {
  padding-left: 5px;
}
#circleArea .lead {
  padding: 0 8px;
  color: #666349;
  font-size: 11px;
  letter-spacing: -1px;
}
#extraArea #circleArea ul {
  width: 198px;
  margin: 8px 0 3px;
  padding: 6px 5px 0;
  background: #fff;
  border-top: 1px solid #e2e2e2;
  border-bottom: 1px solid #e2e2e2;
}
#circleArea li {
  position: relative;
  padding: 0 0 6px 10px;
  background: url(//images.hange.jp/hangame/common/ico_2x2_d-gray.gif) 3px 7px no-repeat;
  color: #7f7e7e;
  line-height: 1.2;
}
#circleArea li .ico {
  position: relative;
  top: auto;
  left: auto;
  height: 25px;
  margin: 0 4px 0 2px;
  vertical-align: middle;
}
#circleArea li .date {
  font-size: 11px;
}
#circleArea li .date strong {
  color: #ff5328;
  font-weight: normal;
}
#circleArea p.more {
  margin-right: 3px;
  text-align: right;
}
#circleArea p.more a {
  padding-right: 11px;
  background: url(//images.hange.jp/hangame/common/ico_arrowbox_more.gif) right center no-repeat;
  font-size: 11px;
  text-align: right;
}


/* specialContents
---------------------- */
#extraArea #specialContents {
  width: 194px;
  margin: 0 auto;
  background: #fff url(//images.hange.jp/hangame/common/extraarea/bg_specialcontents_bottom.gif) no-repeat left bottom;
}
#extraArea #specialContents h2 {
  height: 26px;
  padding-left: 22px;
  line-height: 26px;
  background: url(//images.hange.jp/hangame/common/extraarea/bg_specialcontents_top.gif) no-repeat;
}
#extraArea #specialContents ul {
  padding: 5px 0;
  position: relative;
}
#extraArea #specialContents li {
  padding-left: 18px;
  background: url(//images.hange.jp/hangame/common/ico_arrow_orange_small.gif) no-repeat 10px 7px;
  line-height: 19px;
}
#extraArea #specialContents ul ul {
  margin-top: -3px;
  padding: 0;
}
#extraArea #specialContents ul ul li {
  padding-left: 10px;
  background: url(//images.hange.jp/hangame/common/ico_arrow_nest.gif) no-repeat 0 6px;
  color: #A6A175;
}
#extraArea #specialContents ul ul li a {
  color: #A6A175;
}


/* footerArea
---------------------------------------------- */
#footerArea #hgFooter {
  width: 960px;
}


/* Notice
------------------------------------------------ */
#noticeWrap {
  width: 958px;
  margin: 0 auto;
  padding: 0;
  border: 1px solid #cfcfcf;
  background: #fff;
}
#urgentNotice {
  width: 922px;
  min-height: 2em;
  margin: 0 auto;
  padding: 15px;
  border: 3px solid #f6f6f6;
  background: #fff;
  color: #ee6a2d;
}
#urgentNotice h2 {
  margin-bottom: 6px;
}
#urgentNotice p {
  margin-top: 6px;
}
.maintenanceNotice {
  margin: 6px 0;
  padding: 10px;
  border: 2px solid #7F7F7C;
  background-color: #EFEFE9;
  color: #B15422!important;
}
.maintenanceNotice p {
  color: #B15422!important;
}