/*****************************************
*                   box                  *
*****************************************/

.box {position: relative;}

.box-title {
	position: relative;
	width: 970px;
	font-size: 0;
	text-indent: -5000px;
/*	margin-right: 80px;
	margin-left: 80px;*/
	margin-right: auto;
	margin-left: auto;
	background-image: url(../images/common/box-title.png);
	background-repeat: no-repeat;
}

.box-content {width: 956px; margin: 0 auto;}

/* box-slideshow
----------------------------------------*/

#box-slideshow {margin-bottom: 2px;}
#box-slideshow .inner {overflow: hidden;}

.slideshow-content {position: relative;}

.slideshow-controller {position: absolute; left: 0;}

.slideshow-content div {
	float: left;
/*	position: absolute;
	top: 0;
	left: 0;
	width: 100%;*/
	height: 100%;
}

.slideshow-content div a {
	display: block;
	width: 100%;
	height: 100%;
}

.slideshow-content div img {width: 100%; height: auto; display: block;}

.slideshow-track {
	position: relative;
	height: 7px;
	/*background: #a3a3a3; url(../images/common/box-slideshow-track.gif) 0 0 repeat-x*/
	overflow: hidden;
}

.slideshow-track ul, .slideshow-track li {height: 7px;}

.slideshow-track ul {background: #a3a3a3; margin-left: -8px;}
.slideshow-track li {float: left; background-color: #ffffff;}
.slideshow-track li a {
	position: relative;
	display: block;
	height: 100%;
	margin: 0 1.5px;
	background-color: #a3a3a3;
	-webkit-transform: skewX(-60deg);
	-moz-transform: skewX(-60deg);
	-ms-transform: skewX(-60deg);
	-o-transform: skewX(-60deg);
	transform: skewX(-60deg);
}
.slideshow-track li.current a {background-color: #41c5e7;}

/*

.slideshow-track div {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: #41c5e7;
}

.slideshow-track li a:before,
.slideshow-track li a:after {
	position: absolute;
	top: 0;
	width: 8px;
	height: 7px;
	content: '.';
	display: block;
	background-position: center center;
	background-repeat: no-repeat;
}

.slideshow-track li a:before {left: -8px; background-image: url(../images/common/box-slideshow-bar-before-grey.png);}
.slideshow-track li a:after {right: -8px; background-image: url(../images/common/box-slideshow-bar-after-grey.png);}

.slideshow-track li.current a:before {background-image: url(../images/common/box-slideshow-bar-before.png);}
.slideshow-track li.current a:after {background-image: url(../images/common/box-slideshow-bar-after.png);}

*/

/* box-filter
----------------------------------------*/

#box-filter {height: 73px;}

#box-filter .inner {height: 100%; text-align: center;}

#box-filter .box-title {
	display: inline-block;
	width: 153px;
	height: 100%;
	margin-right: 0;
	background-position: 0 0;
	vertical-align: top;
}

#box-filter .box-content {
	display: inline-block;
	width: auto;
	margin: 0;
	padding-top: 18px;
	padding-left: 17px;
	vertical-align: top;
}

#box-filter .btns {
	position: absolute;
	right: 20px;
	bottom: 22px;
}

#box-filter .btn-search {
	float: left;
	width: 154px;
	height: 36px;
	margin-left: 9px;
	background-image: url(../images/common/box-filter-btn-search.png);
}

#box-filter .btn-search:hover {background-position: left bottom;}

#box-filter .comboBox {
	float: left;
	width: 154px;
	margin-right: 5px;
	background-image: url(../images/common/box-filter-comboBox.png);
}

#box-filter .comboBox-label {}
#box-filter .comboBox-label p {width: 92px;}

/*----- comboBox-type -----*/

#comboBox-type {padding-top: 2px; background-image: url(../images/common/comboBox-type-content-bg.png);}

#comboBox-type .comboBox-content {width: 390px;}

#comboBox-type .content-header {
/*	height: 100px;*/
	text-align: left;
	padding: 17px 24px 48px 24px;
	background: url(../images/common/comboBox-type-content-header.png) center top repeat-y;
}

#comboBox-type .content-header p {display: inline-block; height: 25px; line-height: 25px;}
#comboBox-type .content-header .title {color: #3c3c3c; font-size: 16px; font-weight: bold;}
#comboBox-type .content-header .note {margin-left: 4px;}
#comboBox-type .content-header .note a {color: #7f7f7f;}

.selectedRole {background: url(../images/common/type-title-line.png) left bottom repeat-x;}
.selectedRole li {float: left; margin-right: 14px;}
.selectedRole li a {
	display: block;
	height: 36px;
	font-size: 14px;
	font-weight: bold;
	line-height: 37px;
	padding-right: 4px;
	padding-left: 26px;
	background: url(../images/common/icon-remove.png) 4px center no-repeat;
}

#comboBox-type .content-main {
	position: relative;
	background: url(../images/common/comboBox-type-content-main.png) center top repeat-y;
}

