@charset "UTF-8";
html {
    background: #f7f7f7;
}
.ms-banner {
    height: 210px;
    width: 100%;
    background: url(//static.jjoobb.cn/images/company/find/mystaff-banner.jpg) center;
    min-width: 1200px;
}
.ms-banner-info{
  width: 460px;
  position: absolute;
  top:46px;
  left: 570px;
}
.ms-banner-info p{
  line-height: 32px;
}
.ms-banner-info .titl{
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  text-align: center;
}
.ms-banner-info .titl span{
  color: #fcff00;
}
.ms-banner-info .text{
  color: #9ae9ff;
}
.ms-main{ 
	width: 1138px;
	height: auto;
	overflow: hidden;
    margin: -50px auto 20px;
    background: #fff;
    padding: 30px;
    border: 1px solid #ddd;
}
.ms-main-left{
  width: 640px;
  height: auto;
}
.ms-main-right{
  width: 480px;
  height: auto;
}
.ms-main-info p{
  line-height: 22px;
  color: #999;
}
.tab-btn{
    border-right: 1px solid #ddd;
    margin-top: 20px;
}
.tab-btn li{
	width: 138px;
	height: 40px;
	display: block;
	float: left;
	text-align: center;
	border: 1px solid #ddd;
	border-right: none;
	cursor: pointer;
}
.tab-btn li a{
	width: 138px;
	height: 39px;
	line-height: 39px;
	display: block;
	color: #333;
}
.tab-btn li.active a{
	border-bottom: 2px solid #66be8c;
	font-weight: bold;
	color: #66be8c;
}
.ms-info{
	line-height: 32px;
	margin-top: 20px;
}
.ms-info-titl{
	height: 32px;
	line-height: 32px;
	padding-right: 5px;
}
.ms-info-box{
	width: 400px;
	height: 30px;
	border:1px solid #ddd;
}

.info-inp1{
	width: 320px;
	height: 30px;
	line-height: 30px;
	padding: 0 10px;
	border:none;
}
.info-inp1:hover{
	border-color:#66be8c;
}
.ms-info-box:hover, .ms-info-box.hover{
	border-color: #66be8c;
}
.btn-copy{
	width: 60px;
	height: 30px;
	display: inline-block;
	background: #eaeaea;
	border: none;
	cursor: pointer;
}
.ms-info-box:hover .btn-copy, .ms-info-box.hover .btn-copy {
	background: #66be8c;
	color: #fff;
}

.ms-h10{
	height: 10px;
}
.mystaff-list .ul-width{
	width: 1200px;
}
.mystaff-list .ul-width.load {
    height: 30px;
    background: url(//static.jjoobb.cn/images/global/loading.gif) no-repeat center;
}
.mystaff-list .ul-width li{
	float: left;
	margin: 20px 20px 0 0;
}
.mystaff-list dl{
	width: 324px;
	height: 60px;
	display: block;
	float: left;
	background: #f8f8f8;
	border: 1px solid #eee;
	padding: 20px;
}
.mystaff-list dl:hover{
	background: #f7fffa;
	border-color: #6cc191;
}
.mystaff-list dt a{
	width: 60px;
	height: 60px;
	float: left;
	padding-right: 10px;
	margin: 0 10px 0 0;
	border-right: 1px solid #eee;
}
.mystaff-list dt a img{
	width: 60px;
	height: 60px;
}
.mystaff-list dt a.women{
	background: url(//static.jjoobb.cn/images/global/default_avatar_female.jpg) no-repeat left center;
	background-size: 60px 60px;
}
.mystaff-list dt a.man{
	background: url(//static.jjoobb.cn/images/global/default_avatar_male.jpg) no-repeat left center;
	background-size:60px 60px;
}
.mystaff-list dd{
    line-height: 30px;
    height: 30px;
}
.name{
    font-weight: bold;
    width: 42px;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap; 
}
.name a{
	color: #66be8c;
}
.name a:hover{
	color: #58B781;
	text-decoration: underline;
}
.name a:active{
	color:#333;
}
.mystaff-list dd img{
	padding-left: 5px;
	float: left;
	margin-top: 3px;
}
.sex{
	font-size: 18px;
    padding-left: 3px;
}
.sex.women{
	color: #f22de2;
}
.sex.man{
	color: #30aef6;
}
.job{
	width: 138px;
	padding-left: 15px;
}
.mystaff-list dl .btn-authen-no a{
	width: 76px;
	height: 24px;
	line-height: 24px;
	border: 1px solid #e3e3e3;
	display: block;
	background: #fff;
	margin-top: 4px;
	text-align: center;
	color: #666;
}
.mystaff-list dl:hover .btn-authen-no a{
	background: #66be8c;
	border-color: #66be8c;
	color: #fff;
}
.mystaff-list dl:hover .btn-authen-no a:hover{
	background: #58B781;
	border-color: #58B781;
	color: #fff;
}
.btn-authen-no a .icon{
	font-size: 12px;
	vertical-align: 6%;
}
.btn-authen-yes a{
	width: 76px;
	height: 24px;
	line-height: 24px;
	border: 1px solid #e3e3e3;
	display: block;
	background: #e3e3e3;
	margin-top: 4px;
	text-align: center;
	color: #666;
}
.fans{
	line-height: 24px;
	margin-top: 4px;
	padding-left: 20px;
	color: #999;
}
.ms-page{
	margin-top: 30px;
}

/*pop-cancel*/
.poplay{
  width: 415px;
  height: auto;
  padding: 0 20px;
  color: #333;
  display: block;
  line-height: 28px;
}
.poplay p{
  line-height: 28px;
}
.p-cen{
  text-align: center;
  +line-height: 28px;
}
.p-cen .name{
  font-weight: bold;
  color: #66be8c;
}
.p-text{
  color: #999;
  +line-height: 28px;
}

/*提示样式*/
.msg{ 
	line-height: 32px;
	text-align: center;
	margin: 40px 0;
	color: #f5694b;
}
.msg span{
	padding: 0 5px;
}
.msg .icon{ 
	font-size: 32px; 
	vertical-align: -16%;
	padding-right: 5px;
}
.fail{ 
	color: #f5694b;
}
.fail a{
	color: #66be8c;
}
.fail a:hover{
	color: #58B781;
	text-decoration: underline;
}

.flash .btn-copy {
    -webkit-animation: flash 1s ease-in-out 2;
    animation: flash 1s ease-in-out 2;
}

@-webkit-keyframes flash {
    0%,50%,100% {
        opacity: 1;
        filter: alpha(opacity=100);
        background: #66BE8C;
        color: #fff;
    }

    25%,75% {
        opacity: 0;
        filter: alpha(opacity=0);
    }
}

@keyframes flash {
    0%,50%,100% {
        opacity: 1;
        filter: alpha(opacity=100);
        background: #66BE8C;
        color: #fff;
    }

    25%,75% {
        opacity: 0;
        filter: alpha(opacity=0);
    }
}

.flash.ms-info-box {
    -webkit-animation: flashBd 1s ease-in-out 2;
    animation: flashBd 1s ease-in-out 2;
}

@-webkit-keyframes flashBd {
    0%,50%,100% {
        border: 1px solid #66BE8C;
    }

    25%,75% {
        border: 1px solid transparent;
    }
}

@keyframes flashBd {
    0%,50%,100% {
        border: 1px solid #66BE8C;
    }

    25%,75% {
        border: 1px solid transparent;
    }
}