@charset "Shift_JIS";



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

 contentsArea

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

/* headerArea
-------------------------------------------------- */
#headerArea{
position: relative;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/bg_header.jpg) no-repeat right top;
margin: 5px 0 7px;
height:93px; 	
}

#headerArea h1{
position: absolute;
top: 28px;
left: 18px;	
}

#headerArea p.btn{
position: absolute;
top: 36px;
right: 0;
}

/* award */
#headerArea.award{
position: relative;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/bg_header_award1.jpg) no-repeat right top;
margin: 0 0 7px;
padding-top:5px;
height:81px;
}

#headerArea.award h1{
position: absolute;
top: 21px;
left: 18px;
}

#headerArea.award .link{
position: absolute;
top: -2px;
left: 214px;
}

#headerArea.award p.btn{
position: absolute;
top: 29px;
right: 0;
}
/* searchArea
-------------------------------------------------- */
#searchArea{
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/bg_search.gif) no-repeat 5px top;	
height: 87px;	
padding: 15px 10px 0 22px;
}

#searchArea dl.count{
padding-bottom: 13px;	
}

#searchArea dl.count dt,
#searchArea dl.count dd{
display: inline;	
}

#searchArea dl.count dt{
padding-right: 20px;	
}

#searchArea dl.count dd img{
position:relative;
top:1px;
padding-left: 3px;	
}

#searchArea dl.pickup:after{content:".";display:block;height:0;clear:both;visibility:hidden} 
#searchArea dl.pickup dd ul:after{content:".";display:block;height:0;clear:both;visibility:hidden} 

#searchArea dl.pickup dt,
#searchArea dl.pickup dd,
#searchArea dl.pickup dd li{
float: left;	
}

#searchArea dl.pickup dt{
padding-right: 10px;	
}

#searchArea dl.pickup dd li{
padding-right: 10px;	
}

#searchArea dl.pickup dd li a{
color: #666;	
}
/* keywordSearch
------------------------- */
#keywordSearch{
clear: both;
width: 600px;
padding-bottom: 15px;
}
#keywordSearch:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#keywordSearch form{
float: left;
}
#keywordSearch form:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#keywordSearch p.tit{
display: inline;
float: left;
padding-right: 8px;
margin-top: 3px;
}

/* crclSrchWrd */
#keywordSearch input#crclSrchKywrd{
float: left;
height: 14px;
width: 164px;
margin-right:5px;
padding: 2px;
border: 1px solid #cfcfcf;
vertical-align: middle;
line-height: 14px;
}

#keywordSearch #categorySelectionSearch #slctCtgryLayerSearch {
left: -138px;
}

/* categorySelectionSearch */
#keywordSearch #categorySelectionSearch{
display:inline;
float: left;
padding-right: 5px;
}

/* sljs_crclSrchCtgry *** delete *** */
#keywordSearch form select{
float: left;
margin-right: 5px;
vertical-align: middle;
}

#keywordSearch #sljs_crclSrchCtgry{
display: inline;
position: relative;
float: left;
width: 130px;
height: 18px;
margin-right: 5px;
color: #333;
text-indent: 6px;
line-height: 18px;
}

#keywordSearch #cscSlctItm{
width: 128px;
height: 18px;
border: 1px solid #ccc;
background: #fff url(https://images.hange.jp/hangame/shop/itemshop/select/btn_itemsort.gif) no-repeat right center;
cursor: pointer;
}

#keywordSearch #sljs_crclSrchCtgry ul{
display: none;
position: absolute;
left: 0;
top: 20px;
width: 128px;
border: 1px solid #ccc;
border-top: none;
background-color: #fff;
}

#keywordSearch #sljs_crclSrchCtgry.active ul{
display: block;
}

#keywordSearch #sljs_crclSrchCtgry ul li{
cursor: pointer;
}

#keywordSearch #sljs_crclSrchCtgry ul li.on{
color: #000;
background-color: #ededed;
}

/* crclSrchBtn */
#keywordSearch input#crclSrchBtn{/* delete */
float: left;
margin:8px 0 0 0;
}

#keywordSearch button#crclSrchBtn{
float:left;
width:51px;
height:21px;
background:url(https://images.hange.jp/hangame/community/circlehg_top/common/head/btn_search.gif) no-repeat 0 0;
}

/* condition */
#keywordSearch .condition{
float: right;
padding:2px 2px 0 0;
}

#keywordSearch .condition a{
display: block;
padding-left: 7px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/arrow_gray2x4right.gif) no-repeat 0 center;
color: #828282;
}

/* circleSearch[***** delete *****]
------------------------- */
#circleSearch{
clear: both;
width: 600px;
}
#circleSearch:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#circleSearch h3{
display: inline;
float: left;
margin: 11px 8px 0 0;
}

#circleSearch form{
width:430px;
float: left;
padding: 8px 0 0 8px;
}
#circleSearch form:after{content:".";display:block;height:0;clear:both;visibility:hidden}

/* sljs_crclSrchCtgry */
#circleSearch form select{
float: left;
margin-right: 5px;
vertical-align: middle;
}