#comboBox-type .content-main .type {}
#comboBox-type .content-main .type .type-title {
	position: absolute;
	top: -48px;
	width: 76px;
	height: 48px;
	font-size: 16px;
	font-weight: bold;
	line-height: 48px;
	cursor: pointer;
}
#comboBox-type .content-main .current .type-title {background: url(../images/common/type-title-arrow.png) 5px center no-repeat;}
#comboBox-type .content-main .type .type-content {display: none;}
#comboBox-type .content-main .current .type-content {display: block;}

#comboBox-type .content-main #warrior .type-title {left: 28px;}
#comboBox-type .content-main #assassin .type-title {left: 104px;}
#comboBox-type .content-main #support .type-title {left: 180px;}
#comboBox-type .content-main #specialist .type-title {left: 256px;}

#comboBox-type .content-main .checkBox {padding: 10px 0 5px 26px;}
#comboBox-type .content-main .checkBox li {
	float: left;
	width: 86px;
	margin: 0 5px 5px 0;
	padding-left: 24px;
}
#comboBox-type .content-main .checkBox a {font-size: 14px;}

#comboBox-type .content-main .all {
/*	padding: 10px 0;*/
	margin: 0 22px;
	padding: 10px 0 5px 4px;
	background: url(../images/common/type-title-line.png) left bottom repeat-x;
}

#comboBox-type .content-footer {
	height: 74px;
	background: url(../images/common/comboBox-type-content-footer.png) center top no-repeat;
}

#comboBox-type .content-footer .btns {}
#comboBox-type .content-footer .btns li {float: left; margin-left: 9px;}

/*----- comboBox-purpose -----*/

#comboBox-purpose .comboBox-content {
	width: 364px;
	height: 227px;
	background-image: url(../images/common/comboBox-purpose-content.png);
}

#comboBox-purpose .badge {
	position: absolute;
	top: 51px;
	left: 251px;
	width: 75px;
	height: 88px;
	background-image: url(../images/common/purpose-badge.png);
	background-repeat: no-repeat;
}

#comboBox-purpose .checkBox {margin: 46px 0 0 29px;}
#comboBox-purpose .checkBox li {width: 170px; padding-bottom: 6px; background-position: left 3px;}
#comboBox-purpose .checkBox li a {letter-spacing: 2px;}

/*----- comboBox-times -----*/

#comboBox-times {}
#comboBox-times .comboBox-content {
	width: 270px;
	height: 386px;
	background-image: url(../images/common/comboBox-times-content.png);
}

#comboBox-times .comboBox-content .checkBox {padding: 0 28px 0 28px;}
#comboBox-times .comboBox-content .checkBox li {margin-bottom: 6px;}
#comboBox-times .comboBox-content #weekday {margin-top: 54px;}
#comboBox-times .comboBox-content #weekend {margin-top: 65px;}

#comboBox-times .btns {bottom: 20px;}

#comboBox-times .comboBox-content .close {
	top: 4px;
	background-image: url(../images/common/comboBox-close-2.png);
}

/*----- comboBox-server -----*/

#comboBox-server .comboBox-content {
	width: 213px;
	height: 192px;
	background-image: url(../images/common/comboBox-server-content.png);
}

#comboBox-server .checkBox {margin: 33px 0 0 29px;}
#comboBox-server .checkBox li {width: 100px; margin-bottom: 7px;}

/* box-resume
----------------------------------------*/

.box-resume {padding-top: 8px;}

.box-resume .box-title {position: relative; height: 54px;}
.box-resume .box-title span {
	position: absolute;
	top: 16px;
	left: 118px;
	width: 44px;
	height: 19px;
	background-repeat: no-repeat;
	background-position: left top;
}
.box-resume .box-content {/*padding: 0 0 0 94px;*/}

.box-resume .data-header {
	width: 956px;
	height: 45px;
	background: url(../images/common/box-resume-data-header.gif) left top no-repeat;
}
.box-resume .data-list {
	width: 956px;
	margin-top: 3px;
	border: #41c5e7 3px solid;
	box-sizing: border-box;
}

.box-resume .row {
	height: 67px;
	color: #575757;
	font-size: 14px;
	font-weight: bold;
	line-height: 20px;
	background: url(../images/common/box-resume-row.gif) left top repeat-x;
}

.box-resume .row:hover {background-position: left bottom;}

.box-resume .row .col {height: 67px;}

.box-resume .order {width: 88px; text-align: center;}
.box-resume .nickname {width: 125px; padding-right: 15px;}
.box-resume .level {width: 56px;/* padding-left: 18px;*/ text-align: center;}
.box-resume .role {width: 159px; padding-right: 15px; padding-left: 48px;} /* 210px */
/*.box-resume .type {width: 208px; padding-left: 26px;}*/
.box-resume .times {width: 180px; padding-right: 15px;}
.box-resume .purpose {width: 151px;}
.box-resume .popularity {width: 58px; text-align: center; padding-right: 40px; /*padding-left: 3px;*/}

.box-resume .badge {vertical-align: middle; margin-left: 10px;}

/* box-newest-resume
----------------------------------------*/

#box-newest-resume {}
#box-newest-resume .box-title {background-position: 0 -73px;}
#box-newest-resume .box-title span {background-image: url(../images/common/icon-new.gif);}

