@charset "UTF-8";
#main {
	margin:0 0 20px 0;
	padding:20px 2%;
	border-top:1px solid #1a3a3a;
	border-bottom:1px solid #1a3a3a;
	background:url(../img/common/bg_main.png) repeat left top;
}
/* ========================================
	mdl
======================================== */
#mdl_avatar,
#mdl_playstyle {
	display:none;
}
#mdl_avatar.mdl_top,
#mdl_playstyle.mdl_top,
#mdl_comment.mdl_top {
	position:absolute;
	top:0;
	left:2%;
	width:96%;
	background:url(../img/common/bg_mdl.png) repeat center top;
	z-index:16000;
}
#mdl_avatar .mdl_btm,
#mdl_playstyle .mdl_btm,
#mdl_comment .mdl_btm {
	padding:5px;
	background:url(../img/common/mdl_corner_lt.png) no-repeat left top,url(../img/common/mdl_corner_lb.png) no-repeat left bottom,url(../img/common/mdl_corner_rt.png) no-repeat right top,url(../img/common/mdl_corner_rb.png) no-repeat right bottom;
	background-size:10px,10px,10px,10px;
}
#mdl_avatar .mdl_mid,
#mdl_playstyle .mdl_mid,
#mdl_comment .mdl_mid {
	padding:10px;
	border:1px solid #535353;
	background:rgba(0,0,0,0.4);
}
#mdl_avatar .mdl_contents {}
#mdl_avatar .mdl_contents .scrollArea {}
#mdl_avatar .mdl_contents dl {
	position:relative;
	background:url(../img/common/line_tit.png) no-repeat center top;
	background-size:100% 1px;
}
#mdl_avatar .mdl_contents dt {
	margin:0 0 10px 0;
	background:url(../img/common/line_tit.png) no-repeat center bottom;
	background-size:100% 1px;
	color:#fff;
	font-size:14px;
	text-align:center;
	line-height:26px;
	text-shadow: 0px 0px 10px rgba(64, 134, 133, 1);
}
#mdl_avatar .mdl_contents dd li {
	position:relative;
	float:left;
	width:31%;
	height:115px;
	margin:0 0 5px 1%;
	border:1px solid #707070;
	background:rgba(0,0,0,0.5);
	overflow:hidden;
	cursor:pointer;
}
#mdl_avatar .mdl_contents dd li span {
	display:block;
	position:absolute;
	top:0;
	right:0;
	width:100%;
	height:115px;
}
#mdl_avatar .mdl_contents dd li.current {
	border:1px solid #ffd99a;
}
#mdl_avatar .mdl_contents dd li.current span {
	background:url(../img/common/icon_tabarrow_orange.png) no-repeat 99% 1%;
	background-size:6px;
	box-shadow:rgba(255, 162, 0, 0.498039) 0px 0px 13px 0px inset;
	-webkit-box-shadow:rgba(255, 162, 0, 0.498039) 0px 0px 13px 0px inset;
	-moz-box-shadow:rgba(255, 162, 0, 0.498039) 0px 0px 13px 0px inset;
}
#mdl_avatar .mdl_contents .btn {
	width:155px;
	margin:20px auto 0 auto;
}
#mdl_avatar .mdl_contents .btn p,
#mdl_comment .mdl_contents p.close {
	width:153px;
	margin:0 0 10px 0;
	border:1px solid #e69521;
	background:rgba(240,134,30,0.2);
	color:#fff;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	line-height:38px;
	cursor:pointer;
}
#mdl_avatar .mdl_contents .btn p.close,
#mdl_comment .mdl_contents p.close {
	width:153px;
	margin:0;
	border:1px solid #959595;
	background:rgba(255,255,255,0.2);
	color:#fff;
	font-size:14px;
	font-weight:bold;
	line-height:38px;
	cursor:pointer;
	line-height:38px;
}
#mdl_comment .mdl_contents p.txt {
	padding:20px 0;
	color:#fff;
	font-size:14px;
	font-weight:bold;
	text-align:center;
}
#mdl_comment .mdl_contents p.close {
	margin:0 auto 20px auto;
}
#mdl_playstyle.mdl_top {
	top:20px;
}
#mdl_playstyle .close {
	position:absolute;
	top:-10px;
	right:0;
	width:25px;
	height:25px;
	cursor:pointer;
	z-index
}
#mdl_playstyle dt {
	margin:0 0 20px 0;
	background:url(../img/common/line_tit.png) no-repeat center top;
	background-size:100%;
	text-align:center;
}
#mdl_playstyle dt span {
	display:block;
	padding:5px 0;
	background:url(../img/common/line_tit.png) no-repeat center bottom;
	background-size:100%;
	color:#fff;
	font-size:16px;
	font-weight:bold;
	text-shadow:0px 1px 7px rgba(64, 134, 133, 1);
}
#mdl_playstyle dd.txt {
	margin:0 0 10px 0;
	color:#b5b5b5;
	font-size:12px;
}
#mdl_playstyle dd.img {
	margin:0 0 10px 0;
	padding:10px;
	border:1px solid #535353;
	background:rgba(1,0,1,0.4);
}
#mdl_playstyle dd.img li .img {
	float:left;
}
#mdl_playstyle dd.img li .txt {
	color:#a0a0a0;
	font-size:12px;
}
#mdl_playstyle dd.img li .txt .tit {
	display:block;
	color:#dcdcdc;
	font-size:16px;
	font-weight:bold;
}
#mdl_playstyle .btn {
	width:140px;
	margin:20px auto;
	border:1px solid #959595;
	background:rgba(255,255,255,0.2);
	text-align:center;
}
#mdl_playstyle .btn p {
	display:block;
	color:#fff;
	font-size:14px;
	font-weight:bold;
	line-height:35px;
}
#bgmdl_loading,
.loader {
	position:absolute;
}
.loader {
	width:3em;
	height:3em;
}
/* ========================================
	sitebady
======================================== */
#frendStatus {
	padding:10px;
	background:rgba(15,44,57,0.8);
}
#frendStatus dl {
	padding:10px 10px 0 10px;
	border:1px solid #408685;
	background:rgba(0,17,17,0.6);
}
#frendStatus dl dt {
	margin:0 0 10px 0;
	color:#fff;
	font-size:12px;
}
#frendStatus dl dt span,
#frendStatus dl dt a {
	color:#ee7700;
}
#frendStatus dd .sitebady a {
	display:block;
	width:100%;
	margin:0 0 10px 0;
	border-radius:4px;
	border:1px solid #1acfcc;
	background:rgba(49,161,159,0.3);
	color:#fff;
	font-size:12px;
	font-weight:bold;
	text-shadow: 0px 0px 8px rgba(64, 134, 133, 1);
	text-align:center;
	line-height:36px;
}
#frendStatus.sitebady dd .sitebady a span {
	padding: 1px 0 1px 25px;
	background:url(../img/overview/icon_sbapp.png) no-repeat left center;
}
#frendStatus dd .delete a {
	display:block;
	width:100%;
	margin:0 0 10px 0;
	border-radius:4px;
	border:1px solid #a0a0a0;
	background:rgba(112,112,112,0.3);
	color:#fff;
	font-size:12px;
	font-weight:bold;
	text-shadow: 0px 0px 8px rgba(160, 160, 160, 1);
	text-align:center;
	line-height:36px;
	transition:box-shadow 0.5s,-webkit-box-shadow 0.5s,-moz-box-shadow 0.5s;
}

