@charset "Shift_JIS";


/* --------------------------------------------------

 circleSearchResult

-------------------------------------------------- */
#circleSearchResult{
position: relative;
zoom: 1;
}

#circleSearchResult h3{
padding: 0 0 3px 3px;
border-bottom: 1px solid #999;
color: #676767;
font-weight:normal;
}

#circleSearchResult h3 strong{
margin-right:5px;
background-color:#fbe0d1;
color:#333;
}

#circleSearchResult h3 em{
margin: 0 2px 0 7px;
color: #333;
font-family: Verdana, sans-serif;
font-size: 11px;
font-weight:bold;
}

/* circleList
------------------------- */
#circleSearchResult ul.circleList h4 strong{
background-color:#fbe0d1;
}

/* intro */
#circleSearchResult ul.circleList p.intro{
margin-right:10px;
}
#circleSearchResult ul.circleList p.intro strong{
background-color:#fbe0d1;
font-weight:normal;
}

/* property */
#circleSearchResult ul.circleList ul.property{
position:absolute;
right:0;
top:17px;
overflow:hidden;
padding-right:0;
}
#circleSearchResult ul.circleList ul.property li{
position:relative;
right:-1px;
float:left;
padding:0 11px 0 10px;
background:url(https://images.hange.jp/hangame/community/circlehg_top/common/vline_gray1x9.gif) no-repeat right center
}
#circleSearchResult ul.circleList ul.property li em{
color: #f60;
}

/* searchResultNone
------------------------- */
div.searchResultNone{
margin-bottom:20px;
padding-top:8px;
border-top:1px solid #e3e3e3;
color:#676767;
}
div.searchResultNone p.info{
margin:0 0 18px;
}
div.searchResultNone p.hint{
margin:0 0 0 13px;
line-height:21px;
}

/* inducesCircleMaking
------------------------- */
div.inducesCircleMaking{
zoom:1;
background:url(https://images.hange.jp/hangame/community/circlehg_top/guide/bg_guideArea_top.gif) no-repeat 0 0;
}
div.inducesCircleMaking div{
zoom:1;
background:url(https://images.hange.jp/hangame/community/circlehg_top/guide/bg_guideArea_btm.gif) no-repeat 0 bottom;
}
div.inducesCircleMaking div div{
padding:20px 0;
border-right:5px solid #e6e6e6;
border-left:5px solid #e6e6e6;
background:none;
}

div.inducesCircleMaking p.info{
margin-bottom:18px;
padding:5px 0 0;
color:#676767;
text-align:center;
}
div.inducesCircleMaking p.btn{
text-align:center;
}


/* --------------------------------------------------

 error_circleNone

-------------------------------------------------- */
#error_circleNone h2{
padding:0 0 3px 3px;
border-bottom:1px solid #999;
color:#676767;
font-weight:normal;
}

#error_circleNone p.summary{
margin:0 0 15px;
padding-top:18px;
border-top:1px solid #e3e3e3;
color:#676767;
}
#error_circleNone p.supple{
padding-left:1em;
color:#999;
text-indent:-1em;
}

#error_circleNone ul.centeringBtns{
margin-top:50px;
}


/* --------------------------------------------------

 Circle list,
 New recruit member,
 My circle

-------------------------------------------------- */

/* searchedCircleList
------------------------- */
#searchedCircleList{
position: relative;
zoom: 1;
}

#searchedCircleList h3{
padding: 0 0 3px 3px;
border-bottom: 1px solid #999;
color: #676767;
}

#searchedCircleList h3 em{
margin: 0 2px 0 7px;
color: #333;
font-family: Verdana, sans-serif;
font-size: 11px;
}

/* noItem
------------------------- */
#searchedCircleList p.noItem{
margin: 30px 0;
color: #666;
text-align: center;
}

p.noList{
margin: 30px 0;
color: #666;
text-align: center;
}

/* titList
------------------------- */
.titList.sub{
position: relative;	
}

