@charset 'shift_jis';


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

 Base style

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

/* Font
------------------------- */
body{
color:#666;
font-family:'Hiragino Kaku Gothic Pro', 'MS PGothic', sans-serif;
font-size:12px;
line-height:1.333;
}
input,textarea,select{
font-family:'Hiragino Kaku Gothic Pro', 'MS PGothic', sans-serif;
font-size:1em;
}
input[type="password" i] {
  font: 13px tahoma;
  letter-spacing: 2px;
}
/* Link
------------------------- */
a{
text-decoration:none;
}
a:hover,a:active,a:focus{
text-decoration:underline;
}

/* Browser style reset
------------------------- */
h1,h2,h3,h4,h5,h6{
margin:0;
font-size:1em;
}
p,form,dl,dd{
margin:0;
}
ol,ul{
list-style-type:none;
margin:0;
padding:0;
}
em{
font-style:normal;
}
img{
border:0;
vertical-align:top;
}

/* layout
------------------------- */
body{
position:relative;
margin:0;
padding:0;
}
#contentsArea{
position:relative;
padding:10px 0;
}
#contentsArea.small{
width:440px;
margin:24px auto 0;
}
#contentsArea.sp_login{
margin:0 auto;
}
#contentsArea_sub{
position:relative;
padding:10px 0;
}
.minimum{
width:260px!important;
}
#hgFooter{
width:960px;
}



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

 header

================================================== */
#contentsArea_sub #header{
width:830px;
margin:0 auto;	
}
#contentsArea_sub #header .txt{
background:url(//images.hange.jp/hangame/extra/login/sub_brand/bg_login_txt.gif) no-repeat left bottom;
min-height:16px;
_height:16px;
margin-bottom:10px;
padding:5px 0 5px 10px;
border-top:1px solid #e1e1e1;
color:#808080;
}
#contentsArea_sub #header .txt strong{
font-weight:bold;
}
#contentsArea_sub #header .back{
margin-bottom:10px;
padding-right:10px;
text-align:right;
}
#contentsArea_sub #header .back a{
padding-left:8px;
background:url(//images.hange.jp/hangame/extra/login/sub_brand/arrow_back.gif) no-repeat left 4px;
font-size:10px;
color:#b37436;
}



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

 panels

================================================== */
#panels{
overflow: hidden;
position:relative;
z-index: 1 !important;
width: 945px;
height: 460px !important;
margin: 0 auto;
padding: 0;
/*background:url(//images.hange.jp/hangame/extra/login/bg_panels.gif) no-repeat left top;*/
text-align: center;
zoom:1;
}

/* loginJack
-------------------------------------------------- */
#loginJack{
overflow: hidden;
z-index: 1 !important;
width: 945px;
height: 460px !important;
}
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 20;
width: 575px;
height: 460px;
opacity: 0;
}

/* loginPanel
-------------------------------------------------- */
#loginPanel{
position:absolute;
top:90px;
left:575px;
z-index: 1000 !important;
width:223px;
padding:1px;
text-align:left;
zoom:1;
}
#loginPanel.jack{
padding:0;
border:1px solid #cecece;
background:#fff;
}
#loginPanel:after{content:".";display:block;height:0;clear:both;visibility:hidden}
#loginPanel h1{
padding:17px 0 5px;
font-size:13px;
font-weight:bold;
line-height:1.75;
text-align:center;
}
#loginPanel .ttl{
padding-top:0;
}
#loginPanel .txt{
display: none;
padding:0 0 5px;
font-size:11px;
line-height:1.1;
color:#666;
text-align:center;
}
#loginPanel .idPass form:after{content:".";display:block;height:0;clear:both;visibility:hidden}
#loginPanel .idPass{
float:left;
width:123px;
padding:8px 5px 7px 18px;
}
#loginPanel .idPass li{
vertical-align:top;
*display:inline;
height:23px;
}
#loginPanel .idPass input{
width:115px;
height:20px;
margin:0;
padding:2px 1px 0 5px;
border:1px solid #cfcfcd;
background-repeat:no-repeat;
background-position:6px 6px;
color:#666;
line-height:15px;
}
#loginPanel .loginBtn{
float:left;
width:60px;
padding-top:8px;
}
#loginPanel .loginBtn img{
cursor:pointer;
}
#loginPanel .option:after{content:".";display:block;height:0;clear:both;visibility:hidden}
#loginPanel .option{
clear:both;
width:207px;
margin:0 0 1px 0;
padding-left:18px;
color:#81807e;
font-size:11px;
}
#loginPanel .option li{
float:left;
height:1.2em;
padding-right:10px;
*display:inline;
}
#loginPanel .option input{
vertical-align:bottom;
width:1.2em;
height:1.2em;
margin:0 5px 0 0;
padding:0;
}
/* extraNavi */
#loginPanel .extraNavi{
clear:both;
padding:7px 0 0 18px;
}
#loginPanel.jack .extraNavi{
margin-bottom:2px;
}
#loginPanel .extraNavi li{
zoom:1;
}
#loginPanel .extraNavi li a{
color:#81807e;
font-size:11px;
}
#loginPanel .extraNavi .passWord{
padding-left:15px;
background:url(//images.hange.jp/hangame/extra/login/ico_exc.gif) no-repeat center left;
}
#loginPanel .extraNavi .memberEntry{
padding-top:15px;
margin-bottom:18px;
}
#loginPanel .extraNavi .noid{
margin:0 0 9px 7px;
}
#panels .noJS{
position:absolute;
left:0;
top:0;
width:227px;
height:141px;
padding:100px 0 12px;
_padding-bottom:16px;
background-color:#fff;
}

