@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;
}

/* 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;
width:700px;
margin:35px auto;
}

#contentsArea.small{
width:440px;
margin:24px auto 0;
}

#contentsArea.sp_login{
margin:0 auto;
}

#contentsArea_sub{
position:relative;
width:860px;
margin:15px auto 35px;
}

.minimum{
width:260px!important;
}

#hgFooter{
width:860px;
}


/* ==================================================

 header

================================================== */
#header{
margin:0 0 20px;
color:#433318;
text-align:center;
}
.small #header{
margin:0 0 11px;
}

#header h1{
margin:0 0 12px;
}

#contentsArea_sub #header{
width:830px;
margin:0 auto;	
}

#contentsArea_sub #header h1{
margin:0
}

#contentsArea_sub #header{
text-align:left;	
}

#contentsArea_sub #header p.txt{
background:url(http://images.hangame.co.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 p.txt strong{
font-weight:bold;
}

#contentsArea_sub #header p.back{
margin-bottom:30px;
text-align:right;
padding-right:10px;
}

#contentsArea_sub #header p.back a{
color:#b37436;
background:url(http://images.hangame.co.jp/hangame/extra/login/sub_brand/arrow_back.gif) no-repeat left 4px;
padding-left:8px;
font-size:10px;
}

/* ==================================================

 panels

================================================== */
#panels{
position:relative;
zoom:1;
color:#838180;
}

#contentsArea_sub #panels{
width:700px;
margin:0 auto;
}

#panels:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#panels div.panel{
width:330px;
min-height:180px;
_height:180px;
padding:50px 0 20px;
border:5px solid #e1e1e1;
}
.small #panels div.panel{
width:430px;
min-height:auto;
_height:auto;
padding-bottom:15px;
}
.minimum #panels div.panel{
width:auto;
}

#panels div.panel h2{
width:288px;
height:24px;
margin:-50px auto 15px;
padding:24px 0 0;
border-bottom:1px solid #e6e1d9;
text-align:center;
}
.small #panels div.panel h2{

}

/* loginPanel
------------------------- */
#loginPanel{
}
.small #loginPanel{
margin-bottom:7px;
}

#loginPanel form{
zoom:1;
}

/* idPass */
#loginPanel ul.idPass{
width:168px;
margin:0 auto;
}

#loginPanel ul.idPass li{
height:26px;
}
#loginPanel ul.idPass li:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#loginPanel ul.idPass li img{
float:left;
margin-top:6px;
}

#loginPanel ul.idPass li input{
float:right;
width:99px;
height:13px;
padding:3px;
border:1px solid #939393;
}

/* imgAthntc */
dl.imgAthntc{
position:relative;
width:192px;
margin:10px auto;
text-align:center;
}

dl.imgAthntc dt{
position:absolute;
left:0;
top:54px;
width:192px;
text-align:center;
}
dl.imgAthntc dt em{
position:absolute;
right:3px;
top:5px;
font-size:10px;
}
dl.imgAthntc dt em a{
color:#82817f;
text-decoration:underline;
}

dl.imgAthntc dd{
}
dl.imgAthntc dd.str{
height:52px;
margin:0 0 29px;
border:1px solid #69a;
}

dl.imgAthntc dd.txt{
}
dl.imgAthntc dd.txt input{
width:160px;
height:13px;
padding:3px 0 3px 6px;
border:1px solid #939393;
letter-spacing:5px;
}

/* option */
#loginPanel ul.option{
width:188px;
margin:0 auto 12px;
font-size:10px;
}
#loginPanel ul.option:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.small #loginPanel ul.option{
margin-bottom:10px;
}
#loginPanel ul.option li{
padding:0 0 0 10px;
*padding:0 0 0 7px;
}
#loginPanel ul.option li input{
position:relative;
top:2px;
}
#loginPanel ul.option label{
cursor:pointer;
}

/* loginBtn */
#loginPanel p.btn{
text-align:center;
}
#loginPanel p.btn img{
cursor:pointer;
}
#loginPanel p.maBtn{
margin-top:10px;
}

/* mainteInfo */

#loginPanel p.mainteInfo{
width:350px;
margin:15px auto 0;
font-size:10px;
text-indent:-10px;
padding-left:20px;
}


/* lostPass */
p.lostPass{
margin-top:5px;
font-size:10px;
text-align:center;
}
p.lostPass a{
padding-left:10px;
background:url(http://images.hangame.co.jp/hangame/htop/arw_orange-r.gif) no-repeat 0 center;
color:#b37436;
}

/* notes
------------------------- */
ul#notes{
margin:7px 24px 0;
color:#808080;
font-size:10px;
line-height:14px;
}
ul#notes li{
padding-left:1em;
text-indent:-1em;
}
ul#notes li em{
color:#433318;
}
ul#notes li a{
color:#b37436;
}

/* registryPanel
------------------------- */
#registryPanel{
position:absolute;
right:0;
top:0;
}
.small #registryPanel{
position:static;
margin:20px 0 0;
}
#registryPanel p.lead{
margin:26px 0;
text-align:center;
}
.small #registryPanel p.lead{
margin:10px 0;
}
#registryPanel p.btn{
text-align:center;
}

/* extraBnr
------------------------- */
#extraBnr{
position:absolute;
right:0;
top:0;
width:300px;
min-height:250px;
_height:250px;
padding:4px;
border:1px solid #e1e1e1;
}