/* ========================================
	userBox
======================================== */
.userBox {
	position:relative;
	margin:0 0 4px 0;
	padding:45px 10px 10px 10px;
	border:1px solid #1a3a3a;
	background:url(../img/common/bg_dots_black5.png) repeat left top;
}
.userBox .ptf {
	position:absolute;
	top:-5px;
	left:-3px;
	width:113px;
	padding:0 40px 0 0;
	background:url(../img/overview/bg_ptf.png) no-repeat left top;
	background-size:153px;
	text-align:center;
	line-height:40px;
}
.userBox .ptf img.steam {
	max-width:80%;
}
.userBox .oid {
	position:absolute;
	top:0;
	left:109px;
	min-width:90px;
	height:37px;
	padding:0 0 0 40px;
	background:url(../img/overview/bg_oid.png) no-repeat left top;
	background-size:186px;
	color:#408685;
	font-size:12px;
	font-style:italic;
	font-weight:bold;
}
.userBox .oid span {
	display:block;
	color:#aabfbd;
}
.userBox .icon {
	clear:both;
	float:left;
	width:48px;
	height:48px;
	margin:0 10px 0 0;
	border:1px solid #555;
}
.userBox .icon a {
	display: block;
	width: 48px;
	height: 48px;
	overflow: hidden;
}
.userBox dl {
	position:relative;
}
.userBox .name {
	height:28px;
	overflow:hidden;
}
.userBox .name a {
	color:#c9c9c9;
	font-size:16px;
	font-weight:bold;
}
.userBox .profile {
	position:absolute;
	top:26px;
	left:60px;
}
.userBox .profile a {
	display:block;
	padding:0 10px;
	border-radius:50px;
	border:1px solid #408685;
	color:#408685;
	font-size:12px;
	font-weight:bold;
	line-height:20px;
}
.userBox .profile a span {
	padding:0 0 0 20px;
	background:url(../img/overview/arrow_profile.png) no-repeat left center;
	background-size:12px;
}
/* ========================================
	avatarBox
======================================== */
.avatarBox {
	position:relative;
	min-height:168px;
	margin:0 0 4px 0;
	padding:10px;
	border:1px solid #1a3a3a;
	background:url(../img/common/bg_dots_black5.png) repeat left top;
	overflow:hidden;
}
.avatarBox .character {
	position:absolute;
	top:0;
	left:0;
	width:40%;
}
.avatarBox .character dt {
	width:150px;
	margin:0 auto;
}
.avatarBox .character dd {
	position:absolute;
	top:165px;
	left:10px;
	width:22px;
	height:22px;
}
.avatarBox .status {
	padding:20px 0 0 40%;
}
.avatarBox .status .exp dt {
	color:#85a7a5;
	font-size:14px;
	font-weight:bold;
	text-align:center;
}
.avatarBox .status .exp dt span {
	display:block;
	color:#fff;
	font-size:44px;
	font-weight:bold;
}
.avatarBox .status .exp dd {
	color:#85a7a5;
	font-size:14px;
}
.avatarBox .status .exp dd span {
	color:#fff;
}
.avatarBox .status .expGraf p.graf {
	width:100%;
	height:15px;
	margin:5px 0;
	border:1px solid #fff;
	background:#000;
	overflow:hidden;
}
.avatarBox .status .expGraf p.graf .expBar {
	display:block;
	width:0;
	height:100%;
	overflow:hidden;
}
.avatarBox .status .expGraf p.graf .expBar span {
	display:block;
	background: #ffb400;
	background: -moz-linear-gradient(left,  #ffb400 0%, #ff9000 100%, #ff9000 100%);
	background: -webkit-linear-gradient(left,  #ffb400 0%,#ff9000 100%,#ff9000 100%);
	background: linear-gradient(to right,  #ffb400 0%,#ff9000 100%,#ff9000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb400', endColorstr='#ff9000',GradientType=1 );
	text-indent:-99999px;
}
.avatarBox .status .expGraf p.next {
	color:#85a7a5;
	font-size:14px;
}
.avatarBox .status .expGraf p.next span {
	color:#fff;
}
/* ========================================
	styleBox - decalBox
======================================== */
/*.styleBox {
	position:relative;
	float:left;
	width:66%;
	margin:0 0 4px 0;
	overflow:hidden;
}
.styleBox .inner {
	border:1px solid #1a3a3a;
	background:url(../img/common/bg_dots_black5.png) repeat left top;
}
.styleBox .img {
	float:left;
	width:50%;
	height:auto;
}
.styleBox .img span {
	display:block;
	width:80px;
	height:80px;
	margin:0 auto;
	padding:5px;
}
.styleBox ul {
	margin:5px 0 0 0;
}
.styleBox li {
	margin:0 0 5px 0;
	color:#85a7a5;
	font-size:10px;
}
.styleBox li span {
	display:block;
	color:#c9c9c9;
}
.styleBox li span.name {
	color:#fff;
	font-size:12px;
	font-weight:bold;
	text-shadow: 0px 0px 10px rgba(65, 135, 133, 1);
	line-height:1.2;
}
.decalBox {
	position:relative;
	float:right;
	width:33%;
	margin:0 0 4px 0;
	overflow:hidden;
}
.decalBox .inner {
	border:1px solid #1a3a3a;
	background:rgba(255,255,255,0.2);
}
.decalBox .img {
	width:80px;
	height:80px;
	margin:0 auto;
	padding:5px;
}
.decalBox .img span {
	position:absolute;
	top:0;
	left:0;
}
.decalBox .settingDecal {
	position:absolute;
	top:10px;
	right:10px;
	width:22px;
	height:22px;
}*/
.decalBox .playstyle {
	position:relative;
	float:left;
	width:49%;
	height:225px;
	margin:0 2% 10px 0;
	border:1px solid #1a3a3a;
	background:rgba(17,17,17,0.5);
	box-sizing:border-box;
	overflow:hidden;
}
.decalBox .decal {
	position:relative;
	float:left;
	width:49%;
	height:225px;
	margin:0 0 10px 0;
	border:1px solid #1a3a3a;
	background:rgba(17,17,17,0.5);
	box-sizing:border-box;
	overflow:hidden;
}
.playstyle dt,
.decal dt {
	height:129px;
	padding:10px;
	text-align:center;
}
.playstyle dt img,
.decal dt img {
	width:129px;
	height:auto;
	-webkit-filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.2));
	-moz-filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.2));
	-ms-filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.2));
	-o-filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.2));
	filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.2));
}
.playstyle dd.styleName,
.decal dd.decalName {
	color:#85a7a5;
	font-size:14px;
	font-weight:bold;
	text-align:center;
}
.playstyle dd.styleName .name,
.decal dd.decalName span {
	display:block;
	color:#fff;
	text-shadow:0px 0px 10px rgba(65, 135, 133, 1);
}
.decal dd.decalName span {
	display:inline;
}
.playstyle dd.styleName .time {
	color:#85a7a5;
	font-size:10px;
	font-weight:bold;
}
.playstyle dd.styleName .time span {
	color:#fff;
}
.playstyle .styleDetail,
.decal .settingDecal{
	position:absolute;
	top:224px;
	left:0;
	width:100%;
	height:173px;
	padding:40px 0 10px 0;
	background:url(../img/common/bg_chk_black.png) repeat left top;
	color:#85a7a5;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	transition:top 0.5s;
}
.playstyle .styleDetail .name,
.decal .settingDecal .name {
	display:block;
	margin:0 0 10px 0;
	padding:0 0 10px 0;
	background:url(../img/overview/line_green.png) no-repeat center bottom;
	background-size:17px;
	color:#fff;
	text-shadow:0px 0px 10px rgba(65, 135, 133, 1);
}
.playstyle .styleDetail .txt {
	color:#b5b5b5;
	font-size:12px;
}
.decalBox .decal dd span.type01 {
	padding:0 0 0 20px;
	background:url(../img/overview/decal_type01.png) no-repeat left center;
	background-size:26px;
}
.decalBox .decal dd span.type02 {
	padding:0 0 0 20px;
	background:url(../img/overview/decal_type02.png) no-repeat left center;
	background-size:26px;
}
.decalBox .decal dd span.type03 {
	padding:0 0 0 20px;
	background:url(../img/overview/decal_type03.png) no-repeat left center;
	background-size:26px;
}
.decalBox .settingDecal a {
	display:block;
	position:absolute;
	bottom:90px;
	left:50%;
	width:117px;
	padding:5px;
	margin:0 0 0 -63px;
	border-radius:4px;
	border:1px solid #777;
	background:url(../img/overview/arrow_style.png) no-repeat 95% center;
	background-size:10px;
}
.decalBox .settingDecal a span {
	padding:0 0 0 25px;
	background:url(../img/overview/icon_setting.png) no-repeat left center;
	background-size:25px;
	color:#fff;
	font-size:12px;
	font-weight:bold;
	text-shadow:0px 0px 10px rgba(65, 135, 133, 1);
}
.playstyle .styleDetail .close,
.decal .settingDecal .close {
	position:absolute;
	top:10px;
	right:10px;
}
.playstyle .styleDetail .help {
	position:absolute;
	bottom:10px;
	left:50%;
	margin:0 0 0 -11px;
}
/* ========================================
	commentBox
======================================== */
.commentBox {
	clear:both;
	position:relative;
	margin:0 0 4px 0;
	border:1px solid #1a3a3a;
	background:url(../img/common/bg_dots_black5.png) repeat left top;
	overflow:hidden;
}
.commentBox dt {
	position:relative;
	width:96%;
	margin:-1px 0 15px -1px;
	padding:0 2%;
	background:url(../img/common/bg_boxname.png) no-repeat left center;
	background-size:130px 100%;
	color:#408685;
	font-size:14px;
	font-weight:bold;
	line-height:26px;
}
.commentBox dt .btn {
	position:absolute;
	top:5px;
	right:10px;
	width:22px;
	height:22px;
}
.commentBox dt .txtNum {
	display:none;
	position:absolute;
	top:10px;
	right:10px;
	color:#fff;
	font-size:12px;
}
.commentBox dd.entry {
	position:relative;
	min-height:84px;
	margin:0 0 10px 0;
	padding:0 10px;
	color:#c9c9c9;
	font-size:14px;
	word-break:break-all;
	overflow:hidden;
}
.commentBox dd.entry textarea {
	width:96%;
	min-height:84px;
	padding:5px 2%;
	border:1px solid #EE7700;
	background:rgba(0,0,0,0);
	color:#fff;
}
.commentBox dd .commentBg {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:98%;
	height:100%;
	margin:0 1%;
	border-radius:4px;
	background:url(../img/common/bg_dots_green2.png) repeat left top;
	box-shadow:rgba(37, 205, 199, 0.247059) 0px 0px 25px 0px inset;
	-webkit-box-shadow:rgba(37, 205, 199, 0.247059) 0px 0px 25px 0px inset;
	-moz-box-shadow:rgba(37, 205, 199, 0.247059) 0px 0px 25px 0px inset;
}
.commentBox dd.btn {
	display:none;
	width:235px;
	margin:0 auto 10px auto;
	
}
.commentBox dd.btn .back {
	float:left;
	width:110px;
	margin:0 10px 0 0;
	border-radius:4px;
	border:1px solid #959595;
	background:url(../img/common/bg_dots_gray2.png) repeat left top;
	color:#fff;
	font-size:14px;
	line-height:40px;
	text-align:center;
	cursor:pointer;
}
.commentBox dd.btn .save {
	float:left;
	width:110px;
	margin:0;
	border-radius:4px;
	border:1px solid #1acfcc;
	background:url(../img/common/bg_dots_green2.png) repeat left top;
	color:#fff;
	font-size:14px;
	line-height:40px;
	text-align:center;
	cursor:pointer;
}
/* ========================================
	activityBox
======================================== */
.activityBox {
	position:relative;
	margin:0 0 4px 0;
	border:1px solid #1a3a3a;
	background:url(../img/common/bg_dots_black5.png) repeat left top;
	overflow:hidden;
}
.activityBox  dt {
	position:relative;
	width:96%;
	margin:-1px 0 15px -1px;
	padding:0 2%;
	background:url(../img/common/bg_boxname.png) no-repeat left center;
	background-size:136px;
	color:#408685;
	font-size:14px;
	font-weight:bold;
	line-height:26px;
}
.activityBox  dd.list {
	width:284px;
	margin:0 auto;
	padding:0 10px 10px 10px;
	overflow:hidden;
}
/*result*/
.activityBox dd ul:first-child {}
.activityBox dd li.result {
	float:left;
	width:285px;
	margin:0 10px 0 0;
}
.activityBox dd li.nodata {
	margin:20px 0 30px 0;
	color:##707070;
	font-size:16px;
	font-weight:bold;
	text-align:center;
}
.activityBox dd li .txt {
	position:relative;
	margin:0 0 10px 0;
}
.activityBox dd li .icon {
	float:left;
	border:1px solid #555;
}
.activityBox dd li .title {
	display:block;
	min-height:34px;
	padding:0 30px 0 45px;
	color:#fff;
	font-size:12px;
	font-weight:bold;
}
.activityBox dd li .time {
	position:absolute;
	bottom:0;
	right:0;
	display:block;
	padding:0 10px 0 45px;
	color:#898989;
	font-size:11px;
	font-style:italic;
}
.activityBox dd li .stage {
	width:99%;
	height:118px;
	border:1px solid #555;
	color:#fff;
	font-size:50px;
	font-weight:bold;
	text-align:center;
	letter-spacing:10px;
	line-height:1;
}
.activityBox dd li .stage span {
	display:block;
	padding:20px 0 10px 0;
	color:#fff;
	font-size:14px;
	font-weight:bold;
	letter-spacing:1px;
}
.activityBox dd li.four .stage .rankTxt {
	float:left;
	margin:30px 15px 0 90px;
	padding:0;
	font-size:19px;
	line-height:1;
}
.activityBox dd li.four .stage .rankNum {
	float:left;
	padding:0;
	font-size:58px;
	line-height:1;
}
.activityBox dd li .stage.s01 {
	background:url() no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s02 {
	background:url(../img/activity/act_s02_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s03 {
	background:url(../img/activity/act_s03_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s03_02 {
	background:url(../img/activity/act_s03_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s03_four {
	background:url(../img/activity/act_s03_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s04 {
	background:url(../img/activity/act_s04_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s05 {
	background:url(../img/activity/act_s05_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s05_02 {
	background:url(../img/activity/act_s05_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s05_four {
	background:url(../img/activity/act_s05_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s06 {
	background:url(../img/activity/act_s06_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s06_02 {
	background:url(../img/activity/act_s06_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s06_four {
	background:url(../img/activity/act_s06_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s07 {
	background:url(../img/activity/act_s07_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s07_02 {
	background:url(../img/activity/act_s07_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s07_four {
	background:url(../img/activity/act_s07_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s08 {
	background:url(../img/activity/act_s08_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s08_02 {
	background:url(../img/activity/act_s08_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s08_four {
	background:url(../img/activity/act_s08_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s09 {
	background:url(../img/activity/act_s09_mdsajkbfleuwjkasm_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s09_four {
	background:url(../img/activity/act_s09_mdsajkbfleuwjkasm_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s10 {
	background:url(../img/activity/act_s10_nreuiaxmfasdl_a.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li .stage.s10_four {
	background:url(../img/activity/act_s10_nreuiaxmfasdl_b.jpg) no-repeat center top;
	background-size:auto 100%;
}
.activityBox dd li table {
	width:100%;
	height:0;
	font-size:12px;
	overflow:hidden;
}
.activityBox dd li table th {
	width:215px;
	padding:10px 0 10px 10px;
	border-bottom:1px solid #000;
	background:url(../img/overview/th_result.png) repeat left top;
	color:#fff;
	font-weight:bold;
}
.activityBox dd li table th.green {
	text-shadow: 0px 1px 7px rgba(64, 134, 133, 1);
}
.activityBox dd li table th.red {
	text-shadow: 0px 1px 7px rgba(238, 119, 0, 1);
}
.activityBox dd li table td {
	width:215px;
	padding:10px 5px;
	border-bottom:1px solid #000;
	background:url(../img/overview/td_result.png) repeat left top;
	color:#a0a0a0;
	font-weight:bold;
}
.activityBox dd li table tr:last-child td {
	border-bottom:none;
}
.activityBox dd li table td a {
	display:block;
	height:18px;
	color:#fff;
	text-decoration:underline;
	word-break:break-all;
	overflow:hidden;
}
.activityBox dd li table td a:hover {
	text-decoration:none;
}
.activityBox dd li table td img {
	margin:0 5px 0 0;
}
.activityBox dd li table td.unknown {
	padding:0 0 0 25px;
	color:#a0a0a0;
}
.activityBox dd.ui {
	margin:0 auto;
	padding:0 0 10px 0;
}
.activityBox dd.ui ul {
	float:left;
}
.activityBox dd.ui p.left {
	float:left;
	margin:0 7px 0 0;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity:0;
}
.activityBox dd.ui p.right {
	float:left;
	margin:1px 0 0 0;
	transform:rotate(180deg);
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
}
.activityBox dd.ui li {
	float:left;
	width:10px;
	height:10px;
	margin:4px 7px 0 0;
	border-radius:50px;
	border:2px solid #408685;
}
.activityBox dd.ui li.current {
	background:#408685;
}
/* ========================================
	graf
======================================== */
.grafBox {
	position:relative;
}
.grafBox h3 {
	float:left;
	width:257px;
	margin:0 0 10px -2%;
}
.grafBox .time {
	position:absolute;
	top:4px;
	right:2%;
	margin:8px 0 0 0;
	color:#aabfbd;
	font-size:10px;
}
.grafBox .time span {
	color:#898989;
}
.statsBox {
	clear:both;
	position:relative;
	margin:0 0 4px 0;
	border:1px solid #1a3a3a;
	background:url(../img/common/bg_dots_black5.png) repeat left top;
	overflow:hidden;
}
.statsBox h4 {
	float:left;
	position:relative;
	margin:0 0 15px 0;
	padding:0 21px 0 0;
	background:url(../img/common/bg_boxname_right.png) no-repeat right center;
	background-size:21px 100%;
}
.statsBox h4 span {
	display:block;
	padding:0 5px;
	background:url(../img/common/bg_boxname_mid.png) repeat-x left center;
	background-size:auto 100%;
	color:#408685;
	font-size:14px;
	font-weight:bold;
	line-height:26px;
}
/*totalTime*/
.statsBox.totalTime {
	position:relative;
}
.statsBox.totalTime .inner {
	position:relative;
	width:305px;
	margin:0 auto;
}
.statsBox.totalTime #totalGraf {
	clear:both;
	float:left;
}
.statsBox.totalTime p.total {
	position:absolute;
	top:103px;
	left:60px;
	color:#85a7a5;
	font-size:16px;
	font-weight:bold;
	line-height:1.2;
}
.statsBox.totalTime ul {
	padding:40px 0 20px 0;
}
.statsBox.totalTime ul li p {
	margin:0 10px 0 0;
	color:#fff;
	font-weight:bold;
	text-align:right;
}
.statsBox.totalTime li.total {
	color:#85a7a5;
}
.statsBox.totalTime li.onelife {
	color:#ffa200;
}
.statsBox.totalTime li.multi {
	color:#408685;
}
.statsBox.totalTime li.four {
	color:#1e89bb;
}
/*W_L*/
.statsBox.winPer .inner {
	clear:both;
	position:relative;
	width:305px;
	margin:0 auto;
}
.statsBox.winPer ul {
	float:left;
	width:130px;
	padding:0 10px;
}
.statsBox.winPer ul li {
	margin:0 0 10px 0;
	color:#85a7a5;
	font-size:14px;
	font-weight:bold;
}
.statsBox.winPer ul li span {
	float:right;
	color:#fff;
}
.statsBox.winPer .wl_Percent {
	position:absolute;
	top:95px;
	left:210px;
	color:#85a7a5;
	font-size:18px;
	font-weight:bold;
	line-height:1.2;
}
/*weapon*/
.statsBox.weapon {
	margin:0 0 20px 0;
}
.statsBox.weapon ul {
	clear:both;
	padding:10px 0;
}
.statsBox.weapon li {
	float:left;
	width:33%;
}
.statsBox.weapon li .img {
	margin:0 0 10px 0;
	padding:0 10px;
	text-align:center;
}
.statsBox.weapon dl {
	padding:0 10px;
}
.statsBox.weapon dt {
	margin:0 0 10px 0;
	color:#fff;
	font-size:14px;
}
.statsBox.weapon dd {
	margin:0 0 10px 0;
	color:#fff;
	font-size:14px;
	text-align:right;
}
.statsBox.weapon dd span {
	display:block;
	float:left;
	color:#85a7a5;
	font-size:14px;
}
.statsBox.weapon .noWeapon {
	width:100%;
	margin:0 0 20px 0;
	color:#fff;
	font-weight:bold;
	text-align:center;
}
/* ========================================
	graf
======================================== */
.grafTab {
	border-right:1px solid #1a3a3a;
	border-left:1px solid #1a3a3a;
}
.grafTab li {
	float:left;
	width:33.33%;
	/*width:50%;*/
	padding:2px 0;
	border-top:1px solid #1a3a3a;
	border-bottom:1px solid #1a3a3a;
	background:#000;
}
.grafTab li.current {
	margin:-1px 0 0 0;
	padding:2px 0 3px 0;
	border-top:2px solid #5a918f;
	border-bottom:none;
}
.grafTab li span {
	display:block;
	height:25px;
	padding:5px 0 0 0;
	border-right:1px solid #1a3a3a;
	background:url(../img/overview/arrow_tab.png) no-repeat center 17px;
	background-size:24px;
	color:#408685;
	font-size:10px;
	font-weight:bold;
	text-align:center;
}
.grafTab li.current span {
	background:url(../img/overview/arrow_tab_on.png) no-repeat center 17px;
	background-size:24px;
}
.grafTab li:last-child span {
	border-right:none;
}
/*grafArea*/
.grafArea:nth-of-type(1) {
	display:block;
}
.grafArea .statsBox {
	border-top:none;
	background:#000;
}
.grafArea.onelife .inner div,
.grafArea.multi .inner div,
.grafArea.four .inner div  {
	position:relative;
	margin:0 0 0 10px;
	padding:10px 0 0 0;
	border-bottom:1px solid #333;
}
.grafArea.onelife ul,
.grafArea.multi ul,
.grafArea.four ul {
	float:left;
	width:130px;
	padding:0 10px 0 0;
}
.grafArea.four .survival ul {
	margin:30px 0 0 0;
}
.grafArea.onelife ul li,
.grafArea.multi ul li,
.grafArea.four ul li  {
	margin:0 0 10px 0;
	color:#85a7a5;
	font-size:10px;
	font-weight:bold;
}
.grafArea.onelife ul li span,
.grafArea.multi ul li span,
.grafArea.four ul li span {
	float:right;
	color:#fff;
}
.grafArea.onelife p,
.grafArea.multi p,
.grafArea.four p.avg_Percent,
.grafArea.four p.kd_Percent {
	position:absolute;
	top:65px;
	left:202px;
	color:#85a7a5;
	font-size:14px;
	font-weight:bold;
	line-height:1.2;
}
.grafArea.four p.avg_Percent {
	top:65px;
	left:177px;
}
.grafArea.four p.wl_Percent {
	top:75px;
	left:187px;
}
.grafArea ul.score {
	width:130px;
	padding:10px 10px 0 10px!important;
}
.grafArea.four li.play .txt {
	float:left;
	padding:0 0 0 10px;
	color:#85a7a5;
	border-left:4px solid #1e89bb;
}
.grafArea.four li.play .num {
	float:right;
}
.grafArea.four li.live .txt {
	float:left;
	padding:0 0 0 10px;
	color:#85a7a5;
	border-left:4px solid #707070;
}
.grafArea.four li.live .num {
	float:right;
}
.grafArea.four li.total p {
	float:right;
	color:#fff;
}
.grafArea.four li.total span {
	float:none;
}
/* ========================================
	ranking
======================================== */
.rankingBox {
	position:relative;
}
.rankingBox h3 {
	float:left;
	width:257px;
	margin:0 0 10px -2%;
}
.rankingBox p.time {
	position:absolute;
	top:10px;
	right:2%;
	font-size:10px;
}
.rankingBox .mode {
	clear:both;
	margin:5px 0 10px 0;
	color:#aabfbd;
	font-size:10px;
}
.rankingBox .mode span {
	color:#fff;
}
.rankingBox dl {
	clear:both;
	width:96%;
	margin:0 auto 5px auto;
	padding:5px 2%;
	border:1px solid #1a3a3a;
	background:rgba(17,17,17,0.5);
}
.rankingBox dt {
	margin:0 0 5px 0;
	padding:5px;
	background:rgba(137,137,137,0.2);
	color:#85a7a5;
	font-size:12px;
	font-weight:bold;
}
.rankingBox dt span.player {
	float:right;
	color:#a0a0a0;
}
.rankingBox dt span.date {
	letter-spacing:-1px;
}
.rankingBox dd li {
	position:relative;
	float:left;
	width:47%;
	margin:0 1% 0 0;
	padding:5px 1%;
	background:rgba(83,83,83,0.2);
}
.rankingBox dd li h4 {
	background:rgba(0,0,0,0.2);
	color:#fff;
	font-size:14px;
	text-align:center;
}
.rankingBox dd li h4 span {
	margin:0 0 0 10px;
	color:#85a7a5;
}
.rankingBox dd li p.tit {
	margin:10px 0 5px 0;
	color:#85a7a5;
	font-size:14px;
	font-weight:bold;
	text-align:center;
}
.rankingBox dd li p.rank {
	color:#fff;
	font-size:42px;
	font-weight:bold;
	text-align:center;
}
.rankingBox dd li.gold p.rank span {
	padding:3px 0 3px 65px;
	background:url(../../pc/img/overview/icon_gold.png) no-repeat left center;
	background-size:50px;
}
.rankingBox dd li.silver p.rank span {
	padding:3px 0 3px 65px;
	background:url(../../pc/img/overview/icon_silver.png) no-repeat left center;
	background-size:50px;
}
.rankingBox dd li.bronze p.rank span {
	padding:3px 0 3px 65px;
	background:url(../../pc/img/overview/icon_bronze.png) no-repeat left center;
	background-size:50px;
}
.rankingBtn a {
	display:block;
	width:100%;
	margin:10px 0 0 0;
	border-radius:4px;
	border:1px solid #555;
	background:rgba(0,0,0,0.3);
	text-align:center;
	line-height:40px;
}
.rankingBtn a span {
	padding:0 0 0 20px;
	background:url(../img/overview/arrow_ranking.png) no-repeat left center;
	background-size:13px;
	color:#fff;
	font-size:14px;
	font-weight:bold;
	text-shadow:0px 0px 10px rgba(65, 135, 133, 1);
}


@media screen and (max-width: 600px) {

}