.titList.sub h2 em{
margin: 0 2px 0 7px;
color: #333;
font-family: Verdana, sans-serif;
font-size: 11px;
font-weight: bold;
}

.titList.sub h2.result{
font-weight: normal;
}

.titList.sub h2 strong{
background-color: #FBE0D1;
color: #333;
margin-right: 5px;	
}


/* --------------------------------------------------

 circleRanking

-------------------------------------------------- */
#circleRanking{
}

#circleRanking p.introTxt{
margin: 0 0 6px;
padding: 0 0 0 10px;
background: url(https://images.hange.jp/hangame/common/ico_2x2_gray.gif) no-repeat 4px center;
color: #999;
}


/* rankingSelector
------------------------- */
#gameRankingSelector{
position: relative;
z-index: 100;
width: 644px;
height: 38px;
margin: 0 0 10px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/ranking/bg_rankingselector.gif) no-repeat 0 0;
}

/* sljs_crclSrchCtgry */
#sljs_gameRankingCtgry select#gid{
float: left;
margin-right: 5px;
vertical-align: middle;
}

#sljs_gameRankingCtgry{
position: absolute;
right: 122px;
top: 10px;
width: 168px;
height: 16px;
color: #333;
text-indent: 6px;
}

#grcSlctItm{
width: 166px;
height: 15px;
border: 1px solid #ccc;
background: #fff url(https://images.hange.jp/hangame/shop/itemshop/select/btn_itemsort.gif) no-repeat right 0;
color: #919191;
cursor: pointer;
line-height: 15px;
}

#sljs_gameRankingCtgry ul{
display: none;
position: relative;
z-index: 100;
width: 166px;
border: 1px solid #ccc;
border-top: none;
background-color: #fff;
color: #666;
line-height: 18px;
}

#sljs_gameRankingCtgry.active ul{
display: block;
}

#sljs_gameRankingCtgry ul li{
zoom:1;
cursor: pointer;
}

#sljs_gameRankingCtgry ul li.on{
color: #000;
background-color: #ededed;
}

/* rnkngSelectBtn */
#rnkngSelectBtn{
position: absolute;
right: 10px;
top: 10px;
}

/* crclRankList
------------------------- */
#crclRankList{
position: relative;
overflow: hidden;
width: 644px;
}

#crclRankList h3{
margin: 0 0 5px;
color: #676767;
font-size: 16px;
}

#crclRankList h3 img{
margin-right: 5px;
padding: 3px;
background: url(https://images.hange.jp/_images/community/circle/gamecircle/img/bg_gameicon_bg.gif) no-repeat 0 0;
vertical-align: middle;
}

#crclRankList .supplement{
position: absolute;
right: 0px;
top: 22px;
color: #999;
}

#crclRankList table{
clear: both;
width: 645px;
margin: 0 0 0 -1px;
color: #555;
}

#crclRankList table thead th{
padding-left: 1px;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
background: #f3f3f3 url(https://images.hange.jp/hangame/community/circlehg_top/common/vline_gray1x18.gif) no-repeat left center;
letter-spacing: -1px;
line-height: 24px;
}


#crclRankList table tbody th,
#crclRankList table tbody td{
border-bottom: 1px solid #e0e0e0;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/vline_graydot1x21.gif) no-repeat 0 center;
line-height: 40px;
}

#crclRankList table tbody th{
width: 42px;
}

#crclRankList table tbody th img{
position: relative;
top: -1px;
z-index: 0;
margin-right: 2px;
vertical-align: middle;
}

#crclRankList table tbody td a{
color: #666;
}

#crclRankList table tbody td.crcl{
width: 335px;
padding-left: 11px;
}

#crclRankList table tbody td.ownr{
padding-left: 11px;
}

#crclRankList table tbody td.ownr img{
border: 1px solid #bdbdbd;
margin-right: 7px;
vertical-align: middle;
}

#crclRankList table tbody td.scre{
text-align: center;
}


#circleRanking .returnBtn{
margin: 20px 0;
text-align: right;
}




