@charset "utf-8";
html{font-size:62.5%;}
body{margin:0px; font-size:12px; color:#91989f; font-family: Arial, Helvetica, sans-serif,Microsoft YaHei; cursor:default; }
*{padding:0px; margin:0px;-moz-box-sizing: border-box; /*Firefox3.5+*/-webkit-box-sizing: border-box; /*Safari3.2+*/-o-box-sizing: border-box; /*Opera9.6*/-ms-box-sizing: border-box; /*IE8*/box-sizing: border-box; }
body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,p,i,b,em,span,form,fieldset,legend,input,textarea,select,button,th,td {margin:0; padding:0; font-family: Arial, Helvetica, sans-serif,Microsoft YaHei;}
h1,h2,h3,h4,h5,h6 {list-style:none; font-weight:normal; color:#555;}
input,select,button{font-size:12px; font-family: Arial, Helvetica, sans-serif,Microsoft YaHei; border:0; background:none; outline:none; vertical-align:middle;}
button {overflow:visible}
img{border:none;}
li{list-style:none;}
a{color:#91989f; text-decoration:none;
-webkit-transition:all .3s;
-moz-transition:all .3s;
-ms-transition:all .3s;
-o-transition:all .3s;
transition:all .3s;}
a:hover{color:#005caf;}

.clear{overflow:hidden; clear:both; height:0px;}
.fl{float:left;}
.fr{float:right;}

.con{width:1520px; margin:0 auto;max-width: 94%;}
.container {width:1520px; margin:0 auto;max-width: 94%;}
.header{width:100%; position:fixed; top:0; left:0; z-index:8;
transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;opacity: 0;}
.header.on{z-index: 10;opacity: 1;}
.header .container{position:relative;}
.header .logo{ position: absolute;left: 1.5rem;top: 40px;
transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;}

.header .logo img{width:auto; height:40px; display:block;}
.header .logo .img2 { display: none}
.header.on .logo .img1{ display:none}
.header.on .logo .img2 { display:block}
.header .an{position:absolute; top:50%; right:15px; height:18px; width:30px; display:none;
transform:translate(0,-50%);
-webkit-transform:translate(0,-50%);
-moz-transform:translate(0,-50%);
-ms-transform:translate(0,-50%);
-o-transform:translate(0,-50%);}
.header .an span{width:30px; height:2px; background-color:#555; display:block; position:absolute;
transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;}
.header .an span.a1{top:0; left:0;}
.header .an span.a2{top:8px; left:0;}
.header .an span.a3{top:16px; left:0;}
.header .an.n span.a2{display:none;}
.header .an.n span.a1{top:8px; width:30px;
transform:rotate(45deg);
-o-transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);}
.header .an.n span.a3{top:8px; width:30px;
transform:rotate(135deg);
-o-transform:rotate(135deg);
-ms-transform:rotate(135deg);
-moz-transform:rotate(135deg);
-webkit-transform:rotate(135deg);}




.ban .an{position:absolute; top:50px; right:15px; height:18px; width:30px;z-index: 99999;}
.ban .an span{width:30px; height:2px; background-color:#555; display:block; position:absolute;
transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;}
.ban .an span.a1{top:0; left:0;}
.ban .an span.a2{top:8px; left:0;}
.ban .an span.a3{top:16px; left:0;}
.ban .an.n span.a2{display:none;}
.ban .an.n span.a1{top:8px; width:30px;
transform:rotate(45deg);
-o-transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);}
.ban .an.n span.a3{top:8px; width:30px;
transform:rotate(135deg);
-o-transform:rotate(135deg);
-ms-transform:rotate(135deg);
-moz-transform:rotate(135deg);
-webkit-transform:rotate(135deg);}


.ban .nav i{font-size:12px; color:#aaa; line-height:54px; text-align:right; position:absolute; width:50%; height:54px; right:0px; top:50%; display:none;
transform:translate(0,-50%);
-webkit-transform:translate(0,-50%);
-moz-transform:translate(0,-50%);
-ms-transform:translate(0,-50%);
-o-transform:translate(0,-50%);}
.ban .nav ul { width: 100%;}

.ban .nav{width:100%;  background-color:#fff; height:100%; position:fixed; top:0px; right:-100%; z-index:9999; overflow:auto;
transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;top: 0;}
.ban .nav .lo{width: 60px;height: 60px;top: 35px;position: absolute;left: 1.5rem;}
.ban .nav .lo img{width: 100%;display: block;}
.ban .nav ul{display: flex;justify-content: center;align-items: center;overflow: hidden;}
.ban .nav ul a {width: 100%;}

.ban .nav ul .l1 {width: 85.79%;height: 100vh;position: relative;float: left;}
.ban .nav ul .l1 .dh_t{width: 100%;height: 50%;position: absolute;left: 0;top: 0;}
.ban .nav ul .l1 .dh_t .dt{width: 60%;position: absolute;left: 0;top: 0;height: 100%;display: flex;justify-content: flex-end;align-items: flex-end;border-right: #ccc 1px solid;}
.ban .nav ul .l1 .dh_t .gy{width: 40%;position: absolute;left: 60%;top: 0;height: 100%;display: flex;justify-content: flex-end; align-items: flex-end;flex-direction: column;}
.ban .nav ul .l1 .dh_t .slogo{height: 56px;text-align: center !important;font-size: 28px;color: #555;display: flex;justify-content: center;align-items: center;;width: 100%;}
.ban .nav ul .l1 .dh_t .slogo img{width: auto;height:26px;display: block;}
.ban .nav ul .text{height: 180px;padding:30px 30px;text-align: right;width: 100%;display: flex;justify-content: flex-end;align-items: center}
.ban .nav ul .text .zi .char {
    display: inline-block;
   color: #fff;
    will-change: transform, opacity;
  }

  /* 字符切换动画 */
  @keyframes char-switch {
    0%   { opacity: 1;    transform: translateY(0); }
    30%  { opacity: 0;    transform: translateY(-8px) scale(0.9); }
    31%  { opacity: 0;    transform: translateY(8px)  scale(0.9); }
    60%  { opacity: 1;    transform: translateY(0); }
    100% { opacity: 1;    transform: translateY(0); }
  }

  /* 悬停时触发切换动画 */
.ban .nav ul .text:hover .zi .char {
    animation: char-switch 0.6s ease-in-out both;
  }

  /* 每个字符依次延迟，形成挨个切换的波浪 */
.ban .nav ul .text:hover .zi .char:nth-child(1)  { animation-delay: 0.000s; }
.ban .nav ul .text:hover .zi .char:nth-child(2)  { animation-delay: 0.080s; }
.ban .nav ul .text:hover .zi .char:nth-child(3)  { animation-delay: 0.160s; }
.ban .nav ul .text:hover .zi .char:nth-child(4)  { animation-delay: 0.240s; }
.ban .nav ul .text:hover .zi .char:nth-child(5)  { animation-delay: 0.320s; }
.ban .nav ul .text:hover .zi .char:nth-child(6)  { animation-delay: 0.400s; }
.ban .nav ul .text:hover .zi .char:nth-child(7)  { animation-delay: 0.480s; }
.ban .nav ul .text:hover .zi .char:nth-child(8)  { animation-delay: 0.560s; }
.ban .nav ul .text:hover .zi .char:nth-child(9)  { animation-delay: 0.640s; }
.ban .nav ul .text:hover .zi .char:nth-child(10)  { animation-delay: 0.000s; }
.ban .nav ul .text:hover .zi .char:nth-child(11)  { animation-delay: 0.080s; }
.ban .nav ul .text:hover .zi .char:nth-child(12)  { animation-delay: 0.160s; }
.ban .nav ul .text:hover .zi .char:nth-child(13)  { animation-delay: 0.240s; }
.ban .nav ul .text:hover .zi .char:nth-child(14)  { animation-delay: 0.320s; }
.ban .nav ul .text:hover .zi .char:nth-child(15)  { animation-delay: 0.400s; }
.ban .nav ul .text:hover .zi .char:nth-child(16)  { animation-delay: 0.480s; }
.ban .nav ul .text:hover .zi .char:nth-child(17)  { animation-delay: 0.560s; }
.ban .nav ul .text:hover .zi .char:nth-child(18)  { animation-delay: 0.640s; }


  /* 切换时颜色也跟着变 */
  @keyframes color-switch {
    0%   { color: #fff; }
    35%  { color: #ffd866; }
    65%  { color: #ff9a76; }
    100% { color: #fff; }
  }

.ban .nav ul .text:hover .zi .char {
    animation:
      char-switch 0.6s ease-in-out both,
      color-switch 0.6s ease both;
  }


.ban .nav ul .text .zi {opacity: 0;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;position: relative;z-index: 5;}
.ban .nav ul .text:hover .zi {opacity: 1;}
.ban .nav ul .text h3{font-size: 1.8vw;color: #fff;line-height: 1.4;margin-bottom: 10px; letter-spacing: 3px;}
.ban .nav ul .text h4{font-size: 1.5vw;color: #fff;opacity: 0.6; font-family: 'Montserrat';line-height:1.2;letter-spacing: 2px;text-transform: uppercase;font-weight: 100;}
.ban .nav ul .l2 {width: 14.21%;height: 100vh;position: relative;display: flex;justify-content: center;align-items: center;padding-bottom: 56px;float: left;}
.ban .nav ul .l1 .dh_b{width: 100%;height: 50%;position: absolute;right: 0;bottom: 0;}
.ban .nav ul .l1 .dh_b li {width: 60%;float: right;overflow: hidden;}
.ban .nav ul .l1 .dh_b::before{width: 40%;height: 100px;position: absolute;left: 0%;top: 0;content: "";background: url(../images/qs.png) center / 100% 100% no-repeat;z-index: 0;}
.ban .nav.on ul .l1 .dh_t .dt a{margin-top: 0;opacity: 1;transform: translateY(0%);}
.ban .nav ul .l1 .dh_t .dt a {margin-top: 100%;display: block;transform: translateY(150%); opacity: 0;-webkit-transition:all 1.4s; -moz-transition:all 1.4s; -o-transition:all 1.4s; transition:all 1.4s;}
.ban .nav.on ul .l1 .dh_t .gy a{margin-top: 0;opacity: 1;transform: translateX(0%);}
.ban .nav ul .l1 .dh_t .gy a {margin-top: 100%;display: block;transform: translateX(160%); opacity: 0;-webkit-transition:all 1.6s; -moz-transition:all 1.6s; -o-transition:all 1.6s; transition:all 1.6s;}
.ban .nav.on ul .l1 .dh_b a{opacity: 1;transform: translateY(0%);}
.ban .nav ul .l1 .dh_b a{transform: translateY(160%);display: block; opacity: 0;-webkit-transition:all 1.8s; -moz-transition:all 1.8s; -o-transition:all 1.8s; transition:all 1.2s;}
.ban .nav ul .l2 a {transform: translateX(160%);display: block; opacity: 0;-webkit-transition:all 1.8s; -moz-transition:all 1.8s; -o-transition:all 1.8s; transition:all 1.2s;}
.ban .nav.on ul .l2 a{opacity: 1;transform: translateY(0%);}
.ban .nav ul .d1 {background:#b1b2b6;position: relative;}
.ban .nav ul .d1::after{content: "";background: url(../images/dhbj01.png) center / 100% 100%;position: absolute;left: 0;bottom: 0;width: 100%;height: 0;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;z-index: 1}
.ban .nav ul .d1:hover::after {height: 100%;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;top: 0;}
.ban .nav ul .d2 {background:#7c8491;}
.ban .nav ul .d2::after{content: "";background: url(../images/dhbj02.png) center / 100% 100%;position: absolute;left: 0;bottom: 0;width: 100%;height: 0;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;z-index: 1}
.ban .nav ul .d2:hover::after {height: 100%;top: 0;}
.ban .nav ul .d3 {background:#1a1c29;position: relative;}
.ban .nav ul .d3::after {content: "";background: url(../images/dhbj4.png) center / 100% 100%;position: absolute;left: 0;bottom: 0;width: 100%;height: 0;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;z-index: 1}
.ban .nav ul .d3:hover::after {height: 100%;top: 0;}
.ban .nav ul .d4 {background:#3d3f4b;position: relative;}
.ban .nav ul .d4::after{content: "";background: url(../images/dhbj3.png) center / 100% 100%;position: absolute;left: 0;bottom: 0;width: 100%;height: 0;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;z-index: 1}
.ban .nav ul .d4:hover::after {height: 100%;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;top: 0;}
.ban .nav.on{right:0;}


@media (min-width:1024px){

.header .nav .e_j{display:none !important;}
.header .nav ul li:hover .e_j{display:block !important;}
.head_h { height: 68px; display: none}
}


@media only screen and (max-width:1024px){
.head_h { height: 60px; display:none}
.header{border:0; height:60px; background:#333; width:100%}
.header .container{ padding:0; overflow:hidden; width:94%}
.header .logo{width:230px; margin:10px auto;}
.header.on .logo{width:220px; margin:10px auto;}
.ban .an{display:block; right:10px;}
.ban .an span { background-color:#999}

.header.on .nav ul li a { font-size: 16px;color: #fff;}
.ban .nav i{display:block;}


.header .nav .e_j { width: 100%; border-top: 1px solid #444; background: none; position: relative;display: none;top: auto; left: auto; margin: 0;padding-bottom: 10px;}
.header .nav ul li .e_j a { color:#aaa;}
.header .nav ul li .e_j a:hover { color:#fff}
.header .nav .e_j a{border-top:0; font-size:12px; color:#aaa; line-height:32px;}
.header .nav .e_j a:hover{background:none;}
.header .nav ul li:hover .e_j{display:none;}
.header .nav ul li a{font-size:15px; color:#fff;}

.header .nav ul li:hover span{width:0;}
.header .nav ul li.on span{width:0;}
}
@media only screen and (max-width:375px){
.header .container{ padding:0}
.header .logo{width:200px; margin:15px auto;}
.header.on .logo{width:200px; margin:15px auto;}
}

.ban{height: 100vh;width: 100%;position: relative;z-index: 9;}
.ban .mb{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.3);z-index: 60;}
.ban .mb .left {width: 50%;position: absolute;left: 0;top: 0;height: 100%;z-index: 60;display: flex;justify-content: center;align-items: center;}
.ban .mb .b_t{position: absolute;top: 50.5vh;
  right: 4.3rem;
  z-index: 3;}
.ban .mb .b_t img {max-width: 320px;display: block;}
.ban .mb .b_t h3{font-size: 0.6vw;color: #fff;letter-spacing: 1px;}
.ban .mb .b_t h1{font-size: 1.6vw;color: #fff;letter-spacing: 2px;margin-top: 10px;}

.ban img{width: 100%;height: 100%;display: block;object-fit: cover;}
#wrap{position:relative;width:640px;height:640px;z-index: 99999}
canvas{display:block;width:640px;height:640px;cursor:pointer}
#info{color:#0f0;margin-top:10px;font-size:12px;font-family:monospace;display: none}
.hint{color:#666;font-size:11px;margin-top:6px;display: none}

.gallery-top{width:100%; position:relative;}
.gallery-top .swiper-slide img{width:100%; height:auto; display:block;}
.gallery-top .swiper-pagination{bottom:20px !important;}
.gallery-top .swiper-pagination-bullet {width:15px; height:15px; display:inline-block; border-radius:0; opacity:1;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%;}
.gallery-top .swiper-pagination-bullet.swiper-pagination-bullet-active { background:#000}
.head {height: 120px;}
.head .logo{ position: absolute;left: 1.5rem;top: 34px;
transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;z-index: 25;}

.head .logo img{width:auto; height:53px; display:block;}
.head .l1{width: 62%;float: left;height: 120px;background: #b1b1b6;position: relative;}
.head .l1::after{width: 100%;height: 0;content: "";position: absolute;left: 0;bottom: 0;background: #3d3f4b;-webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s;}
.head .l1:hover::after{height: 100%;top: 0;}
.head a {display: block;width: 100%;height: 100%;position: relative;z-index: 6;}
.head .l2{width: 38%;float: right;height: 120px;}
.head .l2 .gy{height: 60px;background: #7c8391;position: relative;}
.head .l2 .gy::after{width: 100%;height: 0;content: "";position: absolute;left: 0;bottom: 0;background:rgba(0,0,0,0.3);-webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s;}
.head .l2 .gy:hover::after{height: 100%;top: 0;}
.head .l2 .slogo{height: 60px;width: 70%;float: left;background: #fff;display: flex;justify-content: center;align-items: center;}
.head .l2 .slogo a{text-align: center;display: flex;justify-content: center;align-items: center;}
.head .l2 .slogo img{width: auto;height:26px;display: block;}

.head .l2 .lx{height: 60px;width: 30%;float: left;background: #1a1b29;position: relative;}
.head .l2 .lx::after{width: 100%;height: 0;content: "";position: absolute;left: 0;bottom: 0;background:rgba(0,0,0,0.6);-webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s;}
.head .l2 .lx:hover::after{height: 100%;top: 0;}
.top_h {height: 80vh;position: absolute;left: 0;top: 0;}
.sy_p1 {position: relative;height:100vh;}
.list_a{position: absolute;right: 20px;top: 50px;width: 50px;height: 50px;z-index: 50;}
.list_a img{width: 50px;height: 50px;display: block;}
.sy_p1 .box {height:100vh;display: flex;position: relative;}
.sy_p1 .box .l1 {width: 65%;float: left;height: 100%;}
.sy_p1 .box .l1 .p1 {height: 33%;width: 100%;overflow: hidden;position: relative;}
.sy_p1 .m_b{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.3);}
.sy_p1 .m_b .zi{opacity: 0;position: absolute;left: 0;bottom: 0;padding:30px 25px;transition:all .5s;
-o-transition:all .5s;
-ms-transition:all .5s;
-moz-transition:all .5s;
-webkit-transition:all .5s;z-index: 9;}
.sy_p1 .n_r:hover .m_b {background: rgba(0,0,0,0);}
.sy_p1 .n_r:hover .zi {opacity: 1;}
.sy_p1 img{height: 100%;display: block;object-fit: cover;width: 100%;-webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;}
.sy_p1 .n_r:hover img{-webkit-transform:scale(1.07); -moz-transform:scale(1.07); -o-transform:scale(1.07); -ms-transform:scale(1.07); transform:scale(1.07); -webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;}
.sy_p1 .box .l1 .box1 {width: 55%;float: left;height: 67%;}
.sy_p1 .box .p2 {height:52%;width: 100%;overflow: hidden;position: relative;}
.sy_p1 .box .p3 {height:48%;width: 100%;overflow: hidden;position: relative;}
.sy_p1 .box .p5 {height:65%;width: 100%;overflow: hidden;position: relative;}
.sy_p1 .box .p6 {height:35%;width: 100%;overflow: hidden;position: relative;}
.sy_p1 .box .l1 .box2 {width: 45%;float: left;height: 67%;}
.sy_p1 .m_b h3 {font-size: 20px;font-weight: bold;color: #fff;line-height: 1.2;margin-bottom: 5px;}
.sy_p1 .m_b h4 {font-size: 22px;font-weight: 100;color: #fff;font-family: 'Montserrat';}
.sy_p1 .box .l2 {width: 35%;float: right;height: 100%;}
.sy_p1 .box .p7 {height:30%;width: 100%;overflow: hidden;position: relative;}
.sy_p1 .box .p8 {height:37%;width:60%;overflow: hidden;position: relative;float: left;}
.sy_p1 .box .p9 {height:37%;width:40%;overflow: hidden;position: relative;float: left;}
.sy_p1 .box .p10 {height:33%;width:100%;overflow: hidden;position: relative;}

.ny_list {padding: 60px 0;position: relative;z-index: 999;overflow: hidden;}
.ny_list .con{position: relative;}
.ny_list .list_a{position: absolute;right: 0px;top: 0;}
.ny_list .list_a img{filter: brightness(50%);}
.ny_tit{position: relative;z-index: 9;}
.ny_tit li {float: left;width: 180px;line-height: 40px;border: #eee 1px solid;position: relative;text-align: center;height: 42px;z-index: 9;}
.ny_tit li a {font-size: 14px;color: #333;}
.ny_tit li a img {width: 20px;vertical-align: middle;margin-right: 4px;}
.ny_tit li .y_j {position: relative;}
.ny_tit li .e_j {position: absolute;display: none;border: #eee 1px solid;left: 0;top: 40px;background: #fff;width: 100%;z-index: 99}
.ny_tit li:hover .e_j{display: block;}
.ny_tit li .e_j a{display: block;line-height: 40px;border-bottom: #eee 1px solid;}
.ny_zp{margin-top: 20px;overflow: hidden;position: relative;z-index: 1;}
.ny_zp ul li {width: 22%;margin: 1.5%;float: left;}
.ny_zp ul li .t_p {position: relative;overflow: hidden;padding-top: 60%;background: #000;z-index: 1}
.ny_zp ul li .t_p img{width: 100%;height: 100%;position: absolute;object-fit: cover;left: 0;top: 0;-webkit-transition:all 0.1s; -moz-transition:all 0.1s; -o-transition:all 0.1s; transition:all 0.1s;opacity: 0.5;z-index: 2;}
.ny_zp ul li:hover .t_p img{opacity: 1; -webkit-transition:all 0.1s; -moz-transition:all 0.1s; -o-transition:all 0.1s; transition:all 0.1s;}
.ny_zp ul li h3 {font-size: 18px;font-weight: bold;color: #444;line-height: 1.4;margin-bottom: 10px;margin-top: 15px;}
.ny_zp ul li h4 {font-size: 16px;font-weight: 100;color: #444;font-family: 'Montserrat';}

.zp_xq{padding: 50px 0 0;overflow: hidden;position: relative;}
.zp_xq .line1{position: absolute;top: 0px;width: 1px;background: #ccc;left: 5%;height: 100%;}
.zp_xq .line3{position: absolute;top: 0px;width: 1px;background: #ccc;right: 5%;height: 100%;}
.zp_xq .line2{position: absolute;top: 50px;width: 100%;background: #ccc;left:0%;height:1px;}
.zp_xq .line4{position: absolute;bottom: 50px;width: 100%;background: #ccc;left:0%;height:1px;}
.zp_xq .con{display: flex;justify-content: space-between;align-items: stretch;position: relative;width: 100%;max-width: 100%;}
.zp_xq .w_z{width: 36%;height: calc(100vh - 170px);padding-right: 50px;margin-left: 5%;background: url(../images/xqbj.jpg) center / 100% 100%;padding-top: 40px;padding-bottom: 100px;}
.zp_xq .w_z.xwxq{background: #fff;}
.zp_xq .w_z .swiper-container {
	        width: 100%;
	        height: 100%;
	    }
 .zp_xq .w_z .swiper-slide {
	        height: auto;padding-right: 30px;
	    }
 .zp_xq .w_z .swiper-scrollbar{opacity: 1 !important;}
.zp_xq .w_z h3 {font-size: 32px;font-weight: bold;line-height: 1.2;color: #fff;margin-bottom: 20px;padding-bottom: 15px;border-bottom: rgba(255,255,255,0.6) 1px solid;padding-left: 60px;}
.zp_xq .w_z.xwxq h3 {color: #898989;border-bottom: rgba(0,0,0,0.3) 1px solid;}

.zp_xq .w_z .text{font-size: 14px;color: #fff;line-height: 1.8;padding-left: 60px;}
.zp_xq .w_z.xwxq .text{font-size: 14px;color: #898989;line-height: 1.8;padding-left: 60px;}
.zp_xq .t_p{width: 60%;padding-bottom: 60px;position: absolute;top: 50%;right:0;transform: translateY(-50%);}
.zp_xq .t_p .swiper-container {
	       width: 100%;
        	height:50vh;
	    }

.zp_xq .t_p .swiper-slide { width: auto;}
.zp_xq .t_p img {width: auto;height: 100%;display: block;}
.zp_xq .sxp{width: 55%;position: absolute;right:2%;bottom: 0;padding: 5px 0;display: flex;justify-content: space-between;align-items: stretch;flex-wrap: wrap;padding-left: 30px;}
.zp_xq .sxp li {width: 100%;}
.zp_xq .sxp li a{color: #888;font-size:14px;}
.zp_xq .xwt_p{width: 62%;padding-bottom: 60px;padding-top: 40px; position: relative;display: flex;justify-content: center;align-items: center;height: calc(100vh - 250px);}
.zp_xq .gb {width: 24px;top: 0;right:8%;position: absolute;}
.zp_xq .gb img{width: 100%;}
.zp_xq .xwt_p img {max-width: 100%;display: block;max-height: 100%}


.ny_dt{margin-top: 20px;}
.ny_dt ul li {width: 47%;margin: 1.5%;float: left;}
.ny_dt ul li .t_p {position: relative;overflow: hidden;padding-top: 30%;}
.ny_dt ul li .t_p img{width: 100%;height: 100%;position: absolute;object-fit: cover;left: 0;top: 0;-webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;}
.ny_dt ul li:hover .t_p img{-webkit-transform:scale(1.07); -moz-transform:scale(1.07); -o-transform:scale(1.07); -ms-transform:scale(1.07); transform:scale(1.07); -webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;}
.ny_dt ul li h3 {font-size: 18px;font-weight: bold;color: #444;line-height: 1.4;margin-bottom: 10px;margin-top: 15px;}
.ny_dt ul li h4 {font-size: 16px;font-weight: 100;color: #444;font-family: 'Montserrat';}

.ny_gy1 {padding: 70px 0;border-bottom: #ccc 1px solid;overflow: hidden;}
.gy_bt{width: 300px;float: left;}
.gy_bt h1 {font-size: 42px;color: #555;font-weight: bold;line-height: 1.2;}
.gy_bt h3 {font-size: 30px;color: #555;font-weight: bold;line-height: 1.2;}
.gy_bt img{width: 100%;display: block;}
.gy_box {width: calc(100% - 400px);float: right;}
.jj{}
.jj h1{font-size:50px;color: #555;font-weight: bold;margin-bottom: 35px;}
  /* 悬停时触发切换动画 */
.jj h1:hover .char {
    animation: char-switch2 0.6s ease-in-out both;
  }
.jj h1 .char {
    display: inline-block;
   color: #555;
    will-change: transform, opacity;
  }

  /* 字符切换动画 */
  @keyframes char-switch2 {
    0%   { opacity: 1;    transform: translateY(0); }
    30%  { opacity: 0;    transform: translateY(-8px) scale(0.9); }
    31%  { opacity: 0;    transform: translateY(8px)  scale(0.9); }
    60%  { opacity: 1;    transform: translateY(0); }
    100% { opacity: 1;    transform: translateY(0); }
  }
  /* 切换时颜色也跟着变 */
  @keyframes color-switch2 {
    0%   { color: #555; }
    35%  { color: #ffd866; }
    65%  { color: #ff9a76; }
    100% { color: #555; }
  }

  /* 每个字符依次延迟，形成挨个切换的波浪 */
.jj h1:hover .char:nth-child(1)  { animation-delay: 0.000s; }
.jj h1:hover .char:nth-child(2)  { animation-delay: 0.080s; }
.jj h1:hover .char:nth-child(3)  { animation-delay: 0.160s; }
.jj h1:hover .char:nth-child(4)  { animation-delay: 0.240s; }
.jj h1:hover .char:nth-child(5)  { animation-delay: 0.320s; }
.jj h1:hover .char:nth-child(6)  { animation-delay: 0.400s; }
.jj h1:hover .char:nth-child(7)  { animation-delay: 0.480s; }
.jj h1:hover .char:nth-child(8)  { animation-delay: 0.560s; }
.jj h1:hover .char:nth-child(9)  { animation-delay: 0.640s; }
.jj h1:hover .char:nth-child(10)  { animation-delay: 0.000s; }
.jj h1:hover .char:nth-child(11)  { animation-delay: 0.080s; }
.jj h1:hover .char:nth-child(12)  { animation-delay: 0.160s; }
.jj h1:hover .char:nth-child(13)  { animation-delay: 0.240s; }
.jj h1:hover .char {color: #555;
    animation:
      char-switch2 0.6s ease-in-out both,
      color-switch2 0.6s ease both;
  }


.text{font-size: 18px;line-height: 2;color: #555;}
.ms {}
.ms ul{display: flex;justify-content: space-between;align-items: stretch;flex-wrap: wrap;margin-top: 50px;}
.ms ul li {width: 18%;text-align: center;transition: all 0.3s;-wbkit-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;}
.ms ul li .t_b {width:160px;max-width: 100%;margin-bottom: 30px;margin: 0 auto 30px;}
.ms ul li .t_b img{width:100%;display: block;}

.ms ul li h3 {font-size: 20px;color: #555;font-weight: bold;margin-bottom: 15px;}
.ms ul li:hover h3 {color: #222;}
.ms ul li p {font-size:16px;color: #555;font-weight: bold;}
.ms ul li:hover{transform: translateY(-5px);-wbkit-transform: translateY(-5px);-o-transform: translateY(-5px);-moz-transform: translateY(-5px);transition: all 0.3s;-wbkit-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;}
.jj .t_p{margin: 20px auto;}
.jj .t_p:hover img{transform: translateY(-5px);-wbkit-transform: translateY(-5px);-o-transform: translateY(-5px);-moz-transform: translateY(-5px);transition: all 0.3s;-wbkit-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;}
.jj .t_p img{max-width: 100%;display: block;transition: all 0.3s;-wbkit-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;}
.yy .swiper-container{margin-top: 50px;padding-bottom: 50px;}
.yy .swiper-slide {
	        width:auto;overflow: hidden;
	    }
.yy .swiper-slide .m_b {position: absolute;width: 100%;height: 100%;z-index: 5;background: rgba(0,0,0,0.4);opacity: 0;left: 0;top: 60%;-webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;display: flex;justify-content: center;align-items: center;}
.yy .swiper-slide .m_b p{font-size: 16px;padding: 20px;color: #fff;line-height: 1.8;}
.yy .swiper-slide:hover .m_b{opacity: 1;top: 0;background: rgba(0,0,0,0.65);}
.yy .swiper-slide img {height: 290px;width: auto;display: block;-webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;}
.yy .swiper-slide:hover img{-webkit-transform:scale(1.07); -moz-transform:scale(1.07); -o-transform:scale(1.07); -ms-transform:scale(1.07); transform:scale(1.07); -webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s; }
.yy .swiper-button-prev{width: 30px;height: 50px;background: url(../images/prev_off.png) center / 100% no-repeat;left: 0;top: 50%;margin-top: -25px;}
.yy .swiper-button-next{width: 30px;height: 50px;background: url(../images/next_off.png) center / 100% no-repeat;right: 0;top: 50%;margin-top: -25px;}
.ny_lx {padding: 70px 0;overflow: hidden;}
.ny_lx .con {display: flex;justify-content: space-between;align-items: center;}
.ny_lx .w_z{width: 38%;float: left;}
.ny_lx .w_z h1{font-size:50px;color: #555;font-weight: bold;margin-bottom: 35px;}
.ny_lx .s_m{font-size: 20px;color: #555;line-height: 1.8;margin-bottom:100px;}
.ny_lx .n_r {border-top: #ccc 1px solid;padding-top: 30px;font-size: 16px;color: #333;font-weight: bold;line-height: 35px;}
.ny_lx .l_y{width: 55%;}
.ny_lx .l_y h3{font-size: 24px;color: #555;font-weight: bold;margin-bottom: 20px;}
.ny_lx .l_y .input {
  width: 100%;box-sizing: border-box;
  border: 1px solid #eaeaea;
  background: #f0f0f0;
  padding: 14px 9px;
  font-size: 14px;
  line-height: 16px;
  height: 44px;margin-bottom: 15px;
}
.ny_lx .l_y .input.textarea {
  background: #f0f0f0;
  height: 148px;
  padding: 14px 119px 14px 9px;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
.ny_lx .l_y .sub-btn {
  width: 180px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  color: #fff;
  background: #666;
  font-size: 16px;
  margin-top: 25px;
}
.feedback {
    width: 700px; position:fixed; bottom:0;  z-index:9999999;
    right: -100%;
    box-shadow: 0 20px 40px 8px rgba(0, 0, 0, 0.25);
    font-size: 14px;
    border-radius: 10px 10px 0 0;background:url(../images/lybj.png) center / 100% 100%;padding: 15px 35px 20px; -webkit-transition:all 1s; -moz-transition:all 1s; -o-transition:all 1s; transition:all 1s;
}
.feedback.on {right: 0;-webkit-transition:all 1s; -moz-transition:all 1s; -o-transition:all 1s; transition:all 1s;}
.feedback .feedbackHeader {
    height: 40px;
    line-height: 40px;
    border-radius: 10px 10px 0 0;
    color: #ffffff;
    text-indent: 50px;
    font-weight: normal;
    cursor: pointer;
}
.feedback h2 {font-size: 26px;color: #fff;font-weight: bold;margin-bottom: 15px;margin-top: 15px;}
.feedback p {font-size: 14px;color: #fff;line-height: 1.4;}
.feedback .eMailIco {
    background: url("../images/emailIco.png") 16px center no-repeat ;
    background-size: 21px auto;
}

.feedbackForm {
    padding: 16px 0 20px 0;
}

.feedbackForm .tips {
    color: #fff;font-size: 18px;font-weight: bold;
    padding-bottom: 10px;border-bottom: #fff 1px solid;margin-bottom: 20px;
}

.feedbackForm .line {
    margin-bottom: 10px;
}

.feedbackForm .line input, .feedbackForm .line textarea {
    width: 100%;
    box-sizing: border-box;
    box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    border: solid 1px #ccc;
    color: #222d38;
    display: block;background: #fff;
}

.feedbackForm textarea {
    resize: none;
    height: 60px;
    padding: 11px;
    line-height: 20px;
}

.feedbackForm .line input {
    height: 35px;
    line-height: 35px;
    padding: 0 11px;
}

.feedbackForm .btn {
    background: #fff;
    border-radius: 4px;
    width:240px;float: right;
    box-sizing: border-box;
    border: none;
    height: 35px;
    line-height: 35px;
    color: #555;
    cursor: pointer;
}

.feedback .closeBtn {
    background: url("../images/gb2.png") center / 100% no-repeat;
    width: 28px;
    height: 28px;
    background-size: 28px 28px;
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}
.feedback .lxfs {}
.feedback .lxfs .b_t {padding-bottom: 10px;border-bottom: #fff 1px solid;margin-bottom: 10px;font-size: 20px;font-weight: bold;color: #fff;}
.feedback .lxfs .b_t .yw {font-size: 14px;}
.feedback .lxfs .n_r {font-size: 14px;line-height: 1.8;color: #fff;}

@media only screen and (max-width:1366px) {
	.head .l2 .slogo img {
  height:20px;
}
	.ny_zp ul li h3 {
  font-size: 16px;
}
	
}








@media only screen and (max-width:1024px) {
	.ban .nav ul .l1 {
  width: 100%;
  height: auto;
}
	.ban .an {
  top: 20px;
}
	.ban .nav .lo {
  width: 50px;
  height: 50px;
  top:15px;
  left: 1.5rem;
}
	.ban .nav ul {flex-wrap: wrap;padding-top: 80px;
}
	.ban .nav ul .l1 .dh_t {
  width: 100%;
  height:auto;
  position: static;
}
	.ban .nav ul .l1 .dh_t .dt {
  width: 100%;
  position: static;
  height:auto;
}
	.ban .nav ul .text {
  height:120px;
  padding: 10px 20px;
}
	.ban .nav ul .l1 .dh_t .gy {
  width: 100%;
  position: static;
  height: auto;
}
	.ban .nav ul .l1 .dh_b {
  height:auto;
  position: static;
}
	.ban .nav ul .l1 .dh_b::before {display: none
}
	.ban .nav ul .text .zi {
  opacity:1;
}
	.ban .nav ul .text h3 {
  font-size: 1.6rem;
}
	.ban .nav ul .text h4 {
  font-size:1.2rem;
}
	.ban .nav ul .l1 .dh_b li {
  width: 100%;
}
	.ban .nav ul .l2 {
  width: 100%;
  height: auto;
  padding-bottom: 0;
}
	
	
	.ban .mb .left {
  width: 100%;
  height: 50%;
}
	
	.ban .mb .b_t {
  top: 60vh;left: 50%;
  right:auto;transform:translate(-50%,0);
-webkit-transform:translate(-50%,0);
-moz-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
-o-transform:translate(-50%,0);
}

.container { width: 94%; margin: 0 auto;-moz-box-sizing: border-box; /*Firefox3.5+*/-webkit-box-sizing: border-box; /*Safari3.2+*/-o-box-sizing: border-box; /*Opera9.6*/-ms-box-sizing: border-box; /*IE8*/box-sizing: border-box;}
	.head .l1 {
  width: 50%;
  height: 90px;
}
	.head .logo {
  left: 1.5rem;
  top: 15px;
}
	.head {
  height: 90px;
}
	.head .l2 {
  width: 50%;
  height: 90px;
}
	.head .l2 .gy {
  height: 45px;
}
	.head .l2 .slogo {
  height: 45px;
}
	 .head .l2 .slogo img {
    height: 16px;
  }
	.list_a img {
  width: 30px;
  height:30px;
}
	.head .l2 .lx {
  height: 45px;
}
	.ny_zp ul li {
  width: 47%;
}
	.gy_bt {
  width: 200px;
}
	.gy_box {
  width: calc(100% - 220px);
}
	.gy_bt h1 {
  font-size:25px;
}
	.gy_bt h3 {
  font-size: 18px;
}
	.jj h1 {
  font-size: 24px;margin-bottom: 20px;
}
	.text {
  font-size: 16px;
}
	.ms ul li h3 {
  font-size: 16px;
}
	.ms ul li {
  width: 32%;margin-bottom: 15px
}
	.zp_xq .w_z {
  width: 100%;
  height:auto;
  padding-right:30px;
  margin-left: 0;
  padding-top: 30px;padding-left: 30px;
  padding-bottom: 50px;
}
	.zp_xq .w_z h3 {
  font-size: 24px;
  padding-left: 0px;
}
	.zp_xq .w_z .text {
  padding-left:0px;
}
	.zp_xq .con {flex-wrap: wrap
}
	.zp_xq {
  padding:40px 0 0;
}
	.zp_xq .t_p {
  width: 100%;
  padding-bottom: 60px;
  position: static;
  transform: translateY(0%);
}
	.zp_xq .sxp {
  width: 96%;
  position: absolute;
  right: 2%;
  bottom: 0;
  padding: 15px 0;
  padding-left: 0px;
}
	.zp_xq .t_p img {
  height:300px;
}
	.zp_xq .t_p .swiper-container {
  height: auto;
}
	.zp_xq .w_z .swiper-slide {
  padding-right: 0px;
}
	.zp_xq .line1{left: 2%;}
.zp_xq .line3{right: 2%;}
	.zp_xq .w_z.xwxq .text {
  padding-left: 0px;
}
	.zp_xq .xwt_p {
  width: 100%;
  padding-bottom: 60px;
  padding-top: 20px;
  height: auto;
}
	.yy .swiper-container {
  margin-top:30px;
  padding-bottom: 30px;
}
	.ny_lx .w_z h1 {
  font-size: 30px;
  margin-bottom:20px;
}
	.ny_lx .con {flex-wrap: wrap;
}
	.ny_lx .w_z {
  width: 100%;margin-bottom: 40px;
}
	.ny_lx .s_m {
  font-size: 15px;
  margin-bottom:30px;
}
	.ny_lx .l_y {
  width: 100%;
}
	

  }

@media only screen and (max-width:600px){
	
	.ban .nav ul .l1 .dh_t .slogo img {
  height: 1.4rem;
}
	 .ban .nav ul .text {
    height: 100px;
  }
	canvas {
  width:320px;
  height:320px;
}

.tit {margin-bottom:30px;}
.tit h1 {font-size:2.5rem;}
.feedback {
  width: 100%;
 
  padding: 10px 20px 20px;
}
	.head .l2 .slogo img {
    height: auto;max-width: 90%;width: 100%
  }
	.sy_p1 .box .p8 {
  height: 50%;
  width: 50%;float: left
}
	.sy_p1 .box .l1 {
  width: 100%;
  height: 60%;
}
	.sy_p1 .box .l2 {
  width: 100%;
  height: 40%;
}
	.sy_p1 .box {
  height: 100vh;flex-wrap: wrap;
}
	.sy_p1 .box .p7 {
  height: 50%;
  width: 50%;float: left;
}
	.sy_p1 .box .p9 {
  height: 50%;
  width:50%;float: left;
}
	.sy_p1 .box .p10 {
  height: 50%;
  width:50%;
}
	.sy_p1 .m_b .zi {
  padding: 15px 15px;
}
	.sy_p1 .m_b h3 {
  font-size: 1.3rem;
}
	.sy_p1 .box .p5 {
  height: 50%;
}
	.sy_p1 .box .p6 {
  height: 50%;
}
	.sy_p1 .m_b h4 {
  font-size:14px;
}
	.list_a {
  right: 10px;
  top: 20px;
  width: 30px;
  height: 30px;
}
.ny_list {
  padding: 40px 0;

}
	.ny_tit li {
  width: 44%;
}
	.ny_dt ul li {
  width: 100%;
  margin:0 0 3%;
}
	.feedback p {display: none
}
	.feedback h2 {
  font-size: 20px;
  margin-bottom: 5px;
  margin-top: 10px;
}
	.feedback .lxfs .b_t {
  font-size:16px;margin-top: 10px;
}
	.feedbackForm .btn {
  width: 100%;
}
	.feedbackForm .line input {
  height: 30px;
  line-height: 30px;
}
	.ny_gy1 {
  padding: 40px 0;
}
	 .gy_bt {
    width: 100%;
  }
	.gy_bt img {
  width: 30%;
}
	 .gy_box {
    width:100%;margin-top: 30px
  }
	.ms ul {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
	 .ms ul li {
    width: 31.3333%;margin: 0 1% 20px;
  }
	.ms ul li p {
  font-size: 12px;
}
	.yy .swiper-slide img {
  height: 180px;
}
	.zp_xq .sxp li {
  width: 100%;
}
	 .zp_xq .t_p {
    padding-bottom: 70px;
  }
	.zp_xq .line4 {
  bottom: 70px;
}
	  .zp_xq .t_p img {
    height: 20rem;
  }
	.ny_lx {
  padding:30px 0;
}
	.ny_lx .w_z h1 {
    font-size:24px;
  }
	.ny_lx .n_r {
  font-size:14px;
  line-height:26px;
}
	
	.con {
  max-width: 90%;
}
	
	
	
	
	
	
	
	
	
	
	
	
	
}