@charset "utf-8"; /*全局样式*/ body{padding: 0;margin: 0;background-color: #fff;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;-webkit-font-smoothing: antialiased;color: #333;} div,img,ul,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,p{padding: 0;margin: 0;border: 0;} ul{list-style: none;} a{text-decoration: none;color: #333;} i,em{font-style: normal;} img{display: inline-block;vertical-align: top;max-width: 100%;height: auto;} /*去掉 input 默认边框*/ input{padding: 0;border: 0;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;color: #333;} input[type="submit"]{cursor: pointer;} /*去掉 textarea 默认边框*/ textarea{padding: 0;border: 0;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;color: #333;} /*去掉 button 默认边框*/ button{border: 0;padding: 0;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;color: #333;cursor: pointer;} /*清除浮动*/ .clearfix:after{content: '';display: table;clear: both;} .clearfix{*zoom: 1;/*IE6识别*/} /*解决chrome浏览器 input,textarea 获得焦点时会有一个边框的问题*/ input,textarea{outline: none;} /*清除ios端 input,textarea 默认内阴影 默认圆角,radio和checkbox需要还原值为radio和checkbox*/ input,textarea{appearance: none;-webkit-appearance: none;border-radius: 0;} /*自定义 input,textarea 的placeholder文字样式*/ input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color: #aaa;} /*滚动条*/ body *::-webkit-scrollbar{width: 4px;height: 4px;background: #eee;border-radius: 2px;} body *::-webkit-scrollbar-thumb{background: #aaa;border-radius: 2px;} /*常用宽度*/ .w1840{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1840px;} .w1500{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1500px;} .w1440{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1440px;} .w1400{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1400px;} .w1366{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1366px;} .w1340{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1340px;} .w1300{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1300px;} .w1280{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1280px;} .w1200{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1200px;} .w1140{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1140px;} .w1100{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1100px;} .w1000{position: relative;width: 94%;margin: 0 auto;height: 100%;max-width: 1000px;} /*视频中心页*/ .video-center-page{} .video-center-page .common-title{} .video-center-page .common-title .name{position: relative;display: inline-block;vertical-align: top;padding-left: 30px;font-size: 30px;line-height: 40px;} .video-center-page .common-title .name:before{content: '';position: absolute;left: 0;top: 50%;width: 14px;height: 14px;background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDI5OURDIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxjaXJjbGUgY3g9IjIuNSIgY3k9IjIuNSIgcj0iMi41Ii8+PGNpcmNsZSBjeD0iMi41IiBjeT0iMTEuNSIgcj0iMi41Ii8+PGNpcmNsZSBjeD0iMTEuNSIgY3k9IjIuNSIgcj0iMi41Ii8+PGNpcmNsZSBjeD0iMTEuNSIgY3k9IjExLjUiIHI9IjIuNSIvPjwvZz48L3N2Zz4=');background-size: 100% 100%;transform: translateY(-50%);} .video-center-page .search-wrap{position: relative;display: inline-block;vertical-align: top;box-sizing: border-box;width: 280px;padding-right: 60px;background-color: #fff;border: 1px solid #E4E4E4;} .video-center-page .search-wrap .text-input{box-sizing: border-box;width: 100%;height: 40px;padding: 0 1em;} .video-center-page .search-wrap .sub-btn{position: absolute;right: 0;top: 0;width: 60px;height: 40px;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNi42NjMgMEMyLjk5IDAgMCAyLjk5IDAgNi42NjNjMCAzLjY3MSAyLjk5IDYuNjYyIDYuNjYzIDYuNjYyYTYuNjI3IDYuNjI3IDAgMCAwIDQuMjEyLTEuNTA4bDMuOTc4IDMuOTc4YS42NjYuNjY2IDAgMSAwIC45NDItLjk0MmwtMy45NzgtMy45NzhhNi42MjcgNi42MjcgMCAwIDAgMS41MDgtNC4yMTJDMTMuMzI1IDIuOTkgMTAuMzM1IDAgNi42NjMgMHptMCAxLjMzM2E1LjMyIDUuMzIgMCAwIDEgNS4zMyA1LjMzIDUuMzIgNS4zMiAwIDAgMS01LjMzIDUuMzMgNS4zMiA1LjMyIDAgMCAxLTUuMzMtNS4zMyA1LjMyIDUuMzIgMCAwIDEgNS4zMy01LjMzeiIgZmlsbD0iIzAwOUFEQyIgZmlsbC1ydWxlPSJub256ZXJvIi8+PC9zdmc+') center no-repeat;background-size: 16px 16px;filter: brightness(0) invert(.5);} .video-center-page .search-wrap .sub-btn:hover{filter: none;} .video-center-page .btns-area{margin-top: 40px;} .video-center-page .btns-area .btn{margin: 0;font-size: 14px;} /*布局*/ .video-center-page .part1{padding: 30px 0 35px;background: #fff url(../images/video_center_page_part_bg1.jpg) center no-repeat;background-size: cover;} .video-center-page .part1 .common-title{display: flex;justify-content: space-between;} .video-center-page .part2{padding: 30px 0 90px;background-color: #F6F6F6;} /*分类区*/ .classify-area{margin-top: 30px;} .classify-area .section{display: flex;justify-content: space-between;margin-top: 15px;border: 1px solid #E4E4E4;} .classify-area .section .name{flex: 0 0 110px;box-sizing: border-box;padding: 24px 0;background-color: #F6F6F6;border-right: 1px solid #E4E4E4;text-align: center;} .classify-area .section .list{flex: 1 1 100%;box-sizing: border-box;padding: 10px 25px;background-color: #fff;} .classify-area .section .list li{display: inline-block;vertical-align: top;margin: 1em 1.5em 1em 0;border-right: 1px solid #E4E4E4;} .classify-area .section .list li a{position: relative;display: block;padding: 0 1.5em 0 2em;line-height: 14px;transition: 0.3s;} .classify-area .section .list li a:before{content: '';position: absolute;left: 0;top: 1px;width: 1px;width: 10px;height: 10px;border: 1px solid #DADADA;transition: 0.5s;} .classify-area .section .list li a:after{content: '';position: absolute;left: 4px;top: 5px;width: 4px;height: 4px;background-color: #009ADC;transform: scale(0);transition: 0.5s;} .classify-area .section .list li:hover a{color: #009ADC;} .classify-area .section .list li.on a{color: #009ADC;} .classify-area .section .list li.on a:before{border-color: #009ADC;animation: dotScale 0.3s;} .classify-area .section .list li.on a:after{transform: scale(1);} @keyframes dotScale{ 0%{transform: scale(0);} 100%{transform: scale(1);} } /*结果提示区*/ .result-tips-wrap{display: flex;justify-content: space-between;margin-bottom: 30px;} .result-tips-wrap .tip{white-space: nowrap;line-height: 34px;} .result-tips-wrap .tip i{margin: 0 .5em;color: #009ADC;} .result-tips-wrap .selected-wrap{flex: 1 1 100%;margin: 0 25px;} .result-tips-wrap .selected-wrap .item{position: relative;display: inline-block;vertical-align: top;padding: 0 2.5em 0 1em;margin: 0 .5em .5em 0;background-color: #fff;border: 1px solid #E4E4E4;line-height: 32px;color: #666;cursor: pointer;transition: 0.3s;} .result-tips-wrap .selected-wrap .item:after{content: '';position: absolute;right: 1em;top: 50%;width: 10px;height: 10px;margin-top: -5px;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxMCAxMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOS4zMDIuMjcyQS40MTcuNDE3IDAgMCAwIDkuMDEuNEw1IDQuNDEuOTg5LjRhLjQxNy40MTcgMCAxIDAtLjU5LjU4OUw0LjQxMiA1IC40IDkuMDExYS40MTcuNDE3IDAgMSAwIC41ODkuNTlMNSA1LjU4OCA5LjAxMSA5LjZhLjQxNy40MTcgMCAxIDAgLjU5LS41ODlMNS41ODggNSA5LjYuOTg5YS40MTcuNDE3IDAgMCAwLS4yOTgtLjcxN3oiIGZpbGw9IiMwMDlBREMiIGZpbGwtcnVsZT0ibm9uemVybyIvPjwvc3ZnPg==');background-size: 100% 100%;filter: brightness(0) invert(.5);} .result-tips-wrap .selected-wrap .item:hover{border-color: #009ADC;} .result-tips-wrap .selected-wrap .item:hover:after{filter: none;} .result-tips-wrap .other-btns{white-space: nowrap;} .result-tips-wrap .other-btns .btn{display: inline-block;vertical-align: top;box-sizing: border-box;height: 34px;padding: 0 1.2em;background-color: transparent;border: 1px solid #E4E4E4;border-radius: 17px;font-size: 14px;line-height: 32px;cursor: pointer;user-select: none;transition: 0.3s;} .result-tips-wrap .other-btns .select{padding-right: 3em;appearance: none;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEyIDciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTExLjA3My4xNjRMNiA1LjIzNi45MjcuMTY0YS41MjcuNTI3IDAgMCAwLS43NjMgMCAuNTI3LjUyNyAwIDAgMCAwIC43NjNsNS40NTQgNS40NTVjLjExLjEwOS4yNTUuMTYzLjM4Mi4xNjNhLjU1NC41NTQgMCAwIDAgLjM4Mi0uMTYzTDExLjgzNi45MjdhLjUyNy41MjcgMCAwIDAgMC0uNzYzLjUyNy41MjcgMCAwIDAtLjc2MyAweiIgZmlsbD0iIzQ0NEI1NCIgZmlsbC1ydWxlPSJub256ZXJvIi8+PC9zdmc+') right 1em center no-repeat;background-size: 12px 12px;outline: none;} .result-tips-wrap .other-btns .btn:hover{border-color: #009ADC;color: #009ADC;} /*视频列表*/ .video-list{overflow: hidden;} .video-list li{float: left;width: 31%;margin: 0 0 3% 3.5%;border-radius: 4px;overflow: hidden;cursor: pointer;} .video-list li:nth-child(3n+1){margin-left: 0;} .video-list li .pic{overflow: hidden;} .video-list li .pic em{display: block;padding-top: 60.5%;background-position: center;background-size: cover;background-repeat: no-repeat;transition: 0.8s;} .video-list li .info{position: relative;padding: 24px;background-color: #fff;} .video-list li .info .tit{height: 44px;font-size: 16px;line-height: 22px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;transition: 0.3s;} .video-list li .info .date{position: relative;padding-left: 25px;margin-top: 20px;line-height: 20px;color: #AEAEAE;} .video-list li .info .date:before{content: '';position: absolute;left: 0;top: 2px;width: 16px;height: 16px;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNCAxNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMy4wNDMgMGEuNjEzLjYxMyAwIDAgMC0uNjA4LjYwOXYuNjA4SC42MDlhLjYxNC42MTQgMCAwIDAtLjQzNS4xNzQuNjE0LjYxNCAwIDAgMC0uMTc0LjQzNVYxNGMwIC4xNi4wNTguMzIxLjE3NC40MzZhLjYxOC42MTggMCAwIDAgLjQzNS4xNzNIMTMuMzljLjE2IDAgLjMyMS0uMDU5LjQzNy0uMTczQS42MjMuNjIzIDAgMCAwIDE0IDE0VjEuODI2YS42MTguNjE4IDAgMCAwLS4xNzItLjQzNS42MTkuNjE5IDAgMCAwLS40MzctLjE3NGgtMS44MjZWLjYxQS42MTMuNjEzIDAgMCAwIDEwLjk1NyAwaC0uNjFhLjYxMy42MTMgMCAwIDAtLjYwOC42MDl2LjYwOEg0LjI2MVYuNjFBLjYxMy42MTMgMCAwIDAgMy42NTIgMGgtLjYwOXptMCAuNjA5aC42MXYxLjgyNmgtLjYxVi42MDl6bTcuMzA1IDBoLjYwOXYxLjgyNmgtLjYxVi42MDl6TS42MDggMS44MjZoMS44Mjd2LjYwOWMwIC4zMzMuMjc2LjYwOC42MDguNjA4aC42MWEuNjEzLjYxMyAwIDAgMCAuNjA4LS42MDh2LS42MDloNS40Nzh2LjYwOWMwIC4zMzMuMjc2LjYwOC42MDkuNjA4aC42MDlhLjYxMy42MTMgMCAwIDAgLjYwOC0uNjA4di0uNjA5aDEuODI2djIuMTNILjYxdi0yLjEzem0wIDIuNzRoMTIuNzgzVjE0SC42MVY0LjU2NXptNy45NyA0LjI2YS42Ny42NyAwIDAgMC0uNjY1LjY2NnYyLjMyYS42Ny42NyAwIDAgMCAuNjY2LjY2NmgyLjMyYS42Ny42NyAwIDAgMCAuNjY2LS42NjVWOS40OTJhLjY3LjY3IDAgMCAwLS42NjYtLjY2Nkg4LjU4em0wIC42MDlIMTAuOWMuMDM2IDAgLjA1OC4wMjEuMDU4LjA1N3YyLjMyYzAgLjAzNS0uMDIyLjA1OC0uMDU4LjA1OEg4LjU4Yy0uMDM1IDAtLjA1Ny0uMDIzLS4wNTctLjA1N1Y5LjQ5MmMwLS4wMzYuMDIyLS4wNTcuMDU3LS4wNTd6IiBmaWxsPSIjQUVBRUFFIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48L3N2Zz4=');background-size: 100% 100%;} .video-list li .info .collect-btn{position: absolute;right: 90px;bottom: 24px;padding-left: 20px;line-height: 20px;color: #AEAEAE;transition: 0.3s;} .video-list li .info .collect-btn:before{content: '';position: absolute;left: 0;top: 2px;width: 16px;height: 16px;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCA0OCA0OCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLW9wYWNpdHk9Ii4wMSIgZD0iTTAgMGg0OHY0OEgweiIvPjxwYXRoIGQ9Ik0yMy45OTkgNWwtNi4xMTMgMTIuNDc4TDQgMTkuNDlsMTAuMDU5IDkuODM0TDExLjY1NCA0MyAyNCAzNi40MiAzNi4zNDUgNDMgMzMuOTYgMjkuMzI1IDQ0IDE5LjQ5MWwtMTMuODA5LTIuMDEzTDI0IDV6IiBzdHJva2U9IiMzMzMiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==');background-size: 100% 100%;} .video-list li .info .collect-btn:hover{color: #009ADC;} .video-list li .info .collect-btn.done:before{background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTAgLjVMNi45NDIgNi43MzkgMCA3Ljc0NWw1LjAzIDQuOTE3TDMuODI2IDE5LjUgMTAgMTYuMjFsNi4xNzIgMy4yOS0xLjE5Mi02LjgzOEwyMCA3Ljc0NSAxMy4wOTUgNi43NCAxMCAuNXoiIGZpbGw9IiNGNEM3NDciIHN0cm9rZT0iI0Y0Qzc0NyIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+');background-size: 100% 100%;} .video-list li .info .download-btn{position: absolute;right: 24px;bottom: 24px;padding-left: 20px;line-height: 20px;color: #AEAEAE;transition: 0.3s;} .video-list li .info .download-btn:before{content: '';position: absolute;left: 0;top: 2px;width: 16px;height: 16px;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCA0OCA0OCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLW9wYWNpdHk9Ii4wMSIgZD0iTTAgMGg0OHY0OEgweiIvPjxwYXRoIGQ9Ik02IDI0LjAwOFY0MmgzNlYyNCIgc3Ryb2tlPSIjMzMzIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjxwYXRoIGQ9Ik0zMyAyM2wtOSA5LTktOU0yMy45OTIgNnYyNiIgc3Ryb2tlPSIjMzMzIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==');background-size: 100% 100%;} .video-list li .info .download-btn:hover{color: #009ADC;} .video-list li .info .lock-btn{position: absolute;right: 24px;bottom: 24px;padding-left: 20px;line-height: 20px;color: #AEAEAE;transition: 0.3s;} .video-list li .info .lock-btn:before{content: '';position: absolute;left: 0;top: 2px;width: 16px;height: 16px;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCA0OCA0OCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSIjZmZmIiBmaWxsLW9wYWNpdHk9Ii4wMSIgZD0iTTAgMGg0OHY0OEgweiIvPjxyZWN0IHg9IjYiIHk9IjIyIiB3aWR0aD0iMzYiIGhlaWdodD0iMjIiIHJ4PSIyIiBzdHJva2U9IiMzMzMiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjxwYXRoIGQ9Ik0xNCAyMnYtOGMwLTUuNTIzIDQuNDc3LTEwIDEwLTEwczEwIDQuNDc3IDEwIDEwdjhNMjQgMzB2NiIgc3Ryb2tlPSIjMzMzIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==');background-size: 100% 100%;} .video-list li:hover .pic em{transform: scale(1.05);} .video-list li:hover .info .tit{color: #009ADC;} /*黑色遮罩层*/ .black-layer{display: none;z-index: 10;position: fixed;left: 0;right: 0;top: 0;bottom: 0;background-color: rgba(0,0,0,.8);} /*弹窗-视频*/ .popup-video{display: none;z-index: 11;position: fixed;left: 50%;top: 50%;width: 90%;max-width: 1000px;transform: translate(-50%,-50%);} .popup-video .close-btn{z-index: 1;position: absolute;right: 0;top: 0;width: 40px;height: 40px;background-color: #0091db;font-size: 40px;text-align: center;line-height: 32px;color: #fff;cursor: pointer;} .popup-video video{width: 100%;} .video-js{position: static;width: 100%;height: auto;padding-top: 56.3%;} .video-js .vjs-big-play-button{display: none;} /*手机-分类区*/ .phone-classify-area{display: none;} /*手机-排序方式*/ .phone-rank-way{display: none;} /*搜索结果为空时的提示*/ .empty-tips{padding: 40px 0;} .empty-tips .tit1{line-height: 20px;text-align: center;} .empty-tips .tit1 span{color: #d20808;} .empty-tips .tit2{position: relative;padding-left: 25px;margin-top: 20px;line-height: 20px;} .empty-tips .tit2 .icon{position: absolute;left: 0;top: 0;width: 20px;height: 20px;} .empty-tips .list{margin-top: 20px;} .empty-tips .list li{position: relative;padding-left: 20px;margin-bottom: 15px;font-size: 15px;line-height: 20px;color: #666;} .empty-tips .list li:before{content: "";position: absolute;left: 5px;top: 7px;width: 6px;height: 6px;background-color: #999;border-radius: 50%;} .empty-tips .list li a{color: #009adc;} /*中屏PC:<=1440px(针对1366*650)*/ @media screen and (max-width: 1440px){ } /*小屏PC:>=1025px && <=1280px*/ @media screen and (max-width: 1280px){ } /*pad横屏:1024px*/ @media screen and (max-width: 1024px){ } /*phone:<=768px*/ @media screen and (max-width: 768px){ /*视频中心页*/ .video-center-page .part1{padding: 20px 0;background-image: none;} .video-center-page .part1 .common-title .name{display: none;} .video-center-page .part1 .search-wrap{width: 100%;} .video-center-page .part2{padding: 20px 0;} /*分类区*/ .classify-area{position: relative;display: flex;justify-content: space-between;} .classify-area .section{display: block;width: 50%;margin-top: 0;} .classify-area .section .name{position: relative;padding: 10px 0;border-right: 0;} .classify-area .section .name:after{content: "";display: inline-block;vertical-align: middle;width: 12px;height: 12px;margin-left: .4em;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEyIDciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTExLjA3My4xNjRMNiA1LjIzNi45MjcuMTY0YS41MjcuNTI3IDAgMCAwLS43NjMgMCAuNTI3LjUyNyAwIDAgMCAwIC43NjNsNS40NTQgNS40NTVjLjExLjEwOS4yNTUuMTYzLjM4Mi4xNjNhLjU1NC41NTQgMCAwIDAgLjM4Mi0uMTYzTDExLjgzNi45MjdhLjUyNy41MjcgMCAwIDAgMC0uNzYzLjUyNy41MjcgMCAwIDAtLjc2MyAweiIgZmlsbD0iIzQ0NEI1NCIgZmlsbC1ydWxlPSJub256ZXJvIi8+PC9zdmc+') center no-repeat;background-size: 100% 100%;transition: 0.3s;} .classify-area .section .list{display: none;z-index: 1;position: absolute;left: 0;right: 0;top: 100%;padding: 10px 20px;border: 1px solid #E4E4E4;box-shadow: 0 6px 8px rgba(0,0,0,.3);} .classify-area .section .list li{width: 49%;margin: 1em 0;border-right: 0;} .classify-area .section .list li:hover a{color: #333;} .classify-area .section .list li.on a{color: #009ADC;} .classify-area .section.open .name{color: #009ADC;} .classify-area .section.open .name:after{transform: rotate(180deg);} .classify-area .section.open .list{display: block;} /*结果提示区*/ .result-tips-wrap{margin-bottom: 20px;} .result-tips-wrap .selected-wrap{display: none;} .result-tips-wrap .other-btns .select{display: none;} /*视频列表*/ .video-list li{width: 48%;margin: 0 0 4% 4%;} .video-list li:nth-child(3n+1){margin-left: 4%;} .video-list li:nth-child(2n+1){margin-left: 0;} .video-list li .info{padding: 10px 10px 40px;} .video-list li .info .tit{height: 40px;font-size: 14px;line-height: 20px;} .video-list li .info .date{padding-left: 20px;margin-top: 10px;font-size: 13px;} .video-list li .info .date:before{top: 3px;width: 14px;height: 14px;} .video-list li .info .collect-btn{position: absolute;left: 10px;bottom: 10px;padding-left: 16px;font-size: 12px;} .video-list li .info .download-btn{position: absolute;right: 10px;bottom: 10px;padding-left: 16px;font-size: 12px;} .video-list li .info .lock-btn{position: absolute;right: 10px;bottom: 10px;padding-left: 16px;font-size: 12px;} /*手机-分类区*/ /* .phone-classify-area{display: flex;justify-content: space-between;margin-top: 20px;} .phone-classify-area .item{display: flex;justify-content: space-between;width: 48%;} .phone-classify-area .item .name{position: relative;box-sizing: border-box;width: 70px;padding-left: 20px;font-size: 13px;line-height: 30px;white-space: nowrap;} .phone-classify-area .item .name .icon{position: absolute;left: 0;top: 50%;width: 16px;height: 16px;margin-top: -8px;} .phone-classify-area .item .select{box-sizing: border-box;width: 100%;height: 30px;border: 1px solid #C1C1C1;border-radius: 15px;padding: 0 1.5em 0 1em;font-size: 13px;color: #707070;appearance: none;background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEyIDciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTExLjA3My4xNjRMNiA1LjIzNi45MjcuMTY0YS41MjcuNTI3IDAgMCAwLS43NjMgMCAuNTI3LjUyNyAwIDAgMCAwIC43NjNsNS40NTQgNS40NTVjLjExLjEwOS4yNTUuMTYzLjM4Mi4xNjNhLjU1NC41NTQgMCAwIDAgLjM4Mi0uMTYzTDExLjgzNi45MjdhLjUyNy41MjcgMCAwIDAgMC0uNzYzLjUyNy41MjcgMCAwIDAtLjc2MyAweiIgZmlsbD0iIzQ0NEI1NCIgZmlsbC1ydWxlPSJub256ZXJvIi8+PC9zdmc+') right .5em center no-repeat;background-size: 10px 10px;outline: none;} */ /*手机-排序方式*/ .phone-rank-way{display: flex;justify-content: space-between;margin-bottom: 25px;} .phone-rank-way .item{width: 100%;background-color: #fff;line-height: 40px;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;transition: 0.3s;} .phone-rank-way .item.on{background-color: #009ADC;color: #fff;} }