/* 引入外部图标样式 */
@font-face {
  font-family: 'iconfont';  /* Project id 3606432 */
  src: url('http://at.alicdn.com/t/c/font_3606432_n8kfvxk6g9.woff2?t=1672815818469') format('woff2'),
       url('http://at.alicdn.com/t/c/font_3606432_n8kfvxk6g9.woff?t=1672815818469') format('woff'),
       url('http://at.alicdn.com/t/c/font_3606432_n8kfvxk6g9.ttf?t=1672815818469') format('truetype');
}
.iconfont{
  font-family:"iconfont" !important;
  font-size:16px;font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
/*Css Reset*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;font-weight:normal;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul,li{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}a{color:#7e8c8d;text-decoration:none;-webkit-backface-visibility:hidden}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,0.2);-webkit-border-radius:6px}::-webkit-scrollbar-thumb:vertical{height:5px;background-color:rgba(125,125,125,0.7);-webkit-border-radius:6px}::-webkit-scrollbar-thumb:horizontal{width:5px;background-color:rgba(125,125,125,0.7);-webkit-border-radius:6px}html,body{width:100%;font-family:"Arial","Microsoft YaHei","微软雅黑","黑体","宋体",sans-serif}body{line-height:1;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html{overflow-y:scroll}.clearfix:before,.clearfix:after{content:" ";display:inline-block;height:0;clear:both;visibility:hidden}.clearfix{*zoom:1}.dn{display:none;}.fl{float:left;}.fr{float:right;}
html,body{ overflow:hidden;overflow-y:auto; font-family: "Microsoft YaHei"; }
/*界说响应宽度*/
@media screen and (max-width:320px) {  html { font-size:50%;}}
@media screen and (min-width:320px) {  html { font-size:50%;}}
@media screen and (min-width:414px) {  html { font-size:66%;}}
@media screen and (min-width:567px) {  html { font-size:86%;}}
@media screen and (min-width:750px) {  html { font-size:100%;}}

body{ --zhu-color:#03326c; --pei-color:#dc001d; }
.wraper{ min-width:3.8rem; max-width:750px; margin:0 auto; overflow:hidden; position:relative;} /*网站首页宽度*/
.inner{ overflow: hidden; width: 100%; box-sizing: border-box; padding:0 0.75rem; }
button:active, button:focus, input:active, input:focus, textarea:active, textarea:focus{ border:none; outline:0; }

/* 字体 */
@font-face{ font-family: HYC; src: url('/static/index/zm001/css/fonts/HYC.ttf'); }
@font-face{ font-family: JN; src: url('/static/index/zm001/css/fonts/JN.otf'); }
@font-face{ font-family: PMZD; src: url('/static/index/zm001/css/fonts/PMZD.ttf'); }

/* h_top */
.h_top{ position: fixed; top:0; left:50%; width: 750px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); padding:1.25rem 0; overflow: hidden; z-index: 999; }
.h_top .inner{ display: flex; align-items: center; justify-content: space-between; padding:0 1.2rem; }
.h_top .logo{ display: inline-flex; width:26%; align-items: center; justify-content: flex-start; }
.h_top .logo img{ max-width: 100%; }



.h_top .right{ display: -ms-flexbox; display: -webkit-box; display: flex; align-items: center; }

.h_top .searchBtn{ color: #fff; font-size: 4rem; font-weight: bold; width: 3rem; height: 4.8rem; cursor: pointer; display: -ms-flexbox; display: -webkit-box; display: flex; align-items: center; justify-content: center; margin-right: 1rem; }
.h_top .searchBtn .iconfont{ color: #fff; font-size: 2rem; }
.h_top .searchBtn .icon-search { display: block; }
.h_top .searchBtn .icon-x{ display: none; color: #333; }
.h_top .searchBtn.on .icon-search { display: none; }
.h_top .searchBtn.on .icon-x { display: block; }


.h_top .menuBtn span { width: 3rem; height: 3rem; display: block; position: relative; }
.h_top .menuBtn em { position: absolute; left: 0; top: calc(10 / 30 * 100%); width: 100%; height: 0.1rem; background-color: #fff; -webkit-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; -webkit-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s; }
.h_top .menuBtn .s1 { top: calc(10 / 30 * 100%); }
.h_top .menuBtn .s2 { top: calc(20 / 30 * 100%); }
.h_top .menuBtn.on .s1 { background-color: #333; top: 50%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.h_top .menuBtn.on .s2 { background-color: #333; top: 50%; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.showSearch .menuBtn{ display: none; }

.menuBox { position: fixed; z-index: 8; left: 0; right: 0; top: 0; bottom: 0; padding-top: 7.2rem; opacity: 0; visibility: hidden; }
.menuBox.show::before { -webkit-transition: 1s; -ms-transition: 1s; transition: 1s; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
.menuBox.show { opacity: 1; visibility: visible; z-index: 99; }
.menuBox.show .nav_m .v1 { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.3s 0.8s ease-in-out; -ms-transition: 0.3s 0.8s ease-in-out; transition: 0.3s 0.8s ease-in-out; }
.menuBox.show .nav_m li:nth-child(1) .v1 { transition-delay: 0.8s; }
.menuBox.show .nav_m li:nth-child(2) .v1 { transition-delay: 0.9s; }
.menuBox.show .nav_m li:nth-child(3) .v1 { transition-delay: 1s; }
.menuBox.show .nav_m li:nth-child(4) .v1 { transition-delay: 1.1s; }
.menuBox.show .nav_m li:nth-child(5) .v1 { transition-delay: 1.2s; }
.menuBox.show .nav_m li:nth-child(6) .v1 { transition-delay: 1.3s; }
.menuBox.show .nav_m li:nth-child(7) .v1 { transition-delay: 1.4s; }
.menuBox.show .nav_m li:nth-child(8) .v1 { transition-delay: 1.5s; }
.menuBox.show .nav_m li:nth-child(9) .v1 { transition-delay: 1.6s; }
.menuBox::before { content: ''; position: absolute; z-index: 1; left: 50%; top: 50%; width: 150vh; height: 150vh; -webkit-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; margin: -75vh 0 0 -75vh; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); background-color: #fff; }
.menuBox .nav_m { position: relative; z-index: 2; height: 100%; overflow-y: auto; padding: 2rem 0; border-top: 1px solid #dadada; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
.menuBox .nav_m.opening .v1 { color: #999; transition-delay: 0s !important; }
.menuBox .nav_m.opening .v1 a { color: #999; }
.menuBox .nav_m.opening .active .v1 { color: #333; transition-delay: 0s !important; }
.menuBox .nav_m.opening .active .v1 a { color: #333; }
.menuBox .nav_m.opening .active .v1 i { -webkit-transform: scale(0.6) rotate(90deg); -ms-transform: scale(0.6) rotate(90deg); transform: scale(0.6) rotate(90deg); }
.menuBox .nav_m .v1 { color: #333; font-size: 2rem;  padding: 1.5rem 2rem; opacity: 0; visibility: hidden; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); display: -ms-flexbox; display: -webkit-box; display: flex; align-items: center; justify-content: center; }
.menuBox .nav_m .v1 a { color: #111111; }
.menuBox .nav_m .v1 i { opacity: 0.4; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6); -webkit-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }
.menuBox .nav_m .s1 { color: #333; }
.menuBox .nav_m .sub { font-size: 0.28rem; padding: 0.3rem 25px; padding-right: 0; background-color: #f7f7f7; display: none; }
.menuBox .nav_m .sub ul { display: -ms-flexbox; display: -webkit-box; display: flex; flex-wrap: wrap; }
.menuBox .nav_m .sub li { white-space: nowrap; margin: 0.1rem 0.3rem 0.1rem 0; }

.searchBox { width: 750px; position: fixed; z-index: 8; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); right: 0; top: 0; bottom: 0; background-color: #fff; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; opacity: 0; visibility: hidden; padding-top: 7.2rem; }
.searchBox .cont { flex: 1; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; justify-content: center; align-items: center; border-top: 1px solid #dadada; overflow: hidden; }
.searchBox .cont .cont_box { max-width: 750px; margin: 0 0.625rem; padding: 1.25rem 0; }
.searchBox .cont .title { font-size: 2.4rem; line-height: 1.25; text-align: center; margin-bottom: 1.25rem; }

.searchBox .cont .form { height: 1.75rem; position: relative; background-color: #f5f4f4; padding:1.5rem 2.4rem; border-radius: 2.5rem; display: -ms-flexbox; display: -webkit-box; display: flex; align-items: center; }
.searchBox .cont .form .search_text{ border:0; background: none; }
.searchBox .cont .form .search_btn{ border:0; font-size: 0.75rem; color: #a0a0a0; line-height: 1; }
.searchBox .cont .form span{ display: inline-block; padding:0 0.6rem; }


.searchBox .title,
.searchBox .txt, .searchBox .form{ opacity: 0; visibility: hidden; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); }
.searchBox .txt{ margin:1rem 0; }
.searchBox .txt b{ font-size: 1.5rem; color: #333333; line-height: 1; margin-bottom: .5rem; display: block; }
.searchBox .txt b span{ font-size: 1.5rem; margin-right: .5rem; }
.searchBox .txt div{ padding:0 1.5rem; }
.searchBox .txt div a{ font-size: 1.3rem; color: #a5a4a4; line-height: 1; margin:0 .5rem; }
.searchBox.show { opacity: 1; visibility: visible; z-index: 99; }
.searchBox.show .title,
.searchBox.show .txt,
.searchBox.show .form { opacity: 1; visibility: visible; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition: all 0.8s; -ms-transition: all 0.8s; transition: all 0.8s; }
.searchBox.show .title { transition-delay: 0.1s; }
.searchBox.show .form { transition-delay: 0.4s; }
.searchBox.show .txt { transition-delay: 0.7s; }

.scrolledDown{ background: #ffffff; }
.scrolledDown .searchBtn .iconfont{ color: #333333; }
.scrolledDown .menuBtn em{ background-color: #333333; }
@media only screen and (max-width: 750px){
  .h_top{ width: 100%; }
  .searchBox { width: 100%; }
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

.list{ padding:2rem 0; }
.l-title{ text-align: center; margin-bottom: 2rem; }

/* h_menu */
.h_menu{ background: var(--zhu-color); display: flex; align-items: center; justify-content: space-between; }
.h_menu li{ width: 12.5%;  }
.h_menu li a{ font-size: 0.9rem; padding:0.9rem 0; color: #fbfbfd; width: 100%; display: inline-flex; align-items: center; justify-content: center; transition: all .3s; }
.h_menu li a:hover{ transition: all .3s; background: var(--pei-color); }
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/*banner*/
#banner{ width: 100%; position: relative; z-index: 1; }
#banner img{ max-width: 100%; }
#banner .swiper-button-next, #banner .swiper-button-prev{ background-image: none; width: 2.2rem; height: 2.2rem; }
#banner .swiper-button-next span, #banner .swiper-button-prev span{ font-size: 2.2rem; font-weight: 200; color: #ffffff; }
@media only screen and (max-width: 576px){
  #banner .swiper-button-next:after, #banner .swiper-button-prev:after{ font-size: 24px; }
}
@media only screen and (max-width: 414px){
  #banner .swiper-button-next:after, #banner .swiper-button-prev:after{ font-size: 18px; }
}
#banner .swiper-pagination { z-index: 9; bottom: 40px; }
#banner .swiper-pagination .dot { width: 21px; height: 21px; background-color: transparent; -webkit-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; opacity: 1; margin: 0 0.1rem; display: inline-block; position: relative; }
#banner .swiper-pagination .dot::before { content: ''; position: absolute; width: 4px; height: 4px; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #fff; -webkit-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; }
#banner .swiper-pagination .dot svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; fill: none; stroke: #fff; stroke-miterlimit: 10; stroke-width: 2px; }
#banner .swiper-pagination .dot svg path { opacity: 0; }
#banner .swiper-pagination .dot svg path.path-loop-bg { opacity: 0.2; }
#banner .nextPage{ color: #fff; position: absolute; left: 50%; bottom: 0; z-index: 1; width: 40px; height: 40px; margin-left: -20px; display: -ms-flexbox; display: -webkit-box; display: flex; align-items: center; justify-content: center; -webkit-animation: movepoint 1s infinite ease-in-out; -ms-animation: movepoint 1s infinite ease-in-out; animation: movepoint 1s infinite ease-in-out; }
@-webkit-keyframes movepoint {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
  50% {
    opacity: 0.6;
    -webkit-transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}


/* navbar_nav */
.navbar_nav{ position: fixed; z-index: 99999; display: flex; height: 5.4rem; align-items: center; justify-content: space-between; left:50%; bottom:0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 750px; background: #202022; }
.navbar_nav li{ width: 25%; height: 100%; }
.navbar_nav li a{ height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; transition: all .3s; }
.navbar_nav li span{ font-size: 2rem; color: #ffffff; line-height: 1; transition: all .3s; }
.navbar_nav li small{ font-size: 0.8rem; color: #ffffff; line-height: 1; margin-top: 0.5rem; transition: all .3s; }
.navbar_nav li a:hover span{ transition: all .3s; color: var(--zhu-color); }
.navbar_nav li a:hover small{ transition: all .3s; color: var(--zhu-color); }
@media only screen and (max-width: 750px){
  .navbar_nav{ width:100%; }
}

/* m_about */
.m_about{ overflow: hidden; padding:2rem 0 0; position: relative; }
.m_about .info{ width: 100%; overflow: hidden; }
.m_about .info span{ font-size: 2rem; color: var(--zhu-color); line-height: 1; }
.m_about .info b{ display: block; margin:0.75rem 0 1.05rem; font-size: 2rem; color: var(--zhu-color); font-weight: bold; line-height: 1; }
.m_about .info p{ font-size: 1rem; color: var(--zhu-color); line-height: 1.7; }
.m_about .info a{ margin-top: 0.75rem; overflow: hidden; display: inline-flex; text-transform: uppercase; padding:0.75rem 1.25rem; background: var(--pei-color); position: relative; align-self: end; }
.m_about .info a::before{ content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; left:0; top:0; background: #008bd2; transform: rotate(-90deg); transform-origin:0 100%; transition: all .3s; }
.m_about .info a small{ position: relative; line-height: 1; font-size: .8rem; color: #ffffff; }
.m_about .info a:hover::before{ transition: all .3s; transform: rotate(0); transform-origin:0 100%; }
.m_about .img{ width: 100%; position: relative; margin:1rem 0 0; }
.m_about .img::before{ content: "ABOUT"; position: absolute; right:0.75rem; top:-1rem; line-height: 1; font-size: 10rem; color: rgba(3, 50, 108, .05); text-transform: uppercase; letter-spacing: 0.05rem; font-weight: bold; }
.m_about .img img{ max-width: 100%; }
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* m_video */
.m_video{ overflow: hidden; position: relative; width: 100%; }
.m_video .imgs{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-direction:column; position:absolute; overflow:hidden; height:100%; width:100%; }
.m_video .imgs .imgs_up, .m_video .imgs .imgs_low{ position: relative; z-index: 3; height:50%; width:100%; transition:all 2s; object-fit: cover; }
.m_video .imgs .imgs_up.tst, .m_video .imgs .imgs_low.tst{ transition:all 10s; }
.m_video .imgs .imgs_up.on{ transform:translateY(-500%); }
.m_video .imgs .imgs_low.on{ transform:translateY(500%); }
.m_video #video{ width: 100%; }
.m_video #intro_video{ width: 100%!important; height: 36rem!important; }
.jw-error .jw-preview, .jw-stretch-uniform .jw-preview, .jwplayer .jw-preview{ background-size: cover!important; }
/* #intro_video video{ object-fit: cover!important; } */
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* m_product */
.m_product{ width: 100%; background: var(--zhu-color); overflow: hidden; display: flex; flex-direction: column; }
.m_product .img, .m_product .txt{ width: 100%; overflow: hidden; }
.m_product .img{ width: 100%; overflow: hidden; }
.m_product .img img{ width: 100%; object-fit: cover; transition: all .3s; }
.m_product .txt{ display: flex; box-sizing: border-box; padding:1.25rem; flex-direction: column; align-items: flex-start; justify-content: center; }
.m_product .txt b{ display: block; font-size: 2.5rem; font-weight: bold; color: #ffffff; line-height: 1; text-transform: capitalize; }
.m_product .txt p{ font-size: 1.6rem; margin: 0.9rem 0; color: #ffffff; line-height: 1.5; }
.m_product .txt a{ margin-top: 1rem; overflow: hidden; display: inline-flex; text-transform: uppercase; padding:0.8rem 1.5rem; background: var(--pei-color); position: relative; align-self: end; }
.m_product .txt a::before{ content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; left:0; top:0; background: #008bd2; transform: rotate(-90deg); transform-origin:0 100%; transition: all .3s; }
.m_product .txt a small{ position: relative; line-height: 1; font-size: 1rem; color: #ffffff; }
.m_product .txt a:hover::before{ transition: all .3s; transform: rotate(0); transform-origin:0 100%; }
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* m_case */
.m_case{ overflow: hidden; border-top: 0.25rem solid #fbfbfd; }
.m_case .hd{ border-bottom: 0.1rem dashed #8198b5; width: 100%; display: flex; align-items: center; justify-content: space-between; padding:0.75rem 0; }
.m_case .hd .tit b{ font-size: 2rem; font-weight: bold; color: var(--zhu-color); line-height: 1; }
.m_case .hd .tit b span{ color: var(--pei-color); font-weight: bold; }
.m_case .hd .tit p{ margin-top: 0.7rem; padding-left: 6.85rem; font-size: 1rem; color: var(--zhu-color); line-height: 1; position: relative; }
.m_case .hd .tit p::before{ content: ""; display: inline-block; width: 6rem; height: 0.05rem; background: var(--zhu-color); border: 0; position: absolute; left:0; top:50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.m_case .hd > a{ display: inline-flex; padding:0.5rem 1.6rem; border:0.05rem solid var(--zhu-color); transition: all .3s; overflow: hidden; position: relative; }
.m_case .hd > a::before{ content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; left:0; top:0; background: var(--pei-color); transform: rotate(-90deg); transform-origin:0 100%; transition: all .3s;  }
.m_case .hd > a small{  line-height: 1; font-size: 1rem; color: var(--zhu-color); transition: all .3s; position: relative; }
.m_case .hd > a:hover{ transition: all .3s; border-color: var(--pei-color); }
.m_case .hd > a:hover small{ transition: all .3s; color: #ffffff; }
.m_case .hd > a:hover::before{ transition: all .3s; transform: rotate(0); transform-origin:0 100%; }
.m_case .bd{ width: 100%; overflow: hidden; padding:0.75rem 0; }
#case{ overflow: hidden; }
#case a{ display: flex; flex-direction: column; }
#case a .info{ width: 100%; }
#case a .info b{ display: block; font-weight: normal; font-size: 1.8rem; color: var(--zhu-color); line-height: 1; margin-top: 0.375rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#case a .info p{ font-size: 1rem; color: var(--zhu-color); line-height: 1.875; margin:0.5rem 0; }
#case a .img{ width: 100%; padding-bottom: 60%; position: relative; overflow: hidden; }
#case a .img img{ width: 100%; height: 100%; object-fit: cover; position: absolute; }
@media only screen and (max-width: 576px){
  .m_case .hd .tit p{ padding-left: 5.85rem; }
  .m_case .hd .tit p::before{ width: 5rem; }
}
@media only screen and (max-width: 414px){
  .m_case .hd .tit p{ padding-left: 4.85rem; }
  .m_case .hd .tit p::before{ width: 4rem; }
}

/* m_tit */
.m_tit{ margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; }
.m_tit .tit{ overflow: hidden; }
.m_tit .tit b{ font-size: 2rem; font-weight: bold; color: var(--zhu-color); line-height: 1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.m_tit .tit p{ font-size: 1rem; color: var(--zhu-color); line-height: 1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top: 0.5rem; }
.m_tit > a{ display: inline-flex; padding:0.5rem 1.6rem; border:0.05rem solid var(--zhu-color); transition: all .3s; overflow: hidden; position: relative; }
.m_tit > a::before{ content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; left:0; top:0; background: var(--pei-color); transform: rotate(-90deg); transform-origin:0 100%; transition: all .3s;  }
.m_tit > a small{  line-height: 1; font-size: 1rem; color: var(--zhu-color); transition: all .3s; position: relative; }
.m_tit > a:hover{ transition: all .3s; border-color: var(--pei-color); }
.m_tit > a:hover small{ transition: all .3s; color: #ffffff; }
.m_tit > a:hover::before{ transition: all .3s; transform: rotate(0); transform-origin:0 100%; }
@media only screen and (max-width: 576px){
  .m_tit .tit{ width: calc(100% - 12rem); }
}
@media only screen and (max-width: 414px){
}

/* m_news */
.m_news{ overflow: hidden; padding:0.75rem 0; background: #fbfbfd; }
.m_news .bd{ width: 100%; display: flex; align-items: center; justify-content: space-between; }
.m_news .left{ width: 100%; }
.m_news .left a{ transition: all .3s; display: flex; align-items: center; justify-content: space-between; padding:0.5rem 0; border-bottom: 0.05rem solid #dde3e9; }
.m_news .left a > span{ margin-right: 0.5rem; display: inline-block; padding:0.5rem; font-family: "impact"; color: #e1e6ec; line-height: 1; font-size: 5rem; }
.m_news .left .tit{ width: 100%; display: flex; align-items: center; justify-content: space-between; }
.m_news .left .tit span{ transition: all .3s; text-align: right; display: inline-block; width: 20%; font-size: 1rem; color: #333333; line-height: 1;  }
.m_news .left .tit b{ transition: all .3s; color: #333333; display: flex; align-items: center; width: 80%; font-weight: normal; font-size:1.5rem; line-height: 1; overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.m_news .left p{ font-size: 1rem; color: #333333; line-height: 1.5; margin-top: 0.5rem; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.m_news .left a:hover{ transition: all .3s; }
.m_news .left a:hover span{ color: var(--zhu-color); transition: all .3s; }
.m_news .left a:hover b{ color: var(--zhu-color); transition: all .3s; }
@media only screen and (max-width: 576px){
  .m_news .left .tit span{ width: 30%; }
  .m_news .left .tit b{ width: 70%; }
}
@media only screen and (max-width: 414px){
}

/* m_qa */
.m_qa{ overflow: hidden; padding:0.75rem 0; background: #fbfbfd; }
#qa{ overflow: hidden; padding-bottom: 1.5rem; }
#qa a{ display: block; width:100%; }
#qa a .img{ width: 100%; padding-bottom: 45%; position: relative; overflow: hidden; }
#qa a .img img{ width: 100%; height: 100%; object-fit: cover; transition: all .3s; position: absolute; }
#qa a .txt{ box-sizing: border-box; padding:0.5rem 0; }
#qa a .txt b{ font-weight: normal; display: block; padding:0.5rem 0; line-height: 1; font-size: 1.6rem; color: #333333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#qa a .txt p{ display: block; text-indent: -2em; line-height: 1.8; font-size: 1rem; color: #333333; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
#qa a:hover img{ transition: all .3s; transform: scale(1.05); }
#qa a:hover b{ transition: all .3s; color: var(--zhu-color); }
#qa a:hover p{ transition: all .3s; color: #000; }
@media only screen and (max-width: 576px){
  #qa{ padding-bottom: 2rem; }
}
@media only screen and (max-width: 414px){
  #qa{ padding-bottom: 2.5rem; }
}

/* m_msg */
.m_msg{ position: relative; overflow: hidden; padding:1.5rem 0; background: url(/static/index/zm001/images/msg_bg.jpg) no-repeat top center; background-attachment: fixed; }
.m_msg::before{ content: ""; display: block; width: 100%; height: 100%; background: rgba(3, 50, 108, .9); position: absolute; top:0; left:0; }
.m_msg .inner{ position: relative; display: flex; align-items: center; justify-content: space-between; }
.m_msg .team{ width: 100%; overflow: hidden; }
.m_msg .team p{ font-size: 1.6rem; color: #ffffff; line-height: 1; }
.m_msg .team b{ margin-top: 1.2rem; display: block; font-size: 2rem; font-weight: bold; color: #ffffff; line-height: 1; }
.m_msg .team > span{ display: block; margin-top: 1rem; font-size: 1.2rem; color: #ffffff; line-height: 1; }
.m_msg .team .tel{ margin-top: 2rem; display: inline-flex; align-items: center; }
.m_msg .team .tel a{ margin-right: 0.75rem; line-height: 1; font-size: 1rem; color: var(--zhu-color); display: inline-flex; padding:0.45rem 1rem; background: #ffffff; align-items: center; border-radius: 0.2rem; }
.m_msg .team .tel a span{ display: inline-block; font-size: 1.2rem; line-height: 1; color: var(--zhu-color); margin-right: 0.3rem; }
.m_msg .team .tel > div{ display: inline-flex; align-items: center; font-weight: bold; font-size: 1.4rem; color: #ffffff; line-height: 1; }
.m_msg .team .tel > div span{ display: inline-flex; width: 2.2rem; height: 2.2rem; margin-right: 0.5rem; background: var(--pei-color); border-radius: 50%; align-items: center; justify-content: center; font-size: 1rem; color: #ffffff; line-height: 1; }
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* footer */
.footer{ background: #191919; overflow: hidden; position: relative; z-index: 33; padding-bottom: 6rem; }
.f_info{ display: flex; flex-direction: column; align-items: center; justify-content: center; padding:1rem 0; }
.f_info p, .f_info p a{ text-align: center; font-size: 1.4rem; line-height: 2; color: #666666; transition: all .3s; }
.f_info p a:hover{ transition: all .3s; color: var(--pei-color); }
.f_info p span{ font-size: 1.4rem; color: #605e5e; margin-right: 0.4rem; }
.f_info p span + span{ margin-left: 1.2rem; }
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* main */
.main{ overflow: hidden; box-sizing: border-box; padding:1.5rem 0; }
.article{ overflow: hidden; }
.article p{ font-size: 0.6rem; color: #1d1d1f; line-height: 1.8; }
.company p + p{ margin-top: 0.8rem; }
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* company_tit */
.company_tit{ display: flex; flex-direction: column; }
.company_tit span{ font-size: 5.65rem; color: rgba(0,0,0,.05); line-height: 0.75; font-weight: bold; text-transform: uppercase; }
.company_tit p{ margin-top:-2.85rem; font-size: 1.15rem; color: #1d1d1f; line-height: 1; }
.company_tit b{ font-size: 1.8rem; font-weight: bold; color: #1d1d1f; line-height: 1; margin: 0.65rem 0; }

/* single_tit */
.single_tit{ display: flex; align-items: center;  flex-direction: column; }
.single_tit span{ font-size: 5.65rem; color: rgba(0,0,0,.05); line-height: 0.75; font-weight: bold; text-transform: uppercase; }
.single_tit p{ margin-top:-2.85rem; font-size: 1.15rem; color: #1d1d1f; line-height: 1; }
.single_tit b{ font-size: 1.8rem; font-weight: bold; color: #1d1d1f; line-height: 1; margin: 0.65rem 0; }
.single_tit b small{ font-size: 100%; color: var(--zhu-color); font-weight: bold; }

/*sbanner*/
.sbanner{ width: 750px; margin:0 auto; padding:8rem 0 3.9rem; overflow: hidden; background: url(/static/index/zm001/images/company_banner.jpg) no-repeat top center; background-size: cover; background-position: 40%; }
.sbanner .row{ display: flex; flex-direction: column; align-items: center; justify-content: center; }
.sbanner .tit{ display: flex; align-items: center; text-shadow:0 0 0.125rem rgba(0, 0, 0, .5); }
.sbanner span{ display: none;  }
.sbanner b{ font-size: 1.8rem; font-weight: bold; color: #ffffff; line-height: 1; display: inline-block; padding:0 1.2rem; }
.sbanner p{ line-height: 1; margin-top: 0.85rem; font-size: 1.2rem; color: #ffffff; font-weight: 200; text-shadow:0 0 0.125rem rgba(0, 0, 0, .5); }
.sbanner i{ font-size: 2.4rem; color: #fff; line-height: 1; margin-top: 1.45rem; }
.service_banner{ background: url(/static/index/zm001/images/service_banner.jpg) no-repeat top center; background-attachment: fixed; }
.case_banner{ background: url(/static/index/zm001/images/case_banner.jpg) no-repeat top center; background-attachment: fixed; }
.news_banner{ background: url(/static/index/zm001/images/news_banner.jpg) no-repeat top center; background-attachment: fixed; }
.video_banner{ background: url(/static/index/zm001/images/video_banner.jpg) no-repeat top center; background-attachment: fixed; }
.join_banner{ background: url(/static/index/zm001/images/join_banner.jpg) no-repeat top center; background-attachment: fixed; }
@media only screen and (max-width:750px){
  .sbanner{ width: 100%; }
}
@media only screen and (max-width:576px){
  .sbanner b{ font-size: 2.4rem; }
  .sbanner p{ font-size: 1.2rem; }
}
@media only screen and (max-width:414px){
  .sbanner b{ font-size: 2.6rem; }
  .sbanner p{ font-size: 1.4rem; }
}

/* location */
.location{ width: 750px; margin:0 auto; overflow: hidden; margin-top: -1.1rem; padding-bottom: 0.75rem; }
.location .wraper, .location .inner{ overflow: visible; }
.location_box{ width: 100%; box-shadow: 0 0 0.15rem rgba(0, 0, 0, .09); display: flex; flex-direction: column; align-items: center; background: #ffffff; box-sizing: border-box; padding:0.8rem; }
.crumbs{ width: 100%; display: flex; align-items: center; justify-content: center; }
.crumbs i{ font-size: 1.4rem; line-height: 1; margin-right: 0.6rem; }
.crumbs small, .crumbs a{ font-size: 1.4rem; color: #666666; transition: all .3s; }
.crumbs small{ display: none; }
.crumbs a:hover{ transition: all .3s; color: var(--pei-color); }
.l_nav{ width: 100%; display: flex; align-items: center; justify-content: center; margin-top: 0.75rem; }
.l_nav a{ transition: all .3s; display: inline-flex; align-items: center; margin:0 0.6rem; font-size: 1rem; color: #666666; line-height: 1; }
.l_nav a i{ transition: all .3s; display: inline-block; margin-right: 0.4rem; font-size: 1rem; color: #666666; line-height: 1; }
.l_nav a:hover{ transition: all .3s; color: var(--pei-color); }
.l_nav a:hover i{ transition: all .3s; color: var(--pei-color); }
@media only screen and (max-width:750px){
  .location{ width: 100%; }
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* company_hd */
.company_hd{ overflow: hidden;  }
.company_hd .top{ display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; }
.company_hd .top .img, .company_hd .top .txt{ width: 100%; overflow: hidden; }
.company_hd .top .img img{ width: 100%; }
.company_hd .top .txt{ background: var(--zhu-color); box-sizing: border-box; padding:1.25rem; }
.company_hd .top .txt b{ margin-bottom: 1rem; font-size: 1.2rem; color: #ffffff; line-height: 1.4; display: block; margin-bottom: 1rem; }
.company_hd .top .txt p{ font-size: 0.9rem; color: #ffffff; line-height: 1.5; margin-bottom: 1rem; }
.company_hd .bom{ overflow: hidden; text-align: center; padding:1rem 0; }
.company_hd .bom p{ margin:0 auto; font-size: 0.9rem; color: #111111; line-height: 1.5; }
.company_hd .bom .img{ height: 11rem; margin-top: 1rem; overflow: hidden; background-attachment: fixed!important; background-size: cover!important; }
.company_bd strong{ font-size: 1.2rem; color: #111111; line-height: 1.4; }
.company_bd p{ font-size: 0.9rem; color: #111111; line-height: 1.5; }
.company_bd ul{ display: flex; align-items: center; justify-content: space-between; }
.company_bd ul li{ width: calc(50% - 0.375rem); }
.company_bd ul li img{ max-width: 100%; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* product_list */
.product_list{ overflow: hidden; width: 100%; }
.product_list li a{ display: flex; flex-wrap: wrap; align-items: center; background: var(--zhu-color); justify-content: space-between; }
.product_list li .img, .product_list li .txt{ width: 100%; }
.product_list li .img{ padding-bottom: 0%; position: relative; overflow: hidden; background: #dcdedd; }
.product_list li .img img{ width: 100%; height: 100%; object-fit: cover; position: relative; top: 1.5rem; }
.product_list li .txt{ box-sizing: border-box; padding:1rem; }
.product_list li .txt b{ display: block; font-size: 1.6rem; color: #ffffff; line-height: 1; text-transform: capitalize; }
.product_list li .txt p{ font-size: 1rem; margin: 0.6rem 0; color: #ffffff; line-height: 1.5; }
.product_list li .txt > span{ overflow: hidden; display: inline-flex; text-transform: uppercase; padding:0.55rem 1.25rem; background: var(--pei-color); position: relative; align-self: end; }
.product_list li .txt > span::before{ content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; left:0; top:0; background: #008bd2; transform: rotate(-90deg); transform-origin:0 100%; transition: all .3s; }
.product_list li .txt > span small{ position: relative; line-height: 1; font-size: 0.5rem; color: #ffffff; }
.product_list li .txt > span:hover::before{ transition: all .3s; transform: rotate(0); transform-origin:0 100%; }
.product_list li:hover img{ transition: all .3s; transform: scale(1.05); }
.product_list .product_icons{ justify-content:flex-start; display: flex; flex-direction: row; padding: 0.5rem 0; }
.product_list .product_icons li{ padding:0; padding-right: 0.75rem; display: inline-flex; align-items: center; justify-content: center; flex-direction: column; }
.product_list .product_icons li span{ font-size: 1.5rem; color: #ffffff; }
.product_list .product_icons li p{ font-size: 1srem; margin-top: 0.5rem; }


/* product_focus */
/* .product_focus{ overflow: hidden; padding-top: 17.75rem; }
.product_focus b{ text-align: center; display: block; font-size: 1.5rem; color: #ffffff; font-weight: bold; line-height: 1; text-shadow: 0.125rem 0.125rem 0 #1d1d1f; }
.product_icons{ display: flex; align-items: center; justify-content: center; padding:1.05rem 0; }
.product_icons li{ display: inline-flex; flex-direction: column; padding:0 2.5rem; align-items: center; justify-content: center; }
.product_icons li span{ font-size: 2.75rem; line-height: 1; color: #ffffff; }
.product_icons li p{ font-size: 0.75rem; line-height: 1; color: #fbfbfd; margin-top: 0.75rem; } */


/* product_main */
/* .product_main{ overflow: hidden; padding:0.75rem 0; }
.product_main ul{ position: relative; width: 100%; margin:0 auto; display: flex; align-items: flex-start; justify-content: space-between; }
.product_main ul::before{ content: ""; display: block; width: 7.75rem; height: 6.1rem; background: url(/static/index/zm001/images/vs.png) no-repeat center; position: absolute; background-size: 100%; left:50%; top:72px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.product_main ul li{ width: calc(50% - 0.375rem); text-align: center; }
.product_main ul li p{ font-size: 0.85rem; color: #999999; line-height: 2; }
.product_main img{ max-width: 100%; }
.product_main ul li p + p{ margin:0.375rem 0; }
.product_main ul li:first-child p{ color: var(--zhu-color); }
.product_main big{ display: flex; align-items: center; justify-content: center; text-align: center; font-size: 1.4rem; color: #1d1d1f; line-height: 1.3; margin:0.75rem 0; }
.product_main ol{ display: flex; flex-wrap: wrap; flex-direction: column; }
.product_main ol li{ display: flex; align-items: center; justify-content: space-between; margin:0.75rem 0; }
.product_main ol li p{ width: calc(40% - 0.375rem); }
.product_main ol li p + p{ width: calc(60% - 0.375rem); }
.product_main ol li:nth-child(even){ flex-direction: row-reverse; }
.product_main ol li p strong{ margin-bottom: 1.15rem; display: block; font-size: 1.5rem; color: #1d1d1f; line-height: 1; font-weight: normal; }
.product_main ol li p em{ display: block; font-size: 0.9rem; color: #1d1d1f; line-height: 1.7; }
@media only screen and (max-width:640px){
  .product_main ul{ flex-wrap: wrap; }
  .product_main ul::before{ display: none; }
  .product_main ul li{ width: 100%; }
  .product_main ol li{ flex-wrap: wrap; }
  .product_main ol li p{ width: 100%; padding:0 0 1rem; }
  .product_main ol li p + p{ width: 100%; padding-bottom: 0; }
} */


/* product_material */
/* .product_material{ overflow: hidden; text-align: center; margin:0 0 1.5rem; }
.product_material > b{ font-size: 1.5rem; color: #1d1d1f; line-height: 1; font-weight: normal; margin:0 0 1.5rem; display: block; }
.product_material ul{ width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.product_material li{ width: 50%; display: flex; flex-direction: column; }
.product_material li:nth-child(even){ flex-direction: column-reverse; }
.product_material li .img{ width: 100%; height: 14rem; overflow: hidden; }
.product_material li .img img{ width: 100%; height: 100%; object-fit: cover; transition: all .3s; }
.product_material li .txt{ width: 100%; height: 14rem; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #f1f1f1; }
.product_material li .txt b{ font-weight: normal; font-size: 1.05rem; color: #1d1d1f; line-height: 1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.product_material li .txt p{ box-sizing: border-box; padding:0 0.5rem; font-size: 0.45rem; color: #1d1d1f; line-height: 1.6; margin-top: 1.05rem; }
.product_material li:hover img{ transition: all .3s; transform: scale(1.05); }
.product_material li:hover .txt{ transition: all .3s; background: var(--zhu-color); } 
.product_material li:hover .txt b, .product_material li:hover .txt p{ transition: all .3s; color: #ffffff; }  */

/* product_focus */
.product_focus{ overflow: hidden; padding-top: 21rem; position: relative; }
.product_focus b{ text-align: center; display: block; font-size: 1.5rem; color: #ffffff; font-weight: bold; line-height: 1; text-shadow: 0.125rem 0.125rem 0 #1d1d1f; }
.product_icons{ display: flex; align-items: center; justify-content: center; padding:1.05rem 0; }
.product_icons li{ display: inline-flex; flex-direction: column; padding:0 2.5rem; align-items: center; justify-content: center; }
.product_icons li span{ font-size: 2.75rem; line-height: 1; color: #111111; }
.product_icons li p{ font-size: 0.75rem; line-height: 1; color: #111111; margin-top: 0.75rem; }


/* product_spot */
.product_spot{ position: absolute; left:0; top:0; display: block; width: 100%; height: 100%; }
.product_spot li{ position: absolute; }
.product_spot li a{ display: flex; align-items: center; position: relative; }
.product_spot li a .spot{ display: block; width: 0.45rem; height: 0.45rem; background: #fff; border: 0.175rem solid var(--pei-color); border-radius: 50%; position: relative; animation: bordershow 3s infinite; }
.product_spot li a .spot::before { content: ''; display: block; position: absolute; left: 50%; top: 50%; z-index: 1; transform: translate(-50%, -50%); width: 1rem; height: 1rem; border-radius: 50%; background: rgba(220, 0, 29, 0.2); }
.product_spot li a .spot::after { content: ''; display: block; position: absolute; left: 50%; top: 50%; z-index: 1; transform: translate(-50%, -50%); width: 1rem; height: 1rem; border-radius: 50%; background: rgba(220, 0, 29, 0.2); }
.product_spot li a .spot::before { animation: boderM 3s .75s infinite; }
.product_spot li a .spot::after { animation: boderM 3s infinite; }
@keyframes boderM { 0% { transform: translate(-50%, -50%) scale(1); opacity: 0 } 20% { opacity: 1 } 75% { transform: translate(-50%, -50%) scale(2); opacity: 0 } 100% { opacity: 0 } }
@keyframes bordershow { 50% { box-shadow: 0px 0px 0.25rem 0 var(--pei-color); } }
.product_spot li a .txt { position: relative; margin-left: 0.3rem; white-space: nowrap; font-size: 0.45rem; padding: 0.25rem 0.875rem; display: inline-flex; align-items: center; justify-content: center; line-height: 1; pointer-events: none; }
.product_spot li a .txt::before { content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 0; height: 100%; background: rgba(0, 75, 127, .6); border-radius: 0.75rem; }
.product_spot li a .txt small{ opacity: 0; position: relative; z-index: 3; color: #fff; font-size: 0.45rem; margin-right: 0.3rem; vertical-align: middle; }
.product_spot li a .txt i{ opacity: 0; position: relative; z-index: 3; font-size: 0.5rem; color: #fff; vertical-align: middle; }
.product_spot li:hover a .txt { pointer-events: all;}
.product_spot li:hover a .txt::before { width: 100%; transition: all .4s cubic-bezier(.34, .44, .41, 1.12);}
.product_spot li:hover a .txt small{ opacity: 1; transition: all .36s .4s;}
.product_spot li:hover a .txt i{ opacity: 1; transition: all .36s .4s;}
.product_spot li:nth-child(1){ left:15%; top:22%; }
.product_spot li:nth-child(2){ left:30%; top:29%; }
.product_spot li:nth-child(3){ left:40%; top:40%; }
.product_spot li:nth-child(4){ left:38%; top:53%; }
.product_spot li:nth-child(5){ left:52%; top:34%; }
.product_spot li:nth-child(6){ left:53%; top:59%; }
.product_spot li:nth-child(7){ left:56%; top:52%; }
.product_spot li:nth-child(8){ left:62%; top:21%; }
.product_spot li:nth-child(9){ left:68%; top:25%; }
.product_spot li:nth-child(10){ left:72%; top:55%; }
.product_spot li:nth-child(11){ left:79%; top:12%; }
.product_spot li:nth-child(12){ left:85%; top:12%; }
.product_spot li:nth-child(13){ right:3%; top:26%; }
.product_spot li:nth-child(14){ right:3%; top:49%; }
.product_spot li:nth-child(13) a, .product_spot li:nth-child(14) a{ flex-direction: row-reverse; }
@media only screen and (max-width:680px){
  .product_spot li:nth-child(1){ left:15%; top:26%; }
  .product_spot li:nth-child(2){ left:30%; top:26%; }
  .product_spot li:nth-child(3){ left:40%; top:36%; }
  .product_spot li:nth-child(4){ left:38%; top:49%; }
  .product_spot li:nth-child(5){ left:52%; top:30%; }
  .product_spot li:nth-child(6){ left:53%; top:55%; }
  .product_spot li:nth-child(7){ left:56%; top:48%; }
  .product_spot li:nth-child(8){ left:62%; top:17%; }
  .product_spot li:nth-child(9){ left:68%; top:21%; }
  .product_spot li:nth-child(10){ left:72%; top:51%; }
  .product_spot li:nth-child(11){ left:79%; top:10%; }
  .product_spot li:nth-child(12){ left:85%; top:10%; }
  .product_spot li:nth-child(13){ right:3%; top:22%; }
  .product_spot li:nth-child(14){ right:3%; top:45%; }
}
@media only screen and (max-width: 590px){
  .product_spot li:nth-child(1){ left:15%; top:22%; }
  .product_spot li:nth-child(2){ left:30%; top:22%; }
  .product_spot li:nth-child(3){ left:40%; top:32%; }
  .product_spot li:nth-child(4){ left:38%; top:45%; }
  .product_spot li:nth-child(5){ left:52%; top:26%; }
  .product_spot li:nth-child(6){ left:53%; top:51%; }
  .product_spot li:nth-child(7){ left:56%; top:44%; }
  .product_spot li:nth-child(8){ left:62%; top:13%; }
  .product_spot li:nth-child(9){ left:68%; top:17%; }
  .product_spot li:nth-child(10){ left:72%; top:47%; }
  .product_spot li:nth-child(11){ left:79%; top:8%; }
  .product_spot li:nth-child(12){ left:85%; top:8%; }
  .product_spot li:nth-child(13){ right:3%; top:18%; }
  .product_spot li:nth-child(14){ right:3%; top:41%; }
}
@media only screen and (max-width: 500px){
  .product_spot li:nth-child(1){ display: none; }
  .product_spot li:nth-child(2){ display: none; }
  .product_spot li:nth-child(3){ display: none; }
  .product_spot li:nth-child(4){ display: none; }
  .product_spot li:nth-child(5){ display: none; }
  .product_spot li:nth-child(6){ display: none; }
  .product_spot li:nth-child(7){ display: none; }
  .product_spot li:nth-child(8){ display: none; }
  .product_spot li:nth-child(9){ display: none; }
  .product_spot li:nth-child(10){ display: none; }
  .product_spot li:nth-child(11){ display: none; }
  .product_spot li:nth-child(12){ display: none; }
  .product_spot li:nth-child(13){ display: none; }
  .product_spot li:nth-child(14){ display: none; }
}

/* product_main */
.product_main{ overflow: hidden; padding:0.75rem 0; }
.product_main ul{ position: relative; width: 78%; margin:0 auto; display: flex; align-items: flex-start; justify-content: space-between; }
.product_main ul::before{ content: ""; display: block; width: 7.75rem; height: 6.1rem; background: url(/static/index/zm001/images/vs.png) no-repeat center; position: absolute; background-size: 100%; left:50%; top:72px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.product_main ul li{ width: calc(50% - 0.375rem); text-align: center; }
.product_main ul li p{ font-size: 0.75rem; color: #999999; line-height: 2; }
.product_main img{ max-width: 100%; }
.product_main ul li p + p{ margin:0.375rem 0; }
.product_main ul li:first-child p{ color: var(--zhu-color); }
.product_main ol{ display: flex; flex-wrap: wrap; margin:0.75rem 0; }
.product_main ol li{ width: calc(50% - 0.375rem); text-align: center; }
.product_main ol li p:nth-of-type(1){ display: flex; align-items: center; justify-content: center; }
.product_main ol li p:nth-of-type(2){ margin:0.5rem 0; display: flex; align-items: center; justify-content: center; }
.product_main ol li p em{ display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; background: var(--zhu-color); border-radius: 50%; font-size: 0.65rem; color: #ffffff; line-height: 1; position: relative; right: -1rem; }
.product_main ol li p small{ display: inline-flex; align-items: center; justify-content: center; padding:0.25rem 0.75rem; font-size: 0.45rem; color: var(--zhu-color); border:0.025rem solid var(--zhu-color); border-radius: 0.75rem; line-height: 1; padding-left: 1.5rem; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* product_content */
.product_content{ overflow: hidden; }
.product_nav{ display: flex; align-items: center; justify-content: center; margin:0.75rem 0; }
.product_nav li{ display: inline-flex; align-items: center; justify-content: center; background: #eeefef; font-size: 0.75rem; color: #333333; padding:0.375rem 0.5rem; margin:0 0.3rem; transition: all .3s; }
.product_nav li.on{ background: var(--zhu-color); color: #ffffff; transition: all .3s; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* product_box_hd */
.product_box_hd{ overflow: hidden; }
.product_box_hd ul{ display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin:0.25rem 0 1rem; position: relative; }
.product_box_hd li{ width: 16.6%; overflow: hidden; text-align: center; padding:.5rem 0; }
.product_box_hd li a{ display: inline-flex; flex-direction: column; align-items: center; justify-content: center; }
.product_box_hd li i{ width: 0.75rem; height: 0.75rem; background: rgba(220,220,220,.5); border-radius: 50%; position: relative; }
.product_box_hd li i::before{ content: ""; display: inline-block; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: rgba(220,220,220,1); position: absolute; top:50%; left:50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); }
.product_box_hd li p{ font-size: 0.4rem; color: #cdcdcd; line-height: 1; margin-top: 0.3rem; }
.product_box_hd li.on i{ transition: all .3s; background: rgba(0,75,127,.5); }
.product_box_hd li.on i::before{ transition: all .3s; background: rgba(0,75,127,1); }
.product_box_hd li.on p{ transition: all .3s; color: #333333; }
@media only screen and (max-width:750px){
  .product_box_hd li{ width: 20%; }
}
@media only screen and (max-width: 576px){
  .product_box_hd li{ width: 20%; }
}
@media only screen and (max-width: 414px){
  .product_box_hd li{ width: 25%; }
}

/* mixing_tank */
#mixing_tank{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#mixing_tank .fl, #mixing_tank .fr{ width: 100%; }
#mixing_tank .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; margin-bottom: 0.75rem; }
#mixing_tank .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#mixing_tank .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#mixing_tank .fl li:nth-of-type(2){ display: flex; align-items: flex-start; justify-content: space-between; }
#mixing_tank .fl li:nth-of-type(2) p{ width: calc(33.3% - 0.5rem); }
#mixing_tank .fl li:nth-of-type(2) p img{ width: 100%; }
#mixing_tank .fr img{ width: 100%; }
#mixing_tank > p{ width: 100%; margin:0.625rem 0; }
#mixing_tank > p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#mixing_tank > p img{ margin:0 auto; display: block; max-width: 100%; }
#mixing_tank ol{ padding:0.75rem 2rem 0; display: flex; flex-wrap: wrap; }
#mixing_tank ol li{ width: 100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; margin-right: 0.75rem; }
#mixing_tank ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#mixing_tank ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
#mixing_tank ol li:nth-of-type(1) span{ font-size: 0.9rem; line-height: 1; color: #ffffff; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* fermentor */
#fermentor{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#fermentor .fl, #fermentor .fr{ width: 100%; }
#fermentor .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; margin-bottom: 0.75rem; }
#fermentor .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#fermentor .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#fermentor .fl li:nth-of-type(2) p img{ max-width: 100%; }
#fermentor .fr > li:nth-of-type(1) p img{ max-width: 100%; }
#fermentor .fr > li:nth-of-type(2) p{ width: 100%; margin:0.625rem 0; }
#fermentor .fr > li:nth-of-type(2) p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#fermentor .fr > li:nth-of-type(2) p img{ margin:0 auto; display: block; max-width: 100%; }
#fermentor ol{ padding:0.125rem 0 0; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#fermentor ol li{ width:100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; }
#fermentor ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#fermentor ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
#fermentor ol li:nth-of-type(1) span{ font-size: 0.9rem; line-height: 1; color: #ffffff; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* bacterial_fluid */
#bacterial_fluid{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#bacterial_fluid .fl, #bacterial_fluid .fr{ width: 100%; }
#bacterial_fluid .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:1.8rem; margin-bottom: 0.75rem; }
#bacterial_fluid .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#bacterial_fluid .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#bacterial_fluid .fl li:nth-of-type(2) p img{ width: 100%; height: 16.65rem; object-fit: cover; }
#bacterial_fluid .fr > li:nth-of-type(1) p img{ width: 100%; height: 25.35rem; object-fit: cover; }
#bacterial_fluid big{ width: 100%; display: flex; padding:0 1rem; flex-wrap: wrap; align-items: center; justify-content: space-between; margin:0.625rem 0; }
#bacterial_fluid big > p{ width: 100%; padding:1rem 0; }
#bacterial_fluid big p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.2rem 1.5rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#bacterial_fluid big p img{ margin:0 auto; display: block; max-width: 100%; }
#bacterial_fluid ol{ width:100%; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#bacterial_fluid ol li{ width: 100%; display: flex; align-items: center; justify-content: space-between; }
#bacterial_fluid ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#bacterial_fluid ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* stone_arrester */
#stone_arrester{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#stone_arrester .fl{ width: 100%; }
#stone_arrester .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#stone_arrester .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#stone_arrester .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#stone_arrester big{ width: 100%; margin:0.75rem 0; display: flex; align-items: center; justify-content: space-between; }
#stone_arrester big img{ width: calc(50% - 0.375rem); }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* solenoid_valve */
#solenoid_valve{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#solenoid_valve .fl{ width: 100%; background: var(--zhu-color); display: flex; align-items: flex-start; justify-content: space-between; }
#solenoid_valve .fl li{ width: 100%; box-sizing: border-box; padding:1.5rem; }
#solenoid_valve .fl li p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#solenoid_valve .fl li p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#solenoid_valve big{ width: 100%; margin:0.75rem 0; display: flex; align-items: center; justify-content: space-between; }
#solenoid_valve big img{ width: calc(50% - 0.375rem); }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* elevator */
#elevator{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#elevator .fl, #elevator .fr{ width: 100%; display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
#elevator .fl li{ width: 100%; box-sizing: border-box; }
#elevator .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:1.35rem; }
#elevator .fl li:nth-of-type(1) p, #elevator .fr li:nth-of-type(2) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#elevator .fl li:nth-of-type(1) p em, #elevator .fr li:nth-of-type(2) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#elevator .fl li:nth-of-type(2) p img{ width: 100%; height: 7.95rem; background: #dcdedd; object-fit: contain; }
#elevator .fr{ margin:0.75rem 0 0; }
#elevator .fr li:nth-of-type(1){ width: 100%; }
#elevator .fr li:nth-of-type(1) p img{ width: 100%; height: 11.4rem; object-fit: cover; }
#elevator .fr li:nth-of-type(2){ width: 100%; background: var(--zhu-color); box-sizing: border-box; padding:1.125rem; }
#elevator .fr li:nth-of-type(2) p img{ max-width: 100%; margin-top: 0.5rem; }
#elevator > p{ width: 100%; margin:0.75rem 0; }
#elevator > p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#elevator > p img{ margin:0 auto; display: block; max-width: 100%; }
#elevator > ol{ width: 100%; padding:0.75rem 2rem 0; display: flex; flex-wrap: wrap; }
#elevator > ol li{ width: 100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; margin-right: 0.75rem; }
#elevator > ol li:nth-child(3n+0){ margin-right: 0; }
#elevator > ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#elevator > ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
#elevator > ol li:nth-of-type(1) span{ font-size: 0.9rem; line-height: 1; color: #ffffff; }
#elevator .center{ width: 100%; }
#elevator .center li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#elevator .center li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#elevator .center li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1; }
#elevator .bom{ margin:0.75rem 0; width: 100%; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#elevator .bom > li:nth-of-type(1){ width: 100%;  }
#elevator .bom > li:nth-of-type(2){ width: 100%;  }
#elevator .bom > li:nth-of-type(1) p img{ width: 100%; }
#elevator .bom > li:nth-of-type(2) > p{ width: 100%; }
#elevator .bom > li:nth-of-type(2) > p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#elevator .bom > li:nth-of-type(2) > ol{ width: 100%; padding:0.5rem 0; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#elevator .bom > li:nth-of-type(2) > ol li{ width: 100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; }
#elevator .bom > li:nth-of-type(2) > ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#elevator .bom > li:nth-of-type(2) > ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
#elevator .bom > li:nth-of-type(2) > ol li:nth-of-type(1) span{ font-size: 0.9rem; line-height: 1; color: #ffffff; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* spiral_pipe */
#spiral_pipe{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#spiral_pipe .fl{ width: 100%; }
#spiral_pipe .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#spiral_pipe .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#spiral_pipe .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#spiral_pipe .fl li:nth-of-type(2) p img{ max-width: 100%; }
#spiral_pipe .fr{ width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin:0.625rem 0; }
#spiral_pipe .fr > li:nth-of-type(1){ width: 100%; }
#spiral_pipe .fr > li:nth-of-type(2){ width: 100%; }
#spiral_pipe .fr > li:nth-of-type(1) p img{ width: 100%; height: 12.9rem; object-fit: cover; }
#spiral_pipe .fr > li:nth-of-type(2) > p{ width: 100%; }
#spiral_pipe .fr > li:nth-of-type(2) p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#spiral_pipe .fr > li:nth-of-type(2) p img{ margin:0 auto; display: block; max-width: 100%; }
#spiral_pipe ol{ padding:1rem 1rem 0; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#spiral_pipe ol li{ width:100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; }
#spiral_pipe ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#spiral_pipe ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
#spiral_pipe big img{ max-width: 100%; margin:0 0 0.375rem; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* detector */
#detector{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#detector .fl{ width: 100%; }
#detector .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#detector .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#detector .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#detector big{ width: 100%; margin:0.75rem 0; display: flex; align-items: center; justify-content: space-between; }
#detector big img:nth-of-type(1){ width: calc(58% - 0.375rem); }
#detector big img:nth-of-type(2){ width: calc(42% - 0.375rem); }
#detector > p{ width: 100%; margin:0.625rem 0; }
#detector > p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#detector > p img{ margin:0 auto; display: block; max-width: 100%; }
#detector ol{ padding:0.75rem 2rem 0; display: flex; flex-wrap: wrap; }
#detector ol li{ width: 100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; margin-right: 0.75rem; }
#detector ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#detector ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* disinfection_lamp */
#disinfection_lamp{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#disinfection_lamp .fl{ width: 100%; background: var(--zhu-color); display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#disinfection_lamp .fl li:nth-of-type(1){ width: 100%; box-sizing: border-box; padding:1.5rem; }
#disinfection_lamp .fl li:nth-of-type(2){ width: 100%; }
#disinfection_lamp .fl li:nth-of-type(2) p{ line-height: 0; }
#disinfection_lamp .fl li p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#disinfection_lamp .fl li p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#disinfection_lamp big{ width: 100%; margin:0.75rem 0; display: flex; align-items: center; justify-content: space-between; }
#disinfection_lamp big img:nth-of-type(1){ width: calc(40% - 0.25rem); }
#disinfection_lamp big img:nth-of-type(2){ width: calc(32% - 0.25rem); }
#disinfection_lamp big img:nth-of-type(3){ width: calc(28% - 0.25rem); }
#disinfection_lamp big img{ height: 10.9rem; object-fit: cover; }
#disinfection_lamp > p{ width: 100%; margin:0 0 0.625rem; }
#disinfection_lamp > p strong{ font-weight: normal; display: flex; align-items: center; background: var(--zhu-color); padding:1.5rem 2rem; box-sizing: border-box; font-size: 0.9rem; color: #ffffff; line-height: 1; text-transform: uppercase; }
#disinfection_lamp > p img{ margin:0 auto; display: block; max-width: 100%; }
#disinfection_lamp ol{ padding:0.75rem 2rem 0; display: flex; flex-wrap: wrap; }
#disinfection_lamp ol li{ width: 100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; margin-right: 0.75rem; }
#disinfection_lamp ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#disinfection_lamp ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* air_compressor */
#air_compressor{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#air_compressor .fl{ width: 100%; }
#air_compressor .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#air_compressor .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#air_compressor .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#air_compressor .bom{ box-sizing: border-box; padding:2rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
#air_compressor .bom ol{ width: 100%; display: flex; flex-direction: column; }
#air_compressor .bom ol li{ width: 100%; margin-bottom: 0.75rem; display: flex; align-items: center; justify-content: space-between; margin-right: 0.75rem; }
#air_compressor .bom ol li:nth-child(3n+0){ margin-right: 0; }
#air_compressor .bom ol li p:nth-of-type(2){ width: calc(100% - 4rem); font-size: 0.45rem; color: #333333; line-height: 2; }
#air_compressor .bom ol li p span{ display: inline-flex; width: 3.25rem; height: 3.25rem; align-items: center; justify-content: center; font-size: 1.75rem; line-height: 1; color: #ffffff; background: var(--zhu-color); border-radius: 0.125rem; }
#air_compressor .bom > p{ width:  100%; }
#air_compressor .bom > p img{ max-width: 100%; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* software */
#software{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#software .fl{ width: 100%; }
#software .fl li:nth-of-type(1){ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#software .fl li:nth-of-type(1) p{ font-size: 0.45rem; color: #ffffff; line-height: 1.8; margin:0.5rem 0; }
#software .fl li:nth-of-type(1) p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#software big{ width: 100%; margin:0.75rem 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
#software big strong{ font-size: 1.7rem; color: #004b7f; line-height: 1; letter-spacing: 0.175rem; }
#software big small{ font-size: 0.75rem; color: rgba(0, 75, 127, .3); line-height: 1; text-transform: uppercase; margin:0.5rem 0; }
#software big img{ max-width: 100%; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* operation */
#operation{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#operation .fl{ width: 100%; background: var(--zhu-color); display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#operation .fl li:nth-of-type(1){ width: 100%; box-sizing: border-box; padding:1.5rem; }
#operation .fl li:nth-of-type(2){ width: 100%; }
#operation .fl li:nth-of-type(2) p{ width: 100%; height: 100%; }
#operation .fl li:nth-of-type(2) img{ width: 100%; height: 100%; object-fit: cover; }
#operation .fl li p{ font-size: 0.45rem; color: #ffffff; line-height: 2; }
#operation .fl li p small{ font-size: 0.6rem; display: block; }
#operation .fl li p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#operation big{ width: 100%; margin:0.75rem auto; display: flex; align-items: center; justify-content: space-between; }
#operation big img{ width: calc(50% - 0.375rem); }
#operation > p{ width: 100%; text-align: center; margin:0 auto 0.75rem; }
#operation > p img{ margin:0 auto; display: block; max-width: 100%; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* computer */
#computer{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#computer .fl{ width: 100%; }
#computer .fl li{ background: var(--zhu-color); box-sizing: border-box; padding:2.25rem; }
#computer .fl li p{ font-size: 0.45rem; color: #ffffff; line-height: 1.8; margin:0.5rem 0; }
#computer .fl li p em{ display: block; font-size: 0.9rem; margin-bottom: 0.75rem; color: #ffffff; font-style: normal; text-transform: uppercase; line-height: 1.5; }
#computer .fl li p small{ font-size: 0.6rem; display: block; }
#computer big{ width: 100%; margin:0.75rem 0; display: flex; align-items: center; justify-content: space-between; }
#computer big img{ width: calc(40% - 0.25rem); }
#computer big img:nth-of-type(2){ width: calc(40% - 0.25rem); }
#computer big img:nth-of-type(3){ width: calc(20% - 0.25rem); }
#computer big img{ height: 10.9rem; object-fit: cover; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}
/* g_case */
#g_case{ padding:0; display: block; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#g_case big{ width: 100%; margin:0.625rem 0; display: flex; align-items: center; justify-content: space-between; }
#g_case big a:nth-of-type(1){ width: calc(40% - 0.25rem); }
#g_case big a:nth-of-type(2){ width: calc(32% - 0.25rem); }
#g_case big a:nth-of-type(3){ width: calc(28% - 0.25rem); }
#g_case big a img{ width: 100%; height: 7.7rem; object-fit: cover; }
#g_case .fl{ width: 100%; display: flex; align-items: flex-start; justify-content: space-between; }
#g_case .fl li{ height: 18.75rem; }
#g_case .fl li p{ height: 100%; }
#g_case .fl li:nth-of-type(1){ width: calc(33% - 0.25rem); }
#g_case .fl li:nth-of-type(2){ width: calc(41% - 0.25rem);  }
#g_case .fl li:nth-of-type(3){ width: calc(26% - 0.25rem);  }
#g_case .fl li:nth-of-type(2) p:nth-of-type(2){ margin-top: 0.5rem; }
#g_case .fl li:nth-of-type(3) p:nth-of-type(2){ margin-top: 0.5rem; }
#g_case .fl li:nth-of-type(1) p{ height: 100%; }
#g_case .fl li:nth-of-type(2) p:nth-of-type(1){ height: calc(55% - 0.25rem); object-fit: cover; }
#g_case .fl li:nth-of-type(2) p:nth-of-type(2){ height: calc(45% - 0.25rem); object-fit: cover; }
#g_case .fl li:nth-of-type(3) p:nth-of-type(1){ height: calc(40% - 0.25rem); object-fit: cover; }
#g_case .fl li:nth-of-type(3) p:nth-of-type(2){ height: calc(60% - 0.25rem); object-fit: cover; }
#g_case .fl li p img{ width: 100%; height: 100%; object-fit: cover; }
@media only screen and (max-width:750px){
}
@media only screen and (max-width: 576px){
}
@media only screen and (max-width: 414px){
}

/* flow_list */ 
.flow_list{ display: flex; flex-direction: column; }
.flow_list li{ display: flex; flex-direction: column; align-items: center; justify-content: space-between; }
.flow_list li .img, .flow_list li .box{ width: 100%; }
.flow_list li .img{ overflow: hidden; position: relative; }
.flow_list li .img img{ width: 100%; height: 100%; object-fit: cover; }
.flow_list li .box{ padding:1rem 0; display: flex; align-items: flex-start; position: relative; }
.flow_list li .box > i{ display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; background: #03326c; border-radius: 50%; font-size: 1rem; margin-right: 1rem; color: #ffffff; line-height: 1; }
.flow_list li .box b{ font-size: 1.25rem; color: #111111; line-height: 1; font-weight: normal; }
.flow_list li .box p{ font-size: 1rem; color: #111111; line-height: 1; margin-top: .5rem; }
@media only screen and (max-width:576px){
}
@media only screen and (max-width:414px){
}

/* contact_info */
/* .contact_info{ overflow: hidden; }
.contact_info .row > div{ background: #f5f5f5; box-sizing: border-box; padding:2rem; }
.contact_info .row > div + div{ background: #e7ebec; }
.contact_info b{ font-size: 1.3rem; color: var(--zhu-color); font-weight: bold; display: block; line-height: 1; margin-bottom: 1.2rem; }
.contact_txt{ display: flex; align-items: flex-start; justify-content: space-between; }
.contact_txt .txt p{ padding: 0.5rem 0; display: flex; align-items: flex-start; justify-content: flex-start; }
.contact_txt .txt p span{ font-size: 1rem; line-height: 1; color: #666666; margin-right: 0.7rem; margin-top: 0.375rem; }
.contact_txt .txt p small{ display: inline-block; font-size: 1.4rem; line-height: 1.5; color: #333333; }
.contact_ewm{ overflow: hidden; }
.contact_ewm > div{ max-width: 8rem; float: left; }
.contact_ewm > div img{ max-width: 100%; }
.contact_ewm > div p{ font-size: 1.4rem; color: #333333; line-height: 1; margin:0.6rem 0 0; padding:0; text-align: center; justify-content: center; }
.contact_ewm > div + div{ margin-left: 2.5rem; } */


/* contact_msg */
/* .contact_msg{ overflow: hidden; }
.contact_msg .contact_input{ overflow: hidden; display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.9375rem; }
.contact_msg .contact_input input{ border:0; width: calc(50% - 0.4688rem); background: #f5f5f5; height: 3.1875rem; box-sizing: border-box; padding:0 1.5625rem; border-radius: 0.3125rem; font-size: 1.4rem; color: #999999; }
.contact_msg textarea{ border:0; width: 100%; background: #f5f5f5; height: 8rem; box-sizing: border-box; border-radius: 0.3125rem; font-size: 1rem; color: #999999; padding:1.25rem; line-height: 1.5; }
.contact_msg .contact_code{ display: flex; flex-wrap: wrap; align-items: center; margin-top: 0.5rem; justify-content: space-between; }
.contact_msg .contact_code img{ width: calc(50% - 0.4688rem); height: 3.1875rem; }
.contact_msg .contact_code input{ border:0; width: calc(50% - 0.4688rem); height: 3.1875rem; background: #f5f5f5; box-sizing: border-box; padding:0 1.5625rem; border-radius: 0.3125rem; font-size: 1rem; color: #999999; }
.contact_msg .contact_code .submit{ margin-top: 0.5rem; text-align: center; width: 100%; padding:1.125rem 6.25rem; background: var(--pei-color); border-radius: 0.3125rem; line-height: 1; font-size: 1rem; color: #ffffff; }
@media only screen and (max-width: 576px){
  .contact_txt{ flex-wrap: wrap; }
  .contact_txt > div{ width: 100%; }
  .contact_txt > div + div{ margin-top: 0.75rem; }
}
@media only screen and (max-width: 414px){
  
} */
/* contact_info */
.contact_info{ overflow: hidden; }
.contact_info > ul{ margin:0; width: 100%; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
.contact_info ul li{ display: flex; align-items: center; width: 100%; background: #faf9f9; box-sizing: border-box; padding:1rem; }
.contact_info ul li + li{ margin-top: 1rem; }
.contact_info ul li span{ font-size: 3.6rem; margin-right: 1rem; line-height: 1; color: var(--zhu-color); transition: all .3s; margin-bottom: 0.5rem; } 
.contact_info ul li p{ font-size: 1rem; line-height: 1.2; color: #1d1d1f; transition: all .3s; } 
.contact_info ul li:hover{ transition: all .3s; background: var(--zhu-color); }
.contact_info ul li:hover span, .contact_info ul li:hover p{ transition: all .3s; color: #ffffff; }
.contact_ewm{ display: flex; flex-direction: column; align-items: center; justify-content: center; }
.contact_ewm .hd{ width: 100%; margin:1.25rem 0; display: flex; align-items: center; justify-content: center; position: relative; }
.contact_ewm .hd i{ font-size: 12.5rem; color: #f7f7f7; font-family: "PMZD"; line-height: 1; position: absolute; top:-2rem; left: 0; }
.contact_ewm .hd i:nth-of-type(2){ right: 0; left: auto; }
.contact_ewm .hd > div{ margin:0 7.5rem; text-align: center; }
.contact_ewm .bd{ text-align: center; margin-bottom: 1.25rem; }
.contact_ewm .bd p{ font-size: 0.9rem; color: #111111; line-height: 1.3; }

.contact_msg{ padding:2.5rem 0.75rem; box-sizing: border-box; width: 100%; }
.contact_msg .hd{ display: flex; align-items: center; justify-content: center; flex-direction: column; margin-bottom: 1rem; }
.contact_msg .hd b{ font-size: 2.25rem; color: #111111; line-height: 1; font-weight: normal; }
.contact_msg .hd p{ font-size: 1.4rem; text-align: center; color: #666666; line-height: 1; margin-top: 0.45rem; }
.contact_msg .input{ flex-wrap: wrap; display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.2rem; }
.contact_msg .input li{ padding:1rem 0; display: flex; align-items: center; border-bottom: 0.025rem solid #d3cec7; width: 100%; }
.contact_msg .input li span, .contact_msg .textarea span, .contact_msg .code span{ font-size: 1.2rem; color: #333333; line-height: 1; }
.contact_msg .input li span i, .contact_msg .textarea span i, .contact_msg .code span i{ color: #dc001d; margin-left: 0.125rem; }
.contact_msg .input li input, .contact_msg .code input{ border:0; width: calc(100% - 4rem); height: 2.4rem; box-sizing: border-box; padding:0 0.3rem; font-size: 1rem; color: #d8d8d8; line-height: 1; }
.contact_msg .textarea{ width: 100%; padding:0.3rem 0; margin-bottom: 1rem; display: flex; align-items: center; border-bottom: 0.025rem solid #d3cec7; font-size: 1rem; color: #d8d8d8; line-height: 1; }
.contact_msg .textarea textarea{ width: calc(100% - 4rem); border:0; height: 2.4rem; overflow: hidden; box-sizing: border-box; padding:0 0.3rem; font-size: 1rem; color: #d8d8d8; line-height: 1; }
.contact_msg .code{ width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.contact_msg .code > div{ padding:0.3rem 0; position: relative; width:100%; display: flex; align-items: center; border-bottom: 0.025rem solid #d3cec7; }
.contact_msg .code > div input{ width: calc(100% - 6.25rem); }
.contact_msg .code > div img{ position: absolute; right:0; height: 2.4rem; }
.contact_msg .code .submit{ width: 100%; margin-top: 1rem; display: inline-flex; align-items: center; justify-content: center; padding:0.35rem 1.25rem; background: var(--zhu-color); line-height: 1; font-size: 1.2rem; color: #ffffff; transition: all .3s; }
.contact_msg .code .submit:hover{ transition: all .3s; background: var(--pei-color); }

/* contact_map */
#dituContent{ width: 100%; margin:0.5rem auto; height: 20rem; box-sizing: border-box; border:0.025rem solid #cccccc; }
@media only screen and (max-width: 576px){
  #dituContent{ height: 30rem; }
}
@media only screen and (max-width: 414px){
  #dituContent{ height: 40rem; }
}

/* main */
.main{ overflow: hidden; min-height: 25vh; }
.main .article{ overflow: hidden; }
.main .article img{ max-width: 100%; margin:0.75rem 0; }
.main .article strong{ font-size: 1.8rem; color: #666666; line-height: 1.5; }
.main .article p{ font-size: 1.5rem; color: #666666; line-height: 1.8; }
.main .article p br{ display: none; }

/* honor_list */
.honor_list{ display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
.honor_list li{ width: calc(50% - 0.4688rem); margin:0 0 0.9375rem; }
.honor_list li a{ display: block; width: 100%; overflow: hidden; }
.honor_list li a .img{ box-sizing: border-box; border:0.025rem solid #f1f1f1; width:100%; padding-bottom: 75%; position: relative; overflow: hidden; transition: all .3s; }
.honor_list li a img{ width:100%; margin:0!important; height: 100%; object-fit: cover; position: absolute; transition: all .3s; }
.honor_list li a b{ display: block; font-size: 1.5rem; color: #333333; margin-top: 0.75rem; text-align: center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.honor_list li a:hover img{ transition: all .3s; transform: scale(1.05); }
.honor_list li a:hover b{ transition: all .3s; color: var(--zhu-color); }

/* prev_next */
.prev_next{ width:100%; margin:1.25rem 0; display: flex; flex-wrap: wrap; }
.prev_next>div{ width:100%; padding:0.75rem; border: 1px solid #dedede; display: flex;flex-direction: row;align-items: center; justify-content: flex-start; }
.prev_next>div + div{ border-top: 0; }
.prev_next>div a{ font-size: 1.5rem; color: #999; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display: block; width: calc(100% - 6.25rem); }
.prev_next>div a:hover{ color: var(--zhu-color);}


/*page*/
.de-page-mian{overflow: hidden; text-align: center; font-size: 0; margin: 1.25rem 0; width: 100%; clear: both; }
.de-page-mian .page-inner{display: inline-block; overflow: hidden;}
.de-page-mian .page-inner a{display: block; float: left; min-width: 1.625rem; padding: 0 0.4rem; margin:0 0.625rem; height: 2.25rem; border: 0.0625rem solid #dddddd; background: #fff; text-align: center; line-height: 2.25rem; font-size: 0.875rem; color: #333; margin-right: 0.0625rem; overflow: hidden; border-radius: 0.3125rem; }
.de-page-mian .page-inner a.active,
.de-page-mian .page-inner a:hover{color: #fff; border-color:var(--zhu-color); background: var(--zhu-color);}
.de-page-mian .page-inner a.prev{margin-right: 0.625rem; background: #fff url(../images/prev.jpg) no-repeat center;}
.de-page-mian .page-inner a.prev.on{background: #fff url(../images/prev-hover.jpg) no-repeat center;}
.de-page-mian .page-inner a.prev:hover{background-color: #fff; border-color: #dddddd;}
.de-page-mian .page-inner a.next{margin-left: 0.625rem; margin-right: 0.9375rem; background: #fff url(../images/next.jpg) no-repeat center;}
.de-page-mian .page-inner a.next.on{background: #fff url(../images/next-hover.jpg) no-repeat center;}
.de-page-mian .page-inner a.next:hover{background-color: #fff; border-color: #dddddd;}
.de-page-mian .page-inner a.page-btn{font-size: 0.75rem; margin-right: 0; width: 3.9375rem; margin-left: 0.625rem;}
.de-page-mian .page-inner span{display: block; font-size: 0.75rem; color: #333; float: left; line-height: 2.375rem;}
.de-page-mian .page-inner input{display: block; float: left; height: 2.25rem; width: 2.25rem; border: 0.0625rem solid #dddddd; text-align: center; line-height: 2.25rem; font-size: 0.875rem; color: #333; margin: 0 0.3125rem; border-radius: 0.3125rem; }
@media only screen and (max-width: 774px){
  .de-page-mian .page-inner span, .de-page-mian .page-inner input, .de-page-mian .page-inner .page-btn{ display: none; }
}

/*no-goods*/
.no-goods,.no-network{padding-top:6.25rem; overflow: hidden; text-align: center;}
.no-goods img{display: block; margin:0 auto 1.875rem!important; width:13.75rem; max-height: 6.5625rem;}
.no-goods p,.no-network p{font-size:0.875rem; color:#666666; line-height: 1.25rem;}

/* news_tit */
.news_tit{ text-align: center; overflow: hidden; }
.news_tit b{ font-size: 2rem; font-weight: bold; color: var(--zhu-color); line-height: 1.6; }
.news_tit .meta{ padding:0.9375rem 0; border:0.0625rem solid #dedede; text-align: center; margin:1.25rem 0; font-size: 1.125rem; color: #666666; line-height: 1; }

/* article_list */
.article_list{ overflow: visible; margin-bottom: 0.75rem; }
.article_list li + li{ margin-top: 0.9375rem; }
.article_list a{ box-sizing: border-box; display: flex; align-items: center; border:0.0625rem solid #ebebea; padding:0.9375rem; background: #ffffff; transition: all .3s; }
.article_list a .img{ width: 38%; height: 10.625rem; overflow: hidden; }
.article_list a .img img{ width:100%; height:100%; object-fit: cover; margin:0!important; }
.article_list a .txt{ width: 62%; box-sizing: border-box; padding:0 0.9375rem; }
.article_list a .txt b{ font-size: 1.5rem; color: #333333; font-weight: bold; display: block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition: all .3s; }
.article_list a .txt p{ margin:0.875rem 0; font-size: 1rem; line-height: 1.5; display: block; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition: all .3s; }
.article_list a .txt small{ display: inline-flex; align-items: center; font-size: 1.125rem; color: var(--zhu-color); transition: all .3s; }
.article_list a .txt small i{ font-size: 1.3rem; color: var(--zhu-color); line-height: 1; margin-right: 0.375rem; transition: all .3s; }
.article_list a:hover{ transition: all .3s; box-shadow: 0 0 0.5rem rgba(44, 44, 44, .08); }
.article_list a:hover b{ transition: all .3s; color: var(--zhu-color); }
.article_list a:hover > span{ transition: all .3s; background: var(--zhu-color); }

/* n_type */
.n_type{ width: 750px; margin:0 auto; display: flex; align-items: center; justify-content: center; margin-top: 0.5rem; }
.n_type a{ transition: all .3s; display: inline-flex; align-items: center; justify-content: center; padding:.9rem 1.5rem; font-size: 1.2rem; border:0.05rem solid #ebebea; border-radius: 0.125rem; color: #333333; margin:0 0.5rem; }
.n_type a:hover{ transition: all .3s; background: var(--zhu-color); color: #ffffff; border-color: var(--zhu-color); }

@media only screen and (max-width: 750px){
  .n_type{ width: 100%;  }
}

@font-face {
  font-family: "思源宋体 Heavy";font-weight: 900;src: url("http://at.alicdn.com/wf/webfont/fC2rdBEW01IJ/8DhpaoiK80N21SryQxvJh.woff2") format("woff2"),
  url("http://at.alicdn.com/wf/webfont/fC2rdBEW01IJ/19UWoKE0_muDTlT4QiZKE.woff") format("woff");
  font-display: swap;
}
/* join_content */
.join_content{ overflow: hidden; text-align: center; display: flex; flex-direction: column; }
.join_content ul, .join_content ol{ display: flex; flex-direction: column; }
.join_content ul li, .join_content ol li{ width:100%; height: 100%; background: var(--zhu-color);  }
.join_content ul li:nth-of-type(1), .join_content ul li:nth-of-type(3), .join_content ol li:nth-of-type(2){ box-sizing: border-box; padding:1.5rem 2rem; }
.join_content ul li:nth-of-type(1) p, .join_content ul li:nth-of-type(3) p, .join_content ol li:nth-of-type(2) p{ font-size: 1rem; color: #ffffff; line-height: 1.5; }
.join_content ul li p, .join_content ol li p{ width: 100%; height: 100%; }
.join_content ul li img, .join_content ol li img{ width: 100%; height: 100%; object-fit: cover; margin: 0!important; }
.join_content > p img{ margin:0.75rem auto; max-width: 100%; padding:0 0.75rem; }
.join_content ul li:nth-child(2) p{ line-height: 0; }
.join_content ol li:nth-child(1) p, .join_content ol li:nth-child(3) p{ line-height: 0; }
@media only screen and (max-width: 576px){
}

/* case_list */
.case_list{ overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.case_list li{ width: calc(50% - 0.375rem); margin-bottom: 0.75rem; }
.case_list li a{ display: block; position: relative; overflow: hidden; width: 100%; box-sizing: border-box; padding:0.6rem; background: #e9e9e8; }
.case_list li a .img{ width: 100%; padding-bottom: 74%; overflow: hidden; position: relative; }
.case_list li a .img img{ width: 100%; height: 100%; margin:0; position: absolute; object-fit: cover; transition: all .3s; }
.case_list li a > .txt{ display: block; overflow: hidden; }
.case_list li a > .txt b{ font-size: 1.2rem; color: #000000; font-weight: normal; display: block; line-height: 1; padding:0.375rem 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:0.3rem 0 0; }
.case_list li a > .txt p{ font-size: 1rem; color: #333333; line-height: 1.75; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.case_list li a > .txt small{ display: inline-flex; float: right; font-size: 0.6rem; color: #ffffff; background: var(--zhu-color); padding:0.3rem 0.8rem; line-height: 1; margin-top: 0.75rem; }
.case_list li a:hover img{ transition: all .3s; transform: scale(1.05); }
.case_list li a:hover .txt small{ transition: all .3s; background: var(--pei-color); }
@media only screen and (max-width: 576px){
}

/* video_list */
.video_list{ overflow: hidden; margin:0.75rem 0 0; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
.video_list li{ width: calc(50% - 0.375rem); margin-bottom: 0.75rem; }
.video_list li a{ display: flex; flex-direction: column; width: 100%; }
.video_list li a .txt{ display: flex; align-items: center; margin-bottom: 0.75rem; }
.video_list li a .txt span{ margin-right: 0.75rem; display: inline-flex; align-items: center; font-size: 0.6rem; color: var(--zhu-color); padding:0.4rem 0.6rem; line-height: 1; border:0.05rem solid var(--zhu-color); border-radius: 1.25rem; }
.video_list li a .txt b{ display: flex; align-items: center; width: calc(100% - 7rem); font-size: 1rem; color: var(--zhu-color); font-weight: normal; overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.video_list li a .img{ width: 100%; padding-bottom: 64%; position: relative; overflow: hidden; }
.video_list li a .img::before{ content: ""; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.5); position: absolute; top:0; left:0; z-index: 33; }
.video_list li a .img img{ margin:0; width: 100%; height: 100%; object-fit: cover; position: absolute; transition: all .3s; }
.video_list li a .img span{ color: #ffffff; border-radius: 1.25rem; z-index: 34; display: inline-block; font-size: 1rem; line-height: 1; padding:0.5rem 1.6rem; border:0.05rem solid #ffffff; position: absolute; left:50%; top:50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); transition: all .3s; }
.video_list li a:hover img{ transition: all .3s; transform: scale(1.05); }
.video_list li a:hover .img span{ transition: all .3s; background: var(--zhu-color); border-color: var(--zhu-color); color: #ffffff; }
@media only screen and (max-width: 576px){
  .video_list li a .txt b{ width: calc(100% - 9rem); }
}
@media only screen and (max-width: 414px){
  .video_list li a .txt{ flex-wrap: wrap; }
  .video_list li a .txt b{ width: 100%; margin-top: 0.5rem; }
}







<!--耗时1775416924.0223秒-->