@charset "utf-8"; html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, caption, tbody, tfoot, thead, 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, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; } html {overflow-x: hidden;} p{ line-height: initial; } /* always display scrollbars */ body {font-family: "PingFang SC", 微软雅黑, "Microsoft YaHei", Arial, 黑体, 宋体;; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } input, select,button{ vertical-align: middle; outline: none; padding:0; } ol, ul,li{ list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } strong,i,em,b{ font-style:normal; font-weight:normal; } img { border:0;} input[type="text"], input[type="button"], input[type="submit"], input[type="reset"] ,select{ -webkit-appearance: none; border-radius: 0;} textarea { -webkit-appearance: none; border-radius: 0; background:none; outline:none; padding:0; margin:0; border:none;} ::-moz-selection { background:rgb(204,0,0); color: #fff; text-shadow: none; } ::selection { background:rgb(204,0,0); color: #fff; text-shadow: none; } a{ text-decoration:none; blr: expression(this.onFocus=this.blur()); cursor: pointer; color:#000; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } a:link, a:visited { text-decoration: none; } a:active, a:hover { text-decoration: none; } .clear { clear: both; } .clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } .fl{ float:left;} .fr{ float:right;} h1,h2,h3,h4,h5{ font-weight:normal; display:block;} input,button,table,tr,td,textarea{ font-family:Microsoft yahei,Arial;} .w1500{ /* max-width: 1520px; */ margin: auto; } /*nav*/ p { display: block; margin-block-start: 0em; margin-block-end: 0; margin-inline-start: 0px; margin-inline-end: 0px; } @font-face { font-family: TIN; src: url("../fonts/tungsten.otf"); font-weight: normal; font-style: normal; } @font-face { font-family: BIN; src: url("../fonts/BrownStd-Regular.woff.ttf"); font-weight: normal; font-style: normal; } @font-face { font-family: SIN; src: url("../fonts/Times New Roman.ttf"); font-weight: normal; font-style: normal; } @font-face { font-family: AIN; src: url("../fonts/AslinaBold.otf"); font-weight: normal; font-style: normal; } @font-face { font-family: CIN; src: url("../fonts/CgFuturaMaxiBd.ttf"); font-weight: normal; font-style: normal; } header{height: 85px;width: 100%;box-sizing: border-box;box-shadow: 0 10px 30px -5px rgba(210,210,210);background-color: #fff;position: fixed;left: 0;top: 0;right: 0;z-index: 99999999;} header .logo img{display: block;height: 40px;} .nav{width: 58%;margin-left: 6%;display: flex;justify-content: flex-end;} .fixed{ position: fixed; left: 0; top: 0; z-index: 1000;box-shadow: 0 0 15px rgba(0,0,0.0.15);} .nav li{width: 13.5%;float: left;line-height: 85px;text-align: center;font-size: 16px;position:relative;} .nav li a{color: #242424 ; } .nav li>a.on{color:#cc0000 ; } .nav li a:hover{ color:#cc0000 ; } .nav li .show {position: absolute;display:none;top: 85px;left: -15%;width: 130%;text-align: center;overflow: hidden;padding:6px 0;background:#fff;z-index:999;} .nav li:hover .show {display:block;} .nav li .show a {line-height:36px;position: relative;font-size: 14px;color:#000;display: block;} .nav li .show a:hover {color: #cc0000;} @-webkit-keyframes fadedown { from { -webkit-transform: translateY(-100%); opacity: 0; } to { -webkit-transform: translateY(0); opacity: 1; } } .nav li dl {position: absolute;text-align: center;width: auto; z-index: 9999; color: #333; background: #fff;top:90px;left: 50%; -webkit-box-shadow: 0 13px 10px 0px rgba(151, 150, 150, 0.22);box-shadow: 0 13px 10px 0px rgba(151, 150, 150, 0.22);border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;overflow: hidden;} .nav li dl dd {height: 50px;line-height: 50px; transition: all .36s ease;border-bottom: 1px solid rgba(0, 0, 0, 0.08); -ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease} .nav li dl dd:last-child {border-bottom: 0} .nav li dl dd a { white-space: nowrap; color: #333; transition: all .36s ease; padding: 0 15px; -ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease;display: block} .nav li dl dd:hover {background: #cc0000} .nav li dl dd:hover a { color: #fff;} .nav dl {visibility: hidden;opacity: 0;filter: alpha(opacity=0);transform: translateX(-50%) translateY(20px);-ms-transform:translateX(-50%) translateY(20px);-o-transform:translateX(-50%) translateY(20px); -webkit-transform:translateX(-50%) translateY(20px);-moz-transform:translateX(-50%) translateY(20px);transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease} .nav li:hover dl {visibility: visible;opacity: 1;filter: alpha(opacity=100);transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%)} .menubox.solid{ position: fixed; top: 0px; left: 0; right: 0; z-index: 9999; height: 85px; line-height: 85px; background:#ffffff; border-bottom: none; -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1); shadow: 0 5px 5px rgba(0, 0, 0, 0.1); -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in;} .menubox.solid a:hover{color:#de5727 ; } @-webkit-keyframes bgscale { from { -webkit-transform: scale(1.05); transform: scale(1.05); } to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bgscale { from { -webkit-transform: scale(1.05); transform: scale(1.05); } to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes bgscale2 { from { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.05); transform: scale(1.05);} } @keyframes bgscale2 { from { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.05); transform: scale(1.05);} } @-webkit-keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) } 66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) } 88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) } } @-moz-keyframes jello { from, 11.1%, to { -moz-transform: none; transform: none } 22.2% { -moz-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) } 33.3% { -moz-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) } 44.4% { -moz-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) } 55.5% { -moz-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) } 66.6% { -moz-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) } 77.7% { -moz-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) } 88.8% { -moz-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) } } @keyframes jello { from, 11.1%, to { -webkit-transform: none; -moz-transform: none; transform: none } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); -moz-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); -moz-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); -moz-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); -moz-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) } 66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); -moz-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); -moz-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) } 88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); -moz-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) } } /* 手机端menu按钮 */ .menu-handler { width: 64px; float: right; height: 54px; display: none; cursor: pointer; position: absolute; right: 0px; top: 0px; } .menu-handler span { position: relative; display: block; margin: 25.5px auto 0px; width: 28px; height: 3px; background-color: #cc0000; transition-duration: 0.3s, 0.3s; transition-delay: 0.3s, 0s; } .menu-handler span::after, .menu-handler span::before { content: ""; position: absolute; display: inline-block; width: 100%; height: 3px; left: 0px; background-color: #cc0000; transition-duration: 0.3s, 0.3s; transition-delay: 0.3s, 0s; } .menu-handler span::before { top: -9px; transition-property: top, transform; } .menu-handler span::after { bottom: -9px; transition-property: bottom, transform; } .menu-handler.active span { background-color: transparent; transition-delay: 0s, 0s; } .menu-handler.active span::after, .menu-handler.active span::before { transition-delay: 0s, 0.3s; } .menu-handler.active span::before { top: 0px; transform: rotate(45deg); } .menu-handler.active span::after { bottom: 0px; transform: rotate(-45deg); } .menuBox a:link, .menuBox a:visited { color: rgb(255, 255, 255); } .menuBox a:active, .menuBox a:hover { color: rgb(255, 255, 255); } .menuBox { background-color: rgba(0, 0, 0, 0.8); color: rgb(255, 255, 255); position: fixed; display: none; right: 0px; top: 0px; height: 100vh; overflow: hidden auto; transform: translateX(100%); width: 400px; z-index: 980; transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; } .menuMoblie { padding: 80px 0px 80px; } .menuMoblie .nav-link { display: block; font-size: 20px; padding: 10px 22px 10px 80px; position: relative; } .menuMoblie .cur { opacity: 0.9; border-top: 1px solid rgb(219, 219, 219); border-bottom: 1px solid rgb(219, 219, 219); background-color: rgb(232, 232, 232); } .menuMoblie .cur .nav-link { color: #004ea2; } .menuMoblie .subnav { padding-bottom: 12px; display: none; } .menuMoblie .subnav a { position: relative; display: block; padding: 10px 22px 10px 80px; line-height: 1.4; color: rgb(51, 51, 51); font-size: 15px; } .pusher-black { position: fixed; width: 100%; height: 100%; left: 0px; top: 0px; background-color: rgba(0, 0, 0, 0.4); z-index: 900; visibility: hidden; opacity: 0; transition: all 0.2s cubic-bezier(0.02, 0.01, 0.47, 1) 0s; } .menuOpen .pusher-black { visibility: visible; opacity: 1; } .menuOpen .menuBox { transform: translateX(0px); } .header{ display: flex; padding-left: 3vw; align-items: center; } .rightFlex{ display: flex; align-items: center; height: 85px; width: 24%; justify-content: flex-end; } .telIcon{ display: flex; align-items: center; font-size: 20px; color: #333333; font-family: TIN; padding: 0 25px; border-left: 1px solid rgb(229,229,229); height: 85px; } .telIcon img{ margin-right: 5px; } .index-input{ background: rgb(245,245,245); height: 85px; display: flex; align-items: center; justify-content: center; width: 85px; } /* banner */ .banner{ width: 100%; } .banner>img{ display: none;} .banner .swiper-container{ width: 100%;} .aniu{ display: none;} .banpage { position: absolute; z-index: 10; top: 50%; transform: translateY(-50%); border: 1px solid #fff; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius:50% ; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; cursor: pointer; } .banpage.left{ left: 1%;transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg);} .banpage.right{ right: 1%; } .banpage img{ width: 40%;} .banpage:hover{ background: rgba(204,0,0,0.5);} .banner:hover .aniu{ display: block;} /* 产品中心 */ .itscp{ /* cursor: pointer; */ } .itscp-txt{ font-size: 36px; color: #353535; line-height: 42px; margin-top: 10px; } .itscp-bj{ height: 820px; overflow: hidden; position: relative; } .itscp-lt{ width: 48%; height: 100%; float: left; position: relative; } .itscp-lt1{ font-size: 300px; text-align: right; line-height: 1; color: rgb(225,225,225); font-family: CIN; padding-top: 50px; padding-right: 7%; } .itscp-lt2{ line-height: 400px; text-align: center; position: absolute; left: 50%; top: 125px; margin-left: -18vw; } .itscp-lt2 img{ width: 100%; } .itscp-ct{ width: 27%; background: #fff; float: left; margin-top: 170px; padding: 0 45px; padding-bottom: 35px; } .itscp-ct1{ font-size: 60px; color: rgb(204,0,0); line-height: 75px; display: inline-block; position: relative; top: -30px; font-family: BIN; position: relative; } .itscp-ct1::after{ content: ''; position: absolute; left: 6px; right: 6px; height: 2px; bottom: 0; background: rgb(204,0,0); } .changePage { padding-bottom: 80px; display: flex; align-items: center; justify-content: center; } .changePage p { margin-right: 12px; font-size: 15px; color: rgb(51, 51, 51); letter-spacing: 1px; } .changePage a { padding: 8px 13px; border: 1px solid rgb(208, 208, 208); border-radius: 3px; font-size: 14px; letter-spacing: 1px; text-align: center; color: rgb(51, 51, 51); margin-right: 16px; transition: all 0.4s ease 0s; background: rgb(255, 255, 255); border-radius: 50%; } .changePage a:hover { background:rgb(204,0,0); color: rgb(255, 255, 255); } .pageEnter input { font-size: 14px; letter-spacing: 1px; color: rgb(51, 51, 51); padding: 8px 0px; border: 1px solid rgb(208, 208, 208); border-radius: 25px; width: 65px; text-align: center; background: rgb(255, 255, 255); } .changePage>a:last-child { margin-right: 0px; padding: 8px 20px; border-radius: 25px !important; } .changePage .on { color: rgb(255, 255, 255); border: 1px solid rgb(204,0,0); background: rgb(204,0,0); } .prevpage, .nextpage { border-radius: 25px !important; } .itscp-ct2{ display: block; margin-top: 10px; } .itscp-ct2 .d1{ font-size: 1.5vw; font-family: arial; color: #333; line-height: 38px; margin-bottom: 20px; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .itscp-ct2 .d2{ font-size: 20px; color: #000; line-height: 25px; height: 50px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .itscp-ct2 .d3{ font-size: 15px; color: #999; line-height: 28px; height: auto; margin-top: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .itscp-ct3{ overflow: hidden; margin-top: 50px; display: flex; align-items: center; justify-content: space-between; } .itscp-ct3 .d1{ float: inherit; font-size: 20px; color: #999; line-height: 1; float: left; font-family: BIN; } .itscp-ct3 .d1 .sp1{ font-size: 44px; color: rgb(204,0,0); } .itscp-ct3 .d2{ float: right; width: 80px; overflow: hidden; padding-top: 0; } .itscp-ct3 .d2 .sp1{ width: 30px; height: 25px; background: url(../images/prev.png) no-repeat center; float: left;cursor: pointer; } .itscp-ct3 .d2 .sp1:hover{ background-image: url(../images/prev.png); } .itscp-ct3 .d2 .sp2{ width: 30px; cursor: pointer; height: 25px; background: url(../images/next.png) no-repeat center; float: right; } .itscp-ct3 .d2 .sp2:hover{ background-image: url(../images/next.png); } .itscp-rt{ float: right; width: 24%; height: 100%; position: relative; z-index: 2; margin-top: -78px; } .itscp-i{ position: absolute; top: 0px; right: -20px; width: 380px; height: 100%; background: url(../images/ico30.png) no-repeat right center; } .itscp-swiper{ width: 100%; height: 100%; padding-right: 20px; position: relative; right: 20px; } .itscp-pro{ width: 100%; height: 184px; position: absolute; top: 50%; left: 0; margin-top: -92px; text-align: right; } .itscp-b{ display: inline-block; cursor: pointer; width: 184px; height: 184px; background: url(../images/ico29.png) no-repeat center; background-size: cover; padding: 52px; line-height: 80px; float: right; margin-right: 25px; transition: all .3s; -webkit-transition: all .3s; } .itscp-b img{ max-height: 100%; } .itscp-a{ float: right; text-align: left; width: 0px; overflow: hidden; opacity: 0; } .itscp-a1{ font-size: 46px; line-height: 1; color: rgb(204,0,0); font-family: DIN-Condensed-Bold; padding-top: 50px; transition: all .3s;; -webkit-transition: all .3s; } .itscp-a2{ font-size: 16px; line-height: 25px; color: #333; margin-top: 10px; } .itscp-pro{ position: relative; /*left: 300px;*/ transition: all .3s;; -webkit-transition: all .3s; } .itscp-swiper .swiper-slide-active .itscp-b{ background-image: url(../images/ico28.png); transition: all .3s; -webkit-transition: all .3s; } .itscp-swiper .swiper-slide-active .itscp-a{ width: 130px; transition: all .3s;; -webkit-transition: all .3s; } .itscp-swiper .swiper-slide-active .itscp-pro{ left: 0; } .itscp-c{ display: none; } .itscp-next,.itscp-prev{ display: none; } @media(max-width:1670px){ .itscp-i{ right: -70px; } .itscp-pro{ height: 150px; margin-top: -75px; } .itscp-b{ width: 150px; height: 150px; padding: 40px; line-height: 70px; background-size: cover; } .itscp-swiper .swiper-slide-active .itscp-a{ width: 110px; } .itscp-a1{ font-size: 30px; padding-top: 25px; } .itscp-a2{ font-size: 14px; line-height: 20px; } } @media(max-width:1200px){ .itscp-bj{ height: auto; background-position-x: left; } .itscp-i{ display: none; } .itscp-ct{ width: 50%; } .itscp-ct{ width: 50%; } .itscp-rt{ width: 100%; height: 150px; margin: 50px 0; padding: 0 30px; position: relative; } .itscp-swiper{ padding: 0; right: 0; } /*.itscp-swiper .swiper-slide-active .itscp-b{ background-image: url(../img/ico29.png); }*/ .itscp-swiper .swiper-slide{ } .itscp-a{ width: calc(100% - 135px) !important; max-width: 150px; margin-left: 15px; } .itscp-b{ width: 120px; height: 120px; padding: 35px; line-height: 50px; margin-right: 0px; } .itscp-next, .itscp-prev{ display: block; background: rgb(204,0,0); width: 30px; height: 60px; margin-top: -30px; background-repeat:no-repeat; background-position: center; background-size: 15px 25px; } .itscp-pro{ height: 120px; top: 0; margin: 0; } .itscp-rt{ height: 120px; } } @media(max-width:1000px){ .itscp-lt{ width: 300px; } .itscp-ct{ width: 350px; margin-left: 50px; height: 420px; } .itscp-lt1{ font-size: 150px; } .itscp-ct2{ margin-top: 10px; } .itscp-lt2 img{ width: 200px; padding: 0px; margin-left: -100px; top: 160px; } } .knowMore{ display: inline-block; color: #fff; width: 160px; height: 50px; line-height: 50px; text-align: center; background: rgb(204,0,0); margin-top: 40px; font-size: 16px; transition: all .36s; } .knowMore:hover{ box-shadow: 0 0 10px rgba(204,0,0,0.2); transform: translateX(15px);} .pubTit{ text-align: center; font-size: 44px; color: #000; padding: 60px 0 0 0; } /* 产品中心结束 */ /* 关于我们 */ .indexAbout .txt .top{ margin-left:10vw; padding-top: 100px;} .indexAbout .txt .top .videoImg{ width: 20%;overflow: hidden;-webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; } .indexAbout .txt .top .videoImg img{width: 100%; height: 100%; object-fit: cover; } .videoImg .playBtn{position: absolute;top: 50%;left: 50%;z-index: 5;width: 75px;height: 75px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.5); -webkit-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%; transform: translate(-50%,-50%); box-shadow: 0 0 rgba(255, 255, 255, 0.1),0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1); animation: ripple-wave1 1s linear infinite;animation-play-state: running;opacity: 1;visibility: visible;-webkit-animation: ripple-wave1 1s linear infinite; } @keyframes ripple-wave1{ to { box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1),0 0 0 45px rgba(255, 255, 255, 0.02); } } .indexAbout .txt .top .videoImg:hover{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .aboutBox{ position: relative; padding: 110px 0 0 0; } .aboutBox:before{ content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 75%; left: 25%; background: url(../images/blue.jpg); background-repeat: no-repeat; background-size: cover; } .About{ display: flex; cursor: pointer; } .aboutLeft{ width: 80%; position: relative; z-index: 999; background: #fff; display: flex; box-shadow:0px 2px rgba(230,230,230,0.4) inset; padding-left: 8vw; } .aboutSide{ width: 10vw; position: relative; left: 1px; overflow: hidden; } .aboutLeft::after{ content: ''; position: absolute; left: 18vw; height: 14vw; width: 1px; background: rgb(230,230,230); } .aboutSide{ display: flex; padding: 70px 0px 150px 0px; border: 1px solid rgb(229,229,229); margin-top: 14vw; align-items: center; justify-content: center; } .aboutTit>p:nth-child(1){ font-size: 44px; color: #000; margin-bottom: 10px; } .aboutTit>p:nth-child(2){ font-size: 30px; font-family: BIN; color: rgb(204,0,0); text-transform: uppercase; font-weight: 600; } .aboutDesc{ margin-top: 40px; } .aboutDesc p{ font-size: 16px; color: #666666; line-height: 40px; } .readMore{ display: flex; align-items: center; margin-top:40px; position: relative; z-index: 99; } .readMore p{ font-size: 18px; display: inline; border-bottom: 1px solid #333; color: #333; margin-right: 20px; } .readMore img{ width: 10%; } .aboutSide>p:nth-child(2){ font-family: BIN; color: rgb(229,229,229); font-size: 36px; writing-mode: vertical-lr; text-transform: uppercase; margin-left: 0; } .aboutSide>p:nth-child(1){ font-family: BIN; color: rgb(229,229,229); font-size: 60px; writing-mode: vertical-lr; text-transform: uppercase; margin-top: -2px; line-height: inherit; } .w1500{ padding: 0 10vw; } /* 企业优势 */ .advFlex{ display: flex; } .Adv{ background: url(../images/bl.jpg); background-repeat: no-repeat; background-size: cover; position: relative; height: 770px; overflow: hidden; } .advTit{ color: rgba(255,255,255,0.9); text-align: center; font-size: 44px; padding-top: 0; position: absolute; width: 100%; top: 65px; z-index: 99; letter-spacing: 3px; } .advFlex{ display: flex; position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .advShow{ position: relative; z-index: 99; text-align: center; display: flex; flex-direction: column; align-items: center; transition: all 0.6s; } .advFlex>div:nth-child(3){ border-right: none; } .advPart{ width: 33.3%; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; border-right: 1px solid rgba(255,255,255,0.2); padding: 80px 0 0 0; transition: all 0.8s; cursor: pointer; } .advPart:hover::after{ height: 100%; } .advIcon{ transition: all 0.6s; } .advPart:hover .advIcon{ background: #fff; } .advPart::after{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 0; transition: all 0.6s; background: rgba(0,0,0,0.4); } .advIcon{ display: flex; align-items: center; justify-content: center; width: 110px; height: 110px; border: 1px solid rgba(255,255,255,0.3); border-radius: 50%; margin-bottom: 40px; } .advType>p:nth-child(1){ font-size: 34px; color: rgba(255,255,255,0.9); margin-bottom:25px; text-align: center; } .advType>p:nth-child(2){ font-size: 20px; color: rgba(255,255,255,0.9); margin-bottom: 20px; font-family: 宋体; text-transform: uppercase; } .advWord{ margin-top: 30px; margin-bottom: 30px; } .advWord p{ line-height: 38px; color: rgba(255,255,255,0.9); font-size: 17px; text-align: center; } .advMore{ margin: auto; display: inline-block; width: 150px; height: 45px; line-height:42px; text-align: center; color: rgba(255,255,255,0.9); border: 2px solid rgba(255,255,255,0.9); border-radius: 30px; font-size: 14px; transition: all 0.4s; } .advIcon{ } .advType{ } .advMore:hover{ background: rgb(204,0,0); border: 2px solid rgb(204,0,0); border-radius: 6px; } .advPart:hover .advShow{ transform: translateY(5%); } .advPart:hover .advHide{ transform: translateY(0%); height: auto; } .advHide{ transition: all 0.6s; transform: translateY(100%); height: 0px; overflow: hidden; z-index: 99; display: flex; flex-direction: column; } .advFlex>div:nth-child(1) .icon{ display: inline-block; width: 48px; height: 50px; background: url(../images/ic1.png); background-repeat: no-repeat; background-size: cover; transition: all 0.5s; } .advFlex>div:nth-child(1):hover .icon{ display: inline-block; width: 48px; height: 50px; background: url(../images/ic11.png); background-repeat: no-repeat; background-size: cover; } .advFlex>div:nth-child(2) .icon{ display: inline-block; width: 50px; height: 48px; background: url(../images/ic2.png); background-repeat: no-repeat; background-size: cover; transition: all 0.5s; } .advFlex>div:nth-child(2):hover .icon{ display: inline-block; width: 50px; height: 48px; background: url(../images/ic22.png); background-repeat: no-repeat; background-size: cover; } .advFlex>div:nth-child(3) .icon{ display: inline-block; width: 50px; height: 49px; background: url(../images/ic3.png); background-repeat: no-repeat; background-size: cover; transition: all 0.5s; } .advFlex>div:nth-child(3):hover .icon{ display: inline-block; width: 50px; height: 49px; background: url(../images/ic33.png); background-repeat: no-repeat; background-size: cover; } .aboutMore{ padding:4vw 110px; padding-bottom: 20px; } .aboutMore .readMore:hover p{ color: #cc0000;} .aboutMore .readMore:hover img{ transform: rotate(34deg); } /* 新闻中心 */ .News{ background: url(../images/newbg.jpg); background-repeat: no-repeat; background-size: cover; padding-bottom: 70px; } .newTit{ text-align: center; letter-spacing: 3px; font-size: 44px; color: #000; padding: 60px 0; } .newsFlex{ display: flex; } .newsFlex>div:nth-child(2){ margin-right: 0; } .Art{ width: 49%; margin-right: 2%; background: #fff; } .Information{ width: 49%; } .artPart{ padding: 0 30px; background: #fff; display: inline-block; width: 100%; } .artFlex{ display: flex; align-items: center; justify-content: space-between; padding: 25px 0; font-size: 28px; color: #000; } .artPart:hover .art1{ color:rgb(204,0,0);} .artFlex p{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; width: 90%; } .artPic{ overflow: hidden; margin-bottom: 25px; } .artPic img{ float: left; width: 100%; max-height: 400px; } .art1{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; font-size: 22px; color: #000; margin-bottom: 20px; } .art2{ font-size: 15px; color: #666666; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 25px; line-height: 28px; } .art3{ font-size: 14px; font-family: arial; color: #666666; } .inforTop{ padding:0 25px 25px 25px; background: #fff; display: inline-block; width: 100%; margin-bottom: 20px; } .Report{ display: flex; align-items: center; } .rePic{ overflow: hidden; width: 35%; } .rePic img{ float: left; width: 100%; } .Report .artDesc{ width: 62%; margin-left: 3%; } .viewDesc{ font-size: 15px; color: #666666; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; } .viewPart{ border-bottom: 1px solid rgb(238,238,238); padding: 30px 30px; background: #fff; display: inline-block; width: 100%; } .viewPart:hover .artFlex{ color: rgb(204,0,0);} .View>a:last-child{ border-bottom: none; } .View .artFlex{ padding: 0; margin-bottom: 10px; } .Report .art1{ margin-bottom: 16px; } .Report .art2{ margin-bottom: 20px; } .Report:hover .art1{ color: rgb(204,0,0);} .View .artFlex p{ font-size: 22px; } .News .swiper-pagination-bullet { width: 26px; height: 2px; display: inline-block; border-radius: 0; background: rgb(220,220,220); opacity: 1; } .News .swiper-pagination-bullet-active{ background: rgb(204,0,0); } .News .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0 5px; } .News .swiper-container-horizontal>.swiper-pagination-bullets{ } .With{ display: flex; margin:50px 0 ; } .With>div:last-child{ margin-right: 0; } .withPart{ width: 33.3%; margin-right: 2%; display: flex; align-items: center; justify-content: center; padding: 65px 0; cursor: pointer; transition: all .36s; } .withPart:hover{ box-shadow: 0 10px 10px rgba(0 0 0 / 40%); transform: translateY(-10px);} .With>div:nth-child(1){ background: url(../images/bg1.jpg); background-repeat: no-repeat; background-size: cover; } .With>div:nth-child(2){ background: url(../images/bg2.jpg); background-repeat: no-repeat; background-size: cover; } .With>div:nth-child(3){ background: url(../images/bg3.jpg); background-repeat: no-repeat; background-size: cover; } .withDesc{ margin-left: 22px; } .withDesc>p:nth-child(1){ font-size: 26px; margin-bottom: 12px; color: #fff; letter-spacing: 1px; } .withDesc>p:nth-child(2){ font-size: 16px; color: #fff; font-family: BIN; text-transform: uppercase; } .withIcon{ width:70px; height: 70px; border: 2px solid #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; } /* footer */ footer { position: relative; background: url(../images/footer.jpg); background-repeat: no-repeat; background-size: cover; padding-bottom: 28px; } .footUp { position: absolute; cursor: pointer; } .footer { display: flex; padding-top: 70px; justify-content: space-between; } .hotLine>p:nth-child(1) { color: #fff; font-size: 18px; margin-bottom: 15px; } .hotLine>p:nth-child(2) { color: #fff; font-size: 28px; font-family: DIN; margin-bottom: 50px; } .footFlex { display: flex; justify-content: space-between; } .footFlex p { font-size: 18px; color: #fff; margin-bottom: 30px; } .footFlex a { font-size: 14px; color: rgba(255,255,255,0.5); margin-bottom: 15px; transition: all 0.3s; } .footA a { display: block; } .footA a:hover{ color: #fff; } .footLeft { width: 65%; } .footRight { } .footEwm { display: flex; align-items: center; justify-content: center; flex-direction: column; } .footEwm img { width: 110px; height: 110px; } .footEwm p { font-size: 14px; color: #fff; margin-top: 22px; } .footIcon { display: flex; } .footIcon>div:first-child { margin-right: 50px; } .foBottom { margin-top: 60px; } .foBottom p { color: rgba(255,255,255,0.5); font-size: 14px; padding: 15px 0; width: 100%; } .foFlex { display: flex; align-items: center; justify-content: space-between; } .footUp { position: absolute; right: 0; top: 0; bottom: 0; width: 130px; background: rgb(36, 36, 36); display: flex; align-items: center; justify-content: center; flex-direction: column; } .footUp p { font-size: 16px; color: #fff; writing-mode: vertical-lr; margin-top: 25px; } .devideApply { display: flex; align-items: center; justify-content: space-between; padding: 0 20px; border: 1px solid rgba(255,255,255,0.2); width: 18%; margin-top: 0; margin-bottom: 0; cursor: pointer; z-index: 999; position: relative; } .devideApply input { padding: 16px 0; width: 90%; font-size: 14px; color: #fff; } .devideApply { position: relative; } .Product{ display: flex; margin-top: 40px; } .proLeft{ width: 340px; margin-right: 3%; } .proRight{ width: 75%; } .proTit{ display: flex; align-items: center; justify-content: space-between; padding: 0px 25px; background: rgb(245,245,245); height: 65px; cursor: pointer; } .proShow{ display: flex; justify-content: space-between; padding: 12px 25px; background: rgb(245,245,245); } .proMenu{ padding:15px 0 15px 0; background: rgb(245,245,245); } .proLeft .proBox.on .proMenu{ display: block;} .Machine{ padding: 28px 60px; display: flex; border: 1px solid rgb(229,229,229); margin-bottom: 40px; align-items: center; } .machPic{ width: 50%; overflow: hidden; } .machPic img{ float: left;width: 100%; } .machDesc{ width: 45%; margin-left: 5%; } .ma1{ font-size: 20px; color: #aaaaaa; font-family: BIN; font-weight: 600; margin-bottom: 20px; } .ma2{ font-size: 34px; color: #000000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; margin-bottom: 20px; } .ma3{ font-size: 16px; color: #666666; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; line-height: 30px; margin-bottom: 35px; } .machMore{ display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgb(229,229,229); padding-top: 35px; } .ma4{ color: rgb(204,0,0); font-weight: 600; font-size: 14px; font-family: BIN; } .ma5{ width: 16px; transition: all .36s; height:16px; background: url(../images/art.png); background-repeat: no-repeat; background-size: cover; } .pr2{ width: 14px; height:14px; background: url(../images/arb.png); background-repeat: no-repeat; background-size: cover; } .pr4{ width: 6px; height:10px; background: url(../images/ard.png); background-repeat: no-repeat; background-size: cover; position: relative; top:6px; } .pr3{ font-size: 15px; color: #555555; } .Machine:hover .ma2{ color: #cc0000;} .Machine:hover .ma5{ transform: rotate(45deg);} .proMenu{ display: none; } .proLeft .on .proTit{ background:rgb(204,0,0); } .proLeft .on .pr1{ color: #fff; } .proLeft .on .pr2{ width: 14px; height:2px; background: url(../images/arw.png); background-repeat: no-repeat; background-size: cover; } .pr1{ font-size:18px; color:#333; } .proBox { margin-bottom:5px; } .proShow:hover .pr3{ color:rgb(204,0,0); } .proShow:hover .pr4{ width: 6px; height:10px; background: url(../images/arc.png); background-repeat: no-repeat; background-size: cover; } .localAt{ display: flex; align-items: center; } .localAt .on{ color: rgb(204,0,0); font-size: 18px; } .localAt p, .localAt a{ margin-left: 10px; color: #666666; font-size: 18px; } .localAt a:last-child{ color: #cc0000;} .localFlex{ display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgb(229,229,229); padding:45px 0; } .backTo{ display: flex; align-items: center; } .ba1{ background: url(../images/back.png); background-repeat: no-repeat; background-size: cover; width: 22px; height: 20px; margin-right: 8px; } .backTo:hover .ba2{ color: #cc0000;} .bgg{ background: url(../images/grey.jpg); background-repeat: no-repeat; background-size: cover; } .askBox{ display: flex; align-items: center; padding: 65px 0; } .askPic{ width: 50%; overflow: hidden; background: #fff; } .askPic img{ float: left; width: 100%; padding: 30px; } .askDesc{ width: 45%; margin-left: 5%; } .askFlex{ display: flex; align-items: center; border: 1px solid rgb(220,220,200); width: 155px; height: 50px; justify-content: center; margin-top: 80px; } .askFlex:hover{ background-color: #fff;} .ask4{ display: inline-block; width: 22px; height: 22px; background: url(../images/ask.png); background-repeat: no-repeat; background-size: cover; margin-right: 10px; } .ask5{ font-size: 16px; color: #333333; } .askFlex:hover .ask5{color: #cc0000;} .ask1{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; font-size: 40px; color: #000000; margin-bottom: 25px; } .ask2{ font-size: 20px; color: #666666; line-height: 20px; margin-bottom: 40px; } .ask3{ font-size: 15px; color: #666666; line-height: 2; /* text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; */ } .sideNav{ display: flex; align-items: center; justify-content: space-between; height: 75px; } .sideTop{ border-bottom: 1px solid rgb(229,229,229); } .sideLink{ display: flex; } .sideLink a:nth-child(3){ /*margin-right: 0;*/ } .sideLink a{ font-size: 16px; color: #666; margin-right: 6vw; position: relative; height: 75px; display: inline; line-height: 75px; } .sideLink .on{ color: rgb(204,0,0); } .sideLink a:after{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; width: 0; height: 1; background: rgb(204,0,0); transition: all 0.4s; } .sideLink a:hover:after{ width: 100%; } .sideLink .on:after{ width: 10% } .sideTop .localAt p,.sideTop .localAt a{ font-size: 14px; } .serTit{ text-align: center; font-size: 40px; color: #000; padding: 50px 0; } .Service{ display: flex; } .Service>div:nth-child(4){ margin-right: 0; } .serPart{ margin-right: 5%; border-radius: 50%; display: flex; align-items: center; flex-direction: column; position: relative; width: 25%; /* height: 16rem; */ /* padding: 6.5rem 0; */ min-height: 17vw; justify-content: center; cursor: pointer; } .serPart::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: rgb(204,0,0); transition: all 0.6s; border-radius: 50%; transform: scale(0,0); } .serPart:hover:before{ transform: scale(1,1); } .serPart:hover .serWord{ color: #fff; } .serPart::after{ content: ''; position: absolute; top: 0; left: 0; background: url(../images/top.png) no-repeat center center; background-size: 100% 100%; transition: all .36s; width: 100%; height: 0; padding-bottom: 100%; } .serWord{ font-size: 22px; color: #333333; text-align: center; position: relative; z-index: 99; transition: all .36s; } .serIcon{ margin-bottom: 30px; height: 65px; overflow: hidden; } .serIcon .icn1 { display: flex; position: relative; z-index: 99; } .serPart:hover .serIcon .icn2{ transform: translateY(-100%); } .serPart:hover .serIcon .icn1{ transform: translateY(-100%); } .Online{ box-shadow: 1px 1px 10px 1px rgb(230,230,230); margin-top: 70px; padding: 0 90px; padding-bottom: 70px; margin-bottom: 70px; } .onlineTit{ padding:50px 0; } .onlineTit>p:nth-child(1){ font-size: 40px; color: #000; margin-bottom: 20px; text-align: center; } .onlineTit>p:nth-child(2){ font-size: 16px; color: #888888; text-align: center; } .Message{ display: flex; flex-wrap: wrap; } .Message>div:nth-child(2){ margin-right: 0; margin-bottom: 1.5%; width: 49%; } .Message>textarea:nth-child(4){ margin-right: 0; } .messPut{ width: 49%; margin-right: 2%; margin-bottom: 1.5%; background: rgb(245,245,245); height: 56px; padding: 0 20px; font-size: 16px; color: #888888; } .messBox{ width: 49%; margin-right: 2%; } .WholePut{ width: 100%; margin-bottom: 3%; background: rgb(245,245,245); height: 56px; padding: 0px 20px; font-size: 16px; color: #888888; } .devideApply { display: flex; align-items: center; justify-content: space-between; padding: 0 20px; } .devideApply input { height: 56px; width: 90%; font-size: 16px; color: #888; } .devideApply { position: relative; } .hidePro { overflow-y: auto; position: absolute; left: 0px; right: 0px; bottom: 52px; border-bottom: none; border-top: none; background: rgba(255, 255, 255, 0.9); z-index: 99; box-sizing: border-box; border-left: 1px solid rgb(180,180,180); border-right: 1px solid rgb(180,180,180); display: none; z-index: 999; } .hidePro p { padding: 12px 20px; font-size: 14px; border-bottom: 1px solid rgb(180,180,180); box-sizing: border-box; cursor: pointer; display: block; } .hidePro a:hover { color: rgb(204,0,0); } .messFlex .devideApply{ width: 100%; margin-bottom: 0; } .messFlex{ width: 100%; display: flex; } .messFlex textarea{ width: 49%; font-size: 16px; color: #888; padding: 20px; background: rgb(245,245,245); } .formButton{ width: 100%; display: flex; margin-top: 45px; margin-bottom: 35px; align-items: center; justify-content: center; } .giveUp{ width: 200px; height: 54px; text-align: center; border-radius: 6px; background: rgb(204,0,0); color: #fff; line-height: 54px; text-align: center; margin-right:30px ; font-size: 18px; } .reset{ width: 200px; height: 54px; text-align: center; border-radius: 6px; color: #888; line-height: 54px; text-align: center; margin-right:30px ; border: 1px solid rgb(220,220,220); font-size: 18px; } .sign{ text-align: center; color: rgb(204,0,0); font-size: 16px; } .Question{ border: 1px solid rgb(229,229,229); } .Question>a:last-child{ border-bottom: none; } .quesPart{ border-bottom: 1px solid rgb(229,229,229); display: inline-block; width: 100%; } .quesFlex{ display: flex; align-items: center; justify-content: space-between; padding: 25px; width: 100%; } .quesPart.bg_grey .quesFlex img{ transform: rotate(180deg);} .quWord{ width: 80%; font-size: 22px; color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; } .quIcon{ display: inline-block; width: 24px; height: 13px; background: url(../images/down.png); background-repeat: no-repeat; background-size: cover; } .quesMore{ padding: 0 25px 25px 25px; font-size: 18px; color: #666666; line-height: 32px; } .quesMore span{ color: rgb(204,0,0); } .quesMore{ display: none; } .Question{ margin-bottom: 70px; } .quesFlex { cursor: pointer; } .bg_grey{ background: rgb(245,245,245); } .Question>div:last-child{ border-bottom: none; } .Download{ display: flex; flex-wrap: wrap; margin-top: 50px; margin-bottom: 30px; } .downLoad{ transition:all .36s ; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; } .downLoad:hover{ transform: translateY(-15px); -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); } .Download>a:nth-child(3n){ margin-right: 0; } .Download>a{ margin-right: 3%; width: 31.3%; box-shadow: 1px 1px 10px 1px rgb(235,235,235); padding: 20px 20px 25px 20px; margin-bottom: 3%; } .downPic{ overflow: hidden; } .downPic img{ float: left; width: 100%; } .downFlex{ display: flex; margin-top: 25px; align-items: center; justify-content: space-between; } .do1{ width: 70%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 20px; color: #333333; } .do2{ display: flex; width: 85px; height: 33px; display: flex; align-items: center; justify-content: center; border-radius: 25px; border: 1px solid rgb(204,0,0); color: rgb(204,0,0) ; } .do3{ margin-right: 7px; background: url(../images/d1.png); width: 16px ; height: 16px; } .do3{ position: relative; z-index: 99; } .Basic{ background: url(../images/sky.jpg); background-repeat: no-repeat; background-size: cover; } .basicFlex{ display: flex; align-items: center; } .basicDesc{ width: 50%; padding: 70px 0 100px 0; } .baTit{ font-weight: 600; color: rgb(204,0,0); font-size: 40px; margin-top: -45px; } .baWord p{ font-size: 16px; color: #666; line-height: 34px; margin-top: 35px; } .basicPic{ width:50%; padding-left: 8%; overflow: hidden; } .basicPic img{ float: left; width: 100%; } .Culture{ background: url(../images/cul.jpg); padding: 220px 0 95px 0; } .culWord{ padding-left: 50px; } .culWord>img:nth-child(1){ margin-bottom: 35px; } .culWord>p:nth-child(2){ color: #fff; font-size: 40px; margin-bottom: 30px; font-weight: 600; } .culWord>p:nth-child(3){ color: #fff; font-size: 16px; line-height: 38px; width: 40%; } .teamBox{ background: url(../images/team.jpg); background-repeat: no-repeat; background-size: cover; padding-top: 65px; } .Team{ display: flex; /* align-items: flex-start; */ } .teamPic{ width: 50%; padding-right: 3%; } .teamPic img{ width: 100%; height: 100%; float: left; } .teamDesc{ width: 50%; padding-bottom: 40px; } .teamDesc{ padding-top: 20px; } .teamTit1{ font-family: CIN; font-size: 55px; color: rgb(220,220,220); margin-bottom: 5px; } .teamTit2{ font-weight: bold; font-size: 40px; color: #000; letter-spacing: 1px; } .teamDesc{ padding-right: 10vw; } .teamWord{ margin-top: 40px; } .teamWord p{ font-size: 16px; color: #333; line-height: 36px; margin-bottom: 30px; } .teamLink{ display: flex; align-items: center; transition: all .36s; } .tl1{ display: inline-flex; width: 160px; height: 50px; text-align: center; line-height: 50px; text-align: center; background: rgb(204,0,0); color: #fff; font-weight: 16px; margin-right: 30px; transition: all .36s; } .tl2{ font-size: 16px;transition: all .36s; text-decoration: underline!important; color: #333; } .teamLink .tl1:hover{ box-shadow: 0 0 10px rgba(204,0,0,0.5); color: #cc0000;} .teamLink .tl1 span{ position: relative; z-index: 10;} .teamLink .tl1::after{ width: 0; height: 100%; position: absolute; background-color: #fff; display: block; content: ''; transition: all .36s;} .teamLink .tl1:hover::after{ width: 100%;} .honorFlex{ display: flex; align-items: center; justify-content: space-between; padding: 70px 0; } .honorTit{ width: 50%; } .honorTit>p:nth-child(1){ color: rgb(238,238,238); font-size: 60px; font-family: CIN; margin-bottom: 5px; } .honorTit>p:nth-child(2){ font-size: 40px; color: #000; font-weight: 600; } .honorWord{ width: 50%; font-size: 16px; color: #666666; line-height: 35px; } /* 荣誉资质 */ .Honor { background: rgb(246, 248, 250); position: relative; cursor: pointer; } .Honor .swiper-container { padding-bottom: 120px; } .Honor .swiper-slide { background: #fff; border: 1px solid rgb(235, 235, 235); cursor: pointer; transition: all 0.5s; } .hoBg{ transition: all 0.5s; position: relative; } .hoBg::after{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 0; width: 100%; transition: all 0.5s; background: rgb(204,0,0); } .Honor .swiper-slide:hover .hoBg::after{ height: 100%; } .Honor .swiper-slide:hover .ho2{ color: #fff; } .Honor .swiper-wrapper { display: flex; align-items: center; } .hoDesc { background: #fff; height: 100%; } .ho1 { overflow: hidden; height: 300px; display: flex; align-items: center; justify-content: center; padding: 30px 30px 0 30px; } .hoIcon img { transition: all 0.3s; } .Honor .swiper-slide:hover .hoIcon img { transform: rotate(360deg); } .Honor .swiper-slide:hover { box-shadow: -1px 4px 10px 1px rgb(230 230 230); } .ho2 { font-size: 18px; text-align: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; font-size: 20px; color: #666666; padding: 22px; border-top: 1px solid rgb(235, 235, 235); margin-top: 10px; position: relative; z-index: 99; transition: all 0.5s; } .hoFlex { margin-top: 10px; } .Honor { position: relative; } .Honor .swiper-button-next { width: 50px; height: 50px; border: 1px solid rgb(190, 190, 190); border-radius: 50%; display: flex; align-items: center; justify-content: center; top: 92%; right: 45%; transition: all 0.4s; } .Honor .swiper-button-prev { width: 50px; height: 50px; border: 1px solid rgb(190, 190, 190); border-radius: 50%; display: flex; align-items: center; justify-content: center; top: 92%; left: 45%; transition: all 0.4s; } .Honor .swiper-button-next::after { color: rgb(190, 190, 190); font-size: 18px; transition: all 0.4s; } .Honor .swiper-button-prev::after { color: rgb(190, 190, 190); font-size: 18px; transition: all 0.4s; } .Honor .swiper-button-next:hover { background: rgb(204,0,0); } .Honor .swiper-button-next:hover::after { color: #fff; } .Honor .swiper-button-prev:hover { background: rgb(204,0,0); } .Honor .swiper-button-prev:hover::after { color: #fff; } .Honor { background: rgb(246, 248, 250); position: relative; cursor: pointer; } .Honor .swiper-container { padding-bottom: 120px; } .Honor .swiper-slide { background: #fff; border: 1px solid rgb(235, 235, 235); cursor: pointer; transition: all 0.5s; } .hoBg{ transition: all 0.5s; position: relative; } .hoBg::after{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 0; width: 100%; transition: all 0.5s; background: rgb(204,0,0); } .Honor .swiper-slide:hover .hoBg::after{ height: 100%; } .Honor .swiper-slide:hover .ho2{ color: #fff; } .Honor .swiper-wrapper { display: flex; align-items: center; } .hoDesc { background: #fff; height: 100%; } .hoIcon img { transition: all 0.3s; } .Honor .swiper-slide:hover .hoIcon img { transform: rotate(360deg); } .Honor .swiper-slide:hover { box-shadow: -1px 4px 10px 1px rgb(230 230 230); } .hoFlex { margin-top: 10px; } .Honor { position: relative; } .Honor .swiper-button-next { width: 50px; height: 50px; border: 1px solid rgb(190, 190, 190); border-radius: 50%; display: flex; align-items: center; justify-content: center; top: 92%; right: 45%; transition: all 0.4s; } .Honor .swiper-button-prev { width: 50px; height: 50px; border: 1px solid rgb(190, 190, 190); border-radius: 50%; display: flex; align-items: center; justify-content: center; top: 92%; left: 45%; transition: all 0.4s; } .Honor .swiper-button-next::after { color: rgb(190, 190, 190); font-size: 18px; transition: all 0.4s; } .Honor .swiper-button-prev::after { color: rgb(190, 190, 190); font-size: 18px; transition: all 0.4s; } .Honor .swiper-button-next:hover { background: rgb(204,0,0); } .Honor .swiper-button-next:hover::after { color: #fff; } .Honor .swiper-button-prev:hover { background: rgb(204,0,0); } .Honor .swiper-button-prev:hover::after { color: #fff; } .hoTit { font-size: 40px; color: #333; text-align: center; padding: 55px 0 45px 0; } .hoIcon { text-align: right; padding-right: 30px; } .Honor .swiper-button-prev:hover::after { color: #fff; } .hoTit { font-size: 40px; color: #333; text-align: center; padding: 55px 0 45px 0; } .hoIcon { text-align: right; padding-right: 30px; } .welTit{ text-align: center; padding: 50px 0; font-size: 40px; color: #333; } .Welfare{ display: flex; } .Welfare>div:nth-child(6){ margin-right: 0; } .wetPart{ background: url(../images/line.jpg); background-repeat: no-repeat; background-size: 100% 100%; margin-right: 2%; width: 16.2%; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 340px; } .wel1{ margin-bottom: 45px; } .wel2{ text-align: center; font-size: 22px; color: #888888; line-height: 38px; } .wel3{ width: 50px; height: 2px; background: rgb(0,77,160); margin-top: 30px; transition: all .36s; } @keyframes jello { from, 11.1%, to { -webkit-transform: none; -moz-transform: none; transform: none } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); -moz-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); -moz-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); -moz-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); -moz-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) } 66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); -moz-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); -moz-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) } 88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); -moz-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) } } .wetPart:hover .wel2{ color: #004da0;} .wetPart:hover .wel1 img{animation: jello 1.2s} .wetPart:hover .wel3{ width: 30px;} .mask-white { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,.2); content:''; -webkit-transition:-webkit-transform .6s; transition:transform .6s; -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0) } .workList { position: relative; z-index: 99; padding: 50px 0; } .workList li{ width: 49%; margin-right: 2%; border: 1px solid #e5e5e5; padding: 30px;} .workList li:nth-child(2n){ margin-right: 0;} .workList li .tilte{ width: 100%;} .workList li .tilte .con1{ font-size: 26px;} .workList li .tilte span:last-child{ background-color: #f5f5f5; padding: 8px 15px;} .workList li .con4{ margin: 35px 0 45px;} .workList .color-666 { font-size: 16px; line-height: 26px; } .workList li .more{ border: 1px solid #e5e5e5; width: 50%; height: 50px; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; transition: all .25s;} .workList li:hover{ box-shadow: 0 0 10px rgba(204,0,0,0.2);} .workList li:hover .more{ color: #fff; background-color: #cc0000; border-radius: 0;} .joboclass a{ width: 20%; height: 64px; margin: 20px 1%; background-color: #f5f5f5; font-size: 20px; border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; } .joboclass a.on{ background-color: #fff; color: #cc0000; box-shadow: 0 0 10px rgba(204,0,0,0.5);} /*弹窗*/ /*弹窗*/ .g5liebiao{ width:100%; margin:0 -8px; margin-top:50px; } .g5abt h2{ display:inline-block; color:#555555; font-size:22px; width: 265px; overflow: hidden; } .g5listita a{ width:170px; height:45px; line-height: 45px; display:block; background:#fff; margin-top:20px; position:absolute; bottom:10px; left:15px; } .g5listita a p{ color:#3c276e; padding-left: 35px; line-height: 45px; } .g5listita a p::after{ position:absolute; content:""; width:7px; height:13px; background:url(../images/sanjiaoa.png) no-repeat center; right: 56px; top:50%; transform: translateY(-50%); background-size: cover; color:#3c276e; } .g5tan{ width:100%; height:100%; background:rgba(0,0,0,0.5); position:fixed; top:0; left:0; z-index: 9999; display:none; } .tancoiii{margin-top: 0;padding: 0 0 15px; border-bottom: 1px solid #eeeeee;} .tancoiii h4{ font-weight: bold; font-size: 18px;} .tancoiii p{ color:#666666; font-size:14px; line-height: 2; } .tancon{ max-width:1200px; width: 65%; position:absolute; padding:0 73px 0; background:#fff; top:50%; left:50%; transform: translate(-50%,-50%); box-sizing: border-box; } .g5lianjie{ width:100%; height:52px; margin-top:20px; margin-bottom: 20px; } .g5lianjie p{ display:block; width:100%; height:100%; color:#274fa1; font-family: "微软雅黑"; font-weight: bold; font-size:16px; } .tanright{ width:58px; height:58px; position:absolute; top: 10px; right: 10px; cursor: pointer; } .tanright img{ width:100%; } .tancoiiiab{ color:#333333; font-size:30px; font-weight: bold; } .tancoiii2{ color:#666666; font-size:14px; line-height: 35px; } .tancoiiiab .t1{display: inline-block; width: 24%; color: #666666; font-size: 14px;} .tancoiiiab .t1 b{display: block; color: #333333; font-size: 18px; margin-top: 10px;} .rc-popscroll{ max-height: 450px; overflow-y: scroll; padding-right: 60px;margin-top: 20px;} .rc-popscroll::-webkit-scrollbar {/*滚动条整体样式*/ /*高宽分别对应横竖滚动条的尺寸*/ width: 5px;} .rc-popscroll::-webkit-scrollbar-thumb {/*滚动条里面小方块*/ background: #0469b3; width: 5px; } .rc-popscroll::-webkit-scrollbar-track {/*滚动条里面轨道*/ background: #f2f5f9; width: 5px; } .line-height2-4{ line-height: 2.4;} .job-description .swiper-container { width: 100%; height: 300PX;} .job-description .swiper-container .swiper-slide { height: auto; -webkit-box-sizing: border-box; box-sizing: border-box;} .g5lianjie {} .g5lianjie ul{ font-size: 16px; color: #000; } .g5lianjie ul li{ white-space: nowrap; width:33.3%; line-height: 30px;} .g5lianjie ul li:last-child{ width:100%; } .Sun{ display: flex; margin-top: 60px; align-items: center; } .sunDesc{ width: 50%; padding-right: 6%; } .sunTit{ position: relative; } .sunTit img{ position: absolute; left: 0; top: -40px; } .sunTit p{ font-size: 40px; color: #333; padding-left: 40px; } .sunWord{ margin-top: 30px; font-size:18px; color: #666; line-height: 40px; } .sunPic{ width: 50%; overflow: hidden; } .sunPic img{ float: left; width: 100%; } .staTit{ font-size: 40px; color: #000; padding:50px 0 45px 0; font-weight: 600; } .Staff{ padding: 0 3vw; display: flex; flex-wrap: wrap; padding-bottom: 50px; } .Staff>a:nth-child(3n){ margin-right: 0; } .staPart{ width:32%; margin-right: 2%; } .staPart::after { content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); opacity: 0; transition: all 0.5s; } .staPic { overflow: hidden; } .staPic img { transition: all 0.8s; float: left; width: 100%; } .staPart { position: relative; margin-bottom: 2%; } .line { position: absolute; z-index: 990; background: #FFF; opacity: 0.9; transition: all 500ms; } .line1 { left: 30px; bottom: 30px; width: 1px; height: 0; } .line2 { left: 30px; top: 30px; width: 0; height: 1px; } .line3 { right: 30px; top: 30px; width: 1px; height: 0; } .line4 { right: 30px; bottom: 30px; width: 0; height: 1px; } .staPart:hover::after { opacity: 1; } .staPart:hover .recoHide { opacity: 1; } .recoHide img{ transition: all 0.7s; } .staPart:hover .staPic img { transform: scale(1.1) ; } .staPart:hover .recoHide img { transform:translateY(50px); } .staPart:hover .line1 { height: calc(100% - 60px); } .staPart:hover .line2 { width: calc(100% - 60px); } .staPart:hover .line3 { height: calc(100% - 60px); } .staPart:hover .line4 { width: calc(100% - 60px); } .recoHide { position: absolute; top: 0; left: 0; right: 0; text-align: center; font-size: 22px; color: #fff; letter-spacing: 1px; z-index: 999; opacity: 0; transition: all 0.5s; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; } .staHide{ position: absolute; left: 0; right: 0; top: 50%; text-align: center; height:76px; line-height:76px; margin-top: -23px; font-size: 22px; color: #fff; background: rgba(0,0,0,0.5); transition: all 0.5s; z-index: 999; } .staPart:hover .staHide{ background: none; transform: translateY(-80%); font-size: 36px; } .artTit { border-bottom: 1px solid rgb(229, 229, 229); } .Article { display: flex; margin-top: 50px; } .artTit>p:nth-child(1) { font-size: 30px; color: #333333; } .artTit>p:nth-child(2) { display: flex; align-items: center; padding: 20px 0 35px 0; } .artTit>p:nth-child(2) span { font-size: 14px; color: #666666; margin-right: 30px; font-family: arial; } .artBox{ padding-top: 40px; } .artBox p { overflow: hidden; font-size: 15px; color: #555555; line-height: 36px; } .artLink { margin-top: 80px; padding: 28px 0; display: flex; align-items: center; justify-content: space-between; font-size: 16px; color: #666666; border-top: 1px solid rgb(229, 229, 229); border-bottom: 1px solid rgb(229, 229, 229); margin-bottom: 60px; } .artLink a { font-size: 15px; color: #333; width: 50%; text-align: center; display: flex; align-items: center; justify-content: center; transition: all 0.2s; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; display: inline-block; } .artLink a:first-child{ width: 48%; margin-right: 4%; text-align: left; } .artLink a:last-child{ width: 48%; margin-right: 0%; text-align: right; } .artLink a:hover { color:rgb(204,0,0); } .link1 span { display: inline-block; width: 8px; height: 14px; margin-right: 10px; background: url(../images/left11.png); background-repeat: no-repeat; background-size: cover; } .artLeft { width: 72%; padding-right: 7%; } .artRight { width: 28%; padding-left: 0; } .recoTit { display: flex; align-items: center; font-size: 18px; /* color: #888888; */ margin-bottom: 30px; } .re1{ font-size: 26px; color: #000; } .recoTit .re2{ } .recoImg { overflow: hidden; width: 100%; } .recoDesc { width:100%; } .recoImg img { float: left; width: 100%; transition: all 0.45s; } .recoPart { } .ro1 { transition: all 0.4s; } .recoPart:hover .ro1 { color:rgb(204,0,0); } .recoPart:hover img { transform: scale(1.1); border-radius: 30px; } .ro1 { font-family: BIN; font-size: 18px; color: #888; margin-bottom: 12px; transition: all 0.4s; margin-top: 25px; } .recoPart:hover .ro2 { color: rgb(204,0,0); } .ro2 { transition: all 0.4s; font-size: 18px; color: #000; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; margin-bottom: 30px; } .Indust{ display: flex; } .dustPic{ overflow: hidden; width: 50%; position: relative; } .dustPic img{ float: left; width: 100%; min-height: 350px; } .dustDesc{ width:50%; border-top: 1px solid rgb(229,229,229); border-bottom: 1px solid rgb(229,229,229); padding: 0 40px; } .du1{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; font-size: 24px; color: #333; margin-bottom: 20px; } .du2{ font-family: BIN; font-size: 16px; color: #aaaaaa; margin-bottom: 30px; } .du3{ font-size: 16px; color: #666666; line-height: 32px; } .Industry{ margin-top: 60px; } .du1{ font-size: 24px; color: #333333; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; margin-top: 50px; margin-bottom: 20px; } .du2{ font-size: 16px; color: #aaa; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all; margin-bottom: 30px; } .du3{ font-size: 16px; color: #666; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; line-height: 32px; margin-bottom: 30px; } .du4{ display: flex; width: 100%; align-items: center; color: rgb(204,0,0); font-size: 16px; padding-top: 40px; border-top: 1px solid rgb(229,229,229); } .du4 img{ margin-left: 15px; } .Show{ display: flex; flex-wrap: wrap; margin-top: 60px; } .showPart{ width: 50%; border: 1px solid rgb(229,229,229); padding: 35px; display: flex; margin-bottom: 40px; } .showPart:hover{ box-shadow: 0 0 10px rgba(204,0,0,0.15);} .showPic{ position: relative;} .Indust:hover .dustPic img{ transform: scale(1.1);} .Indust:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)} .Show>a:nth-child(2n){ border-left: none; } .showPic{ width: 45%; overflow: hidden; } .showPic img{ float: left; width: 100%; } .showPart:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)} .showPart:hover .showPic img{ transform: scale(1.1);} .showPart:hover .sh1{ color: #cc0000;} .showDesc{ width: 55%; padding: 5px 0; display: flex; flex-direction: column; justify-content: space-between; padding-left: 5%; } .sh1{ text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; font-size: 18px; color: #333; line-height: 28px; } .sh2{ font-size: 16px; color: #aaa; } .Show{ margin-bottom: 20px; } .Industry .swiper-container-horizontal>.swiper-pagination-bullets{ justify-content: flex-end; left: auto; bottom: 42px; display: flex; right: 30px; } .Industry .swiper-pagination-bullet{ border-radius: 50%; } .Indust:hover .du1{ color: #cc0000;} .ptb60 { padding: 43px 0 0 0; } .serachTop .input { width: 85%; height: 76px; /* border-radius: 35px; */ padding-left: 70px; background: url(../images/searchbg.png) no-repeat left 20px center #f7f8f9; /* -webkit-border-radius: 35px; */ -moz-border-radius: 35px; -ms-border-radius: 35px; -o-border-radius: 35px; } .serachTop .submit { width: 15.6%; height: 76px; /* border-radius: 35px; */ background-color: rgb(204,0,0); color: #fff; } .serachTop { border-bottom: 1px solid #e5e5e5; padding-bottom: 40px; } .color-orange { color: rgb(204,0,0); } .searchFlex { display: flex; align-items: center; justify-content: space-between; } .seaDate { font-size: 18px; color: #aaaaaa; font-family: BIN; } .searchList li { border-bottom: 1px solid #e5e5e5; } .searchList { padding-bottom: 80px; } .searchList .pt-50 { position: relative; transition: all 0.5s; } .searchList li { border-bottom: 1px solid #e5e5e5; } .pb-50 { padding-bottom: 40px; } .pt-50 { padding-top: 50px; } .art1, .searchFlex { transition: all 0.5s; } .searchFlex { display: flex; align-items: center; justify-content: space-between; } .searchList .f22, .seaDate { transition: all 0.5s; } .searchList .pt-50::after { position: absolute; content: ''; left: 0; right: 0; bottom: 0; height: 1px; background: rgb(204,0,0); transition: all 0.5s; width: 0; } .f22 { font-size: 22px; } .seaDate { font-size: 18px; color: #aaaaaa; font-family: BIN; } .searchList .line-clamp2 { transition: all 0.5s; } .searchFlex{ transition: all 0.5s; } .searchList .pt-50:hover::after{ width: 100%; } .searchList .pt-50:hover .f22{ color: rgb(204,0,0); } .searchList .pt-50:hover .seaDate{ color: rgb(204,0,0); } .searchList .pt-50:hover .line-clamp2{ color: rgb(204,0,0); } .searchList .pt-50:hover{ transform: translate(10px); } .Contact{ display: flex; } .tactLeft{ width: 50%; } .tactLeft{ padding-left: 10vw; width: 50%; } .tactTit{ font-size: 38px; color: #333333; margin-top: 60px; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid rgb(229,229,229); } .Contact{ display: flex; } .tactBox p{ font-size: 20px; color: #666; margin-bottom: 20px; } .tactFlex{ display: flex; align-items: center; margin-top: 30px; } .tactFlex>div:nth-child(1){ margin-right: 20px; } .ta1{ padding: 1px; border:1px solid rgb(240,240,240); } .tactEwm img{ width: 130px; } .ta2{ text-align: center; margin-top: 18px; font-size: 16px; color: #333; } .hidePro { padding: 10px 0; } .hidePro a{ display: block; padding: 5px 10px; } .Special{ display: flex; margin-bottom: 40px; flex-direction: column; } .speLeft{ width:100%; } .speRight{ width:100%; } .speTit{ display: flex; align-items: center; font-size: 40px; color: #333; margin-top: 60px; padding-bottom: 30px; border-bottom: 1px solid rgb(229,229,229); } .speTit span{ display: inline-block; width: 4px; height: 35px; background: rgb(204,0,0); margin-right:25px; } .speBox{ display: grid; grid-gap: 30px; grid-template-columns: repeat(3,1fr);} .autoChoose{ display: flex; flex-wrap: wrap; margin-top: 35px; } .autoChoose>a:nth-child(4n){ margin-right: 0; } .autoPart{ width: 23%; margin-right: 2.6%; padding: 40px 25px; border: 1px solid rgb(229,229,229); margin-bottom: 3%; } .au1{ color: rgb(204,0,0); font-size: 24px; font-family: BIN; margin-bottom: 20px; } .au2{ background: rgb(204,0,0); width: 25px; height: 2px; margin-bottom: 30px; transition: all .36s; } .au3{ font-size: 20px; color: #666; } .autoPart:hover{ box-shadow: 0 0 10px rgba(204,0,0,0.2);} .autoPart:hover .au2{ width: 50%;} .speMore{ display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; } .speRight{ margin-top: 60px; } .spm1{ font-size: 26px; color: #333; } .spm2{ font-size: 18px; color: #333; display: flex; align-items: center; } .spe1{ overflow: hidden; } .spe1 img{ float: left; width: 100%; } .spe2{ font-size: 18px; color: #000; margin-top: 20px; margin-bottom: 15px; } .spe3{ font-size: 14px; color: #888888; margin-bottom: 20px; } .Person{ margin-top: 30px; /* display: flex; */ box-shadow: 1px 1px 10px 1px rgb(230,230,230); border-radius: 10px; } .perLeft{ width: 50%; padding: 30px; display: flex; flex-direction: column; justify-content: center; align-items: center; } .perTit{ font-size: 20px; color: #333333; line-height: 28px; margin-bottom: 20px; } .perPut{ display: flex; align-items: center; padding: 12px 20px; background: rgb(246,246,246); border-radius: 25px; margin-bottom: 18px; } .perPut img{ margin-right: 15px; } .perPut input{ font-size: 16px; color: #666; } .perForm textarea{ font-size: 16px; color: #666; padding: 20px; background: rgb(246,246,246); border-radius: 25px; padding-bottom: 50px; display: inline-block; width: 100%; } .perButton{ display: inline-block; border: 1px solid rgb(204,0,0); font-size: 18px; color: rgb(204,0,0); text-align: center; height: 50px; line-height: 50px; margin-top: 25px; border-radius: 35px; width: 60%; margin-left: 20%; transition: all .36s; } .perButton:hover{ box-shadow: 0 0 10px rgba(204,0,0,0.25);} .perWord{ margin: auto; text-align: center; width: 90%; line-height: 20px; font-size: 14px; color: #666666; margin-top: 20px; } .perRight{ width:50%; overflow: hidden; border-radius: 0 10px 10px 0; } .perRight img{ float: left; width: 100%; min-height: 535px; max-height: 620px; border-radius: 0 10px 10px 0; } .Online .devideApply{ background: rgb(245,245,245); } .Online .hidePro{ top: 50px; bottom: auto; z-index: 9999999; } div.video-play{position:fixed;top:0;bottom:0;right:0;left:0;width:100vw;height:100vh;z-index:10001;display:none} div.video-bg{position:absolute;top:0;bottom:0;width:100%;z-index:1001;background:#0b0b0b;opacity:.8} div.video-wrap{z-index:1002;position:fixed;top:52%;left:50%;-webkit-transform:translate3d(-50%, -52%, 0);transform:translate3d(-50%, -52%, 0);width:1000px;height:570px; } div.video-wrap video{width:100%;height:auto} div.close-btn{cursor: pointer; transition: all .36s; text-align: center; line-height: 40px; z-index: 9999; position: absolute; background: #000; border: 2px solid #fff; width: 50px; height: 50px; border-radius: 50%; opacity: 0.5; right: -20px; top: -25px;} div.close-btn:hover{ transform: rotate(180deg); opacity: 1;} .newslist{ padding-top: 50px; padding-bottom: 50px;} .newslist li:first-child{ border-top: 1px solid #e5e5e5;} .newslist li{ border-bottom: 1px solid #e5e5e5; } .newslist li .newsDate{ width: 20%; border-right: 1px solid #e5e5e5; padding: 50px 20px; background: url(../images/arg.png) no-repeat center right 20px; position: relative; overflow: hidden;} .newslist li .newsDate p{ position: relative; z-index: 10;} .newslist li .newsDate::before{ width: 0; height: 100%; display: block; content: ''; background-color: #cc0000; transition: all .36s; position: absolute; top: 0; left: 0;} .newslist li .txt{ width: 80%; padding-left: 20px; display: flex; justify-content: center;} .newslist li:hover .newsDate::before{ width: 100%;} .newslist li:hover .newsDate p{ color: #fff;} .artBox img+img{ margin-top: 15px !important;} .cacas table{ line-height: 3; margin-bottom: 15px;} .cacas table tr:first-child{ background-color: #cc0000; color: #fff;} @media screen and (max-width:1440px) {.tactBox p{ font-size: 18px;}} @media screen and (max-width:750px) {.g5lianjie { display:none; }} .banner,.sideTop,.Contact,.localFlex{ margin-top: 85px; } .Product{ padding-top: 85px; }