@font-face {
    font-family: "serifcnMedium";
    src: url(fonts/SourceHanSansCN-Medium.ttf);
}
html, body {
    height: 100%;
    font-family: "serifcnMedium";
}
body {
    width: 100%;
    height: 100%;
    background: url(../images/liveImg/liveBg.jpg) no-repeat center center;
    background-size: 100% 100%;
    overflow: hidden;
}
.center-box {
    width:150rem;
    margin:0 auto;
}
.exhTop{
    width:100%;
    height:12.4rem;
    margin-bottom:3.5rem;
    position:relative;
}
.live-logo {
    position:absolute;
    width: 15.2rem;
    height: 10.5rem;
    display:inline-block;
    background: url(../images/onlineImg/logo.png) no-repeat;
    background-size: 100% 100%;
}
.live-logo2024 {
    background: url(../images/onlineImg/logo2024.png) no-repeat;
    background-size: 100% 100%;
}
.live-title {
    position:absolute;
    top:6rem;
    left:50%;
    transform:translate(-50%, 0);
    width: 90.8rem;
    height: 6.2rem;
    background: url(../images/liveImg/liveTitle.png) no-repeat;
    background-size: 100% 100%;
}
.exh-video{
    width:86rem;
    height:55rem;
    margin:0 auto;
}
.video-bg{
    width:100%;
    height:55rem;
    position:relative;
}
.exh-video .video-bg .video-left{
    width:0.8rem;
    height:44rem;
    background:url(../images/liveImg/videoLeftBg.png) no-repeat;
    background-size:100% 100%;
    position:absolute;
    top:1.7rem;
    left:0;
    z-index:13;
}
.exh-video .video-bg .video-right{
    width:0.8rem;
    height:44rem;
    background:url(../images/liveImg/videoRightBg.png) no-repeat;
    background-size:100% 100%;
    position:absolute;
    top:1.7rem;
    right:0;
    z-index:13;
}
.exh-video .video-bg .video-top{
    width:100%;
    height:1.7rem;
    background:url(../images/liveImg/videoTopBg.png) no-repeat;
    background-size:100% 100%;
    position:absolute;
    top:0;
    left:0;
    z-index:13;
}
.exh-video .video-bg .video-bottom{
    width:100%;
    height:9.4rem;
    background:url(../images/liveImg/videoBotBg.png) no-repeat;
    background-size:100% 100%;
    position:absolute;
    bottom:0;
    left:0;
    z-index:13;
}
.exh-video .video-bg .video-play{
    width:100%;
    height:47.2rem;
}
.exh-video .video-bg .video-play video{
    width:100%;
    height:100%;
}
.exh-video .video-bg .video-play p{
    width:100%;
    height:6.2rem;
    line-height:6.2rem;
    background:rgba(0,0,0,.5);
    color:#fff;
    font-size:1.8rem;
    padding-left:1.5rem;
    box-sizing: border-box;
    position:absolute;
    bottom:7rem;
    left:0;
    z-index:12;
    opacity:0;
}
.exh-video .video-bg .video-play:hover p{
    opacity: 1;
}
.live-search {
    position:absolute;
    left: 50%;
    top: 64.5rem;
    transform:translate(-50%, 0);
    font-size:0;
    z-index:13;
}
.live-search input,.live-search button {
    border: none;
    outline: none;
}
.live-search input {
    width: 27.7rem;
    height: 5rem;
    line-height: 5rem;
    background: rgba(0,40,147,.8);
    border-radius: 1rem 0 0 1rem;
    font-size: 1.8rem;
    color: rgba(255,255,255,.6);
    display:inline-block;
    vertical-align: middle;
    padding: 0 1.4rem 0 1.6rem;
}
.live-search button {
    width: 5rem;
    height: 5rem;
    border-radius: 0 1rem 1rem 0;
    cursor: pointer;
    display:inline-block;
    vertical-align: middle;
    background: rgba(0,40,147,.8) url(../images/liveImg/liveSearchBtn.png) no-repeat center center;
}
.live-search input::placeholder {
    color: rgba(255,255,255,.6);
}
.exh-watch{
    width:145rem;
    position:absolute;
    left:50%;
    top:78rem;
    transform: translate(-50%, -50%);
}
.exh-watch ul{
    display:flex;
    justify-content: space-between;
}
.exh-watch ul li{
    width:29rem;
    height:14.5rem;
    font-size:1.6rem;
    color:#fff;
    position:relative;
    cursor:pointer;
}
.exh-watch ul li:last-child{
    margin-right:0;
}
.exh-watch ul li:first-child{
    transform: rotateX(20deg) rotateY(30deg) scale(.85) translateY(-5.5rem) translateZ(3rem);
}
.exh-watch ul li:nth-child(2){
    transform: rotateX(20deg) rotateY(20deg) scale(.9) translateY(-4.5rem) translateZ(-4rem);
}
.exh-watch ul li:nth-child(3){
    transform: rotateX(20deg) rotateY(10deg) scale(.95) translateY(-2.5rem) translateZ(-6rem);
}
.exh-watch ul li:nth-child(5){
    transform: rotateX(20deg) rotateY(-10deg) scale(.95) translateY(-2.5rem) translateZ(-6rem);
}
.exh-watch ul li:nth-child(6){
    transform: rotateX(20deg) rotateY(-20deg) scale(.9) translateY(-4.5rem) translateZ(-4rem);
}
.exh-watch ul li:last-child{
    transform: rotateX(20deg) rotateY(-30deg) scale(.85) translateY(-5.5rem) translateZ(3rem);
}
.exh-watch ul li img{
    max-width:100%;
}
.exh-watch ul li span{
    width:7.6rem;
    height:3.2rem;
    line-height:3.2rem;
    border-radius:0.5rem;
    background:#1f8fee;
    text-align:center;
    position:absolute;
    top:0;
    right:0;
}
.exh-watch ul li p{
    width:100%;
    height:3.6rem;
    line-height:3.6rem;
    text-align:center;
    position:absolute;
    bottom:5rem;
    left:0;
}
.online_gallery {
    position:absolute;
    left: 50%;
    bottom:2rem;
    transform: translate(-50%, 0);
    width: 117.1rem;
    height: 6.5rem;
}
.onBtn ul {
    width:100%;
    display: flex;
    justify-content: space-between;
}
.onBtn ul li {
    width: 21rem;
    height: 6.2rem;
    line-height: 6.2rem;
    text-align: center;
    color: rgba(255, 255, 255, .4);
    font-size: 2.2rem;
    background: url(../images/onlineImg/onlineBtn.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li a {
    color: rgba(255, 255, 255, .4);
}
.onBtn ul li a i {
    width: 2.3rem;
    height: 2.6rem;
    display: inline-block;
    vertical-align: middle;
    margin-right: 1.3rem;
    background: url(../images/onlineImg/abhBtn.png) no-repeat;
    background-size: 100% 100%;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(2) a i {
    width: 3.1rem;
    background: url(../images/onlineImg/zsBtn.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(3) a i {
    width: 2.6rem;
    height: 2.8rem;
    background: url(../images/onlineImg/zpBtn.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(4) a i {
    width: 2.5rem;
    background: url(../images/onlineImg/zxzbBtn.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(5) a i {
    width: 3.3rem;
    height: 2.8rem;
    background: url(../images/onlineImg/gydjBtn.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li.current {
    color: #fff;
    background: url(../images/onlineImg/onlineBtnHover.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li.current a {
    color: #fff;
}
.onBtn ul li.current a i {
    background: url(../images/onlineImg/abhBtnHover.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(2).current a i {
    background: url(../images/onlineImg/zsBtnH.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(3).current a i {
    background: url(../images/onlineImg/zpBtnHover.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(4).current a i {
    background: url(../images/onlineImg/zxzbBtnHover.png) no-repeat;
    background-size: 100% 100%;
}
.onBtn ul li:nth-child(5).current a i {
    background: url(../images/onlineImg/gydjBtnHover.png) no-repeat;
    background-size: 100% 100%;
}
.ex-swiper {
    position: relative;
    width: 100%;
    height: 72rem;
    transition: .3s;
}