root{
    --color: #1f4e83;
}

img {
    width: 100%;
    height: auto;
    object-fit: cover;
    flex: 1;
}
.bg {
    width: 100%;
    height: 300px;
    background: url("/public/static/expert/new-project-detail-banner2.png") no-repeat;
    background-size: 100%;
}

.expert-header-bg {
    position: absolute;
    z-index: -1;
}
.expert-title{
    background: #FFFFFF;
    box-shadow: 0 6px 30px 0 rgba(225, 225, 225, 0.4);
    border-radius: 5px;
    margin: 0 auto;
    box-sizing: border-box;
}

.expert-title-top{
    display: flex;
    padding: 30px;
}

.expert-title-logo > img {
    width: 160px;
    height: 160px;
    border-radius: 6px;
}

.expert-title-desc {
    flex-grow: 2;
    margin-left: 42px;
    margin-top: 22px;
}

.expert-title-desc .desc-title > span {
    font-size: 26px;
    font-weight: bold;
    color: #333333;
    display: inline-block;
    line-height: 1;
    vertical-align: top;
    width: 650px;
}
.expert-title-desc .desc-title .desc-title-name{
    max-width: 520px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.expert-title-desc .desc-business {
    font-size: 16px;
    font-weight: 400;
    color: #666666;
    line-height: 26px;
    margin-top: 16px;
    display: inline-block;
    text-align: justify;
}

.expert-title-desc .desc-timer-address {
    font-size: 16px;
    font-family: PingFang-SC-Regular, PingFang-SC;
    font-weight: 400;
    color: #666666;
    line-height: 26px;
    margin-top: 18px;
}
.expert-detail-divder{
    margin: 0 !important;
    background-color: #EEEEEE;
}
/*!*---------------------*!*/
/*.headerCont {*/
/*    margin-top: 60px;*/
/*    background: #FFFFFF;*/
/*    box-shadow: 0 6px 30px 0 rgba(225, 225, 225, 0.4);*/
/*    border-radius: 5px;*/
/*}*/


/*.expert-header-content {*/
/*    !*margin-top: -15%;*!*/
/*    padding: 30px 42px;*/
/*    display: flex;*/
/*    !* align-items: center; *!*/
/*    justify-content: space-between;*/
/*}*/

/*.expert-header-content-avatar {*/
/*    width: 160px;*/
/*    height: 160px;*/
/*}*/

/*.expert-header-content-avatar>img {*/
/*    height: 100%;*/
/*    border-radius: 6px;*/
/*}*/

/*.expert-header-content-intro {*/
/*    width: 75%;*/
/*    !* display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: center; *!*/
/*    padding: 22px 0 13px 0;*/
/*}*/

/*.expert-header-content-intro>.name {*/
/*    font-size: 26px;*/
/*    font-weight: bold;*/
/*}*/

/*.expert-header-content-intro>.academic_title {*/
/*    font-size: 16px;*/
/*    font-weight: 400;*/
/*    line-height: 26px;*/
/*    color: #666666;*/
/*    margin-top: 17px;*/
/*}*/

/*.expert-header-content-intro>.title {*/
/*    margin-top: 4px;*/
/*    font-size: 16px;*/
/*    font-weight: 400;*/
/*    color: #666666;*/
/*    line-height: 26px;*/
/*}*/

/*.expert-header-content-intro>.life_motto {*/
/*    margin-top: 36px;*/
/*    font-size: 16px;*/
/*    font-weight: 400;*/
/*    color: #555555;*/
/*    line-height: 25px;*/
/*    overflow: hidden;*/
/*    white-space: initial;*/
/*    text-overflow: ellipsis;*/
/*    -webkit-line-clamp: 2;*/
/*    display: -webkit-box;*/
/*    -webkit-box-orient: vertical;*/
/*}*/
/*!*------------------------------------------------*!*/
.user-container {
    margin-top: 20px;
}

.expert-content {
}

.item-title {
    font-size: 16px;
    font-weight: 400;
    color: #333333;
    line-height: 22px;
    margin-bottom: 20px;

    display: flex;
    align-items: center;
}

.title-border-line {

    display: inline-block;
    background: url("/public/static/expert/title.png") no-repeat;
    background-size: 100% 100%;
    width: 13px;
    height: 15px;
    margin-right: 10px;
}

.expert-content-tabs {
    padding: 0 30px;
    margin-top: 13px;
    display: flex;
    flex-wrap: wrap;
}

.expert-content-tabs > div {
    margin-right: 70px;
    position: relative;
    box-sizing: border-box;
    cursor: pointer;
    text-align: center;

    font-size: 18px;
    font-weight: 400;
    color: #666666;
    margin-bottom: 12px;
    height: 25px;
    line-height: 25px;
}
.expert-content-tabs > div:hover{
    color: var(--color);
}

.expert-content-tabs-selected {
    color: var(--color) !important;
    font-weight: bold !important;
    position: relative;
    z-index: 100;
    margin-bottom: 12px;
}

.expert-content-tabs-selected > div {
    bottom: -11px;
    width: 50%;
    left: 25%;
    position: absolute;
    height: 4px;
    border-radius: 5px;
    background: linear-gradient(153deg, rgba(71, 154, 243, 1), rgba(34, 97, 228, 1));
}

.expert-content-userinfo,
.expert-content-contr {
    margin-top: 20px;
}

.expert-content-userinfo>div,
.expert-content-contr>div {
    box-sizing: border-box;
    width: 100%;
    /* background: #FFFFFF; */
    box-shadow: 0 6px 30px 0 rgba(211, 218, 229, 0.4);
    border-radius: 5px;
}

.expert-content-userinfo>div:first-child,
.expert-content-contr>div:first-child {
    padding: 34px 40px;
}

.expert-content-userinfo>div:not(:first-child),
.expert-content-contr>div:not(:first-child) {
    padding: 34px 40px;
}

.expert-content-userinfo>div:not(:first-child),
.expert-content-contr>div:not(:first-child) {
    margin-top: 20px;
}

.userinfo-basic-content {
    display: flex;
    justify-content: space-between;
}

.userinfo-basic-content>div:first-child {
    /*margin-left: 14px;*/
    width: 74%;
    text-align: justify;
}

.userinfo-basic-content>div:first-child>div {
    display: flex;
}

.userinfo-basic-content>div:first-child>div:not(:first-child) {
    margin-top: 30px;
}

.userinfo-basic-content>div:first-child>div>div:first-child {
    flex: 0 0 5em;
    font-size: 14px;
    font-weight: 400;
    color: #555555;
    text-align: justify;
    justify-content: space-between;
}

.userinfo-basic-content>div:first-child>div>div:last-child {
    flex-grow: 1;
    font-size: 14px;
    font-weight: 400;
    color: #333333;
    margin-left: 12px;
}

.userImg {
    width: 220px;
    height: 220px;
}

.userImg img {
    height: 100%;
}

.jobs-item>div:first-child {
    display: flex;
}

.jobs-item>div:first-child>div {
    width: 35%;
}

.jobs-item>div:first-child>div:last-child {
    text-align: right;
}

.jobs-item>div:first-child>.jobs-item-timer {
    font-size: 16px;
    font-weight: 400;
    color: #666666;
}

.jobs-item>div:first-child>.jobs-item-title {
    font-size: 16px;
    /*font-weight: bold;*/
    color: #555555;
}

.jobs-item>div:first-child>.jobs-item-desc {
    font-size: 16px;
    /*font-weight: bold;*/
    color: #555555;
}

.expertList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.expert-content-list {
    padding: 24px 30px;
    background: #F9F9F9;
    width: 43%;
    margin-bottom: 30px;
    cursor: pointer;
}

.expertTitle {
    font-size: 18px;
    font-weight: 500;
    color: #237BCD;
}

.expertDes {
    margin-top: 12px;
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    line-height: 30px;
    overflow: hidden;
    white-space: initial;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.expertDesInfo {
    margin-top: 12px;
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    line-height: 30px;
    overflow: hidden;
    white-space: initial;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.expertIntro {
    margin-top: 18px;
    font-size: 14px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.8);
}

.el-divider--horizontal {
    margin: 20px 0;
}

.exportVideo {
    height: 238px;
    background: #000;
}

video {
    height: 100%;
    width: 100%;
}

/* 相关动态 */
.exportTrends {
    padding: 0 30px !important;
    box-shadow: 0 6px 30px 0 rgba(225, 225, 225, 0.4);
}

.trendsList {
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #EBEBEB;
    cursor: pointer;
}

.trendsList:last-child {
    border-bottom: 0;
}

.trendsImg {
    width: 210px;
    height: 140px;
}

.trendsImg img {
    height: 100%;
}

.trendsRinfo {
    display: flex;
    flex-wrap: wrap;
    width: 79%;
    align-content: start;
}

.trendTitle {
    font-size: 18px;
    font-weight: 400;
    color: #333333;
}
.trendTitle:hover{
    color: var(--color);
}
.trendDes {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    overflow: hidden;
    white-space: initial;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-height: 26px;
    margin-top: 20px;
}

.trendRead {
    font-size: 14px;
    font-weight: 400;
    color: #999999;
    line-height: 30px;
}

.bottom {
    margin: 0 !important;
    box-shadow: none !important;
    text-align: center;
}
