﻿.video{position:absolute;overflow:hidden;line-height:0;height:100%;}
.video-play-btn, .video-pause-btn {
    color: #fff;
    position: absolute;
    top: 50%;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    margin-top: -2rem;
    z-index: 10;
}
.play-btn {
    display: inline-block;
    width: 4.5rem;
    margin-bottom: .5rem;
}
.video-play-btn:hover+.cover,.video.active:hover .cover{opacity:0.3}
.video .hover-btn{display:none;}
.video-play-btn:hover .hover-btn{display:block}
.video-play-btn:hover .show-btn{display:none}
.show-video {
    width: 100%;
    height: auto;
    position:relative;
    z-index:2;
    opacity:0
}
.show-video.active{opacity:1}
.video-pause-btn {
    display:none;
}
.video.active:hover  .video-pause-btn{display:inline-block}
.cover{opacity:0;position:absolute;width:100%;height:100%;background:#000;top:0;left:0;z-index:2}
.nav-item{width:12%}
.more-video {
    display: inline-block;
    border: 2px solid #e70310;
    padding: 5px 0 5px 2.25rem;
    width: 10rem;
    color: #e70310;
    font-family: PingFang Heavy;
    text-align:left
}
.more-video > span {
    vertical-align: middle;
}
.arrow-line {
    height: 2px;
    width: 0;
    display: inline-block;
    background: #fff;
    margin-right: -13px;
    margin-left: 10px;
    transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
}
.arrow-right {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
.more-video:hover {
    background: #e70310;
    color: #fff;
}
.more-video:hover .arrow-line {
    width: 20px;
}
.video-container {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    z-index: 9;
    background: #000;
    display: none;
}
.video-container video {
    width: 80%;
    margin: 5% 10%;
    height: 80%;
    opacity:1
}
.close-btn {
    position: absolute;
    right: 7em;
    top:7em;
    width: 3.5em;
    cursor:pointer;
}