/* for openID*/
#loginPanel .extraNavi .openid{
  height: 17px;
  width: 188px;
  margin-top: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #eaeaea;
}
#loginPanel .extraNavi .openid li {
  display: inline-block;
}
#loginPanel .extraNavi .openidTxt {
    padding-right: 15px;
    font-size: 10px;
    line-height: 17px;
    color: #a6a6a6;
}
#loginPanel .extraNavi .openid li a{
  font-size: 0;
  display: inline-block;
  margin: 0 0 0 0;
  background-repeat: no-repeat;
  width: 17px;
  height: 17px;
  vertical-align: middle;
}
#loginPanel .extraNavi .openid li .openidBtnFb {
  background-image: url(//images.hange.jp/hangame/extra/login/btn_openid_fb.png);
}
#loginPanel .extraNavi .openid li .openidBtnTw {
  background-image: url(//images.hange.jp/hangame/extra/login/btn_openid_tw.png);
}
#loginPanel .extraNavi .openid li .openidBtnGp {
  background-image: url(//images.hange.jp/hangame/extra/login/btn_openid_gp.png);
}

/* imgAthntc */
dl.imgAthntc{
position:relative;
width:192px;
margin:0 auto;
text-align:center;
}
dl.imgAthntc dt{
position:absolute;
top:54px;
left:0;
width:192px;
text-align:center;
}
dl.imgAthntc dt em{
position:absolute;
top:2px;
right:0;
font-size:10px;
}
dl.imgAthntc dt em a{
color:#82817f;
text-decoration:underline;
}
dl.imgAthntc dd.str{
height:52px;
margin:0 0 29px;
border:1px solid #f63;
}
dl.imgAthntc dd.txtinput{
padding: 0 0 1px;
}
dl.imgAthntc dd.txtinput input{
width:160px;
height:13px;
padding:3px 0 3px 6px;
border:1px solid #939393;
letter-spacing:5px;
}
	
/* notes
------------------------- */
ul#notes{
width:945px;
margin:7px auto 0;
color:#666;
font-size:11px;
line-height:15px;
}
ul#notes li{
padding-left:1em;
text-indent:-1em;
}
ul#notes li em{
color:#433318;
}
ul#notes li a{
color:#b37436;
}

/* extraBnr
------------------------- */
#extraBnr{
position:absolute;
left:94px;
top:81px;
width:300px;
min-height:250px;
_height:250px;
padding:2px 8px 8px;
border:1px solid #e1e1e1;
}

/* externalCol
------------------------- */
#externalCol{
position:absolute;
left:94px;
top:81px;
width:340px;
}

#externalCol p.txt{
margin-top:80px;
text-align:left;
}

#externalCol p.txt strong{
display:block;
margin-bottom:15px;
}

/* externalWrap
------------------------- */

#externalWrap{
width:945px;
height:300px;
padding-top:160px;
background:#fff;
}

#externalWrap p.txt{
margin-bottom:30px;
}

#externalWrap p.txt strong{
display:block;
margin-bottom:15px;
}