/* --------------------------------------------------

 circleCreation

-------------------------------------------------- */
#circleCreation{
position:relative;
}

#circleCreation h2{
padding: 0 0 18px 7px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/create/rbox_gray644_top.gif) no-repeat 0 20px;
}

#circleCreation p.attention{
position:absolute;
top:0px;
left:160px;
color:#979797;
}

/* circleCreationForm
------------------------- */
#circleCreationForm{
position: relative;
zoom: 1;
padding: 0 9px 1px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/create/rbox_gray644_btm.gif) no-repeat 0 bottom;
}

#circleCreationForm h4.tit{
zoom: 1;
margin: 0 0 3px;
padding: 0 0 0 14px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/arrow_green3x5_right.gif) no-repeat 6px center;
color: #4a4a4a;
}

#circleCreationForm h3.tit{
zoom: 1;
margin: 0 0 3px;
padding: 0 0 0 14px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/arrow_green3x5_right.gif) no-repeat 6px center;
color: #4a4a4a;
}

#circleCreationForm table{
width: 626px;
border-top: 1px solid #d8d8d8;
border-left: 1px solid #d8d8d8;
background-color: #fff;
}

#circleCreationForm table th,
#circleCreationForm table td{
border-right: 1px solid #d8d8d8;
border-bottom: 1px solid #d8d8d8;
}

#circleCreationForm table th{
width: 120px;
padding: 8px 0 7px 13px;
font-weight: normal;
text-align: left;
vertical-align: top;
white-space: nowrap;
}

#circleCreationForm table th em{
display: block;
color: #888;
}
#circleCreationForm table th em a{
color: #888;
text-decoration:underline;
}

#circleCreationForm table td{
padding: 5px 11px;
color: #666;
}
#circleCreationForm table td p{
overflow: auto;
width: 468px;
padding:2px 0;
word-break: break-all;
word-wrap: break-word;
}
#circleCreationForm table td div.skin{
width:100px;
font-size:11px;
text-align:center;
}
#circleCreationForm table td div.skin img{
display:block;
margin:4px 0;
padding:1px;
border:1px solid #ccc;
}

#circleCreationForm input.txt{
height: 14px;
padding: 2px;
border: 1px solid #d8d8d8;
line-height: 14px;
}

#circleCreationForm textarea,
#circleCreationForm div.textarea{
width: 483px;
padding-left: 2px;
border: 1px solid #d8d8d8;
scrollbar-face-color: #fff;
scrollbar-track-color: #fff;
scrollbar-shadow-color: #e5e5e5;
scrollbar-darkshadow-color: #fff;
scrollbar-highlight-color: #fff;
scrollbar-3dlight-color: #e5e5e5;
scrollbar-arrow-color: #b8b8b8;
color: #666;
}
#circleCreationForm div.textarea{
overflow-y: scroll;
height: 120px;
line-height: 13px;
}

#circleCreationForm .guidance{
padding-left: 14px;
background: url(https://images.hange.jp/hangame/common/ico_2x2_gray.gif) no-repeat 8px center;
color: #666;
}

#circleCreationForm p.guidance{
margin: 10px 0 20px;
}


/* baseSettingSct
------------------------- */
#baseSettingSct{
}

#baseSettingSct input{
float: left;
width: 330px;
}
#baseSettingSct td em.supple{
padding-left: 7px;
color: #888;
line-height: 20px;
}

#baseSettingSct td em.supple.num{
display: block;
color: #b5b5b5;
font-size: 11px;
text-align: right;
}

/*Ci09/06j*/
.chg_r0906 #baseSettingSct .writeArea{
width:483px;
position:relative;
margin-bottom:5px;
border-bottom:1px solid #C2C2C2;
border-left:1px solid #C2C2C2;
border-right:1px solid #C2C2C2;
}

.chg_r0906 #baseSettingSct .writeArea .command{
width:483px;
height:35px;
background: url(https://images.hange.jp/hangame/community/bbs/editor/bg_tool_line.gif) repeat-x center top;
position:relative;
}

