﻿@charset "utf-8";
.video_title { width:100%; position:relative; z-index:10;}
.video_title h2 { text-align:center; line-height:1; font-size:28px; color:#000;}
.video_title p { margin:10px 0 -5px; text-align:center; line-height:24px; color:rgba(153,153,153,1);}

.video_part01 { width:50%; padding-left:50%; margin-top:-50px; background:#000; position:relative;}
.video_part01:before { width:1920px; height:100%; content:""; background:url(../img/bg_video01.jpg) no-repeat center center; background-size:cover; position:absolute; top:0; left:50%; transform:translateX(-50%);}
.video_part01 .info { width:calc(50% - 130px); position:absolute; top:50%; right:50%; transform:translate(-130px,-50%); z-index:10;}
.video_part01 .info li { width:100%;}
.video_part01 .info .name { text-align:center; line-height:1; font-size:28px; color:#fff; overflow:visible;}
.video_part01 .info .text { margin-top:30px; line-height:32px; color:rgba(255,255,255,0.7);}

.video_part01 .list { width:calc(100% - 130px); padding-left:130px; margin:70px 0; position:relative; z-index:10;}
.video_part01 .list li { width:calc(100% - 100px); min-height:70px; padding-left:100px; margin:30px 0; overflow:visible; position:relative;}
.video_part01 .list li .img { width:70px; height:70px; background:none; position:absolute; top:2px; left:0;}
.video_part01 .list li .name { font-size:18px; color:#fff;}
.video_part01 .list li .text { margin-top:10px; line-height:24px; color:rgba(255,255,255,0.7);}

.video_part02 { width:50%; padding-left:50%; margin:60px 0; position:relative;}
.video_part02 .list { width:calc(50% - 100px); margin-right:100px; position:absolute; top:50%; left:0; transform:translateY(-50%);}
.video_part02 .list li { width:100%; margin-top:40px; position:relative;}
.video_part02 .list li .name { font-size:18px; color:rgba(51,51,51,1);}
.video_part02 .list li .text { margin-top:10px; line-height:24px; color:#898989;}
.video_part02 .list li.title { margin:0; overflow:visible;}
.video_part02 .list li.title .name { line-height:1; font-size:24px; font-weight:bold; color:#3e3a39; overflow:visible;}

.video_part02 .info { width:100%;}
.video_part02 .info img { max-width:100%;}

.video_part03 { width:100%; padding:60px 0; background:#000; position:relative;}
.video_part03:before { width:1920px; height:100%; content:""; background:url(../img/bg_video03.jpg) no-repeat center center; background-size:cover; position:absolute; top:0; left:50%; transform:translateX(-50%);}
.video_part03 .video_title h2 { color:#fff;}
.video_part03 .video_title p { color:rgba(255,255,255,0.8);}

.video_part03 .list { width:100%; margin-top:40px; position:relative; z-index:10;}
.video_part03 .list li { width:calc(100% / 3); padding:50px 0; position:relative;}
.video_part03 .list li:before,
.video_part03 .list li:after { width:0; height:0; content:""; background:#383f53; position:absolute; top:0; left:0;}
.video_part03 .list li:before { width:1px; height:100%;}
.video_part03 .list li:after { width:100%; height:1px;}
.video_part03 .list li:nth-child(1):before,
.video_part03 .list li:nth-child(3n+1):before { display:none;}
.video_part03 .list li:nth-child(1):after,
.video_part03 .list li:nth-child(2):after,
.video_part03 .list li:nth-child(3):after { display:none;}
.video_part03 .list li .img { width:50px; height:50px; background:none; position:relative; left:50%; transform:translateX(-50%);}
.video_part03 .list li .name { margin:15px 0; text-align:center; font-size:18px; color:rgba(252,192,46,1); overflow:hidden;}
.video_part03 .list li .text { height:14px; text-align:center; line-height:1; color:rgba(252,192,46,0.8); overflow:hidden;}

.video_part04 { width:100%; padding:60px 0; position:relative;}
.video_part04:before { width:1920px; height:100%; content:""; background:#efefef; position:absolute; top:0; left:50%; transform:translateX(-50%);}
.video_part04 .video_title h2 { text-align:left;}
.video_part04 .video_title p { text-align:left; color:rgba(153,153,153,1);}

.video_part04 .list { width:calc(100% - 400px); height:340px; padding-left:400px; margin-top:30px; background:#dedede; position:relative; z-index:10;}
.video_part04 .list:before { width:calc((100% - 400px) / 2); height:100%; content:""; background:#d5d5d5; position:absolute; top:0; left:400px;}
.video_part04 .list li { width:calc(50% - 100px); height:50%; padding:0 50px; color:#666; position:relative; z-index:10;}
.video_part04 .list li .name { margin:55px 0 20px; font-size:18px; color:#3e3a39; overflow:visible;}
.video_part04 .list li .name em { float:left; margin:-5px 10px 0 0; font-size:36px; font-weight:bold; color:rgb(43,160,232);}
.video_part04 .list li .text { height:14px; line-height:1;}

.video_part04 .list dl { width:calc(400px - 120px); height:calc(100% - 30px); padding:30px 60px 0; background:#000 url(../img/bg_video04.jpg) no-repeat center center; background-size:cover; color:#666; position:absolute; top:0; left:0; z-index:10;}
.video_part04 .list dd { float:left; width:100%; height:40px; margin-top:20px; position:relative;}
.video_part04 .list dd input { width:calc(100% - 2px); height:calc(100% - 2px); background:#fff; border:1px solid rgba(255,255,255,0.6); border-radius:3px; text-indent:10px;}
.video_part04 .list dd input:focus { border-color:#fc6832;}
.video_part04 .list dd.submit { height:44px; margin-top:30px; background:#fc6832; border-radius:3px; line-height:44px; text-align:center; font-size:16px; color:#fff;}
.video_part04 .list dd.loading { width:100%; height:100%; margin:0; background-color:rgba(0,0,0,0.1); position:absolute; top:0; left:0; z-index:30; display:none;}

.video_part05 { width:100%; margin:60px 0 -60px; position:relative;}
.video_part05 .list { width:calc(100% - 20px); padding:0 0 20px 20px; margin-top:30px; background:#f6f6f6; border-top:1px solid #e5e5e5; position:relative; z-index:10;}
.video_part05 .list li { width:calc(100% / 4 - 20px); margin:20px 20px 0 0; background:#fff; border-radius:8px; position:relative;}
.video_part05 .list li a { float:left; width:calc(100% - 30px); padding:15px 15px 205px; position:relative;}
.video_part05 .list li p { width:calc(100% - 30px); overflow:hidden; position:absolute; left:15px; z-index:20;}
.video_part05 .list li .bg { width:100%; left:0;}
.video_part05 .list li .img { height:calc(100% - 220px); top:15px;}
.video_part05 .list li .name { height:48px; line-height:24px; font-size:16px; color:#000; bottom:145px; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.video_part05 .list li .date { line-height:1; color:#898989; bottom:120px;}
.video_part05 .list li .text { height:48px; line-height:24px; color:#666; bottom:60px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.video_part05 .list li .sort { width:auto; padding:7px 8px; border:1px solid #e5e5e5; border-radius:4px; line-height:1; font-size:12px; color:#898989; bottom:15px;}
.video_part05 .list li .more { width:20px; height:11px; background:url(../images/base.png) no-repeat -80px 0; bottom:25px; left:auto; right:15px; transition:all 0.3s;}
.video_part05 .list li:hover { box-shadow:0px 0px 16px rgba(0,0,0,0.3);}
.video_part05 .list li:hover .name { color:#0485ed;}
.video_part05 .list li:hover .more { background-position:-50px 0;}
.video_part05 .list li:hover .img img { transform:scale(1.1);}
