@charset "UTF-8";
/* header fixed */
.header.fixed {position: fixed;width: 1200px;z-index: 999999;}
.header.fixed > .head-top-2 {display: none;}
.header.fixed + .page-content-wrapper {margin-top: 240px;}

/* common */
.ellipsis {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
.info-play-wrapper {position: relative;display: flex;align-items: center;justify-content: center;width:100%;height: calc(100% - 2px);background-repeat: no-repeat;background-size: contain;background-position: center;}
.layui-layer-tips {margin-top: -12px;}
.layui-layer-tips .layui-layer-content > span {display: inline-block;min-width: 60px;max-width: 200px;color: #999;text-align: justify;}

/* video wrapper */
.video-wrapper {border: 1px solid #D8D7DC;background: #fff;padding: 26px 30px;margin-bottom: 10px;clear: both;}

/* title */
.video-wrapper > .video-title {display: flex;margin-bottom: 15px;align-items: center;position: relative;}
.video-wrapper > .video-title > span {font-weight: bold;font-size: 19px;color: #666;line-height: 24px;}
.video-wrapper > .video-title > a {position: absolute;right: 0;color: #0182bb;font-size: 15px;}

/* content */
.video-wrapper > .video-content {}

/* SWIPER */
.video-wrapper > .video-content > .swiper-container {display: flex;justify-content: space-between;position: relative;width: auto;height: 327px;}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-cover {width: 100%;height: 100%;cursor: pointer;border-radius: 10px;background-repeat: no-repeat;background-size: cover;background-position: center;}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-cover > img {width: 100%;}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-info {position: absolute;bottom: 0;color: white;background: linear-gradient(transparent,rgba(0,0,0,.53) 72%,rgba(0,0,0,.61));width: 100%;border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-info > .description {display: -webkit-box;margin: 20px 9px 0;overflow: hidden;font-size: 16px;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-info > .count {margin: 0 9px 10px;font-size: 12px;display: flex}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-lack {width: 100%;height: 100%;cursor: pointer;border-radius: 10px;background-color: #F9F9F9;background-image: url("../../assets/icon-video-lack.png");background-repeat: no-repeat;background-size: contain;background-position-y: 85px;}
.video-wrapper > .video-content > .swiper-container .swiper-slide > .video-lack + .video-info > .description {margin: 4px 9px 25px;}
.video-wrapper > .video-content > .swiper-container .swiper-button-prev,
.video-wrapper > .video-content > .swiper-container .swiper-button-next {background: none;line-height: 30px;display: block;padding: 0;width: 30px;height: 30px;}
.video-wrapper > .video-content > .swiper-container .swiper-button-prev::after,
.video-wrapper > .video-content > .swiper-container .swiper-button-next::after {content: '';}

/* video list */
.video-wrapper .video-list > .video-item {display: flex;position: relative;height: 445px;margin-bottom: 30px;box-shadow: 1px 2px 4px 1px rgba(106, 106, 106, 0.2);}
.video-wrapper .video-list > .video-item.active {border: 1px solid #999;}
.video-wrapper .video-list > .video-item.active .info-play-wrapper {background-image: unset !important;}

/* video item */
.video-item > .item-background {position: absolute;left: 0;top: 0;right: 0;bottom: 0;opacity: 0.4;background-repeat: no-repeat;background-size: cover;background-position: center;filter: blur(10px) brightness(0.4)}
.video-item > .item-content {display: flex;align-items: center;position: absolute;left: 0;top: 0;right: 0;bottom: 0;}
.video-item > .item-content > .content-info {position: relative;display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;}
.video-item > .item-content > .content-comment {position: relative;display: none;width: 291px;height: 100%;background: #F2F2F2;font-size: 14px;box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.16);}
.video-item > .item-content > .content-comment > .video-comment-wrapper {padding: 10px;height: calc(100% - 10px);margin: 5px auto;overflow-y: auto;}
.video-item > .item-content > .content-info.comment {width: calc(100% - 291px);}
.video-item > .item-content > .content-info.comment + .content-comment {display: block;}
.video-item > .item-content > .content-info.comment + .content-comment > a {display: flex;position: absolute;width: 24px;height: 48px;top: calc(50% - 24px);left: -25px;cursor: pointer;background: url("../../assets/icon-video-comment-toggle-right.png") no-repeat;}

/* info title */
.info-title-wrapper {position: absolute;left: 0;bottom: 0;padding: 6px 10px;color: white;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.73) 72%, #000000 100%);width: 100%;z-index: 1;}
.info-title-wrapper > .description {margin: 10px 0;font-size: 18px;width: calc(100% - 70px);}
.info-title-wrapper > .update-time {margin-bottom: 30px;font-size: 12px;}

/* info function */
.info-func-wrapper {display: flex;justify-content: center;position: absolute;right: 32px;bottom: 105px;align-items: center;flex-direction: column;z-index: 2;}
.info-func-wrapper > p {display: flex;align-items: center;justify-content: center;flex-direction: column;margin: 20px 0 0;}
.info-func-wrapper > p:first-child {margin-top: unset;}
.info-func-wrapper > p > i {display: inline-block;width: 41px;height: 41px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.3);background-repeat: no-repeat;background-position: center;background-size: contain;cursor: pointer;}
.info-func-wrapper > p > i.disabled {opacity: 0.2;cursor: no-drop;background-image: url("../../assets/icon-video-like.png");}
.info-func-wrapper > p > i.icon-like {background-image: url("../../assets/icon-video-like.png");}
.info-func-wrapper > p > i.icon-like.liked {background-image: url("../../assets/icon-video-liked.png");background-size: auto;}
.info-func-wrapper > p > i.icon-comment {background-image: url("../../assets/icon-video-comment1.png");}
.info-func-wrapper > p > i.icon-forward {background-image: url("../../assets/icon-video-forward.png");}
.info-func-wrapper > p > i.icon-clear-screen {background-image: url("../../assets/icon-video-clear-screen.png");}
.info-func-wrapper > p > i.icon-exit-screen {background-image: url("../../assets/icon-video-exit-screen.png");}
.info-func-wrapper > p > span {text-align: center;color: white;font-size: 12px;margin-top: 7px;line-height: 15px;}

/* video play wrapper */
.video-play-wrapper {position: relative;margin: unset;width: 100%;height: 100%;}
.video-play-wrapper.play-video-error {background: url("../../mobile/images/icon/i_playVideo.png") no-repeat center/60px;opacity: 0.2;}
.video-play-wrapper > .video-js {background-color: unset;}
.video-play-wrapper > .video-js .vjs-control-bar {z-index: 2;}

/* video comment */
.leave-msg > span {font-size: 18px;font-weight: bold;color: #333;}
.leave-msg > span > i {font-style: normal;margin-left: 6px;}
.leave-msg .i-comment {float: right;display: block;width: 20px;height: 20px;background: url("../../assets/icon/icon_pinglun.png") center/16px no-repeat;opacity: 0.5;}

/* message box */
.msg-box {text-align: right;display: none;}
.msg-box > .box-wrapper {display: flex;align-items: center;flex-direction: column;padding: 6px 9px;border: 1px solid #c2c2c2;border-radius: 2px;margin: 9px auto;background: white;}
.msg-box > .box-wrapper > textarea {width: 100%;display: block;height: auto;text-align: left;outline: none;color: #333;background: white;border: 0;overflow: hidden;resize: none;line-height: 1.5;font-size: 12px;}
.msg-box > .box-wrapper > .box-func-wrapper {position: relative;display: flex;align-items: center;justify-content: flex-end;width: 100%;margin-top: 4px;}
.msg-box > .box-wrapper > .box-func-wrapper > span {font-size: 12px;color: #999;cursor: pointer;}
.msg-box > .box-wrapper > .box-func-wrapper > span.cancel {position: absolute;left: 0;}
.msg-box > .box-wrapper > .box-func-wrapper > span.personal {display: flex;align-items: center;}
.msg-box > .box-wrapper > .box-func-wrapper i.icon {margin-left: 10px;width: 16px;height: 16px;background-size: 14px 14px;background-repeat: no-repeat;background-position: center;}
.msg-box > .box-wrapper > .box-func-wrapper i.icon.icon-delete {background-image: url("../../assets/icon-comment-delete.png");background-size: 16px 16px;content: '';}
.msg-box > .box-wrapper > .box-func-wrapper i.icon.icon-delete:before {content: '';}
.msg-box > .box-wrapper > .box-func-wrapper i.icon.icon-submit {background-image: url("../../assets/icon-comment-submit.png");}
.msg-box > .box-wrapper > .box-func-wrapper i.icon.icon-check {width: 12px;height: 12px;background-image: url("../../assets/icon_login_choose_d.png");margin-right: 2px;background-size: contain;}
.msg-box > .box-wrapper > .box-func-wrapper i.icon.icon-check.checked {background-image: url("../../assets/icon_login_choose_s.png");}

/* no message */
.msg-none {position: relative;height: calc(100% - 22px);display: flex;align-items: center;justify-content: center;}
.msg-none > .none-tips {display: flex;flex-direction: column;align-items: center;}
.msg-none > .none-tips > span {margin-top: 10px;font-size: 16px;font-weight: 400;color: #C3C3C3;}

/* message list */
.msg-list {margin-top: 16px;overflow: hidden;}
.msg-list .action-wrapper {display: flex;align-items: center;}
.msg-list .action-wrapper .load-more,
.msg-list .action-wrapper .show-more {margin-right: 10px;font-size: 12px;font-family: Microsoft YaHei;font-weight: normal;color: #999;cursor: pointer;}
.msg-list .action-wrapper .load-more.loading,
.msg-list .action-wrapper .show-more.loading {padding-right: 18px;background: url("../../images/loading.gif") no-repeat right center/16px;}

/* reply wrapper */
.msg-list.reply-wrapper > .msg-list-box > .msg-info .right {width: calc(100% - 10px);margin-top: 2px;}
.msg-list.reply-wrapper > .msg-list-box > .msg-info .avatar {width: 26px;height: 26px;}
.msg-list.reply-wrapper > .msg-list-box > .msg-info .avatar > img {width: 26px;height: 26px;}

/* list box */
.msg-list .msg-list-box {margin-bottom: 16px;}
.msg-list .msg-list-box .target-anchor {background: #eee;border-radius: 3px;}
.msg-list .msg-list-box:last-child {margin-bottom: 0;}

/* info */
.msg-list .msg-list-box > .msg-info {display: flex;position: relative;}
.msg-list .msg-list-box > .msg-info .avatar {width: 32px;}
.msg-list .msg-list-box > .msg-info .avatar img {display: block;width: 32px;height: 32px;border-radius: 50%;}
.msg-list .msg-list-box > .msg-info .right {width: calc(100% - 35px);margin-left: 6px;margin-top: 6px;}
.msg-list .msg-list-box > .msg-info .right .body {display: flex;position: relative;flex-direction: column;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header {display: flex;align-items: center;line-height: 0}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .nickname {max-width: 120px;text-align: justify;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .nickname > span {line-height: 20px;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .nickname > span.nick {color: #5092FF;font-size: 12px;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .nickname > span.fa.fa-lock {color: #FB8E76;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .nickname > span.anchor {color: #1ECC94;cursor: pointer;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .time {margin-left: 20px;color: #999;font-size: 10px;text-align: center;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .func {margin-left: 6px;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .func > a {float: left;width: 20px;height: 20px;color: #5092FF;margin: 0 2px 0  10px}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .func > a.i-comment {background: url("../../assets/icon/icon_pinglun.png") center/14px no-repeat;opacity: 0.5;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .func > a.i-delete {background: url("../../assets/delete_blue.png") center/12px no-repeat;}
.msg-list .msg-list-box > .msg-info .right .body > .info-header > .func > a.i-edit {background: url("../../assets/icon/icon_bianji.png") center/12px no-repeat;}
.msg-list .msg-list-box > .msg-info .right .body > .info-content {margin-top: 7px;color: #333;}
.msg-list .msg-list-box > .msg-info .right hr {margin-top: 10px;}

/* fold */
.msg-list .msg-list-box.fold .msg-list.reply-wrapper > .msg-list-box {display: none;}
.msg-list .msg-list-box.fold .msg-list.reply-wrapper > .msg-list-box:first-child {display: block;}

/* share to wrapper */
.video-shareto-wrapper {display: none;position: absolute;right: 95px;bottom: 120px;background: rgba(249, 241, 241, 0.5);border-radius: 15px 13px 11px 15px;z-index: 2;}
.video-shareto-wrapper.active {display: flex;}
.video-shareto-wrapper::after {position: absolute;right: -31px;top: 12px;border-style: solid;border-width: 15px 11px 15px 20px;border-color: transparent transparent transparent rgba(249, 241, 241, 0.5);content: "";}
.video-shareto-wrapper > .shareto-items {display: flex;align-items: center;padding: 13px 0;justify-content: space-around;margin: 0 5px;}
.video-shareto-wrapper > .shareto-items > .item {width: 40px;display: flex;align-items: center;justify-content: space-around;margin: 0 4px;}
.video-shareto-wrapper > .shareto-items > .share-qrcode {display: none;position: absolute;width: 170px;height: 200px;left: -70px;top: -210px;border: 1px solid white;background: white;padding: 30px;box-shadow: 0px 0px 4px 4px rgba(0, 0, 0, 0.1);border-radius: 4px;}
.video-shareto-wrapper > .shareto-items > .share-qrcode::after {position: absolute;left: 77px;top: 199px;border-style: solid;border-width: 8px 8px 8px 8px;border-color: white transparent transparent transparent;content: "";}
.video-shareto-wrapper > .shareto-items > .share-qrcode > .qrcode {width: 110px;}
.video-shareto-wrapper > .shareto-items > .share-qrcode > .tip {font-size: 12px;color: #754723;text-align: center;line-height: 14px;}
.video-shareto-wrapper > .shareto-items > .share-qrcode > .hide-qrcode {width: 11px;height: 11px;position: absolute;top: 10px;right: 10px;cursor: pointer;}

/* video grid wrapper adjust (2025-01-15 Jack) */
.video-grid-wrapper {display: block;}
.video-grid-wrapper > .video-list {display: block;}
.video-grid-wrapper > .video-list > .video-item {display: inline-flex;position: relative;width: calc(33.33333% - 14px);margin: 0 7px 14px 7px;box-shadow: 1px 2px 4px 1px rgba(106, 106, 106, 0.2);border-radius: 4px;aspect-ratio: 3 / 5;height: auto;}
.video-grid-wrapper > .video-list > .video-item > .item-background {opacity: 1;/*height: calc(100% - 43px)*/;border-top-left-radius: 4px;border-top-right-radius: 4px;aspect-ratio: 3 / 4;}
.video-grid-wrapper > .video-list > .video-item > .item-info-wrapper {display: block;position: absolute;bottom: 1px;width: 100%;line-height: 22px}
.video-grid-wrapper > .video-list > .video-item > .item-info-wrapper > .time-duration {display: flex;align-items: center;justify-content: space-between;font-size: 12px;color: white;text-shadow: 0 0;padding: 0 6px;background: linear-gradient( 180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.57) 100%);}
.video-grid-wrapper > .video-list > .video-item > .item-info-wrapper > .desc-size {background: white;margin:0;padding: 4px 5px 0;}
.video-grid-wrapper > .video-detail {display: none;position: fixed;left: 0;top: 0;right: 0;bottom: 0;background: black;z-index: 9999999;}
.video-grid-wrapper > .video-detail.active {display: block;}
.video-grid-wrapper > .video-detail.active > .video-shareto-wrapper {bottom: 180px;right: 78px;}

 .ui-mobile .video-item > .item-background {position: absolute;left: 0;top: 0;right: 0;bottom: 0;opacity: 0.4;background-repeat: no-repeat;background-size: cover;background-position: center;filter: none}

/* UI Mobile adjust (2025-01-15 Jack) */
.ui-mobile .video-detail * {text-shadow: 0 0;}
.ui-mobile .video-detail .video-item {width: 100%;height: 100%;}
.ui-mobile .video-detail .video-item > .close-detail {position: absolute;left: 10px;top: 10px;z-index: 9;width: 20px;height: 30px;cursor: pointer;display: flex;align-items: center;justify-content: center;}
.ui-mobile .video-detail .video-item > .close-detail > i {font-size: 30px;color: white;}
.ui-mobile .video-detail .video-item > .item-content > .content-info {width: 100%;}
.ui-mobile .video-detail .video-item > .item-content > .content-info.comment + .content-comment {position: absolute;left: 0;bottom: 0;width: 100%;height: 400px;z-index: 9;border-radius: 18px 18px 0 0}
.ui-mobile .video-detail .video-item > .item-content > .content-info.comment + .content-comment > a {top: 0;left: calc(50% - 24px);width: 48px;height: 24px;z-index: 9;background: url("../../assets/icon-video-comment-toggle-down.png") center/48px no-repeat;}
.ui-mobile .video-detail .video-item > .item-content > .content-info > .info-play-wrapper {background-size: cover;}
.ui-mobile .video-detail .video-item > .item-content > .content-info > .info-title-wrapper {padding-bottom: 30px;}
.ui-mobile .video-detail .video-item > .item-content > .content-info > .info-title-wrapper > .description {margin: 10px;width: calc(100% - 100px);text-align: justify;}

/* 手机版调整（子域名首页）(2024-12-30 Jack) */
.ui-mobile .video-wrapper {margin: 10px 0 -10px 0;padding: unset;border: 0;}
.ui-mobile .video-wrapper > .video-title {margin: 0 20px 5px;}
.ui-mobile .video-wrapper > .video-title > span {color: #000;font-size: 18px;font-weight: 500;}
.ui-mobile .video-wrapper > .video-title > a {font-weight: 500;cursor: pointer;}
.ui-mobile .video-wrapper .swiper-container {height: 250px;margin: 0 7px;}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-item {display: inline-flex;position: relative;width: calc(100% - 2px);box-shadow: 1px 2px 4px 1px rgba(106, 106, 106, 0.2);border-radius: 4px 4px 0 0;;aspect-ratio: 3 / 4;margin-left: 1px;background-size: cover;background-position: center;background-repeat: no-repeat;bottom: -6px}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-info {background: white;width: 100%;position: absolute;bottom: auto;padding:4px 6px 0px 6px;;box-shadow: 1px 2px 4px 1px rgba(106, 106, 106, 0.2);line-height: 21px}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-info > .description {display: -webkit-box;overflow: hidden;margin: 0;color: #333;-webkit-box-orient: vertical;-webkit-line-clamp: 1;}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-info > .count {color: #999;font-size: 14px;margin:0;display: flex}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-lack {display: inline-flex;position: relative;width: calc(100% - 4px);box-shadow: 1px 2px 4px 1px rgba(106, 106, 106, 0.2);border-radius: 4px;aspect-ratio: 3 / 5;margin-bottom: 4px;margin-left: 1px;background-image: url("../../assets/icon-video-lack.png");background-size: contain;background-repeat: no-repeat;background-position-y: 55px;background-color: #F9F9F9;}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-lack > .video-info {background: white;width: 100%;position: absolute;bottom: 0;padding: 4px 6px;height: 56px;}
.ui-mobile .video-wrapper .swiper-container .swiper-slide > .video-lack > .video-info > .description {display: -webkit-box;overflow: hidden;margin: 0 0 25px;color: #333;-webkit-box-orient: vertical;-webkit-line-clamp: 1;}
.ui-mobile .video-wrapper .swiper-container .swiper-button-prev,
.ui-mobile .video-wrapper .swiper-container .swiper-button-next {top: calc(50% - 15px);}
.ui-mobile .video-wrapper .swiper-container .swiper-button-prev::after,
.ui-mobile .video-wrapper .swiper-container .swiper-button-next::after {content: '';}
.ui-mobile .video-wrapper .swiper-container .swiper-button-prev.swiper-button-disabled,
.ui-mobile .video-wrapper .swiper-container .swiper-button-next.swiper-button-disabled {display: none;}

/* adjust (2025-02-17 Jack) */
.ui-mobile .info-func-wrapper {right: 20px;}

/* share to adjust (2025-02-25 Jack) */
.ui-mobile .video-grid-wrapper > .video-detail > .video-shareto-wrapper {flex-flow: column;width: 100%;bottom: 0;right: 0;border-radius: 0;border-top-left-radius: 3px;border-top-right-radius: 3px;background: white;}
.ui-mobile .video-grid-wrapper > .video-detail > .video-shareto-wrapper > .shareto-items {width: 100%;height: 130px;justify-content: space-around;}
.ui-mobile .video-grid-wrapper > .video-detail > .video-shareto-wrapper > .shareto-items > .item {display: flex;flex-flow: column;align-items: center;line-height: 30px;font-size: 12px;margin: auto;width: auto;height: auto;}
.ui-mobile .video-grid-wrapper > .video-detail > .video-shareto-wrapper > .shareto-items > .item > img {width: 40px;height: 40px;}
.ui-mobile .video-grid-wrapper > .video-detail > .video-shareto-wrapper > .shareto-cancel {display: flex;align-items: center;justify-content: center;height: 60px;border-top: 1px solid #dedede;cursor: pointer;}

.ui-mobile .video-shareto-wrapper .share-qrcode {width: 300px;height: 180px;top: -190px;z-index: 1;}
.ui-mobile .video-shareto-wrapper .share-qrcode .tip {font-size: 13px;color: #754723;text-align: justify;width: 130px;position: absolute;right: 15px;top: 28px;letter-spacing: 3px;}
.copy-link {position: absolute;right: 40px;top: 109px;color: #80d1b1;border: 0;height: 30px;width: 90px;background: #fff;box-shadow: 0px 0px 3px 1px rgba(1, 1, 1, .28);border-radius: 6px;}
.ui-mobile .video-shareto-wrapper > .shareto-items > .share-qrcode::after {position: absolute;left: 77px;top: 179px;border-style: solid;border-width: 8px 8px 8px 8px;border-color: white transparent transparent transparent;content: "";}
