.cmn { max-width:920px; margin:0 auto;  font-family:sans-serif; }
.cmntitle { padding:0 0 10px 0; font-size:20pt; font-weight:normal; color:#d119a6; }

#cmn_wbox .xuser { float:left; width:75px; background-image:url('image/wbox-arr.png'); background-repeat:no-repeat; background-position:55px 15px; text-align:left; min-height:28px; }
#cmn_wbox .xuser img { width:50px; height:50px; border-style:none; border-radius:25px; }
#cmn_wbox .xuser .xdeficon { display:inline-block; width:50px; height:50px; border-style:none; border-radius:25px; background-color:#e7e7e7; }
#cmn_wbox .xbody { margin:0 0 0 75px; padding:7px 2px; border:2px solid #ddd; border-radius:7px; background-color:#fff; vertical-align:top; text-align:center; }
#cmn_wbox .xeditor { display:inline-block; width:300px; vertical-align:top; }
#cmn_wbox .xeditor textarea { width:99%; }
#cmn_wbox .xnumenu { padding:20px 10px 40px 0; }
#cmn_wbox .xnumenu a { display:inline-block; width:25%; min-width:110px; margin:20px 0 0 5%; padding:5px; box-shadow:inset 0 15px 20px #f4f4f4; border-radius:4px; border:1px solid #d7d7d7; background-color:#e4e4e4; white-space:nowrap; font-size:14pt; color:#333; text-decoration:none; }
#cmn_wbox .xnumenu a i { font-size:11pt; font-style:normal; }
#cmn_wbox .xnumenu a:hover { border-color:#bbb; color:#000; text-decoration:none; }

#cmn_img_box { padding:0 0 2px 9px; text-align:left; font-size:11pt; color:#666; }
#cmn_img_box input[type=file] { width:200px; height:30px; vertical-align:center; font-size:12pt; }
#cmn_img_wait { display:none; padding:2px 5px; background-color:#ffa; color:#660; font-style:italic; }

#cmn_emobox { display:inline-block; width:276px; height:242px; overflow-x:hidden; overflow-y:auto; background-color:#fbfbfb; border-bottom:1px  solid #ddd; vertical-align:top; }
#cmn_emobox iframe { width:100%; height:238px; }
#cmn_emobox .xemo { width:12%; max-width:40px; border-style:none; margin:1px 0 0 1px; cursor:pointer; }
#cmn_emobox.xnone { height:auto; background-color:transparent; border-width:0; text-align:left; }
#cmn_emobox .xbt { display:block; padding:4px; font-size:11pt; color:#888; }
#cmn_emobox .xbt:hover { color:#d119a6; }

#cmnform .xbar { padding:3px 0 0 0; text-align:center; }
#cmnform input[name=submitbt] { font-size:12pt; width:120px; height:35px; }

#cmncms { padding:10px 0 20px 0; text-align:center; color:#000; }
#cmncms .xloading { margin:20px 25px 40px 90px; padding:20px 0 0 0; border-radius:5px; background-color:#e4e4e4; text-align:center; font-size:12pt; font-style:italic; text-shadow:1px 1px 1px #fff; color:#777; }
#cmncms .xloadbt { display:block; max-width:400px; margin:0 auto; padding:20px; border-radius:5px; background-color:#e4e4e4; text-align:center; font-size:14pt; color:#666; text-shadow:1px 1px 1px #fff; }
#cmncms .xloadbt:hover { background-color:#ddd; color:#333; }

.cmn .cm { margin:0 auto; padding:10px 5px 10px 7px; border-bottom:1px dashed #d0d0d0; background-color:#eee; text-align:left; font-size:11pt; }
.cmn .cm a { color:#6e83bd; }
.cmn .cm a:hover { color:#465fa9; }
.cmn .cm .xicon { display:inline-block; box-sizing:border-box; width:56px; vertical-align:top; text-align:center; }
.cmn .cm .xlikelabel { display:inline-block; padding-right:15px; background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAALCAYAAABLcGxfAAABHUlEQVQoU4WQvy/EcBjGn+d6JCISEpaTtvEfaGuQsB6DzSAGC5uxctHYmDguGE0kFonBZPJjIxFxLX+BXMXFICGWS5xvX2mlN7jQd/y8zydv3ocAUK/c9TeVNkWKls/hslCya/WKb6qIRQG+8jl1WiiNvMZZPq/fW0pT1wC7YgBBBMgeyMV4nzBIQ1Pa2ODKcMCwXN0HOf+z+GdEDgzPWWCtXPVJWtl5CUzPsRmW/TMQxSwBgnPDsycYblZdgNtZgoi4pufsUo5Fe3r0r0CO/imJ3OhD9jhnqJIW3naC3o9mdEHQaZMEtz2dnOxzrfek1jTwsvXQ/RmpQxDTLUlwwo6BOX1Jb6SsJaQg3PBnQayBWDWW7aPfF9uErOe/AVG2YQzf1qHlAAAAAElFTkSuQmCC"); background-repeat:no-repeat; background-position:center right; font-size:10pt; color:#e28ace; }
.cmn .cm a.xlikelabel:hover { color:#d119a6; }
.cmn .cm div.xdisplay { width:50px; height:50px; border:1px dashed #ccc; border-radius:26px; }
.cmn .cm a.xdisplay img { width:50px; height:50px; border-style:none; border-radius:26px; }
.cmn .cm .xbody { display:inline-block; box-sizing:border-box; width:calc(100% - 56px); vertical-align:top; }
.cmn .cm .xnum { font-size:10pt; color:#aaa; }
.cmn .cm a.xname { color:#777; }
.cmn .cm a.xname:hover { color:#d119a6; }
.cmn .cm span.xname { color:#999; }
.cmn .cm a.xowner { display:inline-block; padding:1px 5px; border-radius:4px; background-color:#ffd7f6; color:#666; }
.cmn .cm a.xowner i { color:#aaa; font-style:normal; }
.cmn .cm a.xblock { font-size:10pt; color:#ffa498; }
.cmn .cm a.xblock:hover { color:#fd3e25; }
.cmn .cm .xvote { float:right; display:block; padding:1px 5px 0 0; font-size:12pt; font-weight:bold; color:#e98bd3; }
.cmn .cm .xtoolbt { float:right; display:block; width:24px; height:24px; opacity:0.4; }
.cmn .cm .xtoolbt img { width:24px; height:24px; border-style:none; }
.cmn .cm .xtoolbt:hover { opacity:1; }
.cmn .cm .xlikebt { float:right; display:block; box-sizing:border-box; width:24px; height:24px; margin-right:4px; padding:2px; filter:grayscale(1); opacity:0.4; }
.cmn .cm .xlikebt img { width:20px; height:20px; border-style:none; }
.cmn .cm .xlikebt:hover { opacity:0.8; }
.cmn .cm .xlikebt.xliked { filter:none; opacity:1; }
.cmn .cm .addrepbt { display:block; margin:0 2px 0 auto; width:88%; text-align:right; padding:2px 2px 0 0; color:#999; }
.cmn .cm .addrepbt img { border-style:none; width:20px; height:20px; vertical-align:bottom; }
.cmn .cm .addrepbt:hover { background-color:#ffe8ff; color:#000; }
.cmn .cm .xtext { box-sizing:border-box; width:100%; max-width:90vw; overflow-x:auto; padding:2px 2px 2px 20px; text-align:left; font-size:16pt; word-break:break-all; }
.cmn .cm .xtext img { max-width:100%; max-height:500px; }
.cmn .cm .xtext iframe { max-width:100%; max-height:360px; }
.cmn .cm .xlikes { text-align:left; margin:5px 0 3px 40px; font-size:10pt; color:#bbb; }
.cmn .cm .xlikes a { color:#bbb; }
.cmn .cm .xlikes a:hover { color:#d119a6; }
.cmn .cm a.xunlike { background-color:#ccc; border-radius:2px; padding:0 3px; color:#fff; }
.cmn .cm a.xunlike:hover { background-color:#888; color:#fff; }

.cmn p { margin:0; padding:3px 0; }

.cmntop { margin:0 0 10px 0; padding:8px; background-color:#ffd7f6; }
.cmntoptitle { color:#ef58cc; font-size:16pt; margin:0; padding:0 0 0 2px; text-align:left; }
.cmntop .cm { margin-top:10px; border-style:none; background-color:#eee; }
.cmntop .cm div.xdisplay { border:1px dashed #dfb9d6; }

.cmn .cm0 { margin:0 auto; padding:10px 5px 10px 7px; border-bottom:1px dashed #d0d0d0; background-color:#eee; text-align:left; font-size:10pt; color:#bbb; }
.cmn .cm0 a { color:#bbb; }
.cmn .cm0 a:hover { color:#aaa; text-decoration:underline; }

.cmn .reps { margin:0 4px 0 auto; width:88%; font-size:13pt; }
.cmn .rep { min-height:36px; border-top:1px solid #eaeaea; background-image:url('image/reply-gray.png'); background-repeat:no-repeat; background-position:2px 2px; word-break:break-all; }
.cmn .rep:hover { background-color:#ffe8ff; border-color:#ffd8ff; }
.cmn .rep_new { background-color:#eee; animation:cmn_rep_new_anim1 1.2s; }
@keyframes cmn_rep_new_anim1 {
	from { background-color:#ff9de8; }
	to { background-color:#eee; }
	}
.cmn .repicon { float:left; display:inline-block; margin:2px 4px 0 22px; width:32px; height:32px; }
.cmn a.repicon img { width:32px; height:32px; border-radius:16px; border-style:none; }
.cmn .reptext { padding:6px 0 0 0; }
.cmn .rep .xowner { display:inline-block; padding:1px 5px; border-radius:3px; background-color:#ffd7f6; font-size:9pt; color:#777; }
.cmn .rep .xtoolbt { width:18px; height:18px; padding:4px; opacity:0.3; }
.cmn .rep .xtoolbt img { width:18px; height:18px; }
.cmn .rep .xtoolbt:hover { opacity:0.8; }
.cmn .repmore { text-align:right; }
.cmn .repmore a { display:block; padding:1px; color:#bbb; }
.cmn .repmore a:hover { background-color:#ffe8ff; color:#555; }

.cmn .addrep { margin:0 4px 0 auto; width:88%; background-color:#ffe0ff; }
.cmn .addrep form { border-top:1px solid #eaeaea; padding:0 1px 0 22px; background-image:url('image/reply.png'); background-repeat:no-repeat; background-position:2px 2px; font-size:10pt; color:#8c8089; }
.cmn .addrep .xicon { width:32px; height:32px; border-style:none;  border-radius:16px; float:left; margin:0 4px 0 0; }
.cmn .addrep input[type=text] { outline:none; }
.cmn .addrep input[type=button] ,
.cmn .addrep input[type=submit] { box-sizing:border-box; min-width:50px; min-height:35px; }
.cmn .addrep input[type=submit] { font-weight:bold; }
.cmn .addrep input[type=text] ,
.cmn .addrep input[type=button] ,
.cmn .addrep input[type=submit] { box-sizing:border-box; min-height:35px; margin:4px 0 0 0; }

.cmn .rep0 { border-top:1px solid #eaeaea; padding:2px 2px 2px 56px; text-align:left; font-size:10pt; color:#bbb; }
.cmn .rep0 a { color:#bbb; }
.cmn .rep0 a:hover { color:#aaa; text-decoration:underline; }

.cmn .xhide { opacity:0.5; }


.cmn_tool_box { z-index:1; position:absolute; left:0; top:0; display:none; box-sizing:border-box; width:240px; padding:5px 5px 10px 5px; box-shadow:0 0 10px #bbb; border-radius:5px; background-color:#fff; font-size:11pt; }
.cmn_tool_box .xclose { float:right; display:inline-block; width:24px; height:24px; opacity:0.3; }
.cmn_tool_box .xclose:hover { opacity:0.5; }
.cmn_tool_box .xbt { display:block; margin:5px 0 0 0; padding:5px 5px 5px 40px; box-shadow:inset 0 12px 15px #fafafa; border-radius:5px; border:1px solid #ddd; background-color:#eee; text-align:left; font-size:12pt; font-weight:bold; color:#555; }
.cmn_tool_box .xbt img { border-style:none; vertical-align:middle; opacity:0.5; }
.cmn_tool_box .xbt:hover { border-color:#aaa; color:#000; }
.cmn_tool_box .xbt:hover img { opacity:1; }
.cmn_tool_box .xdel { color:#d00; }
.cmn_tool_box .xdate { display:block; padding:5px 0 2px 0; color:#888; }
.cmn_tool_box .xip { font-size:10pt; color:#bbb; }

.cmn_tool_eff ,
.cmn_tool_eff_anim { position:absolute; left:0; top:0; width:160px; height:160px; }
.cmn_tool_eff { display:none; }
.cmn_tool_eff_anim { display:inline-block; animation:cmn_tool_eff_anim1 1.2s; }
@keyframes cmn_tool_eff_anim1 {
	0% { transform:scale(0.2,0.2); opacity:1; }
	80% { transform:scale(1,1); opacity:0; }
	100% { transform:scale(1,1); opacity:0; }
	}

#cmnnewalert { display:none; padding:0 0 0 65px; }
#cmnnewalert a { display:block; margin:10px 0 0 0; padding:15px 5px; background-color:#ffa; text-align:center; font-size:11pt; font-weight:normal; color:#8c8c4d; }
#cmnnewalert a:hover { box-shadow:0 0 10px #bbb; }
#cmnnewalert.fixbottom { z-index:1; position:fixed; width:100%; left:0; bottom:0; padding:0; }
#cmnnewalert.fixbottom a { padding:5px; }

#cmn_preload_box { padding:15px 0 15px 0; text-align:center; }

#cmn2mb_bg { z-index:1; position:absolute; left:0; top:0; display:none; visibility:hidden; opacity:0.8; background-color:#000; }
#cmn2mb_box { z-index:2; position:absolute; left:0; top:0; display:none; visibility:hidden; padding:5px; border-radius:10px; background-color:#fff; }
#cmn2mb_box .xclose { display:block; width:40px; margin:0 0 0 auto; padding:5px 0; text-align:center; font-size:15pt; color:#888; text-decoration:none; }
#cmn2mb_box .xclose:hover { color:#d00; text-decoration:none; }
#cmn2mb_box .xbody { padding:0 50px 40px 50px; text-align:center; font-size:15pt; color:#666; }
#cmn2mb_box .xbt { display:inline-block; padding:5px 10px; border:1px solid #ddd; background-color:#eee; box-shadow:inset 0 10px 10px #fff; color:#d119a6; }
#cmn2mb_box .xbt:hover { border-color:#bbb; }

#cmn_wq_box { display:none; position:absolute; left:0; top:0; padding:10px 0 0 0; background-image:url('image/wq-arrow.png'); background-repeat:no-repeat; background-position:5px 0; font-size:11pt; color:#666; }
#cmn_wq_body { width:150px; min-height:20px; padding:3px; border:2px solid #ccc; border-radius:6px; background-color:#eee; }
#cmn_wq_body .xl { display:block; max-width:100%; overflow:hidden; border-bottom:1px solid #ddd; white-space:nowrap; color:#444; }
#cmn_wq_body .xl img { width:28px; height:28px; border:1px solid #ddd; border-radius:15px; vertical-align:middle; }
#cmn_wq_body .active { border-color:#ccc; background-color:#ddd; color:#000; }

.cmn_repform .xicon { float:left; width:32px; height:32px; border-style:none; border-radius:16px; margin:0 4px 0 0; }
.cmn_repform input { box-sizing:border-box; height:36px; vertical-align:middle; font-size:12pt; }
.cmn_repform input[name=text] { width:calc(100% - 180px); }
.cmn_repform input[name=name] { width:80px; }
.cmn_repform input[type=submit] ,
.cmn_repform input[type=button] { width:60px; }

.cmn_ad1cover { padding:20px 0 12px 0; text-align:center; }
.cmn_ad1 { width:320px; height:100px; }
.cmn_ad2 { width:300px; height:250px; }
@media(min-width:468px) { .cmn_ad1 , .cmn_ad2 { width:468px; height:90px; } }
@media(min-width:728px) { .cmn_ad1 , .cmn_ad2 { width:728px; height:90px; } }
@media(min-width:970px) { .cmn_ad1 , .cmn_ad2 { width:970px; height:90px; } }

@media(max-width:700px){
	.cmn .cm .xtext { max-width:85vw; }
	}
@media(max-width:500px){
	#cmn_wbox .xuser { display:none; }
	#cmn_wbox .xbody { display:block; margin-left:0; }
	#cmn_wbox .xeditor { display:block; }
	#cmn_emobox { width:99%; height:220px; }
	#cmn_emobox iframe { width:99%; height:220px; }
	#cmncms .xloading { margin:20px 10px; }
	.cmn .cm .xtext { max-width:83vw; padding-left:5px; }
	.cmn .addrep { width:96%; }
	.cmn .reps { width:96%; }
	.cmn_repform input[name=text] { width:calc(100% - 50px); }
	}
@media(max-width:400px){
	.cmn .cm .xtext { max-width:80vw; }
	}
@media(max-width:350px){
	.cmn .cm .xtext { max-width:78vw; }
	}