/* box-hot-resume
----------------------------------------*/

#box-hot-resume {}
#box-hot-resume .box-title {background-position: 0 -127px;}
#box-hot-resume .box-title span {background-image: url(../images/common/icon-hot.gif);}

#box-hot-resume .box-content {}
#box-hot-resume .data-header {background: url(../images/common/box-hot-resume-data-header.gif) left top no-repeat;}

#box-hot-resume .data-list-collection {
	position: relative;
	margin-top: 3px;
/*	padding-bottom: 35px;*/
}

#box-hot-resume .data-list-wrap {
	position: relative;
	width: 950px;
	height: 670px;
	border: #41c5e7 3px solid;
	overflow: hidden;
}

#box-hot-resume .data-list-controller {
	position: relative;
	top: 0;
	left: 0px;
/*	width: 2868px;*/
}

#box-hot-resume .data-list {/*float: left; */width: 950px; border: none; margin-top: 0;}

#box-hot-resume .data-list-pagination {
	padding-top: 16px;
}
#box-hot-resume .data-list-pagination ul {float: right; margin-right: 12px;}
#box-hot-resume .data-list-pagination li {float: left; margin: 0 0 0 17px;}
#box-hot-resume .data-list-pagination li a {
	display: block;
	width: 19px;
	height: 19px;
	color: #ffffff;
	font-size: 13px;
	line-height: 19px;
	text-align: center;
	background-color: #000000;
}
#box-hot-resume .data-list-pagination li a:hover,
#box-hot-resume .data-list-pagination li.current a {
	background-color: #41c5e7;
}

/* box-result-resume
----------------------------------------*/

#box-result-resume {}
#box-result-resume .box-title {background-position: 0 -181px;}
#result .box-all-resume .box-title {background-position: 0 -397px;}
#result .box-all-resume .box-title .icon {display: none;}

#box-result-resume .data-header {background-image: url(../images/common/box-result-resume-data-header.gif);}

#box-result-resume .nickname {width: 149px; padding: 0 0 0 18px;}
#box-result-resume .level {width: 59px;}
#box-result-resume .role {width: 144px; padding: 0 15px 0 26px;}
/*#box-result-resume .type {width: 94px; padding: 0 30px 0 10px;}*/
#box-result-resume .times {width: 196px; padding: 0 0 0 0;}
#box-result-resume .purpose {width: 143px; padding-left: 0;}
#box-result-resume .badge {vertical-align: middle; margin-left: 10px;}
#box-result-resume .server {width: 129px; padding: 0 0 0 0;}
#box-result-resume .league {width: 115px;}
#box-result-resume .popularity {width: 59px; padding: 0 12px 0 0;}

/* box-choose-role
----------------------------------------*/

#box-choose-role {}
#box-choose-role .box-title {}
#box-choose-role .box-content {position: relative;}

#box-choose-role .type-title {
	height: 40px;
	font-size: 15px;
	font-weight: bold;
	line-height: 40px;
	padding-left: 15px;
	background: url(../images/common/type-title-arrow.png) left center no-repeat;
}
#box-choose-role .type-content {
/*	min-height: 100px;*/
	width: 731px\9;
	margin-left: -112px;
	padding-right: 48px;
	padding-left: 112px;
	background-color: #ffffff;
}

#box-choose-role .type-content .checkBox {font-size: 14px;}
#box-choose-role .type-content .all {
	padding: 10px 0;
	background: url(../images/common/type-title-line.png) left bottom repeat-x;
}
#box-choose-role .type-content .multiple {padding: 14px 0 8px;}

#box-choose-role .type-content .checkBox li {
	float: left;
	width: 116px;
}

#box-choose-role .type-content .all li {margin-bottom: 0;}
#box-choose-role .type-content .multiple li {margin-bottom: 10px;}

/* box-avatar
----------------------------------------*/

#box-avatar {padding-top: 43px;}

#box-avatar .box-title {
	width: 100%;
	height: 54px;
	margin-bottom: 10px;
	background-position: 268px -289px;
}

#box-avatar .list {
	width: 504px;
	margin: 0 auto 18px;
}

#box-avatar .list li {float: left; margin: 2px 2px;}

#box-avatar .list li a {
	display: block;
	width: 74px;
	height: 74px;
	border: #41c5e7 3px solid;
	overflow: hidden;
	opacity: 0.6;
	filter: alpha(opacity=60);
}

#box-avatar .list li a:hover,
#box-avatar .list li.current a {
	border-color: #ffae41;
	opacity: 1;
	filter: alpha(opacity=100);
}

#box-avatar .list li a img {
	display: block;
	width: 74px;
	height: 74px;
}

#box-avatar .btn-change {
	width: 220px;
	height: 51px;
	margin: 0 auto;
	background: url(../images/common/box-avatar-btn-change.png) left top no-repeat;
}

#box-avatar .btn-change:hover {background-position: left bottom;}

/* box-ad
----------------------------------------*/

#box-ad {width: 728px; height: 90px; margin: 30px auto 0;}
#box-ad img {display: block;}