.chg_r0906 #baseSettingSct .writeArea .command:after{content:".";display:block;height:0;clear:both;visibility:hidden}

.chg_r0906 #baseSettingSct .writeArea .command ul{
width:400px;
padding:6px 0 0 11px;
}

.chg_r0906 #baseSettingSct .writeArea .command ul li{
cursor:pointer;
float:left;
}

.chg_r0906 #baseSettingSct .writeArea .command p.count{
position:absolute;
top:10px;;
right:20px;
}

.chg_r0906 #baseSettingSct .writeArea .txtBox{
width:483px;
overflow:hidden;
}

.chg_r0906 #baseSettingSct .writeArea .txtBox textarea{
width:468px;
min-height:200px;
_height:200px;
padding:10px 5px 5px 10px;
overflow:auto;
border:0;
word-break: break-all;
word-wrap: break-word;
resize:none;
scrollbar-base-color: #ffffff;
scrollbar-face-color: #ffffff;
scrollbar-track-color: #FBFBFB;
scrollbar-arrow-color: #DFDFDF;
scrollbar-3dlight-color: #d6d6d6;
scrollbar-shadow-color: #FBFBFB;
scrollbar-darkshadow-color: #d6d6d6;
}

.chg_r0906 #decorationWrapper{
position:absolute;
top:25px;
left:11px;
}

.chg_r0906 #decorationWrapper table{
border:none;
background:none;
width:280px;
}
.chg_r0906 #decorationWrapper td{
border:none;
}
/*Ci09/06j*/

/* categorySelection */
#baseSettingSct #slctCtgryLayer{
left: -135px;
top: 22px;
}

/* skinSettingSct
------------------------- */
#skinSettingSct{
padding-top:18px;
}

#skinSettingSct h4 em{
margin-left: 10px;
color: #666;
font-weight: normal;
}

#skinSettingSct ul#skinList{
zoom:1;
padding:16px 0 5px 24px;
border:1px solid #d8d8d8;
background-color:#fff;
}
#skinSettingSct ul#skinList:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#skinSettingSct ul#skinList li{
float:left;
width:119px;
height:126px;
color:#999;
font-size:11px;
}
#skinSettingSct ul#skinList li label{
display:block;
width:100px;
}
#skinSettingSct ul#skinList li img{
display:block;
margin-bottom:4px;
*margin-bottom:2px;
padding:1px;
border:1px solid #ccc;
}
#skinSettingSct ul#skinList li input{
position:relative;
top:-3px;
*top:-2px;
margin-left:0;
*margin-left:-4px;
vertical-align:middle;
}

/* keySettingSct
------------------------- */
#keySettingSct{
margin: 0 0 15px;
padding: 18px 0 0;
}

#keySettingSct h4{
zoom: 1;
margin: 0 0 3px;
padding: 0 0 0 14px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/arrow_green3x5_right.gif) no-repeat 6px center;
color: #4a4a4a;
}

#keySettingSct h4 em{
margin-left: 10px;
color: #666;
font-weight: normal;
}

#keySettingSct table td{
line-height: 20px;
}

#keySettingSct input{
vertical-align: middle;
}

#keySettingSct input#entrypass{
float: left;
width: 143px;
height: 14px;
padding: 2px;
border: 1px solid #d8d8d8;
background-position: 6px 4px;
background-repeat: no-repeat;
line-height: 14px;
}

#keySettingSct table td em{
float: left;
padding-left: 7px;
color: #888;
}

#keySettingSct input#entryKeyOn,
#keySettingSct input#entryKeyOff{
position: relative;
top: -1px;
vertical-align: middle;
}

#keySettingSct label{
color: #808080;
}

#keySettingSct input#entryKeyOn{
margin: 0 5px 0 60px;
}

#keySettingSct input#entryKeyOff{
margin: 0 5px 0 20px;
}


/* aboutGuideline
------------------------- */
#aboutGuideline{
zoom:1;
padding: 20px 0;
background: url(https://images.hange.jp/hangame/community/circlehg_top/create/line_double_gray.gif) repeat-x 0 0;
}

