@media (min-width: 1200px){ .container { width: 1280px; } } img{ display: block; } nav{ height: 88px; } footer{ height: 230px; background: #f2f2f2; } .content-banner{ height: 350px; width: 100%; margin-top: 80px; } .l{ float: left; } .video-main .bread-nav{ height: 60px; line-height: 60px; font-size: 14px; } .video-main h2{ font-size: 28px; padding: 0px 0px 22px 0px; border-bottom: 1px solid #e8e8e8; } .video-main h2::before{ background: transparent; } .video-main .video-wrapper{ overflow: hidden; margin-bottom: 40px; } .video-wrapper h3{ font-size: 22px; margin: 24px 0; } .video-wrapper .hot{ height: 597px; overflow: hidden; } .video-wrapper .hot li a{ width: 420px; height: 76px; line-height: 76px; font-size: 16px; box-sizing: border-box; background: #f7f7f7; color: #3b3b3b; display: inline-block; padding: 0 18px; } .video-wrapper .hot li a i{ display: inline-block; width: 30px; height: 30px; border-radius: 50%; background: #0076bf; line-height: 30px; text-align: center; color: #fff; font-style: normal; margin-right: 16px; vertical-align: middle; } .video-wrapper .hot li a img{ display: none; } .video-wrapper .hot li:first-child{ height: 220px; } .video-wrapper .hot li:first-child a{ height: 220px; padding: 0px; line-height: 0px; position: relative; } .video-wrapper .hot li:first-child a i{ position: absolute; left: 18px; top: 18px; } .video-wrapper .hot li:first-child a span{ position: absolute; height: 40px; background: rgba(0,0,0,.5); line-height: 40px; display: inline-block; color: #fff; text-align: center; width: 100%; bottom: 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .video-wrapper .hot li a span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align: middle; display: inline-block; width: 80%; } .video-wrapper .hot li:first-child a img{ display: block; width: 100%; height: 100%; } .video-wrapper .main{ width: 795px; margin: 0px 34px 0 0; } .video-wrapper .main .main-video{ width: 795px; height: 402px; position: relative; } .video-wrapper .main .main-video .nums{ width: 100%; height: 40px; background: rgba(0,0,0,0.5); position: absolute; bottom: 0px; padding-left: 40px; font-size: 0px; } .video-wrapper .main .main-video .nums p{ display: inline-block; color: #fff; line-height: 40px; font-size: 16px; margin: 0px; } .video-wrapper .main .main-video .nums .download{ margin-left: 30px; padding-left: 30px; background: url(../../img/download-icon.png) no-repeat left center; background-size: 24px; } .video-wrapper .main .main-video img{ width: 100%; height: 100%; } .video-wrapper .main .content{ background: #f7f7f7; padding: 28px; } .video-wrapper .main .content h4{ font-size: 16px; } .video-wrapper .main .content p{ font-size: 14px; width: 100%; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .video-list{ font-size: 0px; margin-bottom: 40px; } .video-list li{ box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.12); display: inline-block; width: 297px; margin: 0 20px 20px 0; } .video-list li:nth-child(4n + 4){ margin-right: 0px; } .video-list li img{ width: 100%; } .video-list li p{ width: 100%; padding: 12px 15px; text-align: center; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; font-size: 14px; margin:0px; } /* 瑙嗛璇︽儏 */ .video-main-detail .video-detail{ width: 1000px; height: 570px; margin: 0 auto; } .video-main-detail .nums{ width: 1000px; height: 60px; font-size: 0px; margin: 0 auto; text-align: right; } .video-main-detail .nums p{ display: inline-block; color: #333; line-height: 60px; font-size: 16px; margin: 0px; } .video-main-detail .nums .download{ margin-left: 30px; padding-left: 30px; background: url(../../img/download-icon.png) no-repeat left center; background-size: 24px; } .video-main-detail .video-desc{ font-size: 14px; line-height: 30px; margin-bottom: 50px; } /* 绉诲姩绔牱寮 start*/ @media (max-width: 768px) { .content-banner{ background-size: 100% 100%!important;; height: 260px; margin-top: 0.78rem; } .video-main h2{ margin: 0px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .video-wrapper .main,.video-wrapper .main .main-video,.video-wrapper .l,.video-wrapper .hot li:first-child a{ width: 100%; } .video-wrapper .main .main-video{ height: 3.2rem; } /* .video-main-detail span{ width: } */ .video-main-detail .bread-nav a,.video-main-detail .bread-nav span{ display: inline-block; vertical-align: middle; } .video-main-detail .bread-nav span{ width: 40%; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .video-main-detail .video-detail,#company_video{ width: 100% !important; height: 3.2rem !important; } .video-main-detail .nums{ width: 100%; } /* .video-list{ */ /* display: none; */ /* } */ .video-wrapper .hot { height: auto; } .video-main .video-wrapper { margin-bottom: 30px; } .video-list li { width: 100%; margin: 0 auto 20px; } } /* 绉诲姩绔牱寮 end*/