@charset "utf-8";

/* name card */
.namecard {line-height: 17px;font-family: Microsoft Yahe;}
.namecard .audio-play-wrapper {position: absolute;width: 25px;height: 25px;border-radius: 50%;background: #eeffffcf;right: 2px;bottom: 2px;}
.namecard .audio-play-wrapper .audio-play-btn {display: inline-block;vertical-align: top;width: 25px;height: 25px;line-height: 25px;background: url("../../images/icon/i_audio.png") no-repeat center;cursor: pointer;}
.namecard .audio-play-wrapper .audio-play-btn.active {background-image: url("../../images/icon/i_audio_play.gif");}

/* 名片样式一、名片样式二 */
.namecard.namecard-one {position: relative;margin: 15px;width: 365px;border: 1px solid #52afbf;font-size: 13px;}
.namecard.namecard-one .n_banner {display: flex;height: 80px;align-items: center;background: #7ea6cf url("") repeat scroll 0% 0%;}
.namecard.namecard-one .n_banner.one .n_logo {margin: 20px 0 10px 15px;}
.namecard.namecard-one .n_banner.one .n_name {margin: 20px 15px 10px 11px;}
.namecard.namecard-one .n_banner .n_logo {margin: 15px 0 15px 15px;width: 50px;height: 50px;}
.namecard.namecard-one .n_banner .n_logo > img {width: 50px;height: 50px;}
.namecard.namecard-one .n_banner .n_name {font-size: 20px;font-weight: 400;font-family: 楷体;width: calc(100% - 80px);margin: 15px 15px 15px 11px;height: 50px;position: relative;line-height: 28px;}
.namecard.namecard-one .n_banner .n_name > div {width: 100%;}
.namecard.namecard-one .n_banner .n_name > div.one {bottom: 0;position: absolute;line-height: 17px;}
.namecard.namecard-one .n_banner .n_name > div.two {bottom: 0;position: absolute;font-family: times new roman;font-weight: lighter;font-size: 18px;letter-spacing: 1.5px;}
.namecard.namecard-one .n_content {width: 365px;height: 125px;overflow: hidden;display: flex;align-items: center;}
.namecard.namecard-one .n_content > div {margin-left: 15px;}
.namecard.namecard-one .n_content .n_portrait {width: 97px;height: 97px;}
.namecard.namecard-one .n_content .n_portrait > img {width: 100%;height: 100%;}
.namecard.namecard-one .n_content .n_wechat_title {text-align: center;}
.namecard.namecard-one .n_content .n_qrcode > img {width: 60px;height: 60px;}
.namecard.namecard-one .n_content .n_details {width: 210px;line-height: 15.5px;}
.namecard.namecard-one .n_content .n_details.no-portrait {width: calc(100% - 90px);}
.namecard.namecard-one .n_content .n_details.no-portrait.no-qrcode {width: calc(100% - 30px);}
.namecard.namecard-one .n_content .n_details.no-qrcode {width: calc(100% - 142px);}
.namecard.namecard-one .n_content .n_details > div {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.namecard.namecard-one .n_content .n_details > div:first-child {font-size: 14px;font-weight: 600;margin-bottom: 4px;}
.namecard.namecard-one .n_content .n_wechat {height: 97px;margin-left: 0;}

/* 名片样式三、名片样式四 */
.namecard.namecard-two {position: relative;margin: 15px;width: 365px;border: 1px solid #5092ff;background-color: #f2f5f7;}
.namecard.namecard-two .top {display: flex;justify-content: space-between;height: 80px;padding: 0 15px;align-items: center;font-size: 17px;font-weight: bold;color: white;text-shadow: 0 0 3px #221f1f;background: #7ea6cf url("") repeat scroll 0% 0%;}
.namecard.namecard-two .top .logo {width: 50px;height: 50px;margin-right: 11px;}
.namecard.namecard-two .top .name {font-size: 14px;font-family: arial;}
.namecard.namecard-two .top .top-left {display: flex;width: calc(100% - 5px);align-items: center;height: 60px;}
.namecard.namecard-two .top .top-left.three > div {position: relative;}
.namecard.namecard-two .top .top-left.three > div .company {position: absolute;width: 100%;top: 0;}
.namecard.namecard-two .top .top-left.three > div .name {position: absolute;width: 100%;bottom: 0;}
.namecard.namecard-two .top .top-left.four {align-items: flex-end;}
.namecard.namecard-two .top .top-left.four > div {line-height: 20px;height: unset;}
.namecard.namecard-two .top .top-left.four > div .company {margin-bottom: 6px;}
.namecard.namecard-two .top .top-left.four > div .name {font-size: 17px;}
.namecard.namecard-two .top .top-left > div {width: 100%;height: 50px;line-height: 25px;overflow: hidden;white-space: nowrap;}
.namecard.namecard-two .top .top-right {display: flex;width: 97px;align-items: center;height: 60px;justify-content: right;}
.namecard.namecard-two .top .top-right .wechat {font-size: 12px;width: 16px;height: 60px;text-align: center;line-height: 15px;}
.namecard.namecard-two .top .top-right .qrcode {width: 60px;height: 60px;}
.namecard.namecard-two .top .top-right.english {width: 76px;}
.namecard.namecard-two .top .top-right.english .wechat {writing-mode: vertical-lr;font-family: verdana;letter-spacing: 1px;width: 16px;}
.namecard.namecard-two .bottom {font-size: 13px;color: #333;padding: 14px 15px;display: flex;justify-content: space-between;align-items: center;}
/* li */.namecard.namecard-two .bottom .bottom-left {flex-flow: column;width: 230px;height: 97px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;line-height: 20px;}
.namecard.namecard-two .bottom .bottom-left.no-portrait {width: 100%;}
.namecard.namecard-two .bottom .bottom-left.four {line-height: 15.5px;}
.namecard.namecard-two .bottom .bottom-left.four .contacts {font-weight: 600;font-size: 14px;margin-bottom: 4px;display: inline-block;}
.namecard.namecard-two .bottom .avatar {width: 97px;height: 97px;}