/* ruleBox */
.ruleBox { margin-top: 10px; font-size: 0; }
.ruleBox >div { width: calc(100% - 155px); display: inline-block; font-size: 16px; vertical-align: top; }
.ruleBox .imgBox { margin-right: 20px; width: 135px; background: no-repeat 50% / cover; border-radius: 50%; }

/* sadbox */
.sadbox { overflow: hidden; text-align: center; font-size: 0; }
.sadbox >div { display: inline-block; }
.sadbox ins { width: 500px; height: 250px; }

/* filterBox */
.filterBox { position: relative; }
.filterBox .line label , .filterBox .line font , .filterBox .line select { padding: 5px 0; display: inline-block; vertical-align: middle; }
.filterBox .line label { width: 50px; }
.filterBox .line font a { padding: 0 15px; border-right: 1px #121212 solid; color: #121212; }
.filterBox .line font:last-child a { border-right: 0; }
.filterBox .line select { margin-right:  10px; padding: 5px 10px; }
.filterBox .line.category { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px #e1e1e1 solid; }
.filterBox .other { position: absolute; bottom: 5px; right: 0; text-align: right; font-size: 0; }
.filterBox .other >div {width: 175px;display: inline-block;}
.filterBox .line.kwBox { width: calc(100% - 106px); }
.filterBox .line.kwBox a { padding: 2px; display: inline-block; color: #121212; }

/* .publishBtn */
.publishBtn { text-align: right; }
.publishBtn a { padding: 6px 25px; background: #312f30; border-radius: 5px; display: inline-block; color: #fff; }

/* discuss */
#discuss ul { margin: 15px; }
#discuss ul li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px #ccc solid; }
#discuss ul li .info { position: relative; }
#discuss ul li .dtitle { height: 35px; line-height: 140%; font-size: 15px; -webkit-line-clamp: 1; }
#discuss ul li .dtitle a { font-size: 18px; color: #1a1919; }
#discuss ul li .dtitle a.caText { color: #e30707; }
#discuss ul li .other { width: calc(100% - 130px); }
#discuss ul li .other p { margin-right: 20px; color: #7a7a7a; display: inline-block; line-height: 100%; }
#discuss ul li .other p.lest { padding-left: 20px; border-left: 1px #ccc solid; }
#discuss ul li .other p.lest font { margin-right: 10px; }
#discuss ul li .comm {  position: absolute; right: 0; bottom: 0; }
#discuss ul li .comm font { margin: 0 5px; display: inline-block; color: #494949; }
#discuss ul li .comm font i { margin-right: 2px; }

/* recoveryBox */
#recoveryBox ul li { overflow: hidden; margin-bottom: 20px; border-bottom: 1px #e6e6e6 solid; }
#recoveryBox ul li >div { float: left; width: calc(100% - 70px); }
#recoveryBox ul li .responseBox .memberInfo { font-size: 0; }
#recoveryBox ul li .responseBox .memberInfo .mImg { overflow: hidden; margin-right: 20px; width: 70px; height: 70px; background: no-repeat 50% / cover; border-radius: 50%; display: inline-block; }
#recoveryBox ul li .responseBox .memberInfo .mTxt { width: calc(100% - 90px); display: inline-block; }
#recoveryBox ul li .responseBox .memberInfo .mTxt p { color: #434343; }
#recoveryBox ul li .responseBox .memberInfo .mTxt p b { margin-right: 10px; font-size: 18px; color: #0c57a4; }
#recoveryBox ul li .responseBox .Info { margin: 10px; }
#recoveryBox ul li .ogBtn { margin-left: 15px; width: 55px; }
#recoveryBox ul li .ogBtn p { margin: 5px 0; padding: 2px 0; width: 55px; background: #8f8c8c; text-align: center; font-size: 12px; color: #fff; }
#recoveryBox ul li .ogBtn p:nth-child(2) { background: #e41248; }
#recoveryBox ul li .ogBtn p:nth-child(3) { background: #4a4a4a; }
#recoveryBox ul li .ogBtn p.green { background: #0ba011; }
#recoveryBox ul li .ogBtn p a { font-size: 12px; color: #fff; }
#recoveryBox ul li .ogBtn p a i { margin-right: 3px; }

/* reportBox */
#reportBox { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); top: 0; left: 0; z-index: 999999999; }
#reportBox .info { margin: 15% auto 0; width: 600px; background: #fff; }
#reportBox .info h3 { position: relative; padding: 5px 20px; background: #0c57a4; font-weight: normal; font-size: 18px; color: #fff; }
#reportBox .info h3 a { position: absolute; display: block; color: #fff; top: 5px; right: 20px; }
#reportBox .info >div { padding: 20px; }
#reportBox .info >div p { overflow: hidden; margin-bottom: 20px; }
#reportBox .info >div p.send { margin-bottom: 0; text-align: right; }
#reportBox .info >div p label { width: 100px; float: left; display: block; font-size: 16px; color: #444344; }
#reportBox .info >div p select ,
#reportBox .info >div p textarea { float: right; padding: 5px 15px; width: calc(100% - 108px); border: 1px #9c9c9c solid; border-radius: 5px; background: #ececec; background: -moz-linear-gradient(top,#fff 1%,#ececec 100%); background: -webkit-linear-gradient(top,#fff 1%,#ececec 100%); background: linear-gradient(to bottom,#fff 1%,#ececec 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff',endColorstr='#ececec',GradientType=0); font-size: 16px; }
#reportBox .info >div p textarea { width: calc(100% - 140px); min-height: 150px; }
#reportBox .info >div p a#sendReport { padding: 5px 20px; background: #0c57a4; border-radius: 5px; display: inline-block; font-size: 16px; color: #fff; }

/* convenient */
#convenient { font-size: 0; }
#convenient a { margin-bottom: 7px; padding: 6px 0; background: #585a5b; border-radius: 5px; display: block; text-align: center; font-size: 16px; color: #fff; }
#convenient a.addnew { background: #0c57a4; }
#convenient a.smail { width: calc((100% - 10px) / 2); display: inline-block; }
#convenient a:last-child { margin-left: 10px; }

/* editorInfo */
#editorInfo { margin-top: 15px; }
#editorInfo .newTopic select { width: 200px; }
#editorInfo .newTopic input { margin-left: 10px; width: calc(100% - 210px); }
#editorInfo #OKBtn { padding: 5px 30px; background: #1e1e1e; border-radius: 5px; display: inline-block; font-size: 16px; color: #fff; }

/* ferenceBox */
.ferenceBox { margin-top: 15px; background:#f0f0f0; background:-moz-linear-gradient(top,#fbfbfb 1%,#f0f0f0 100%); background:-webkit-linear-gradient(top,#fbfbfb 1%,#f0f0f0 100%); background:linear-gradient(to bottom,#fbfbfb 1%,#f0f0f0 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbfbfb',endColorstr='#f0f0f0',GradientType=0); border: 1px #dcdcdc solid; border-top: 4px #aaaaaa solid; }
.ferenceBox h6 { margin: 0; padding: 2px 15px; border-bottom: 1px #dcdcdc solid; line-height: 170%; font-size: 14px; color: #a0a0a0; }
.ferenceBox >div { overflow-x: scroll; padding: 5px 15px; max-height: 150px; color: #a0a0a0; }
.ferenceBox >div::-webkit-scrollbar { width: 7px; height: 0; }
.ferenceBox >div::-webkit-scrollbar-track { background: #c5c5c5; }
.ferenceBox >div::-webkit-scrollbar-thumb { background: #004e63; }
.ferenceBox >div::-webkit-scrollbar-thumb:hover { background: #4e5656; }
.ferenceBox >div p { margin: 0; }
.ferenceBox textarea { width: 0; height: 0; opacity: 0; display: none; }

/* catList */
#catList li { position: relative; padding: 15px 25px; border-bottom: 1px #e0e0e0 solid; font-size: 0; }
#catList li a { position: absolute; width: 100%; height: 100%; display: block; top: 0; left: 0; z-index: 2; }
#catList li >div { position: relative; width: calc(100% - 180px); display: inline-block; z-index: 1; }
#catList li .img { margin-right: 30px; width: 150px; height: 150px; background: no-repeat 50% / cover; }
#catList li .info h3 { height: 30px; font-weight: normal; font-size: 18px; -webkit-line-clamp: 1; }
#catList li .info >p label { width: 50px; display: inline-block; vertical-align: top; }
#catList li .info >p font { width: calc(100% - 50px); height: 23px; display: -webkit-inline-box; vertical-align: top; -webkit-line-clamp: 1; }
#catList li .info >p.rul { margin-bottom: 10px; }
#catList li .info >p.rul font { height: 69px; -webkit-line-clamp: 3; }
#catList li .info .list { margin-top: 10px; font-size: 0; }
#catList li .info .list p { margin-right: 20px; display: inline-block; color: #615f5f; }
#catList li .info .list p i { margin-right: 5px; }

@media screen and (max-width: 980px) {
	#catList li .info .list p font.tit { display: none; }
}
@media screen and (max-width: 768px) {
	.filterBox .other { position: relative; }
	#catList li .info >p.rul font { height: 49px; -webkit-line-clamp: 2; }
}
@media screen and (max-width: 640px) {
	.ruleBox >div , #discuss ul li .other , .filterBox .line.kwBox , .filterBox .other >div { width: 100%; }
	.ruleBox .imgBox { margin: 10px auto; display: block; }
	#discuss ul li .comm { position: relative; right: auto; bottom: auto; text-align: right; }
	.sadbox ins { width: 300px; }
}
@media screen and (max-width: 600px) {
	#catList li .img { margin-right: 20px; width: 120px; height: 120px; }
	#catList li .info { width: calc(100% - 140px); }
	#catList li .info >p.rul { margin-bottom: 0; }
	#catList li .info >p.rul font { height: 28px; -webkit-line-clamp: 1; }
	#catList li .info .list { opacity: .7; }
}
@media screen and (max-width: 480px) {
	#discuss ul li .other p , #discuss ul li .other p.lest { margin-right: 5px; padding-left: 0; border-left: 0; line-height: 130%; text-align: right; }
	#catList li .img { margin: 0 auto 10px; width: 50vw; height: 50vw; display: block; }
	#catList li .info { width: 100%; display: block; }
	#catList li .info h3 , #catList li .info .list { text-align: center; }
	#catList li .info >p { display: none; }
}