#aboutGuideline h3{
zoom:1;
margin: 0 0 6px;
padding-left: 14px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/ico_exclamation.gif) no-repeat 6px center;
color: #4a4a4a;
}

#aboutGuideline p{
margin: 0 0 13px 15px;
color: #666;
}

#aboutGuideline .reference{
padding: 0 0 0 14px;
background: url(https://images.hange.jp/hangame/common/ico_2x2_gray.gif) no-repeat 8px center;
}

#aboutGuideline .reference a{
color: #666;
text-decoration: underline;
}


/* notes
------------------------- */
#circleCreationForm ul.notes{
margin: 10px 0 0;
padding: 10px 0 20px 15px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/create/line_double_gray.gif) repeat-x 0 0;
}

#circleCreationForm ul.notes li{
padding-left: 10px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/common/ico_hyphen.gif) no-repeat 0 center;
color: #666;
}




/* move_confirm
----------------------------------------------------*/
#circleCreationForm table td.category{
width:159px;
padding: 0 0 0 15px;
background:url(https://images.hange.jp/hangame/community/circlehg_top/common/head/bg_cnditem_ctgrysrch.gif) no-repeat 6px 3px;
}


#circleCreationForm table td .introductionTxt{
width:469px;
padding:5px 10px;
}

#circleCreationForm .mvGuidance{
margin-top:10px;
padding-bottom:20px;
}


#circleCreationForm p.mvGuidance{
background:transparent url(https://images.hange.jp/hangame/common/ico_2x2_gray.gif) no-repeat scroll 8px 6px;
color:#666666;
padding-left:14px;
}


/* move_edit
----------------------------------------------------*/
#circleCreationForm #moveSettingSct{
margin:0 0 15px;
}

#circleCreationForm #aboutGuideline{
color:#666666;
}

#circleCreationForm #aboutGuideline ul{
margin: 0 0 0 10px;
}


#circleCreationForm #aboutGuideline em{
color: #333333;
}

#circleCreationForm .moveReference{
zoom:1;
margin:5px 0 0 0;
}

.searchArea{
position:relative;
}

.searchArea em{
position:absolute;
right:100px;
top:2px;
color:#888888;
line-height:20px;
}

/* move_withdrawal
----------------------------------------------------*/

#guidanceSct{
width:593px;
min-height:96px;
_height:96px;
padding:15px 25px 0;
background:url(https://images.hange.jp/hangame/community/circlehg_top/move/bg_attention.gif) no-repeat 0 0;
color: #999999;
}

#guidanceSct:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#guidanceSct span{
color:#FD7603;
}

#crclLeaveSct .circleArea:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#crclLeaveSct h3.sctTitle{
color:#676767;
margin-top:20px;
}

#crclLeaveSct ul.circleList li.box{
position:relative;
}

#crclLeaveSct h3 span.count{
margin-left:5px;
font-weight:bold;
font-size:11px;
}

#crclLeaveSct .item .withdrawalState{
color:#555555;
float:left;
margin:17px 0 0 18px;
width:270px;
}

#crclLeaveSct .item p.withdrawal{
position:absolute;
top:16px;
right:2px;;
color:#9E9E9E;
}

#crclLeaveSct .item p.withdrawal a{
color:#9E9E9E;
}

/* move_popup_withdrawal
----------------------------------------------------*/

#wraper.popup{
width:450px;
margin:0 auto;
}
#wraper.popup h1{
width:430px;
padding:10px;
background:url(https://images.hange.jp/hangame/community/circlehg_top/move/line_three_color.gif) repeat-x bottom;
color:#53848D;
}

#wraper.popup .withdrawalInfo{
width:450px;
margin-top:20px;
text-align:center;
}

#wraper.popup .withdrawalInfo .attention{
margin-bottom:20px;
color: #888888;
}

#wraper.popup .withdrawalInfo .name{
width:430px;
padding:15px 0;
margin:0 auto 25px;
border:1px solid #E2E2E2;
}

