html{ margin: 0 auto; height: 100%;}
body{font:12px/1.5 'PingFang SC', 'Microsoft YaHei', '微软雅黑', STHeiti, sans-serif; margin: 0; padding: 0; position: relative; margin: 0; background: #f7f7f7; overflow-x: auto; min-width: 1280px; min-height: 100%;}
blockquote,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul {margin: 0; padding: 0}
tbody, th, tr, td{border: none;}
img{border: none; vertical-align: top;}
a{text-decoration:none; display: inline-block; color: #333;}
ul{list-style: none;}
i{font-style: normal;}
textarea{outline:none; resize:none;}
input{line-height: normal; background:none; outline: none; border-radius: none; border: none;}
.clearfix:after{visibility: hidden; display: block; font-size: 0; content: ""; clear: both; height: 0;}
.clearfix{*zoom: 1;}
.lock {overflow: hidden;height: 100%;width: 100%;}
.line-hide-2{-webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; display: -webkit-box!important; -webkit-box-orient: vertical;}
.line-hide-3{-webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;}
.line-hide-6{-webkit-line-clamp: 6; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;}
.overflow-hidden{overflow: hidden;}
[class^="chrome-"]{-webkit-transform: scale(1);}
[class$="px-left"]{-webkit-transform-origin: left;}
[class$="px-center"]{-webkit-transform-origin: center;}
.chrome-7px-center{-webkit-transform: scale(0.58);}
.chrome-8px-left{-webkit-transform: scale(0.66);}
.chrome-8px-center{-webkit-transform: scale(0.66);}
.chrome-10px-left{-webkit-transform: scale(0.83);}
.chrome-10px-center{-webkit-transform: scale(0.83);}
.fl{float: left;}
.fr{float: right;}
.tl{text-align: left;}
.tr{text-align: right;}
.mr0{margin-right: 0!important;}
.dn{display: none!important;}
.dn-normal{display: none;}
.opacity0{opacity: 0;}
.new-msginfo{
  position: absolute;
  display: inline-block;
  *display: inline;
  zoom: 1;
  background-color: #e74b3b;
  border-radius: 50%;
  top: 6px;
  right: -20px;
  width: 24px;
  height: 24px;
  color: white;
  font-size: 12px;
  line-height: 23px;
  text-align: center;
  transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -webkit-transform: scale(0.7);
}
.narrow.new-msginfo {
  right: -19px;
}
.new-msginfo.sub{width:6px;height:6px;right: 14px;top: 50%;transform: translateY(-50%);}
.zIndex-1{z-index: 100;}
.zIndex-2{z-index: 200;}
.zIndex-3{z-index: 300;}
.i-icon{color: #f0f0f0; font-weight: 600; margin: 0 8px; padding: 0!important; width: 2px; height: 12px; background-color: #f0f0f0;}
.i-icon-2{font-size: 12px; font-weight: 300; color: #999;}
.red-point:after{content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background-color: #e74b3b; top: 14px; right: -12px;}
.banner-linear{background-image: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .4)); height: 100%;}
.slash-icon{padding: 0 4px; font-size: 12px; font-weight: 300; opacity: .5;}
.common-cover-float{position: absolute; width: 100%; height: 100%; top: 0; left: 0; cursor: pointer; z-index: 1;}
.common-hover-wrap{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; transform: translateY(10px); -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); opacity: 0; visibility: hidden;}
.common-hover-wrap.visible{transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); opacity: 1; visibility: visible;}
.common-hover-wrap.hide{opacity: 0;}
.text-red-strong{color: #e74b3b; font-weight: 500;}
.bg-red{background: #e74b3b!important; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.bg-red:hover{background: #cf4334!important;}
.bg-red:active{background: #cf4334!important;}
.bg-green{background: #1bc5b5!important; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.bg-green:hover{background: #19b0a1!important;}
.bg-green:active{background: #19b0a1!important;}
.bg-transparent{background-color: rgba(255, 255, 255, 0.3)!important; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.bg-transparent:hover{background-color: rgba(255, 255, 255, 0.6)!important;}
.bg-transparent:active{background-color: rgba(255, 255, 255, 0.6)!important;}
.bottom-box{display: none !important;}
.main-center{width: 1180px; margin: 0 auto;}
.ban-click{z-index:100000; background-color: rgba(0,0,0,0); position: fixed ;left:0; top:0; width: 100%; height: 100%;}
/* 图片加载动画 */
.lazy-img{opacity: 0; transition: .5s ease-in-out; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -ms-transition: .5s ease-in-out; -o-transition: .5s ease-in-out;}
.lazy-img-show{opacity: 1;}
/* 垂直居中样式 */
.v-center{display: inline-block; vertical-align: middle;}
/* 垂直居中基准 */
.base-v-center{width: 0; height: 100%;}
/* 结果为空 */
.result-empty{padding: 120px 0 180px; text-align: center;}
.result-empty span{cursor: pointer;}
.more-btn{cursor: pointer; position: relative;}
.no-more{color: #e3e4e5!important; background-color: #f7f7f7!important; line-height: 1!important; height: auto!important; padding-bottom: 20px;}
/* 行为类 - 进入个人页 */
.enter-creator-space{cursor: pointer; display: block;}
.enter-filmplay{cursor: pointer;}
/* 公共1/4红圈loading */
.common-ajax-loading{position: absolute; width: 32px; height: 32px; left: 50%; top: 50%; margin: -16px 0 0 -16px;}
.common-ajax-loading:before{content: ''; display: block; position: absolute; top: 0; left: 0; width: 32px; height: 32px; border: 4px solid #f0f0f0;border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; box-sizing: border-box;}
.common-ajax-loading:after{content: ''; display: block; position: absolute; top: 0; left: 0; width: 32px; height: 32px; border: 4px solid transparent; border-top-color: #e74b3b;border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%;  -webkit-animation: common-loading-rotate infinite .5s linear; animation: common-loading-rotate infinite .5s linear; box-sizing: border-box;}
/* 弹窗 */
.filmplay-black-box{position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,.8); left: 0; top: 0; z-index: 10002;}
.filmplay-black-box .filmplay-inner-box{position: absolute; width: 380px; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); border-radius: 2px; overflow: hidden;}
.filmplay-black-box .filmplay-inner-box .close{position: absolute; right: 15px; top: 10px; z-index: 1;}
.filmplay-black-box .filmplay-inner-box .close:before{font-size: 20px; color: #333; cursor: pointer;}
.filmplay-black-box .filmplay-inner-box .close:hover:before{color: #999;}
.filmplay-black-box .filmplay-inner-box .duty-title{color:#979797;font-size: 12px;line-height: 18px;margin-bottom:20px}
.film-main{margin-top: 15px;z-index: 99;width: 960px;margin: 0 auto;position: relative;/* height: 540px;*/}
.filmplay-detail{width: 1140px; margin: 20px auto; padding: 0 20px; position: relative; z-index: 100;}
.filmplay-inner-box{width: 440px; background-color: #fff;}
/*.filmplay-inner-box .creator-con{padding: 30px;}*/
.filmplay-inner-box .creator-con p{position: relative; padding: 18px 20px; border-bottom: 4px solid #f7f7f7; line-height: 1;}
.filmplay-inner-box .creator-con .list-wrap{max-height: 535px; overflow-y: auto;}
.filmplay-inner-box .creator-con .list-wrap li{position: relative; background-color: #fff; cursor: pointer; padding: 0 20px;}
.filmplay-inner-box .creator-con .list-wrap li .a-wrap{border-bottom: 1px solid #f0f0f0; display: block; padding: 14px 0;}
.filmplay-inner-box .creator-con .list-wrap li .a-wrap .follow-btn{position: absolute; width: 58px; height: 26px; line-height: 26px; border-radius: 2px; border: 1px solid #e74b3b; right: 20px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); text-align: center;}

.filmplay-inner-box .creator-con .list-wrap li:hover{background-color: #f0f0f0;}
.filmplay-inner-box .creator-con .list-wrap li .avator-wrap{position: absolute; left: 20px; top: 15px;}
.filmplay-inner-box .creator-con .list-wrap li .avator{width: 38px; height: 38px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; }
.filmplay-inner-box .creator-con .list-wrap li .author-v{position: absolute; width: 12px; height: 12px;}
.filmplay-inner-box .creator-con .list-wrap li .info{margin-left: 48px; width: 220px;}
.filmplay-inner-box .creator-con .list-wrap li .info h3{height: 20px;}

.filmplay-inner-box .creator-con .list-wrap li.no-creator-like{line-height: 82px; text-align: center; border-bottom: none; font-size: 16px; font-weight: 600; color: #e3e4e5;}
.filmplay-inner-box .creator-con .list-wrap li.no-creator-like:hover{background-color: #fff;}
.filmplay-inner-box .creator-con .list-wrap .more{height: 50px; line-height: 50px; text-align: center; background-color: #f0f0f0; cursor: pointer; color: #333; margin-top: 3px; position: relative;}
.filmplay-inner-box .creator-con .list-wrap .more:hover{color: #666;}

/* 同款定制弹窗 */
.space-some-wrap .space-some-box{width: 340px; height: 364px; border-radius: 8px;}
.space-some-wrap .space-some-box p{text-align: center; font-size: 18px; margin-top: 32px; color: #1f2937
; height: 26px; margin-bottom: 8px; font-weight: 600;}
.space-some-wrap .space-some-box .space-share-left{text-align: center; height: 30px; line-height: 30px; padding: 6px 35px; border-radius: 15px; background-color: rgba(231,75,59,0.1); margin: 0 35px; font-size: 14px; height: 18px; line-height: 18px; color: #7f8187;}
.space-some-wrap .space-some-box .space-share-left span{color: #ef4444;}
.space-some-wrap .space-some-box .space-share-right img{width: 180px; height: 180px; display: block; margin: 32px auto;}


/* 分享弹窗 */
.space-share-wrap .space-share-box{width: 534px;}
.space-share-wrap .space-share-box .space-share-detail{padding:41px 0 35px 0; text-align: center; height: 248px; position: relative;}
.space-share-wrap .space-share-box .space-share-detail.short-height{box-sizing:border-box; height: 296px;}
.space-share-wrap .space-share-box .space-share-detail > div{width: 267px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);}
.space-share-wrap .space-share-box .space-share-detail .space-share-left{width: 266px; height: 220px; border-right: solid 1px #f0f0f0; left: 0; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.space-share-wrap .space-share-box .space-share-detail .space-share-right{padding-top: 10px; right: 0; box-sizing: border-box; height: 220px; display: flex; flex-direction: column; justify-content: center; align-items: center;}

.space-share-wrap .space-share-box .space-share-left .code-tip{padding-top: 5px;}
.space-share-wrap .space-share-box .space-share-left .download-qrcode{width: 88px; height: 26px; line-height: 26px; border-radius: 2px; border: solid 0.5px rgba(153,153,153,.5); margin: 10px auto 0; cursor: pointer;}
.space-share-wrap .space-share-box .space-share-right .share-tip{padding-bottom: 12px;}
.space-share-wrap .space-share-box .space-share-right .embed-web{width:100%;box-sizing: border-box;padding:32px 38px 0;display: flex;flex-direction: column;justify-content: start;align-items: center;}
.space-share-wrap .space-share-box .space-share-right .embed-web .ifream-title{position: relative;padding-bottom: 12px;font-weight: 600;color:#333333}
.space-share-wrap .space-share-box .space-share-right .embed-web .ifream-title:after{position: absolute;top: -4px;right: -35px;content: "BETA";width: 36px;height: 14px;line-height: 13px;border-radius: 1px;background-color: #e74b3b;font-size: 12px;color: #fff;text-align: center;transform: scale(.83);}
.space-share-wrap .space-share-box .space-share-right .embed-web #xpc_player_share_box{resize:none;width:172px;height:43px;border-radius: 2px;border: solid 0.5px #999999;padding: 3px 8px 0;margin-bottom: 8px;}
.space-share-wrap .space-share-box .space-share-right .embed-web #xpc_player_share_box::-webkit-scrollbar {display: none; width:0;}
.space-share-wrap .space-share-box .space-share-right .embed-web #copy-web-btn{width: 88px;height: 24px;padding: 3px 0;border:0px;border-radius: 2px;background-color:#e74b3b;text-align:center;font-size: 12px;font-weight: 500;color:#ffffff;cursor: pointer;}
.space-share-wrap .space-share-box .space-share-right .embed-web #copy-web-btn:hover {background-color:#cf4334}


.space-share-wrap .space-share-box .space-share-left .avater-action{display: inline-block; font-size: 0; margin-top: 10px; cursor: pointer;}
.space-share-wrap .space-share-box .space-share-left .avater-action .select-btn{display: inline-block; width: 14px; height: 14px; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-04/595b35e46f099.png) no-repeat; background-size: cover; margin-right: 10px; background-position: 0 -28px;}
.space-share-wrap .space-share-box .space-share-left .avater-action .select-btn.no-active{background-position: 0 0;}
/* 关注按钮 */
.follow-btn{position: relative;}
.follow-btn .common-ajax-loading{width: 14px!important; height: 14px!important; margin: -7px 0 0 -7px!important;}
.follow-btn .common-ajax-loading:before, .follow-btn .common-ajax-loading:after{width: 14px!important; height: 14px!important; border-width: 2px!important;}
.follow-btn .common-ajax-loading:after{width: 14px; height: 14px; border-width: 2px;}
.followed{background-color: #fff!important; border: 1px solid rgba(153,153,153,.5)!important; color: #333!important;}
.followed:hover{background-color: #fff!important;}
@keyframes common-loading-rotate{
  0%{transform: rotate(0);}
  100%{transform: rotate(360deg);}
}
/* 认证加V */
.author-v{width: 10px; height: 10px; background-size: cover; background-repeat: no-repeat; position: absolute; right: 0; bottom: 0;}
.author-v.yellow-v{background-image: url("/public/images/yellow-v.png");}
.author-v.blue-v{background-image: url("/public/images/blue-v.png");}

/* 隐藏作品check也可以公用 */

.hide-check-out-style-unique-reuse {
  margin-bottom: 4px;
}
.hide-check-out-style-unique-reuse div {
  display: inline-block;
  border-radius: 2px;
  cursor: pointer;
  font-size: 14px;
  color: #2b2b2b;
  font-weight: normal;
}
.hide-check-out-style-unique-reuse-forbid {
  pointer-events: none;
}
.hide-check-out-style-unique-reuse-forbid .select {
  background: #f7f7f7 !important;
  border-color: #f0f0f0 !important;
}
.hide-check-out-style-unique-reuse-forbid div {
  color: #c4c4c4;
}
.hide-check-out-style-unique-reuse .select {
  background: #e74b3b !important;
  border-color: #e74b3b !important;
}
.hide-check-out-style-unique-reuse .select:hover {
  background: #e74b3b !important;
  border-color: #e74b3b !important;
}
.hide-check-out-style-unique-reuse .check { width: 16px;height: 16px;border-radius: 2px;border: solid 1px #e5e5e5;display: inline-block; color: #fff;text-align: center;line-height: 16px;font-size: 14px;font-weight: 300;margin-right: 12px; }
.hide-check-out-style-unique-reuse .check:hover { border-color:#9e9e9e; background-color: #f7f7f7; color: #f7f7f7;}

/* slide-bar */
.slide-bar{position: fixed; right: 26px; bottom: 50px;  z-index: 1000;}
.slide-bar .to-up{visibility: hidden; opacity: 0; transition: .15s ease;}
.slide-bar .to-up.show {visibility: visible; opacity: 1;}
.slide-bar ul{position: relative;}
.slide-bar ul li.ad-wrap {height: auto; border: none; background-color: transparent; position: relative; left: -7px;}
.slide-bar ul li.ad-wrap .ad-img {width: 70px;}
.slide-bar ul li.ad-wrap .qr-wrap {position: absolute; width: 130px; right: 45px; bottom: 6px; padding-right: 7px; display: none;}
.slide-bar ul li.ad-wrap:hover .qr-wrap {display: block;}
.slide-bar ul li.ad-wrap .qr-wrap .qr-img {padding: 10px; box-sizing: border-box; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); background-color: #fff; overflow: hidden; padding: 10px;}
.slide-bar ul li.ad-wrap .qr-wrap .qr-img img {width: 110px;}
.slide-bar ul li.ad-wrap .qr-wrap .qr-img span {line-height: 20px; color: #333; font-size: 12px; letter-spacing: 0px; display: block;}
.slide-bar ul li.ad-wrap:hover .qr-2018 {display: block;}
.slide-bar ul li,.slide-bar ul li .iphone{width: 50px; height: 50px; background: #fff; border: 1px solid #f0f0f0; margin-bottom: 10px; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  position: relative; font-size: 12px; color: #999; line-height: 12px; text-align: center; cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.slide-bar ul li .iphone{border: none; display: flex; flex-direction: column; justify-content: space-around;}
.slide-bar ul li,.slide-bar ul li:hover .iphone::before{color: #333;}
.slide-bar ul li.to-feedback{height: 43px; line-height: 1.5; padding-top: 7px;}
.slide-bar ul li.to-feedback a {color: #999;display: block; width:100%; height:100%; font-weight: 500; line-height: 1.2;}
.slide-bar ul li.to-feedback a span{display: block;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%)}
.slide-bar ul li:hover, .slide-bar ul li:hover a{color: #333;}
.slide-bar ul li:before{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.slide-bar ul li:hover:before{color: #333;}
.slide-bar ul li.to-up:before{font-size: 16px;}
.slide-bar ul li .icon-iphone:before{font-size: 20px;}
.slide-bar ul li:hover .icon-iphone:before, .slide-bar ul li a span:hover{color: #333; }
  /* tab */
.index-tab{background: #fff; position: relative;}
.index-tab .tab-list{font-size: 0; text-align: center; min-width: 500px;}
.index-tab .tab-list > li{display: inline-block; margin: 0 20px; padding: 0 20px; height: 50px; line-height: 50px; cursor: pointer; position: relative; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.index-tab .tab-list > li:hover{font-weight: 600; color: #666;}
.index-tab .tab-list > li:hover > a{font-weight: 600; color: #666;}

.cate-counts-wrap{position: absolute; right: 0; top: 20px;}
.cate-list-wrap .private{display: inline-block; padding: 20px 0;}
.cate-list-wrap .private .item-nums{padding-left: 5px;}
.cate-list-wrap .private:hover a span{font-weight: 600;}
.cate-list-wrap .private.select a span{font-weight: 600;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li .article-num{color: #999; padding: 0 4px;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li .hide-num{color: #999; padding: 0 4px;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.morechooce-item{padding-right: 0;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.morechooce-item:before{display: none;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.review-item{position:relative}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.review-item .nfg-work-review{position:absolute;width:180px;line-height:19px;background-color: #e74b3b;color:white;padding:5px 12px;border-radius: 2px;left:-72px;bottom:50px;z-index:1006}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.review-item .nfg-work-review:after {content:''; position: absolute; bottom: -8px; left: 98px;width: 0; height: 0;border-style: solid;border-width: 8px 5px 0 5px;border-color: #e74b3b transparent transparent transparent;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.review-item .common-hover-wrap{width: 143px!important; left: inherit!important; right: 0;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.review-item .common-hover-wrap .review-works a{background:#fff !important; width: 9em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.duration-item .common-hover-wrap{width: 143px!important; left: inherit!important; right: 0;}
.counts-wrap .choose-bar-v3 .choose-bar-bottom li.duration-item .common-hover-wrap .item-num{float: right;}
.need-open{position: relative; display: inline-block; margin-right: 40px; padding: 20px 0;}
.need-open .nums{display: inline-block; padding-left: 5px;}
.need-open .item-nums{font-size: 12px; font-weight: 300; color: #999; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);}
.need-open .cur-cate{padding-right: 20px;}
.need-open .cur-cate.select{font-weight: 600;}
.need-open .hover-wrap{top: 40px; left: -20px;}
.need-open:before{content: ""; width: 10px; height: 6px; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-17/596c7a27f122c.png) no-repeat; background-size: cover; position: absolute; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: 1;}
.need-open.open:before{transform: translateY(-50%) rotate(180deg); -webkit-transform: translateY(-50%) rotate(180deg); -moz-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); -o-transform: translateY(-50%) rotate(180deg);}
.index-tab .tab-list > li.select{font-weight: 600; position: relative;}
.index-tab .tab-list > li.select > a{font-weight: 600;}
.index-tab .tab-list > li.select:after{content: ""; position: absolute; width: 20px; height: 4px; background-color: #e74949; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);}
.index-tab .tab-list > li a .tool-tip {
  /*display: block;*/
  bottom: 46px;
  width: 132px;
}


/* 视频article card */
.video-list{font-size: 0;}
.video-list > li{display: inline-block; background: #fff; margin: 20px 20px 0 0; vertical-align: top; transition: all .15s ease; -webkit-transition: all .15s ease; -moz-transition: all .15s ease; -ms-transition: all .15s ease; -o-transition: all .15s ease;}
.video-list > li:hover{box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);}
.video-list > li.zIndex-high{position: relative; z-index: 3;}
.video-list > li:nth-of-type(4n){margin-right: 0;}
.video-list > .vmovier-migrate > .video-con > .user-info{display: none;}
.video-cover{position: relative; /*overflow: hidden;*/}
.video-cover .exp-type{position: absolute;/*width: 36px;*/height: 18px;border-radius: 2px;background-color: rgba(0, 0, 0, 0.2);top: 12px;right: 12px;font-size: 12px;color: #fff;text-align: center;padding: 0 5px;}
.video-cover .video-cover-con{position: absolute; width: 100%; height: 100%; top: 0; left: 0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: 1;}
.video-cover .video-cover-con .video-mark{position: absolute; font-size: 0; width: 100%; top: 12px; left: 0; padding: 0 14px; box-sizing: border-box;}
.video-con .user-info .icon-private{font-size: 14px; color: #e3e4e5; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.video-cover .video-cover-con .video-mark img{display: inline-block; width: 24px; height: 24px;}
.video-cover .video-cover-con .video-mark .list-tags{float: right;}
.video-cover .video-cover-con .video-mark .list-tags .tag{display: inline-block; width: 24px; height: 16px; background: url("https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/095d7633fb80e64.png") no-repeat; background-size: cover; margin-left: 4px;vertical-align: top;}
.video-cover .video-cover-con .video-mark .list-tags .tag.tag-4k{background-position: 0 0;}
.video-cover .video-cover-con .video-mark .list-tags .tag.tag-2k{background-position: 0 -16px;}
.video-cover .video-cover-con .video-mark .list-tags .tag.tag-vr{background-position: 0 -32px;}
.video-cover .video-cover-con .video-mark .list-tags .tag.tag-recommend{background-position: 0 -48px;}
.list-tags .tag:last-child{margin-right: 0!important;}
.video-cover .duration{color: #fffefe; position: absolute; right: 14px; bottom: 14px; line-height: 1; font-weight: 300; z-index: 1; text-shadow: 0 0 2px rgba(0, 0, 0, 0.4);}
.enter-collection-square .top-wrap {position: relative;}
.enter-collection-square .top-wrap i {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.enter-collection-square .top-wrap i:nth-child(1) {width: 246px; height: 8px; background-color: #f0f0f0;}
.enter-collection-square .top-wrap i:nth-child(2) {width: 258px; height: 4px; background-color: #e5e5e5;}
.enter-collection-square .video-cover .duration {right: 12px; bottom: 12px;}
.enter-collection-square .video-con {padding: 16px; box-sizing: border-box;}
.enter-collection-square .video-con .video-con-top {padding: 0;}
.enter-collection-square .video-con .user-info {border-top: none; line-height: 1; padding: 0; margin-top: 12px;}
.enter-collection-square .video-con .user-info .user-link .name {max-width: 184px;}
.video-cover > img, .video-cover .cover-loading{width: 270px; height: 162px; background: #f0f0f0;}
.video-cover > img{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.video-cover .video-hover-con{position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; background: rgba(0,0,0,.5); opacity: 0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.video-cover .video-cover-con p, .video-cover .video-hover-con p{color: #fff; position: absolute; bottom: 14px; left: 14px; line-height: 1; font-weight: 300;}
.video-cover .video-hover-con .desc{margin: 14px; max-height: 53px;}
.video-cover:hover .video-hover-con{opacity: 1;}
.video-cover:hover .video-cover-con{opacity: 0;}
.video-con{width: 270px; position: relative;}
.video-con .video-con-top{padding: 16px;}
.video-con .video-con-top>a{display: block;}
.video-con .video-share{text-align:center;padding:0 16px 16px;}
.video-con .video-share a.show-qr{background: #F3F4F6;width:100%;line-height:28px;border-radius: 2px;box-shadow: 0px 1px 2px rgba(28, 28, 30, 0.04), 0px 0px 1px rgba(28, 28, 30, 0.16);}
.video-con .video-share a.show-qr:hover{background: #d6d9df;}
.new-cate{margin-top: 12px; text-align: left;max-height: 36px;overflow: hidden;}
.new-cate .i-icon{margin: 0 12px;}
.new-cate span{display: inline-block; vertical-align: middle;}
.video-view span{position: relative; display: inline-block; vertical-align: middle; padding: 0 20px; }
.video-view span:before{color: #ddd; position: absolute; left: 0; top: 1px;}
.video-view span.counts{padding-left: 5px;}
.video-view span.type{padding-right: 5px;}
.video-con .sp{position: absolute; width: 24px; height: 16px; top: 20px; right: 0;}
.video-con > a{display: block;}
.video-con > a > p{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; height: 21px;}
.video-con > a > p:hover{color: #e74b3b;}
.video-view{margin-top: 10px;}
.video-con .user-info{position: relative; display: flex; flex-flow: nowrap; line-height: 48px; padding: 0 16px; border-top: 1px solid #f7f7f7; align-items: center}
.user-info.vmovier-migrate-user .user-link .name {max-width: 230px !important;}
.user-info.vmovier-migrate-user .role{display: none !important; flex: 1;}
.video-con .user-info .user-link{white-space: nowrap; flex: 0;}
.video-con .user-info .popularize-btn {z-index: 100; position: relative; flex-shrink: 0; border: 1px solid rgba(153,153,153,.5); border-radius: 2px; padding: 0 18px; font-size: 12px; line-height: 30px; margin-left: 16px}
.video-con .user-info .popularize-btn:hover {border: solid 1px #999999;}
.video-con .user-info .popularize-btn .popularize-list {position: absolute; top: 23px; left: 0px; background: transparent; padding-top: 6px; transform: translateY(6px); transition: opacity,transform 150ms,150ms; opacity:0; pointer-events: none}
.video-con .user-info .popularize-btn .popularize-list.show {opacity: 100; pointer-events: auto}
.video-con .user-info .popularize-btn .popularize-list div {background: #fff; box-shadow: 0 0 8px 0 rgb(0 0 0 / 10%); padding: 6px 0; width: 100px}
.video-con .user-info .popularize-btn .popularize-list div span {display: inline-block; width: 100%; box-sizing: border-box; padding: 0 16px; transition: background-color 150ms;}
.video-con .user-info .popularize-btn .popularize-list div span:hover {background-color: #f0f0f0;}
.video-con .user-info .avator, .video-con .user-info .avator-wrap-s{display: inline-block;}
.video-con .user-info .avator, .video-con .user-info .avator-loading{width: 22px; height: 22px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;  background: #f0f0f0; border: 1px solid #f0f0f0;}
.video-con .user-info .avator{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.video-con .user-info .user-link .name{padding-left: 8px; max-width: 100px; white-space: nowrap; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; font-weight: 500;}
.video-con .user-info .user-link:hover .name{color: #666;}
.video-con .user-info .user-link:hover .cvip-wrap{color:#F97316;}
.video-con .user-info .user-link:hover .svip-wrap{color:#F97316;}
.video-con .user-info .user-link:hover .avator{opacity: .5;}
.video-con .user-info .user-link .head-wrap{position: relative; display: inline-block; cursor: pointer; line-height: 1;}
.video-con .user-info .authors-head-wrap{position: relative; display: inline-block;width: 22px;height: 22px;overflow: hidden;border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; font-size: 0;border: 1px solid #f0f0f0;vertical-align: middle; transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); }
.video-con .user-info .authors-head-wrap .half{height: 100%;position: absolute;}
.video-con .user-info .authors-head-wrap .half-l{left: -50%;}
.video-con .user-info .authors-head-wrap .half-r{left: 50%;}

.video-con .user-info .authors-head-wrap .quarter{width: 50%;position: absolute;}
.video-con .user-info .authors-head-wrap .quarter-t-l{left: 0%;}
.video-con .user-info .authors-head-wrap .quarter-t-r{left: 50%;}
.video-con .user-info .authors-head-wrap .quarter-b-l{left: 0%;top:50%;}
.video-con .user-info .authors-head-wrap .quarter-b-r{left: 50%;top:50%;}
.video-con .user-info .authors-wrap{visibility: hidden;}


.authors-wrap{position: absolute; width: 196px; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  background-color: #fff; z-index: 20; left: -21px; top: 24px;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; transform: translateY(10px); -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px);}
.flow-authors-card{transform: translateY(10px); -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); opacity: 0; z-index: 10001;}
.flow-authors-card.open{transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); opacity: 1;}
.authors-wrap .authors-list{max-height: 270px; overflow-y: auto;}
.authors-wrap .authors-list li a{display: block; padding: 13px 15px; position: relative; border-bottom: 1px solid #f0f0f0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.authors-wrap .authors-list li a:hover{background-color: #f0f0f0;}
.authors-wrap .authors-list li:last-child a{border-bottom: none;}
.authors-wrap .authors-list li a .avator-wrap{position: absolute; width: 22px; height: 22px; top: 13px; left: 15px;}
.authors-wrap .authors-list li a .avator-wrap:hover{color: #666;}
.authors-wrap .authors-list li a .avator{width: 20px; height: 20px; border: 1px solid #f0f0f0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;  background: #f0f0f0;}
.authors-wrap .authors-list li a .info{margin-left: 33px; height: 18px; padding: 2px 0; display: flex;}
.authors-wrap .authors-list li a .info .name{white-space: nowrap; max-width: 66px;}
.authors-wrap .authors-list li a .info .name:hover{color: #666;}
.authors-wrap .authors-list li a .info .vip-icon {left:5px;top: 50%;display: inline-block;background-size: cover;background-repeat: no-repeat;transform: translateY(-50%);position: absolute;}
.authors-wrap .authors-list li a .info .vip1{padding-left: 5px;flex: 1;white-space: nowrap;position: relative;}
.authors-wrap .authors-list li a .info .vip2{padding-left: 5px;flex: 1;white-space: nowrap;position: relative;}
.authors-wrap .authors-list li a .info .cvip-wrap { color: #EA580C;position: relative;}
.authors-wrap .authors-list li a .info .cvip-wrap:hover{color:#F97316;}
.authors-wrap .authors-list li a .info .cvip-icon {padding-left: 5px;width: 11px; height: 11px;}
.authors-wrap .authors-list li a .info .svip-wrap { color: #EA580C;position: relative;}
.authors-wrap .authors-list li a .info .svip-wrap:hover{color:#F97316;}
.authors-wrap .authors-list li a .info .svip-icon {padding-left: 5px;width: 30px; height: 10px;}

.authors-wrap .authors-list li a .info .roles{white-space: nowrap; padding-left: 5px; flex: 1;}
.user-info .role{padding-left: 16px; white-space: nowrap; flex-grow: 1;}
.award-wrap{float: right; position: relative;}
.user-info .award-btn{display: inline-block; width: 32px; height: 32px; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-06-27/5951f701c9686.png) no-repeat; background-size: cover; cursor: pointer;}
.user-info .award-btn.active{background-position: -32px 0;}


/* 首页创作人card */
.square-creator-card.creator-item-card{width: 270px; margin-right: 20px; background-color: #fff; padding: 0;}
.square-creator-card:nth-of-type(4n){margin-right: 0;}
.square-creator-card-top{position: relative; height: 120px;}
.square-creator-card-top .card-top-cover{position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,.2);}
.square-creator-card-top .cover{width: 270px; height: 120px;}
.square-creator-card-top .avator-wrap{position: absolute; bottom: -40px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);}
.square-creator-card-top .follow-btn{position: absolute; right: 16px; top: 16px; width: 58px; height: 26px; border-radius: 2px; font-size: 12px; font-weight: 500; color: #fff; line-height: 26px; text-align: center; cursor: pointer; border: none;background-color: #fff;color: #333;}
.square-creator-card-top .follow-btn:hover{background-color: rgba(255, 255, 255, 0.75);  -webkit-transition: all .1s ease-in-out; -moz-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out;}
.square-creator-card-top .follow-btn.followed{border: solid 1px rgba(255,255,255,.5)!important;;background-color: rgba(0, 0, 0, 0.1)!important;color: #fff!important;}
.square-creator-card .square-creator-card-top .avator-wrap .avator{border-radius: 50%; width: 80px; height: 80px; border: 2px solid #fff;}
.square-creator-card .square-creator-card-top .avator-wrap .author-v{width: 16px; height: 16px; bottom: 5px; right: 5px;}
.square-creator-card-bottom{text-align: center; padding: 50px 20px 14px;}
.square-creator-card-bottom .user-name{display: inline-block; max-width: 100%; height: 24px;}
.square-creator-card-bottom .user-info{padding-top: 10px; height: 18px; font-size: 0;}
.square-creator-card-bottom .user-follow{padding-top: 11px;}
.square-creator-card-bottom .intro{height: 36px; margin-top: 10px;word-break: break-all;}
.square-creator-card-bottom .cvip-wrap {padding-right: 22px; color: #EA580C;}
.square-creator-card-bottom .cvip-wrap .cvip-icon {width: 18px; height: 14px;}
.square-creator-card-bottom .svip-wrap {padding-right: 43px; color: #EA580C;}
.square-creator-card-bottom .svip-wrap .svip-icon {width: 39px; height: 14px;}
.square-creator-card-bottom .bd-wrap {padding-right: 40px;}
.square-creator-card-bottom .bd-wrap .bd-icon {width: 36.8px;height: 16px;}


/* 创作人creator card */
.creator-item-card{display: inline-block; background: #fff; padding: 20px 20px 12px; width: 230px; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); min-height: 80px; position: relative; vertical-align: top;}
.creator-item-card.flow-card{position: absolute; z-index: 999; opacity: 0; z-index: 10001;}
.creator-item-card.flow-card .cvip-wrap {padding-right: 20px; color: #EA580C;}
.creator-item-card.flow-card .cvip-wrap .cvip-icon {width: 16px; height: 12px;}
.creator-item-card.flow-card .svip-wrap {padding-right: 38px; color: #EA580C;}
.creator-item-card.flow-card .svip-wrap .svip-icon {width: 34px; height: 12px;}
.creator-item-card.flow-card .common-ajax-loading{width: 24px; height: 24px; margin: -12px 0 0 -12px;}
.creator-item-card.flow-card .common-ajax-loading:before{width: 24px; height: 24px;}
.creator-item-card.flow-card .common-ajax-loading:after{width: 24px; height: 24px;}
.creator-item-card.flow-card.transition{transition: all .15s ease-in-out; -webkit-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; -ms-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out;}
.creator-item-card.flow-card .creator-wrap{opacity: 0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.creator-item-card.flow-card:after{content: ""; position: absolute; background-color: #fff; width: 100%; height: 12px; left: 0;}
.creator-item-card .arrow{position: absolute; width: 10px; height: 10px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg);  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); background-color: #fff;}
.creator-item-card.top:after{top: 0;}
.creator-item-card.bottom:after{bottom: 0;}
.creator-item-card.left:after{width: 15px; height: 100%; top: 0!important; left: 0!important; bottom: !important; right: initial!important;}
.creator-item-card.right:after{width: 15px; height: 100%; top: 0!important; right: 0!important; bottom: initial!important; left: initial;!important;}
.creator-item-card .arrow.l{left: 20px; right: auto;}
.creator-item-card .arrow.t{top: -5px; bottom: auto;}
.creator-item-card .arrow.r{right: 20px; left: auto;}
.creator-item-card .arrow.b{bottom: -5px; top: auto;}
.creator-item-card .arrow.l2{left: -5px; right: auto;}
.creator-item-card .arrow.t2{top: 20px; bottom: auto;}
.creator-item-card .arrow.r2{right: -5px; left: auto;}
.creator-item-card .arrow.b2{bottom: 20px; top: auto;}

.creator-item-card .arrow.l-filmplay{left: 30px;}
.creator-item-card .arrow.r-filmplay{right: 30px;}
.creator-item-card .creator-cover{position: absolute; top: 20px;}
.creator-item-card .creator-cover .avator-hover{background: rgba(255,255,255,.0); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.creator-item-card .creator-cover:hover .avator-hover{background: rgba(255,255,255,.5);}
.creator-item-card .creator-cover .cover-img{width: 100%;}
.creator-item-card  .creator-cover img, .creator-item-card .creator-cover .avator-loading{width: 58px; height: 58px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;  display: block; background-color: #f0f0f0; border: 1px solid #f0f0f0;}
.creator-item-card  .creator-cover .author-v{width: 18px; height: 18px; position: absolute; bottom: 0; right: 0;}
.creator-item-card .creator-con{text-align: left; margin-left: 74px; min-height: 60px; margin-bottom: 10px;}
.creator-item-card .desc{height: 34px; line-height: 1.4;}
.creator-item-card .creator-con .title{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; padding-top: 2px; height: 21px;}
.creator-item-card .creator-con .title:hover{color: #666;}
.creator-item-card .creator-con:hover .cvip-wrap{color:#F97316;}
.creator-item-card .creator-con:hover .svip-wrap{color:#F97316;}
.creator-item-card .creator-con > a{max-width: 100%; padding-top: 5px;}
.creator-item-card .creator-con .info{display: flex; font-size: 0;}
.creator-item-card .creator-con .info .profession-wrap{white-space: nowrap;}
.creator-item-card .creator-con .info, .creator-item-card .creator-con .desc{padding-top: 2px; height: 20px;}
.creator-item-card .creator-con .info span[class^="icon-"]{padding-right: 5px;}
.creator-item-card .creator-con .info span.icon-career{padding-left: 10px;}
.creator-item-card .creator-con .name-ellipsis{display: inline-block;overflow: hidden;max-width: 100px;white-space: nowrap;text-overflow: ellipsis;}
.creator-item-card .creator-con  .name-svg{vertical-align: 3px;}
.creator-item-card .excellent-video{font-size: 0; padding: 10px 0 12px;}
.creator-item-card .excellent-video li{display: inline-block; width: 110px; height: 70px; position: relative; margin-right: 10px; background: #f0f0f0;}
.creator-item-card .excellent-video li:last-child{margin-right: 0;}
.creator-item-card .excellent-video li a {height: 100%;}
.creator-item-card .excellent-video li img{width: 100%; height: 100%; object-fit: cover;}
.creator-item-card .excellent-video .ajax-loading .duration-wrap{background: #f0f0f0;}
.creator-item-card .excellent-video .ajax-loading .creator-con{margin-bottom: 16px;}
.creator-item-card .excellent-video li .duration-wrap{position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,.1); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.creator-item-card .excellent-video li .duration-wrap:hover{background: rgba(0,0,0,.3);}
.creator-item-card .excellent-video li .duration-wrap span{color: #fffefe; position: absolute; right: 6px; bottom: 6px; font-weight: 300;}
.creator-item-card  .excellent-info .info-left{display: inline-block; height: 28px; line-height: 28px;}
.creator-item-card  .excellent-info .info-left span{display: inline-block; vertical-align: middle;}
.creator-item-card  .excellent-info .info-left span.counts{padding-left: 5px;}
.creator-item-card  .excellent-info .info-right{width: 58px; height: 26px; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  line-height: 26px; float: right; text-align: center; cursor: pointer; border: 1px solid #e74b3b;}
.creator-item-card .video-empty{margin: 10px 0 12px; text-align: center; line-height: 70px; color: #e3e4e5;}
/* 翻页page css */
.page *{min-width: 30px; padding: 0 5px; height: 36px; font-size: 14px; line-height: 36px; color: #333; background: #fff; text-align: center; margin-right: 5px; display: inline-block; vertical-align: middle;}
.page .page-points{background-color: transparent; margin: 0 5px 0 0; padding: 0;}
.page .current{background: #e74b3b; color: #fff;}
/* font & color */
.fw_300{font-weight: 300;}
.fw_600{font-weight: 600;}
.fs_10{font-size: 10px;}
.fs_12{font-size: 12px;}
.fs_13{font-size: 13px;}
.fs_14{font-size: 14px;}
.fs_16{font-size: 16px;}
.fs_18{font-size: 18px;}
.fs_20{font-size: 20px;}
.fs_24{font-size: 24px;}
.fs_26{font-size: 26px;}
.fs_28{font-size: 28px;}
.fs_30{font-size: 30px;}
.c_b_0{color: #000000;}
.c_b_3{color: #333333;}
.c_b_6{color: #666666;}
.c_b_9{color: #999999;}
.c_b_26{color: #262626;}
.c_b_53{color: #535353;}
.c_b_2{color: #222222;}
.c_b_s_1{color: #33343b;}

.c_r_1{color: #e74b3b;}
.c_r_2{color: #b83c2f;}

.c_w_f{color: #ffffff;}
.c_w_f8{color: #f8f8f8;}
.c_w_f0{color: #f0f0f0;}
.c_w_87{color: #878787;}

.c_g{color: #28ca42;}

.c_b{color: #3890e9;}

.black-header{position: fixed; height: 40px; background: #333; width: 100%;}
.black-header-list{height: 100%; padding: 0 40px;}
.black-header-list li{float: left; margin-right: 42px; position: relative;}
.black-header-list li:after{content: ""; position: absolute; right: -20px; top: 15px; height: 10px; width: 2px; background: rgba(255,255,255,.1)}
.black-header-list li:last-child:after{background: none;}
.black-header-list li a{display: block; line-height: 40px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.black-header-list li a:hover{color: #666;}

.black-header.black-v2{position: static;}
/* header */
.header-common{position: fixed; width: 100%; background: #fff; min-width: 1280px; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); top: 0; z-index: 10001;}
.header-common.transition{transition: transform .3s cubic-bezier(0.35, 0, 0.25, 1), -webkit-transform .3s cubic-bezier(0.35, 0, 0.25, 1);}
.header-common.pa-normal{position: absolute; top: 0;}
.header-common.pf-up{transform: translateY(-70px);}
.header-common.pf-normal{transform: translateY(0px);}
.header-common .header-con{height: 60px; padding: 0 30px; font-size: 0;}
.header-common .header-con .logo{height: 100%; text-align: center; transition: .15s; -webkit-transition: .15s; -moz-transition: .15s; -ms-transition: .15s; -o-transition: .15s;}
.header-common .logo .logo-wrap{display: inline-block; width: 100px; height: 100%; position: relative;}
.header-common .logo .logo-wrap svg{position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);}
.header-common .logo .logo-wrap.white-logo path{fill: #ffffff!important;}
.header-common .logo .logo-wrap.red-logo path{fill: #E74B3B!important;}
.header-common .nav-list{display: inline-block; margin-left: 20px;}
.header-common .nav-list .nav-item{float: left; position: relative; padding: 0 18px;}

/*.header-common .nav-list .nav-item.newera{padding-left: 28px;}*/
.header-common .nav-list .nav-item.newera img{height: 22px; margin-top: 15px; padding: 3px; border: 1px solid #C8A06E;}
.header-common .nav-list .nav-item.newera a:hover{opacity: .8;transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
/*.header-common .nav-list .nav-item.resource:after{content: ""; position: absolute; right: 0; top: 14px; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-06/595db13867da4.png) no-repeat; background-size: cover; width: 19px; height: 7px;}*/

.header-common .nav-list .nav-item .icon-arrow-down:before{font-size: 12px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); right: 5px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; cursor: pointer; color: #e3e4e5;}
.header-common .nav-list .nav-item:hover .icon-arrow-down:before{color: #333;}
.header-common .nav-list .nav-item > a{cursor: pointer; position: relative; color: #333; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; height: 60px; line-height: 60px;}
.header-common .nav-list .nav-item:hover > a{font-weight: 500; opacity: 1;}
.header-common .nav-list .nav-item:hover:after{opacity: 1;}
.header-common .nav-list .nav-item.select > a{font-weight: 500;}
.header-common .nav-list .nav-item.activity,.nav-item.hire {
  display: none
}
@media screen and (min-width: 1540px) {
  .header-common .nav-list .nav-item.activity,.nav-item.hire {
    display: block
  }
  .header-common .nav-list .more-hire,.more-activity {
    display: none
  }
}

.header-common .right-part .search-bar{float: left;position: relative;height:60px;margin-right:24px;display:flex;justify-content:center;align-items:center;transition:opacity 0.15s}
.header-common .right-part .search-bar .search-form{width: 274px;box-sizing:border-box;height: 30px;border: solid 1px #e5e5e5;background-color: #ffffff;padding-right: 11px;border-radius:2px;display:flex;justify-content:space-between;align-items:center;cursor:default;transition:all 0.15s}
.header-common .right-part .search-bar .search-form.isfocus{border: solid 1px #595959;}
.header-common .right-part .search-bar .search-form .scroll-words-box{position:absolute;top:20px;height:20px;width:237px;padding-left:10px;box-sizing: border-box;font-size:14px;color: #c4c4c4;overflow:hidden}
.header-common .right-part .search-bar .search-form .scroll-words-box .words-box{width:100%;position:absolute;top:0;}
.header-common .right-part .search-bar .search-form .scroll-words-box .words-box.has-animation{transition: transform 1s}
.header-common .right-part .search-bar .search-form .scroll-words-box .words-box .word-box{width:100%;height:20px;display:flex;justify-content:flex-start;align-items:center;transition: height 0.5s;overflow:hidden}
.header-common .right-part .search-bar .search-form .search-input{font-size:14px;flex:auto;height:20px;border:none;padding:0 0 0 10px;color: #595959;background-color:transparent;box-shadow: none;z-index:1}
.header-common .right-part .search-bar .search-form .search-input::placeholder{color: #c4c4c4;}
.header-common .right-part .search-bar .search-form .search-clean-btn{flex:none;padding:0 6px 0 8px;background-color:transparent;border:none;cursor:pointer;height:12px;transition:all 0.5s}
.header-common .right-part .search-bar .search-form .search-clean-btn:before{content: url('/public/images/icon-search-clean-deep.svg')}
.header-common .right-part .search-bar .search-form .search-btn{flex:none;font-size:12px;padding:0 0 0 11px;border:none;background-color:transparent;cursor:pointer;border-left:1px solid #e5e5e5;color:#595959;}
.header-common .right-part .search-bar .search-form .search-btn:hover{color:#a1a1a1;}
.header-common .right-part .search-bar .search-form .search-btn:active{color:#1a1a1a;}
.header-common .right-part .search-bar .history-hot-recommend {width:100%;position: absolute;top:60px;background-color: #FFFFFF;padding:12px 0 10px;box-sizing: border-box;border-radius: 2px;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);opacity: 0; pointer-events:none; transition:all 0.15s}
.header-common .right-part .search-bar .history-hot-recommend.show{ opacity:1; pointer-events:auto; top:50px}
.header-common .right-part .search-bar .history-hot-recommend .title {display:flex; justify-content:space-between; align-items:center; font-size: 12px; line-height: 18px; color:#9E9E9E}
.header-common .right-part .search-bar .history-hot-recommend .history-recommend{margin-bottom:16px;padding:0 12px}
.header-common .right-part .search-bar .history-hot-recommend .history-recommend .title .clear-histroy-btn{cursor:pointer}
.header-common .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box{display:flex; flex-wrap: wrap; max-height: 104px; overflow: hidden; font-size: 14px; margin: 0 -4px}
.header-common .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box .history-word{cursor:pointer;padding:2px 8px;background-color: #F0F0F0;margin: 10px 4px 0;line-height: 20px;border-radius: 2px;color:#1A1A1A !important;text-overflow: ellipsis;max-width:10em;overflow:hidden;white-space:nowrap}
.header-common .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box .history-word:hover{background-color:#E5E5E5}
.header-common .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box .history-word:active{background-color:#C4C4C4}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .title{padding:0 12px}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box{padding-top:2px;font-size:14px}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word div {cursor:pointer;display:flex;justify-content:flex-start;align-items:center;padding:6px 12px;line-height:20px; color: #1A1A1A}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word div:hover {background-color:#F0F0F0}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word .hot-number {margin-right:10px;flex-shrink:0}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word .hot-content {position:relative;flex-shrink:1;overflow:hidden;display:flex;align-item:center}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word .hot-content span {display:inline-block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word .hot-type {flex-shrink:0;margin-left:8px;height:14px;border-radius: 2px;}
.header-common .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word:nth-child(n+4) .hot-number {color:#A1A1A1}




.header-v2 .right-part .search-bar .search-form{border: solid 1px rgba(229, 229, 229, 0.2);background-color:rgba(255, 255, 255, 0.1)}
.header-v2 .right-part .search-bar .search-form.isfocus{border: solid 1px rgba(229, 229, 229, 0.2);background-color:rgba(255, 255, 255, 0.2);}
.header-v2 .right-part .search-bar .search-form .search-input{color: #ffffff}
.header-v2 .right-part .search-bar .search-form .search-input::placeholder{color: rgba(255, 255, 255, 0.5);}
.header-v2 .right-part .search-bar .search-form .search-clean-btn:before{content: url('/public/images/icon-search-clean.svg')}
.header-v2 .right-part .search-bar .search-form .search-btn{color:white;border-left:1px solid rgba(240, 240, 240, 0.2);}
.header-v2 .right-part .search-bar .search-form .search-btn:hover{color:rgba(255, 255, 255, 0.8);}
.header-v2 .right-part .search-bar .search-form .search-btn:active{color:rgba(255, 255, 255, 0.5);}
.header-v2 .right-part .search-bar .history-hot-recommend {background-color: #333333}
.header-v2 .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box .history-word{color:#FFFFFF !important;background-color: #595959}
.header-v2 .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box .history-word:hover{background-color:#A1A1A1}
.header-v2 .right-part .search-bar .history-hot-recommend .history-recommend .history-words-box .history-word:active{background-color:#1A1A1A}
.header-v2 .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word div{color: #FFFFFF}
.header-v2 .right-part .search-bar .history-hot-recommend .hot-recommend .hot-words-box .hot-word div:hover{background-color:#3D3D3D}


.header-common .issue-hover-wrap{position: absolute; min-width: 170px; left: 0px; padding-top: 15px; top: 40px; z-index: 10001;/* visibility: visible; opacity: 1;*/}
.header-common .issue-hover-wrap-wide{min-width: 200px;}
.header-common .hover-box{overflow: visible; max-height: none;}
.header-common .hover-box .list .vip-zone a, .header-common .hover-box .list .vip-zone .viphint{
  font-size: 14px;
  font-weight: 300;
  color: #333;
  display: block;
  text-align: left;
  padding: 0 20px;
  position: relative;
}
.header-common .hover-box .list .vip-zone .viphint {
  font-size: 12px;
  padding-bottom: 10px;
  height: auto;
  line-height: initial;
  color: #999;
}
.header-common .hover-box .list .vip-zone .viphint a {
  color: #e74b3b;
  padding: 0;
  float: right;
  cursor: pointer;
  height: initial;
  line-height: initial;
  font-size: 12px;
}
.header-common .hover-box .list .vip-zone .viphint a:hover {
  font-weight: 500;
}
.header-common .hover-box .list .vip-zone .vipicon {
  display: inline-block;
  width: 15.4px;
  height: 12px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d5614ec517cc.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0;
  vertical-align: -1px;
}
.header-common .hover-box .list .vip-zone .vip2 {
  display: inline-block;
  width: 30px;
  height: 12px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d5614ec517ee.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
}
.header-common .hover-box .list .vip-zone .vip2overdue {
  display: inline-block;
  width: 11.4px;
  height: 10.8px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d5614ec517dd.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
}
.header-common .hover-box .list .vip-zone .bd {
  display: inline-block;
  width: 39px;
  height: 17px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2021/05/2760af0eab8bbaa.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
}
.header-common .hover-box .list .vip-zone .bdoverdue {
  display: inline-block;
  width: 39px;
  height: 17px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2021/05/2760af0eab85466.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
}
.overdue {
  display: inline-block;
  width: 15.4px;
  height: 12px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d5614ec517dc.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
}
.header-common .hover-box .list > li a.nav-sublist-title{position: relative; font-size: 14px; font-weight: 500; color: #333; background-color: transparent!important; height: 36px;}
.header-common .hover-box .list > li a.nav-sublist-title:hover{color: #999;}
.header-common .hover-box .list > li a.nav-sublist-title i:before{display: inline-block; font-size: 12px; cursor: pointer; -webkit-transform: scale(0.9); transform: scale(0.9); font-weight: 300;}
.header-common .hover-box .list > li .nav-sublist{padding-bottom: 8px; overflow: hidden; min-width: 192px;}
.header-common .hover-box .list > li .nav-sublist .nav-sublist-item{position: relative; width: 96px; display: block; float: left; font-size: 12px;}
.header-common .issue-hover-wrap-wide .hover-box .list > li .nav-sublist .nav-sublist-item{width: 99px;}
.header-common .hover-box .list > li .nav-sublist .nav-sublist-item.nav-sublist-item-banner{width: 192px;}

.header-common .nav-item .new-tag::after{content:'NEW';width:54px;height:24px;line-height:24px;border-radius:2px;background-color:#e74b3b;color:#fff;font-size:18px;font-weight:400;position:absolute;top:5px;right:-40px;transform: scale(0.5);text-align: center;}
.header-common .nav-item .db11-tag::after{content:'11.11';width:50px;height:24px;line-height:24px;border-radius:2px;background-color:#e74b3b;color:#fff;font-size:18px;font-weight:400;position:absolute;top:5px;right:-45px;transform: scale(0.5);text-align: center;}
.header-common .common-hover-wrap.hover-xpccode{min-width:160px;overflow:visible;}
.header-common .hover-box .xpccode img{width:120px;height:120px;margin:14px 20px 12px 20px;border: 2px solid #fff;}
.header-common .hover-box .xpccode p{color:#333;font-size:12px;font-weight:300;line-height:1.67;text-align:center;margin-bottom:14px}
.header-v2.header-common .hover-box .xpccode p{color: #ffffff;}

.header-common .hover-box .list > li .nav-sublist .nav-sublist-item a{display: inline-block; font-size: 12px; font-weight: 300; color: #333; margin: 0 0 0 20px; padding: 0; height: auto; line-height: 2.4;}
.header-common .hover-box .list > li .nav-sublist .nav-sublist-item-banner:nth-of-type(1):after {content: 'HOT'; border-radius: 2px; color: #fff; position: absolute; width: 32px; height: 18px; line-height: 18px; font-weight: 500; text-align: center; top: -1px; background: #e74b3b; font-size: 12px; transform: scale(0.7);
}
.header-common .hover-box .list > li .nav-sublist .nav-sublist-item a:hover{color: #999;}
.header-common .hover-box .list > li .hothover:hover{color: #fff!important;}
.transition .hover-box .list > li .hothover:hover{color: #999!important; }
.header-common .right-part{font-size: 0;}
.header-common .right-part > li{display: inline-block; vertical-align: middle; height: 60px; line-height: 60px; text-align: center;}
.header-common .right-part > li.login-btn{margin-left: 40px;}
.header-common .right-part > li > a{color: #333; font-size: 16px; font-weight: 500; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; height: 60px; line-height: 60px;/* width: 100%*/;}
.header-common .right-part > li > a:hover{color: #999;}
.header-common .right-part > li.search-btn{display: inline-block; cursor: pointer;}
.header-common .right-part > li.search-btn:before{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.header-common .right-part > li.search-btn:hover:before{color: #999;}
.header-common .right-part > li.ring-btn{display: inline-block; cursor: pointer;position: relative;}
.header-common .right-part > li.ring-btn a:before{font-size: 20px;}
.header-common .right-part > li.ring-btn:hover:before{color: #666;}
.header-common .right-part > li.search-btn:before{font-size: 20px;}
.header-common .right-part > li.user-face{position: relative; margin-left: 24px;}
.header-common .right-part > li.user-face .user-face-con{display: block; width: 32px; height: 32px; margin-top: 14px; position: relative;}
.header-common .right-part > li.user-face img{width: 30px; height: 30px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; border: 1px solid #f0f0f0;}
.header-common .right-part > li.user-face img:hover{opacity: .8;}
.header-common .right-part > li.upload-btn{position: relative; margin-left: 24px; height: 32px; line-height: 32px;}
.header-common .right-part > li.upload-btn.point::before {
  content: "";
  position: absolute;
  right: -6px;
  top: -6px;
  width: 12px;
  height: 12px;
  background-color: #fff;
  border-radius: 50%;
}
.header-common .right-part > li.upload-btn.point:after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  right: -4px;
  top: -4px;
  background-color: #e74b3b;
  border-radius: 50%;
}
.header-common .right-part > li.upload-btn > a{color: #fff; width: 90px; text-align: center; background-color:  #e74b3b; line-height: 32px; height: 32px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; font-size: 12px; border-radius: 2px;}
.header-common .right-part > li.upload-btn > a:hover {background-color: #cf4334;}
.header-common .right-part > li.upload-btn .upload-list-wrap {position: absolute; right: 0; top: 32px; z-index: 10001; padding-top: 8px; transform: translateY(10px); opacity: 0; visibility: hidden; transition: .15s ease-in-out;}
.header-common .right-part > li.upload-btn:hover .upload-list-wrap {opacity: 1; visibility: visible; transform: translateY(0);}
.header-common .right-part > li.renewal {
  position: absolute;
  background: #FFF;
  z-index: 1;
  bottom: -63px;
  right: 168px;
  padding: 16px;
  border-radius: 2px;
  font-size: 14px;
  box-shadow: 2px 3px 5px 1px #CCC;
  height: auto;
  line-height: initial;
}
.header-common .right-part > li.renewal.shorter {
  width: 237px;
}
.header-common .right-part > li.renewal.longer {
  width: 256px;
}
.header-common .right-part > li.renewal .triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 4px 6px 4px;
  border-color: transparent transparent #FFF transparent;
  top: -6px;
  position: absolute;
  right: 23px;
}
.header-common .right-part > li.renewal .btn-red {
  padding: 5px 11px;
  background-color: #e74b3b;
  color: #FFF;
  font-size: 12px;
  border-radius: 2px;
  margin-left: 20px;
  height: auto;
  line-height: normal;
}
.header-common .right-part > li.renewal .icon-close{
  font-size: 20px;
  color: #595959;
  display: inline-block;
  vertical-align: -5px;
  margin-left: 10px;
  cursor: pointer;
}
.header-common .right-part > li.vip-btn {
  height: 22px;
  line-height: 22px;
}
.header-common .right-part > li.vip-btn a.vipicon {
  width: 65px;
  height: 22px;
  display: inline-block;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/095d75efa922054.png);
  background: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/095d75efa922061.png) no-repeat center;
  background-size: cover;
  vertical-align: -1px;
  transition: .3s;
  margin-right: 24px;
  vertical-align: -5px;
}
.header-common .right-part > li.vip-btn .vipicon:hover{
  background: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/095d75efa922054.png) no-repeat center;
  background-size: cover;
  transition: .3s;
}
.header-common .right-part > li.upload-btn .upload-list-wrap .upload-list {border-radius: 2px; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); padding: 6px 0; background-color: #fff;}
.header-common .right-part > li.upload-btn .upload-list-wrap .upload-list li {position: relative;}
.header-common .right-part > li.upload-btn .upload-list-wrap .upload-list li:before {position: absolute; font-size: 16px; color: #333; left: 20px; top: 15px;}
.header-common .right-part > li.upload-btn .upload-list-wrap .upload-list li a {height: 44px; font-size: 14px; font-weight: 400; color: #333; padding: 0 70px 0 44px; text-align: left; line-height: 44px; white-space: nowrap;}
.header-common .right-part > li.upload-btn .upload-list-wrap .upload-list li:hover a {color: #999;}
.header-common .right-part > li.upload-btn .upload-list-wrap .upload-list li:hover::before {color: #999;}
.header-common .right-part > li.login-btn{margin-right: 0;}
.header-common .right-part > li.login-btn a{text-align: center; line-height: 60px; height: 60px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.header-common .right-part .user-hover-wrap{position: absolute; width: 170px; left: -22px; padding-top: 15px; top: 45px; z-index: 1000;}
.header-common .right-part .feature-tip{position: absolute; display: none; font-size: 16px; color: rgba(255, 255, 255, 0.8); width: 197px; height: 48px; line-height: 48px; left: -84px; top: 56px; background: linear-gradient(93.33deg, #FF7658 0%, #FC1841 103.22%); border: 1px solid #FCA5A5; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); border-radius: 6px;}
.header-common .right-part .feature-tip::before{display:block; content:''; position: absolute;  width: 10px; height: 10px; left: 50%; top: -2px; background: #fe4a4ae0; transform: rotate(45deg) translateX(-50%);}
.header-common .right-part .feature-tip  .icon-close {position: absolute;font-size: 12px; right: 4px; top: 2px; cursor: pointer;}

.header-v2{background: rgba(0,0,0,0); border-bottom: none; box-shadow: none;}
.header-common.header-v2 .right-part > li.upload-btn.point::before {display: none;}
.header-v2 .issue-hover-wrap.discover .hover-box{border: none;}
.header-v2 .hover-box .list > li a.nav-sublist-title:hover{color: #fff;}
.header-v2 .hover-box .list > li a.nav-sublist-title:hover{color: #999;}
.header-v2 .hover-box .list > li .nav-sublist .nav-sublist-item a{color: #999;}
.header-v2 .hover-box .list > li .nav-sublist .nav-sublist-item a:hover{color: #fff;}
.header-v2 .issue-hover-wrap.discover .hover-box .dis-item{border-color: #444;}
.header-v2 .common-hover-wrap .hover-box{background-color: #333; border: solid 1px rgba(51, 51, 51, 0.5); color: #999;}
.header-v2 .common-hover-wrap .hover-box .list > li.line{background-color: #3d3d3d;}
.header-v2 .common-hover-wrap .hover-box .list > li a{color: #999;}
.header-v2 .common-hover-wrap .hover-box .list > li a .dyj-logo {
  width: 24px;

  vertical-align: -4px;
  margin-right: 8px;
  margin-left: 0px;
}
.header-v2 .common-hover-wrap .hover-box .list > li.vip-zone span{color: #999;}
.header-v2 .common-hover-wrap .hover-box .list > li:hover > a{background: #3d3d3d;}
.header-v2 .nav-list .nav-item .icon-arrow-down:before{color: #fff; opacity: .4;}
.header-v2 .nav-list .nav-item:hover .icon-arrow-down:before{color: #fff; opacity: 1;}
.header-v2 .nav-list .nav-item > a{color: #fff; opacity: 1;}
.header-v2 .nav-list .nav-item.select a{opacity: 1; font-weight: 600;}
.header-v2 .right-part > li.upload-btn > a{background-color: rgba(255, 255, 255, 0.1);}
.header-v2 .right-part > li.upload-btn > a:hover{background-color: rgba(255, 255, 255, 0.4); opacity: 1;}
.header-v2 .right-part > li.upload-btn .upload-list-wrap .upload-list {box-shadow: none; background-color: #333;}
.header-v2 .right-part > li.upload-btn .upload-list-wrap .upload-list li:before {color: #979797;}
.header-v2 .right-part > li.upload-btn .upload-list-wrap .upload-list li a {color: #999;}
.header-v2 .right-part > li.upload-btn .upload-list-wrap .upload-list li:hover a {color: #fff;}
.header-v2 .right-part > li.upload-btn .upload-list-wrap .upload-list li:hover::before {color: #fff;}
.header-v2 .right-part > li.login-btn{margin-right: 0;}
.header-v2 .right-part > li.login-btn a{text-align: center; line-height: 60px; height: 60px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.header-v2 .right-part > li > a{color: #fff; opacity: 1; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.header-v2 .right-part > li > a:hover{opacity: .8; color: #fff;}
.header-v2 .right-part > li.search-btn:before{color: #fff;}
.header-v2 .right-part > li.search-btn:hover:before{color: #fff; opacity: .6;}
.header-v2 .right-part > li.ring-btn:before{color: #fff;}
.header-v2 .right-part > li.login-btn a{color: #fffefe; background: none;}
.header-v2 .right-part > li.login-btn a:hover{opacity: .6;}
.header-v2 .right-part.no-login > li.login-btn a:hover{background: none;}

.header-v2.light-color .nav-list, .header-v2.light-color .right-part{opacity: .3;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.header-v2.light-color .right-part{
  opacity: 1;
}
.header-v2.light-color .right-part .search-btn, .header-v2.light-color .right-part .ring-btn, .header-v2.light-color .right-part .user-face, .header-v2.light-color .right-part .upload-btn, .header-v2.light-color .right-part .search-bar, .header-v2.light-color .right-part .vip-btn a.vipicon {
  opacity: .3;
}
.header-v2.light-color:hover .nav-list, .header-v2.light-color:hover .right-part .search-btn, .header-v2.light-color:hover .right-part .ring-btn, .header-v2.light-color:hover .right-part .user-face, .header-v2.light-color:hover .right-part .upload-btn, .header-v2.light-color:hover .right-part .search-bar, .header-v2.light-color:hover .right-part .vip-btn a.vipicon {opacity: 1;}
.header-v2.light-color .right-part > li.user-face img{border-color: rgba(255,255,255,.3);}
.search-wrap{position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,.8); z-index: 10002; transition: .15s ease; -webkit-transition: .15s ease; -moz-transition: .15s ease; -ms-transition: .15s ease; -o-transition: .15s ease;}
.search-wrap .search-box{height: 60px; background-color: #fff;}
.search-wrap .search-box .search-con{width: 924px; height: 100%; margin: 0 auto; position: relative;}
.search-wrap .search-box .search-con *{display: inline-block; vertical-align: middle;}
.search-wrap .search-box .search-con input{width: 804px; font-size: 14px; color: #262626 !important; line-height: normal; background:none; outline: none; border-radius: none; border: none; font-weight: 300;}
::-webkit-input-placeholder{color: #999;}
:-moz-placeholder{color: #999;}
::-moz-placeholder{color: #999;}
:-ms-input-placeholder{color: #999;}
.search-wrap .search-box .search-con{white-space: nowrap;}
.search-wrap .search-box .search-con .search-left{transition: 0.3s ease-in-out; opacity: 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(20px, 0, 0); -moz-transform: translate3d(20px, 0, 0); -ms-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0);}
.search-wrap .search-box .search-con .search-left.slideLeft{opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.search-wrap .search-box .search-con .search-btn{display: inline-block; margin-right: 14px;}
.search-wrap .search-box .search-con .search-btn:before{font-size: 20px;}
.search-wrap .search-box .search-con .search-close-btn{display: inline-block; margin-left: 30px; cursor: pointer; transition: opacity 0.6s ease-in-out; -webkit-transition: opacity 0.6s ease-in-out; -moz-transition: opacity 0.6s ease-in-out; -ms-transition: opacity 0.6s ease-in-out; -o-transition: opacity 0.6s ease-in-out; font-size: 17px; opacity: 0;}
.search-wrap .search-box .search-con .search-close-btn:before{font-size: 24px; color: #333;}
.search-wrap .search-box .search-con .search-close-btn.show{opacity: 1;}

/* footer */
.footer-wrap{width: 100%; background: #fff; height: 321px;}
.footer-inner{position: absolute; width: 100%; height: 321px;}
.footer-wrap .footer-con{width: 1140px; padding: 50px 20px; margin: 0 auto;}
.footer-wrap .left{width: 465px;}
.footer-wrap .left .logo-wrap{margin-right: 20px;}
.footer-wrap .left .logo{width: 140px;}
.footer-wrap .left p{line-height: 1.5; margin: 18px 0 39px 0; text-align: justify; line-height: 1.8;}
.footer-wrap .left .other-wrap a{display: inline-block; margin-right: 20px;}
.footer-wrap .right .column-item{font-size: 12px; line-height: 1.5; width: 150px;}
.footer-wrap .right .column-item:last-child{width: 90px;}
.footer-wrap .right .column-item .title{padding-bottom: 20px;}
.footer-wrap .right .column-item .list li{/*font-weight: 300;*/margin-bottom: 14px;}
.footer-wrap .right .column-item .list li:last-child{margin-bottom: 0; min-width: 92px;}
.footer-wrap .right .column-item .list li a{color: #999;}
.footer-wrap .right .column-item .list li a:hover{color: #666;}
.footer-wrap .footer-bottom{background-color: #f1f1f1;}
.footer-wrap .footer-bottom .bottom-con{height: 56px; width: 1140px; margin: 0 auto; line-height: 56px; padding: 0 20px;}
.footer-wrap .footer-bottom .bottom-con .copyright{font-size: 12px; color: #999; margin-right: 27px;}
.footer-wrap .footer-bottom .bottom-con .copyright a *{display: inline-block; color: #999;}
.footer-wrap .footer-bottom .bottom-con .copyright img{width: 20px; margin-right: 5px; vertical-align: middle;}
.footer-wrap .footer-bottom .bottom-con .copyright a:hover p{color: #666;}
.footer-wrap .footer-bottom .bottom-con span{vertical-align: middle;}
.footer-wrap .footer-bottom .bottom-con a span {width: 88px!important;height: 32px!important;}
.footer-wrap .footer-bottom .other-wrap{float: right; height: 56px;}
.footer-wrap .footer-bottom .other-wrap a{display: inline-block; margin-left: 36px; height: 56px;position: relative;}

.footer-wrap .footer-bottom .other-wrap a span{line-height: 56px!important;}
.footer-wrap .weibo .icon-weibo:before, .footer-wrap .weixin .icon-weixin:before{color: #333; font-size: 18px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.footer-wrap .weibo:hover .icon-weibo:before, .footer-wrap .weixin:hover .icon-weixin:before{color: #666;}
.footer-wrap .footer-bottom .record{margin: 10px 0 0 0;}
.footer-wrap .footer-bottom .other-wrap .weixin{position: relative;}
.footer-wrap .footer-bottom .other-wrap .weixin:hover .qr-wrap{display: block;}
.footer-wrap .footer-bottom .other-wrap .qr-wrap{width: 90px; height: 100px; background: #fff; position: absolute; left: -35px; top: -95px; text-align: center; display: none; box-shadow: 0 0 8px rgba(0,0,0,.1); z-index: 1000;}
.footer-wrap .footer-bottom .other-wrap .qr-wrap:after{content: ''; display: block; position: absolute; border: 8px solid rgba(255, 255, 255, 0); border-top: 15px solid rgba(255, 255, 255, 1); top: 94px; left: 35px;}
.footer-wrap .footer-bottom .other-wrap .qr-wrap .qr-title{font-size: 10px; opacity: .7; color: #000; padding-top: 10px; line-height: 1.5;}
.footer-wrap .footer-bottom .other-wrap .qr-img{width: 70px; height: 70px; display: inline-block;}
.footer-wrap .footer-bottom .other-wrap .qr-img img{width: 100%;}
/*footer 移动端和微信*/
.footer-wrap .footer-bottom .other-wrap .hover-qrcode{display: inline-block;position: relative;}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode>a {cursor: pointer;}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode .icon-iphone::before{font-size:20px;color:#333}.footer-wrap .footer-bottom .other-wrap .hover-qrcode:hover .icon-iphone::before{color:#999}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode em{display:inline-block;vertical-align:top;height:100%;font-style:normal;color:#333}.footer-wrap .footer-bottom .other-wrap .hover-qrcode:hover em{color:#999}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode .qr-wrap{width:120px;height:140px;display:block;box-sizing:border-box;position:absolute;left:0;top:-136px;padding:5px;display:none;z-index: 10002;}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode.weixin .qr-wrap{padding:0;left:-58px}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode .qr-wrap em{font-size:12px;color:#333;font-style:normal;letter-spacing:2px;text-align:center;position:absolute;left:0;right:0;bottom:5px;height:17px;line-height:17px!important}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode:hover .qr-wrap{display:block}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode .qr-wrap:after{top:140px;left:56px;border-top:6px solid rgba(255,255,255,1)}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode .qr-wrap img{width:100%}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode .qr-wrap{cursor: default;}
.footer-wrap .footer-bottom .other-wrap .hover-qrcode a{display: block;position: relative;}
/* 首页 */
.index-container .banner-link{width: 1140px; height: 400px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); box-shadow: 0 -5px 50px 0 rgba(0, 0, 0, 0.2); z-index: 100; cursor: pointer; overflow: hidden; /*box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.18000000000000005);*/}
.index-container .banner-link .inner-cover{position: absolute; width: 100%; height: 210px; bottom: 0; left: 0; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.4));}
.index-container .back-layer .swiper-pagination span{bottom: 30px; width: 6px; height: 6px; background-color: rgba(255, 255, 255, .3); opacity: 1;}
.index-container .back-layer .swiper-pagination span.swiper-pagination-bullet-active{background-color: rgba(255, 255, 255, 1);}
.index-container .banner-link .float-banner-img{width: 1140px; height: 400px; transform: scale(1.02);  transition: transform 1.5s cubic-bezier(0,1,.75,1);}
.index-container .banner-link .float-banner-con{position: absolute; left: 0; bottom: 0; width: 1040px; overflow: hidden; height: 316px; padding: 42px 50px;}
.index-container .banner-link .float-banner-con .float-banner-con-inner{position: absolute; transition: .5s transform; bottom: 42px;}
.index-container .banner-link.normal .float-banner-con .float-banner-con-inner{transform: translateY(0)!important;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action{display:inline-block;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.transition{ -webkit-transform: translateY(40px); transition: opacity 0.6s 0.15s cubic-bezier(0.19, 1, 0.22, 1),-webkit-transform 1s 0.15s cubic-bezier(0.19, 1, 0.22, 1); opacity: 0; pointer-events:none;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.cate {transition-delay: 0.3s;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.title {transition-delay: .35s;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.user-info {transition-delay: .4s;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.user-info .cvip-wrap{color:#f0f0f0;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.user-info .svip-wrap{color:#f0f0f0;}
.index-container .banner-link .float-banner-con .float-banner-con-inner .action.show{transform: translateY(0); opacity: 1;}
.index-container .banner-link.normal .float-banner-img{transform: scale(1);}
.index-container .banner-link.normal .float-banner-con .desc{opacity: 0;}
.index-container .banner-link .float-banner-con .cate{opacity: .75;}
.index-container .banner-link .float-banner-con .title{padding: 8px 0; font-weight: 800;}
.index-container .banner-link .float-banner-con .desc{width: 380px; line-height: 1.67; margin-top: 14px; opacity: .75; position: absolute; transition: .5s; opacity: 1; max-height: 58px;}
.index-container .banner-link .float-banner-con .user-info div{width: 24px; height: 24px; position: relative;}
.index-container .banner-link .float-banner-con .user-info div .avator{width: 24px; border-radius: 50%;/* border: 1px solid #f0f0f0;*/}
.index-container .banner-link .float-banner-con .user-info .name{margin-left: 10px;}
.index-container .banner-wrap .back-layer{width: 100%; height: 100%;}
.index-container .banner-wrap .back-layer .back-layer-cover{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 99;}
.index-container .banner-wrap .back-layer .back-layer-cover span{position: absolute; width: 100%; top: 0; left: 0; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.4));height: 340px;}
.index-container .banner-wrap .back-layer li .back-banner-img{width: 100%; height: 480px; background-color: #e3e4e5;}
.index-container .banner-wrap .page-btn{background: none; width: 42px; position: absolute; top: 50%; opacity: 0; transition: opacity .3s; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); text-align: center; margin-top: 30px;}
.index-container .banner-wrap .page-btn:before{color: #fff; opacity: .2;}
.index-container .banner-wrap .page-btn:hover:before{opacity: 1;}
.index-container .banner-wrap .page-btn.show{opacity: 1;}
.index-container .banner-wrap .page-btn.button-prev{left: -50px;}
.index-container .banner-wrap .page-btn.button-next{right: -50px;}
.index-container .banner-wrap .page-btn.disabled:before{color: #f0f0f0;}
.page-btn:hover:before{color: #666;}
.page-btn:active:before{color: #333;}
.index-container .banner-wrap .swiper-pagination{width: auto; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);}

.index-container .banner-wrap .banner-right{width: 260px;}
.index-container .banner-wrap .banner-right img{width: 100%; height: 120px;}
.index-container .video-list li:nth-of-type(3n) .video-con .user-info .award-con-wrap{left: -152px}
.index-container .video-list li:nth-of-type(3n) .video-con .user-info .award-con-wrap:after{right: 22px; left: initial;}
.index-container .video-list li:nth-of-type(3n) .video-con .sp .award-con-wrap{left: -40px; transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0);}
.index-container .video-list li:nth-of-type(3n) .video-con .sp .award-con-wrap:after{right: 0; left: initial;}
.index-container .banner-wrap{position: relative; height: 460px; overflow: hidden;}
.service-wrap{background: #fff;}
.service-wrap .main-center{width: 1140px;}
.service-list{font-size: 0;}
.service-list li{display: inline-block; width: 570px;}
.service-list li.last{border-left: 1px solid #f0f0f0; width: 569px;}
.service-list li > a{padding: 60px 0; margin: 0 auto; width: 356px; display: block;}
.service-list li .service-con img{width: 80px;}
.service-list li .service-con .service-right{display: inline-block; width: 253px; margin-left: 23px;}
.service-list li .service-con .service-right p{line-height: 1; padding-bottom: 12px;}
.service-list li .service-con .service-right span{line-height: 1.57; text-align: justify;}
.service-other{background: #fff;  border-top: 1px solid #f0f0f0;}
.other-list{font-size: 0; width: 518px; height: 74px; margin: 0 auto;}
.other-list li{display: inline-block; margin-right: 100px; vertical-align: middle;}
.other-list li a{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.other-list li a:hover{color: #666;}
.other-list li.last{margin-right: 0;}
.index-container .index-con .index-main{padding: 20px 0 20px;}
.index-container .index-con .index-main .extension-wrap{padding: 0 20px 20px;height: 180px;}
.index-container .index-con .index-main .extension-wrap .title-wrap{padding: 0;}
.index-container .index-con .index-main .extension-wrap .extension-list li{float: left; width: 212px; height: 160px; overflow: hidden; margin: 0 20px 0 0; border-radius: 2px;}
.index-container .index-con .index-main .extension-wrap .extension-list li:nth-of-type(5n){margin-right: 0;}
.index-container .index-con .index-main .extension-wrap .extension-list li a{display: block; position: relative;}
.index-container .index-con .index-main .extension-wrap .extension-list li a .cover{position: absolute; width: 100%; height: 100%; left: 0; top: 0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; z-index: 1;}
.index-container .index-con .index-main .extension-wrap .extension-list li a img{width: 214px; height: 162px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.index-container .index-con .index-main .title-wrap{position: relative; padding: 20px 20px 0;text-align: left;}
.index-container .index-con .index-main .title-wrap span{line-height: 1;}
.index-container .index-con .index-main .title-wrap .en{padding-left: 10px;}
.index-container .index-con .index-main .more{position: absolute; right: 20px; bottom: 0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.index-container .index-con .index-main .more:hover{color: #e74b3b;}
.staff-pisk .swiper-btn{background: none; width: 42px; position: absolute; top: 50%; transform: translateY(22px); text-align: center;}
.staff-pisk .swiper-btn.prev-btn{left: -35px;}
.staff-pisk .swiper-btn.next-btn{right: -35px;}
.staff-pisk .swiper-btn.swiper-button-disabled{opacity: 1;}
.staff-pisk .swiper-btn.swiper-button-disabled:before{color: #f0f0f0;}

/* 编辑精选 */
.staff-pisk{position: relative; margin-bottom: 20px;}
.staff-pisk:first-child{margin-top: 20px;}
.staff-pisk .temp{display: none;}
.staff-pisk .video-list-wrap{position: relative; white-space: nowrap; font-size: 0; overflow: hidden;}
.staff-pisk .video-list-wrap .video-list-con{transform: translate3d(-1170px, 0, 0); -webkit-transform: translate3d(-1170px, 0, 0); -moz-transform: translate3d(-1170px, 0, 0); -ms-transform: translate3d(-1170px, 0, 0); -o-transform: translate3d(-1170px, 0, 0); }
.staff-pisk .video-list-wrap .video-list-con.transition{transition: .5s ease-in-out; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -ms-transition: .5s ease-in-out; -o-transition: .5s ease-in-out;}
.staff-pisk .video-list-wrap .video-list-con.translateX-0{transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); }
.staff-pisk .video-list-wrap .video-list{display: inline-block; white-space: normal; vertical-align: top; width: 1140px!important; margin-top: 0; padding: 0 20px 20px;}
.page-btn:before{font-size: 30px; color: #999; cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: .6; line-height: 44px;}
.page-btn:hover:before{color: #666; opacity: 1;}
.staff-pisk .video-list-wrap .bookmark-info{width:100%;padding:6px 14px;position: absolute;bottom: 0;left:0;box-sizing: border-box;line-height:18px;font-size: 12px;color:#ffffff;background-image: linear-gradient(rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.5));}
.staff-pisk .video-list-wrap .bookmark-info .bookmark-watch{float: left; display: flex; align-items: center;}
.staff-pisk .video-list-wrap .bookmark-info .bookmark-artnum{float: right;}

/* 大家都在看 */
/* .public-also-watch {大家都在看模块复用staff-pisk 样式} */
.public-also-watch .more{
  cursor: pointer;
  background: #f7f7f7;
  vertical-align: middle;
  border: none;
  font-weight: 500;
  font-size: 14px;
  color: #E74B3B;
}
.public-also-watch .more:hover{
  color: #F87171 !important;
}
/* 牛逼创作人 */
.excellent-creator{position: relative;}
.excellent-creator .creator-list-wrap{position: relative; white-space: nowrap; font-size: 0; overflow: hidden;}
.excellent-creator .creator-list-wrap .creator-list-con{transform: translate3d(-1170px, 0, 0); -webkit-transform: translate3d(-1170px, 0, 0); -moz-transform: translate3d(-1170px, 0, 0); -ms-transform: translate3d(-1170px, 0, 0); -o-transform: translate3d(-1170px, 0, 0); padding-bottom: 20px;}
.excellent-creator .swiper-btn{background: none; width: 42px; position: absolute; top: 50%; transform: translateY(22px); opacity: 1!important; text-align: center;}
.excellent-creator .swiper-btn.prev-btn{left: -35px;}
.excellent-creator .swiper-btn.next-btn{right: -35px;}
.excellent-creator .swiper-btn.swiper-button-disabled:before{color: #f0f0f0;}

.excellent-creator .creator-list-wrap .creator-list-con.transition{transition: .5s ease-in-out; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -ms-transition: .5s ease-in-out; -o-transition: .5s ease-in-out;}
.excellent-creator .creator-list-wrap .creator-list-con.translateX-0{transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0);}
.excellent-creator .creator-list{display: inline-block; white-space: normal; vertical-align: top; width: 1140px!important; padding: 20px 20px 0;}
/*.excellent-creator .creator-list:first-child{margin-right: 30px;}*/
.excellent-creator .creator-list > li{margin-right: 20px; box-shadow: none; display: inline-block; vertical-align: top; transition: all .15s ease; -webkit-transition: all .15s ease; -moz-transition: all .15s ease; -ms-transition: all .15s ease; -o-transition: all .15s ease;}
.excellent-creator .creator-list > li > a {width: 100%;}
.excellent-creator .creator-list > li:hover{box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);}
.excellent-creator .creator-list > li:last-child{margin-right: 0;}
.flow-card.up{transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
.flow-card.down{transform: translateY(10px); -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px);}
.flow-card.open{transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); opacity: 1;}

/* 学院模块 */
.common-school-list-wrap .list-wrap{padding: 20px 20px 0; transform: translate3d(0, 0, 0);}
.common-school-list-wrap .list-wrap .course-list{margin: 0;}
.common-school-list-wrap .list-wrap .course-list > li{width: 270px; margin: 0 20px 41px 0; overflow: hidden;height: auto;}

.common-school-list-wrap .list-wrap .course-list > li.intro-item:hover .intro-img{transform: scale(1.02);}
.common-school-list-wrap .list-wrap .course-list > li .ad-cover{height: 342px;}
.common-school-list-wrap .list-wrap li .item-bottom{padding: 20px;}
.common-school-list-wrap .list-wrap li .item-bottom .course-intro{min-height: 0;}
.common-school-list-wrap .list-wrap li.intro-item .intro-img{width: 100%; transition: .15s; -webkit-transition: .15s; -moz-transition: .15s; -ms-transition: .15s; -o-transition: .15s;}
.common-school-list-wrap .list-wrap li.intro-item .bg-cover{position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.3);}
.common-school-list-wrap .list-wrap li.intro-item .intro-wrap{position: absolute; bottom: 30px; width: 100%;}
.common-school-list-wrap .list-wrap li.intro-item .intro-wrap .intro-detail{padding: 0 20px; color: #dcdcdc;}
.common-school-list-wrap .list-wrap li.intro-item .intro-wrap .intro-detail .title{font-weight: 500; color: #fff;}
.common-school-list-wrap .list-wrap li.intro-item .intro-wrap .intro-detail .slogan{padding: 6px 0 31px; position: relative;}
.common-school-list-wrap .list-wrap li.intro-item .intro-wrap .intro-detail .slogan:after{content: ""; position: absolute; width: 22px; height: 1px; background-color: #fff; left: 0; bottom: 16px;}
.xpc-school .list-wrap li{transition: all .15s ease; -webkit-transition: all .15s ease; -moz-transition: all .15s ease; -ms-transition: all .15s ease; -o-transition: all .15s ease;}
/*.xpc-school  .list-wrap li:hover{box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);}*/
.wrappage-container .example-list li .example-cover-wrap:hover .example-img{transform: scale(1.02);}

/*首页学院部分*/



.card-list {
  width: 1140px;
  margin: 0 auto; }
.card-list.lr-card-list .card-item {
  position: relative;
  float: none;
  width: 900px;
  height: 266px;
  margin: 30px auto 0; }
.card-list.lr-card-list .card-item .item-top {
  float: left;
  width: 480px;
  height: 266px; }
.card-list.lr-card-list .card-item .item-bottom {
  float: right;
  width: 380px;
  margin-top: 37px; }

.vertical-line {
  margin: 0 4px;
  width: 2px;
  height: 12px;
  background-color: #f0f0f0; }

.card-item {
  float: left;
  width: 360px;
  margin: 30px 30px 0 0; }
.card-item:nth-of-type(3n), .card-item:last-child {
  margin-right: 0; }
.card-item .item-top {
  position: relative;
  height: 150px; }
.card-item .item-top a {
  display: block;
  height: 100%;
  overflow: hidden;
  background: #f0f0f0; }
.card-item .item-top a .cover {
  width: 100%;
  transition: 0.3s cubic-bezier(0, 1, 0.75, 1); }
.card-item .item-top a .cover:hover {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05); }
.card-item .item-top a .tag {
  position: absolute;
  top: 16px;
  left: 20px;
  height: 30px;
  padding: 0 18px;
  border-radius: 100px;
  font-size: 14px;
  font-weight: 500;
  line-height: 30px;
  text-align: center;
  color: #ffffff; }
.card-item .item-top a .tag.tag-blue {
  background-color: rgba(48, 79, 254, 0.9);
  box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.1), 0 0 30px 0 rgba(0, 0, 0, 0.05); }
.card-item .item-top a .tag.tag-red {
  background-color: rgba(231, 75, 59, 0.9);
  box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.1), 0 0 30px 0 rgba(0, 0, 0, 0.05); }
.card-item .item-bottom {
  padding: 20px;
  background-color: #fff; }
.card-item .item-bottom .course-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  color: #333;
  margin-bottom: 8px;
  max-height: 24px;
  transition: .15s ease-in-out; }
.card-item .item-bottom .course-title:hover {
  color: #e74b3b; }
.card-item .item-bottom .course-teacher {
  font-size: 12px;
  font-weight: 300;
  line-height: 1.5;
  color: #999;
  padding-bottom: 16px; }
.card-item .item-bottom .course-teacher span {
  display: inline-block;
  vertical-align: middle; }
.card-item .item-bottom .course-intro {
  font-size: 12px;
  font-weight: 300;
  line-height: 1.83;
  color: #999;
  height: 42px;
  word-break: break-all; }
.card-item .item-bottom .extra {
  margin-top: 20px;
  line-height: 22px;
  min-height: 22px; }
.card-item .item-bottom .extra .type-list {
  float: left;
  max-height: 22px;
  overflow: hidden;
}
.card-item .item-bottom .extra .type-list .type-item {
  float: left;
  border-radius: 2px;
  background-color: #f7f7f7;
  margin-right: 10px;
  box-sizing: none;
}
.card-item .item-bottom .extra .type-list .type-item a {
  display: block;
  height: 22px;
  padding: 0 8px;
  font-size: 12px;
  font-weight: 300;
  text-align: center;
  color: #333;
  cursor: default; }
.card-item .item-bottom .extra .join-wrap {
  float: right;
  font-size: 12px;
  font-weight: 300;
  text-align: justify;
  color: #333; }

.newtalk-item {
  position: relative;
  float: left;
  width: 555px;
  margin: 30px 30px 0 0; }
.newtalk-item:nth-of-type(2n), .newtalk-item:last-child {
  margin-right: 0; }
.newtalk-item .newtalk-cover-link {
  position: absolute;
  display: block;
  width: 130px;
  height: 100%;
  overflow: hidden;
  background-color: #f0f0f0; }
.newtalk-item .newtalk-cover-link .newtalk-cover {
  width: 100%;
  transition: 0.3s cubic-bezier(0, 1, 0.75, 1); }
.newtalk-item .newtalk-cover-link .newtalk-cover:hover {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05); }
.newtalk-item .newtalk-con {
  position: relative;
  height: 90px;
  padding: 20px;
  background-color: #fff;
  margin-left: 130px; }
.newtalk-item .newtalk-con .newtalk-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  color: #333;
  max-height: 56px;
  transition: .15s ease-in-out; }
.newtalk-item .newtalk-con .newtalk-title:hover {
  color: #e74b3b; }
.newtalk-item .newtalk-con .newtalk-main {
  position: absolute;
  bottom: 20px;
  left: 20px;
  font-size: 12px;
  font-weight: 300;
  line-height: 1.5;
  color: #999; }
.newtalk-item .newtalk-con .newtalk-main i {
  font-weight: 500;
  max-height: 17px;
  color: #333; }

/*# sourceMappingURL=_temp-card.css.map */

/* ---- */


/* 素材模块 */
.xpc-resource .list-wrap .course-list li .item-top{height: 218px;}
.xpc-resource .list-wrap .course-list li .item-top .mask{overflow: hidden;}
.xpc-resource .list-wrap .course-list li .item-top .mask .cover{width: 270px; height: 218px; transition: .15s; -webkit-transition: .15s; -moz-transition: .15s; -ms-transition: .15s; -o-transition: .15s;}
.xpc-resource .list-wrap .course-list li .item-top .mask:hover .cover{transform: scale(1.02);}
.xpc-resource .list-wrap .course-list li .item-top .name-wrap{position: absolute; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);}
.xpc-resource .list-wrap .course-list li .item-top .name-wrap .icon{display: block; width: 100px; height: 70px; background: url("https://oss-xpc0.xpccdn.com/Upload/edu/2019/07/315d415b56590fd.png") no-repeat; background-size: cover;}
.xpc-resource .list-wrap .course-list li:nth-of-type(1) .item-top .name-wrap .icon{background-position: 0 -189px;}
.xpc-resource .list-wrap .course-list li:nth-of-type(2) .item-top .name-wrap .icon{background-position: 0 -387px;}
.xpc-resource .list-wrap .course-list li:nth-of-type(3) .item-top .name-wrap .icon{background-position: 0 -563px;}
.xpc-resource .list-wrap .course-list li:nth-of-type(4) .item-top .name-wrap .icon{background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d565887eba14.png);background-size: 64px;background-position: center;}
.xpc-resource .list-wrap .course-list li .item-top .name-wrap .name{line-height: 1; padding-top: 6px; color: #dcdcdc;}
.xpc-resource .list-wrap .course-list li .item-top .name-wrap .name.music-name{padding-top: 10px;}
.xpc-resource .list-wrap .course-list li .item-bottom{background-color: #fff; padding: 0px 0px 10px 12px;}
.xpc-resource .list-wrap .course-list li .item-bottom .cate-list{font-size: 0;}
.xpc-resource .list-wrap .course-list li .item-bottom .cate-list li{display: inline-block; margin: 8px 12px 0 0;}
.xpc-resource .list-wrap .course-list li .item-bottom .cate-list li a{padding: 0 8px; height: 24px; line-height: 24px; font-size: 12px; font-weight: 300; color: #333; background-color: #f7f7f7;; border-radius: 2px; transition: .15s;}
.xpc-resource .list-wrap .course-list li .item-bottom .cate-list li a:hover{background-color: #f0f0f0;}

/* 作品列表页 */
.channel-container{width: 1140px; margin: 0 auto; padding: 85px 20px 40px;}
.channel-container .video-list li:nth-of-type(1), .channel-container .video-list li:nth-of-type(2), .channel-container .video-list li:nth-of-type(3), .channel-container .video-list li:nth-of-type(4){margin-top: 0;}
.hover-wrap{width: 167px; position: absolute; top: 55px; padding-top: 10px;}
.hover-box{background: #fff; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); overflow-y: auto; max-height: 410px; padding: 6px 0;}
.hover-box .list > li{width: 100%;}
.hover-box .list > li.line{height: 1px; background-color: #f0f0f0; margin: 4px 0;}
.hover-box .list > li.private{margin-bottom: 6px; border-bottom: 1px solid #f0f0f0; padding: 6px 0;}
.hover-box .list > li.private .icon-private:before{margin-right: 10px;}
.hover-box .list > li:hover > a{background: #f0f0f0;}
.hover-box .list > li.select{font-weight: 600;}
.hover-box .list > li a.select{font-weight: 600;}
.hover-box .list > li a{font-size: 14px; font-weight: 300; color: #333; display: block; height: 42px; line-height: 42px; text-align: left; padding: 0 20px; position: relative;}
.add-hover-box-height .list > li a{ height: 36px; line-height: 36px; }
.hover-box .list > li a.red-point:after{top: 6px; left: 50px;}
.hover-box .list > li a .dyj-logo {
  width: 24px;
  vertical-align: -4px;
  margin-right: 8px;
  
  margin-left: 0px;
}
.hover-box .list > li.select a{font-weight: 600; cursor: default;}
.hover-box .list > li.select:hover{background: #fff;}
.channel-container .channel-select-tab{background: #fff; margin-top: 30px;}
.channel-container .channel-select-tab .channel-tab-list-wrap{position: relative;}
.channel-container .channel-select-tab .channel-tab-list{padding: 30px 15px 22px; font-size: 0;}
.channel-container .channel-select-tab .channel-tab-list > li{display: inline-block;position: relative;}
.channel-container .select{font-weight: 600!important; color: #333;}
.channel-container .channel-select-tab .channel-tab-list > li *{font-size: 16px; font-weight: 300; color: #333;}
.channel-container .channel-select-tab .channel-tab-list > li a{padding: 0 15px;}
.channel-container .index-tab .tab-list li{margin: 0 38px;}
.page-wrap{text-align: center; margin-top: 20px; font-size: 0;}
.page-wrap a{font-weight: 300!important; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.page-wrap a span{display: inline-block; vertical-align: top; padding: 0!important; margin: 0!important;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.page-wrap a:hover{background-color: #e74b3b!important; color: #fff!important;}
.page-wrap a:hover span{background-color: #e74b3b;}
.page-wrap a span:before{font-size: 12px; color: #333;}
.page-wrap a:hover span:before{color: #f0f0f0;}
.page-wrap .arrow-page.arrow-left{transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); }

/* 文章列表页 */
.exp-list-container{width: 960px; margin: 0 auto; padding: 85px 20px 40px;}
.exp-list-container .send-exp{display: inline-block; width: 90px; border-color: #e74b3b; color: #fff; font-size: 0; height: 30px; line-height: 30px;  border-radius: 2px; margin-left: 40px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  text-align: center; cursor: pointer; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.exp-list-container .send-exp .icon-edit{font-size: 10px; color: #fff; padding-right: 4px;}
.exp-list-container .choose-bar-right{float: right; padding-top: 16px;}
.exp-list-container .choose-bar-right .sort-type{float: none; padding-top: 0;}
.exp-list-container .exp-con{margin-top: 20px;}
.exp-list-container .exp-wrap li{margin-bottom: 20px!important;}

/* 个人页 */
.header-container .hover-wrap{top: 35px; left: -20px;}
.header-container .author-v{width: 10px; height: 10px; background-size: cover; background-repeat: no-repeat; position: absolute; right: 10px; bottom: 10px;}
.header-container .banner-wrap{position: relative;height: 370px;background-size: cover;background-position: center; overflow: inherit;}
.header-container .banner-btn a{height: 30px; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; text-align: center; line-height: 30px; margin-left: 12px;}
.header-container .show-qr, .header-container .show-menu-btn{border: 1px solid rgba(153,153,153,.5); width: 32px!important; height: 30px;position: relative;}
.header-container .show-qr i, .header-container .show-menu-btn i{display: inline-block; vertical-align: middle;}
.header-container .show-qr i:before,.header-container .show-menu-btn i:before{font-size: 14px; color: #333;}


.header-container .show-menu-btn .drop-menu{display: none;}
.header-container .home-page {height:32px;padding: 0 16px; font-size:12px;font-weight: 500;color:#333;border:1px solid rgba(153,153,153,.5);position: relative;}
.header-container .home-page .home-page-new, .sort-new{width: 50px;height: 24px;border-radius: 4px;background-color: #e74b3b; font-size: 18px; color:#fff;font-weight: normal;position: absolute;display: block;font-stretch: normal;font-style: normal;line-height: 1.33;letter-spacing: normal;top: -12px;right: -20px;transform: scale(0.5);}
.header-container .show-menu-btn:hover .drop-menu {
  display: block;
  position: absolute;
  bottom: -52px;
  padding-top: 5px;
}
.header-container .show-menu-btn:hover .drop-menu .menu-item {
  border-radius: 2px;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
  background-color: #fff;
  width: 120px;
  height: 46px;
  line-height: 46px;
  font-size: 14px;
  font-weight: 300;
  color:#333;
  text-align: left;
  padding-left: 20px;
}
.header-container, .header-container .show-menu-btn .drop-menu .menu-item:hover{
  background: #f0f0f0;
}



.header-container .new-contact-btn {
  position: relative;
}

.header-container .new-contact-btn .drop-menu{display: none;}
.header-container .new-contact-btn:hover .drop-menu {
  display: block;
  position: absolute;
  bottom: -90px;
  padding-top: 5px;
}
.header-container .new-contact-btn:hover .drop-menu .drop-menu-box {
  border-radius: 2px;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
  height: 80px;
  padding-top: 4px;
  background-color: #fff;
}
.header-container .new-contact-btn:hover .drop-menu .drop-menu-box .menu-item {
  width: 120px;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
  font-weight: 300;
  color:#333;
  text-align: left;
  padding-left: 20px;
}
.header-container, .header-container .new-contact-btn .drop-menu .drop-menu-box .menu-item:hover{
  background: #f0f0f0;
}





.header-container .banner-btn a.to-private-list{border: 1px solid rgba(153,153,153,.5); padding: 0 13px;}
.header-container .banner-btn a.collect-jump{border: 1px solid rgba(153,153,153,.5); padding: 0 13px;}
.header-container .banner-btn a.set-bg{border: 1px solid rgba(153,153,153,.5); padding: 0 13px;}
.header-container .banner-btn a.set-info{border: 1px solid rgba(153,153,153,.5); padding: 0 18px;}
.header-container .banner-wrap .avator-wrap-s{bottom: -52px; margin-left: -52px; position: absolute; left: 50%; background-color: #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;}
.header-container .banner-wrap .avator-wrap-s img{width: 100px; height: 100px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; border: 2px solid #fff;}
.header-container .banner-wrap .avator-wrap-s .author-v{width: 20px; height: 20px; right: 10px; bottom: 2px;}
.header-container .creator-info-wrap{background: #fff; border-bottom: 1px solid #f0f0f0;}
.header-container .creator-info-wrap .follow-btn .common-ajax-loading{width: 18px!important; height: 18px!important; margin: -9px 0 0 -9px!important;}
.header-container .creator-info-wrap .follow-btn .common-ajax-loading:before, .header-container .creator-info-wrap .follow-btn .common-ajax-loading:after{width: 16px!important; height: 16px!important; border-width: 2px!important;}
.header-container .creator-info-wrap .follow-btn .common-ajax-loading:after{width: 18px; height: 18px; border-width: 2px;}
.header-container .creator-info{padding-bottom: 30px; background: #fff; text-align: center;}
.header-container .creator-info .btn-wrap{font-size: 0; text-align: right; padding-top: 20px; width: 960px; margin: 0 auto;position: relative;z-index: 2;}
.header-container .creator-info .btn-wrap .btn{display: inline-block; width: 80px; height: 30px; line-height: 30px; border: 1px solid rgba(153,153,153,.5); border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  text-align: center; margin-left: 20px; cursor: pointer; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; background-color: #fff; vertical-align: top;}
.header-container .creator-info .btn-wrap .btn.ajax-loading::before {margin-top: 8px;}
.header-container .creator-info .btn-wrap .btn:hover{background-color: #f0f0f0;}
.header-container .creator-info .btn-wrap .banner-btn a{position: relative; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.header-container .creator-info .btn-wrap .banner-btn a:hover{background-color: #f0f0f0;}
.header-container .creator-info .btn-wrap .banner-btn a .award-con-wrap {
  color: #fffefe; 
  line-height: 1.5;
  position: absolute;
  width: 185px;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  z-index: 1;
  padding-bottom: 15px;
  transition: .3s ease;
  display: none;
}
.header-container .creator-info .btn-wrap .banner-btn a .award-con-wrap:after {
  content: "";
  position: absolute;
  border-left: 5px solid rgba(0,0,0,0);
  border-right: 5px solid rgba(0,0,0,0);
  border-top: 8px solid #e74b3b;
  border-bottom: 8px solid rgba(0,0,0,0);
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}
.header-container .creator-info .btn-wrap .banner-btn a .award-con-wrap .award-con{
  padding: 8px;
  background-color: #e74b3b;
  display: block;
  border-radius: 2px;
  font-size: 12px;
  color: #fff;
  font-weight: 300;
}
.header-container .creator-info .btn-wrap .follow-btn{width: 84px; border-color: #e74b3b; color: #fff; font-size: 0;}
.header-container .creator-info .btn-wrap .follow-btn .follow-icon:before{font-size: 14px; padding-right: 5px;}
.header-container .creator-info .btn-wrap .follow-both {padding-right: 5px;}
.header-container .creator-info .btn-wrap .follow-both svg {display: block;}
.header-container .creator-info p.creator-name{margin-top: 20px;}
.header-container .creator-info p.creator-name .vip1{
  display: inline-block;
  width: 26px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a79a45b.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-left: 4px;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .vip1-overdue{
  display: inline-block;
  width: 26px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a79aa3c.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-left: 4px;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .bd{
  display: inline-block;
  width: 50px;
  height: 23px;;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2021/05/2760af0eab8bbaa.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .bd-overdue{
  display: inline-block;
  width: 50px;
  height: 23px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2021/05/2760af0eab85466.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .realname-user{
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2020/08/115f3246f36453f.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-left: 4px;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .realname-user-fault{
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2020/08/115f3246f361a72.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-left: 4px;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .vip2{
  display: inline-block;
  width: 50px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a79a8f1.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-left: 4px;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .vip2-overdue{
  display: inline-block;
  width: 50px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a789726.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding:0;
  vertical-align: middle;
  margin-left: 4px;
  margin-top: -4px;
}
.header-container .creator-info p.creator-name .user-settings{
  width: 20px;
  height: 20px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/11/205dd52654cac25.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.header-container .creator-info p.creator-name .user-settings:hover {opacity: 0.5;}
.header-container .creator-info p.creator-desc{margin-top: 10px; height: 21px;}
.header-container .creator-info p.creator-detail{margin-top: 14px;}
.header-container .creator-info p.creator-detail .fans-wrap, .header-container .creator-info p.creator-detail .follow-wrap{cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; margin-left: 36px;}
.header-container .creator-info p.creator-detail .fans-wrap:hover, .header-container .creator-info p.creator-detail .follow-wrap:hover{color: #333;}
.space-container{padding: 0 0 20px 0;}
.space-container .video-con .user-info .user-link .name:hover{color: #333;}
.space-container .video-con .user-info .user-link .name{font-weight: 300;}
.space-container .video-con .user-info .role{color: #333; font-weight: 600; max-width: 200px;}
.tab-container{width: 920px; margin: 20px auto 0; padding-bottom: 30px;}
.tab-container .creator-profiles{background: #fff; padding: 30px 30px 30px 40px; text-align: left;}
.tab-container .creator-profiles div{margin-bottom: 30px;float: left; width: 55%;}
.tab-container .creator-profiles div:nth-of-type(2n){margin-bottom: 30px;float: left; width: 45%;}
.tab-container .creator-profiles div.about{width: 100%;}
.tab-container .creator-profiles .title{display: inline-block; color: #333; font-weight: 600; padding-right: 10px; width: 72px; vertical-align: middle;}
.tab-container .creator-profiles .con{display: inline-block; color: #333333; font-weight: 300; vertical-align: middle;}
.tab-container .creator-profiles .about .con{line-height: 1.8; width: 662px;}
.tab-container .creator-profiles .about *{vertical-align: top; line-height: 1.8;}
.tab-container .creator-profiles .ip-location .con{position:relative;}
.tab-container .creator-profiles .ip-location svg{display:inline-block;vertical-align:middle;cursor:pointer;}
.tab-container .creator-profiles .ip-location svg:hover + .tip {display:inline-block;}
.tab-container .creator-profiles .ip-location .tip{display:none;position:absolute;font-size:12px;border-radius:4px;width:168px;border:1px solid #8080805e;top: -35px;left: 65px;padding:4px;box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);}
.space-container .more{text-align: center; line-height: 50px; background-color: #f0f0f0; height: 50px;}


.space-container .article-con .article-wrap .article-list > li{width: 306px;  margin: 0 20px 20px 0;}
.space-container .article-con .article-wrap .article-list > li:nth-of-type(3n){margin-right: 0;}
.space-container .article-con .article-wrap .article-list > li:hover{box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);}
.space-container .video-cover > img{width: 306px; height: 184px;}
.space-container .video-con{width: 306px;}
.counts-wrap{position: relative;}

/* 个人文章 */
.exp-container{padding: 20px 0 40px;}
.exp-con{width: 960px; margin: 0 auto;}
.exp-con .exp-wrap li{position: relative; height: 240px; background: #fff; margin-bottom: 20px;}
.exp-con .exp-wrap li > a{position: absolute; display: block; width: 360px; height: 100%; top: 0; left: 0;}
.exp-con .exp-wrap li:last-child{margin-bottom: 0;}
.exp-con .exp-wrap li .cover{width: 100%;}
.exp-con .exp-wrap li .exp-info{height: 200px; margin-left: 360px; padding: 20px; position: relative;}
.exp-con .exp-wrap li .exp-info .exp-title-wrap{width: 100%;}
.exp-con .exp-wrap li .exp-info .exp-title{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; max-height: 60px;}
.exp-con .exp-wrap li .exp-info .exp-title:hover{color: #e74b3b;}
.exp-con .exp-wrap li .exp-info .exp-desc{line-height: 1.8; max-height: 47px; padding-top: 17px;}
.exp-con .exp-wrap li .exp-info .exp-other{position: absolute; left: 20px; bottom: 20px;}
.exp-con .exp-wrap li .exp-info .exp-other span{display: inline-block; vertical-align: middle;}
.exp-con .exp-wrap li .exp-info .exp-other span.counts{padding-left: 5px;}
.exp-con .exp-wrap li .exp-info .exp-other span.counts{padding-left: 5px;}
.exp-con .exp-wrap li .exp-info .user-info .avator{width: 22px; height: 22px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;  border: 1px solid #f0f0f0;}
.exp-container .exp-con .exp-wrap li .exp-info .exp-desc{padding-top: 14px;}
.exp-container .counts-wrap{padding-bottom: 20px;}

/* 个人作品 */
.article-con{width: 960px; margin: 0 auto; padding: 0 20px;}
.article-con .article-wrap{font-size: 0;}
.article-con .article-wrap .result-empty {color: #c4c4c4;font-weight: normal;}
.article-con .article-wrap .article-list > li{background: #fff; display: inline-block; margin-right: 30px;  margin-bottom: 30px; vertical-align: top; transition: all .15s ease; -webkit-transition: all .15s ease; -moz-transition: all .15s ease; -ms-transition: all .15s ease; -o-transition: all .15s ease;}
.article-con .article-wrap .top-video .video-cover .video-mark{top: 20px; padding: 0 20px;}
.article-con .article-wrap .top-video .video-cover .video-hover-con{height: 100%;}
.article-con .article-wrap .top-video .desc{max-height: 62px;}
.article-con .article-wrap .top-video .video-cover .video-mark img{display: inline-block; width: 24px; height: 24px;}
.article-con .article-wrap .top-video .video-cover .video-mark .list-tags{float: right;}
.article-con .article-wrap .top-video .video-cover .video-mark .list-tags .tag{display: inline-block; width: 30px; height: 20px; margin-left: 8px;}
.article-con .article-wrap .top-video .video-cover .video-mark .list-tags .tag.tag-4k{background-position: 0 0;}
.article-con .article-wrap .top-video .video-cover .video-mark .list-tags .tag.tag-2k{background-position: 0 -20px;}
.article-con .article-wrap .top-video .video-cover .video-mark .list-tags .tag.tag-vr{background-position: 0 -40px;}
.article-con .article-wrap .top-video .video-cover .video-hover-con .desc{margin: 20px;}
.article-con .article-wrap .top-video .video-cover .video-hover-con p{bottom: 20px; left: 20px;}
.article-con .article-wrap .top-video .top-video-cover .video-cover-con .video-mark .pick{top: 20px; width: 32px; height: 32px;}
.article-con .article-wrap .top-video .photo-operation{bottom: 20px; right: 20px;}
.article-con .article-wrap li:nth-of-type(3n){margin-right: 0;}
.article-con .article-wrap .top-video{display: block; margin-bottom: 20px; background-color: #fff;}
.article-con .article-wrap .top-video{height: 356px; position: relative;}
.article-con .article-wrap .top-video .video-cover{position: absolute; width: 633px; top: 0; left: 0;}
.article-con .article-wrap .top-video .video-cover .video-img{width: 633px; height: 356px; background-color: #f0f0f0;}
.article-con .article-wrap .top-video .top-video-info{margin-left: 633px; padding: 20px; height: 316px; position: relative;}
.article-con .article-wrap .top-video .top-video-info .title{max-height: 60px; word-break: break-all;}
.article-con .article-wrap .top-video .top-video-info .type{padding-top: 10px;}
.article-con .article-wrap .top-video .top-video-info .desc{padding-top: 12px; line-height: 1.8; max-height: 128px;}
.article-con .article-wrap .top-video .top-video-info .video-other{padding-top: 20px;}
.article-con .article-wrap .top-video .top-video-info .video-other .counts{padding-left: 5px;}
.article-con .article-wrap .top-video .top-video-info .user-info{position: absolute; left: 20px; bottom: 20px; right: 20px; display: flex; justify-content: space-between; align-items: center}
.article-con .article-wrap .top-video .top-video-info .user-info .role{width:0; flex: 1;}
.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn {z-index: 100; position: relative; flex-shrink: 0; border: 1px solid rgba(153,153,153,.5); border-radius: 2px; padding: 0 18px; font-size: 12px; line-height: 30px; margin-left: 16px}
.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn:hover {border: solid 1px #999999;}

.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn .popularize-list {position: absolute; top: 23px; left: 0px; background: transparent; padding-top: 6px; transform: translateY(6px); transition: opacity,transform 150ms,150ms; opacity:0; pointer-events: none}
.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn .popularize-list.show {opacity: 100; pointer-events: auto}
.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn .popularize-list div {background: #fff; box-shadow: 0 0 8px 0 rgb(0 0 0 / 10%); padding: 6px 0; width: 100px}
.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn .popularize-list div span {display: inline-block; width: 100%; box-sizing: border-box; padding: 0 16px; transition: background-color 150ms}
.article-con .article-wrap .top-video .top-video-info .user-info .popularize-btn .popularize-list div span:hover {background-color: #f0f0f0;}
.like-article-container .article-con .article-wrap .article-list > li{width: 306px; margin: 0 20px 20px 0;}
.like-article-container .article-con .article-wrap .article-list > li:nth-of-type(3n){margin-right: 0;}
.like-article-container .article-con .article-wrap .article-list > li:hover{box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);}
.like-article-container .video-cover > img{width: 100%; height: 184px;}
.like-article-container .video-con{width: 276px;}
.like-article-container .more{height: 60px; line-height: 60px; background-color: #fff; text-align: center;}
.like-article-container .exp-con .more{margin-top: 30px;}
.like-article-container .more-btn{cursor: pointer;}

/* 喜欢作品 */
.like-article-container{padding-bottom: 40px;}

/* 喜欢文章 */
.like-article-container .exp-con .exp-wrap li .exp-info .exp-other{position: static; padding-top: 14px;}
.like-article-container .exp-con .exp-wrap li .exp-info .exp-other span{display: inline-block; vertical-align: middle;}
.like-article-container .exp-con .exp-wrap li .exp-info .exp-other span.counts{padding-left: 5px;}
.like-article-container .exp-con .exp-wrap li .exp-info .user-info .avator{width: 22px; height: 22px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;  border: 1px solid #f0f0f0;}
.like-article-container .exp-con .exp-wrap li .exp-info .user-info{position: absolute; bottom: 20px; left: 20px; padding: 0;}

/* 搜索结果页 */
.search-container{padding-top: 100px; width: 1140px; margin: 0 auto; padding: 100px 20px 0;}
.search-container .creator-item-card{box-shadow: none;}
.search-container .top-bar .search-vmovier{float: right; color: #333; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.search-container .top-bar .search-vmovier .icon-arrow-right:before{font-size: 12px; color: #333; padding-left: 5px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.search-container .top-bar .search-vmovier:hover, .search-container .top-bar .search-vmovier:hover .icon-arrow-right:before{color: #e74b3b;}
.search-input-wrap{position: relative; background-color: #fff; border: solid 1px #f0f0f0;}
.search-input-wrap .search-right{position: absolute; right: 0; top: 0; height: 100%; line-height: 50px; font-size: 0;}
.search-input-wrap .search-tab{display: inline-block; padding: 0 14px; height: 100%; cursor: pointer; border-left: 1px solid #f0f0f0; text-align: center; transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out; -o-transition: .3s ease-in-out;}
.search-input-wrap .search-tab:hover{background-color: #f0f0f0;}
.search-input-wrap .search-tab i{color: #9b9a9b; padding-left: 5px;}
.search-input-wrap .search-tab.select{background-color: #333;}
.search-input-wrap .search-tab.select:hover{background-color: #3d3d3d;}
.search-input-wrap .search-tab.select span{color: #fff;}
.search-input-wrap .search-tab.select i{color: #fff;}
.search-input-wrap:before{font-size: 20px; position: absolute; top: 50%; transform: translateY(-50%); left: 20px; color: #333;}
.search-input-wrap #s_search_btn{padding: 16px 0 16px 60px;}

.search-container .article-container{padding: 20px 0 40px;}
.search-container .article-container .article-list-wrap .video-list{padding-bottom: 20px;}

.search-container .exp-con{width: 100%; margin-top: 20px;}
.search-container .exp-con .exp-wrap{padding: 20px 0 40px;}
.search-container .exp-con .exp-wrap ul{padding-bottom: 20px;}
.exp-con .user-info{/*padding: 10px 0 12px;*/ position: absolute; left: 20px; bottom: 20px;}
.exp-con .user-info .head-wrap{position: relative; display: inline-block;}
.exp-con .user-info .head-wrap img{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: 1;}
.exp-con .user-info .head-wrap:hover img{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: .5;}
.exp-con .user-info .name{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; padding-left: 10px;}
.exp-con .user-info .name:hover{color: #666;}

.common-creator-list{font-size: 0;}
.common-creator-list .creator-item-card{margin: 0 20px 20px 0!important;}
.common-creator-list .creator-item-card:nth-of-type(4n){margin-right: 0!important;}

.user-wrap{padding: 20px 0 40px;}
.user-con{margin-top: 20px;}

/* 创作人列表页 */
.stars-container{margin-top: 30px; padding: 85px 20px 40px; width: 1140px; margin: 0 auto;}
.space-creator-card{padding: 30px; position: relative; background-color: #fff;  height: 130px; border-bottom: 1px solid #eee;}
.stars-container li:last-child .space-creator-card{border-bottom: none;}
.space-creator-card .space-creator-info{position: absolute; left: 30px; top: 30px; width: 328px;}
.space-creator-card .space-creator-info .avator-wrap{position: absolute; top: 0; left: 0;}
.space-creator-card .space-creator-info .avator-wrap .avator{width: 78px; height: 78px; border-radius: 50%; border: solid 1px #f0f0f0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.space-creator-card .space-creator-info .avator-wrap .avator:hover{opacity: .5;}
.space-creator-card .space-creator-info .avator-wrap .author-v{width: 18px; height: 18px; right: 5px;}
.space-creator-card .space-creator-info .info-con{margin-left: 94px;}
.space-creator-card .space-creator-info .info-con a p{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.space-creator-card .space-creator-info .info-con a p:hover{color: #e74b3b;}
.space-creator-card .space-creator-info .cvip-wrap {padding-right: 20px;color: #EA580C;}
.space-creator-card .space-creator-info .cvip-wrap .cvip-icon {width: 16px; height: 12px;}
.space-creator-card .space-creator-info .svip-wrap {padding-right: 38px;color: #EA580C;}
.space-creator-card .space-creator-info .svip-wrap .svip-icon {width: 34px; height: 12px;}
.space-creator-card .space-creator-info .info-con .role{margin-top: 1px;}
.space-creator-card .space-creator-info .info-con .desc{margin-top: 6px; height: 18px;}
.space-creator-card .space-creator-info .info-con .other{margin-top: 9px;}
.space-creator-card .space-creator-info .info-con .other span{display: inline-block; vertical-align: middle;}
.space-creator-card .space-creator-info .info-con .other .type{padding-right: 5px;}
.space-creator-card .space-creator-info .info-con .follow-btn{display: inline-block; width: 58px; height: 26px; line-height: 26px; text-align: center; border-radius: 2px; margin-top: 10px; cursor: pointer; border: 1px solid #e74b3b; margin-left: 8px; vertical-align: top;}
.space-creator-card .space-creator-info .info-con .connect-btn{display: inline-block; width: 80px;height: 26px; line-height: 26px; text-align: center; border-radius: 2px; margin-top: 10px; cursor: pointer; position: relative; border: 1px solid rgba(153,153,153,.5); color: #333;}
.space-creator-card .space-creator-info .info-con .connect-btn.ajax-loading {font-size: 0;}
.space-creator-card .space-creator-info .info-con .connect-btn.ajax-loading::before{content:'';width:16px;height:16px;position:absolute;left:32px;top:5px;border:2px solid #e74b3b;border-top:2px solid transparent;border-radius:100%;z-index:2;background-color:#fff;animation:loading 1s infinite ease-in-out;box-sizing:border-box}@keyframes loading{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.space-creator-card .space-creator-article{width: 722px; margin-left: 358px; min-height: 130px;}
.space-creator-card .space-creator-article .article-empty{font-size: 16px; font-weight: 500; color: #e3e4e5; line-height: 130px; text-align: center;}
.space-creator-card .space-creator-article .article-list{font-size: 0;}
.space-creator-card .space-creator-article .article-list li{display: inline-block; margin-right: 10px; height: 130px; vertical-align: top; position: relative; overflow: hidden}
.space-creator-card .space-creator-article .article-list li .cover{position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0, 0, 0, 0.1); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.space-creator-card .space-creator-article .article-list li .cover:hover{background-color: rgba(0, 0, 0, 0.3);}
.space-creator-card .space-creator-article .article-list li .title-wrap{position: absolute; bottom: 0; right: 0; width: 100%; height: 40px; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.75));}
.space-creator-card .space-creator-article .article-list li .title-wrap .title{padding: 16px 14px 0; height: 18px;}
.space-creator-card .space-creator-article .article-list li:last-child{margin-right: 0px;}
.space-creator-card .space-creator-article .article-list li img{width: 234px;}
.stars-container .creator-item-card{box-shadow: none;}
.choose-bar{line-height: 16px; border-bottom: 1px solid #eee; font-size: 0;}
.choose-bar .left-type-wrap{padding: 15px 0;}
.choose-bar .type-1{display: inline-block; position: relative; cursor: pointer; padding: 20px 20px 20px 0;}
.choose-bar .type-1 > span{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar .type-1:hover > span{color: #999;}
.choose-bar .type-1:hover .icon-triangle-down:before{color: #999;}
.choose-bar .type-1 .icon-triangle-down{padding-left: 5px;}
.choose-bar .type-1 .icon-triangle-down:before{display: inline-block; font-size: 12px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar .type-1.open .icon-triangle-down:before{transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform-origin: center; -webkit-backface-visibility: hidden;}
.choose-bar .type-1{margin-right: 60px;}
.choose-bar .type-1:last-child{margin-right: 0;}
.choose-bar .type-1 .type-child{width: 170px; position: absolute; height: 417px; background-color: #fff; top: 50px; left: -20px; z-index: 99; overflow: hidden; transition: width .5s ease-in-out, opacity .3s ease-in-out, transform .3s ease-in-out; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); border-radius: 2px;}
.choose-bar .type-1 .type-child.open{width: 340px;}
.choose-bar .type-1 .type-child .inner-wrap{ position: relative; width: 100%;}
.choose-bar .type-1 .type-child .type-2-list-wrap{width: 170px; height: 405px; overflow-y: auto; padding: 6px 0;}
.choose-bar .type-1 .type-child .type-2-list > li{padding: 0 20px; line-height: 42px; cursor: pointer; position: relative;}
.choose-bar .type-1 .type-child .type-2-list > li.more:after{content: ""; position: absolute; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-17/596c7754771ef.png) no-repeat; background-size: cover; width: 6px!important; height: 10px!important; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);  right: 20px; opacity: .15; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar .type-1 .type-child .type-2-list > li a{display: block;}
.choose-bar .type-1 .type-child .type-2-list .select{font-weight: 600;}
.choose-bar .type-1 .type-child .type-2-list > li:hover{font-weight: 600; background-color: #f0f0f0;}
.choose-bar .type-1 .type-child .type-2-list > li:hover a{font-weight: 600;}
.choose-bar .type-1 .type-child .type-2-list > li.hovered{font-weight: 600;}
.choose-bar .type-1 .type-child .type-2-list > li.hovered a{font-weight: 600;}
.choose-bar .type-1 .type-child .type-2-list > li.hovered:after{opacity: 1;}
.choose-bar .type-1 .type-child .type-2-list > li:hover:after{opacity: 1;}

.choose-bar .type-1 .type-child .type-3-list-wrap{width: 169px; border-left: 1px solid #f0f0f0; overflow-y: auto; height: 405px; position: absolute; left: 170px; top: 0; background-color: #fff; padding: 6px 0;}
.choose-bar .type-1 .type-child .type-3-list-wrap .common-ajax-loading{width: 24px; height: 24px; margin: -12px 0 0 -12px;}
.choose-bar .type-1 .type-child .type-3-list-wrap .common-ajax-loading:before{width: 24px; height: 24px;}
.choose-bar .type-1 .type-child .type-3-list-wrap .common-ajax-loading:after{width: 24px; height: 24px;}
.choose-bar .type-1 .type-child .type-3-list > li{padding: 0 20px; line-height: 42px; cursor: pointer;}
.choose-bar .type-1 .type-child .type-3-list > li a{display: block;}
.choose-bar .type-1 .type-child .type-3-list .select{font-weight: 600;}
.choose-bar .type-1 .type-child .type-3-list > li:hover{font-weight: 600; background-color: #f0f0f0;}
.choose-bar .type-1 .type-child .type-3-list > li:hover a{font-weight: 600;}

.choose-bar .sort-type{float: right; padding-top: 20px;}
.choose-bar .sort-type .tab{display: inline-block; position: relative; cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar .sort-type .tab.select{color: #333; font-weight: 600;}
.choose-bar .sort-type .tab:hover{color: #333; font-weight: 600;}
.choose-bar .sort-type .tab:last-child{padding-right: 0;}
.choose-bar .sort-type .tab:last-child:after{width: 0;}
/*.stars-container .stars-con{padding-top: 20px;}*/
.stars-container .stars-con ul{font-size: 0;}
.stars-container .stars-con ul .creator-item-card{margin: 0 30px 30px 0;}
.stars-container .stars-con ul .creator-item-card:nth-of-type(3n){margin-right: 0;}

/*@评论*/
.at-wrap{width: 140px; position: absolute;left: 200px;top:900px;z-index: 100; background-color: white;border:#ccc 1px solid;display: none;overflow: hidden;border-radius: 3px;}
.at-wrap span{width: 100%;height: 22px;line-height: 22px;padding: 2px 10px;color: #999;}
.at-list{list-style: none;}
.at-list li{width: 120px; padding: 5px 10px;cursor: pointer;}
.at-list-sel{background-color: #eee;}
.ruler {visibility: hidden;white-space: nowrap;font-size: 14px;}


/*消息提示*/

.msg_tip{position:fixed; width:180px; top: 20px; background:#fff; right: 20px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1); display:none; padding: 0; z-index: 999; transition: transform .3s cubic-bezier(0.35, 0, 0.25, 1), -webkit-transform .3s cubic-bezier(0.35, 0, 0.25, 1); transform: translateY(0);z-index: 1002;}
.msg_tip .new-msg-tip-close{height: 37px; line-height: 37px; text-align: center; font-size: 12px; color: #999; font-weight: 500; border-top: 1px solid #f0f0f0; cursor: pointer;}
.msg_tip .new-msg-tip-close:hover{color: #333;}
.msg_tip.top{transform: translateY(60px);}
.msg_tip .msg_tip_m{margin: 0;}
.msg_tip .msg_tip_m li{padding: 14px 20px; width: 140px; display: flex; align-items: center; justify-content: space-between;}
.msg_tip .msg_tip_m li > a{padding: 0; font-size: 12px; font-weight: 300; color: #333; height: 16px; line-height: 16px;}
.msg_tip .msg_tip_m li:hover > a {background-color: transparent;}
.msg_tip .msg_tip_m li > a.msg_tip_l:hover{font-weight: 500; color: #333;}
.msg_tip .msg_tip_m li > a.msg_tip_r{font-weight: 500; color: #999;}
.msg_tip .msg_tip_m li > a.msg_tip_r:hover{color: #333;}

.hidden{display: none;}
.feedback_post_bg{position: fixed; top: 0; bottom: 0;right: 0;left: 0; background: rgba(0,0,0,.5);*background: url(/public/images/dialog-bg-ie.png) repeat; display: none; z-index: 1011001010;}
.feedback_post_box{position:absolute;left:50%;top:50%;width:500px;height:280px;margin-top: -140px;margin-left: -250px; background-color:#fff;_position:absolute;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;z-index:999999;}
*html{background-attachment:fixed;background-image:url('about:blank');}
.feedback_post_box .feedback_post_succeed,.feedback_post_box .feedback_post_textarea{width:400px;height:193px;margin:20px auto 10px;}
.feedback_post_box textarea{width:388px;height:88px;padding:5px;overflow-x:hidden;overflow-y:auto;border:1px solid #ddd;color:#7a7a7a;resize:none; margin-top: 30px;}
.feedback_post_box .feedback_post_succeed{height:75px;padding-top:4
0px;text-align:center;font-size:12px;}
.feedback_action{text-align:center;}
.feedback_close_btn,.feedback_action_btn{display:inline-block;width:101px;height:31px;background-color:#2db8d0;font:14px/31px 'microsoft yahei';-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#fff;}
.feedback_action_btn:visited,.feedback_close_btn:visited,.feedback_action_btn:hover,.feedback_close_btn:hover{color:#fff;text-decoration:none;}
.comment_v{display: inline-block;vertical-align: bottom;}
.rl-btn,.rl-static{border:none;vertical-align:middle;color:#FFF;background:#e74b3b;font-size:14px;border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; display:inline-block;*display:inline;zoom:1;padding:0 28px;line-height:28px;}

.feedback-wrap .filmplay-inner-box{width: 534px;}
.feedback-wrap .feedback-input-wrap{padding: 20px;}
.feedback-wrap .feedback-input-wrap textarea{width: 462px; height: 118px; padding: 15px; border-radius: 2px; border: solid 1px #e3e4e5; color: #333; line-height: 1.67;}
.feedback-wrap .feedback-input-wrap textarea::-webkit-input-placeholder{color: #999; font-weight: 300;}
.feedback-wrap .feedback-input-wrap .feedback-btn{display: block; width: 100px; height: 36px; line-height: 36px; text-align: center; border-radius: 2px; margin: 20px auto 0; cursor: pointer;}

/*侧边二维码*/
.qrcode-bottom{position: absolute;right: 60px;bottom: -43px;width: 240px;background: #fff;box-shadow: 1px 4px 7px rgba(0,0,0,.2);}
.qrcode-bottom .qrcode-title{font-size: 14px;line-height: 40px;}
.qrcode-bottom .qrcode-box{position: relative;}
.qrcode-bottom .qrcode-box table{display: block; margin: 0px auto 20px;}
.qrcode-bottom .qrcode-box .new-logo{position: absolute;top: 50%; left: 50%; margin-left: -25px; margin-top: -25px; border-radius: 10px; border: 3px solid #fff;}
/*新侧边二维码 */
.qrcode-wrapper{
  position: absolute;right: 45px;bottom: 0px;padding-right: 15px;
}
.qrcode-wrapper>div{
  padding: 10px;box-sizing: border-box;box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);background-color: #fff;overflow: hidden;width: 110px;padding: 10px;
}
.qrcode-wrapper .line{
  width: 1px;
  height: 80px;
  background-color: #f0f0f0;
  margin: 6px 20px 0;
  float: left;
  /* display: inline-block; */
}
.xpc-qrcode{float: left;}
.download-qrcode-img{border: 0px solid #fff;}
.xpc-qrcode span{line-height: 20px;color: #333;font-size: 12px;letter-spacing: 0px;display: block;}
.xpc-qrcode img{width: 90px;height: 90px;margin-bottom: 2px;}
.comp-intro{margin: 0 auto; margin-bottom: 30px; background: white; position: relative; padding: 20px;}
.com-title{margin-top: 20px; margin-bottom: 15px; border-left: 4px solid #4bf;text-indent: 10px;font-size: 16px;height: 22px;line-height: 22px;}
.com-title .title-more{font-weight: normal; float: right; color: #37a; line-height: 22px;}
.com-title .title-more:hover{color: #4bf;}
.comp-pic-about{ float: left; width: 560px; font-size: 14px;}
.comp-pic-about .tip,.comp-intro-content .tip{font-size: 14px; position: relative; margin-bottom: 10px;}
.comp-pic-about .tip .uploadify-queue {left: 120px;}
.comp-intro-content .tip .uploadify-queue{left: -15px;}
.comp-intro-content img{display: block; margin: 0 auto;}
.comp-pic-about .tip .uploadify-queue .uploadify-queue-item{width: 620px;}
.comp-intro-content .tip .uploadify-queue .uploadify-queue-item{width: 222px;}
.comp-pic-about .tip span,.comp-intro-content .tip span{font-size: 12px; color: #999; margin-left: 20px;}
.comp-intro-content .tip em{color: #999; font-size: 12px;}
.comp-pic-about .tip .color,.comp-intro-content .tip .color{color: #4bf;}
.comp-pic-about .tip .uploadify,.comp-weixin .tip .uploadify{float: right; margin-right: 0; *position: absolute; *right: 0; *top: 0;}
.comp-pic-about .tip .uploadify{margin-top: -5px;}
.dialog-win-content .uploadify-queue{opacity: 0;}
.comp-pic-about .tip .uploadify:hover,.comp-weixin .tip .uploadify:hover{opacity:0.7;filter:alpha(opacity=70);}
.comp-pic-about .tip .uploadify span,.comp-weixin .tip .uploadify span{margin-left: 0; color: #fff;}
.comp-pic-about .tip .uploadify .uploadify-button,.comp-weixin .tip .uploadify .uploadify-button{background: #4bf!important; margin: 0; text-align: center;}
.comp-about{position: relative; text-align: center; width: 560px; margin-top: 14px;}
.comp-about p.about-p{text-align: left; overflow: hidden; margin-bottom: 30px; line-height: 1.8; font-size: 14px; color: #333; font-weight: 300;}
.comp-about p.no{color: #999; font-size: 16px; line-height: 18px; margin-top: 40px;}
.comp-about a.rl-btn{line-height: 30px; font-size: 16px;letter-spacing:5px; margin-top: 10px;padding-bottom: 5px; padding-top: 5px;}
.comp-about a.more{position: absolute; bottom: -20px; right: 0; text-align: right;}
.comp-intro .comp-pic{display: block;width: 560px; height: 232px;}
.comp-intro-content{width:300px;margin-left: 584px;position: relative;font-size: 14px;}
.comp-intro-content p {color: #333; font-weight: 300; line-height: 1.5; padding-bottom: 20px;}
.dialog-win .comp-intro-content p{padding-bottom: 15px;}
.comp-intro-content p a{color: #37a;}
.comp-intro-content p a:hover{color: #4bf;}
.comp-intro-content.edit{width:250px; margin-left: 650px;}
.comp-intro-content.edit p{line-height: 32px;}
.comp-intro-content input{outline: #dcdcdc; cursor: auto; width: 170px; width: 167px\0; *width: 167px; height: 28px; height: 20px\0; *height: 20px;padding: 0 4px;}
.comp-intro .comp-weixin{text-align: center;}
.comp-intro .comp-weixin p{text-align: left;}
.comp-intro .comp-weixin img{vertical-align: top;}
.comp-intro .comp-weixin .erweima-user{position: relative;}
.comp-intro .comp-weixin .erweima-user .avatar{position: absolute;top: 50%;left: 50%;margin-left: -24px;margin-top: -24px;width:48px; height:48px;border-radius: 24px; -webkit-border-radius: 24px; -moz-border-radius: 24px; }
.comp-about-content{width: 588px; height: 113px; border: 1px solid #dcdcdc; padding: 10px;}

.photo-operation{position: absolute; width: 28px; height: 28px; bottom: 14px; right: 14px; background-color: #fff; border-radius: 2px; z-index: 1;}
.photo-operation .operation-btn{display: block; text-align: center; line-height: 28px;}
.photo-operation .operation-btn:before{font-size: 12px; color: #333;}
.photo-edit-wrap{position: absolute; width: 120px; top: 27px; left: 50%; transform: translateX(-50%) translateY(10px); padding-top: 12px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: 0; visibility: hidden;}
.photo-edit-wrap.visible{transform: translateX(-50%) translateY(0px); opacity: 1; visibility: visible;}
.photo-edit-box{position: relative; background-color: #fff; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1); border-radius: 2px;padding: 4px 0;}
.photo-edit-box .arrow{position: absolute; border: 10px solid rgba(0, 0, 0, 0);  border-bottom: 10px solid #fff; left: 50%; top: -17px; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);}
.photo-edit-box > div{font-size: 12px; color: #FFF; font-weight: 300; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; line-height: 36px; color: #333; padding: 0 14px; /*border-bottom: 1px solid #f0f0f0;*/ cursor: pointer;}
.photo-edit-box > div:last-child{border-bottom: none;}
.photo-edit-box > div:hover{font-weight: 600; background-color: #f0f0f0;}
.photo-edit-box > div i{display: inline-block;width: 20px;}
.photo-edit-box > div i:before{font-size: 12px; color: #333;}

.new-version-tip{position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,.8); z-index: 1000000; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; opacity: 1;}
.new-version-tip.hide{opacity: 0;}
.newq-tip-con{position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); width: 100%;}
.newq-tip-con *{display: block; margin: 0 auto;}
.new-version-tip .new-version-img{width: 611px;}
.new-version-tip .bg-red{width: 200px; height: 50px; margin-top: 55px; line-height: 50px; border-radius: 2px; font-size: 14px; cursor: pointer; text-align: center; color: #fff;}

#to-feedback{color: #999; box-sizing: border-box; -webkit-box-sizing: border-box; padding: 0!important; height: 52px!important; width: 52px!important; /*-webkit-animation: glow 2s infinite; animation: glow 2s infinite;*/ font-weight: 300;}
#to-feedback:hover{color: #333; background-color: #fff;  -webkit-animation: none; animation: none;}
#to-feedback span{position: absolute; width: 100%; text-align: center; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); line-height: 1.2; font-weight: 500;}
.new-version-bar{background-color: #1ebaab; position: absolute; width: 225px; height: 38px; padding: 7px 12px; bottom: 10px; left: -246px; z-index: -1; border-radius: 2px; transition: .5s ease-in-out; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0);}
.new-version-bar.hide{transform: translateX(248px);}
.new-version-bar span{display: block;}
.create-man-banner{padding: 20px 0;}
.filmplay-container .create-man-banner{padding-bottom: 0;}
.create-man-banner img{width: 100%; border-radius: 2px;}
@-webkit-keyframes glow {
  0% {
    text-shadow: 0 0 .5px #fff
  }

  50% {
    text-shadow: 0 0 3px #fff,0 0 6px #fff,0 0 9px #fff,0 0 12px #1ebaab
  }

  to {
    text-shadow: 0 0 .5px #fff
  }
}

@keyframes glow {
  0% {
    text-shadow: 0 0 .5px #fff
  }

  50% {
    text-shadow: 0 0 3px #fff,0 0 6px #fff,0 0 9px #fff,0 0 12px #1ebaab
  }

  to {
    text-shadow: 0 0 .5px #fff
  }
}

/*mcard intro*/
.mcard{position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.7); color: #fff; z-index: 10001;}
.mcard-box{width: 850px; height: 580px; position: absolute; top: 50%; left: 50%; margin-top: -290px; margin-left: -425px;}
.mcard-example{display: inline-block; width: 280px; height: 580px; vertical-align: top; text-align: center;
  background: url(/app/user/skins/default/phone.png);
  background-image: -webkit-image-set(url(/app/user/skins/default/phone.png) 1x,url(/app/user/skins/default/phone_2x.png) 2x);
  background-image: -moz-image-set(url(/app/user/skins/default/phone.png) 1x,url(/app/user/skins/default/phone_2x.png) 2x);
  background-image: -ms-image-set(url(/app/user/skins/default/phone.png) 1x,url(/app/user/skins/default/phone_2x.png) 2x);
  background-image: -o-image-set(url(/app/user/skins/default/phone.png) 1x,url(/app/user/skins/default/phone_2x.png) 2x);
  background-repeat: no-repeat;
  position: relative;
}

.div-zhezhao{position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1-;}
.mcard-example iframe{width: 240px; height: 410px; margin-top: 85px;}
.mcard-intro{width: 540px; margin-top: 50px;  margin-left: 20px; vertical-align: top; font-size: 14px; position: relative; display: inline-block;}
.mcard-intro .mcard-close{position: fixed; top: 3%; right: 20%; cursor: pointer;}
.mcard-intro .t span{font-size: 20px;}
.mcard-intro .mcard-p{margin-top: 50px;}

.qrcode-mcard{margin-left: auto; margin-right: auto; text-align: center;}
.qrcode-mcard img{width:100%;}
.qrcode-intro{text-align: center;}
.qrcode-mcard .code-ground{/*width: 240px;*/background: #fff;text-align: center;padding:5px 16px 16px;font-size: 14px;color: #333333;/*margin: 0 auto;*/position: relative;top:-20px;display: inline-block;}
.qrcode-mcard .code-ground .download-qrcode{width: 188px;height: 32px;border-radius: 2px;background-color: #4990e2;color: #fff;line-height: 32px;margin: 0 auto;font-size: 16px;cursor: pointer;margin-top: 16px;}
.qrcode-mcard .code-ground p{margin: 0;margin-top: -10px;}
.qrcode-mcard .code-ground .avater-action{font-size: 12px;margin: 16px 0 0;}
.qrcode-mcard .code-ground .avater-action i{display: inline-block;width: 12px;height: 12px;background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-05-11/591403beacab1.png);background-size: 100%;margin-top: 2px;position: relative;top:2px;margin-right: 5px;}
.qrcode-mcard .code-ground .avater-action .no-check-avater{background-image: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-05-11/5914046e61bb4.png);}

/* 订单中心 */
.red-line-btn{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out;  -o-transition: .15s ease-in-out;}
.red-line-btn:hover{background-color: #e74b3b; color: #fff!important;}
.text-hover-red{transition-duration: .3s;}
.text-hover-red:hover{color: #e74b3b;}
.cursor-default{cursor: default;}
.gray-line-btn{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out;  -o-transition: .15s ease-in-out;}
.gray-line-btn:hover{background-color: #f0f0f0;}
.order-center{width: 1140px; margin: 100px auto 64px; overflow: hidden;}
.order-center .more-btn{height: 50px!important; font-size: 16px; text-align: center; padding: 0; line-height: 50px!important; color: #333; font-weight: 500; background-color: #f0f0f0;}
.order-center .more-btn:hover{color: #666;}
.order-center .no-more{cursor: default;}
.order-center .result-empty{background-color: #fff; padding: 0; line-height: 540px;}
.order-center .menu-wrap{width: 270px; float: left; margin-bottom: -10000px; padding-bottom: 10000px;}
.order-center .menu-wrap .user-info{padding: 30px; background-color: #fff; text-align: center;}
.order-center .menu-wrap .user-info .avator-wrap{width: 78px; height: 78px; margin: 0 auto; position: relative; cursor: pointer;}
.order-center .menu-wrap .user-info .avator-wrap .avator{width: 100%; height: 100%; border-radius: 50%; background-color: #d8d8d8; transition-duration: .3s; border: 1px solid #f0f0f0;}
.order-center .menu-wrap .user-info .avator-wrap .avator:hover{opacity: .5;}
.order-center .menu-wrap .user-info .avator-wrap .author-v{width: 16px; height: 16px; right: 8px;}
.order-center .menu-wrap .user-info .username{margin: 20px 0 10px; cursor: pointer;}
.order-center .menu-wrap .menu-list{margin-top: 20px;}
.order-center .menu-wrap .menu-list li{background-color: #fff;}
.order-center .menu-wrap .menu-list li.message-notice{border-top: 1px solid #f0f0f0;}
.order-center .menu-wrap .menu-list li.cart {
  border-bottom: 1px solid #f0f0f0;
}
.order-center .menu-wrap .menu-list li:last-child{border-bottom: none;}
.order-center .menu-wrap .menu-list li.select{font-weight: 600;}
.order-center .menu-wrap .menu-list li:hover{background-color: #f0f0f0;}
.order-center .menu-wrap .menu-list li a{display: block; line-height: 48px; padding: 0 20px; color: #333;}
.order-center .invoice-con{display: block; margin: 0 auto; text-align: center; padding: 30px 0;}
.order-center .invoice-con .qr-img{width: 204px;}
.order-center .invoice-con .qr-tip{font-size: 12px; font-weight: 300; color: #333; padding-top: 7px; line-height: 1.67;}

.list-contanier{width: 850px; float: left; margin-left: 20px; margin-bottom: -10000px; padding-bottom: 10000px;}
.list-contanier.white-bg {background-color: #fff;}
.list-contanier .page-wrap{margin-top: 20px;}
.list-contanier .list-section{padding: 20px 20px 0; background-color: #fff;}
.list-contanier .list-title-wrap .list-title{font-size: 18px; font-weight: 600; color: #333; position: relative;}
.list-contanier .list-title-wrap .recovery-buy{display: inline-block; font-size: 12px; line-height: 27px; padding-left: 8px; position: relative; z-index: 1; float: right; margin-right: 20px;}
.list-contanier .list-title-wrap .recovery-buy a{color: #e74b3b;}
.list-contanier .list-title-wrap .recovery-buy:after{content: ""; position: absolute; width: 12px; height: 12px; background: url('//oss-v6.xpccdn.com/Uploads/Activity/2017-10-19/59e85de13d643.png') no-repeat; background-size: cover; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); right: -14px;}
.list-contanier .list-title-wrap .recovery-buy:hover .recovery-tip{display: block;}
.list-contanier .list-title-wrap .recovery-buy .recovery-tip{position: absolute; width: 240px; height: 39px; border-radius: 2px; background-color: #ffffff; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.26); font-size: 12px; color: #666; padding: 12px 13px; line-height: 1.8; top: 35px; display: none; text-align: center; right: -30px;}
.list-contanier .list-title-wrap .recovery-buy .recovery-tip .strangle{position: absolute; border: 8px solid rgba(0,0,0,0); border-bottom: 8px solid rgba(0,0,0,.05); right: 14px; top: -16px;}
.list-contanier .list-title-wrap .recovery-buy .recovery-tip .strangle:after{ position: absolute; right: -8px; top: -7px; border: 8px solid rgba(0,0,0,0); border-bottom: 8px solid #ffffff; content: '';}
.list-contanier .list-title-wrap .apply-invoice-wrap, .list-contanier .list-title-wrap .customer-service{float: right; line-height: 27px; cursor: pointer; padding-left: 15px; position: relative;}

.list-contanier .list-title-wrap .apply-invoice-wrap:hover .recovery-tip{display: block;}
.list-contanier .list-title-wrap .apply-invoice-wrap .recovery-tip{position: absolute; width: 160px; height: 39px; border-radius: 2px; background-color: #ffffff; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.26); font-size: 12px; color: #666; padding: 12px 13px; line-height: 1.8; top: 35px; display: none; text-align: center; right: -14px;}
.list-contanier .list-title-wrap .apply-invoice-wrap .recovery-tip .strangle{position: absolute; border: 8px solid rgba(0,0,0,0); border-bottom: 8px solid rgba(0,0,0,.05); right: 14px; top: -16px;}
.list-contanier .list-title-wrap .apply-invoice-wrap .recovery-tip .strangle:after{ position: absolute; right: -8px; top: -7px; border: 8px solid rgba(0,0,0,0); border-bottom: 8px solid #ffffff; content: '';}

.list-contanier .list-detail-contanier{margin-top: 25px;}
.list-contanier table{width: 100%; border-collapse: collapse;}
.list-contanier table tr{border-bottom: 1px solid #f0f0f0;}
.list-contanier table tr:last-child{border-bottom: none;}
.list-contanier table tr:nth-of-type(1){font-size: 0; height: 40px; line-height: 40px; background-color: #F7F7F7; padding: 0 20px; border: none;}
.list-contanier table th{padding: 0 20px;}
.list-contanier table td{font-size: 12px; font-weight: 300; color: #333; text-align: center; box-sizing: border-box; padding: 20px;}
.list-contanier table th:nth-of-type(1), .list-contanier table th:nth-of-type(2){text-align: left;}
.list-contanier table tr td:nth-of-type(1), .list-contanier table tr td:nth-of-type(2){text-align: left; max-height: 36px;}
.list-contanier table tr td:nth-of-type(4){padding-right: 15px;}
.list-contanier table td .status.over{font-size: 12px; font-weight: 300; color: #ccc;}
.list-contanier table td .status.to-pay{display: inline-block; width: 58px; height: 26px; line-height: 26px; border-radius: 2px; border: 1px solid rgba(231,75,59,.5); cursor: pointer; color: rgba(231,75,59,1); font-weight: 500;}
.list-contanier table td.abs .to-pay{position: absolute; top: 20px; left: 50%; transform: translateX(-50%);}
.list-contanier table td .cancel-order{display: block; font-size: 10px; font-weight: 500; margin-top: 5px; cursor: pointer;}
.list-contanier table td.abs .cancel-order{position: absolute; top: 47px; left: 50%; transform: translateX(-50%) scale(0.83); z-index: 1;}
.list-contanier table td .status a.text-btn{font-size: 12px; font-weight: 500; color: #e74b3b; transform: scale(.83); -webkit-transform: scale(.83); -moz-transform: scale(.83); -o-transform: scale(.83); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; padding-top: 7px;}
.list-contanier table td .status a.text-btn:hover{color: #cf4334;}
.list-contanier table td .status a.border-btn{position: relative; display: inline-block; width: 88px; height: 26px; line-height: 26px; border-radius: 2px; border: solid 1px rgba(231,75,65,.5); color: #e74b3b; font-weight: 500; cursor: pointer; transition-duration: .3s;}
.list-contanier table td .status a.border-btn:hover{background-color: #e74b3b; color: #fff;}
.list-contanier table td .status a.gray-btn{border-color: rgba(153,153,153,.5); color: #333; font-weight: 500;}
.list-contanier table td .status a.gray-btn:hover{background-color: #f0f0f0; color: #333;}
.list-contanier table td .status.study{display: inline-block; width: 78px; height: 26px; line-height: 26px; border-radius: 2px; border: solid 1px rgba(153,153,153,.5); font-weight: 500; cursor: pointer;}
.list-contanier .i-icon{height: 10px; margin: 0 5px;}
.list-contanier .cate{display: inline-block; line-height: 1.5; font-size: 0; max-width: 300px; word-break: break-all;}
.list-contanier .cate span{font-size: 12px; display: inline-block; vertical-align: middle;}

/* 我的订单 */
.record-contanier .record-section{padding: 20px;}
.record-contanier .main-title{height: 40px; line-height: 40px; background-color: #f7f7f7; text-align: center; font-size: 0;}
.record-contanier .main-title span{display: inline-block;}
.record-contanier .main-title span:nth-of-type(1){width: 46%;}
.record-contanier .main-title span:nth-of-type(2){width: 18%;}
.record-contanier .main-title span:nth-of-type(3){width: 18%;}
.record-contanier .main-title span:nth-of-type(4){width: 18%;}

.record-contanier table tr{border-bottom: none;}

/* 每个订单的标题 */
.record-contanier tr.type-title{border: solid 1px #f0f0f0!important;}
.record-contanier tr.type-title th:nth-of-type(1){position: relative; padding-left: 30px;}
.record-contanier tr.type-title th:nth-of-type(2){padding-right: 30px; text-align: right;}
.record-contanier tr.type-title th .goods-count{margin-left: 2px;}
.record-contanier tr.type-title th .order-num-wrap{position: absolute; right: 40px;}
.record-contanier .order-item{margin-top: 10px;}
.record-contanier table tr.ajax-more td{padding: 0; height: 37px; line-height: 37px; text-align: center;}
.record-contanier table tr.ajax-more td .order-more{cursor: pointer;}
.record-contanier table tr:last-child{border-bottom: 1px solid #f0f0f0;}
.record-contanier table tr:last-child td{border-bottom: none;}
.record-contanier table tr td{position: relative; border-right: 1px solid #f0f0f0; padding: 20px 0;}
.record-contanier table tr td:nth-of-type(1){position: relative; width: 64%; border-left: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;}
.record-contanier table tr td:nth-of-type(2){width: 18%; text-align: center;}
.record-contanier table tr td:nth-of-type(3){width: 18%;}

.record-contanier table tr td > div{display: inline-block; vertical-align: middle;}
.record-contanier table tr td .goods-detail{width: 55%; padding: 0 30px;}
/*.record-contanier table tr td .goods-detail .title{max-width: 300px;}*/
.record-contanier table tr td .goods-detail .info{display: block; padding-top: 6px;}
.record-contanier table tr td .goods-price{font-size: 0; position: absolute; right: 40px;}
.record-contanier table tr td .goods-price .original-price{text-decoration: line-through;}
.record-contanier table tr td .goods-price .present-price{margin-left: 20px;}

.record-contanier .goods-name span{max-height: 36px;}

/* 我的素材 */
.resource-contanier .list-title-wrap .tab-title{display: inline-block; cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; font-weight: 300; font-size: 18px; color: #333; position: relative;}
.resource-contanier .list-title-wrap .tab-title{margin-right: 40px;}
.resource-contanier .list-title-wrap .tab-title:hover{font-weight: 600;}
.resource-contanier .list-title-wrap{padding-bottom: 5px;}
.resource-contanier .list-title-wrap .select{font-weight: 600;}
.resource-contanier .list-title-wrap .select:after{content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  bottom: -11px; width: 24px; height: 4px; background-color: #e74949;}
.resource-contanier table th:nth-of-type(1){width: 36.9%;}
.resource-contanier table th:nth-of-type(2){width: 35.6%;}
.resource-contanier table th:nth-of-type(3){width: 14%;}
.resource-contanier table th:nth-of-type(4){width: 14.1%;}

.resource-contanier table th:nth-of-type(4) span{display: inline-block; vertical-align: middle;}
.resource-contanier table th:nth-of-type(4) span.icon-question{font-size: 12px; padding-left: 5px; cursor: pointer;}

.resource-contanier table td{height: 118px; padding: 0 20px;}
.resource-contanier .resource-cover-wrap{display: inline-block; vertical-align: middle; width: 60px; height: 60px; position: relative;}
.resource-contanier .resource-cover-wrap .common-cover-float{background-color: rgba(0,0,0,.2); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.resource-contanier .resource-cover-wrap:hover .common-cover-float{background-color: rgba(0,0,0,.4);}
.resource-contanier .resource-cover-wrap.disabled * {cursor: not-allowed;}
.resource-contanier .resource-cover-wrap.disabled:hover .common-cover-float{background-color: rgba(0,0,0,.2);}
.resource-contanier .resource-cover-wrap .cover{width: 100%; height: 100%; position: absolute; top: 50%; transform: translateY(-50%); object-fit: contain;}
.resource-contanier .resource-cover-wrap .type{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);z-index: 2;}
.resource-contanier .resource-cover-wrap .type:before{font-size: 20px; color: #fff;}
.resource-contanier .resource-cover-wrap .pj-tag {position: absolute; z-index: 2; width: 25px; top: 0; left: 0;}
.resource-contanier .name{display: inline-block; vertical-align: middle; width: 144px; margin-left: 16px; font-weight: 500;}
.resource-contanier .name.disabled * {cursor: not-allowed;}
.resource-contanier .name span{max-height: 36px; word-break: break-all; word-wrap: break-word;}
.resource-contanier .sourse{border-top: 1px solid #f0f0f0; padding-top: 10px; margin-top: 10px;}
.resource-contanier .sourse span{line-height: 1.67; max-height: 20px; max-width: 250px;}
.resource-contanier .sourse span:last-child{display: block;}

.perfect-info-ground {position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,.8); z-index: 10003; display: flex; justify-content: center; box-sizing: border-box; visibility: visible; opacity: 1;}

.perfect-info-ground.hide {
    visibility: hidden; 
    opacity: 0;
}
.perfect-info-scroll {
    width: 100%;
    overflow-y: auto; 
    padding: 50px 0; 
}
.perfect-info-contanier{
    background-color: #fff; 
    width: 876px; 
    border-radius: 2px; 
    transition-duration: .5s; 
    opacity: 0;
    transform: translateY(-5000px);
    margin: 0 auto;
}
.perfect-info-contanier.show {
    transform: translateY(0);
    opacity: 1;
}
.perfect-info-contanier .title-wrap{padding: 13px 20px; position: relative; border-bottom: 2px solid #f7f7f7;}
.perfect-info-contanier .title-wrap .perfect-close{position: absolute; right: 20px; top: 50%; transform: translateY(-50%); cursor: pointer;}
.perfect-info-contanier .title-wrap .perfect-close:before{font-size: 20px; color: #333;}
.perfect-info-contanier .title-wrap .perfect-close:hover:before{color: #666;}
.perfect-info-contanier .detail-wrap{padding: 20px 32px; border: 1px solid #f0f0f0;background-color: #fff;}
.perfect-info-contanier .detail-wrap .detail-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.perfect-info-contanier .detail-wrap .detail-item.check-box {
    margin-bottom: 24px;
}
.perfect-info-contanier .detail-wrap .detail-item h3 {
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    color: #2b2b2b;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 12px;
    margin-bottom: 24px;
}
.perfect-info-contanier .detail-wrap .detail-item h3 span {
    font-size: 12px;
    line-height: 1.67;
    color: #9e9e9e;
    font-weight: 300;
    padding-left: 12px;
}
.perfect-info-contanier .detail-wrap .detail-item h3 span i {
    color: #e74b3b;
}
.perfect-info-contanier .detail-wrap .item {
    width: 400px; 
    margin-bottom: 24px;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list {
    display: flex;
    align-items: center;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-right: 140px;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li.disabled {
    cursor: not-allowed;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li.disabled span {
    color: #bbb;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li.selected .icon {
    border-color: #e74b3b;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li.selected .icon::after {
    transform: scale(1);
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: 1px solid #e5e5e5;
    border-radius: 50%;
    box-sizing: border-box;
    transition: .3s ease;
    margin-right: 8px;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li .icon::after {
    content: "";
    width: 8px;
    height: 8px;
    background-color: #e74b3b;
    transform: scale(0);
    border-radius: 50%;
    transition: .3s ease;
}
.perfect-info-contanier .detail-wrap .item .checkbox-list li .label {
    font-size: 14px;
    line-height: 1.57;
    color: #595959;
}
.perfect-info-contanier .detail-wrap .item.required .label-name {
    position: relative;
    padding-left: 12px;
}
.perfect-info-contanier .detail-wrap .item.required .label-name::before {
    content: '*';
    position: absolute;
    color: #e74b3b;
    top: 60%;
    left: 0;
    transform: translateY(-50%);
}
.perfect-info-contanier .detail-wrap .item.textarea {
    width: 100%;
    margin-bottom: 0;
}
.perfect-info-contanier .detail-wrap .label-name{display: block; margin-bottom: 8px;}
.perfect-info-contanier .detail-wrap input{width: 100%; height: 40px; border-radius: 2px; background-color: #ffffff; border: solid 1px #f0f0f0; font-size: 14px; color: #333; line-height: 1; padding: 9px 12px; box-sizing: border-box; font: 400 13.3333px Arial;}
.perfect-info-contanier .detail-wrap textarea {width: 100%; height: 80px; border-radius: 2px; background-color: #ffffff; border: solid 1px #f0f0f0; font-size: 14px; color: #333; line-height: 1; padding: 9px 12px; box-sizing: border-box; font: 400 13.3333px Arial;}
.perfect-info-contanier .detail-wrap .tip {
    font-size: 12px;
    line-height: 1.67;
    color: #9e9e9e;
    margin-top: 16px;
}
.perfect-info-contanier .detail-wrap .tip i {
    color: #e74b3b;
}
.perfect-info-contanier .save-wrap {
    text-align: center;
    background-color: #fff;
    padding: 16px 0;
}
.perfect-info-contanier .save-wrap .save{display: inline-block; width: 128px; height: 40px; line-height: 40px; border-radius: 2px; cursor: pointer; text-align: center; position: relative;}
.perfect-info-contanier .common-ajax-loading{width: 24px; height: 24px; margin: -12px 0 0 -12px;}
.perfect-info-contanier .common-ajax-loading:before, .perfect-info-contanier .common-ajax-loading:after{width: 24px; height: 24px;}
.resource-contanier .download-btn{display: block;}
.resource-contanier .download-btn .common-ajax-loading{width: 18px; height: 18px; margin: -9px 0 0 -9px;}
.resource-contanier .download-btn .common-ajax-loading:before, .download-btn .common-ajax-loading:after{width: 18px; height: 18px;}
.resource-contanier .result-empty{line-height: 540px;}

/* 我的课程 */
.course-contanier table th:nth-of-type(1){width: 50%;}
.course-contanier table th:nth-of-type(2){width: 35%;}
.course-contanier table th:nth-of-type(3){width: 15%;}
.course-contanier .course-cover-wrap{display: inline-block; vertical-align: middle; width: 80px; height: 80px; position: relative;}
.course-contanier .course-cover-wrap .common-cover-float{background-color: rgba(0,0,0,0); transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.course-contanier .course-cover-wrap:hover .common-cover-float{background-color: rgba(0,0,0,.2);}
.course-contanier .course-cover-wrap .cover{width: 100%;}
.course-contanier .info{display: inline-block; vertical-align: middle; width: 238px; margin-left: 20px;}
.course-contanier .info span.name{font-weight: 500; max-height: 18px;}
.course-contanier .opening{padding-top: 10px;}
.course-contanier .course-name{display: block; padding-bottom: 5px;}

.course-contanier-v2 .list-title-wrap{padding-bottom: 20px;}
.course-contanier-v2 .list-detail-contanier{margin-top: 0;}
.course-contanier-v2 .course-list-container .course-list .course-item{position: relative; padding: 20px; border-top: solid 1px #f0f0f0;}
.course-contanier-v2 .course-list-container .course-list .course-item .cover-wrap{position: absolute; height: 140px; top: 20px; left: 20px; overflow: hidden;}
.course-contanier-v2 .course-list-container .course-list .course-item .cover{width: 252px;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con{position: relative; height: 140px; margin-left: 272px;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .subject-name{font-size: 16px; font-weight: 500; color: #333; transition: .15s ease-in-out;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .subject-name:hover{color: #e74b3b;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .supplier{font-size: 0; font-weight: 300; line-height: 1.5; color: #999; padding-top: 4px;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .supplier span{display: inline-block; font-size: 12px; margin-right: 10px;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .notice{font-size: 12px; font-weight: 300; line-height: 1.83; text-align: justify; color: #999; padding-top: 12px;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom{position: absolute; width: 100%; bottom: 4px; font-size: 12px; font-weight: 300; line-height: 1.5; color: #333;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom span{display: inline-block; vertical-align: middle;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom .i-icon{margin: 0 16px;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom .btn{position: absolute; height: 24px; border-radius: 2px; font-size: 12px; font-weight: 500; line-height: 1.33; text-align: center; padding: 0 16px; line-height: 24px; cursor: pointer;  top: 50%; right: 0; transform: translateY(-50%);}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom .learning{border: solid 1px rgba(231, 75, 59, .5); color: #e74b3b; transition: .15s ease-in-out;}

.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom .learning:hover{background-color: #e74b3b; color: #fff;}
.course-contanier-v2 .course-list-container .course-list .course-item .course-con .bottom .disable{border: solid 1px rgba(153,153,153,.5); color: rgba(153,153,153); cursor: default;}

/* 我的优惠券 */
.coupon-contanier .list-section{padding: 0; background-color: transparent;}
.coupon-contanier .result-empty{line-height: 540px;}
.coupon-contanier .list-section .list-title-wrap{padding: 20px; background-color: #fff;}
.coupon-contanier .coupon-list{margin-top: 20px; font-size: 0; width: 856px;}
.coupon-contanier .coupon-list li{width: 238px; height: 143px; padding: 28px 20px 15px; background-color: #fff; margin: 0 11px 14px 0; display: inline-block; vertical-align: top; position: relative; left: -3px; background: url("//oss-v6.xpccdn.com/Uploads/Activity/2017-08-23/599d20c3efa3a.png") no-repeat; background-size: cover;}
.coupon-contanier .coupon-list li.gray *{color: #e3e4e5;}
.coupon-contanier .coupon-list li.overdue:after{content: ""; position: absolute; width: 50px; height: 50px; background: url("//oss-v6.xpccdn.com/Uploads/Activity/2017-08-23/599d187569b1e.png") no-repeat; background-size: cover; right: 10px; top: 16px;}
.coupon-contanier .coupon-list li.used:after{content: ""; position: absolute; width: 50px; height: 50px; background: url("//oss-v6.xpccdn.com/Uploads/Activity/2017-09-13/59b8a4f6bcac4.png") no-repeat; background-size: cover; right: 10px; top: 16px;}
.coupon-contanier .coupon-list li:nth-of-type(3n){margin-right: 0;}
.coupon-contanier .coupon-list li .coupon-sum{color: #e74b3b; font-weight: 500;}
.coupon-contanier .coupon-list li .coupon-sum span{display: inline-block; line-height: 1;}
.coupon-contanier .coupon-list li .coupon-sum .currency{font-size: 20px;}
.coupon-contanier .coupon-list li .coupon-sum .amount{font-size: 40px; padding-left: 10px;}
.coupon-contanier .coupon-list li .coupon-sum .limit{padding-left: 14px;}
.coupon-contanier .coupon-list li .title{margin: 10px 0 4px;}
.coupon-contanier .coupon-list li .expire{font-size: 10px; position: absolute; bottom: 20px; left: 20px;}

/* 社区设置 */
.community-setting-out-right {
  padding: 20px 20px 0px;
  position: relative;
}
.community-setting-out-right .community-setting-title {
  font-size: 18px;
  color: #333333;
  line-height: 25px;
  font-weight: 500;
  padding-bottom: 11px;
  border-bottom: 1px solid #f0f0f0;
}
.community-setting-out-right .community-setting-subtitle {
  font-size: 14px;
  color: #999999;
  line-height: 20px;
  font-weight: 500;
  padding: 20px 0 8px;
}
.community-setting-out-right .community-setting-out-right-option {
  box-sizing: border-box;
  padding:24px 20px;
  width: 100%;
  border: 1px solid #f0f0f0;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-top {
  margin-bottom: 12px;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-top span:nth-of-type(1){
  font-size: 16px;
  line-height: 22px;
  color: #333333;
  font-weight: 500;
  vertical-align: middle;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-top span:nth-of-type(2){
  font-size: 12px;
  line-height: 18px;
  color: #666666;
  vertical-align: middle;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-top span:nth-of-type(2)>img{
  width: 14px;
  height: 12px;
  vertical-align: middle;
  margin: 0px 4px 0px 20px;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom>span{
  font-size: 12px;
  color: #999999;
  line-height: 17px;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom .hiding-but-juage{
  display: inline-block;
  font-size: 14px;
  line-height: 20px;
  color: #e74b3b;
  margin-left: 20px;
  cursor: pointer;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom .hiding-but-juage-link{
  display: inline-block;
  font-size: 14px;
  line-height: 20px;
  color: #e74b3b;
  margin-left: 20px;
  cursor: pointer;
}
.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom .hiding-now{
  display: inline-block;
  font-size: 14px;
  line-height: 20px;
  color: #999999;
  margin-left: 20px;
  cursor: pointer;
}

.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom .hiding-but-juage>a{
  color: #e74b3b;
}

.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom .hiding-lose{
  color: #999999;
  font-size: 14px;
  margin-left: 20px;
}

.community-setting-out-right .community-setting-out-right-option .community-setting-out-right-option-bottom .hiding-lose>a{
  color: #e74b3b;
}


/* 404 */
.not-found-contanier{width: 745px; padding: 210px 0 150px; margin: 0 auto;}
.not-found-contanier .not-found-section{float: left;}
.not-found-contanier .not-found-section.left-section{margin-right: 157px;}
.not-found-contanier .not-found-section .em-icon{width: 358px; padding-top: 15px;}
.not-found-contanier .not-found-section .not-found-tip{padding-top: 50px;}
.not-found-contanier .not-found-section .not-found-code{padding: 12px 0 64px;}
.not-found-contanier .not-found-section .to-index{font-weight: 600; color: #e74b3b;}
.not-found-contanier .not-found-section .to-index:hover{color: #cf4334;}
.not-found-contanier .not-found-section .cry-icon{width: 228px;}

/* 封皮 */
.wrappage-container .wrappage-cover-wrap{position: relative; background-color: #333; color: #fff; line-height: 1; height: 630px; overflow: hidden;}
.wrappage-container .wrappage-cover-wrap video{width: 100%; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transition: .2s ease-in-out; -webkit-transition: .2s ease-in-out; -moz-transition: .2s ease-in-out; -ms-transition: .2s ease-in-out; -o-transition: .2s ease-in-out;}
.wrappage-container .wrappage-cover-main{position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.4);}
.wrappage-container .wrappage-cover-main .wrappage-cover-center{position: absolute; width: 100%; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); margin-top: 10px;}
.wrappage-container .wrappage-cover-detail{text-align: center;}
.wrappage-container .wrappage-cover-detail .slogan{font-size: 48px;}
.wrappage-container .wrappage-cover-detail .join-num{font-size: 20px; font-weight: 300; padding: 25px 0 0;}
.wrappage-container .wrappage-cover-main .btn-wrap{margin-top: 69px; text-align: center;}
.wrappage-container .join-btn{display: inline-block; width: 160px; height: 50px; line-height: 50px; border-radius: 2px; text-align: center; cursor: pointer; font-size: 16px; color: #fff; margin: 0 10px;}
.wrappage-container .wrappage-play-video{position: absolute; bottom: 43px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%);}
.wrappage-container .wrappage-play-video span{position: relative; font-size: 16px; font-weight: 300; line-height: 20px; color: #fff; padding-left: 26px; cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.wrappage-container .wrappage-play-video span:hover{opacity: .6;}
.wrappage-container .wrappage-play-video span:before{content: ""; position: absolute; left: 0; background: url("//oss-xpc0.xpccdn.com/Upload/boss/2018/03/055a9cf02e020e3.png") no-repeat; background-size: cover; width: 20px; height: 20px;}
.wrappage-container .level-title{color: #000; font-weight: normal;}
.wrappage-container .first-level-title{font-size: 36px; padding: 100px 0 50px; text-align: center;}
.wrappage-container .second-level-title{font-size: 28px;}
.wrappage-container .article-set-box .article-set-con{font-size: 0; padding-bottom: 76px; text-align: center; background: url(
"//oss-v6.xpccdn.com/Uploads/Activity/2017-09-18/59bf692de113c.png") no-repeat; background-position: bottom; background-size: 100% 500px;}
.wrappage-container .article-set-box .article-set-con .set-left{display: inline-block; width: 500px; height: 459px; vertical-align: middle;background-color: #e2e3e5;}
.wrappage-container .article-set-box .article-set-con .set-left .set-video{width: 100%; border-radius: 4px; box-shadow: 0 2px 22px 2px rgba(0, 0, 0, 0.1);}
.wrappage-container .article-set-box .article-set-con .set-right{display: inline-block; width: 380px; margin-left: 78px; text-align: left; vertical-align: middle;}
.wrappage-container .article-set-box .set-tip-list li{font-size: 16px; color: #333; font-weight: 300; padding-top: 30px;}
.wrappage-container .article-set-box .create-set-wrap{margin-top: 50px;}
.wrappage-container .article-set-box .create-set-btn{height: 50px; line-height: 50px; text-align: center; border-radius: 2px; cursor: pointer; font-size: 16px; color: #fff; padding: 0 48px;}


.wrappage-container .article-show-box{width: 1140px; margin: 120px auto 0; font-size: 0;}
.wrappage-container .select-list{width: 372px; display: inline-block; vertical-align: middle;}
.wrappage-container .select-list .show-intro{font-size: 14px; font-weight: 300; color: #333; line-height: 1.86; padding: 20px 0 60px;}
.wrappage-container .select-list .show-btn-list{font-size: 0;}
.wrappage-container .select-list .show-btn-list li{display: inline-block; margin: 0 20px 25px 0;}
.wrappage-container .select-list .show-btn-list li:nth-of-type(5){margin-right: 20px;}
/*.wrappage-container .select-list .show-btn-list li:nth-of-type(3n){margin-right: 0;}*/
.wrappage-container .select-list .show-btn-list li a{display: block; padding: 0 26px; height: 36px; line-height: 36px; background-color: #f35c4c; color: #fff; font-size: 14px; border-radius: 100px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; font-weight: 300;}
.wrappage-container .select-list .show-btn-list li:last-child a{background-color: transparent; width: auto; height: auto; font-size: 16px; color: #e74b3b; padding: 0;}
/*.wrappage-container .select-list .show-btn-list li:last-child a:hover{background-color: transparent; color: #A54A3E;}*/
.wrappage-container .select-list .show-btn-list li:last-child a:hover{background-color: transparent; color: #cf4334;}
.wrappage-container .select-list .show-btn-list li a:hover{background-color: #cf4334;}
.wrappage-container .article-show-box .show-right{display: inline-block; vertical-align: middle; width: 695px; margin-left: 72px; vertical-align: middle;}
.wrappage-container .article-show-box .show-right li{display: inline-block; width: 225px; height: 135px; margin: 0 10px 10px 0;}
.wrappage-container .article-show-box .show-right li:nth-of-type(3n){margin-right: 0;}
.wrappage-container .article-show-box .show-right li .video-cover{overflow: hidden;}
.wrappage-container .article-show-box .show-right .video-cover .video-hover-con{background-color: rgba(30, 31, 41, 0.9);  transition: .15s ease; -webkit-transition: .15s ease; -moz-transition: .15s ease; -ms-transition: .15s ease; -o-transition: .15s ease;}
/*.wrappage-container .article-show-box .show-right .video-cover:hover .video-hover-con{transform: translateY(0);}*/
.wrappage-container .article-show-box .show-right li .video-cover > img{width: 225px; height: 135px;}
.wrappage-container .article-show-box .show-right li .video-cover .video-hover-con .desc{font-size: 13px; margin: 15px 15px 0; color: #e2e3e5;}
.wrappage-container .article-show-box .show-right .video-cover .video-cover-con .video-mark{padding: 0 12px;}
/*.wrappage-container .article-show-box .show-right .video-cover .video-hover-con{transform: translateY(135px);}*/
.wrappage-container .article-show-box .show-right .video-cover .video-hover-con span{display: inline-block; color: #999; margin: 0 15px; padding-top: 5px; color: #999;}
.wrappage-container .article-show-box .show-right .video-cover .video-hover-con p{color: #999;}
.wrappage-container .article-show-box .show-right .video-cover .video-hover-con p i{position: static; display: inline-block; vertical-align: middle;}
.wrappage-container .article-show-box .show-right .video-cover .video-hover-con p i.title{padding-right: 5px;}

.wrappage-container .creator-show-box{width: 1140px; margin: 120px auto 0; font-size: 0;}
.wrappage-container .creator-show-box .show-left{display: inline-block; width: 720px; vertical-align: middle;}
.wrappage-container .creator-show-box .show-left li .avator{width: 180px; height: 180px;}

.wrappage-container .creator-show-box .show-left li{width: 180px; height: 180px; position: relative; display: inline-block;}
.wrappage-container .creator-show-box .show-left li a{position: absolute; top: 0; left: 0; opacity: 0; -webkit-transition: 1s; -moz-transition: 1s; -o-transition: 1s; -ms-transition: 1s; transition: 1s;}
.wrappage-container .creator-show-box .show-left li a.show{opacity: 1; z-index: 1;}
.wrappage-container .creator-show-box .show-left li a .avatar{width: 100%;}
.wrappage-container .creator-show-box .show-left li a .cover{position: absolute; width: 100%; text-align: center;  height: 100%; top: 0; left: 0; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s; opacity: 0; background-color: rgba(30, 31, 41, 0.9); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);}
.wrappage-container .creator-show-box .show-left li:hover a .cover{opacity: 1;}
.wrappage-container .creator-show-box .show-left li a .cover-inner{position: absolute; width: 140px; padding: 0 20px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);}
.wrappage-container .creator-show-box .show-left li a .cover .name-wrap .name{color: #e2e3e5; padding-right: 3px;}
.wrappage-container .creator-show-box .show-left li a .cover .name-wrap .author-v{display: inline-block; position: static;}
.wrappage-container .creator-show-box .show-left li a .cover .roles{color: #999; line-height: 1; padding-top: 5px;}
.wrappage-container .creator-show-box .show-left li a .cover .intro{color: #999; line-height: 1.6; padding-top: 18px;}
.wrappage-container .creator-show-box .show-right{width: 350px; margin-left: 70px;}
.wrappage-container .creator-show-box .show-right .show-btn-list li a{background-color: #1bc5b5;}
.wrappage-container .creator-show-box .show-right .show-btn-list li a:hover{background-color: #19b0a1;}
.wrappage-container .creator-show-box .show-right .show-btn-list li:last-child a{background-color: transparent; width: auto; height: auto; font-size: 16px; color: #1cc5b4; padding: 0;}
.wrappage-container .creator-show-box .show-right .show-btn-list li:last-child a:hover{background-color: transparent; color: #19b0a1;}

.wrappage-container .example-icon{position: absolute; width: 100px; height: 100px; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);  background: url("https://oss-xpc0.xpccdn.com/Upload/edu/2019/07/315d415b56590fd.png") no-repeat; background-size: cover;}
.wrappage-container .example-icon.vmovier{background-position: 0 -74px;}
.wrappage-container .example-icon.music{background-position: 0 -174px;}
.wrappage-container .example-icon.more{background-position: 0 -274px;}
.wrappage-container .example-icon.video{background-position: 0 -374px;}
.wrappage-container .example-icon.filmset{background-position: 0 -474px;}
.wrappage-container .example-icon.image{background-position: 0 -549px;}
.wrappage-container .example-icon.creator{background-position: 0 22px;}
.wrappage-container .example-icon.hire{background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2020/04/015e847240d17ec.png);}
.wrappage-container .example-icon.ae{background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2020/04/015e847240e4b56.png);}

.wrappage-container .example-show-box{width: 1140px; margin: 120px auto 0;}
.wrappage-container .example-show-box h4{text-align: center; padding-bottom: 40px;}
.wrappage-container .example-show-box-2{margin-top: 0;}
.wrappage-container .example-show-box-2 .item-intro{color: #333;}
.wrappage-container .example-list{font-size: 0; margin: 0 auto;}
.wrappage-container .example-list li{display: inline-block; margin: 0 21px 21px 0; width: 366px; vertical-align: top;}
.wrappage-container .example-list li:nth-of-type(3n+3){margin-right: 0;}
.wrappage-container .example-list li .example-cover-wrap{position: relative; overflow: hidden; cursor: pointer;}
.wrappage-container .example-list li .example-cover-wrap .example-img{width: 100%; transition: .15s;}
.wrappage-container .example-list li .example-cover-wrap:hover .example-img{transform: scale(1.02);}
.wrappage-container .example-list li.recent-sale .example-cover-wrap{cursor: default;}
.wrappage-container .example-list li.recent-sale .example-cover-wrap:hover .example-img{transform: scale(1);}
.wrappage-container .example-list li .example-detail-wrap{padding-top: 35px;}
.wrappage-container .example-list li .example-detail-wrap .title{font-size: 16px; color: #000; line-height: 1; font-weight: normal; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; cursor: pointer;}
.wrappage-container .example-list li.recent-sale .example-detail-wrap .title{cursor: default;}
.wrappage-container .example-list li.recent-sale .example-detail-wrap .title:hover{color: #000;}
.wrappage-container .example-list li .example-detail-wrap .title:hover{color: #e74b3b;}
.wrappage-container .example-list li .example-detail-wrap .intro{font-size: 14px; font-weight: 300; line-height: 1.86; color: #999999; padding-top: 15px;}
.wrappage-container .more-btn{display: block; width: 226px; height: 48px; line-height: 48px; border: 1px solid #666; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  text-align: center; cursor: pointer; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;  transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; background-color: #fff; font-size: 16px; color: #333; margin: 45px auto 0;}
.wrappage-container .more-btn:hover{background-color: #f0f0f0;}

.wrappage-container .school-show-box{height: 790px; margin-top: 120px; position: relative; overflow: hidden; background-color: #e2e3e5;}
.wrappage-container .school-show-cover{position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,.6); z-index: 1;}
.wrappage-container .school-show-box video{position: absolute; width: 100%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);}
.wrappage-container .school-show-box .video-cover{height: 100%; width: 100%; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-05/595c7eace4d75.png); position: absolute; background-size: 4.5px; left: 0; top:0; z-index: 1;}
.wrappage-container .school-show-box video.style-2{height: 100%; left: 50%; transform: translateX(-50%);}
.wrappage-container .school-show-box .first-level-title{padding-bottom: 24px; color: #fff; position: relative; z-index: 1;}
.wrappage-container .item-intro{font-size: 16px; font-weight: 300; color: #fff; position: relative; z-index: 1; text-align: center;}
.wrappage-container .item-intro em{font-style: normal; padding: 0 15px; position: relative;}
.wrappage-container .item-intro em:after{content: ""; position: absolute; width: 4px; height: 4px;background-color: rgba(216, 216, 216, 0.49); right: -2px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); border-radius: 50%;}
.wrappage-container .item-intro em:last-child:after{display: none;}

.wrappage-container .end-box{margin-top: 40px; padding: 60px 0 230px; background: url(
"//oss-v6.xpccdn.com/Uploads/Activity/2017-09-18/59bfaae90e8dd.png") no-repeat; background-position: bottom; background-size: 100% 500px;}
.wrappage-container .end-box .first-level-title{padding-bottom: 190px; color: #333;}
.wrappage-container .end-box .btn-wrap{margin: 0 auto; text-align: center;}
.wrappage-container .wrappage-complete-video{position: fixed; width: 800px; height: 450px; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); z-index: 10002; opacity: 0; transition: .15s ease-in-out; -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out; -o-transition: .3s ease-in-out;}
.wrappage-container .wrappage-complete-video.show{opacity: 1;}
.wrappage-container .wrappage-complete-video .iframe-layer{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);}
.wrappage-container .wrappage-complete-video .iframe-close{position: absolute; width: 22px; height: 22px; right: -32px; top: 0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; /*cursor: pointer;*/}
.wrappage-container .wrappage-complete-video .iframe-close:before{color: #fff; font-size: 22px;}
.wrappage-container .wrappage-complete-video .iframe-close:hover{opacity: .5;}
.common-school-list-wrap .more-btn{margin-top: 30px; background-color: transparent; color: #fff; border-color: rgba(255,255,255,.5); position: relative; z-index: 1;}
.common-school-list-wrap .more-btn:hover{background-color: rgba(255, 255, 255, 0.6);}
.common-school-list-wrap .course-list{font-size: 0; width: 1140px; margin: 40px auto 0; position: relative; z-index: 1;}
.common-school-list-wrap .course-list > li{display: inline-block; width: 360px; margin: 0 30px 30px 0; vertical-align: top; position: relative;}
.common-school-list-wrap li .item-inner{overflow: hidden;  -webkit-transition:  .3s ease-in-out;-moz-transition:  .3s ease-in-out;-ms-transition:  .3s ease-in-out;-o-transition:  .3s ease-in-out; transition:  .3s ease-in-out; transform: translateY(0px); box-shadow: 0 2px 22px 2px rgba(0, 0, 0, 0.35); overflow: hidden; border-radius: 2px;}
.common-school-list-wrap li .item-inner:hover{transform: translateY(-10px); box-shadow: 0 2px 40px 2px rgba(0, 0, 0, 0.49);}
.common-school-list-wrap li .coupon-tip{position: absolute; width: 90px; height: 27px; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-08-11/598d8fe94a549.png) no-repeat; background-size: cover; z-index: 1; top: 14px; left: -5px; color: #fff; text-align: center; line-height: 23px; font-size: 13px;}
.common-school-list-wrap .course-list > li:nth-of-type(4n){margin-right: 0!important;}
.common-school-list-wrap li .item-top{position: relative;}
.common-school-list-wrap li .item-top .cover-wrap{overflow: hidden;}
.common-school-list-wrap li .item-top .cover{width: 100%; -webkit-backface-visibility: hidden;-webkit-transition: transform .3s linear;-moz-transition: transform .3s linear;-ms-transition: transform .3s linear;-o-transition: transform .3s linear; transition: transform .3s linear; height: 150px; background-color: #f0f0f0;}
.common-school-list-wrap li .item-top .mask{position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,.1); cursor: pointer;}
.common-school-list-wrap li.pre .item-top .mask{cursor: default;}
.common-school-list-wrap li .item-top .mask .cate{position: absolute; bottom: 10px; right: 18px; line-height: 1; font-size: 12px; font-weight: 300; color: #fff;}
.common-school-list-wrap li .item-top .mask .presell{position: absolute; width: 50px; height: 24px; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-04/595b01cf9f909.png) no-repeat; background-size: cover; left: -3px; top: 12px; font-size: 14px; color: #fff; line-height: 24px; text-align: center;}
.common-school-list-wrap li .item-bottom{padding: 20px 18px 14px; background-color: #fff;}
.common-school-list-wrap li .item-bottom .course-info{line-height: 1; position: relative; width: 100%;}
.common-school-list-wrap li .item-bottom .mask{cursor: pointer;}
.common-school-list-wrap li.pre .item-bottom .mask{cursor: default;}
.common-school-list-wrap li .item-bottom .course-title{font-size: 16px; font-weight: bold; color: #333; max-width: 326px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.common-school-list-wrap li .item-bottom .course-title:hover{color: #e74b3b;}
.common-school-list-wrap li.pre .item-bottom .course-title{color: #999;}
.common-school-list-wrap li.pre .item-bottom .course-title:hover{color: #999;}

.common-school-list-wrap li .item-bottom .course-info .course-price{position: absolute; right: 0; bottom: 0;}
.common-school-list-wrap li .item-bottom .course-info .course-price .original{font-size: 12px; color: #878787; text-decoration: line-through; vertical-align: bottom; padding: 0 5px 1px;}
.common-school-list-wrap li .item-bottom .course-info .course-price .current{font-size: 18px; color: #fb262b; font-weight: 600;}
.common-school-list-wrap li .item-bottom .course-info .course-price .course-notice{font-size: 18px; color: #999; font-weight: 600;}
.common-school-list-wrap li .item-bottom .course-info .course-price .course-ing{color: #fb262b;}
.common-school-list-wrap li .item-bottom .course-teacher{font-size: 12px;
  line-height: 1.67;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #999;
  font-weight: 300;}
.common-school-list-wrap li .item-bottom .course-teacher .sale-num{float: right; font-size: 12px; color: #999; font-weight: 300; line-height: 14px;}
.common-school-list-wrap li .item-bottom .course-teacher .interest{float: right; font-size: 14px; color: #ff4038; line-height: 14px; cursor: pointer; position: relative;}
.common-school-list-wrap li .item-bottom .course-teacher .interest:before{content: ""; position: absolute; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-18/596dd550172f5.png) no-repeat; width: 8px; height: 8px; background-size: cover; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); left: -12px;}
.common-school-list-wrap li .item-bottom .course-teacher .interested{color: #999;}
.common-school-list-wrap li .item-bottom .course-teacher .interested:before{content: ""; position: absolute; background: url(//oss-v6.xpccdn.com/Uploads/Activity/2017-07-18/596dd5ed9a419.png) no-repeat; width: 10px; height: 6px; background-size: cover; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); left: -14px;}
.common-school-list-wrap li.pre .item-bottom .course-teacher{color: #999;}
.wrappage-container .float-elem{transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1),-webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);}
.wrappage-container .float-down{-webkit-transform: translate3d(0,30px,0); opacity: 0;}
.wrappage-container .el-1{transition-delay: .2s;}
.wrappage-container .el-2{transition-delay: .3s;}
.wrappage-container .el-3{transition-delay: .4s;}
.wrappage-container .el-4{transition-delay: .5s;}
.wrappage-container .school-show-box .el-2, .wrappage-container .example-show-box .el-2{transition-delay: .4s;}
.wrappage-container .school-show-box .el-3, .wrappage-container .example-show-box .el-3{transition-delay: .6s;}
.course-transfer-wrap{position: absolute; background-color: #ffb456; width: 100%; height: 50px; top: 60px; text-align: center; z-index: 1; font-size: 0;  cursor: pointer;}
.course-transfer-wrap .course-transfer-content{display: block; font-size: 16px; line-height: 50px; color: #fff;}
.course-transfer-wrap .course-transfer-close{position: absolute; right: 48px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);}
.course-transfer-wrap .course-transfer-close:before{font-size: 20px; color: #fff;}
@media screen and (max-width: 1400px){
  .wrappage-container .school-show-box video{height: 100%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); width: auto; top: auto;}
}
.creators-contanier{width: 1140px; margin: 0 auto; padding: 100px 0 40px;}
.creators-contanier .creators-title{font-size: 20px; color: #333; font-weight: 500;}
.creators-contanier .creators-title a{transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.creators-contanier .creators-title a:hover{color: #e74b3b;}
.creators-contanier .creators-title i{color: #999; padding: 0 10px;}
.creators-contanier .creators-title span{color: #999;}
.creators-contanier .creators-left{width: 850px; margin-top: 20px; float: left;}
.creators-contanier .creators-left .creators-list{background-color: #fff; padding: 0 20px;}
.creators-contanier .creators-left .creators-list li{padding: 20px 0; position: relative; border-bottom: 1px solid #f0f0f0;}
.creators-contanier .creators-left .creators-list li:last-child{border-bottom: none;}
.creators-contanier .creators-left .creators-list .avator-wrap{position: absolute; cursor: pointer;}
.creators-contanier .creators-left .creators-list .avator-wrap img{width: 58px; height: 58px; border-radius: 50%; border: solid 1px #f0f0f0; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.creators-contanier .creators-left .creators-list .avator-wrap img:hover{opacity: .5;}
.creators-contanier .creators-left .creators-list .avator-wrap .author-v{width: 14px; height: 14px; bottom: 2px; right: 2px;}
.creators-contanier .creators-left .creators-list .info-wrap{margin-left: 80px; height: 60px;}
.creators-contanier .creators-left .creators-list .info-wrap .name-wrap{padding: 10px 0 2px;}
.creators-contanier .creators-left .creators-list .info-wrap .creators-name{font-size: 14px; color: #333; font-weight: 600; max-width: 560px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.creators-contanier .creators-left .creators-list .info-wrap .creators-name:hover{color: #e74b3b;}
.creators-contanier .creators-left .creators-list .info-wrap .date-submit {
  font-size: 12px;
  line-height: 17px;
  color: #999999;
  vertical-align: middle;
  vertical-align: 6px;
  margin-left: 15px;
}

.creators-contanier .creators-left .creators-list .detail-wrap{font-size: 0; color: #999; font-weight: 300;}
.creators-contanier .creators-left .creators-list .detail-wrap span{display: inline-block; font-size: 12px; }
.creators-contanier .creators-left .creators-list .detail-wrap span.role{padding-right: 20px;}
.creators-contanier .creators-left .creators-list .detail-wrap .i-icon{height: 10px;}
.creators-contanier .creators-left .creators-list .btn-wrap{font-size: 0; position: absolute; right: 0px; top: 50%; transform: translateY(-50%);}
.creators-contanier .creators-left .creators-list .btn-wrap .btn{display: inline-block; width: 58px; height: 26px; line-height: 26px; border: solid 1px rgba(153, 153, 153, 0.5); border-radius: 2px; font-weight: 500; font-size: 12px; text-align: center; cursor: pointer; margin-left: 14px; vertical-align: middle; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.creators-contanier .creators-left .creators-list .btn-wrap a.btn{color: #333;}
.creators-contanier .creators-left .creators-list .btn-wrap span.btn{border: 1px solid #e74b3b;}
.creators-contanier .creators-left .creators-list .btn-wrap .btn:hover{background-color: #f0f0f0;}
.creators-contanier .creators-right{float: left; margin-left: 20px;}
.creators-contanier .creators-right > li{margin: 20px 0 0;}
/* 隐身访问 */
.creators-contanier .creators-left .creators-list .hiding-visit-btn-wrap {
  position: absolute; 
  right: 85px; 
  top: 50%; 
  transform: translateY(-50%);
  border: 1px solid rgba(153, 153, 153, 0.5);
  padding: 5px 12px;
  font-size: 12px;
  line-height: 18px;
  color: #333333;
  font-weight: 500;
  cursor: pointer;
}
.creators-contanier .creators-left .creators-list .hiding-visit-btn-wrap:hover {
  background-color: #f0f0f0;
}
.creators-contanier .creators-left .creators-list .hiding-visit-btn-wrap>i {
  display: inline-block;
  width: 13px;
  height: 10px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a79a45b.png);
  vertical-align: middle;
  background-size: cover;
  background-repeat: no-repeat;
  margin-right: 4px;
  cursor: pointer;
}
.creators-contanier .creators-left .creators-list .hiding-visit-jump-btn {
  padding: 5px 12px;
  display: inline-block;
  position: absolute; 
  right: 0px; 
  top: 50%; 
  transform: translateY(-50%);
}
.fixed-2017{width:55px;height:185px;position:fixed;right:0;top:20%;z-index:10;cursor:pointer;box-shadow:1px 7px 11px rgba(0,0,0,.2)}
.fixed-2017:hover .qrcode{transform:translateX(0);opacity:1}
.fixed-2017 .fixed-bg{position:absolute;width:100%;height:100%;left:0;top:0;background:url(//oss-xpc0.xpccdn.com/Upload/boss/2017/12/305a466dcf8b2ed.png);background-size:cover}
.fixed-2017 .qrcode{width:100px;position:absolute;bottom:0;left:-120px;font-size:12px;color:#000;padding:10px;text-align:center;box-shadow:1px 7px 11px rgba(0,0,0,.2);transform:translateX(100px);opacity:0;transition:.3s ease-in-out;z-index:-1;background-color:#fff}
.fixed-2017 .qrcode p{padding-top:10px}
.fixed-2017 .qrcode img{width:100%}
.fixed-2017-amimate{width: 50px; opacity: 0; visibility: hidden; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; z-index: 100;}
.fixed-2017-amimate .fixed-bg{background-image: url(https://oss-xpc0.xpccdn.com/Upload/boss/2018/01/025a4b685aa499f.png);}
.fixed-2017-amimate.show{opacity: 1; visibility: visible;}


.choose-bar-v2{background: #ffffff;padding-top: 20px;font-size: 14px;font-weight: 300;color: #333333; display: none;}
.choose-bar-v2 .common-hover-wrap {position: absolute;right: -28px;box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);top: 30px;}

.choose-bar-v2 .type-up, .choose-bar-v2 .type-down {padding:0px 28px;}
.choose-bar-v2 .type-up {padding-bottom: 14px;}
.choose-bar-v2 .type-up {border-bottom: 1px solid #f0f0f0;}
.choose-bar-v2 .type-down {padding-bottom: 14px;}
.choose-bar-v2 .type-1 {float: right;position: relative;bottom: 19px;}
.choose-bar-v2 .type-up .type-mark .mark{font-size:14px;font-weight:500;color:#cccccc;float:left;}
.choose-bar-v2 .type-up .type-mark .type-global{margin-left: 88px;font-size: 0;}
.choose-bar-v2 .type-up .type-mark .type-global span{margin:0 40px 6px 0;display: inline-block;cursor: pointer;font-size: 14px;}
.choose-bar-v2 .type-up .type-mark .type-global span:hover{color:#999;}
.choose-bar-v2 .type-up .type-mark .type-global span a:hover{color:#999;}
.choose-bar-v2 .type-up .type-mark .type-global .cur{color: #e74b3b!important;;font-weight: 500;}
.choose-bar-v2 .type-up .type-mark .type-global .cur a{color: #e74b3b!important;font-weight:500;}
.choose-bar-v2 .type-up .mar-bottom{margin-bottom: 8px;}
.choose-bar-v2 .type-up .mar-bottom:last-child{margin-bottom: 0px;}
.choose-bar-v2 .type-down .sort-type{margin-top:13px;}
.choose-bar-v2 .type-down .sort-type span{font-size: 14px;font-weight: 300;color: #333333;cursor: pointer;}
.choose-bar-v2 .type-down .sort-type span:hover{color:#999;}
.choose-bar-v2 .type-down .sort-type span a:hover{color:#999;}
.choose-bar-v2 .type-down .past-type{right:40px;}
.choose-bar-v2 .type-down .area-type{z-index: 5;}
.choose-bar-v2 .type-down .past-type{z-index: 5;}
.choose-bar-v2 .type-down .area-type .type-2-list-wrap{/*width: 261px; */height: 264px;
  overflow-y: auto; background: #ffffff;/*display: flex;*/font-size: 0;}
.choose-bar-v2 .type-down .area-type .type-2-list-wrap ul{width: 246px;padding: 6px;}
.choose-bar-v2 .type-down .area-type .type-2-list-wrap ul > li{
  line-height:42px;height: 42px;width: 82px;text-align: center;float: left;cursor: pointer;
}
.choose-bar-v2 .type-down .type-1 ul li:hover{background-color: #f0f0f0;}
.choose-bar-v2 .type-down .type-1 span {cursor: pointer;font-weight: 500;}
.choose-bar-v2 .type-down .type-1 span:hover{color: #999;}
.choose-bar-v2 .type-down .past-type .common-hover-wrap {right: -75px;}
.choose-bar-v2 .type-down .past-type .type-2-list-wrap{width: 170px; height: 264px;
  overflow-y: auto; padding: 6px 0;background: #ffffff;}
.choose-bar-v2 .type-down .past-type .type-2-list-wrap ul>li{
  padding:0 20px; line-height:42px;display:block;cursor: pointer;
}
.choose-bar-v2 .type-down .past-type .type-2-list-wrap .cur, .choose-bar-v2 .type-down .area-type .type-2-list-wrap .cur{font-weight: 500;}

.choose-bar-v2 .type-down .sort-type {font-size: 0;}
.choose-bar-v2 .type-down .sort-type .select {font-weight: 500;}
.choose-bar-v2 .type-down .sort-type .select:hover{color: #333!important;}
.choose-bar-v2 .type-down .sort-type .select a:hover{color: #333!important;}
.choose-bar-v2 .type-down .sort-type .i-icon {margin: 0 28px;}

.choose-bar-v3 .choose-bar-top{padding: 11px 2px; background-color: #fff; border: solid 1px #f0f0f0;}
.choose-bar-v3 .choose-bar-top li{float: left; margin: 5px 16px;}
.choose-bar-v3 .choose-bar-top li a{display: block; padding: 2px 8px; border-radius: 2px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-top li a:hover{color: #e74b3b;}
.choose-bar-v3 .choose-bar-top li.selected a{background-color: #e74b3b; color: #fff;}
.choose-bar-v3 .choose-bar-top .second-type{padding: 5px 0; margin: 5px 16px;  background-color: #f7f7f7;}

.choose-bar-v3 .choose-bar-bottom{font-size: 0; position: relative;}
.choose-bar-v3 .choose-bar-bottom .vipfilter-hint {
  background-color: #e74b3b;
  height: 28px;
  line-height: 28px;
  padding: 5px 47px 5px 17px;
  text-align: center;
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
  border-radius: 2px;
  position: absolute;
  color: #FFF;
  z-index: 10;
  font-size: 12px;
  left: -100%;
  top: -28px;
  width: 210px;
}
.choose-bar-v3 .choose-bar-bottom .vipfilter-hint .icon-close{
  position: absolute;
  right: 11px;
  bottom: 9px;
  font-size: 20px;
  cursor: pointer;
}
.choose-bar-v3 .choose-bar-bottom .vipfilter-hint .bottom-triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 5px 0 5px;
  border-color: #e74b3b transparent transparent transparent;
  position: absolute;
  bottom: -8px;
  left: 135px;
}
.choose-bar-v3 .choose-bar-bottom .sort-type{display: inline-block;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li{float: left; margin-right: 48px;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li.selected a{color: #e74b3b; font-weight: 500;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li.selected a:before{color: #e74b3b;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li a{position: relative; display: block; padding-left: 20px; line-height: 58px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li:first-child a{padding-left: 20px;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li a:before{position: absolute; font-size: 12px; left: 0; top: 1px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li a:hover{color: #e74b3b; font-weight: 500;}
.choose-bar-v3 .choose-bar-bottom .sort-type > li a:hover:before{color: #e74b3b;}
.choose-bar-v3 .choose-bar-bottom .detail-type{float: right;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.detail-type-title {
  position:relative;
  font-weight: 500;
  cursor: default;
}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.detail-type-title .vipicon {
  display: inline-block;
  width: 15.4px;
  height: 12px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d5614ec517cc.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0;
  vertical-align: -3px;
  margin-right: 3px;
}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.detail-type-title .icon-filter {
  margin-right: 3px;
  display: inline-block;
  vertical-align: middle;
}

.choose-bar-v3 .choose-bar-bottom .detail-type .font-overstriking-hide-task {
  font-weight:600 !important;
  color: #333 !important;
}

.choose-bar-v3 .choose-bar-bottom .detail-type .font-overstriking-hide-task > a {
  color: #333 !important;
}

.choose-bar-v3 .choose-bar-bottom .detail-type > li{position: relative; float: left; line-height: 58px; margin-left: 48px; padding-right: 12px; cursor: pointer; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li:hover{font-weight: 500;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li:before{position: absolute; font-size: 12px; color: #999; transform: scale(.8); right: 0; top: 1px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li:hover:before{transform: rotate(180deg) scale(.8);}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.work-item .common-hover-wrap{position: absolute; width: 120px; z-index: 1; top: 46px; left: -16px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.work-item .common-hover-wrap .list > li a{height: 38px; line-height: 38px; font-size: 12px; padding: 0 16px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.work-item .common-hover-wrap .list > li.selected a{font-weight: 500; color: #e74b3b;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.review-item .common-hover-wrap{position: absolute; width: 120px; z-index: 1; top: 46px; left: -16px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.review-item .common-hover-wrap .list > li a{height: 38px; line-height: 38px; font-size: 12px; padding: 0 16px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.duration-item .common-hover-wrap{position: absolute; width: 120px; z-index: 1; top: 46px; left: -16px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.duration-item .common-hover-wrap .list > li a{height: 38px; line-height: 38px; font-size: 12px; padding: 0 16px; transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; -o-transition: .15s ease-in-out;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.duration-item .common-hover-wrap .list > li.selected a{font-weight: 500; color: #e74b3b;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.hide-production-tab {
  padding: 0px;
  margin-left: 48px;
  color: #333333;
  font-weight: normal;
}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.hide-production-tab .award-con-wrap-hide-hint {
  color: #fffefe;
  line-height: 1.5;
  position: absolute;
  width: 210px;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  z-index: 1;
  padding-bottom: 15px;
  transition: .3s ease;
}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.hide-production-tab .award-con-wrap-hide-hint:after {
  content: "";
  position: absolute;
  border-left: 5px solid rgba(0,0,0,0);
  border-right: 5px solid rgba(0,0,0,0);
  border-top: 8px solid #e74b3b;
  border-bottom: 8px solid rgba(0,0,0,0);
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.hide-production-tab .award-con-wrap-hide-hint .award-con {
  padding: 8px;
  background-color: #e74b3b;
  display: block;
  border-radius: 2px;
  font-size: 12px;
  color: #fff;
  font-weight: 300;
}

.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap{position: absolute; width: 192px; z-index: 100; top: 50px; left: -130px; border-radius: 2px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .hover-box{padding-bottom: 0;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .title{line-height: 34px; padding: 0 16px; height: 24px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list{padding: 0 16px 14px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list li{position: relative; float: left; line-height: 19px; font-size: 12px; font-weight: 300; color: #333; margin-right: 20px; padding-left: 20px; margin-top: 10px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list li:last-child{margin-right: 0;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list li i{; position: absolute; width: 6px; height: 6px; padding: 3px; border: 1px solid #e3e4e5; border-radius: 50%; left: 0; top: 3px;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list li i:before{content: ""; display: block; width: 100%; height: 100%; border-radius: 50%;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list li.selected i{border-color: #e74b3b;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .select-list li.selected i:before{background-color: #e74b3b;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li.morechooce-item .common-hover-wrap .btn{font-size: 12px; font-weight: 500;
  line-height: 34px; color: #e74b3b; text-align: center; border: 1px solid #f7f7f7;}
.choose-bar-v3 .choose-bar-bottom .detail-type > li > a {
  color: #9e9e9e;
}

.creator-bar-v3 .choose-bar-top {
  padding: 16px 0;
}
.creator-bar-v3 .choose-bar-top .first-type {
  padding: 0 16px;
}
.creator-bar-v3 .choose-bar-top li {
  margin: 5px 20px 5px 12px;
}
.creator-bar-v3 .choose-bar-top .second-type {
  margin-left: 16px;
}
.creator-bar-v3 .morechooce-item .choosed-content{
  display:flex;
  justify-content:center;
  align-items:center
}
.creator-bar-v3 .morechooce-item .choosed-content .choosed-city{
  display:inline-block;
  max-width:5em;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .hover-box {
  left: -145px !important;
  overflow: hidden;
  padding: 0;
  height: 266px;
  display: flex;
  flex-direction: row;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .hover-box .area-box {
  display: inline-block;
  width: 120px;
  height: 260px;
  padding-bottom: 6px;
  overflow: auto;
  background-color: rgba(255, 255, 255);
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .hover-box .area-box::-webkit-scrollbar {
  display: none;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .hover-box .area-box.city-box {
  border-style: solid;
  border-width: 0 0 0 1px;
  border-color: #f0f0f0;
  position: relative;
  left: -2px;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .area-list li {
  width: 100%;
  height: 38px;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .area-list li.selected a {
  color: #e74b3b;
  font-weight: 500;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .area-list li a {
  display: flex;
  justify-content: space-between;
  padding: 0 8px 0 16px;
  font-size: 12px;
  font-weight: 300;
  color: #333;
  line-height: 38px;
  white-space: nowrap; 
  text-overflow: ellipsis; 
  overflow: hidden;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .city-box .area-list li a {
  display: block;
  white-space: nowrap; 
  text-overflow: ellipsis; 
  overflow: hidden;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .area-list li a .arrow-left {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 14px 0;
  background-image: url(/public/images/arrow-to-left.svg);
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .area-list li:hover a {
  background: #f0f0f0;
}
.creator-bar-v3 .morechooce-item .common-hover-wrap .area-list .bg-gray {
  background: #f0f0f0;
}



.collection-star {
  width: 16px;
  height: 16px;
  background-size: 23px;
  display: inline-block;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2018/11/195bf27c0327287.png);
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: middle;
}
.collection-star.white-star {
  background-position: 2px -2px;
  width: 23px;
  height: 23px;
}
.collection-star.yello-star {
  background-position: -4px -25px!important;
  width: 16px!important;
  height: 16px!important;
}
.collection-star.hollow-star {
  background-position: -4px -48px;
}


/*百度分享二维码样式维护*/
.bd_weixin_popup_main{
  font-size: 0;
}
.bd_weixin_popup_main td{
  display: inline-block;
}

.bd_weixin_popup_main tr{
  display: inline-block;
  height: 4px;
}

.vip-prompt-frame .vip-prompt {
  width: 340px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
}
.vip-prompt-frame .vip-prompt .prompt-title {
  width: 100%;
  height: 154px;
  background-image: linear-gradient(114.4deg, #0f0f0f, #373737), url('https://oss-xpc0.xpccdn.com/Upload/edu/2022/02/23621629afb8f4c.png');
  background-blend-mode: overlay;
}
.vip-prompt-frame .vip-prompt .prompt-title img {
  display: block;
  padding: 32px 0 12px 0;
  width: 40px;
  height: 40px;
  margin: 0 auto;
}
.vip-prompt-frame .vip-prompt .prompt-title .title-content {
  font-size: 18px;
  font-weight: 500;
  text-align: center;
  color: white;
  line-height: 1.44;
}
.vip-prompt-frame .vip-prompt .prompt-title .subtitle-content {
  font-size: 14px;
  text-align: center;
  color: #6b7280;
  line-height: 1.43;
}
.vip-prompt-frame .vip-prompt .prompt-content {
  margin: 20px 24px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.vip-prompt-frame .vip-prompt .prompt-content p {
  text-align: center;
  line-height: 1.75;
  color: #6b7280;
  font-size: 14px;
  padding-bottom: 12px;
}
.vip-prompt-frame .vip-prompt .prompt-content a {
  position: relative;
  display: block;
  width: 100%;
  line-height: 20px;
  border-radius: 2px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  padding: 9px 0;
  border: none;
  transition: background-color 0.15s;
  cursor: pointer;
}
.vip-prompt-frame .vip-prompt .prompt-content .show-login-link {
  color: #4b5563;
  background: rgba(0, 0, 0, 0);
  border: none;
  cursor: pointer;
}
.vip-prompt-frame .vip-prompt .prompt-content .vip {
  background: #e74b3b;
  margin-top: 8px;
}
.vip-prompt-frame .vip-prompt .prompt-content .vip:hover {
  background: rgba(234, 103, 90, 1);
}
.vip-prompt-frame .vip-prompt .prompt-content .vip:active {
  background: rgba(194, 51, 41, 1);
}
.vip-prompt-frame .vip-prompt .prompt-content .svip {
  margin-top: 8px;
  background-image: linear-gradient(to right, #f9e4b2, #cb8d40);
  color: #572b0b;
}
.vip-prompt-frame .vip-prompt .prompt-content .svip:before {
  position: absolute;
  top: 0;
  left: 0;
  content: '查看会员套餐';
  width: 100%;
  line-height:20px;
  padding:9px 0;
  color: #572b0b;
  font-size: 14px;
  background-image: linear-gradient(to right, #efe9c5, #cca268);
  opacity: 0;
  transition: opacity 0.15s;
}
.vip-prompt-frame .vip-prompt .prompt-content .svip:hover:before {
  opacity: 1;
}
.vip-prompt-frame .vip-prompt .prompt-content .svip:after {
  position: absolute;
  top: 0;
  left: 0;
  content: '查看会员套餐';
  width: 100%;
  line-height:20px;
  padding:9px 0;
  color: #572b0b;
  font-size: 14px;
  background-image: linear-gradient(to right, #c1ba8e, #aa7a37);
  opacity: 0;
  transition: opacity 0.15s;
}
.vip-prompt-frame .vip-prompt .prompt-content .svip:active:after {
  opacity: 1;
}
.vip-prompt-frame .vip-prompt .icon {
  color: #fff;
  position: absolute;
  right: 12px;
  top: 12px;
  font-size: 16px;
  cursor: pointer;
  padding: 5px;
}


.vip-icon {
  position: absolute;
  top: 50%;
  right: 0;
  display: inline-block;
  background-size: cover;
  background-repeat: no-repeat;
  transform: translateY(-50%);
}
.vip-icon.cvip-icon {
  width: 13px;
  height: 10px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a79a45b.png);
}
.vip-icon.svip-icon {
  width: 29px;
  height: 10px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/09/055d70f8a79a8f1.png);
}
.vip-icon.bd-icon {
  width: 32.2px;
  height: 14px;;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2021/05/2760af0eab8bbaa.png);
}
.vip-icon.cvip-expire-icon {
  width: 13px;
  height: 10px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2022/09/20632936ad3a321.png);
}
.vip-icon.svip-expire-icon {
  width: 28px;
  height: 10px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2022/09/206329374800f8c.png);
}
.vip-icon.bd-expire-icon {
  width: 29px;
  height: 10px;
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2021/05/2760af0eab85466.png);
}
.cvip-wrap {
  position: relative;
  padding-right: 17px;
  color: #EA580C;
}
.svip-wrap {
  position: relative;
  padding-right: 33px;
  color: #EA580C;
}
.bd-wrap {
  position: relative;
  padding-right: 36px;
}


/*个人页作品排序*/
.sort-container em {font-style: normal;}
.sort-container .action-bar {position: fixed;top: 0;left: 0;width: 100%;height: 60px;background: #fff;z-index: 1000;}
.sort-container .action-bar .action-bar-ground {
  width: 1140px;margin:0 auto;line-height: 60px;font-size: 16px;
}
.action-bar-ground .username {color: #333;font-weight: 600;}
.action-bar-ground .username em {color: #999999;font-style: normal;font-weight: 300;}
.action-bar-ground .btn {float: right;font-size: 12px;}
.action-bar-ground .btn a {margin-right: 32px;cursor: pointer;}
.action-bar-ground .btn span {border-radius: 2px;color: #fff;cursor: pointer;}

.action-bar-ground .btn span:hover {background-color: #d52b1a;}
.action-bar-ground .btn .save {position: relative;width: 72px;height: 32px;border-radius: 2px;display: inline-block;line-height: 32px;text-align: center;vertical-align: middle;background: #e74b3b;}
.action-bar-ground .btn .common-ajax-loading {padding: 0;transform: scale(0.6);}

.sort-container .sort-ground {width: 1140px;margin:0 auto;margin-top: 80px;margin-bottom: 40px;display: flex;cursor: pointer;justify-content: flex-end;min-height: 600px;position: relative;left: 20px;}

.pick-box {width: 270px;background: #fff;max-height: 500px;position: fixed;top: 80px;z-index: 1;box-shadow: 0px 1px 20px rgba(0,0,0,0.05);/*top: 147px;*/}
/*.pick-box-fixed {left: 0;}*/
.pick-box h4 {font-size: 16px;color: #333333;padding: 12px;border-bottom: 2px solid #f0f0f0;}
.pick-box h4 span {float: right;font-size: 14px;color: #999;font-weight: normal;margin-top: 2px;}
.pick-box .search {margin:13px 14px;position: relative;}
.pick-box .search input {border: solid 1px #f0f0f0;padding: 9px 10px;width: 220px;height: 16px;}
.pick-box .search .icon-search {position: absolute;right: 10px;top: 10px;font-size: 16px;color: #999999;}
.pick-box .info {margin:12px 14px 20px;font-size: 12px;color: #999999;height: 18px;text-align: left;}
.pick-box .info .num-total {color: #e74b3b;font-style: normal;font-weight: 600;}
.pick-box .info .pip {float: right; position: relative;}
.pick-box .info .pip em {font-style: normal;cursor: pointer;}
.pick-box .info .pip i{font-size: 12px;transform: scale(.8);display: inline-block;}
.pick-box .info .pip .sort-type {width: 88px;position: absolute;background: #fff;border-radius: 2px;box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);padding: 16px;right: 0;top: 30px;}
.pick-box .info .pip .sort-type span {width: 100%;display: inline-block;margin-bottom: 20px;cursor: pointer;}
.pick-box .info .pip .sort-type span:last-child {margin-bottom: 0;}
.pick-box .info .pip .sort-type span:hover {color: #666;}

.pick-scroll-wrap {max-height: 326px;overflow-y: scroll;margin-bottom: 4px;overflow-x: hidden;}
.pick-scroll-wrap .more {color: #999;font-weight: bold;text-align: center;/*border-bottom: 1px solid #f0f0f0;*/line-height: 40px;}
.pick-list li {height: 58px;padding:0 8px;display: flex;align-items : center;margin-bottom: 4px;}
.pick-list li:hover {background-color: #fff4f0;}
.pick-list li:hover .check {border-color: #e74b3b;}
.pick-list li:hover .check:before {color: #fff4f0;}
.pick-list li.ignore-elements {}
.pick-list li.ignore-elements .check {background: #e74b3b;border-color: #e74b3b;}
.pick-list li .check {width: 16px;height: 16px;border-radius: 2px;border: solid 1px #e5e5e5;display: inline-block;color: #fff;text-align: center;line-height: 16px;font-size: 14px;font-weight: 300;}
.pick-list li .face-wrap .close {display: none;}
.pick-list li .info-wrap {margin-left: 10px;width: 130px;text-align: left;}
.pick-list li img {width: 86px;height: 50px;margin-left: 8px;}
.pick-list li h5 {overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width: 130px;font-size: 12px;}
.pick-list li p {color: #999999;margin-top: 6px;}
.pick-list li p span {margin-right: 20px;}
.pick-list li p span:before {color: #dddddd;margin-right: 4px;}



.sort-box {width: 870px;margin-left: 20px;}

.sort-list .sort-holder-top {width: 100%;height: 312px;font-size: 16px;color: #999999;background: #fff;text-align: center;display: block!important;border: dashed 1px #e3e4e5;}
.sort-list .sort-holder {width: 268px; height: 231px;display: inline-block!important;text-align: center;position: relative;}
.sort-list .sort-holder span {position: absolute;top: 50%;transform: translateY(-50%);width: 100%;left: 0;}
.sort-list {font-size: 0;}
.sort-list li:first-child {display: block;width: 850px;display: flex;justify-content : space-between;}
.sort-list li:first-child img {width: 560px;
  height: 315px;}
.sort-list li:first-child .info-wrap {height: 291px;width: 290px;}
.sort-list li .check {display: none;}
.sort-list li {width: 270px;display: inline-block;margin-right: 20px;margin-bottom: 20px;vertical-align: top;}

.sort-list li .face-wrap {position: relative;}
.sort-list li .face-wrap .close {position: absolute;width: 100%;height: 100%;display: none;background: rgba(0,0,0,0.2);}
.sort-list li .face-wrap .close .icon-close {width: 28px;height: 28px;border-radius: 2px;background: #fff;display: inline-block;text-align: center;line-height: 28px;font-weight: bold;font-size: 14px;position: absolute;right: 10px;top: 10px;}
.sort-list li .face-wrap:hover .close {display: block;}

.sort-list li img {height: 162px;width: 100%;}
.sort-list li .info-wrap {background: #fff;padding: 12px 14px;}

.sort-list li .info-wrap h5 {font-size: 14px;margin-bottom: 8px;color: #333333;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.sort-list li .info-wrap p {color: #999999;font-size: 12px;}
.sort-list li .info-wrap p span {margin-right: 20px;}
.sort-list li .info-wrap p span:before {color: #ddd;margin-right: 4px;}



.user-space-notice-alert {width: 100%;height: 100%;background: rgba(0,0,0,0.5);position: fixed;left: 0;top: 0;z-index: 1000000;}
.user-space-notice-alert .notice-ground {width: 480px;border-radius: 4px;background: #fff;position: absolute;margin-left: -240px;left: 50%;top: 50%;text-align: center;padding-bottom: 32px;transform: translateY(-50%);}
.user-space-notice-alert .notice-ground .desc {font-size: 12px; line-height: 1.5; text-align: center; color: #999; text-align: center; padding-top: 8px;}
.user-space-notice-alert .notice-ground .desc a {padding: 0 4px; color: #e74b3b; transition: .3s ease;}
.user-space-notice-alert .notice-ground .desc a:hover {color: #cf4334;}
.user-space-notice-alert .notice-ground img {display: block; width: 273px; margin: 20px auto 0;}
.user-space-notice-alert .icon-close {position: absolute;font-size: 18px;right: 16px;top: 16px;cursor: pointer;}

.user-space-notice-alert h4 {font-size: 20px;font-weight: 600;color: #333333;margin-top: 32px;}
.user-space-notice-alert p {font-size: 16px;color: #999;}

.user-space-notice-alert img {width: 250px;margin-top: 30px;}
.user-space-notice-alert .btn {width: 190px;height: 40px;border-radius: 2px;box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.2);background-image: linear-gradient(103deg, #e74b3b 2%, #ec7164 98%);line-height: 40px;color: #fff;font-size: 16px;margin-top: 36px;}
.user-space-notice-alert .btn:hover {opacity: 0.8;}



.sortable-drag .info-wrap, .sortable-drag .check, .sortable-drag .close {
  /*display: none!important;*/
  visibility: hidden!important;}


/*.sortable-drag, .sortable-drag img {width: 270px!important;height: 162px!important;}*/
/*.sortable-drag {display: inline-block;width: 270px!important;;}*/
.sortable-drag {position: relative;height: 233px;}
.sortable-drag .face-wrap {position: static!important;}
.sortable-drag img {width: 270px!important;height: 162px!important;position: absolute!important;left: 50%!important;top: 50%!important;margin-top: -81px;margin-left: -135px;}

/*.sortable-drag .info-wrap{height: auto!important;width: auto!important;}*/
.sort-list .sortable-chosen {opacity: 0.5;}


.user-space-notice {position: relative;width: 912px;margin: 20px auto 0;}
.user-space-notice a {color: #e74b3b;/*text-decoration: underline;*/}
.user-space-notice .icon-close {position: absolute;width: 20px;height: 20px;line-height: 20px;right: 20px;top: 50%;margin-top: -10px;font-size: 16px;cursor: pointer;}
.disabled-message {
  height: 48px;
  line-height: 48px;
  border-radius: 2px;
  border: 1px solid #f4af26;
  background-color: #fdf7e9;
  padding: 0 24px;
  color: #595959;
  font-size: 14px;
  text-align: left;

}
.disabled-message img{
  width: 24px;
  margin-top: 12px;
  margin-right: 12px;
}

.sort-hover, .sort {position: relative;}
.sort-hover:hover .tool-tip{display: block;}
.sort-hover img , .sort img, .theme-hover img , .theme img {width: 15.4px;vertical-align: middle;position: relative;top: -1px;margin-right: 4px;}
.tool-tip {
  position: absolute;
  width: 170px;
  background-color: #e74b3b;
  color: #fff;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  padding: 5px;
  border-radius: 2px;
  bottom: 39px;
  display: none;
}
.tool-tip::before {
  content: '';
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-top: 8px solid #e74b3b;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -14px;
}

.guide-img {width: 850px;margin: 0px 0 20px;display: block;}

.list-input{
    /*margin-top: 24px;*/
    /*margin: 4px 12px; */
}
.list-input .input-item{
    /*border-bottom: 1px solid rgba(240, 240, 240, 0.5);*/
    /*margin-top: 20px;*/
    padding-bottom: 20px;
    position: relative;
}
.list-input .empty-item{
    border-color: #e74b3b;
}
.empty-item-notice{
    color: #e74b3b;
    font-size: 10px;
    margin-left: 10px;
}
.list-input .input-item .label{
     color: #1a1a1a;
     font-size: 14px;
     display: inline-block;
     width: 54px;
     text-align: right;
     position: absolute;
     font-weight: 500;
     top: 9px;
     left: 0;
}
.list-input .input-item .label i{
    color: #e74b3b;
    margin-right: 4px;
}
.list-input .input-item .item-box{
    /*width: 100%;*/
    margin-left: 66px;
    display: block;
    font-size: 14px;
    color: #a1a1a1;
}
.list-input .input-item .item-box input{
    display: block;
    width: 100%;
    font-size: 14px;
    border: solid 1px #e5e5e5;
    line-height: 40px;
    text-indent: 12px;
    border-radius: 2px;
    box-sizing: border-box;
    font-weight: 300;
}
.list-input .input-item .item-box input::-webkit-input-placeholder{
    color: #c4c4c4;
}
.list-input .input-item .item-box textarea{
    display: block;
    width: 100%;
    border-radius: 4px;
    border: solid 1px #e5e5e5;
    height: 76px;
    outline:none;
    color: #a1a1a1;
    padding: 9px 12px;
    box-sizing: border-box;
    font-size: 14px;
    border-radius: 2px;
    font-weight: 300;

}
.list-input .input-item .item-box textarea::-webkit-input-placeholder{
    color: #c4c4c4;
}
/*input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #a1a1a1;
}
input:-moz-placeholder, textarea:-moz-placeholder {
    color:#a1a1a1;
}
input::-moz-placeholder, textarea::-moz-placeholder {
    color:#a1a1a1;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    color:#a1a1a1;
}*/

.list-input .input-item .item-box .icon-arrow-down{
    font-style: normal;
    float: right;
    font-weight: 100;
}
.list-input .input-item .item-box  .item-box-action{
    width: 224px;
    height: 133px;
    border-radius: 4px;
    border: 1px dashed rgba(161, 161, 161, 0.5);
    position: relative;
}
.list-input .input-item .item-box  .item-box-action input{
    width: 100%;
    height: 100%;
    /*visibility: hidden;*/
    position: relative;
    z-index: 3;
    font-size: 0;
    opacity:0;
}
.list-input .input-item .item-box  .item-box-action .cb-img{
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 1;
}
.list-input .input-item .item-box  .item-box-action .file-notice{
    font-size: 14px;
    color: #9e9e9e;
    position: absolute;
    text-align: center;
    top: 0%;
    /*transform: translateY(-50%);*/
    width: 100%;
    height: 100%;
    line-height: 1.3;
    z-index: 2;
    padding-top: 12%;
    box-sizing: border-box;
}
.list-input .input-item .item-box  .item-box-action .file-notice i{
    font-size: 36px;
    font-style: normal;
    font-weight: 300;
}
.list-input .input-item .item-box  .action-notice{
    font-size: 10px;
    margin-top: 8px;
    line-height: 1.4;
}


.collection-pick .add {
  height: 48px;
  line-height: 48px;
  color: #e74b3b;
  background: #fff4f0;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}
.collection-pick .add i {
  vertical-align: middle;
  position: relative;
  top: -2px;
  margin-right: 4px;
}
.collection-pick .more {
  cursor: pointer;
  margin-bottom: 20px;
}
.theme-list li {
  line-height: 46px;
  text-align: left;
  padding: 0 24px;
  cursor: pointer;
}
.theme-list li .right-num {float: right;font-size: 12px;color: #9e9e9e;}
.theme-list li .right-num em {font-style: normal;}
.theme-list li:hover .check {border-color: #e74b3b;}
.theme-list li:hover .check:before {color: #fff4f0;}
.theme-list li:hover {background-color: #f7f7f7;}
.theme-list li.select {}
.theme-list li.select .check {background: #e74b3b;border-color: #e74b3b;}
.theme-list li .check {width: 16px;height: 16px;border-radius: 2px;border: solid 1px #e5e5e5;display: inline-block;color: #fff;text-align: center;line-height: 16px;font-size: 14px;font-weight: 300;margin-right: 12px;}

/*作品集列表*/
.cropper-container {
  position: absolute!important;
  top: 0px;
  z-index: 1000;
}
.collection-pick {
  max-height: 300px;
  overflow-y: scroll;
}
.collection-list {
  font-size: 0;
}
.collection-list li{
  width: 306px;
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 24px;
  vertical-align: top;
  transition: all .15s ease;
  -webkit-transition: all .15s ease;
  -moz-transition: all .15s ease;
  -ms-transition: all .15s ease;
  -o-transition: all .15s ease;
}
.collection-list li:hover {
  box-shadow: 0 4px 12px 0px rgba(0,0,0,.1);
}
.collection-list li:nth-child(3n+3) {
  margin-right: 0;
}
.collection-list li .cover-box {
  text-align: center;
}
.collection-list li img {
  width: 306px;
  height: 184px;
  display: block;
}
.collection-list li .border-top-1 {
  display: inline-block;
  width: 282px;
  height: 4px;
  background: #f0f0f0;
}
.collection-list li .border-top-2 {
  display: inline-block;
  width: 294px;
  height: 4px;
  background: #e5e5e5;
}

.collection-list li .info-box {
  padding: 16px;
  background-color: #fff;
  min-height: 95px;
}
.collection-list li .info-box h4 {
  font-size: 14px;
  font-weight: 600;
  color: #333333;
}
.collection-list li .info-box div {
  font-size: 12px;
  font-weight: 300;
  color: #999999;
  margin-top: 12px;
}

.collection-list li .info-box p {
    margin-top: 9px;
    font-size: 12px;
    color: #999999;
}

.collection-list li .info-box .data {
  margin-top: 12px;
  font-size: 12px;
  color: #999999;
}

.collection-list li .info-box .data span {
  margin-right: 20px;
}
.collection-list li .info-box .data i {
  color: #dddddd;
  margin-right: 8px;
}


/*作品集详情*/
.crumb-bar {
  margin-top: 100px;
  font-size: 20px;
  font-weight: 500;
  color: #9e9e9e;
}
.crumb-bar a {
  color: #333333;
}
.collection-detail {
  padding: 16px;
  background: #fff;
  margin-top: 20px;
  position: relative;
}
.collection-detail .face {
  width: 306px;
  height: 184px;
  float: left;
}
.collection-detail .info {
  margin-left: 326px;
}
.collection-detail .info h3 {
  margin-top: 8px;
  font-size: 20px;
  font-weight: 600;
  color: #2b2b2b;
}
.collection-detail .info .data {
  font-size: 12px;
  margin-top: 12px;
  color: #9e9e9e;
}
.collection-detail .info .data span {
  margin-right: 20px;
}
.collection-detail .info .data i {
  color: #dddddd;
  margin-right: 7px;
}
.collection-detail .info .desc {
  font-size: 14px;
  line-height: 1.57;
  margin-top: 12px;
  color: #9e9e9e;
}

.collection-detail .info .action {
  position: absolute;
  bottom: 20px;
  width: 594px;
  font-size: 14px;
}

.collection-detail .info .action .action-left {
  float: left;
  color: #2b2b2b;
  cursor: pointer;
  line-height: 33px;
}
.collection-detail .info .action .action-left i {
  margin: 0 12px;
  display: inline-block;
  width: 1px;
  height: 14px;
  background: #f0f0f0;
  vertical-align: middle;
}
.collection-detail .info .action .action-left div {
  display: inline-block;
}
.collection-detail .info .action .action-left div:hover {
  color: #666;
}
.collection-detail .info .action .action-right {
  float: right;
}
.collection-detail .info .action .action-right span {
  color: #e74b3b;
  display: inline-block;
  padding: 5px 16px;
  border-radius: 2px;
  border: solid 1px rgba(194, 51, 41, 0.2);
  background-color: #fff4f0;
  margin-left: 8px;
  font-weight: 500;
  cursor: pointer;
}
.collection-detail .info .action .action-right span:hover{
  background: #fce6de;
}
.collection-detail .info .action .action-right span:first-child {
  background: #e74b3b;
  color: #fff;
}
.collection-detail .info .action .action-right span:first-child:hover {background: #cf4334;}



/*个人页card右上角*/
.photo-operation {top: 16px;right: 16px;bottom: auto;}
.photo-edit-wrap {left: auto;right: 0;}
.photo-edit-box > div {line-height: 32px;padding: 0 12px;text-align: left;}
.photo-edit-box .arrow {left: auto;right: 9px;position: absolute;border: 5px solid rgba(0, 0, 0, 0);border-bottom: 6px solid #fff;top: -10px;transform: translateX(0%); -webkit-transform: translateX(0%); -moz-transform: translateX(0%);-ms-transform: translateX(0%);-o-transform: translateX(0%);}
.photo-edit-wrap {transform: translateX(0px) translateY(40px);}
.photo-edit-wrap.visible {transform: translateX(0px) translateY(0px);}

.border-btn-user {
  border: 1px solid rgba(153,153,153,.5);
  padding: 0 18px;
  height: 30px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  text-align: center;
  line-height: 30px;
  margin-left: 12px;
  display: inline-block;
  margin-top: 12px;
  margin-left: 48px;
  cursor: pointer;
}

.border-btn-user .vip-icon-img {
  width: 15px;
  height: 12px;
  background: url(https://oss-xpc0.xpccdn.com/Upload/edu/2019/08/165d5614ec517cc.png);
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
}
.border-btn-user:hover {
  background: #f0f0f0;
}
.beta,
.beta-changci,
.beta-new,
.beta-qiye,
.beta-video-tool {
  position: relative;
}

.resource-tag:after,
.beta:after,
.beta-changci:after,
.beta-new:after,
.beta-qiye:after,
.beta-video-tool:after {
  position: absolute;
  right: 30px;
  top: 16px;
  content: "BETA";
  width: 36px;
  height: 14px;
  line-height: 13px;
  border-radius: 1px;
  background-color: #e74b3b;
  font-size: 12px;
  color: #fff;
  text-align: center;
  transform: scale(.83);
}

.resource-tag:after {
  width: 52px;
  right: -16px;
  top: 10px;
  content: "正版低价";
}

.beta-qiye:after {
  top: 14px;
  line-height: 15px;
}

.beta-changci:after {
  top: 14px;
  right: 30px;
  content: "NEW";
  line-height: 15px;
}

.beta-new:after {
  right: 54px;
  top: 11px;
  content: "NEW";
}

.beta-video-tool:after{
  top: 14px;
  right: 8px;
  line-height: 15px;
}

.beta-stock,
.vip-stock {
	position: relative;
}


/* .beta-stock:after {
	position: absolute;
	top: 14px;
	right: 28px;
	content: "HOT";
	width: 40px;
	height: 15px;
	line-height: 15px;
	border-radius: 1px;
	background-color: #e74b3b;
	font-size: 12px;
	color: #fff;
	text-align: center;
	transform: scale(.83);
} */
.header-v2 .icon-resource-upload-black:before{
  position: absolute;
  left: -16px;
  content: url('/public/images/media-library-upload.svg');
  width: 16px;
  height: 16px;
  line-height: 16px;
}
.header-v2 .icon-resource-upload-black:hover:before{
  position: absolute;
  left: -16px;
  content: url('/public/images/media-library-upload-white.svg');
  width: 16px;
  height: 16px;
  line-height: 16px;
}
.icon-resource-upload-white:before{
  position: absolute;
  left: -16px;
  content: url('/public/images/media-library-upload-black.svg');
  width: 16px;
  height: 16px;
  line-height: 16px;
}
.icon-resource-upload-white:hover:before{
  position: absolute;
  left: -16px;
  content: url('/public/images/media-library-upload.svg');
  width: 16px;
  height: 16px;
  line-height: 16px;
}
.make-money-tag{
  position: relative;
}
.make-money-tag:after{
  position: absolute;
  right: 12px;
  top: 16px;
  content: "变现赚钱";
  width: 56px;
  height: 14px;
  line-height: 13px;
  border-radius: 1px;
  background-color: #e74b3b;
  font-size: 12px;
  color: #fff;
  text-align: center;
  transform: scale(.83);
}

.vip-stock .img {
  position: absolute;
  top: 14px;
  left: 90px;
  right: 28px;
  width: 24px;
  height: 14px;
}

.newContentHint {
  position: relative;
}
.newContentHint:after {
  position: absolute;
  right: 55px;
  top: 15px;
  content: "NEW";
  width: 36px;
  height: 14px;
  line-height: 13px;
  border-radius: 1px;
  background-color: #e74b3b;
  font-size: 12px;
  color: #fff;
  text-align: center;
  transform: scale(.83);
}

.newContentHintLocation {
  position: relative;
}
.newContentHintLocation:after {
  right: -26px;
  top: 10px;
  position: absolute;
  content: "NEW";
  width: 36px;
  height: 14px;
  line-height: 13px;
  border-radius: 1px;
  background-color: #e74b3b;
  font-size: 12px;
  color: #fff;
  text-align: center;
  transform: scale(.83);
}
public-also

.nav-item .beta:after {
  right: 84px;
  top: 14px;
}

.user-face .beta:after {
  right: 54px;
  top: 11px;
}

.publish-tab-title .publish-tab-list li.beta {
  padding-right: 56px;
}
.publish-tab-title .publish-tab-list li.beta:after {
  right: 21px;
  top: 12px;
}

.to-private-list.beta:after {
  right: -8px;
  top: -8px;
}

.hire.beta:after {
  right: -13px;
  top: 14px;
}

.share-switch .switch-body {
  margin: 0;
  padding: 0;
  color: rgba(0, 0, 0, 0.65);
  font-size: 14px;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  min-width: 44px;
  height: 22px;
  line-height: 20px;
  vertical-align: middle;
  background-color: rgba(0, 0, 0, 0.15);
  border: 1px solid transparent;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.36s;
  user-select: none;
}

.share-switch .switch-body.checked {
  background-color: #e74b3b;
}

.share-switch .switch-body.checked .switch-node {
  text-align: left;
  padding: 0 0 0 8px;
}

.share-switch .switch-body.checked .switch-node:after {
  background-color: white;
  left: 100%;
  margin-left: -1px;
  transform: translateX(-100%);
}

.share-switch .switch-body.disabled {
  cursor: default;
  background-color: rgba(0, 0, 0, 0.05);
}

.share-switch .switch-body.disabled:hover .award-con-wrap {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) translateX(-50%);
}

.share-switch .switch-body .award-con-wrap {
  color: #fffefe;
  line-height: 1.5;
  position: absolute;
  width: 130px;
  bottom: 22px;
  left: 50%;
  transform: translateY(5px) translateX(-50%);
  text-align: center;
  z-index: 1;
  padding-bottom: 15px;
  opacity: 0;
  visibility: hidden;
  transition: .3s ease;
}

.share-switch .switch-body .award-con-wrap .award-con {
  padding: 8px;
  background-color: #e74b3b;
  display: block;
  border-radius: 2px;
  font-size: 12px;
  color: #fff;
  font-weight: 300;
}

.share-switch .switch-body .award-con-wrap:after {
  content: "";
  position: absolute;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid #e74b3b;
  border-bottom: 8px solid transparent;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}

.share-switch .switch-body .switch-node {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  font-size: 12px;
  color: #fff;
  font-weight: 300;
  pointer-events: none;
  text-align: right;
  padding: 0 8px 0 0;
}

.share-switch .switch-body .switch-node:after {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 18px;
  height: 18px;
  background-color: rgba(255, 255, 255, 0.75);
  border-radius: 18px;
  cursor: pointer;
  transition: all 0.36s cubic-bezier(0.78, 0.14, 0.15, 0.86);
  content: ' ';
}

.private-ground {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 100000;
  display: none;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
}

.private-container {
  background: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 4px;
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.2);
  transform: translate(-50%, -50%);
  padding: 16px 0 20px;
}

.private-container .private-loading {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  cursor: default;
}

.private-container .private-title {
  border-bottom: 2px solid #f0f0f0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  color: rgba(0, 0, 0, 0.85);
  padding: 0 24px 15px;
}

.private-container .private-title .private-close {
  position: absolute;
  right: 20px;
  color: #595959;
  font-size: 12px;
  margin-top: 2px;
  cursor: pointer;
  font-weight: 600;
}

.private-container .private-content {
  position: relative;
  width: 418px;
  min-height: 40px;
  padding: 32px 32px 0;
}
.private-authority-tip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
}
.private-link-info {
  position: relative;
  margin-top: 24px
}
.private-authority-tip .title {
  color: #333;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}
.private-content .private-success {
  color: #333;
  font-size: 14px;
  font-weight: 500;
  padding-bottom: 12px;
  line-height: 1;
}
.private-authority-tip i {
  font-size: 12px;
  color: #999;
  line-height: 1;
}

.private-content .private-success img {
  width: 13px;
  vertical-align: middle;
  margin-right: 10px;
}

.private-content .private-con {
  position: relative;
}

.private-content .private-link, .private-authority {
  border: solid 1px #e5e5e5;
  width: 392px;
  overflow: hidden;
  color: #666;
  border-radius: 2px;
  margin-bottom: 24px;
  height: 40px;
  line-height: 40px;
  padding: 0 12px;
}

.private-authority {
  position: relative;
  cursor: pointer;
  user-select: none;
  overflow: initial;
}
.private-authority .private-authority-list {
  position: absolute;
  z-index: 1;
  top: 42px;
  left: 0;
  width: 100%;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
}
.private-authority p {
  display: flex;
  align-items: center;
}
.private-authority p img {
  width: 23px;
  padding-left: 4px;
}
.private-authority .private-authority-list li {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 12px;
  font-size: 14px;
  color: #595959;
  line-height: 40px;
  transition: .3s ease;
}
.private-authority .private-authority-list li img {
  width: 23px;
  padding-left: 4px;
}
.private-authority .private-authority-list li.seleted {
  color: #333;
}
.private-authority .private-authority-list li:hover {
  background-color: #f7f7f7;
}

.private-content .watermark{
  display: flex;
  align-items: end
}


.private-content .watermark_content{
  flex-grow: 1
}

.private-content .watermark_content.active{
  margin-bottom: 20px;
}

.private-content .watermark_content .title {
  color: #333;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  padding-bottom: 12px;
}

.private-content .watermark_content .watermark_form .watermark_status{
  display: flex;
  justify-content: flex-start;
  padding-bottom: 12px;
}
.private-content .watermark_content .watermark_form .watermark_status .radio-content{
  display: flex;
  justify-content: flex-start;
  align-items: center
}
.private-content .watermark_content .watermark_form .watermark_status .radio-icon{
  box-sizing: content-box;
  width: 14px;
  height: 14px;
  border:1px solid rgb(229, 229, 229) !important;
  border-radius: 50%;
  margin-right: 8px;
  position:relative
}
.private-content .watermark_content .watermark_form .watermark_status .radio-icon:after{
  content:'';
  display:inline-block;
  width: 6px;
  height: 6px;
  position:absolute;
  left:4px;
  top: 4px;
  background: white;
  border-radius: 3px;
}
.private-content .watermark_content .watermark_form .watermark_status .radio-icon.active{
  background: rgb(231, 75, 59)
}

.private-content .watermark_content .watermark_form .watermark_text input{
  box-sizing:border-box;
  height: 38px;
  padding: 8px 10px;
  border: 1px solid #E5E5E5;
  width: 100%;
  
}

.private-content .articlePic{
  width:160px;
  height:90px;
  margin-left: 20px;
  position:relative
}

.private-content .articlePic img{
  width:100%;
  height:100%;
}

.hide-radio-content{
  padding-top: 8px;
  display: flex;
  justify-content: flex-start;
  align-items: center
}

.hide-radio-content .hide-radio-icon{
  box-sizing: content-box;
  width: 14px;
  height: 14px;
  border:1px solid rgb(229, 229, 229) !important;
  border-radius: 25%;
  margin-right: 8px;
  position:relative
}

.hide-radio-content .hide-radio-icon:after{
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2022/07/0462c2ba7783962.png);
  background-size: 100%;
  content:'';
  background-repeat: no-repeat;
  display:inline-block;
  width: 7.5px;
  height: 6px;
  position:absolute;
  left:3px;
  top: 4px;
}

.hide-radio-content .hide-radio-icon.active{
  background: rgb(231, 75, 59)
}

.hide-radio-icon-img{
  /* width: 27px; */
  height: 14px;
  position: absolute;
  top: 228px;
  left: 130px;
}

.private-content .articlePic .water_preview{
  width:100%;
  height: 100%;
  position:absolute;
  top:0;
  left:0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  color: white;
}

.private-content .articlePic .system_water_preview{
  width:100%;
  height: 100%;
  position:absolute;
  top:0;
  left:0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  color: white;
  top: 17px;
  user-select: none;
  /* transform：scale(0.8333); */
  transform: scale(0.66);
}

.private-content .private-link-copy,.get-link-pwd {
  width: 100%;
  background: #e74b3b;
  text-align: center;
  color: #fff;
  cursor: pointer;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  font-size: 14px;
  height: 40px;
  line-height: 40px;
  font-weight: 500;
  margin: 32px 0 8px;
}

.private-content .zeroclipboard-is-hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.private-content .private-pwd {
  border: solid 1px #e5e5e5;
  width: 76px;
  overflow: hidden;
  color: #666;
  border-radius: 2px;
  margin-bottom: 12px;
  height: 40px;
  line-height: 40px;
  padding: 0 12px;
}

.private-content .private-pwd-tip {
  color: #333;
  font-size: 14px;
  font-weight: 500;
  padding-bottom: 12px;
  line-height: 1;
}

.private-content .private-notice {
  color: #878787;
  font-size: 12px;
  line-height: 1;
  text-align: center;
}

.private-content .copy-success {
  position: absolute;
  right: 0;
  top: 65px;
  color: #e74b3b;
  display: none;
}

.private-content input, .private-content span {
  display: block;
  height: 34px;
  line-height: 34px;
  color: #828795;
  font-size: 12px;
}

.private-cancel-content {
  padding: 20px 30px 0;
}

.private-cancel-content .cancel-private {
  font-size: 12px;
  color: #e74b3b;
  font-weight: 600;
  margin-right: 7px;
  cursor: pointer;
}

.private-cancel-content .cancel-private:hover {
  text-decoration: underline;
}

.private-cancel-content .cancel-private-tip {
  color: #666;
}

.switch-festival-activity {
  position: fixed; 
  left: 27px; 
  top: 49%; 
  width: 98px; 
  height: 110px; 
  background-image: url(https://oss-xpc0.xpccdn.com/Upload/edu/2022/09/276332663c158db.png); 
  background-size: cover; 
  z-index: 10002; 
  cursor: pointer;
}

.dialog-festival-activity {
  position: fixed; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  background-color: rgba(0,0,0,0.8);
  z-index: 10002; 
  display: flex; 
  justify-content: center; 
  align-items: center;
  transition: opacity 0.2s;
}

.dialog-festival-activity.not-show {
  opacity: 0;
  pointer-events: none;
}

.dialog-festival-activity .box-festival-activity {
  position: relative; 
  width: 530px; 
  box-sizing: border-box; 
  background-size: cover; 
  padding:0 69px; 
  z-index: 1;
}

.dialog-festival-activity .close {
  display: inline-block;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 15px;
  top: 15px;
  background-image: url(/public/images/circle-close.svg);
  background-size: cover;
  cursor: pointer;
}

.dialog-festival-activity .first-coupon-festival {
  position: relative; 
  margin-bottom: 42px;
}

.dialog-festival-activity .second-coupon-festival {
  position: relative;
}

.dialog-festival-activity .coupon-sign {
  position:absolute; 
  top: -30px; 
  left: 0;  
  border: 1px solid rgba(255, 255, 255, 0.3); 
  padding: 6px 10px 12px; 
  border-radius: 8px; 
  font-weight: 500; 
  font-size: 14px; 
  line-height: 20px; 
}

.dialog-festival-activity .coupon-box {
  position: relative;
  background: linear-gradient(94.34deg, #FFF4DC 0%, #F6D192 100%); 
  border-radius: 8px; 
  padding: 6px;
}

.dialog-festival-activity .coupon-content {
  height: 75px; 
  border: 1px solid rgba(156, 76, 2, 0.13); 
  border-radius: 6px; 
  display: flex; 
  justify-content: flex-start; 
  align-items: center;
  padding-right: 14px;
}

.dialog-festival-activity .coupon-sum {
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover;
  height: 56px;
  width: 97px;
}

.dialog-festival-activity .divided-line {
  display: inline-block; 
  height:39px; 
  border-right: 1px solid rgba(156, 76, 2, 0.2); 
  /* padding-left: 13px */
}

.dialog-festival-activity .coupon-name-limit {
  flex-grow: 1;
  display: flex; 
  flex-direction: column; 
  justify-content: center; 
  align-items: flex-start;
  padding-left: 12px;
  white-space: nowrap
}

.dialog-festival-activity .coupon-name {
  padding-bottom: 3px; 
  font-weight: 600;
  font-size: 18px; 
  line-height: 25px; 
  color: #ED3232;
}

.dialog-festival-activity .coupon-limit {
  font-weight: 400; 
  font-size: 12px; 
  line-height: 17px; 
  color: #A77F51;
}

.dialog-festival-activity .get-coupon-btn {
  position: relative;
  display: flex; 
  align-items: center; 
  font-weight: 600; 
  font-size: 16px; 
  color: #FDE3D5; 
  line-height: 22px;
  padding: 9px 7px 9px 13px; 
  background: linear-gradient(180deg, rgb(227, 81, 44) 0%, rgb(205, 49, 26) 100%); 
  border: 1px solid rgba(0, 0, 0, 0.06); 
  box-shadow: 0px 2px 2px rgba(156, 4, 4, 0.31);
  border-radius: 100px; 
  cursor: pointer;
  white-space: nowrap;
  z-index: 1;
}

.dialog-festival-activity .get-coupon-btn::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-image: linear-gradient(180deg, #F1623D 0%, #DE3F28 100%);;
  border: none; 
  border-radius: 100px; 
  opacity: 0;
  transition: opacity 300ms ease;
  z-index: -1;
}

.dialog-festival-activity .get-coupon-btn::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-image: linear-gradient(180deg, #D24521 0%, #C62C16 100%);
  border: none; 
  border-radius: 100px; 
  opacity: 0;
  transition: opacity 300ms ease;
  z-index: -1;
}

.dialog-festival-activity .get-coupon-btn:hover:before {
  opacity: 1;
}

.dialog-festival-activity .get-coupon-btn:active:after {
  opacity: 1;
}

.dialog-festival-activity .coupon-btn-toleft {
  display: inline-block; 
  width: 16px; 
  height: 16px; 
  background-image: url(/public/images/arrow-to-left2.svg); 
  background-size: cover;
}

.dialog-festival-activity .has-get-coupon {
  display: flex; 
  flex-direction: column; 
  justify-content: center; 
  align-items: center; 
  padding-left: 30px;
  white-space: nowrap
}

.dialog-festival-activity .has-get-coupon-top {
  padding-bottom: 3px; 
  font-weight: 600; 
  font-size: 18px; 
  line-height: 25px; 
  color: #A77F51;
}

.dialog-festival-activity .has-get-coupon-bottom {
  font-weight: 600; 
  font-size: 12px; 
  line-height: 17px; 
  color: #ED3232;
  text-decoration: underline;
  
}