@charset "utf-8";
/* CSS Document */

/*作品*/
.zp-banner{width: 100%;background: url(../images/bj1.jpg) no-repeat center bottom;background-size: cover;height: 458px;}
.zp-banner .cont{width: 100%;height: 100%;}
.zp-banner ul{display: flex;justify-content: space-between;align-items: center;width: 100%;height: 100%;}
.zp-banner ul li{width: 31%;background: #141414;text-align: center;display: inline-block;font-size:30px;height: 73px;
font-family: 'OPPOSans-Ver2-Medium';line-height:75px;border-radius: 50px;transition:all 0.5s;}
.zp-banner ul li a{color:#fff;transition:all 0.5s;display:block;height:100%;width:100%;}
.zp-banner ul li:hover{background:#fff;}
.zp-banner ul li:hover a{color:#000;}

.ny-zp{width:100%;overflow:hidden;}
.ny-zp h2{font-size:48px;font-family: 'OPPOSans-Ver2-Medium';color: #fff;text-align: center;padding:50px 0;letter-spacing: 6px;}
.ny-zp-p{display: flex;justify-content: left;align-items: center;margin-top:20px;}
.ny-zp-p h3{font-size: 24px;color: #fff;margin: 0; line-height: 60px;}
.ny-zp-p span{display: inline-block;text-align:center;font-size: 20px;color:#8c98dd;background:#0b1340;border-radius:5px;
padding: 5px 10px;margin-left: 15px;}
.ny-zp .in-btn a{margin:50px auto 100px;cursor:pointer;}
.ny-zp .swiper {width: 204%;height: 100%;margin-left: -51%;}
.ny-zp .swiper-slide {}
.ny-zp .swiper-slide figure{width: 100%;border-radius: 15px;overflow: hidden;position: relative;z-index:9;}
.ny-zp .swiper-slide figure img {display: block;width: 100%; object-fit: cover;transition:all 0.5s;}
.ny-zp .swiper-slide:hover figure img{transform: scale(1.02);}
.ny-zp .swiper .swiper-pagination{top: auto;bottom: 0;opacity:0;background: rgba(255, 255, 255, .25);display: none;
    width: 90%;
    height: 3px;
 
}
.ny-zp .swiper:hover .swiper-pagination{opacity:1;}
.ny-zp .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#fff;}

.ny-zp .swiper .swiper-pagination .swiper-pagination-bullet{height:3px;top:0px;width:25%;background:#fff;display:inline-block;margin:0px;
    border-radius: 0px;
}
.ny-zp .swiper-wrapper{}
.ny-zp .swiper .swiper-pagination .swiper-pagination-bullet-active{} 
.ny-zp .swiper .swiper-button-next{right:20%;}
.ny-zp .swiper .swiper-button-prev{left:19%;}
.ny-zp .swiper .swiper-button-next:hover,.ny-zp .swiper .swiper-button-prev:hover{background-color: rgba(210, 210, 215, 0.6);}

.ny-zp .swiper .swiper-button-next:after{background: url(../images/jt.png) no-repeat center;background-size: 16px auto;content:"";
    width: 20px;
    height: 33px;
    background-position-x: 4px;
}
.ny-zp .swiper .swiper-button-prev:after{background: url(../images/jt-1.png) no-repeat center;background-size: 16px auto;content:"";
    width: 20px;
    height: 33px;
    background-position-x: 0px;
}


.ny-zp .swiper .swiper-button-prev.swiper-button-disabled,.ny-zp .swiper .swiper-button-next.swiper-button-disabled{opacity:0 !important;}
.ny-zp .swiper .swiper-button-next,.ny-zp .swiper .swiper-button-prev{width: 56px;height: 56px;border-radius: 50%;
background-color: rgba(210, 210, 215, 0.7);transition-duration: 0.5s;outline: none;top: 45%;}
.ny-zp .swiper .swiper-button-next{opacity:0;}
.ny-zp .swiper .swiper-button-prev{opacity:0;}
.ny-zp .swiper:hover .swiper-button-next{opacity:1;}
.ny-zp .swiper:hover .swiper-button-prev{opacity:1;}
.ny-zp6{margin-bottom: 80px;}

.whiteBackground .ny-zp .in-btn a{background:#000;color:#fff;}
.whiteBackground .ny-zp .ny-zp-p h3{color: #000;}
.whiteBackground .ny-zp .swiper .swiper-pagination{background: rgba(0, 0, 0, .25);}
.whiteBackground .ny-zp .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#000;}
.whiteBackground .ny-zp h2{color: #000;}

.zp-lb{width: 100%;position:relative;}
.zp-lb h2{font-size: 56px;font-family: 'OPPOSans-Ver2-Medium';color: #fff;text-align: center;padding: 80px 0;letter-spacing: 6px;}
.zp-div{width: 100%;overflow-x: auto;}
.zp-div::-webkit-scrollbar {display: none;}
.zp-div ul{display:flex;justify-content: space-between;width: 421%;transition: transform 0.5s ease;}
.zp-div ul li{width:24%;}
.zp-div ul li figure{width: 100%;border-radius: 15px;overflow: hidden;position: relative;z-index:9;}
.zp-div ul li figure img {display: block;width: 100%; object-fit: cover;transition:all 0.5s;}
.zp-div ul li:hover figure img{transform: scale(1.02);}

.zp-lb:hover .zp-jt{opacity:1;}
.zp-jt{width: 56px;height: 56px;border-radius: 50%;background-color: #d2d2d7a3;transition-duration: 0.5s;outline: none;
 position: absolute;top: 45%;text-align:center;z-index: 9;cursor: pointer;opacity:0;}
.zp-prev{left: 20px;background-image:url(../images/jt-1.png);background-size:16px auto;background-color: rgba(210, 210, 215, 0.7);
    background-position: 17px center;
    background-repeat: no-repeat;
}
/*.zp-prev::after{
    content: 'prev';
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1;
    line-height: 56px;
    font-size: 20px;
    color: #0000008f;
}*/
.zp-next{right:20px;background:url(../images/jt.png) no-repeat center;background-size:16px auto;
    background-color: rgba(210, 210, 215, 0.7);
    background-position: 21px center;
    background-repeat: no-repeat;
}
.zp-prev:hover,.zp-next:hover{background-color: rgba(210, 210, 215, 0.6);}
/*.zp-next::after{
    content: 'next';
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1;
    line-height: 56px;
    font-size: 20px;
    color: #0000008f;
}*/
.zp-lb .in-btn a{margin: 6vw auto 3vw;}
.sy-zp .in-btn a{background: #fff;color: #000;transition:all 0.5s}
.sy-zp .in-btn a:hover{background: #f51fb6;color: #fff;}
.sy-zp .in-btn a::after{display:none;}

.whiteBackground .zp-lb .in-btn a{background:#000;color:#fff;}
.whiteBackground .zp-lb .ny-zp-p h3{color: #000;}
.whiteBackground .zp-lb .swiper .swiper-pagination{background: rgba(0, 0, 0, .25);}
.whiteBackground .zp-lb .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#000;}
.whiteBackground .zp-lb h2{color: #000;}


.full-width-slider .rsArrow{width: 56px;height: 56px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.4);
transition-duration: 0.5s;outline: none; position: absolute;top: 45%;text-align:center;z-index: 9;cursor: pointer;opacity:0;}
.full-width-slider .rsArrowLeft{left: 20px;background-image:url(../images/jt-1.png);background-size:16px auto;background-color: rgba(255, 255, 255, 0.4);
    background-position: center;
    background-repeat: no-repeat;
}
.full-width-slider .rsArrowRight{right:20px;background:url(../images/jt.png) no-repeat center;background-size:16px auto;background-size:16px auto;
    background-color: rgba(255, 255, 255, 0.4);
    background-position: center;
    background-repeat: no-repeat;
}
.full-width-slider:hover .rsArrow{opacity:1;}
.full-width-slider:hover .rsArrowLeft,.full-width-slider:hover .rsArrowRight{background-color: rgba(255, 255, 255, 0.6);}
.whiteBackground .zuopin .in-btn a{background:#000;color:#fff;}
.whiteBackground .zuopin .ny-zp-p h3{color: #000;}
.whiteBackground .zuopin .swiper .swiper-pagination{background: rgba(0, 0, 0, .25);}
.whiteBackground .zuopin .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#000;}
.whiteBackground .zuopin h2{color: #000;}
 
.zuopin{width: 100%;overflow: hidden;position:relative;}
.zuopin h2{font-size: 3vw;font-family: 'OPPOSans-Ver2-Medium';color: #fff;text-align: center;padding: 4vw 0;letter-spacing: 6px;}
.zuopin .in-btn a{margin: 4vw auto 5vw;}
.full-width-slider {width: 100%;}
.coloredBlock {}
.infoBlock {
    position: absolute;
	top: 30px;
	right: 30px;
	left: auto;
	max-width: 25%;
	padding-bottom: 0;
	background: #FFF;
	background: rgba(255, 255, 255, 0.8);
	overflow: hidden;
	padding: 20px;
}

.zuopin .rsOverflow{overflow: visible;height: 43vw !important;}

.rsContent figure{width: 95%;border-radius: 15px;overflow: hidden;position: relative;z-index:9;}
.rsContent figure img {display: block;width: 100%; object-fit: cover;transition:all 0.5s;}
.rsContent:hover figure img{transform: scale(1.02);}

.infoBlockLeftBlack {
    color: #FFF;
    background: #000;
    background: rgba(0, 0, 0, 0.75);
    left: 30px;
    right: auto;
}
.infoBlock h4 {
    font-size: 20px;
    line-height: 1.2;
	margin: 0;
	padding-bottom: 3px;
}
.infoBlock p {
	font-size: 14px;
	margin: 4px 0 0;
}
.infoBlock a {
	color: #FFF;
	text-decoration: underline;
}

.fullWidth {width: 100%;}
.wap-zplb{display: none;}

.ny-zp6 .in-btn a{background:#fff;color:#000;}
.ny-zp6 .in-btn a:hover{background:#f51fb6;color:#fff;}
.ny-zp6 .in-btn a:after{display:none;}

.sub{ padding:130px 70px;background: #131414;border-radius: 26px;position: fixed;z-index: 9999;left:50%; top:50%;
transform:translate(-50%,-50%);display: none;width: 40%;}
.sub h2{font-size: 48px; color: #fff;text-align: center;font-family: 'OPPOSans-Ver2-Medium';}
.sub p{font-size: 24px;line-height: 45px;color: #fff;}
.sub i{font-size: 20px;font-style: normal;display: block;margin-top: 40px; color: #9e9e9e;}

.qjbj{position: fixed;width: 100%; height: 100%; background: rgba(0,0,0,.85);top: 0; left: 0;display: none;z-index:999;}
.qjbj.show {
    overflow: hidden;
}
.ggbtn{position: absolute; background: url(../images/d3.png); width: 50px;height: 50px; top: 40px; right: 60px; background-size: 100% 100%;cursor: pointer;transform: rotate(45deg);}
.ggbtn:hover{background: url(../images/d3_1.png);background-size: 100%;}

body.lock-scroll {
    overflow: hidden;
}

#wap-block{display: none;}



@media (min-width: 1024px){
   
}

@media (min-width: 2300px){
}

@media (max-width: 1900px){
    
}

@media (max-width: 1800px){
}

@media (max-width: 1700px){
    .zuopin .rsOverflow {}
}

@media (max-width: 1600px){
    .zp-banner ul li{font-size: 28px;}
}

@media (max-width: 1550px){
    .zuopin .rsOverflow {}
}

@media (max-width: 1520px){

}

@media (max-width: 1500px){
   .zp-banner ul li {font-size: 26px;}
}

@media (max-width: 1450px){

}

@media (max-width: 1360px){
    .in-kh .swiper-slide {width: 6vw !important;}
    .zp-lb h2 {font-size: 45px;}
    .in-case li:last-child {transform: translate3d(0, -55px, 0);}
    .zp-banner ul li {font-size: 24px;}
}

@media (max-width: 1230px){
    .in-kh .swiper-slide {width: 5.5vw !important;}
    
}

@media (max-width: 1200px){
    .in-kh .swiper-slide {width: 11vw !important;}
    
}

@media (max-width: 1024px){
    .zp-banner{height: 350px;}
    .ny-zp h2 {font-size: 6.27vw;padding: 10vw 0;letter-spacing: 4px;}
    .ny-zp-p {margin-top: 0;align-items: baseline;}
    .ny-zp-p h3 {font-size:4.3vw;line-height:5.4vw;margin-top: 3.5vw;}
    .ny-zp-p span {font-size: 3.6vw;padding: 1vw 2vw;margin-top: 0;white-space: nowrap;}
    .ny-zp .in-btn a {margin:10px auto 30px;}
    .ny-zp .swiper .swiper-pagination {width: 62%;left: 20%;height:1px;}
    .ny-zp .swiper{padding-bottom:30px;}
    .zp-lb{display: none;}
    .zp-banner .cont {width: auto;}
    .zuopin .rsOverflow {height: 52vw !important;}
    .full-width-slider .rsArrowLeft{display:none;}
    .full-width-slider:hover .rsArrow{opacity:0;}
    /*.zuopin{display: none;}*/
    .wap-zplb{display:block;}
    .zp-banner ul{display:block;text-align: center;padding-top: 9%;}
    .zp-banner ul li {width: 60vw;margin: 1vw auto;font-size: 4.27vw;line-height: 10vw;height:auto;}
    .sub {width: 75%;padding:20vw 6vw;border-radius:20px;}
    .sub h2 {font-size: 4.67vw;}
    .sub i {font-size: 2.7vw;margin-top: 4vw;}
    .ggbtn {width: 6vw;height: 6vw;top: 4vw;right: 4vw;}
    
    #wap-block{display: block;}
    #pc-block{display: none;}
   /*.fudong{position: fixed;top: -120px;width: 0;height: 0;}*/
   #ppt1{display:block;height:25px;}
}

@media (max-width: 760px){
    .zp-banner ul{padding-top: 14%;}
    .ny-zp .swiper .swiper-button-next,.ny-zp .swiper .swiper-button-prev{display:none;}
    .zuopin h2 {font-size: 5vw;}
    .zuopin .in-btn a{margin: 10vw auto;}

}

@media (max-width: 640px){
    .zp-banner {height: 330px;}
    .zp-banner ul {padding-top: 16%;}
}

@media (max-width: 600px){
    .zp-banner ul {padding-top: 21%;}
}

@media (max-width: 510px){
    .ny-zp .swiper {width: 200%;}
    .zp-banner ul {padding-top: 20%;}
}

@media (max-width: 480px){
    .zp-banner ul{padding-top: 26%;}

}

@media (max-width: 420px){
    .zp-banner ul {padding-top: 31%;}
}

@media (max-width: 400px){
   
}

@media (max-width: 370px){
    .ny-zp .swiper {width: 198%;}
    .zp-banner {height: 270px;}
}