#wraper.popup .withdrawalInfo .name p{
display:inline;
color:#757575;
}

#wraper.popup .withdrawalInfo .name p.circleName{
color:#3B3B3B;
font-weight:bold;
}

#wraper.popup .withdrawalInfo .confirmation{
margin-bottom:30px;
color:#4A4A4A;
font-weight:bold;
}

#wraper.popup .withdrawalInfo .btns{
width:450px;
padding:10px 0 5px;
background: #F6F6F6;
}

#wraper.popup .withdrawalInfo .btns li{
display:inline;
}

/* --------------------------------------------------

 conditionSearch

-------------------------------------------------- */
#conditionSearch{
margin-top: -10px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/search/bg_conditionsearch_btm.gif) no-repeat 0 bottom;
}

#conditionSearch h2{
zoom: 1;
padding-bottom: 10px;
background: #fff url(https://images.hange.jp/hangame/community/circlehg_top/search/bg_conditionsearch_top.gif) no-repeat 0 bottom;
}

#conditionSearch .sectionA{
position: relative;
z-index: 1;
width: 644px;
padding: 3px 0 13px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/search/line_conditionsearch.gif) no-repeat 0 bottom;
line-height: 20px;
}
#conditionSearch .sectionA:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#conditionSearch .sectionB{
z-index: 1;
width: 644px;
padding: 13px 0;
background: url(https://images.hange.jp/hangame/community/circlehg_top/search/line_conditionsearch.gif) no-repeat 0 0;
line-height: 20px;
}
#conditionSearch .sectionB:after{content:".";display:block;height:0;clear:both;visibility:hidden}

#conditionSearch h3.tit{
float: left;
width: 95px;
padding-left: 25px;
color: #757575;
text-align: left;
vertical-align: top;
}

#conditionSearch .cont{
float: left;
}

#conditionSearch .cont input{
position: relative;
top: -3px;
*top: -1px;
vertical-align: middle;
}

#conditionSearch .cont label{
margin-right: 10px;
color: #666;
}

#conditionSearch .cont #slctCtgryLayer{
left: -120px;
top: 23px;
}




/* --------------------------------------------------

 circleInfoList

-------------------------------------------------- */

#circleInfoList{
position: relative;
zoom: 1;
}

#circleInfoList h2{
margin: 0 0 8px 7px;
}

#circleInfoList p.introTxt{
position: absolute;
right: 0;
top: 0;
color: #888;
}

#circleInfoList p.introTxt strong{
color: #454545;
font-weight: normal;
}


#circleInfoList table{
width: 644px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/circle_infolist/bg_mycircleinfoilist_btm.gif) no-repeat 0 bottom;
}

/* thead */
#circleInfoList thead tr{
position: relative;
height: 38px;
z-index: 1;
background: url(https://images.hange.jp/hangame/community/circlehg_top/circle_infolist/bg_mycircleinfoilist_top.gif) no-repeat 0 0;
}

#circleInfoList thead th{
*height: auto;
*background-image: none;
padding-top: 10px;
color: #575757;
font-weight: normal;
}

#circleInfoList thead th.name{
width: 324px;
}

#circleInfoList thead th.info{
width: 210px;
}

#circleInfoList thead th.date{
width: 120px;
}

/* tbody */
#circleInfoList tbody tr{
position: relative;
top: -1px;
background: url(https://images.hange.jp/hangame/community/circlehg_top/circle_infolist/line_dot_gray618.gif) no-repeat center top;
}

#circleInfoList tbody tr:first-child{
background: none;
}

#circleInfoList tbody td{
*background-image: none;
color: #666;
line-height: 32px;
}

#circleInfoList tbody td.info img{
position: relative;
top: -1px;
margin: 0 0 0 3px;
vertical-align: middle;
}

#circleInfoList tbody td.name{
text-indent: 25px;
}

#circleInfoList tbody td.date{
font-family: Verdana, sans-serif;
font-size: 11px;
text-align: center;
}

#circleInfoList tbody td a{
color: #666;
}