#circleSearch #sljs_crclSrchCtgry{
display: inline;
position: relative;
float: left;
width: 130px;
height: 18px;
margin-right: 5px;
color: #333;
text-indent: 6px;
line-height: 18px;
}

#circleSearch #cscSlctItm{
width: 128px;
height: 18px;
border: 1px solid #ccc;
background: #fff url(https://images.hange.jp/hangame/shop/itemshop/select/btn_itemsort.gif) no-repeat right center;
cursor: pointer;
}

#circleSearch #sljs_crclSrchCtgry ul{
display: none;
position: absolute;
left: 0;
top: 20px;
width: 128px;
border: 1px solid #ccc;
border-top: none;
background-color: #fff;
}

#circleSearch #sljs_crclSrchCtgry.active ul{
display: block;
}

#circleSearch #sljs_crclSrchCtgry ul li{
cursor: pointer;
}

#circleSearch #sljs_crclSrchCtgry ul li.on{
color: #000;
background-color: #ededed;
}

/* crclSrchWrd */
#circleSearch input#crclSrchWrd{
float: left;
height: 14px;
width: 164px;
margin-right: 5px;
padding: 2px;
border: 1px solid #cfcfcf;
vertical-align: middle;
line-height: 14px;
}

/* crclSrchBtn */
#circleSearch input#crclSrchBtn{
float: left;
}

/* condition */
#circleSearch .condition{
float: right;
padding: 11px 2px 0 0;
}

#circleSearch .condition a{
display: block;
padding-left: 7px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/arrow_gray2x4right.gif) no-repeat 0 center;
color: #828282;
}

/* condition
------------------------- */
#circleSearch .condition{
float: right;
padding: 11px 2px 0 0;
}

#circleSearch .condition a{
display: block;
padding-left: 7px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/arrow_gray2x4right.gif) no-repeat 0 center;
color: #828282;
}


/* gameCircleNavi
-------------------------------------------------- */
ul#gameCircleNavi{
width: 638px;
margin-bottom: 18px;
padding-left: 6px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/navi/bg_circlenavi.jpg) no-repeat 0 0;
}
ul#gameCircleNavi:after{content:".";display:block;height:0;clear:both;visibility:hidden}

ul#gameCircleNavi li{
float: left;
padding-top: 4px;
}

ul#gameCircleNavi li.myMenu{
float: right;
padding: 9px 12px 0 0;
}



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

 extraArea

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

/* simpleMydata
------------------------- */
#simpleMydata{
width: 200px;
margin: 5px auto 0;
padding-bottom: 5px;
background: #fff url(https://images.hange.jp/hangame/easy/msduelgo/common/bg_simplemydata_btm.gif) left bottom no-repeat;
position:relative;
margin-bottom: 5px;
}

#simpleMydata h2{
width: 180px;
height: 15px;
padding: 5px 10px;
background: url(https://images.hange.jp/hangame/easy/msduelgo/common/bg_simplemydata_top.gif) 0 0 no-repeat;
color: #0091ae;
font-weight: normal;
}

#simpleMydata p.count{
position:absolute;
top:6px;
left:80px;
color:#0091AE;
}

#simpleMydata div.more{
position:absolute;
top:7px;
right:10px;
}

#simpleMydata div.more a{
background:transparent url(https://images.hange.jp/hangame/common/ico_arrowbox_more.gif) no-repeat scroll right 2px;
color:#676767;
display:block;
font-size:9px;
padding-right:12px;
}

#simpleMydata ul{
margin: 9px 0 5px;
padding: 0;
}

#simpleMydata ul li{
width: 180px;
margin: 2px 0;
padding-left: 20px;
background: url(https://images.hange.jp/hangame/easy/msduelgo/common/ico_2x2_gray.gif) no-repeat 13px 6px;
}

#simpleMydata ul li a{
font-weight: bold;	
}

#simpleMydata ul li p.time{
font-size: 11px;
text-align: right;
color: #8c8c8c;
}

/* bnrArea
------------------------- */
#extraArea .bnrArea{
text-align: center;	
}

#extraArea .bnrArea iframe{
border: 1px solid #E2E1DF;
}

#extraArea ul.hangameTips{
    margin: 7px 0;
    text-align: center;
}

/* crclSrch
------------------------- */
#crclSrch{
background:url(https://images.hange.jp/hangame/community/circlehg_top/common/bg_crclsrch_btm.gif) no-repeat 0 bottom;
margin:6px auto;
padding-bottom:9px;
width:200px;
}
#crclSrch h2{display:none}
#crclSrch ul{
zoom:1;
padding:5px 0 3px 5px;
background:url(https://images.hange.jp/hangame/community/circlehg_top/common/bg_crclsrch_top.gif) no-repeat 0 0;
}
#crclSrch ul:after{content:".";display:block;height:0;clear:both;visibility:hidden}
#crclSrch ul li{
float:left;
margin-right:3px;
}
#crclSrch input#srchCiclName{
width:118px;
margin:0 0 0 10px;
padding:2px 0 1px 3px;
border:2px inset;
color:#acacac;
vertical-align:middle;
}
#crclSrch img{
margin-top:-2px;
cursor:pointer;
vertical-align:middle;
}