@charset "utf-8"; /* CSS Document */ /*@font-face{ font-family: "Microsoft YaHei"; src: url( "../fonts/SourceHanSansCN-Light.otf");}*/ @font-face{ font-family: "SourceHanSansCN-Light"; src: url( "../fonts/SourceHanSansCN-Light.otf");} @font-face{ font-family:"Barlow Condensed"; src: url( "../fonts/BarlowCondensed-Medium.ttf");} body{ font-size:100%;line-height:1.1; width:100%; position:relative; background:none; font-family: "Microsoft YaHei"; overflow-x:hidden;} *{ padding:0; margin:0;} img{ max-width:100%;} #bdshare_weixin_qrcode_dialog *,#bdshare_weixin_qrcode_dialog{ box-sizing:content-box; } .j_tab{ display:table; width:100%; height:100%;} .j_tab_cel{ display:table-cell; vertical-align:middle; width:100%; height:100%;} *{ margin:0; padding:0; outline:none; } a{ color:inherit;} a:focus{ outline: none !important;} h4, .h4, h5, .h5, h6, .h6,h1, .h1, h2, .h2, h3, .h3,p{ margin:0;} h5{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} h5 a{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} img{ max-width:100%; max-height:100%;} .img img{ width:100%; height:100%;} svg{ max-width:100%; max-height:100%;} table{table-layout: fixed;} .wait_bg{max-width: 1440px;margin: auto;} .wait_bg img{display: block;width: 800px;margin: auto;} .m1100{ width:1100px; margin:0 auto; display: block; position:relative;} .m{ max-width: 1700px; height:100%;margin: 0 auto; padding:0 100px; display: block; position:relative;} .m1280{max-width: 1280px; width:100%; height:100%; margin: 0 auto; padding:0 40px; display: block; position:relative;} .m1360{max-width: 1360px; width:100%; height:100%; margin: 0 auto; display: block; position:relative;} .m1400{max-width: 1540px; width:100%; height:100%; margin: 0 auto; padding:0 70px; display: block; position:relative;} .m1600{max-width: 1600px; width:100%; height:100%; margin: 0 auto; display: block; position:relative;} .m1689{max-width: 1689px; width:100%; height:100%; margin: 0 auto; display: block; position:relative;} .m1900{max-width: 1900px; width:100%; height:100%; margin: 0 auto; display: block; position:relative;} .pad_top{ padding-top:3.5rem;} .pad_bot{ padding-bottom:5rem;} .pad_aside{ padding-left:45px; padding-right:45px;} .draw_h{ width: 67px !important; height: 67px !important; line-height: 65px !important; display:block; border-radius: 50%; text-align: center; position:relative;} .draw_h:before{ content:""; display:block; width:100%; height:100%; position:absolute; left:0; top:0; border: 2px solid rgba(100%,100%,100%,.5); border-radius: 50%;} svg.drawcircle{position:absolute;top:0;left:0;overflow: inherit;display: block;pointer-events: none;} svg.drawcircle circle { fill: none; box-sizing:border-box; stroke-width: 2; stroke: none; stroke-dasharray: 0 , 188.49; stroke-dashoffset:188.49; transition: all .3s linear 0s; } .draw_h:hover svg.drawcircle circle { stroke:#fff; stroke-dasharray:188.49 , 0; stroke-dashoffset:188.49; -webkit-transition: all .7s cubic-bezier(0.11, 0.57, 0.58, 1); transition: all .7s cubic-bezier(0.11, 0.57, 0.58, 1); } .draw_h .icon { fill: #626262; vertical-align: middle; transition:.3s; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .draw_h:hover .icon{ fill:#0081cc;} /*===========================header=============================*/ #header{ height:5.9375rem; z-index:999; width:100%; position:fixed; top:0; transition:.5s;} #header .container{ height:100%;} #logo{ float:left; height:100%;} #logo .img02{ display: none;} .top_tel{float:left; font-size:1.125rem;color:#fff;line-height:5.625rem;padding-left:2rem; background: url(../images/tel_w.png) left center no-repeat; transition:.5s; position: relative;} .top_tel:before{ content: ""; display: block; width: 1px; height: 15px; background: #fff; opacity: .5; position: absolute; left: -2rem; top: 50%; margin-top: -7.5px;} #nav{ float:left; margin-right:3.25rem;} #nav ul{} #nav ul li{ float:left; position:relative; z-index:0;} #nav ul li a{ display:block; padding:0 1.2rem; text-transform:uppercase;} #nav ul li h3{ font-size:.9375rem; color:#fff; line-height:5.9375rem; transition:.5s; overflow:hidden; position:relative;} #nav ul li.on h3,#nav ul li:hover h3{ color:#fff; font-weight: bold;} #nav ul li h3:after{ content:""; display:block; width:0; height:2px; background:#b91b22; position:absolute; left:50%; bottom:1rem; transition:.5s; z-index:-1; } #nav ul li:hover h3:after,#nav ul li.on h3:after{ width:100%; left:0;} #nav ul li .sub{ position:absolute; top:100%; background:rgba(50,50,50,.9); border-radius: 2px; left:50%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); z-index: 10000; visibility:hidden; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0; transition:.5s; } #nav ul li .sub .box{ padding:1.5rem 2rem; text-align: center; display: flex; } #nav ul li .sub a{ padding:0; line-height:2; transition:.3s; font-size:.875rem; color:#fff; padding: 0 1.5rem; visibility:hidden; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0; transform: translateY(-20px); transition:.5s;} #nav ul li .sub a font { display: block; margin: 0 auto; width: 60px; height: 60px; line-height: 58px; position: relative; z-index: 1; border-radius: 50%; margin-bottom: .5rem; } #nav ul li .sub a font:before{ content:""; width: 100%; height: 100%; border-radius: 50%; border:1px solid #606064; display: block; position: absolute; z-index:-1; left: 0px; top: 0px; transition: all 0.5s ease 0s; -webkit-transform: all 0.5s ease 0s;} #nav ul li .sub a font:after{ content:""; width: 100%; height: 100%; border-radius: 50%; display: block; background: #b91b22; position: absolute; z-index:-1; left: 0px; top: 0px; transform: scale(0.6); -webkit-transform: scale(0.6); opacity: 0; -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1); transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); visibility: hidden;} #nav ul li .sub a:hover font:before{ opacity: 0; transform: scale(1.3); -webkit-transform: scale(1.3); } #nav ul li .sub a:hover font:after{ transform: scale(1); -webkit-transform: scale(1); opacity: 1; visibility: visible;} #nav ul li .sub a span{ white-space: nowrap;} #nav ul li .sub a:hover{ color:#fff;} #nav ul li:hover .sub{ filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; visibility:visible; } #header.xg{ background:#fff; height: 5rem; box-shadow: 0 1px 2px rgba(0,0,0,.2);} #header.xg #nav ul li h3{line-height:5rem; color: #333;} #header.xg .top_tel{line-height:5rem; background: url(../images/tel_j.png) left center no-repeat; color: #222;} #header.xg #nav ul li.on h3, #header.xg #nav ul li:hover h3{ color: #b91b22;} #header.xg #logo .img02{ display: inline-block;} #header.xg #logo .img01{ display: none;} #header.xg .top_tel:before{ background: #999;} #header.xg #nav ul li h3:after{ bottom:0;} #nav ul li:hover .sub a:nth-child(1){ transition: .5s .1s;} #nav ul li:hover .sub a:nth-child(2){ transition: .5s .2s;} #nav ul li:hover .sub a:nth-child(3){ transition: .5s .3s;} #nav ul li:hover .sub a:nth-child(4){ transition: .5s .4s;} #nav ul li:hover .sub a:nth-child(5){ transition: .5s .5s;} #nav ul li:hover .sub a:nth-child(6){ transition: .5s .6s;} #nav ul li:hover .sub a:nth-child(7){ transition: .5s .7s;} #nav ul li:hover .sub a:nth-child(8){ transition: .5s .8s;} #nav ul li:hover .sub a:nth-child(9){ transition: .5s .9s;} #nav ul li:hover .sub a{filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; visibility:visible; transform: translateY(0px);} /***********************/ /*手机导航开始*/ #m_header{ display:none; height:4.5rem; position:fixed; top:0; width:100%; z-index:999; } #m_header.xg{ background: #bf1a1a; } #m_header .m{ position:relative; height:100%;} #m_logo{ transition:0s 1.5s; height:100%; visibility:visible; float: left;} #m_logo img{ display:block; max-height: 60%;} #m_header .fr{ height:100%;} #m_header #searchBtn{float:left; height:100%; transition:0s 1.7s; visibility:visible; } #m_header #searchBtn a{font-size:16px;color:#3c3c3c;text-transform:uppercase;display: block;width: 100%;height: 40px;line-height: 38px; width:40px; } #m_header.act{ background:rgba(255,255,255,0); transition:0s; } #m_header.act #logo{ opacity:0; visibility:hidden; transition:0s;} #m_header.act #searchBtn{ opacity:0; visibility:hidden; transition:0s;} #nav_btn{ float:left; height:4.5rem; width:40px; padding-left:20px; z-index:1001; } svg, svg * { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } #ac-menu-opener { box-sizing:border-box; position: relative; display:block; height: 20px; width: 20px; cursor: pointer; z-index: 3000; } #ac-menu-opener .ac-menu-hamburger .st0 { fill: none; stroke: #fff; stroke-width: 5.2094; stroke-miterlimit: 10; stroke-dasharray: 68; } #ac-menu-opener svg{ width:20px; height:20px; position:absolute; top:0; left:0;} #ac-menu-opener .ac-menu-hamburger .st0:nth-child(1) { -webkit-transition: .4s .95s; transition: .4s .95s; } #ac-menu-opener .ac-menu-hamburger .st0:nth-child(2) { -webkit-transition: .4s 1.05s; transition: .4s 1.05s; } #ac-menu-opener .ac-menu-hamburger .st0:nth-child(3) { -webkit-transition: .4s 1.15s; transition: .4s 1.15s; } #ac-menu-opener .ac-menu-x { position: absolute; top: calc(50% - 10px); left: calc(50% - 10px); height: 20px; width: 20px; } #ac-menu-opener .ac-menu-x .st0 { fill: none; stroke: #fff; stroke-width: 5.2094; stroke-miterlimit: 10; stroke-dasharray: 68; stroke-dashoffset: 68; } #ac-menu-opener .ac-menu-x .st0:nth-child(1) { -webkit-transition: .4s .1s; transition: .4s .1s; } #ac-menu-opener .ac-menu-x .st0:nth-child(2) { -webkit-transition: .4s .2s; transition: .4s .2s; } #ac-menu-opener.ac-open .ac-menu-hamburger line { stroke-dashoffset: 68; } #ac-menu-opener.ac-open .ac-menu-hamburger line:nth-child(1) { -webkit-transition: .4s .1s; transition: .4s .1s; } #ac-menu-opener.ac-open .ac-menu-hamburger line:nth-child(2) { -webkit-transition: .4s .2s; transition: .4s .2s; } #ac-menu-opener.ac-open .ac-menu-hamburger line:nth-child(3) { -webkit-transition: .4s .3s; transition: .4s .3s; } #ac-menu-opener.ac-open .ac-menu-x line { stroke-dashoffset: 0; } #ac-menu-opener.ac-open .ac-menu-x line:nth-child(1) { -webkit-transition: .4s .85s; transition: .4s .85s; } #ac-menu-opener.ac-open .ac-menu-x line:nth-child(2) { -webkit-transition: .4s .95s; transition: .4s .95s; } /*手机导航展开*/ body.fixed{ position:fixed; overflow:hidden;} #nav_fixed{ position:fixed; z-index:998; height:100%; width:100%; text-align:center; visibility:hidden; left:0; top:0;} #nav_fixed:before{content:"";width:50%;height:0;display:block;position:absolute;z-index:-1;left:0;top:0; background:#bf1a1a; transition:1s cubic-bezier(.165,.84,.44,1) .5s;} #nav_fixed:after{content:"";width:50%;height:0;display:block;position:absolute;z-index:-1;right:0;top:0; background:#bf1a1a; transition:1s cubic-bezier(.165,.84,.44,1) .5s;} #nav_fixed.ac-open{ visibility:visible;} #nav_fixed.ac-open:before{ height:100%; transition:1s cubic-bezier(.165,.84,.44,1) 0s;} #nav_fixed.ac-open:after{ height:100%; transition:1s cubic-bezier(.165,.84,.44,1) .5s;} #nav_fixed .left_box{ width:50%; height:100%; position:absolute; left:0; top:0;} #nav_fixed .right_box{ width:50%; height:100%; position:absolute; right:0; top:0;} #m_nav{position: relative;padding:50px 0;display: inline-block;text-align: center;padding-left: 21px;} #m_nav ul{text-align: center;display: inline-block;} #m_nav ul li{text-align: left;} #m_nav ul li a{ overflow:hidden; display:block;} #m_nav ul li h3{line-height:4.5rem;font-size: 2rem;color: #fff;transform: translateY(100%);transition: .6s; display: inline-block;} #m_nav .sub{line-height:1.6;margin-bottom:.5rem;/* display: none; */transform: translateY(100%);transition: .6s; opacity: 0;} #m_nav .sub a,#m_nav .sub span{display: inline-block;font-size:1rem;color: #fff;overflow: hidden;margin-right: 1rem;} #m_nav ul li.on h3{color: #ffffff;font-size: 2rem;font-weight: bold;} #m_nav ul li.on h3:after{ content: ""; display: block; width: 2rem; height: 2rem; border-radius: 50%; border: .5rem solid rgba(255,255,255,.3); position: absolute; right:-16px; top:0; z-index: -1;} #m_nav ul li.on a.on{ color:#b60005;} #nav_fixed.ac-open #m_nav ul li h3,#nav_fixed.ac-open #m_nav ul li span,#nav_fixed.ac-open #m_yuyan a div,#nav_fixed.ac-open #m_nav ul li .sub a,#nav_fixed.ac-open #m_nav .sub{opacity: 1; transform: translateY(0); transition: -webkit-transform .6s cubic-bezier(.165,.84,.44,1) 1s; transition: transform .6s cubic-bezier(.165,.84,.44,1) 1s; transition: transform .6s cubic-bezier(.165,.84,.44,1) 1s,-webkit-transform .6s cubic-bezier(.165,.84,.44,1) 1s; } #nav_fixed.ac-open #m_nav .sub{opacity: 1; transform: translateY(0); transition: .6s 1s;} /*首页banner*/ #banner .swiper-container { height:50rem; } #banner .swiper-slide { overflow: hidden; background-color: rgb(0 0 29);} #banner .slide-inner { position: absolute; width: 100%; height: 100%;left: 0; top: 0; background-size: cover; background-position: center; background-repeat: no-repeat !important;} #banner .swiper-button-prev{ background: none; opacity:.8; left:5%;} #banner .swiper-button-next{ background: none; opacity:.8; right:5%;} #banner .swiper-button-white .arrow{ width:.625rem; vertical-align:middle; display:inline-block;} #banner .swiper-button-white .arrow path{ stroke:#fff;} .s_tt{ text-align: center; margin-bottom: 2.5rem;} .s_tt h3{ font-size: 3rem; color: #000;} .s_tt h3 span{ display: inline-block; position: relative; z-index: 1;} .s_tt h3 i{ display: block; width: 2.4375rem; height: 2.4375rem; border-radius: 50%; border: .625rem solid #d16c6c38; position: absolute; right:-1rem; top: -1rem; z-index: -1;} .s_tt p{ font-size: 1rem; color: #8d8d8d; margin-top: 1rem; line-height: 1.5;} #s_about{ width: 100%; overflow: hidden;} #s_about .txt{ text-align:center; font-size: .9375rem; color: #383a40; line-height: 1.875rem;} #s_rukou{ width: 100%; overflow: hidden;} #s_rukou ul{} #s_rukou ul li{ width: 33.333%; float: left;} #s_rukou ul li a{ display:block; padding: 4.875rem 0; position: relative;} #s_rukou ul li .txt{ text-align: center; position: relative; z-index: 9;} #s_rukou ul li .txt font{ display: block; width: 2.75rem; height: 2.75rem; margin: 0 auto;} #s_rukou ul li .txt h5{ font-size: 1.5rem; color: #fff; margin-top: 1.125rem; margin-bottom: 1rem;} #s_rukou ul li .txt p{ font-size: 1rem; color: #fff; margin-bottom: 1.875rem;} #s_rukou ul li .txt span{ display: block; width: 8.5rem; height: 2.375rem; line-height: 2.375rem; text-align: center; background: #fff; margin: 0 auto; text-transform: capitalize; color: #000; font-size: .875rem;} #s_rukou ul li .mask{ position:absolute; left: 0; top: 0; width: 100%; height: 100%; background: #9e8360;} #s_rukou ul li .mask img{ width: 100%;height: 100%; opacity: .15; object-fit: cover; overflow: hidden; display: inline-block;} #s_rukou ul li:hover .mask{ opacity:1; visibility: visible;} #s_rukou ul li.li_1,#s_rukou ul li.li_1 .mask{ background: #2b2b2b;} #s_rukou ul li.li_2{ background: #9e8360;} #s_rukou ul li.li_3,#s_rukou ul li.li_3 .mask{ background: #464646;} /*#s_rukou ul li .mask{ opacity: 0; visibility: hidden; -webkit-transform-origin: left; -moz-transform-origin: bottom; -ms-transform-origin: bottom; -o-transform-origin: bottom; transform-origin: bottom; -webkit-transform: perspective(600px) rotateX(90deg); -moz-transform: perspective(600px) rotateX(90deg); -ms-transform: perspective(600px) rotateX(90deg); -o-transform: perspective(600px) rotateX(90deg); transform: perspective(600px) rotateX(90deg); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s;} #s_rukou ul li:hover .mask{ opacity: 1; visibility: visible; -webkit-transform: perspective(600px) rotateX(0deg); -moz-transform: perspective(600px) rotateX(0deg); -ms-transform: perspective(600px) rotateX(0deg); -o-transform: perspective(600px) rotateX(0deg); transform: perspective(600px) rotateX(0deg);}*/ #s_rukou ul li .mask{ opacity: 0; visibility: hidden; transform: translateY(100%); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; } #s_rukou ul li:hover .mask{ opacity: 1; visibility: visible; transform: translateY(0); } #s_case{width: 100%; overflow: hidden;} #s_case ul { margin:0 -1.25rem;} #s_case ul li{ width: 33.333%; float: left; padding: 1.25rem; overflow: hidden;} #s_case ul li a{ display:block;} #s_case ul li .img{ position: relative; overflow: hidden;} #s_case ul li .img img{ transition: 1s; aspect-ratio: 480/280;} #s_case ul li .img .mask{ position: absolute; left: 0; bottom: 0; width: 100%; height: 12%; text-align: center; color: #fff; z-index: 1; font-size: .875rem; line-height: 2rem; transition: .5s;} #s_case ul li .img .mask:before{ content: ""; position: absolute; right: 0; top: -4.25rem; bottom: 0; width: 100%; z-index: -1; transition: .7s;background: linear-gradient(top, transparent, rgba(50, 50, 54, 0.8)); background: -o-linear-gradient(top, transparent, rgba(50, 50, 54, 0.8)); background: -ms-linear-gradient(top, transparent, rgba(50, 50, 54, 0.8)); background: -webkit-linear-gradient(top, transparent, rgba(50, 50, 54, 0.8)); background: -moz-linear-gradient(top,transparent, rgba(50, 50, 54, 0.8)); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(rgba(50, 50, 54, 0.8))); FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr=transparent, endColorStr=#111); transition: all .3s linear !important; -webkit-transition: all .3s linear !important; transition-delay: 0.5s !important; transition-delay: 0.5s !important; } #s_case ul li .img .mask .txt{ transition: .5s; display: inline-block;transition: all .3s linear !important; -webkit-transition: all .3s linear !important; transition-delay: 0.5s !important; transition-delay: 0.5s !important;} #s_case ul li h5{ font-size: 1.25rem; color: #fff; text-align: center; margin-bottom: .875rem; } #s_case ul li p{ font-size: .875rem;padding: 0 2rem; margin-bottom: 1.625rem; opacity: 0; transition: .5s;transform: scale(.5);} #s_case ul li span{ display: block; width: 6.875rem; height: 2.1875rem; text-align: center; line-height: 2.1875rem; margin: 0 auto; background: #bf1a1a; border-radius: 1.25rem; font-size: .875rem; opacity: 0; transition: .5s; transform: scale(.5);} #s_case ul li:hover p{ opacity: 1;transform: scale(1);} #s_case ul li:hover span{ opacity: 1;transform: scale(1);} #s_case ul li:hover .img img{ transform: scale(1.03) rotate(.1deg);} #s_case ul li:hover .img .mask:before{ width: 100%; left: 0; right: auto; transition: background .7s .5s; transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; background: linear-gradient(top, rgba(50, 50, 54, 0.8), rgba(50, 50, 54, 0.8)); background: -o-linear-gradient(top, rgba(50, 50, 54, 0.8), rgba(50, 50, 54, 0.8)); background: -ms-linear-gradient(top, rgba(50, 50, 54, 0.8), rgba(50, 50, 54, 0.8)); background: -webkit-linear-gradient(top, rgba(50, 50, 54, 0.8), rgba(50, 50, 54, 0.8)); background: -moz-linear-gradient(top,rgba(50, 50, 54, 0.8), rgba(50, 50, 54, 0.8)); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50, 50, 54, 0.8)), to(rgba(50, 50, 54, 0.8))); FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr=#111, endColorStr=#111); } #s_case ul li:hover .img .mask{ height: 100%; } #s_case ul li:hover .img .mask .txt{ transition: .5s .3s; } #s_ys{ width: 100%; overflow: hidden;background: #e8e8e8;} #s_ys .box{ position:relative; padding-top: 13rem;} #s_ys .center{ text-align:center; position: relative; font-size: 0; width: 100%; margin: 0 auto;} #s_ys .s_tt{ position: absolute; width: 100%; height: 100%; left: 0; top: 5rem; margin-bottom: 0;} #s_ys ul{display: block; margin: auto; width: fit-content;} /*#s_ys ul li{ width: 21rem; position: absolute;}*/ #s_ys ul li font{ position: absolute; display: block; width: 2.875rem; height: 2.875rem; right: -4.5rem; top: -.775rem;} #s_ys ul li .txt{} #s_ys ul li .txt h5{ font-size: 1.5rem; color:#9b815f; margin-bottom: .75rem;font-weight: 500;} #s_ys ul li .txt p{ font-size: .9375rem; color: #8d8d8d; line-height: 1.5rem;} #s_ys ul li.li_1{ text-align:right; left: 0; top: 1rem;} #s_ys ul li.li_3{ text-align:right; left: 0; top: 29%;} #s_ys ul li.li_5{ text-align:right; left: 0; top: 57%; } #s_ys ul li.li_7{ text-align:right; left: 0; bottom: 0; } #s_ys ul li.li_2{ text-align:left; right: 0; top: 1rem;} #s_ys ul li.li_4{ text-align:left; right: 0; top: 29%;} #s_ys ul li.li_6{ text-align:left; right: 0; top: 57%;} #s_ys ul li.li_8{ text-align:left; right: 0; bottom: 0;} #s_ys ul li.li_2 font,#s_ys ul li.li_4 font,#s_ys ul li.li_6 font,#s_ys ul li.li_8 font{ left: -4.5rem;} #s_shuzi{ overflow:hidden; background: url(../images/s_shuzi_bg2.jpg) center no-repeat; background-size: cover; padding-top: 5rem; padding-bottom: 5rem;} #s_shuzi ul{ text-align: center; font-size: 0; display: flex; justify-content: space-between; margin: 2rem 0; flex-wrap: wrap;} #s_shuzi ul li{ display: inline-block;} #s_shuzi ul li .box{ display: inline-block; text-align: center;} #s_shuzi ul li p{ font-family:"Barlow Condensed"; font-size:5.75rem; color:#fff; margin-bottom:.8rem;} #s_shuzi ul li h5{ font-size:.9375rem; color:#fff;} #s_team{ width: 100%; position: relative; background: url(../images/team_bg.jpg) center no-repeat; background-size: cover; background-attachment: fixed;} #s_team .bg{ position: sticky; position: -webkit-sticky; top: 0;width: 100%; height:400px; } #s_team .s_tt{} #s_team .s_tt h3{ color: #fff;} #s_team .s_tt p{ color: #fff; opacity: .7;} #s_team .s_tt h3 i{ opacity:.3;} .team01{ width: 28.266%; float: left; position: relative;} .team01 a{ display:block; width: 100%; height: 100%; position: relative;} .team01 .img{ position: relative;} .team01 .img .tag{ position: absolute; top: 1.75rem; right: 1rem; font-size: 1rem; color: #171717;} .team01 .img .tag i{ display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; border: 2px solid #d6130b; margin-right: 3px;} .team01 .img img{ transition: 1s;/*height: 565px;*/aspect-ratio: 848/1131;} .team01 .txt{ position: absolute; color: #fff; background: rgba(0,0,0,.8); left: 0; bottom: 0; width: 100%; padding:1.5rem 2.25rem; transition: .5s;} .team01 .txt h5{ font-size: 1.5rem; margin-bottom: .5rem;} .team01 .txt h5 span{ font-size: 1rem; color: rgba(255,255,255,.5); display: inline-block; margin-left: 2.25rem;} .team01 .txt p{ font-size: .875rem;} .team01 .txt .more_btn{ width: 6.25rem; height:2.5rem; text-align: center; line-height: 2.5rem; border-radius: 1.25rem; background:#9e8360; position: absolute; top: 50%; margin-top: -1.25rem; right:2.25rem;} .team01:hover .txt{ padding:1rem 2.25rem;} .team01:hover .img img{ transform: scale(1.05) rotate(.1deg);} .team02{ width: 71.734%; float: left;} .team02 li{ width: 20%; float: left; padding-left: 6px; margin-bottom: 6px; overflow: hidden;} .team02 li a{ display:block; width: 100%; height: 100%; position: relative; overflow: hidden;} .team02 li .img{} .team02 li .img img{ transition: 1s; aspect-ratio: 848/1131;} .team02 li:hover .img img{ transform: scale(1.05) rotate(.1deg);} .team02 li .txt{ position: absolute; left: -100%; top: 0; width: 100%; height: 100%; text-align: center; background: rgba(158,131,96,0.9); transition: .7s;} .team02 li .txt .j_tab{} .team02 li .txt .j_tab_cel{} .team02 li .txt h5{ font-size: 1.5rem; color: #fff; margin-bottom: .5rem;} .team02 li .txt span{ font-size: 1rem; color: #fff;} .team02 li .txt p{ font-size: 1rem; color: #fff; margin-top: 1.125rem;} .team02 li .txt font{ display: block; width: 2.625rem; height: .625rem; margin: 0 auto; background: url(../images/team_more.png) center no-repeat; background-size: contain; margin-top: 2.5rem;} .team02 li .txt{ opacity: 0; visibility: hidden; } .team02 li:hover .txt{ opacity: 1; visibility: visible; left: 0; } #s_liucheng{ width: 100%; background: #f5f5f5; overflow: hidden;} #s_liucheng ul{ margin-top: -1rem; } #s_liucheng ul li{ text-align: center; position: relative; padding-top: 1rem;width: 10%; float: left;} #s_liucheng ul li font{ display: block; width: 4.6875rem; height: 4.6875rem; border-radius: 8%; margin: 0 auto; text-align: center; line-height: 4.6875rem; margin-bottom: 1.25rem; position: relative;} #s_liucheng ul li font img{ display: inline-block; position: relative; z-index: 3;} #s_liucheng ul li p{ font-size: 1rem; color: #333; line-height: 1.5rem; margin-bottom: 3.625rem;} #s_liucheng ul li:hover p{ color:#9e8360;font-family: "Microsoft YaHei"; } #s_liucheng ul li span{ display: block; width: 1.9375rem; height: 2.1875rem; line-height: 2.1875rem; text-align: center; background: url(../images/liucheng_num.png) center no-repeat; margin: 0 auto; background-size: contain;} #s_liucheng ul li+li:before{ content:""; width:10px; height:17px; display:block; background:url(../images/saj_lc_jt.png) center no-repeat; background-size: contain; position:absolute; left:0; margin-left:-5px; top:3rem; z-index: 1;} #s_liucheng ul li+li:after{ content:""; height:1px; display:block; border-bottom: 1px dashed #999; position:absolute; left:-50%; margin-left: 35px; right: 50%; margin-right:35px ; bottom: 1.09375rem; z-index: 2;} #s_liucheng ul li font:before{ content:""; width: 100%; height: 100%; border-radius: 8%; display: block; background: #4b4948; position: absolute; z-index:1; left: 0px; top: 0px; -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1); transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); transform: scale(1); -webkit-transform: scale(1); opacity: 1; visibility: visible;} #s_liucheng ul li font:after{ content:""; width: 100%; height: 100%; border-radius: 8%; display: block; background: #9e8360; position: absolute; z-index:2; left: 0px; top: 0px; transform: scale(0.6); -webkit-transform: scale(0.6); opacity: 0; -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1); transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); visibility: hidden;} #s_liucheng ul li:hover font:after{ transform: scale(1); -webkit-transform: scale(1); opacity: 1; visibility: visible;} #s_liucheng ul li:hover font:before{ transform: scale(1.2); -webkit-transform: scale(1.2); opacity: 0; visibility: hidden;} #s_liucheng ul li:hover span{ background: url(../images/saj_lc_dian.png) center no-repeat; color: #fff;} #s_kehu{ width: 100%; overflow: hidden;} #s_kehu ul{ margin: 0 -5px; margin-top: -1.625rem; } #s_kehu ul li{ width:20%; float:left; text-align: center; margin-top: 1.625rem; padding: 0 5px;} #s_kehu .he_3DY{display:inline-block; font-size: 0; overflow:hidden;padding:0;margin:0;border:0;position:relative;box-sizing:border-box;cursor:pointer;-webkit-perspective:1700px;-moz-perspective:1700px;perspective:1700px;-webkit-perspective-origin:50% 50%;-moz-perspective-origin:50% 50%;perspective-origin:50% 50%} #s_kehu .he_3DY .box{display:inline-block; max-width: 260px; padding:0;margin:0;position:relative;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d} #s_kehu .he_3DY .box > .img{ width:100%; height:100%; border-radius: 20px; border:.5rem solid #9e836030; text-align:center; display:table-cell; vertical-align:middle; backface-visibility:hidden;-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;transition:all .5s ease-in-out} #s_kehu .he_3DY .box > .img img{ width:auto; height:auto; max-width:100%; max-height:100%;} #s_kehu .he_3DY .box:hover > .img{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);transform:rotateY(180deg)}.he_3DFlipY_inner > div img{max-width:100%;padding:0;margin:0;display:block;position:relative} #s_kehu .he_3DY .txt{position:absolute;top:0;left:0;padding:0;background:#bf1a1a;color:#fff;height:100%;width:100%; border-radius: 20px; padding:0;margin:0;opacity:0; text-align:center;backface-visibility:hidden;-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);transform:rotateY(-180deg);-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;transition:all .5s ease-in-out} #s_kehu .he_3DY .box:hover .txt{opacity:1;-webkit-transform:rotateY(0);-moz-transform:rotateY(0);transform:rotateY(0); background:#bf1a1a;} #s_kehu .he_3DY .txt h5{font-size:1rem; text-align:center;color:#fff; } #s_kehu .he_3DY .box > .logo_hzpp{border-radius: 0%; border: 1px solid #e5e5e5; padding: 5px;} #s_kehu .he_3DY .logo_hzpp{border-radius: 0%; } #s_news{ background: url(../images/s_news_bg.jpg) center no-repeat;} #s_news ul{ margin: 0 -1.375rem;} #s_news ul li{ padding: 0 1.375rem;} #s_news ul li .img,#s_news ul li .img img{ overflow:hidden; width:100%; height:100%; position:relative} #s_news ul li .img img{ transition:1s; display:block; aspect-ratio: 650/390;} #s_news ul li .img .red-bg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition: 300ms; -webkit-transition: 300ms; } #s_news ul li .img .red-bg{ background: rgb(40 40 40 / 80%);} #s_news ul li .img .line { display: block; background: #fff; position: absolute; top: 50%; left: 50%; opacity: 0; visibility: hidden; transition: 400ms; -webkit-transition: 400ms; } #s_news ul li .img .line_1 { width: 52px; height: 1px; margin: -1px 0px 0px -26px; transform: translateX(-55px); -webkit-transform: translateX(-55px); } #s_news ul li .img .line_2 { width: 1px; height: 52px; margin: -26px 0px 0px -1px; transform: translateY(55px); -webkit-transform: translateY(55px); } #s_news ul li:hover .img .red-bg { opacity: 1; visibility: visible; } #s_news ul li:hover .img .line { transform: translate(0); -webkit-transform: translate(0); opacity: 1; visibility: visible; } #s_news ul li:hover .img img{ transform:scale(1.05);} #s_news ul li .txt{ padding-top: 1.5rem;} #s_news ul li .txt .time{ font-size: .875rem; color: #b2b2b4; margin-bottom: .625rem; display: block;float: right;} #s_news ul li .txt h5{ font-size: 1.25rem; color: #222225; margin-bottom: 1rem;} #s_news ul li .txt i{ display: block; width: 40px; height: 3px; background: #c3c3c3; margin-bottom: .625rem; position: relative;} #s_news ul li .txt i:before{ content: ""; display: block; width: 0; height:100%; background: #b91b22; transition: .5s;} #s_news ul li:hover .txt i:before{ width: 100%;} #s_news ul li .txt p{ font-size: .875rem; color: #868686; line-height: 1.75rem; height: 3.5rem; overflow: hidden;} #s_news ul li .btn_more{ display: block; margin-top: .75rem; font-size: .875rem; color: #868686;} .about_map { background: url( "../images/jjfa_bgt2.png") no-repeat center top; overflow: hidden; } .about_map dl { width: 100%; height: 100%; margin: 0 auto; display: block; position: relative; } .about_map dl img{ max-width: 100%; max-height: 100%; margin: 0 auto; display: block; padding-top: 2rem; margin-bottom: 4rem; } .tit { font: 50px "Microsoft YaHei"; } .tit em { display: block; font-size: 20px; } .about { background: url(../images/about_bg.jpg) no-repeat center top; height: 759px; overflow: hidden; } .about dl{ width:50%; background:rgba(0,0,0,0.5); padding:75px 2% 70px 13%; box-sizing:border-box; text-align:left;} .about dt{ color:#fff; text-align:left;} .about .tit:before{ background:none;} .about dt a{ color:#fff;} .about dt em{ color:#fff; margin-top:10px;} .about dd p{ margin:40px 0; font:16px "Microsoft YaHei "; line-height:30px; color:rgba(255,255,255,0.5);} .about dd span{display:block; width:106px; height:33px; background:url(../images/pro_more.png) no-repeat right center; margin:25px 0 0; font:16px "Microsoft YaHei "; font-weight:bold; line-height:33px;} .about dd span a{ display:block; color:#fff; text-decoration:underline;} .anout_tie{float: left;width: 50%;text-align: left;padding-bottom: 2em;} .anout_tie_r{float: right;width: 50%;text-align: right;} .about_em{ padding: 0px 0 30px;border-bottom: 1px solid #e3e3e3;} .about_p{font: 16px "Microsoft YaHei ";line-height: 30px;color: #666666;} #foot{ background: #2f2f35; color: #fff;} #foot .m{ display: flex; justify-content: space-between; } #foot .item{} #foot .tt{ font-size: 1.125rem; color: #fff; margin-bottom: .875rem;} #foot .con{ max-height: 9.375rem; overflow: auto;} #foot .con p{ font-size: .9375rem; color: #d0d0d1; line-height: 2rem;} #foot .con>a{ display: block; font-size: .875rem; color:#acacae; line-height: 1.875rem; transition: .3s; } #foot .con>a:hover{ color:#fff;} .foot_ewm{ float:right; margin-top:1.5rem;} .foot_ewm .ewm{ float:left; } .foot_ewm .ewm img{ width:84px; height:84px;} .foot_ewm .ewm p{ font-size:13px; color:#fff; color:rgba(255,255,255,.5); text-align:center; margin-top:.875rem;} .foot_tel{ text-align: right;} .foot_tel h3{ font-size: 2rem; color: #b91b22; font-family: arial;} .foot_tel p{ font-size: .8125rem; color: #acacae; margin-top: .375rem;} .foot_link .tt{ text-transform: uppercase; font-family: arial;} .foot_link .con{ padding-right: 1.25rem;} #foot .con::-webkit-scrollbar {width: 1px;height: 8px;background-color: #58585d;} #foot .con::-webkit-scrollbar-track {border-radius: 10px;background-color: #58585d;} #foot .con::-webkit-scrollbar-thumb {border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);background-color: #b91b22;} .foot_bot{ border-top: 1px solid #515156; overflow: hidden; margin-top: 2rem; padding-top: 1rem; padding-bottom: 1rem;} .copyright{ font-size: .875rem; color: #848486; line-height: 2.5rem; width: 1700px;} .copyright p{float: left; } .copyright a:hover{ color:#fff;} .foot_share{ text-align:center; float: right; } .foot_share h4{ text-align: right; font-size: .875rem; color: #525252; margin-bottom: .75rem;} .foot_share ul{ clear: both; text-align: right; margin:0 -.3125rem; } .foot_share ul li{ display:inline-block; vertical-align: middle; margin:0 .3125rem; position:relative;} .foot_share ul li a{ display:inline-block; width:2.5rem; height:2.5rem; line-height:2.5rem; text-align:center; border-radius:50%; cursor:pointer;} .foot_share ul li a img{ transition:.3s; max-width:50%; max-height:45%;} .foot_share ul li a .img02{ display:none;} .foot_share ul li a{ position: relative; z-index:1; transition: all 0.5s ease 0s; -webkit-transform: all 0.5s ease 0s;} .foot_share ul li a:before{ content:""; width: 100%; height: 100%; border-radius: 8%; border:1px solid #606064; display: block; position: absolute; z-index:-1; left: 0px; top: 0px; transition: all 0.5s ease 0s; -webkit-transform: all 0.5s ease 0s;} .foot_share ul li a:after{ content:""; width: 100%; height: 100%; border-radius: 8%; display: block; background: #b91b22; position: absolute; z-index:-1; left: 0px; top: 0px; transform: scale(0.6); -webkit-transform: scale(0.6); opacity: 0; -moz-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -o-transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); -ms-transition: all .6s cubic-bezier(0.445, 1.045, 0.355, 1); transition: all .6s cubic-bezier(0.445, 0.145, 0.355, 1); visibility: hidden;} .foot_share ul li a:hover:before{ opacity: 0; transform: scale(1.3); -webkit-transform: scale(1.3); } .foot_share ul li a:hover:after{ transform: scale(1); -webkit-transform: scale(1); opacity: 1; visibility: visible;} .foot_share ul li a:hover .img01{ display:none;} .foot_share ul li a:hover .img02{ display: inline-block;} .foot_share ul li p{ font-size:.875rem; color:#969696; margin-top:1rem;} .tc{ transition:all ease 300ms; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index:999; pointer-events: none; visibility:hidden; opacity:0; transition:.5s; overflow: auto;} .tc[name=tc_search]{ opacity:1;} .tc.act{ display: block; pointer-events: auto; visibility:visible; opacity:1;} .tc-box{ box-sizing:border-box; z-index:999; display: block; position:relative; } .tc_close{ position: absolute; cursor:pointer; color:#e13a39; font-size:30px; right: 30px; top: 30px;} .tc_bg { height: 100%; background: rgba(0,0,0,.7); position: absolute; top: 0; left: 0; width: 100%; z-index: 0; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0; transition:.5s; } .tc.act .tc_bg{ filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; transition:.5s; } .tc1 .tc{pointer-events: none;filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity:0;opacity:0; position: fixed;width: 100%;height: 100%;top: 0;z-index: 99999;} .tc1 .tc.act{ filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; pointer-events: auto; } .tc1 .close:hover{ transform:rotate(180deg);} .tc1 .close,.tc{ transition:all ease 400ms; -moz-transition:all ease 400ms; -ms-transition:all ease 400ms; -o-transition:all ease 400ms; -webkit-transition:all ease 400ms; } .tc1 .tc-box{position:absolute; background: #9e8360; overflow: hidden;top:50%;z-index:9999; width: 11rem; left:50%;margin-left: -5.5rem;margin-top: -5.5rem;} .tc1 .tc.act .tc-box{ transform:scale(1);} .tc1 .tc.act{display: block; } .tc1 .close{position: absolute; cursor:pointer;font-size: 20px;right: 30px;top: 30px; } .tc1 .tc-box h3 img{ width:10rem; height:10rem; margin:.5rem;} .tc1 .tc-box h5{ width:11rem; height:3rem; line-height:3rem; font-size:1rem; color:#fff; text-align:center} #gotop{ transition: .5s;} .online_q { position: fixed; right: 0 !important; bottom: 10%; z-index: 9999; transition:.5s; -webkit-transition:.5s; padding-top: 2px;} .online_q .btn2{width:4.375rem; float: right; height:4.375rem; opacity: 1; cursor:pointer; position:relative; border: 1px solid #ededed; background: #fff; text-align: center; margin-top: -1px; transition: .3s; clear: both;} .online_q .btn2 .j_tab{width:4.375rem; } .online_q .btn2 font{ display: block; width: 2.125rem; max-height: 2.125rem; text-align: center; margin: 0 auto;} .online_q .btn2 span{ font-size: 12px; color: #9c9c9c; display: block; margin-top: .5rem;} #gotop.hide{height:0; overflow:hidden; display:block !important; opacity: 0;} .online_q .btn2:hover{width: 5.5rem;} .online_q .open.pic{ position:absolute; background:#ddd; width:100px; height:100px; right:80px; top:50%; margin-top:-50px; text-align:right; opacity:0; transition: .6s; -webkit-transition: .6s; visibility:hidden;} .online_q .open.pic img{ width:80px; height:80px; margin-top:10px; margin-right:10px;} .online_q .btn2:hover .open.pic{ opacity:1; right:5.375rem;visibility:visible;} .online_q .open.phone{display:inline-block;height: 4.3125rem;line-height: 4.3125rem;z-index:0;width:0;background: #fff;color: #ededed;font-family:arial;font-size:18px;transition:width 0s;-webkit-transition:width 0s;text-align:center;width:150px;position: absolute;left: 4.375rem;top: 0;border-bottom: 1px solid #ddd;} .online_q .btn2:hover .open.phone{transition:.5s; -webkit-transition:.5s; opacity:1; visibility:visible;} .btn-tel a{ display:block; width:3.75rem; white-space:nowrap; position:absolute; right:0;transition:.5s; -webkit-transition:.5s; overflow:hidden;} .btn-tel:hover a{ width:205px;} .online_q .btn-02.btn-tel:hover span{ background:url(../images/piaofu_tel.png) center no-repeat #fff; border:2px solid #037ccf;} .online_q .open.pic:before{ content:""; display:block; width:0; height:0; border:10px solid transparent; border-left:10px solid #ddd; position:absolute; right:-15px; top:50%; margin-top:-10px;} .online_q .btn2:nth-child(3):hover { width: 14.5rem; } #n_banner{ width:100%; height:32.125rem; overflow:hidden; position:relative; text-align:center; background:#000; z-index: 8; } #n_banner .con{ height:100%; position: absolute; top:0; left:0; z-index:99; width:100%;} #n_banner .img{ height:100%; opacity:1; fiter:alrha(opacity=100); } #n_banner .txt{ padding-top: 3rem;} #n_banner .txt h3{ text-transform:uppercase; font-size:2.375rem; color:#fff; margin-bottom:.5rem; } #n_banner .txt span{ display: block; font-size:.75rem; text-transform: uppercase; color:#fff; opacity: .6; font-family: arial;} #n_banner .txt i{ display: block; width: 2.875rem; height: 19px; background:url(../images/yanjing.png) center no-repeat; background-size: contain; margin: 0 auto; margin-top: 1.875rem;} #n_banner .txt p{ font-size: 1.5rem; color: #fff; margin-top: 1.875rem;} /*内页导航*/ .n_nav{ position:relative; z-index: 9; width:100%; overflow:hidden; margin-top: -4.375rem; } .n_nav:after{ content:""; width:100%; height:1px; display:block; background:rgba(255,255,255,.35); position:absolute; top:0; left:0; transition: .5s; z-index:-1;} /*内页导航*/ .n_nav{text-align: center; } .n_nav ul{ display: flex;} .n_nav ul li{ flex-grow: 1; text-align:center;line-height:4.375rem; font-size:.9375rem;color:#fff;transition:.3s;display: inline-block;} .n_nav ul li a{ display:block; padding: 0 3rem;} .n_nav ul li font{display:inline-block;vertical-align:middle;width:1.25rem;height:1.25rem;line-height:1.25rem;margin-right:.5rem;position: relative;} .n_nav ul li font img{max-width:100%;max-height:100%;vertical-align:middle;position: absolute;left: 0;} .n_nav ul li font .img02{ display:none; } .n_nav ul li:hover,.n_nav ul li.on{ color:#fff; background: #b91b22; } .n_nav ul li:hover .img01,.n_nav ul li.on .img01{ display:none;} .n_nav ul li:hover .img02,.n_nav ul li.on .img02{ display:block;} #n_news{ } #n_news ul{ margin: 0 -1.375rem; overflow: hidden; margin-top: -2.5rem;} #n_news ul li{ padding: 0 1.375rem; width: 33.333%; float: left; margin-top: 2.5rem;} #n_news ul li .img,#n_news ul li .img img{ overflow:hidden; width:100%; height:100%; position:relative} #n_news ul li .img img{ transition:1s; display:block; aspect-ratio: 480/280;} #n_news ul li .img .red-bg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition: 300ms; -webkit-transition: 300ms; } #n_news ul li .img .red-bg{ background:rgb(64 64 64 / 80%);} #n_news ul li .img .line { display: block; background: #fff; position: absolute; top: 50%; left: 50%; opacity: 0; visibility: hidden; transition: 400ms; -webkit-transition: 400ms; } #n_news ul li .img .line_1 { width: 52px; height: 1px; margin: -1px 0px 0px -26px; transform: translateX(-55px); -webkit-transform: translateX(-55px); } #n_news ul li .img .line_2 { width: 1px; height: 52px; margin: -26px 0px 0px -1px; transform: translateY(55px); -webkit-transform: translateY(55px); } #n_news ul li:hover .img .red-bg { opacity: 1; visibility: visible; } #n_news ul li:hover .img .line { transform: translate(0); -webkit-transform: translate(0); opacity: 1; visibility: visible; } #n_news ul li:hover .img img{ transform:scale(1.05);} #n_news ul li .txt{ padding:2.25rem 1.875rem; background: #f5f5f5;} #n_news ul li .txt .time{ font-size: .875rem; color: #b2b2b4; margin-bottom: .625rem; display: block;} #n_news ul li .txt h5{ font-size: 1.25rem; color: #222225; margin-bottom: 1rem;} #n_news ul li .txt i{ display: block; width: 40px; height: 3px; background: #828286; margin-bottom: .625rem; position: relative;} #n_news ul li .txt i:before{ content: ""; display: block; width: 0; height:100%; background: #b91b22; transition: .5s;} #n_news ul li:hover .txt i:before{ width: 100%;} #n_news ul li .txt p{ font-size: .875rem; color: #868686; line-height: 1.75rem; height: 3.5rem; overflow: hidden;} #n_news ul li .btn_more{ display: block; margin-top: .75rem; font-size: .875rem; color: #868686;} /*翻页*/ .page { text-align:center; margin-top:3.75rem;} .page li{ display:inline-block; list-style: none; } .page a{ padding:0 .875rem; min-width: 2.25rem; height:2.25rem; line-height:2.25rem; border-radius: 2px; display:inline-block; margin:0 0.25rem; background:#eeeff4; color:#919191; font-size:.875rem; -moz-transition: all 0.36s ease-in-out;-webkit-transition: all 0.36s ease-in-out;-o-transition: all 0.36s ease-in-out;-ms-transition: all 0.36s ease-in-out;transition: all 0.36s ease-in-out;} .page .on{ background:#b91b22; color:#fff; } .page .page-num-current{ background:#b91b22; color:#fff; } .page a:hover{ background:#b91b22; color:#fff; } /*==============分享插件=====================*/ .shart_box{ display:inline-block; float:right; } #j_shart_s_24 .fx{ position:relative; top:2px;} #j_shart_s_24 .bds_count{ font-size:12px;} #j_shart_s_24{ padding-left:50px; position:relative;} #j_shart_s_24 strong{ display:block; position:absolute; left:0; z-index:2; line-height:36px; font-size:.75rem; color: #7e8080; font-weight:normal;} #j_shart_s_24 .bds_qzone{background:url(../images/j_shart.png) center -224px no-repeat} #j_shart_s_24 .bds_tsina{background:url(../images/j_shart.png) center -311px no-repeat} #j_shart_s_24 .bds_tqq{background:url(../images/j_shart.png) center -195px no-repeat} #j_shart_s_24 .bds_renren{background:url(../images/j_shart.png) center -340px no-repeat} #j_shart_s_24 .bds_weixin{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_sqq{background:url(../images/j_shart.png) center -79px no-repeat} #j_shart_s_24 .bds_fbook{background:url(../images/j_shart.png) center -166px no-repeat} #j_shart_s_24 .bds_twi{background:url(../images/j_shart.png) center -137px no-repeat} #j_shart_s_24 .bds_linkedin{background:url(../images/j_shart.png) center -108px no-repeat} #j_shart_s_24 .bds_tieba{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_huaban{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_douban{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_copy{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_print{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_mshare{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_count{font-size:12px} .ar_title {margin-bottom:2.5rem; padding-bottom:1.25rem; position: relative;} .ar_title:before{ content: ""; display: block; width: 100%; height: 3px; background: #f0f0f0; position: absolute; left: 0; bottom: 0;} .ar_title:after{ content: ""; display: block; width: 9rem; height: 3px; background: #9e8360; position: absolute; left: 0; bottom: 0;} .ar_title h3{ font-size:1.5rem; color:#424242; margin-bottom:.875rem; line-height: 1.5; } .ar_title span.time{ font-size:.875rem; color:#7e8080; line-height:2rem;} #position{ overflow:hidden; max-width: 1400px; margin-top: 2rem; margin-left:auto; margin-right: auto; font-size: 0.8rem; color: #9e8360;} /*新闻详情*/ #n_news_xq{ overflow:hidden; padding:5rem 6rem; margin: 0.75rem 3.75rem 0 0; background: #fff; max-width: 1400px; margin-left:auto; margin-right: auto;} .left_news_xq{ width:73.1%; float:left;} .right_news_tujian{ width:23.6%; float:right; } .right_news_tujian ul li{ width:100%; margin-bottom:1.5rem; } .right_news_tujian ul li a{ display:block; width:100%;} .right_news_tujian ul li .img{ overflow:hidden; width:100%; border-radius: 3px;} .right_news_tujian ul li .img img{ width:100%; height:100%; display:block; transition:1s; aspect-ratio: 480/350;} .right_news_tujian ul li:hover .img img{ transform:scale(1.1) rotate(.1deg);} .right_news_tujian ul li .txt{ padding-top:.75rem; } .right_news_tujian ul li .txt h5{ font-size:1.125rem; line-height: 1.75rem; color:#333335; margin-bottom:.5rem; transition:.3s; white-space: normal;} .right_news_tujian ul li .txt h5:hover{ color:#9e8360;} .right_news_tujian ul li .txt span{ display:block; height:18px; line-height:21px; font-size:.875rem; color:#b2b2b4;} .ar_article{ font-size:.9375rem; color:#686868; line-height:1.875rem; text-align:justify; } .ar_article p{font-size:.9375rem;color:#686868;line-height:1.875rem; padding-bottom:1.75rem;} .ar_article strong{ font-weight:bold;} .ar_article td,.ar_article th{ padding:15px; border: 1px solid #c6c5c5; font-size:1rem !important; font-family: "微软雅黑","Microsoft YaHei", sans-serif !important;} .ar_article td *,.ar_article th *{ font-size:0.95rem !important; font-family: "微软雅黑","Microsoft YaHei", sans-serif !important;} .ar_article td p,.ar_article th p{ padding-bottom:0; margin-bottom:0; text-align: inherit;} .ar_article img{ max-width:100%;} .ar_article a{ color:#2a8aef;} .ar_article h1,.ar_article h2,.ar_article h3,.ar_article h4,.ar_article h5,.ar_article h6{ font-weight:bold;} .ar_article ul li, .ar_article ol li{ padding-bottom:0 !important; margin-bottom:0 !important; margin-left:2rem;} .ar_article ul li p, .ar_article ol li p{ padding-bottom:0; margin-bottom:3px !important; } .ar_article ul, .ar_article ol{ margin-bottom:15px;} .ar_fot{ overflow: hidden; margin-top: 1rem;} .ar_fot div{ width:49%; float: left;} .ar_fot span{ display: inline-block; width: 6.25rem; height: 2.5rem; line-height: 2.5rem; float: left; font-size: .9375rem; background: #bfbfbf; color: #fff; border-radius: 3px; text-align: center; margin-right: .625rem; transition: .3s;} .ar_fot h5{ line-height: 2.5rem; font-size: .9375rem; color: #303030;} .ar_fot .next{ float:right;} .ar_fot .next span{ float: right; margin-left: .625rem;} .ar_fot .next h5{ text-align: right;} .ar_fot div:hover span{ background: #b91b22;} #n_team{ overflow: hidden; width: 100%;} #n_team ul{ margin-top: -3rem;} #n_team ul li{ width: 20%; float: left;} #n_team ul li{ padding:0 1.09375rem;margin-top:3rem;} #n_team ul li .img{ position: relative; overflow: hidden;} #n_team ul li .img img{/*height: 353px;*/aspect-ratio: 848/1131;} #n_team ul li .img .mask{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-align: center; color: #fff; z-index: 1; font-size: .875rem; line-height: 2rem;} #n_team ul li .img .mask:before{ content: ""; position: absolute; right: 0; top: 0; width: 0; height: 100%; background: rgba(158,131,96,0.8); z-index: -1; transition: .7s; } #n_team ul li .img .mask span{ opacity: 0; visibility: hidden; transform: translateY(15px); transition: .3s; display: inline-block; width: 7.5rem; height: 2.25rem; line-height: 2.125rem; color: #fff; font-size: .875rem; border: 1px solid rgba(255,255,255,.5); border-radius: 1.125rem; text-transform: uppercase;} #n_team ul li h5 {font-size: 1.5rem; color: #010101; text-align: center; padding: 0 10px; margin-bottom: 10px;} #n_team ul li:hover .img .mask:before{ width: 100%; left: 0; right: auto;} #n_team ul li:hover .img .mask span{ opacity: 1; visibility: visible; transform: translateY(0); transition: .5s .3s; } #n_team ul li .txt{ border:1px solid #e5e5e5; text-align: center; padding-top: 1.125rem;} #n_team ul li h4{ border-top: 1px solid #e5e5e5; line-height: 3rem; margin-top: 1rem; font-size: .875rem; color: #5b5b5b;} #n_team ul li h4 b{ font-weight: normal; color: #9e8360;} #n_case{} #n_case ul{margin: 0 -1.875rem; margin-top: -3rem;} #n_case ul li{ width: 33.333%; float: left; padding: 0 1.875rem; margin-top: 3rem;} #n_case ul li .img,#n_case ul li .img img{ overflow:hidden; width:100%; height:100%; position:relative} #n_case ul li .img img{ transition:1s; display:block;/*height: 345px; object-fit: cover;*/ aspect-ratio: 480/280;} #n_case ul li .img .red-bg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition: 300ms; -webkit-transition: 300ms; background: rgb(0 0 0 / 60%);} #n_case ul li .img .line { display: block; background: #fff; position: absolute; top: 50%; left: 50%; opacity: 0; visibility: hidden; transition: 400ms; -webkit-transition: 400ms; } #n_case ul li .img .line_1 { width: 48px; height: 1px; margin: -1px 0px 0px -24px; transform: translateX(-58px); -webkit-transform: translateX(-58px); } #n_case ul li .img .line_2 { width: 48px; height: 1px; margin: -18px 0px 0px -24px; transform: translateY(58px); -webkit-transform: translateY(58px); } #n_case ul li .img .line_3 { width: 48px; height: 1px; margin: 18px 0px 0px -24px; transform: translateX(58px); -webkit-transform: translateX(58px); } #n_case ul li .img:hover .red-bg { opacity: 1; visibility: visible; } #n_case ul li .img:hover .line { transform: translate(0); -webkit-transform: translate(0); opacity: 1; visibility: visible; } #n_case ul li .img:hover img{ transform:scale(1.05);} #n_case ul li .txt{ text-align: center; padding-top: 1.375rem;} #n_case ul li .txt h5{ font-size: 1.25rem; color: #4d4d4d; margin-bottom: 1.125rem;} #n_case ul li .txt p{ font-size: .875rem; color: #4f4f4f;} #n_case ul li:hover .txt h5{ color: #b91b22;} .paixu_box{ text-align: center; margin-bottom: 2rem;} .btn_paixu{ display: inline-block; width: 6.25rem; text-align: center; height: 2.8125rem; line-height: 2.7125rem; vertical-align: top; border: 1px solid #b91b22; color: #b91b22; margin-bottom: 1rem; transition: .3s; margin-top: 3.1rem;} .btn_paixu.on,.btn_paixu:hover{ background: #b91b22; color: #fff;} .top_search { display: inline-block; vertical-align: top; margin: 0 .625rem; position: relative; overflow: hidden; width: 24.375rem; height: 2.8125rem; cursor: pointer; background: #fff; overflow: visible; } .top_search #keyword { padding-left: 15px; display:block; float:left; height: 2.875rem; color: #7e7e7e !important; width: calc(100% - 5.625rem); box-sizing: border-box; font-size: .9375rem; border: 1px solid #dcdcdc; } .top_search .btn_blue { width: 5.625rem; line-height: 2.875rem; border-radius:0 3px 3px 0; background:#9e8360; display: block; float: right; color: #fff; font-size:14px; border: 0; cursor: pointer; } #n_case_xq{ width: 100%; overflow: hidden;} #n_case_xq .left_box{ width: 56%; float: left;} #n_case_xq .right_box{ width: 38.8%; float: right;} .branch_slide { margin-bottom: 30px; } .branch_slide .bd { margin-bottom: 8px; } .branch_slide .bd li { } .branch_slide .bd li img {width: 55.625rem; max-width: 100%;margin: 0 auto; transition: 1s; aspect-ratio: 850/638;} .branch_slide .bd li:hover img{ transform: scale(1.03) rotate(.1deg);} .branch_slide .hd {width: 55.625rem; max-width: 100%; margin: 0 auto;} .branch_slide .hd ul{margin: 0 -5px;} .branch_slide .hd li { padding: 5px; position: relative; } .branch_slide .hd li .img { transition: .5s; cursor: pointer; border: 2px solid transparent; } .branch_slide .hd li.slick-current .img { border: 2px solid #9e8360; } .branch_slide .hd li.slick-current:before { content: ""; border: 7px solid transparent; border-bottom: 7px solid #9e8360; position: absolute; left: 50%; margin-left: -7px; top: -7px;} .branch_slide .hd li img {max-width: 100%;aspect-ratio: 850/638;} .branch_slide .bd .slick-arrow{ z-index:99; position:absolute; top:50%; margin-top:-2rem; transform:translate(0,0); opacity:1; display:block; width: 2.5rem; height: 4rem; background-size:20px !important;} .branch_slide .bd .slick-prev{ left:0;background:url(../images/alzs_show_lb_l.png) center no-repeat rgba(0,0,0,.5); transition:300ms;-webkit-transition:300ms;} .branch_slide .bd .slick-next{ right:0; background:url(../images/alzs_show_lb_r.png) center no-repeat rgba(0,0,0,.5); transition:300ms;-webkit-transition:300ms;} .slick-prev:before, .slick-next:before{ display:none;} .case_info{} .case_info .tt{ font-size:1.625rem; color: #4f4f4f; border-bottom: 1px solid #e5e5e5; line-height: 2.5rem; padding-bottom: 1.25rem; margin-bottom: 1.5rem;} .case_info ul{} .case_info ul li{ line-height: 2.125rem;} .case_info ul li span{} .case_info ul li span img{ margin-right: .5rem;} .case_info .tt2{ margin-top: 1.5rem; margin-bottom: 1.5rem; font-size: 1.375rem; color: #4f4f4f;} .case_info .con{ font-size: .9375rem; color: #747474; line-height: 1.875rem; margin-bottom: 3.125rem;} .btn_yuyue{ display: block; width: 12rem; height: 2.8125rem; text-align: center; line-height: 2.8125rem; background: #9e8360; color: #fff; border-radius: 1.5rem;} .btn_yuyue img{ margin-right: .5rem; height: 1.125rem;} .btn_flashcenter { display: block; position: relative; overflow: hidden; transition: 0.52s; } .btn_flashcenter .anim { -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); position: absolute; top: 50%; left: 50%; } .btn_flashcenter .anim:before { position: relative; content: ''; display: block; margin-top: 100%; } .btn_flashcenter .anim:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; border-radius: 50%; } .btn_flashcenter:hover .anim { -moz-animation: anim-out 0.75s; -webkit-animation: anim-out 0.75s; animation: anim-out 0.75s; } .btn_flashcenter:hover .anim:after { -moz-animation: anim-out-pseudo 0.75s; -webkit-animation: anim-out-pseudo 0.75s; animation: anim-out-pseudo 0.75s; } @-webkit-keyframes anim-out-pseudo { 0% { background: rgba(0, 0, 0, 0.25); } 100% { background: transparent; } } @-moz-keyframes anim-out-pseudo { 0% { background: rgba(0, 0, 0, 0.25); } 100% { background: transparent; } } @-ms-keyframes anim-out-pseudo { 0% { background: rgba(0, 0, 0, 0.25); } 100% { background: transparent; } } @keyframes anim-out-pseudo { 0% { background: rgba(0, 0, 0, 0.25); } 100% { background: transparent; } } @-webkit-keyframes anim-out { 0% { width: 0%; } 100% { width: 100%; } } @-moz-keyframes anim-out { 0% { width: 0%; } 100% { width: 100%; } } @-ms-keyframes anim-out { 0% { width: 0%; } 100% { width: 100%; } } @keyframes anim-out { 0% { width: 0%; } 100% { width: 100%; } } #n_shili{} #n_shili .txt{ text-align: center; max-width: 1275px; margin: 0 auto;} #n_shili .tt{ font-size: 1.625rem; color: #343434; margin-bottom: 2.25rem; font-weight: 400;} #n_shili .con{ font-size: .9375rem; color: #666666; line-height: 1.875rem; margin-bottom: 2rem; } #n_shili ul{ margin: 0 -.625rem;} #n_shili ul li{ padding: .625rem;} #n_shili ul li .box{ position:relative; overflow: hidden;} #n_shili ul li .img{} #n_shili ul li .img img{ transition: 1s;} #n_shili ul li .box:hover .img img{ transform: scale(1.1) rotate(.1deg);} #n_shili ul li h5{ height: 3.125rem; line-height: 3.125rem; position: absolute; left: 0; bottom: -3.125rem; width: 100%; text-align: center; background: #9e8360; color: #fff; font-size: 1rem; padding: 0 10px; transition: .5s;} #n_shili ul li .box:hover h5{ bottom: 0;} #n_shili .slick-prev2{ left: -6rem;} #n_shili .slick-next2{ right: -6rem;} .slick_arrow_right2{ position: relative;} .slick_arrow_right2 .slick-arrow{ z-index:99; position:absolute; left:0; top:50%; transform:translate(0,0); background-size:.9rem !important; margin-top: -2rem; display:block;border-radius:50%; font-size:0; cursor:pointer; width: 3.75rem; height: 3.75rem; line-height:3.75rem;} .slick_arrow_right2 .slick-arrow.slick-next2{ right:0; left:auto;} .slick_arrow_right2 .arrow{ width:.625rem; vertical-align:middle; display:inline-block;} .slick_arrow_right2 .slick-arrow:hover .arrow path{ stroke:#9e8360;} .slick_arrow_right2 .draw_h:before{ border:1px solid #cacaca;} #n_shili .slick_arrow_right2 .draw_h:hover svg.drawcircle circle { stroke:#9e8360;} #n_ys{ background: url(../images/n_ys_bg.jpg) center no-repeat; width: 100%; color: #fff; overflow: hidden;} #n_ys .tt{ text-align: center; margin-bottom: 3.125rem;} #n_ys .tt span{ font-size: 1.75rem; color: #fff;margin-bottom: .625rem; display: block;} #n_ys .tt h3{ font-size: 1.75rem; color: #fff; } #n_ys ul{ position: relative; overflow: hidden;border: 1px solid #ffceaf; border-top: 0; border-bottom: 0;} #n_ys ul li{} #n_ys ul li .box{ text-align: center; border: 1px solid #ffceaf; position: relative;border-left:0;} #n_ys ul li .img{ opacity: 0; visibility: hidden; transition: .7s; position: relative; z-index: 2;} #n_ys ul li .txt{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;} #n_ys ul li font{ display: block; width: 2.75rem; height: 2.75rem; margin: 0 auto; margin-bottom: 1.125rem;} #n_ys ul li font img{} #n_ys ul li h5{ font-size: 1.375rem; margin-bottom: 1.625rem; padding: 0 1.75rem;} #n_ys ul li p{ font-size: 1rem; line-height: 1.5rem; padding: 0 1.75rem; max-width: 270px; margin: 0 auto;} #n_ys ul li:hover .img{ opacity: 1; visibility: visible;} #n_ys ul li .img{-webkit-transform-origin: left; -moz-transform-origin: left; -ms-transform-origin: left; -o-transform-origin: left; transform-origin: left; -webkit-transform: perspective(600px) rotateY(90deg); -moz-transform: perspective(600px) rotateY(90deg); -ms-transform: perspective(600px) rotateY(90deg); -o-transform: perspective(600px) rotateY(90deg); transform: perspective(600px) rotateY(90deg); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s;} #n_ys ul li:hover .img{ -webkit-transform: perspective(600px) rotateY(0deg); -moz-transform: perspective(600px) rotateY(0deg); -ms-transform: perspective(600px) rotateY(0deg); -o-transform: perspective(600px) rotateY(0deg); transform: perspective(600px) rotateY(0deg);} #n_chengjiaogushi{ overflow:hidden; width: 100%; } #n_chengjiaogushi .left{ width:30%; height: 41.25rem; float:left; background: url(../images/n_kehu_txt.jpg) center no-repeat; background-size: cover; padding-top: 3rem;} #n_chengjiaogushi .right{ width:70%; height: 41.25rem; float:right; background: #f8f8f8; border: 1px solid #eee;} #n_chengjiaogushi .box1{ overflow:hidden; margin-bottom:30px;} #n_chengjiaogushi .box1 .img{ width:15.625rem; max-width: 90%; overflow: hidden; border-radius: 8%; border: 4px solid #fff; margin:0 auto;} #n_chengjiaogushi .box1 .img img{} #n_chengjiaogushi .box1 .txt{ padding-top:26px; text-align: center;} #n_chengjiaogushi .box1 .txt h5{ font-size:1.625rem; color:#fff; margin-bottom:12px;} #n_chengjiaogushi .box1 .txt p{ font-size:.9375rem; color:#fff; line-height:1.75rem;} #n_chengjiaogushi .box1 .txt .btn{ width:120px; height:35px; line-height:35px; text-align:center; color:#fff; font-size:14px; border-radius:3px; background:#f06060; display: inline-block; margin-top:33px;} #n_chengjiaogushi .box1 .txt .btn:hover{ background:#e75656;} #n_chengjiaogushi .box2{ font-size:14px; color:#7b7b7b; line-height:28px;} #n_chengjiaogushi .hd ul{} #n_chengjiaogushi .hd ul li{ width:16.6666%; float: left; padding: .9375rem; } #n_chengjiaogushi .hd ul li .img{ position: relative; max-width: 7.5rem; max-height: 7.5rem; margin: 0 auto; border-radius: 8%;overflow: hidden; text-align: center; cursor:pointer;} #n_chengjiaogushi .hd ul li img{ width:100%; height:100%; border-radius: 8%; border:3px solid #d0d0d0; background: #d0d0d0; } #n_chengjiaogushi .hd ul li .mask{ position:absolute; top:0; left:0; background:#9e8360; color:#fff; width:100%; height:100%; padding:5px; font-size:.9375rem; opacity:0; visibility:hidden; transition:.5s; line-height: 1.5rem; border-radius: 8%;} #n_chengjiaogushi .hd ul li .mask .btn{ display:block; width:67px; height:22px; line-height:20px; text-align:center; border:1px solid #fff; border:1px solid rgba(255,255,255,.55); font-size:12px; border-radius:3px; margin-top:17px;} #n_chengjiaogushi .hd ul li.on .mask{ opacity:1; visibility:visible;} #n_chengjiaogushi .cj_change{ width:155px; height:155px; margin-bottom:20px; border-radius:3px; overflow:hidden; float:left; margin-right:19px; text-align:center; background:#ebebeb; padding-top:54px; cursor:pointer; transition:.2s;} #n_chengjiaogushi .cj_change font{ display:block; margin-bottom:6px;} #n_chengjiaogushi .cj_change:hover{background:#ddd;} #n_chengjiaogushi .hd{ padding:1.5rem 4rem;} #n_chengjiaogushi .scroll_box{ overflow-y:auto; height: 100%; padding-right: 2rem;} #n_chengjiaogushi .scroll_box::-webkit-scrollbar {width: 3px;height: 8px;background-color: #F5F5F5;} #n_chengjiaogushi .scroll_box::-webkit-scrollbar-track {border-radius: 10px;background-color: #E2E2E2;} #n_chengjiaogushi .scroll_box::-webkit-scrollbar-thumb {border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);background-color: #b91b22;} .btn_zixun{ display: block; width:9.375rem; height:2.5rem; line-height:2.375rem; border-radius: 1.25rem; text-align: center; color: #fff; font-size: .9375rem; margin: 0 auto; border:1px solid #fff; margin-top: 1rem; transition: .3s;} .btn_zixun font{ display: inline-block; height: 1rem; margin-right: .5rem; } .btn_zixun font .img02{ display:none;} .btn_zixun:hover{ background: #fff; color: #b91b22;} .btn_zixun:hover font .img02{ display: inline-block;} .btn_zixun:hover font .img01{ display: none;} #n_lianxi{ width: 100%; overflow: hidden;} #n_lianxi .left_box{ width: 47%; float: left; max-width: 509px; position: relative; z-index: 9;} #n_lianxi .right_box{ width: 50%; float: right;} #n_lianxi .txt{} #n_lianxi .tt{ margin-bottom: 3rem;} #n_lianxi .tt h3{ color: #131313; font-size: 3rem; margin-bottom: 1.25rem;} #n_lianxi .tt h3 font{ color:#b91b22;} #n_lianxi .tt h4{ font-size: 2.25rem; font-family: b_Bold;} #n_lianxi small{ display: inline-block; font-size:inherit; color: inherit;} #n_lianxi ul{ padding: 2rem 0;} #n_lianxi ul li{ font-size: 1rem; line-height: 3.25rem; position:relative; padding-left: 3rem;} #n_lianxi ul li font{ display: block; width: 2.125rem; height: 2.125rem; line-height: 2rem; border-radius: 50%; text-align: center; position: absolute; left: 0; top: .625rem;} #n_lianxi ul+ul{ border-top:1px solid #d9d9d9;} .j_form{ width:100%;} .j_form .form-group{ width:100%; overflow:hidden; margin-bottom:10px; position:relative; margin-left: 0; margin-right: 0; } .j_form .form-group>input{ height:50px; width:calc(100% - 8.75rem); float: left; padding:0 17px; font-size:14px; color:#373737; background:none; background:#fff; border:1px solid #e5e5e5;} .j_form .form-group .input_r{ height:50px; line-height:46px; width: calc(100% - 100px); padding-right:20px; float:left; font-size:14px; color:#999; } .j_form .form-group textarea{ background:#fff; border:1px solid #e5e5e5; width: 100%; float:right; height:140px; font-family:"微软雅黑"; line-height:26px; padding:15px 17px 15px 17px; font-size:14px; color:#373737; } .j_form .form-group .yzm{ position:absolute; right:0; top:10px; max-height:100%; height: 40px; background:none !important;} .j_form .form-group .yzm img{ max-width:100%; max-height:100%; mix-blend-mode: multiply;} .j_form .btn_tijiao{ display:block; width:100%; height:50px; font-size:1.125rem; font-weight: bold; text-align: center; background:#b91b22; color:#fff; border:0; outline: none; clear:both; transition:.5s; cursor:pointer; margin-top:0px;} .j_form .btn_tijiao:hover{background:#e9464d;} .j_form .span{ display:block; width:8.75rem; height:100%; float: left; background:#e3e5ea; line-height:50px; font-size:1rem; color:#373737; text-align:center;} #n_lianxi .j_form .form-group{ margin-bottom:1.375rem; } .form_box{ background: #fff; width: 100%; max-width: 598px; float: right; position: relative; padding: 4rem; box-shadow: 0 5px 15px rgba(0,0,0,.2); border-radius: 5px; z-index: 1;} .form_box:before{ content: ""; display: block; width: 237px; height: 439px; background: url(../images/form_bg.jpg) center no-repeat; position: absolute; left: -237px;bottom: -3rem; z-index: -1; mix-blend-mode: multiply;} .form_txt{ margin-bottom: 1.375rem;} .form_txt h3{ font-size: 1.625rem; color: #414141; font-weight: bold; margin-bottom: 1.5rem;} .form_txt h3 span{ text-transform: uppercase; color: #b91b22; margin-left: 10px;} .form_txt p{ font-size: .875rem; line-height: 1.5rem; color: #757575;} #n_shuzi{ width: 100%; height: 100vh; background: url(../images/n_shuzi_bg.jpg) center no-repeat; background-size: cover;} #n_shuzi .txt{ float:left; width: 30%; color: #fff;} #n_shuzi .txt .tt{} #n_shuzi .txt .tt h3{ font-size: 2.8125rem; font-weight: bold; font-family: "微软雅黑";} #n_shuzi .txt .tt i{ display: block; width: 5rem; height: 3px; background:#fff; margin-top: 1.625rem; margin-bottom: 2.5rem;} #n_shuzi .txt .tt h4{ font-size: 1.5rem; margin-bottom:2rem;} #n_shuzi .txt .con{ font-size: .9375rem; line-height: 1.875rem;} #n_shuzi ul{ width: 70%; float:right; text-align: center; font-size: 0; margin-top: -3.5rem; position: relative;} #n_shuzi ul:before{ content: ""; display: block; width: 848px; max-width: 100%; height: 621px; background: url(../images/ditu.png) center no-repeat; background-size: contain; position: absolute; top: -5rem; right: -3rem;} #n_shuzi ul li{width:50%; display: block; float: left; margin-top: 3.5rem; position: relative;} #n_shuzi ul li:nth-child(2):before,#n_shuzi ul li:nth-child(4):before{ content:""; display: block; width: 1px; height: 100%; background:rgba(255,255,255,.3); position: absolute; left: 20%; top: 0;} #n_shuzi ul li .box{ display: inline-block; text-align: center; float: right; min-width: 13rem;} #n_shuzi ul li h5{ font-size:1.125rem; color:#fff; margin-bottom: .5rem;} #n_shuzi ul li p{ color:#fff; margin-bottom: .5rem; font-size: nomal; } #n_shuzi ul li p span{ font-family:"Barlow Condensed"; font-size:6.25rem;} #n_shuzi ul li p i{ position:relative; top: -1.5rem; font-size: 3rem; margin-left: .5rem;} #n_shuzi ul li b{ font-size: 1rem; font-weight: normal; color: #fff;} .shuzi_box{ padding-top: 5rem;} #n_jieshao{ padding-bottom: 3rem;} #n_jieshao .tt{ text-align: center; margin-bottom: 2.75rem;} #n_jieshao .tt h3{ font-family: "SourceHanSansCN-Light"; font-size: 2.5rem; color: #000;} #n_jieshao .tt h3 span{ display: inline-block; position: relative; z-index: 1;} #n_jieshao .tt h3 i{ display: block; width: 2.4375rem; height: 2.4375rem; border-radius: 50%; border: .625rem solid #d16c6c38; position: absolute; right:30%; top: -1rem; z-index: -1;} #n_jieshao .tt p{ font-family: "SourceHanSansCN-Light"; font-size: 1.125rem; color: #b91b22; text-transform: uppercase; margin-top: 1rem; letter-spacing: 1px;} #n_jieshao .con{ text-align: left; max-width: 1120px; margin: 0 auto; text-indent:2em; margin-bottom: 2rem;} #n_licheng{ width: 100%; overflow: hidden; background: url(../images/licheng_bg.jpg) center no-repeat;padding-bottom: 2rem;} #n_licheng .tt{ text-align: center; font-weight: 400; margin-bottom: 3.5rem;} #n_licheng .tt span{font-size: 1rem;color: #d5b58c;display: block;margin-bottom: .5rem;margin-top: .5rem;} #n_licheng .tt h3{ font-size: 1.75rem; color: #ffffff;} #n_licheng .box{ background: rgba(0,0,0,.6);} #n_licheng ul{ position: relative; z-index: 1;} #n_licheng ul:before{ content: ""; display: block; width: 2000px; height: 1px; background: #d1d1d1; position: absolute; left: 50%; margin-left: -1000px; top: 3.25rem;} #n_licheng ul li{ padding: 0 1.875rem;} #n_licheng ul li h3{ font-family:"Century Gothic"; color: #9e8360; font-size: 1.875rem; font-weight: bold; margin-bottom: .75rem;} #n_licheng ul li i{ display: block; width: 15px; height: 15px; border-radius: 50%; background: #9e8360; background:rgba(254,142,60,.35) ; position: relative;} #n_licheng ul li i:before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #9e8360; transform: scale(.5); border-radius: 50%;} #n_licheng ul li .con{ margin-top: 1.25rem; font-size: .9375rem; line-height: 1.75rem; color: #ffffff;} #n_licheng .slick-arrow{ z-index:99; position:absolute; top:1.875rem; transform:translate(0,0); opacity:1; display:block; width: 2.75rem; height: 2.75rem; background-size:2.75rem !important;} #n_licheng .slick-prev{ left:-5.25rem;background:url(../images/licheng_left.png) left center no-repeat; transition:300ms;-webkit-transition:300ms;} #n_licheng .slick-next{ right:-5.25rem; background:url(../images/licheng_right.png) right center no-repeat; transition:300ms;-webkit-transition:300ms;} .slick-prev:before, .slick-next:before{ display:none;} #n_wenhua{ width: 100%; overflow: hidden; margin-top: 2rem; background: url(../images/saj_huoke.png) center no-repeat;} #n_wenhua .tt{ position: relative; margin-bottom: 0;} #n_wenhua .tt p{ font-size: 1.25rem; color: #e1ceb6; margin-bottom: .75rem;} #n_wenhua .tt h3{ font-size: 1.75rem; color: #fff;} #n_wenhua .box{ position:relative;} #n_wenhua .center{ text-align:center; position: relative; font-size: 0; width: 36rem; height: 36rem; margin: 0 auto;border-radius: 50%;} #n_wenhua .s_tt{ position: absolute; width: 100%; height: 100%; left: 0; top: 1rem; margin-bottom: 0;} #n_wenhua ul{} #n_wenhua ul li{ position: absolute;} #n_wenhua ul li font{ position: initial; /*display: block;*/ width: 4.6875rem; height: 4.6875rem; line-height: 4.6875rem; text-align: center; right: -6rem; top: -.875rem; /*background: #626262;*/ border-radius: 5%;} #n_wenhua ul li:hover font{ /*background: #9e8360;*/} #n_wenhua ul li .txt{ margin-top: 1rem; padding-right: 5px;} #n_wenhua ul li .txt h5{ font-size: 1.5rem; color: #9e8360; margin-bottom: .75rem;} #n_wenhua ul li .txt p{ font-size: .9375rem; color: #555; line-height: 1.5rem; height: 3rem;} #n_wenhua ul li.li_1{ text-align:right; right: 70%; top: 6.5rem;} #n_wenhua ul li.li_2{ text-align:left; left: 70%; top: 6.5rem;} #n_wenhua ul li.li_3{ text-align:right; right: 70%; bottom: 5rem; } #n_wenhua ul li.li_4{ text-align:left; left: 70%; bottom: 5rem;} #n_wenhua ul li.li_2 font{ left: -6rem;} #n_wenhua ul li.li_4 font{ left: -6rem;} #n_rongyu{ width: 100%; overflow: hidden; background: url(../images/s_map_bg.jpg) center no-repeat;} #n_rongyu .tt{ position: relative;} #n_rongyu .tt p{ font-size: 1.75rem; color: #fff; margin-bottom: .75rem;} #n_rongyu .tt h3{ font-size: 1.75rem; color: #fff;} #n_rongyu .box{ position:relative;} #n_rongyu .center{ text-align:center; position: relative; font-size: 0; width: 36rem; height: 36rem; margin: 0 auto;border-radius: 50%;} #n_rongyu .s_tt{ /*position: absolute;*/ width: 100%; height: 100%; left: 0; top: 1rem; margin-bottom: 0;} #n_rongyu ul{} #n_rongyu ul li{ position: absolute;} #n_rongyu ul li font{ position: absolute; display: block; width: 4.6875rem; height: 4.6875rem; line-height: 4.6875rem; text-align: center; right: -6rem; top: -.875rem; background: #626262; border-radius: 50%;} #n_rongyu ul li:hover font{ background: #9e8360;} #n_rongyu ul li .txt{} #n_rongyu ul li .txt h5{ font-size: 1.5rem; color: #343434; margin-bottom: .75rem;} #n_rongyu ul li .txt p{ font-size: .9375rem; color: #555; line-height: 1.5rem; height: 3rem;} #n_rongyu ul li.li_1{ text-align:right; right: 70%; top: 6.5rem;} #n_rongyu ul li.li_2{ text-align:left; left: 70%; top: 6.5rem;} #n_rongyu ul li.li_3{ text-align:right; right: 70%; bottom: 5rem; } #n_rongyu ul li.li_4{ text-align:left; left: 70%; bottom: 5rem;} #n_rongyu ul li.li_2 font{ left: -6rem;} #n_rongyu ul li.li_4 font{ left: -6rem;} .circle { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 50%; } .circle span { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 50%; background-color: #9e8360; -webkit-transform: scale(.6); -moz-transform: scale(.6); -ms-transform: scale(.6); transform: scale(.6); } .circle span:nth-of-type(2) { -webkit-transform: scale(.7); -moz-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); -webkit-animation: circleScale 3s linear infinite; -moz-animation: circleScale 3s linear infinite; -ms-animation: circleScale 3s linear infinite; animation: circleScale 3s linear infinite; } .circle span:nth-of-type(3) { -webkit-transform: scale(.9); -moz-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); border: 1px solid #dadada; background: none; animation-delay: 2s; -webkit-animation: circleScale1 3s linear infinite; -moz-animation: circleScale1 3s linear infinite; -ms-animation: circleScale1 3s linear infinite; animation: circleScale1 3s linear infinite; } @keyframes circleScale { 0% { opacity: .35; -webkit-transform: scale(.7); -moz-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); } 100% { opacity: 0; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } @keyframes circleScale1 { 0% { opacity: .35; -webkit-transform: scale(.9); -moz-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } 60% { opacity: .35; } 100% { opacity: 0; -webkit-transform: scale(1.3); -moz-transform: scale(1.3); -ms-transform: scale(1.3); transform: scale(1.3); } } #s_liucheng ul li:hover font img,#s_rukou ul li:hover .txt font img,#s_ys ul li:hover font img{ animation: jello 1s;} @-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) } } /*公司实力*/ #shili_bn{ height: 55rem;} #shili_bn .img{ width: 100%; height: 100%;} #shili_bn img{ max-width: 70%;} #sl_fangan{ font-size: 0; text-align: center; overflow: hidden; width: 100%; background: url(../images/saj_huoke.png) center top repeat; position: relative; z-index: 9;/*padding: 15.9rem 0;*/} #sl_fangan .tt{ text-align: center; margin-bottom: 3.25rem;} #sl_fangan .tt h3{ font-size: 3.125rem; color: #9e8360; font-weight: bold; font-family: "微软雅黑"; margin-bottom: 1rem;} #sl_fangan .tt span{ font-size: 1.125rem; color: #565656; font-family: arial; text-transform: uppercase;} #sl_fangan .bd{ max-width: 1360px; margin: 0 auto; background: url("../images/saj_baomingk.png") center top no-repeat;padding: 9rem 3.6rem; padding-top: 18rem; padding-bottom: 7rem;} #sl_fangan .left_box{ width:55%; display: inline-block; font-size: 1.625rem; vertical-align: top; padding: 0 .625rem; } #sl_fangan .left_box a{ display: block; width: 100%; height: 9.75rem; margin: 0; margin-bottom:1.375rem; text-align: center; background: #bf1a1a; color: #fff; border-radius: .5rem;} #sl_fangan .left_box a:nth-child(2){/*background: url(../images/anniu_bg.png) right bottom no-repeat;*/background-color: #9e8360;} .right_box .j_form { width: 90%; margin: auto; } .bmk_lbheight{height: 22.5rem;} @keyframes scale{ 0%, 100% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(.9); } } .scale { animation: scale 1s ease infinite; } /*手指动效*/ .shouzhi::after { content: ''; display: inline-block; width: 7rem; height: 7rem; background: url(../images/finger.png) no-repeat; background-size: 100% 100%; /* position: fixed;*/ /*top: 18rem; right: 1rem;*/ animation: scale 1s ease infinite; z-index: 99; top: -3rem; position: relative; right: -23rem; } #sl_fangan .right_box{ width: 45%; display: inline-block;vertical-align: top; padding: 0 .625rem;} #sl_fangan .j_form .form-group{ margin-bottom:.8125rem;} #sl_fangan .j_form .form-group>input{ width: 100%; height: 4.625rem; border-radius: 5px; border: 1px solid #ccc; font-size: 1.25rem; background-color: #fff;} #sl_fangan .j_form .btn_tijiao{ height: 4.625rem; background: #9e8360; font-weight: normal; border-radius: 5px; font-size: 1.375rem;} #sl_fangan .j_form .form-group .red{ position:absolute; color: #ff0000; font-size: 1.25rem; right: 2rem; top: 50%; margin-top: -.5rem;} #sl_fangan .j_form .form-group .city_xl{float: left; width: 31.5%; margin-right: 0.75rem;} #province{height: 3.735rem; font-size: 16px;} #city{height: 3.735rem; font-size: 16px;} #district{height: 3.735rem; font-size: 16px;} .sl_tt{ text-align: center; margin-bottom: 3.375rem;} .sl_tt .box{ display: inline-block; position: relative;} .sl_tt svg{ display: inline-block; margin-right: 1.5rem; margin-top: -1px; width: 6.75rem; height: auto;} .sl_tt h3{ font-size: 3.625rem; font-family: "微软雅黑"; line-height: 4.625rem; color:#fff; font-weight: bold;display: inline-block; vertical-align: top; padding-top: 4.5rem; margin-right: 3rem;} .sl_tt span{display: inline-block; width: 137px; text-align: left; position: absolute; right: -8rem; vertical-align: top; font-size: 1.375rem; text-transform: uppercase; font-family: arial; opacity: .4; color: #fff;/* Safari */ -webkit-transform: rotate(90deg); /* Firefox */ -moz-transform: rotate(90deg); /* IE */ -ms-transform: rotate(90deg); /* Opera */ -o-transform: rotate(90deg); transform-origin: left top; /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); white-space:nowrap; margin-top:5rem; margin-left: 2.5rem; } .sl_tt.black h3{ color: #030303;} .sl_tt.black span{ color: #c7c7c7;} #sl_baozhang{ width: 100%; overflow: hidden; background: url(../images/zt/sl_baozhang_bg.jpg) center top no-repeat; background-size: cover; margin-top: -6.875rem; padding-top: 9rem; position: relative;} #sl_baozhang:after{ content: ""; display: block; width: 100%; height: 6.875rem; position: absolute; left: 0; bottom: 0; background: url(../images/zt/sl_baozhang_bg.png) center no-repeat; } #sl_baozhang .sl_tt{ margin-top: -3rem;} #sl_baozhang .sl_tt .box:before{ content: ""; display: block; width: 10.8125rem; height: 14rem; background: url(../images/zt/deng.png) center no-repeat; background-size: contain; position: absolute; right: -13rem; top: 0;} #sl_baozhang ul{ margin: 0 -1.625rem;} #sl_baozhang ul li{ width: 20%; float: left; padding: 0 1.625rem; } #sl_baozhang ul li .box{ background: #fff; border-radius: 8rem; overflow: hidden; max-width: 245px; margin: 0 auto;} #sl_baozhang ul li .img{ margin: 7px; overflow: hidden; border-radius: 50%;} #sl_baozhang ul li .img img{ transition: 1s;} #sl_baozhang ul li:hover .img img{ transform: scale(1.1) rotate(.1deg);} #sl_baozhang ul li .txt{ text-align: center; padding-top: 2.375rem; padding-bottom: 4.5rem;} #sl_baozhang ul li .txt font{ display: block; width: 3rem; height: 3rem; text-align: center; margin: 0 auto;} #sl_baozhang ul li:hover .txt font img{ animation: jello 1s;} #sl_baozhang ul li .txt h5{ font-size: 1.75rem; color: #454545; margin-bottom: 1.25rem;font-family: "Microsoft YaHei"; margin-top: 1rem;} #sl_baozhang ul li .txt p{ font-size: 1rem; line-height: 1.75rem; color: #454545; height: 5.25rem;} #sl_baozhang .page__btn{ margin-bottom: 6.875rem;} .page__btn{ display:block; text-align:center; width:23.125rem; height:4.6875rem; line-height:4.6875rem; border-radius:3px; margin:0 auto; color:#fff; font-size: 1.5rem; margin-top: 3rem; box-shadow: 1px 3px 7px 0px rgba( 0, 0, 0, .2);} .page__btn img{ margin-right: .75rem; max-width:2.125rem; max-height: 1.875rem; } .page__btn { background: -moz-linear-gradient(left, #af9472 0%, #8a6d3b 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#af9472), color-stop(100%,#8a6d3b)); background: -webkit-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -o-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -ms-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: linear-gradient(to right, #af9472 0%,#8a6d3b 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af9472', endColorstr='#8a6d3b',GradientType=0 ); -webkit-transition: all .5s ease-in-out 0s; transition: all .5s ease-in-out 0s; overflow: hidden; position: relative; text-transform: capitalize; z-index: 1; } .page__btn span { position: absolute; display: block; width: 0; height: 0; border-radius: 50%; background-color: #565656; opacity: .5; mix-blend-mode: multiply; -webkit-transition: width .5s ease-in-out,height .5s ease-in-out; transition: width .5s ease-in-out,height .5s ease-in-out; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: -1; } .page__btn:hover{ color:#fff !important; } .page__btn:hover span { width: 900px; height: 900px } /*手风琴效果*/ .sfq_pic{ max-width: 1700px; height: 100%; margin: 0 auto; /* padding: 0 6.1rem;*/ display: block; position: relative; overflow: hidden;/*隐藏溢出*/ padding-top: 70px; padding-bottom: 70px; } .sfq_pic ul li{ float: left; height: 400px; width: 90px; } .sfq_pic ul .pic1{ background-image: url(../images/a1.png) ; background-position: center center; /*图片居中 等比例*/ background-repeat: no-repeat; /*图片不平铺*/ width: 600px; } .sfq_pic ul .pic2{ background-image: url(../images/a2.png) ; background-position: center center; background-repeat: no-repeat; } .sfq_pic ul .pic3{ background-image: url(../images/a3.png) ; background-position: center center; background-repeat: no-repeat; } .sfq_pic ul .pic4{ background-image: url(../images/a4.png) ; background-position: center center; background-repeat: no-repeat; } .sfq_pic ul .pic5{ background-image: url(../images/a5.png) ; background-position: center center; background-repeat: no-repeat; } .sfq_pic ul .pic6{ background-image: url(../images/a6.png) ; background-position: center center; background-repeat: no-repeat; } .sfq_pic ul .pic7{ background-image: url(../images/a7.png) ; background-position: center center; background-repeat: no-repeat; } .sfq_pic .txt{ float: left; background: #F6F8FA; height: 400px; width: 90px; } .sfq_pic .txt p{ /*float: left;*/ color: #fff; } .sfq_pic .txt #sfq_p{ writing-mode: vertical-lr; writing-mode: tb-lr; font-size: 20px; -webkit-writing-mode: tb-lr; -ms-writing-mode: tb-lr; color: #333; position: relative; margin: auto; top: 35%; margin-left: 40%; } .sfq_pic ul .sfqhover a { display: block; height: 400px; } .sfq_pic ul .pic1 .txt{ background: #DEE0E2; } .sfq_pic ul .pic3 .txt{ background: #DEE0E2; } .sfq_pic ul .pic5 .txt{ background: #DEE0E2; } .sfq_pic ul .pic7 .txt{ background: #DEE0E2; } .sfq_pic ul .sfqhover:hover .txt { background: #9e8360; } .sfq_pic ul .sfqhover:hover #sfq_p { color: #fff; } /*手风琴效果*/ #sl_factory { width: 100%; position: relative; z-index: 99;} #sl_factory .sl_tt{ margin-top: -6.9375rem;} #sl_factory ul{ overflow: hidden;} #sl_factory ul li{ padding: 0.4375rem;} #sl_factory ul li a{ display: block; position: relative;} #sl_factory ul li .pic{ position:relative; text-align:center; background:#fcfcfc; overflow: hidden;} #sl_factory ul li .pic img{ width: 100%; height: 100%; transition: 1s;} #sl_factory ul li .time{ position:absolute; width:58px; height:58px; border-radius:50%; z-index:99; background:#ff6900; color:#fff; bottom:30px; right:30px; padding-top:6px; font-weight:bold; text-align:center; font-family:arial; font-size:26px;} #sl_factory ul li .time span{ display:block; font-size:12px; text-transform:uppercase; margin-top:-3px; font-weight:normal;} #sl_factory ul li h4{ height:45px; line-height:45px; text-align:center; background:#e3e4e6; font-size:16px; color:#3b3b3b;} #sl_factory ul li .txt{ position:absolute; left:0; top:0; width:100%; height:100%; color:#fff; background: rgba(0,0,0,.3); padding:1rem; text-align:center; z-index:1;} #sl_factory ul li .txt h5{ font-size:1.25rem; margin:0 auto; white-space: normal; } #sl_factory ul li .txt .btn_zt{ display:block; width:8.75rem; height:0; line-height: 2.375rem; border: 1px solid #fff; border: 1px solid rgba(255,255,255,.6); border-radius: 1.25rem; margin:0 auto; font-size: .875rem; margin-top:0; opacity: 0;visibility: hidden; transition: .5s; overflow: hidden;} #sl_factory ul li .txt:before{ content:""; display: block; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: -1;} #sl_factory ul li a .txt:before{ opacity:0; visibility: hidden;} #sl_factory ul li a:hover .txt:before{ opacity:1; visibility:visible;} #sl_factory ul li .txt:before{-webkit-transform-origin: top; -moz-transform-origin: right; -ms-transform-origin: right; -o-transform-origin: right; transform-origin: right; -webkit-transform: perspective(600px) rotateY(-90deg); -moz-transform: perspective(600px) rotateY(-90deg); -ms-transform: perspective(600px) rotateY(-90deg); -o-transform: perspective(600px) rotateY(-90deg); transform: perspective(600px) rotateY(-90deg); -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; transition: all 0.6s; background: -moz-linear-gradient(left, #af9472 0%, #8a6d3b 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#af9472), color-stop(100%,#8a6d3b)); background: -webkit-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -o-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -ms-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: linear-gradient(to right, #af9472 0%,#8a6d3b 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af9472', endColorstr='#8a6d3b',GradientType=0 ); } #sl_factory ul li a:hover .txt:before{ -webkit-transform: perspective(600px) rotateY(0deg); -moz-transform: perspective(600px) rotateY(0deg); -ms-transform: perspective(600px) rotateY(0deg); -o-transform: perspective(600px) rotateY(0deg); transform: perspective(600px) rotateY(0deg);} #sl_factory ul.ul_1{ width: 66.7%; float: left;} #sl_factory ul.ul_1 li{ width: 50%; float: left;} #sl_factory ul.ul_1 li.li_3{ width: 100%;} #sl_factory ul.ul_2{ width: 33.3%; float: right;} #sl_factory ul li a:hover .txt .btn_zt{ opacity: 1; margin-top:2rem; height:2.5rem; visibility:visible; } #sl_factory ul li a:hover .pic img{ transform: scale(1.02) rotate(.1deg);} #sl_liucheng{ text-align: center; width: 100%; overflow: hidden; background: url(../images/zt/sl_liucheng_bg.jpg) center top no-repeat;} #sl_liucheng .bg{ background: url(../images/zt/sl_liucheng_bg2.jpg) center no-repeat;} #sl_liucheng ul{ font-size: 0; margin: 0 3rem; margin-top: -8rem; position: relative;} #sl_liucheng .tuoyuan{ position: relative; display: flex; margin: 0 3.5rem; margin-bottom: 8rem;} #sl_liucheng .tuoyuan:before{ content: ""; display: block; border-radius: 15rem; border: 1px solid #ddd; position: absolute; top: 4.5rem; bottom: 4.5rem; left: 0; right: 0;} #sl_liucheng .tuoyuan:after{content: ""; display: block; width: 0; height: 0; border:.5rem solid transparent;border-bottom:.625rem solid transparent; border-top:.625rem solid #b7b7ba; position: absolute; top: 50%; margin-top: -.5rem; right: -.5rem;} #sl_liucheng ul li{ width: 20%; display: inline-block; margin-top: 8rem; position: relative;} #sl_liucheng ul li .box{ text-align: center;} #sl_liucheng ul li font{ display: block; width: 9rem; height: 9rem; line-height: 9rem; background: #af9472; border-radius: 50%; margin: 0 auto; position: relative; z-index: 1;} #sl_liucheng ul li font img{ max-width: 45%; max-height: 45%;} #sl_liucheng ul li font:before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #9e8360; z-index: -1; border-radius: 50%; opacity: 0; transition: .7s; transform: scale(0);} #sl_liucheng ul li:after{ content: ""; display: block; width: 0; height: 0; border:.625rem solid transparent; border-left:.625rem solid #b7b7ba; position: absolute; right: 0; top:50%; margin-top: -.625rem; margin-right: -1rem;} #sl_liucheng ul li:nth-child(7):after,#sl_liucheng ul li:nth-child(8):after,#sl_liucheng ul li:nth-child(9):after,#sl_liucheng ul li:nth-child(6):after{ border:.625rem solid transparent; border-right:.625rem solid #b7b7ba; left: 0; margin-left: -1rem; } #sl_liucheng ul li:nth-child(5):after,#sl_liucheng ul li:nth-child(10):after{ display: none;} #sl_liucheng ul li:nth-child(6),#sl_liucheng ul li:nth-child(7),#sl_liucheng ul li:nth-child(8),#sl_liucheng ul li:nth-child(9),#sl_liucheng ul li:nth-child(10){ float: right;} #sl_liucheng ul li font img{} #sl_liucheng ul li b{font-size: 1.625rem; display: block; color: #9e8360; font-family: impact; font-weight: normal; margin-top: 1rem; position: absolute; width: 100%;} #sl_liucheng ul li p{font-size: 1.1875rem; position: absolute; width: 100%; margin-top: 3.5rem;} #sl_liucheng ul li .box:hover{ cursor: pointer;} #sl_liucheng ul li .box:hover font:before{ opacity:1; transform: scale(1);} #sl_liucheng ul li .box:hover font img{ animation: jello 1s;} #sl_liucheng .page__btn { background: -moz-linear-gradient(left, #af9472 0%, #8a6d3b 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#af9472), color-stop(100%,#8a6d3b)); background: -webkit-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -o-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -ms-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: linear-gradient(to right, #af9472 0%,#8a6d3b 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af9472', endColorstr='#8a6d3b',GradientType=0 );} #sl_liucheng .page__btn span { background-color: #d5a05c;} #sl_kehu{ width: 100%; overflow: hidden; background: url(../images/n_kehu_txt.jpg) center repeat;} #sl_kehu #s_kehu .he_3DY .txt{ /*background: #9e8360;*/} #sl_fuwu{ font-size: 0; text-align: center; overflow: hidden; width: 100%; background: url(../images/zt/sl_fuwu_bg.jpg) center bottom no-repeat; background-size: cover !important; position: relative; z-index: 9; background-attachment: fixed !important; } #sl_fuwu .tt{ text-align: center; margin-bottom: 3.25rem; padding-top: 2.5rem;} #sl_fuwu .tt h3{ font-size: 3.125rem; color: #fff; font-weight: bold; font-family: "微软雅黑"; margin-bottom: 1rem;} #sl_fuwu .tt span{ font-size: 1.125rem; color: #fff; opacity: .5; font-family: arial; text-transform: uppercase;} #sl_fuwu .bd{ background: #ecebf0; padding-left: 2rem; padding-right: 2rem; padding-bottom: 3rem; overflow: hidden; margin-bottom: 2.5rem;} #sl_fuwu .right_box{ width: 58%; display: inline-block; font-size: 1.625rem; vertical-align: top; padding: 0 3.5rem;} #sl_fuwu .right_box ul{ margin: -.4375rem;} #sl_fuwu .right_box li{ display: block; width: 33.333%; float: left; padding: .4375rem; } #sl_fuwu .right_box li a{ display: block; height:11.875rem;text-align: center; background: #298292; color: #fff; border-radius: .5rem; position: relative; z-index: 1; background: -moz-linear-gradient(left, #af9472 0%, #8a6d3b 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#af9472), color-stop(100%,#8a6d3b)); background: -webkit-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -o-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: -ms-linear-gradient(left, #af9472 0%,#8a6d3b 100%); background: linear-gradient(to right, #af9472 0%,#8a6d3b 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af9472', endColorstr='#8a6d3b',GradientType=0 ); } #sl_fuwu .right_box li a:before{content:""; display: block; position: absolute; width: 0; height: 100%; right: 0; top: 0; z-index: -1; background-color: #e5cdaf;mix-blend-mode: multiply; transition: .7s; opacity: 0;} #sl_fuwu .right_box li a:hover:before{ opacity: .5; width: 100%; left: 0; right: auto;} #sl_fuwu .right_box li:nth-child(1),#sl_fuwu .right_box li:nth-child(2){ width:50%;} #sl_fuwu .right_box li font{ display: block; margin: 0 auto; margin-bottom: 1rem; width: 3.3125rem; height: 3.3125rem;} #sl_fuwu .right_box li a:hover font img{ animation: jello 1s;} #sl_fuwu .right_box li p{ font-size: 1.25rem;} #sl_fuwu .left_box{ width: 41.9%; display: inline-block;vertical-align: top; padding: 0 3.5rem; border-right: 1px solid #d2d2d5;} #sl_fuwu .left_box .f_tt{ font-size: 1.625rem; font-family: "Microsoft YaHei"; text-align: left; margin-bottom: 1.5rem; margin-top: .25rem; } #sl_fuwu .left_box .f_tt span{ font-size: 1.125rem; color: #9e8360;} #sl_fuwu .j_form .form-group{ margin-bottom:.8125rem; } #sl_fuwu .j_form .form-group>input{ width: 100%; height: 4.625rem; border-radius: 5px; border: 2px solid #d5d7d8; font-size: 1.25rem; background: none;} #sl_fuwu .j_form .btn_tijiao{ height: 4.625rem; background: #9e8360; font-weight: normal; border-radius: 5px; font-size: 1.375rem;} #sl_fuwu .j_form .form-group .red{ position:absolute; color: #ff0000; font-size: 1.25rem; right: 2rem; top: 50%; margin-top: -.5rem;} #n_case{ overflow: hidden;} @media (max-width: 1440px) { #sl_factory ul li{ padding: .375rem;} #sl_baozhang ul{ margin: 0 -.5rem;} #sl_baozhang ul li{ width: 20%; float: left; padding: 0 .5rem; } } @media (max-width: 1200px) { #sl_liucheng ul li font{ width: 8rem; height: 8rem; line-height: 8rem;} #sl_liucheng .tuoyuan:before{ top:4rem; bottom: 4rem;} } @media (max-width: 992px) { #sl_fuwu .left_box{ margin-bottom: 3rem; border: 0;} #sl_fuwu .left_box,#sl_fuwu .right_box{width: 100%; float: none;} #sl_fuwu .right_box{margin-bottom: 1rem;} #sl_liucheng .m{ padding: 0;} #sl_liucheng .tuoyuan{ margin-left:1rem; margin-right: 1rem;} #sl_liucheng ul{ margin-left:0rem; margin-right: 0rem; width: 100%;} #sl_liucheng ul li{ width:20%; float: left !important; } #sl_liucheng .tuoyuan:before{ display: none;} #sl_liucheng .tuoyuan:after{ display: none;} #sl_liucheng ul li:after{ display: none;} /* #sl_liucheng ul li:nth-child(4),#sl_liucheng ul li:nth-child(5),#sl_liucheng ul li:nth-child(6),#sl_liucheng ul li:nth-child(10){ float: right !important;} #sl_liucheng ul li:after{display: block !important; border:.625rem solid transparent !important; border-left:.625rem solid #b7b7ba !important; left: auto !important; margin-left: auto !important; right: 0 !important; margin-right: -1rem !important;} #sl_liucheng ul li:nth-child(4):after,#sl_liucheng ul li:nth-child(5):after,#sl_liucheng ul li:nth-child(6):after,#sl_liucheng ul li:nth-child(10):after{ border:.625rem solid transparent !important; border-right:.625rem solid #b7b7ba !important; left: 0 !important; margin-left: -1rem !important; right: auto !important; margin-right: auto !important; } #sl_liucheng ul li:nth-child(10):after{ display: none !important;} #sl_liucheng .tuoyuan:before{ display: none;} #sl_liucheng .tuoyuan:after{ display: none;}*/ } @media (max-width: 767px) { #shili_bn{ height: 35rem;} .sl_tt{ margin-bottom: 2.5rem;} .sl_tt svg{ width: 4.5rem; margin-right: .5rem;} .sl_tt h3{ font-size: 2.5rem; line-height: 3rem; padding-top: 2.5rem;} .sl_tt span{ display: none;} #sl_factory .sl_tt .box:before{ width: 10rem; height: 11.5rem;right: -6rem;} #sl_liucheng .sl_tt .box:before{ width: 7rem; height: 10rem;right: -4rem;} #sl_liucheng ul li font{ width: 4rem; height: 4rem; line-height: 4rem;} #sl_factory ul.ul_1{ width: 100%; float: none;} #sl_factory ul.ul_2{ width: 100%; float: none;} #n_case.sl ul li:nth-child(9){ display: none;} #sl_liucheng{ background-size: auto 30rem;} #sl_baozhang .page__btn{ margin-bottom: 8rem;} #sl_fuwu .tt,#sl_fangan .tt{ margin-bottom: 2.5rem;} #sl_fuwu .tt h3,#sl_fangan .tt h3{ font-size: 2.25rem;} #sl_fuwu .left_box,#sl_fuwu .right_box{ padding: 0;} .page__btn{ width: 18rem;} #sl_fuwu .right_box li font{ width:2.5rem; height: 2.5rem;} #sl_baozhang ul li .txt font{ width:2.5rem; height: 2.5rem;} #sl_baozhang ul li .txt{ padding-top: 1rem; padding-bottom: 2.5rem;} } .slick-arrow.slick-hidden{ display: none !important;} /*专题二 专业设计*/ .zy_tt{ text-align: center; margin-bottom: 3.125rem;} .zy_tt h4{ font-size: 1.25rem; text-transform: uppercase; font-family: Roboto-Light; color: #d5d5d5; margin-top: 1rem;} .zy_tt h3{ display: inline-block; position: relative;} .zy_tt h3 span{ font-size: .875rem; color: #000; font-family:"Times New Roman", "serif"; text-transform: uppercase; letter-spacing: 2.125rem; padding-left: 2.25rem; } .zy_tt h3 b{ color: #fff; font-weight: bold; font-family: "微软雅黑";margin: 0px; line-height: 40px; text-align: center; font-size: 2.1875rem; font-weight: bold;} .zy_tt h3 span.span01{ letter-spacing: 3rem; padding-left: 3rem; letter-spacing: 3rem;} .zy_tt.white h4{ font-size: 1rem;color: #8f8f8f;} .zy_tt.white h3 span{ color: #fff;} .zy_tt.white h3 b{ color: #fff;} #zy_fuwu{ width: 100%; overflow: hidden; background: url(../images/zt/zy_fuwu_bg.jpg) center no-repeat; background-size: cover;} #zy_fuwu ul{ overflow: hidden;} #zy_fuwu ul li{ width:37.45%;float: left; position: relative;} #zy_fuwu ul li:first-child{width:62.55%; } #zy_fuwu ul li .txt{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; padding-left: 3.75rem; padding-top: 6rem; color: #fff;} #zy_fuwu ul li .txt span{font-family:"Times New Roman", "serif"; text-transform: uppercase; font-size: 1.5rem; line-height: 2rem;} #zy_fuwu ul li .txt h4{ font-size: 1.4rem; color: #fff; line-height: 2rem;} #zy_fuwu ul li .img img{ transition: 1s;} #zy_fuwu ul li:hover .img img{ transform: scale(1.03) rotate(.1deg);} .zy_btn{ display: block; width: 12.5rem; height: 3.125rem; line-height: 3rem; text-align: center; border-radius: 1.625rem; border: 1px solid #fff; color: #fff; margin: 0; margin-top: 2.5rem; background: none; font-size: 1rem; letter-spacing: 1px; transition: .5s;} .zy_btn span{ background: #bf4634; opacity: 1;} .zy_btn:hover{ border:1px solid #bf4634;} .zy_btn:hover span{ width: 500px; height: 500px;} #s_team.zy_team{ background: url(../images/zt/zy_team_bg.jpg) top repeat-x; padding-bottom: 22.25rem; background-size: cover !important;} #s_team.zy_team .team01 .txt .more_btn{ background: #21658f;} #s_team.zy_team .team02 li .txt{ background: #21658f; background: rgba(33,101,143,.9);} .btn_zy.page__btn { background: -moz-linear-gradient(top, #164c74 0%, #246c96 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#164c74), color-stop(100%,#246c96)); background: -webkit-linear-gradient(top, #bf1a1a 0%,#bf1a1a 100%); background: -o-linear-gradient(top, #164c74 0%,#246c96 100%); background: -ms-linear-gradient(top, #164c74 0%,#246c96 100%); background: linear-gradient(to bottom, #bf1a1a 0%,#bf1a1a 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#164c74', endColorstr='#246c96',GradientType=0 );} #zy_style{/* margin-top: -17rem;*/ background-color: #161616;padding: 6rem 0;} #zy_style .hd{ margin-bottom: 11px;} #zy_style .hd ul{ margin: 0 -6px;} #zy_style .hd ul li{ padding: 0 6px; padding-bottom: 11px !important;} #zy_style .hd ul li .box{ text-align: center; background: #f6f6f6; padding: 1.5rem 0; position:relative; z-index: 1; transition: .5s; cursor: pointer;} #zy_style .hd ul li font{ display: block; width: 3.375rem; height: 3.375rem; margin: 0 auto; transition: 1s;} #zy_style .hd ul li font img{} #zy_style .hd ul li font img.img02{ display: none;} #zy_style .hd ul li h5{ margin-top: 1.25rem; margin-bottom: .5rem; font-size: 1.25rem; color: #303030; font-family: "Microsoft YaHei"; transition: .5s;} #zy_style .hd ul li span{ font-size: .875rem; color: #7f7f7f; font-family:"Times New Roman", "serif"; text-transform: uppercase; transition: .5s;} #zy_style .hd ul li .box:before { content: ""; position: absolute; bottom: 10px; right: 50%; margin-right:-20px; height: 40px; width: 40px; background-color: #f6f6f6; z-index: -1; transition: .5s; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); } #zy_style .hd ul li.slick-current .box{ background: #bf1a1a;} #zy_style .hd ul li.slick-current .box:before{ bottom: -3px; background: #bf1a1a;} #zy_style .hd ul li.slick-current font{ transform: rotateY(180deg);} #zy_style .hd ul li.slick-current font img.img01{ display: none;} #zy_style .hd ul li.slick-current font img.img02{ display: block;} #zy_style .hd ul li.slick-current h5{ color: #fff;} #zy_style .hd ul li.slick-current span{ color: #fff;} #zy_style .bd{} #zy_style .bd .img{} #zy_style .bd .img img{ /*height: 696px;*/aspect-ratio: 1498/566;} #n_case.zhuanye ul li:hover .txt h5{ color: #e73a2d;} .shili_tel{ text-align: center; margin-top: 3.125rem;} .shili_tel .box { display: inline-block; line-height: 4.1875rem; border: 2px solid #e73a2d; padding: 0 3.5rem;} .shili_tel .box span{ font-size: 1.375rem; color: #494949;} .shili_tel .box p{ display: inline-block; font-size: 1.75rem; color: #e73a2d; font-family: impact;} .zhuanye#sl_fuwu{ background: url(../images/zt/zy_fuwu_bg2.jpg) center bottom no-repeat; background-size: cover;} .zhuanye #sl_fuwu .j_form .btn_tijiao{ background: -moz-linear-gradient(top, #164c74 0%, #246c96 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#164c74), color-stop(100%,#246c96)); background: -webkit-linear-gradient(top, #164c74 0%,#246c96 100%); background: -o-linear-gradient(top, #164c74 0%,#246c96 100%); background: -ms-linear-gradient(top, #164c74 0%,#246c96 100%); background: linear-gradient(to bottom, #164c74 0%,#246c96 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#164c74', endColorstr='#246c96',GradientType=0 );} .zhuanye #sl_fuwu .right_box li a{ background: -moz-linear-gradient(top, #a62217 0%, #be4433 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#a62217), color-stop(100%,#be4433)); background: -webkit-linear-gradient(top, #a62217 0%,#be4433 100%); background: -o-linear-gradient(top, #a62217 0%,#be4433 100%); background: -ms-linear-gradient(top, #a62217 0%,#be4433 100%); background: linear-gradient(to bottom, #a62217 0%,#be4433 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a62217', endColorstr='#be4433',GradientType=0 );} .zhuanye #sl_fuwu .right_box li a:before{ background-color: #1c5a83;} #zy_shuju{ width: 100%; overflow: hidden; background: url(../images/zt/zy_shuju_bg.png) center bottom no-repeat; padding-bottom: 28rem; background-size: cover; position: relative; z-index: 9;} #zy_shuju .box2{ display:flex; justify-content:space-around;} #zy_shuju li{ width: 33.333%; float:left; position:relative; text-align: center;} #zy_shuju .box2 li .box{ display: inline-block; position: relative; text-align: center;} #zy_shuju .box2 li[aos=fade-right]{-webkit-transform:translate(-200px,0) rotate(-90deg);-ms-transform:translate(-200px,0) rotate(-90deg);transform:translate(-200px,0) rotate(-90deg);} #zy_shuju .box2 li[aos=fade-right].aos-animate{-webkit-transform:translate(0,0) rotate(0);-ms-transform:translate(0,0) rotate(0);transform:translate(0,0) rotate(0);} #zy_shuju .circleChart_text{ color:#fff; position:absolute; left:0; top:0; width:100%; height:100%; text-align:center; } #zy_shuju .circleChart_text span{ font-size:4.875rem; font-family: "Times New Roman", "serif"; font-weight: bold;} #zy_shuju .circleChart_text font{ font-size:4.875rem;} #zy_shuju .circleChart_text p{ font-size: 1.25rem; margin-top: .75rem; margin-bottom: 2rem;} #zy_shuju .box2 li .ico{ display:block; width:2.25rem; height: 2.125rem; margin: 0 auto;} .circleChart{ height:100%;} .zy_light{ position: relative; z-index: 99;} .zy_light ul{ position: absolute; width: 100%; left: 0; top: 0;} .zy_light01{ margin-top: -5rem;} #zy_shuju .zy_tt{ padding-top: 6.5rem;} #zy_ys{ width: 100%; overflow: hidden;padding-top: 19rem; margin-top: -12rem; background: -moz-linear-gradient(top, #164c74 0%, #246c96 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#164c74), color-stop(100%,#246c96)); background: -webkit-linear-gradient(top, #164c74 0%,#246c96 100%); background: -o-linear-gradient(top, #164c74 0%,#246c96 100%); background: -ms-linear-gradient(top, #164c74 0%,#246c96 100%); background: linear-gradient(to bottom, #164c74 0%,#246c96 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#164c74', endColorstr='#246c96',GradientType=0 );} #zy_ys ul{ margin: 0 -.8rem;} #zy_ys ul li{ padding: 0 .5rem;} #zy_ys ul li .box{} #zy_ys ul li .box .img{ border-radius: 0 2.5rem 0 0; position: relative; z-index: 1;} #zy_ys ul li .box .img img{ transition: .5s; position: relative;} #zy_ys ul li .box:hover .img img{ transform: scale(1.05) rotate(.1deg); } #zy_ys ul li .box .img:before{ content: ""; width: 100%; height: 1.75rem; background: url(../images/zt/zy_ys_txt.png) center no-repeat; background-size: 100% 100%; position: absolute; left:0; bottom: 0; z-index: 9;} #zy_ys ul li .box .img img{} #zy_ys ul li .txt{ text-align: center; padding: 0 5px; padding-bottom: 4rem; padding-top: 2rem; position: relative; z-index: 9; background: #fff;} #zy_ys ul li .txt font{ display: block; width: 4.6875rem; height: 4.6875rem; line-height: 4.6875rem; text-align: center; border-radius: 50%; position: absolute; top: -4rem; right: 2rem; background: -moz-linear-gradient(top, #a62217 0%, #be4433 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#a62217), color-stop(100%,#be4433)); background: -webkit-linear-gradient(top, #a62217 0%,#be4433 100%); background: -o-linear-gradient(top, #a62217 0%,#be4433 100%); background: -ms-linear-gradient(top, #a62217 0%,#be4433 100%); background: linear-gradient(to bottom, #a62217 0%,#be4433 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a62217', endColorstr='#be4433',GradientType=0 );} #zy_ys ul li .txt font img{ display: inline-block;} #zy_ys ul li .txt h5{ font-size: 1.625rem; color: #3a3a3a;font-family: "Microsoft YaHei"; } #zy_ys ul li .txt p{ font-size: 1rem; color: #666666; margin-top: .875rem; margin-bottom: .25rem; line-height: 1.5rem; height: 3rem;} #zy_ys ul li .txt a{ display: block; width: 8.125rem; height: 2.5rem; line-height: 2.5rem; text-align: center; border-radius: 1.25rem; color: #fff; margin: 0 auto; background: none; font-size: 1rem; letter-spacing: 1px; transition: .5s; background: -moz-linear-gradient(top, #a62217 0%, #be4433 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#a62217), color-stop(100%,#be4433)); background: -webkit-linear-gradient(top, #a62217 0%,#be4433 100%); background: -o-linear-gradient(top, #a62217 0%,#be4433 100%); background: -ms-linear-gradient(top, #a62217 0%,#be4433 100%); background: linear-gradient(to bottom, #a62217 0%,#be4433 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a62217', endColorstr='#be4433',GradientType=0 );} #zy_ys ul li .txt a span{ background: #d05340; opacity: 1;} #zy_ys ul li .txt a:hover{ } #zy_ys ul li .txt a:hover span{ width: 500px; height: 500px;} #sl_kehu.zhuanye{ background: url(../images/zt/zy_kehu_bg.jpg) center no-repeat; background-size: cover;} #sl_kehu.zhuanye #s_kehu .he_3DY .txt{ background: -moz-linear-gradient(top, #a62217 0%, #be4433 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#a62217), color-stop(100%,#be4433)); background: -webkit-linear-gradient(top, #a62217 0%,#be4433 100%); background: -o-linear-gradient(top, #a62217 0%,#be4433 100%); background: -ms-linear-gradient(top, #a62217 0%,#be4433 100%); background: linear-gradient(to bottom, #a62217 0%,#be4433 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a62217', endColorstr='#be4433',GradientType=0 );} /*专题三 专业设计*/ #shili_bn.ys img{ max-width: 86%;} .ys_tt{ text-align: center; margin-bottom: 5rem;} .ys_tt span{ font-size: 1.25rem; text-transform: uppercase; font-family: Roboto-Light; color: #3e969f;} .ys_tt h3{ font-size:2.75rem; color: #424843; font-weight: bold; font-family: "微软雅黑"; margin-bottom: 1.25rem;} .ys_tt p{ display: inline-block; font-size: 1.25rem; color: #fff; background: #58b9c3; border-radius: 2rem; line-height: 3.125rem; padding: 0 2.5rem;} .ys_tt.white span{ color: #fff;} .ys_tt.white h3{ color: #fff;} .ys_tt.white p{ color: #363636; background: -moz-linear-gradient(left, #cfd1d5 0%, #eff0ef 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#cfd1d5), color-stop(100%,#eff0ef)); background: -webkit-linear-gradient(left, #cfd1d5 0%,#eff0ef 100%); background: -o-linear-gradient(left, #cfd1d5 0%,#eff0ef 100%); background: -ms-linear-gradient(left, #cfd1d5 0%,#eff0ef 100%); background: linear-gradient(to right, #cfd1d5 0%,#eff0ef 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfd1d5', endColorstr='#eff0ef',GradientType=0 );} #ys_nanti{ width: 100%; overflow: hidden; background: url(../images/zt/ys_nanti_bg.png) bottom center no-repeat; background-size: cover; padding-bottom: 20rem; position: relative; z-index: 9;} #ys_nanti ul{ } #ys_nanti ul li{ position: relative;} #ys_nanti ul li .box{} #ys_nanti ul li .img{ max-width:15rem; margin: 0 auto;} #ys_nanti ul li .img img{} #ys_nanti ul li i{ display: block; width: 100%; height: 4px; background: #58b9c3; margin-top: 2.25rem; margin-bottom:1.75rem; position: relative;} #ys_nanti ul li i:before{ content: ""; display: block; width: 0; height: 0; border: 10px solid #58b9c3; border-bottom: 10px solid #58b9c3; position: absolute; left: 50%; margin-left: -8px; top: -8px; border-radius: 5rem;} #ys_nanti ul li p{ font-size: 1.375rem; text-align: center; font-family: "Microsoft YaHei"; } .btn_ys.page__btn { background: -moz-linear-gradient(top, #46a1ab 0%, #58b9c3 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#46a1ab), color-stop(100%,#58b9c3)); background: -webkit-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -o-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -ms-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: linear-gradient(to bottom, #46a1ab 0%,#58b9c3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46a1ab', endColorstr='#58b9c3',GradientType=0 );} #ys_nanti .deng{ display: inline-block; position: absolute; top: -5rem; width: 6.4375rem; right: 50%; margin-right: -32rem;} #ys_youshi{ background: #58b9c3;position: relative; z-index: 0;} #ys_youshi .m{ margin-top: -41rem; padding-top: 30rem; } #ys_youshi .deng{ display: inline-block; position: absolute; width: 12.5625rem; top: 9rem; right: 6rem; } #ys_youshi .tt{ float: right; height: 3.125rem; line-height: 3.125rem; font-size: 1.25rem; color: #454545; padding: 0 3rem; border-radius: 2rem; margin-bottom: 3.75rem; background: -moz-linear-gradient(left, #cdd0d3 0%, #f0f0ef 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#cdd0d3), color-stop(100%,#f0f0ef)); background: -webkit-linear-gradient(left, #cdd0d3 0%,#f0f0ef 100%); background: -o-linear-gradient(left, #cdd0d3 0%,#f0f0ef 100%); background: -ms-linear-gradient(left, #cdd0d3 0%,#f0f0ef 100%); background: linear-gradient(to right, #cdd0d3 0%,#f0f0ef 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af9472', endColorstr='#8a6d3b',GradientType=0 );} #ys_youshi ul{ margin: 0 -15px;} #ys_youshi ul li{ padding: 0 15px; width: 50%; float: left; margin-bottom: 1.5rem; } #ys_youshi ul li .box{ background: url(../images/zt/ys_youshi_bg01.png) center no-repeat; background-size: cover !important; overflow: hidden; padding: 1.25rem; position: relative; } #ys_youshi ul li .img{ width: 13.75rem; height: 13.75rem; border-radius: 50%; float: right; } #ys_youshi ul li .img img{ transition: 1s;} #ys_youshi ul li .box:hover .img img{ transform: scale(1.1) rotate(.1deg);} #ys_youshi ul li .txt{ float: left; width: calc(100% - 13.75rem); padding: 0 3rem; text-align: right; position: absolute; height: 100%; left: 0; top: 0;} #ys_youshi ul li .txt font{ font-size: 1.875rem; color: #348891; font-family:"Times New Roman", "serif"; font-weight: bold; margin-bottom: 1.75rem; display: block;} #ys_youshi ul li .txt h4{ font-size: 1.5rem; color: #464646; margin-bottom: .625rem; line-height: 2.25rem;} #ys_youshi ul li .txt span{ font-size: 1rem; color: #949398; text-transform: uppercase;} .btn_ys2.page__btn { color: #2a7881 !important;font-family: "Microsoft YaHei"; background: -moz-linear-gradient(left, #fff 0%, #eff0ef 100%); background: -webkit-gradient(linear, left, right, color-stop(0%,#fff), color-stop(100%,#eff0ef)); background: -webkit-linear-gradient(left, #fff 0%,#eff0ef 100%); background: -o-linear-gradient(left, #fff 0%,#eff0ef 100%); background: -ms-linear-gradient(left, #fff 0%,#eff0ef 100%); background: linear-gradient(to right, #fff 0%,#eff0ef 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#eff0ef',GradientType=0 );} .btn_ys2.page__btn span{ background: #a0e8ef;} #ys_youshi ul li.li_1 .box{ border-radius: 0 8rem 8rem 8rem;} #ys_youshi ul li.li_2 .box{ border-radius: 8rem 0 8rem 8rem; background: url(../images/zt/ys_youshi_bg02.png) center no-repeat;} #ys_youshi ul li.li_3 .box{ border-radius: 8rem 8rem 8rem 0;} #ys_youshi ul li.li_4 .box{ border-radius: 8rem 8rem 0 8rem; background: url(../images/zt/ys_youshi_bg02.png) center no-repeat;} #ys_youshi ul li.li_2 .img{ float: left;} #ys_youshi ul li.li_2 .txt{ left: auto; right: 0; text-align: left;} #ys_youshi ul li.li_4 .img{ float: left;} #ys_youshi ul li.li_4 .txt{ left: auto; right: 0; text-align: left;} #ys_good{} #ys_good .box{ position: relative;} #ys_good .hd{ position: absolute; z-index: 9; left: 64%;width: 6.875rem; margin-left: -3.4375rem; height: 100%;} #ys_good .hd ul{} #ys_good .hd ul li{ padding: 10px 0;} #ys_good .hd ul li .box{ width: 6.875rem; height: 6.875rem; border-radius: 50%; text-align: center; cursor: pointer; background: -moz-linear-gradient(top, #d2d2d2 0%, #e7e7e7 100%); background: -webkit-gradient(linear, top, right, color-stop(0%,#d2d2d2), color-stop(100%,#e7e7e7)); background: -webkit-linear-gradient(top, #d2d2d2 0%,#e7e7e7 100%); background: -o-linear-gradient(top, #d2d2d2 0%,#e7e7e7 100%); background: -ms-linear-gradient(top, #d2d2d2 0%,#e7e7e7 100%); background: linear-gradient(to bottom, #d2d2d2 0%,#e7e7e7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2d2d2', endColorstr='#e7e7e7',GradientType=0 ); } #ys_good .hd ul li font{ margin: 0 auto; margin-bottom: .5rem; display: block; width: 1.75rem;} #ys_good .hd ul li font img{ display: inline-block;} #ys_good .hd ul li font img.img01{} #ys_good .hd ul li font img.img02{ display: none;} #ys_good .hd ul li h5{ font-size: 1rem; color: #424242;} #ys_good .hd ul li.slick-current .box{ background: #58b9c3;} #ys_good .hd ul li.slick-current font img.img01{ display: none;} #ys_good .hd ul li.slick-current font img.img02{ display: inline-block;} #ys_good .hd ul li.slick-current h5{ color: #fff;} #ys_good .bd{ position: relative;} #ys_good .bd ul.ul_1{ width: 64%; } #ys_good .bd ul.ul_2{ width: 36%; background: #f1f3f5; position: absolute; right: 0; top: 0; height: 100%;} #ys_good .bd li,#ys_good .bd .slick-list,#ys_good .bd .slick-track{ height: 100%;} #ys_good .bd .txt{ text-align: center; height: 100%;} #ys_good .bd .tt{ text-align: center; display: inline-block;color: #282929; font-family: "微软雅黑"; font-weight: bold;margin-bottom: 2.25rem; position: relative; border: 1px solid #7e7f80;} #ys_good .bd .tt:before { content: ""; position: absolute; bottom: -2px; right: 50%; margin-right:-20px; height: 40px; width: 40px; background-color: #f1f3f5; border: 1px solid #7e7f80; z-index: 2; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); } #ys_good .bd .tt .border{ padding: 2rem 3.75rem; background-color: #f1f3f5; position: relative; z-index: 3;} #ys_good .bd .tt h4{ font-size: 3.5rem; font-weight: bold;} #ys_good .bd .tt b{ font-size: 2.75rem; text-transform: uppercase;} #ys_good .bd h5{ font-size: 1.5rem; color: #282929; margin-bottom: .5rem;} #ys_good .bd span{ font-size: 1rem; text-transform: uppercase; display: block;} #ys_good .bd .page__btn{ width: 12.5rem; line-height: 3.4375rem; height: 3.4375rem; border-radius: 2rem; font-size: 1rem; background: #58b9c3; margin-bottom: 3rem;} #ys_good .bd .page__btn img{ width: 1.375rem; display: inline-block;} #ys_good .bd .page__btn span{ background: #2a7a83; } #ys_good .slick-dots{ bottom:50%; margin-bottom: -14rem;} #ys_good .slick-dots li{ margin:0 2px;} #ys_good .slick-dots li button:before{ content:""; position:relative; display:inline-block; width:.75rem; height:.75rem; border-radius:50%; border:1px solid #8b8c8d; box-sizing:border-box; opacity:1; } #ys_good .slick-dots li.slick-active button:before{ background:#58b9c3;border:1px solid #58b9c3; } #ys_good .bd ul li .tt, #ys_good .bd ul li h5, #ys_good .bd ul li .j_tab_cel>span, #ys_good .bd ul li .page__btn{ transform:translateY(30px); opacity:0; transition:0.4s;} #ys_good .bd ul li.slick-current .tt{ transition:1s 0s; transform:translateY(0); opacity:1;} #ys_good .bd ul li.slick-current h5{ transition:1s 0.2s; transform:translateY(0); opacity:1;} #ys_good .bd ul li.slick-current .j_tab_cel>span{ transition:1s 0.4s; transform:translateY(0); opacity:1;} #ys_good .bd ul li.slick-current .page__btn{ transition:1s 0.6s; transform:translateY(0); opacity:1;} #ys_xuancai{ width: 100%; padding-bottom: 24rem; background: url(../images/zt/ys_xuancai_bg.png) center bottom no-repeat; position: relative; z-index: 9;} #ys_xuancai ul{ margin: 0 -6px; overflow: hidden;} #ys_xuancai ul li{ padding: 0 6px;} #ys_xuancai ul li .box{ border: 1px solid #dbdbe2; background: url(../images/zt/ys_xuancai_li.jpg) center no-repeat; padding-top: 4.5rem; text-align: center;} #ys_xuancai ul li .img{ width: 13.125rem; margin: 0 auto; border-radius: 50%;} #ys_xuancai ul li .img img{ transition: 1s;} #ys_xuancai ul li:hover .img img{ transform: scale(1.1) rotate(.1deg);} #ys_xuancai ul li .txt{ padding-top: 1.625rem; padding-bottom: 3.125rem;} #ys_xuancai ul li .txt h5{ font-size: 1.5rem; color: #272727;font-family: "Microsoft YaHei"; } #ys_xuancai ul li .txt p{ font-size: 1.125rem; color: #525252; margin-top: .875rem; margin-bottom: .25rem; line-height: 1.75rem; height: 3.5rem; padding: 0 5px;} #ys_xuancai ul li .txt a{ height: 2.8125rem; line-height: 2.8125rem; width: 9.375rem; border-radius: 1.5rem; display: block; margin: 0 auto; color: #fff; background: -moz-linear-gradient(top, #46a1ab 0%, #58b9c3 100%); position: relative; z-index: 1; background: -webkit-gradient(linear, top, bottom, color-stop(0%,#46a1ab), color-stop(100%,#58b9c3)); background: -webkit-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -o-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -ms-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: linear-gradient(to bottom, #46a1ab 0%,#58b9c3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46a1ab', endColorstr='#58b9c3',GradientType=0 );} .shili_tel.ys .box{ border: 2px solid #58b9c3;} .shili_tel.ys .box p{ color: #58b9c3;} #ys_xuancai .cao{ display: inline-block; position: absolute; bottom: -2rem; left: 50%; margin-left: -35rem;} #ys_gongyi{ width: 100%; overflow: hidden; background: url(../images/zt/gongyi_bg.jpg) center no-repeat; margin-top: -40rem; position: relative; padding-bottom: 5rem;} #ys_gongyi .m{padding-top:26rem;} #ys_gongyi .deng{ display: inline-block; position: absolute; top: 10rem; right: 1rem; } #ys_gongyi .cao{ display: inline-block; position: absolute; bottom: 27%; left: 0; z-index: 9; width:22.8125rem; } .ys_tt.right{ text-align: center;} .gongyi_list{ margin: 0 -1.25rem;} .gongyi_list li{ width: 33.333%; float: left; padding: 0 1.25rem; margin-top: 10px;} .gongyi_list li .box{ position: relative; z-index: 1; text-align: center;} .gongyi_list li .box:before{ content: ""; display: block; position: absolute; width: 100%; height: 100%; left: 0; top: 0; border: 1px solid #fff;} .gongyi_list li .tt{ background: url(../images/zt/ys_gongyi_li.png) center no-repeat; background-size: 100% 100%; padding-top: 3.125rem; padding-bottom: 7rem; position: relative; z-index: 9;} .gongyi_list li .tt font{ width: 2.8125rem; height: 2.8125rem; margin: 0 auto; display: block;} .gongyi_list li:hover .tt font img{ animation: jello 1s;} .gongyi_list li .tt h5{ font-size: 1.625rem; color: #585d59; margin-top: 1rem; margin-bottom: .5rem;} .gongyi_list li .tt span{ font-size: 1rem; color: #acb0ac; text-transform: uppercase;} .gongyi_list li .txt{ padding-top: 2.5rem; color: #fff; max-width: 350px; padding: 2.25rem 10px 3rem; margin: 0 auto;} .gongyi_list li .txt h5{ font-size: 1.125rem; margin-bottom: 1rem;} .gongyi_list li .txt span{ font-size: .875rem; color: rgba(255,255,255,.5); display: block; line-height: 1.125rem; margin-bottom: 1.25rem;} .gongyi_list li .txt .ys_btn{ height: 2.8125rem; line-height: 2.8125rem; width: 9.375rem; border-radius: 1.5rem; display: block; margin: 0 auto; color: #585d59; position: relative; z-index: 999; background: -moz-linear-gradient(top, #caccd0 0%, #f0f0f0 100%); background: -webkit-gradient(linear, top, bottom, color-stop(0%,#caccd0), color-stop(100%,#f0f0f0)); background: -webkit-linear-gradient(top, #caccd0 0%,#f0f0f0 100%); background: -o-linear-gradient(top, #caccd0 0%,#f0f0f0 100%); background: -ms-linear-gradient(top, #caccd0 0%,#f0f0f0 100%); background: linear-gradient(to bottom, #caccd0 0%,#f0f0f0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#caccd0', endColorstr='#f0f0f0',GradientType=0 );} .ys_xingjiabi_list{ padding-top: 1rem;} .ys_xingjiabi_list li{ float: left; text-align: center; width: 14%; margin: 0 20px;} .ys_xingjiabi_list li .box{ display: inline-block; position: relative; z-index: 1;} .ys_xingjiabi_list li .box:before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 50%; transform: scale(1.1); transition: 0s; background: url(../images/zt/ys_xingjiabi_li.png) center no-repeat; background-size: 100% 100% !important;} .ys_xingjiabi_list li .img{ border-radius: 50%; background: #000;} .ys_xingjiabi_list li .img img{ display: block; opacity: .4;} .ys_xingjiabi_list li .txt{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: .5s; border-radius: 50%; overflow: hidden;} .ys_xingjiabi_list li .txt font{ display: block; width: 2.8125rem; height: 2.8125rem; margin: 0 auto;} .ys_xingjiabi_list li .txt font img{ transition: .5s;} .ys_xingjiabi_list li .txt font img.img02{ display: none;} .ys_xingjiabi_list li .txt p{ font-size: 1.125rem; line-height: 1.875rem; color: #fff; max-width: 15rem; padding: 0 1rem; margin: 0 auto; margin-top: 1rem;} .ys_xingjiabi_list li:hover .txt{ background: url(../images/zt/ys_xingjiabi_hover.png) center no-repeat;background-size: 100% 100% !important;} .ys_xingjiabi_list li:hover .txt font img.img01{ display: none;} .ys_xingjiabi_list li:hover .txt font img.img02{ display: inline-block;} .ys_xingjiabi_list li:hover .txt p{ font-size: 1.125rem; color: #585d59;} .ys_xingjiabi_list li:hover .box:before{ transform: scale(1.1) rotate(360deg);transition: 3s;} #sl_fangan.ys{ background: none; margin-top: -9.5rem;} #sl_fangan.ys .box{padding-left: 3rem; padding-right: 3rem; position: relative; z-index: 1;} #sl_fangan.ys .box:before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../images/zt/zy_kehu_bg.jpg) center no-repeat; background-size: 100% 100%; z-index: -1;} #sl_fangan.ys .box .cao1{ display: inline-block; width:10.125rem; height: 24.125rem; position: absolute; left: -10.125rem; bottom:3rem ; z-index: -2; } #sl_fangan.ys .box .cao2{ display: inline-block; width:14.8125rem; height: 38rem; position: absolute; right: -14.8125rem; bottom:3rem ;z-index: -2; } #sl_fangan.ys .tt h3{ color: #69816c;} #sl_fangan.ys .left_box a{background: -moz-linear-gradient(top, #caccd0 0%, #f0f0f0 100%); color: #585d59 !important; background: -webkit-gradient(linear, top, bottom, color-stop(0%,#caccd0), color-stop(100%,#f0f0f0)); background: -webkit-linear-gradient(top, #caccd0 0%,#f0f0f0 100%); background: -o-linear-gradient(top, #caccd0 0%,#f0f0f0 100%); background: -ms-linear-gradient(top, #caccd0 0%,#f0f0f0 100%); background: linear-gradient(to bottom, #caccd0 0%,#f0f0f0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#caccd0', endColorstr='#f0f0f0',GradientType=0 );} #sl_fangan.ys .left_box a:nth-child(2) { color: #fff !important; background: -moz-linear-gradient(top, #46a1ab 0%, #58b9c3 100%); background: -webkit-gradient(linear, top, bottom, color-stop(0%,#46a1ab), color-stop(100%,#58b9c3)); background: -webkit-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -o-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -ms-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: linear-gradient(to bottom, #46a1ab 0%,#58b9c3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46a1ab', endColorstr='#58b9c3',GradientType=0 ); } #sl_fangan.ys .j_form .btn_tijiao{ color: #fff; background: -moz-linear-gradient(top, #46a1ab 0%, #58b9c3 100%); background: -webkit-gradient(linear, top, bottom, color-stop(0%,#46a1ab), color-stop(100%,#58b9c3)); background: -webkit-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -o-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -ms-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: linear-gradient(to bottom, #46a1ab 0%,#58b9c3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46a1ab', endColorstr='#58b9c3',GradientType=0 );} #sl_fangan.ys .left_box a span{ background: rgba(0,0,0,.3); background: #94a697; mix-blend-mode: overlay;} #sl_fangan.ys .page__btn span{ background: rgba(0,0,0,.3); background: #94a697 !important; mix-blend-mode: overlay;} #n_mian .gssl_bg{background: url(../images/zt/sl_fangan.png) center bottom no-repeat; background-size: cover;} #n_case.ys ul li:hover .txt h5{ color: #58b9c3;} #sl_kehu.ys{ background: url(../images/zt/zy_kehu_bg.jpg) center no-repeat; background-size: cover;} #sl_kehu.ys #s_kehu .he_3DY .txt{background: -moz-linear-gradient(top, #46a1ab 0%, #58b9c3 100%); background: -webkit-gradient(linear, top, bottom, color-stop(0%,#46a1ab), color-stop(100%,#58b9c3)); background: -webkit-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -o-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: -ms-linear-gradient(top, #46a1ab 0%,#58b9c3 100%); background: linear-gradient(to bottom, #46a1ab 0%,#58b9c3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#46a1ab', endColorstr='#58b9c3',GradientType=0 );} .page__btn.btn_ys span{ background: rgba(0,0,0,.3); background: #94a697 !important; mix-blend-mode: overlay;} .ys_btn{ position:relative; z-index:1; transition:.5s; overflow:hidden; overflow: hidden;-webkit-transform:rotate(0deg)} .ys_btn:before{ content:""; display: block; width:0; height:100%; background: rgba(118 ,139 ,120,.17); mix-blend-mode: multiply; position:absolute; z-index:-1; top:0; right:0; transition:.5s;} .ys_btn:hover:before{ width:100%; left: 0; right: auto;} .ys_btn:hover{ color:#fff;} .start_tab{margin:20px auto 0;width:100%;background:#fff; margin-bottom: 2rem;} .start_tab_box{position:relative;float:left;padding:10px 0;width:100%;border-top:1px dashed #ddd} .start_tab_title{position:absolute;top:50%;left:0;float:left;margin:-20px 0 0;width:80px;font-weight:700;font-size:16px;line-height:40px} .start_tab_case{float:left;overflow:hidden;margin:0 0 0 80px;width:85%;/*height:40px*/} .start_tab_case.on{height:auto} .start_tab_case a{float:left;margin:5px 8px 5px 0;padding:0 15px;border-radius:15px;font-size:16px;line-height:30px} .start_tab_case a.on,.start_tab_case a:hover{background:#b91b22;color:#fff} .start_tab_move{position:absolute;top:10px;right:0;display:none;padding:17px 15px 18px 16px;width:9px;height:5px;cursor:pointer} .start_tab_move.on{-webkit-transition:all .5s;transition:all .5s;-webkit-transform:rotate(180deg);transform:rotate(180deg)} .start_tab_box.on .start_tab_move{display:block} .alzs_show_sjst{margin-bottom: 1.5rem; border-bottom: 1px solid #e5e5e5;} .alzs_show_sjst .alzs_show_ima{width: 30%;/*height: 260px;*/float: left;} .alzs_show_sjst .alzs_show_ima img{aspect-ratio: 848/1131;} .alzs_show_sjst .userInfo{float: right; width: 65%;} .p101-info-fdh-title { height: 40px; line-height: 40px; font-size: 22px; color: #1a1a1a; text-align: center; position: relative; padding-bottom: 8px; margin-bottom: 30px; } .p101-info-fdh-title:after { content: ''; position: absolute; width: 36px; height: 2px; background: #9e8360; bottom: 0; left: 50%; margin-left: -18px; } .new-case { position: relative; top: 10px; left: 0; right: 0; margin: 0 auto; text-align: center; width: 160px; height: 33px; background: #9e8360; } .new-case strong { font-size: 20px; line-height: 33px; color: #fff; } .new-somll { position: absolute; left: 165px; top: 26px; width: 6px; height: 7px; background: #9e8360; } .case-tag-boxs { border: 1px solid #d9d9d9; width: 100%; /*height: 13rem;*/ padding-bottom: 2.8rem; margin-bottom: 2rem; padding-top: 2rem; background: url(../images/alzs_nr_topbg.png) center repeat; } .case-tag-boxs li { width: 23%; padding: 24px 0 0 0; margin-left: 5rem; float: left; } .new-siz1 { font-size: 16px; color: #828B8F; width: 235px; display: flex; } .new-sizx1 { display: inline-block; padding-left: 15px; font-size: 16px; color: #9e8360; font-weight: 700; width: 145px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .am-g { margin: 0 auto; width: 100%; } .ab_box_4_2 { color: #434343; } .ab_box_4_2 div { border-left: 1px solid #dcdcdc; padding-left: 30px; margin-bottom: 7rem; width: 32%; display: inline-block; } .ab_box_4_2 strong { display: block; font-size: 18px; padding-bottom: 12px; margin-top: 1.5rem; } .ab_box_4_2 p { font-size: 14px; line-height: 24px; } /*设计师详情页*/ .designer-top-detail { height: 100%; width: 1400px; /*background: #f5f5f5;*/ padding: 5px; -ms-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.01); -o-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.01); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.01); /* padding-bottom: 40px;*/ } .designer-top-detail .designer-img { width: 265px; height: 353px; float: left; /*margin-left: 50px; margin-right: 50px;*/ display: block; /*border: 2px solid #9e8360;*/ margin-top: 40px; } .withOutLazy img { height: 100%; aspect-ratio: 265/353; } .zoomBox img { transition: transform ease .3s 0s; -moz-transition: transform ease .3s 0s; -webkit-transition: transform ease .3s 0s; } .designer-top-detail .designer-msg { float: left; width: 950px; height: 460px; /* margin-left: 25px; */ display: block; margin-top: 40px; } .designer-msg { position: relative; } .designer-top-detail .designer-msg .name { width: 100%; height: 35px; line-height: 35px; position: relative; margin-top: 5px; } .designer-top-detail .designer-msg .name .pl1 { /* position: absolute; */ /*width: 15px;*/ /* height: 24px; */ font-size: 100px; font-weight: normal; font-stretch: normal; line-height: 24px; letter-spacing: 0px; color: #ececec; /* margin-top: 49px; */ margin-left: 14px; display: inline-block; /* vertical-align: top; */ } .designer-top-detail .designer-msg .name .title { /* width: 100px; */ height: 28px; font-size: 30px; font-weight: 700; font-stretch: normal; line-height: 24px; letter-spacing: 0px; color: #333333; /*padding-top: 26px;*/ padding-left: 16px; display: inline-block; } .designer-top-detail .designer-msg .name .subtitle { /* position: absolute;*/ top: 27px; padding: 0 10px; /* left: 125px; */ /* width: 125px; */ height: 25px; background-image: linear-gradient(90deg, #373946 0%, #5c5d6f 100%); border-radius: 12px; margin-left: 30px; display: inline-block; } .designer-top-detail .designer-msg .name .pl2 { line-height: 25px; /* width: 125px; */ height: 13px; font-size: 14px; font-weight: normal; font-stretch: normal; color: #e8dfce; text-align: center; padding: 0 10px; } .desi1 { position: absolute; top: 52px; /*left: -115px;*/ } .designer-top-detail .designer-msg .designer-core { margin-top: 20px; height: 100px; /*border-bottom: 1px dashed #dfdfdf;*/ } .designer-top-detail .designer-msg .designer-core .designer-base { width: 912px; /* margin-top: 20px;*/ } .text-title { color: #212628; } .designer-top-detail .designer-msg .designer-core .designer-base .line1 .jy, .designer-top-detail .designer-msg .designer-core .designer-base .line2 .jy, .designer-top-detail .designer-msg .designer-core .designer-base .line3 .jy, .designer-top-detail .designer-msg .designer-core .designer-base .line4 .jy { width: 350px; margin-top: 15px; margin-left: 20px; font-size: 14px; } .designer-top-detail .designer-msg .designer-core .designer-base .line1, .designer-top-detail .designer-msg .designer-core .designer-base .line2, .designer-top-detail .designer-msg .designer-core .designer-base .line3, .designer-top-detail .designer-msg .designer-core .designer-base .line4 { /* float: left; */ width: 100%; margin-right: 20px; display: inline-block; } .designer-top-detail .designer-msg .designer-core .designer-base .line1 .zp, .designer-top-detail .designer-msg .designer-core .designer-base .line2 .zp, .designer-top-detail .designer-msg .designer-core .designer-base .line3 .zp, .designer-top-detail .designer-msg .designer-core .designer-base .line4 .zp { width: 150px; margin-left: -200px; margin-top: 14px; font-size: 14px; } .div2 { /* position: absolute;*/ /* top: 111px; left: 21px;*/ /*width: 500px !important;*/ margin-top: 15px; margin-left: 10px; } .div2 div { float: left; width: 80px; height: 27px; background-color: #9e8360; border-radius: 14px; text-align: center; margin-left: 10px; } .div2 div span { /* width: 55px; height: 14px;*/ font-size: 14px; font-weight: normal; font-stretch: normal; line-height: 27px; letter-spacing: 0px; color: #ffffff; } .boxg { display: inline-block; width: 100%; margin-top: 15px; margin-left: 20px; } .designer-top-detail .designer-msg .designer-self { width: 100%; overflow: hidden; height: 253px; margin-left: 20px; border-top: 1px dashed #9e8360; margin-top: 20px; padding-top: 20px; } .ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .designer-img .page__btn { display: block; text-align: center; width: 265px; height: 3.3rem; line-height: 3.5rem; border-radius: 3px; margin: 0 auto; color: #fff; font-size: 1.5rem; margin-top: 1.8rem; box-shadow: 1px 3px 7px 0px rgba( 0, 0, 0, .2); } /*设计师详情页*/ /*装修服务页面*/ #s_jjfa { border-bottom: 1px solid #e7e7e9; overflow: hidden; background-color: #efefef; } .floor { padding: 80px 0; } .main_box { margin: 0 auto; width: 1250px; position: relative; } #s_jjfa .content { margin-bottom: 50px; } #s_jjfa dl { position: relative; margin: -6px; } #s_jjfa dd { display: block; float: left; margin: 6px; height: 305px; overflow: hidden; } #s_jjfa dd.li1 { width: 236px; background: #494337; } #s_jjfa dd.li2, #s_jjfa dd.li2 img.pic { width: 495px; } #s_jjfa dd.li3, #s_jjfa dd.li3 img.pic { width: 495px; } #s_jjfa dd.li4, #s_jjfa dd.li4 img.pic { width: 235px; } #s_jjfa dd.li5, #s_jjfa dd.li5 img.pic { width: 242px; } #s_jjfa dd.li6 { width: 242px; background: #d2b068; } #s_jjfa dd.li7, #s_jjfa dd.li7 img.pic { width: 495px; } #s_jjfa dd a { display: block; } #s_jjfa dd.li1 a { padding-left: 35px; text-align: left; padding-top: 78px; } #s_jjfa .title { margin-bottom: 50px; } #s_jjfa dd img.pic { height: 305px; display: block; margin: 0 auto 0 auto; } #s_jjfa dd .text_box { display: table; height: 305px; margin: auto; width: 175px; text-align: center; } #s_jjfa dd .text_box .box { display: table-cell; vertical-align: middle; } #s_jjfa dd .text_box p { line-height: 30px; font-size: 16px; color: #fff; } .ambry-third { width: 100%; padding: 4% 0; overflow: hidden; } .f-in { width: 100%; max-width: 1280px; margin: 0 auto; box-sizing: border-box; } .ambry-third .f-in { position: relative; } .ambry-third .ambry-left { width: 60.93%; float: left; position: relative; z-index: 2; margin: 5% 0 10%; } .ambry-third .ambry-img2 { width: 42.96%; float: right; position: absolute; right: 0; z-index: 1; } .ambry-third .t2 { font-size: 36px; line-height: 1.3; text-align: left; } .ambry-third .t2:after { content: ""; width: 100px; height: 2px; background: #ac2925; display: block; margin: 30px 0; } .ambry-third .ambry-p { width: 75%; line-height: 30px; font-size: 16px; text-align: left; margin: 0; color: #666; } .ambry-third .ambry-img1 { margin-top: 10%; } .ambry-third .ambry-img1 .ambry-img { width: 49%; float: left; margin-right: 2%; position: relative; } .ambry-third .ambry-img1 .ambry-img:last-child { margin-right: 0; } .ambry-img:before, .ambry-second .ambry-tab li, .ambry-seventh .ambry-logo li, .m-life-box .life-img:before, .m-life-box .life-second .life-icon .l-icon, .m-life-style .life-fourth .lift-img { transition: all .3s cubic-bezier(.4,0,.2,1) 0s; } .ambry-img:hover:before { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .ambry-img:before { content: ""; position: absolute; left: 10px; top: 10px; right: 10px; bottom: 10px; box-sizing: border-box; border: 3px solid #fff; -webkit-transform: scale(0); transform: scale(0); opacity: 0; } .ambry-third .ambry-img1 .ambry-img img { width: 100%; } /*老房装修*/ .lfzx_nt_box{opacity: 1; /*width: 1400px;*/ transform: translate3d(0px, 0px, 0px);} .lfzx_nt_box .lfzx_div_dy{width: 349px;} .lfzx_zxgy_div{opacity: 1;/*width: 1400px;*/transform: translate3d(0px, 0px, 0px);} .lfzx_zxgy_div .lfzx_jn_gy{width: 25%;} .box_text{text-align: center;padding-top: 20px;} .box_text p{font-size: 18px;} /*装修服务页面*/ /*banner视频背景*/ .ds-banner-video-bg { height: calc(100vh - 40px); background-size:100% 100%; width: 100%; position: absolute; /*filter: blur(3px);*/ top: 0; left: 0; } .swiper-slide .con { height: 100%; position: absolute; top: 0; left: 0; z-index: 99; width: 100%; } .swiper-slide .con{ height:100%; position: absolute; top:0; left:0; z-index:99; width:100%;} .swiper-slide .img{ height:100%; opacity:1; fiter:alrha(opacity=100); } .swiper-slide .txt{ padding-top: 3rem;} .swiper-slide .txt h3{ text-transform:uppercase; font-size:4rem; color:#fff; margin-bottom:.5rem; } .swiper-slide .txt span{ display: block; font-size:1.75rem; text-transform: uppercase; color:#fff; opacity: .6; font-family: arial;} .swiper-slide .txt i{ display: block; width: 2.875rem; height: 19px; background:url(../images/yanjing.png) center no-repeat; background-size: contain; margin: 0 auto; margin-top: 1.875rem;} .swiper-slide .txt p{ font-size: 1.5rem; color: #fff; margin-top: 1.875rem;} .swiper-slide .m { max-width: 1550px; height: 100%; margin: 0 auto; padding: 0 100px; display: block; position: relative; } /*banner视频背景*/ /*首页公司产品*/ .shjz_yewu{ text-align: center; margin: auto; padding-bottom: 1rem; display: block; padding-top: 6rem; background-color: #f7f7f7; background:url(../images/jjfa_bgt1.png) center no-repeat; } .shjz_yewu .container{ margin: auto; } .shjz_yewu .container h2{ margin: 0px; line-height: 40px; text-align: center; font-size: 2.1875rem; color: #d4042c; font-weight: bold; } .shjz_yewu .container h3{ font-size: 1.25rem; color: #b1b1b1; margin: 1.25rem 0 1.25rem; margin-bottom: 5rem; } .shjz_yewu .container .row{ display: flex; margin-right: -15px; margin-left: -15px; } .shjz_yewu .container .row .nr_ct{ margin-right: 20px; border: 1px solid #dfdfdf; height: 23rem; display: flex; flex-direction: column; justify-content: space-between; flex: 1; background-size: cover; background: #fff; border-radius: 0; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; text-align: center; -webkit-transition: .2s; transition: .2s; } .shjz_yewu .container .row .wmdys{height: 20rem; background: #f9f9f9;border: 1px solid #919191; } .shjz_yewu .container .row .nr_ct .cont{ padding: 2.5rem 2rem 0rem 2rem; } .shjz_yewu .container .row .nr_ct .cont img{ width: 34%; vertical-align: middle; } .shjz_yewu .container .row .wmdys .cont img{ width: 50%; } .shjz_yewu .container .row .nr_ct h3{ font-size: 1.25rem; color: #545454; font-weight: 700; margin-top: 1.5rem; margin-bottom: 1.25rem; } .shjz_yewu .container .row .nr_ct p{ font-size: 14px; color: #707070; text-align: center; line-height: 24px; margin: 0; } .nr_ct:hover { -webkit-box-shadow: 0 4px 12px rgba(0,0,0,.08); box-shadow: 0 4px 12px rgba(0,0,0,.08); z-index: 1; } .wmdys:hover { -webkit-box-shadow: 0 4px 12px rgba(0,0,0,.3); box-shadow: 0 4px 12px rgba(0,0,0,.3); z-index: 1; } .content-bottom:after{ content:""; display:block; width:0; height:2px; background:#bf1a1a; position:absolute; left:50%; /*bottom:1rem;*/ transition:.5s; z-index:-1; } .nr_ct:hover .content-bottom:after{ width:100%; left:0;} .content-bottom{} .content-bottom .btn-primary.btn-fill{ color: #9d9d9d; background-color: #ffffff; width: 210px; height: 3rem; font-size: 1rem; border-radius: 0px; margin-bottom: 2rem; border-width: 0; line-height: 2rem; border: 1px solid #dfdfdf;} #s_case.pad_bot{padding-bottom: 2rem;} .db_more{width: 100%; margin: auto;margin-bottom: 5rem;margin-top: 0rem;} .db_more .cent_more{margin: auto;display: block; border-radius: 0px !important; border-color: #bf1a1a !important; border-width: 1px !important; margin-top: 0rem !important; padding-top: 0;font-size: 1.25rem !important; height: 3rem !important; line-height:2.8rem !important;} /*首页视频*/ .xcp-top2 { height: 8rem; position: relative; } .play { background-size: cover; background-position: center; background-repeat: no-repeat; position: absolute; width: 66px; height: 66px; background-image: url(../images/play.png); top: 50%; left: 50%; margin: -33px 0 0 -33px; } #s_shuzi:hover .play { animation: xz 3s linear both infinite; -webkit-animation: xz 3s linear both infinite; } @keyframes xz{ 0%{transform: rotate(0deg);} 50%{transform: rotate(180deg);} 100%{transform: rotate(360deg);} } /*首页视频结束*/ .web_anli_zl{position: relative;z-index: 1;} .web_anlit:after{left: 0%; bottom: 0.5rem; height: 3px;} .shjz_yewu .container .web_zal .nr_ct{ height: 24rem;} .shjz_yewu .container .web_zal .nr_ct a { font-size: 1.25rem; color: #545454; font-weight: 700; margin-top: 1.7rem; margin-bottom: 1.25rem; text-align: left; display: block; padding: 0rem 2rem; } .shjz_yewu .container .web_zal .w_img_a a{margin-top: 0rem;margin-bottom: 0rem;padding: 0;} .shjz_yewu .container .web_zal .nr_ct .cont{padding: 0rem;} .shjz_yewu .container .web_zal .nr_ct .cont img{width: 100%; vertical-align: middle;} .shjz_yewu .container .web_zal .nr_ct:hover a{color: #bf1a1a;} .shjz_yewu .container .web_zal .nr_ct p{text-align: left; padding: 0rem 2rem;} /*解决方案内容样式开始*/ .jjfa_bt_jianjie{font-size: 14px; text-align: left;margin: auto;width: 100%;} .jjfa_bt_jianjie .btp_jj{color: #383F3F;font-size: 30px;font-weight: bold;} .jjfa_bt_jianjie .btp_jj .btsz01{ background-image: linear-gradient( to right,#ee540c 0%, #fbbc43 50%, rgba(251,180,67) 100%); -webkit-background-clip: text; color: transparent;} .jjfa_bt_jianjie .btp_jj .btsz02{ background-image: linear-gradient( to right,#0e7ab9 0%, #08d1db 50%, rgb(56 244 255) 100%); -webkit-background-clip: text; color: transparent;} .jjfa_bt_jianjie .btp_jj .btsz03{ background-image: linear-gradient( to right,#b3059d 0%, #fb8efd 50%, rgb(254 27 255) 100%); -webkit-background-clip: text; color: transparent;} .jjfa_bt_jianjie .btp_jj .btsz04{ background-image: linear-gradient( to right,#04af11 0%, #03ff17 50%, rgb(177 255 108) 100%); -webkit-background-clip: text; color: transparent;} .jjfa_nr_fr{margin-top: 2rem; margin-bottom: 5rem;} .jjfa_nr_fr .jjfa_nr_l{float: left;width: 60%;display: block;} .jjfa_nr_fr .jjfa_nr_l p{ color: #707070; padding-right: 2rem; font-size: 16px; line-height: 2.3rem;} .jjfa_nr_fr .jjfa_nr_r{float: right;width: 38%;display: block;} #player1-mode{display: none;} #n_news_xq .jjfa_spbfq{width: 1152px; margin: auto; height: 648px;margin-bottom: 5rem;} #n_news_xq .jjfa_spbfq_sj{display: none;width: 648px; margin: auto; height: 270px;} /*#s_kehu .txt .j_tab_cel{background:url( "../images/APP_BG.jpg") center no-repeat; background-size: 100%;}*/ /*首页公司产品*/ /*网站服务详情页banner*/ .web-container01{width: 1400px; margin: auto; margin-top: 6rem; margin-bottom: 5rem; } .web-row{width: 1400px;margin-top: 15rem;} .web_table{ width: 40%; height: 100%; text-align: left; float: left;} .web_banner_right { float: right; width: 60%; } .web_table .left .h4 { font-size: 2.25rem; color: #fff; margin: 1.875rem 0 4rem; font-weight: bold; position: relative; } .web_table .left .h4:before { content: ""; position: absolute; left: 0; bottom: -2rem; height: 2px; background: #fff; width: 4rem; } .web_table .left .h6 { font-size: 1rem; color: #fff; text-transform: uppercase; margin-bottom: 0; } .web_table .btn-primary.btn-fill{color: #ffffff; border-color: #ffffff; background-color: #fff0;} .web_table .btn-primary.btn-fill:hover{color: #4ea0a8; background-color: white;} .web_angd .container h2 { margin: 0px; line-height: 40px; text-align: left; font-size: 2.1875rem; color: #121212; font-weight: bold; margin-bottom: 5rem; } .shjz_yewu .container .w_lump2{display: none;} .web_angd{background-image: none;} /*网站建设案例页面*/ .shjz_yewu .container .row .web_zs_nr{float: left; width: 23%;margin-right: 1.5rem; margin-bottom: 3rem;} .shjz_yewu .container .web_allm{display: block; } /*技术支持*/ /*#jszz{margin-bottom: 2rem;}*/ #jszz .jszz_logo{ float: left; width: 15%; margin-right: 1.5%; } /*小程序页面样式*/ .xcx_top .xcx_top_lh{float: left; width: 20%;} .shjz_yewu .xcx_top{position: relative; top: -4.8rem; z-index: 99; max-width: 1200px;background-color: #fff; height: 9.5rem;padding-top: 2.5rem;} .xcx_top .xcx_top_lh .xcx_top_lh_h2:after{width: 1px; height: 35px; background-color: #bcddf5; display: table; position: relative;top:-3rem; content: " ";} .xcx_top .af_1_no .xcx_top_lh_h2:after{width: 0px;} .xcx_top .xcx_top_lh .xcx_top_lh_h1{color: #2d80d7;line-height: 1.8rem;font-weight: 700;font-size: 1.8rem;} .xcx_top .xcx_top_lh .xcx_top_lh_h2{color: #939393;line-height: 1.5rem;font-size: 1.5rem;margin-top: 1rem;} .shjz_yewu .xcx_top{ -webkit-box-shadow: 0 4px 12px rgba(0,0,0,.2); box-shadow: 0 4px 12px rgba(0,0,0,.2); z-index: 1; } .shjz_yewu .container .xcx_top_d{display: block; margin-right: 0; margin-left: 0;} .category-items-detail{margin-top: 1.5rem;} @media (max-width: 767px){ .shjz_yewu .container .xcx_top_d{ display: block; margin: 0rem !important; margin-bottom: 0rem; } .xcx_top .xcx_top_lh .xcx_top_lh_h2 { color: #939393; line-height: 1.2rem; font-size: 1.2rem; margin-top: 0.6rem; } .shjz_yewu .xcx_top{ padding-top: 3rem;} .category-items-detail{margin-top: 3rem;} } .category-items-detail .category-items-detail-img{margin: auto;display: block;width: 4.5rem;height: 4.5rem;} .category-items-detail .category-items-detail-title{margin-top: 1rem; color: #191919; text-align: center; font-size: 1.2rem; font-weight: 400; color: #191919; line-height: 2rem;} .xcx_ysw{background-color: #ffffff;padding-top: 0rem;background: none;} .xcx_ysw .container .row .wmdys{background:none; border: 1px solid #dfdfdf;} .xcx_ysw .container .row .nobr_mb{ border: 0px solid #dfdfdf;} .xcx_ysw .container .row .nobr_mb:hover{box-shadow: none;} .xcx_ysw .container .row .nobr_mb .img{width: 60px; height: 60px; display: block;margin: auto;} .xcx_ysw .container .row .nobr_mb img{width: 60px !important; height: 60px !important;} /*TAB*/ .xcx_bigBox { width: 100%; height: 100%; margin: 0 auto; box-sizing: border-box;margin-top: 30px;padding-top: 20px; } .xcx_bigBox ul { height: 50px; display: flex; justify-content: space-evenly; border-bottom: 1px solid #dfdfdf; } .xcx_bigBox ul li { width: 100%; background: #fff; display: flex; justify-content: space-evenly; align-items: center; transition:all .7s ease 0s; position: relative; } .xcx_bigBox ul li:hover{ background-color: skyblue;cursor: pointer } .xcx_box { width: 100%; height: 18rem; margin: 0.8rem auto; overflow: hidden; } .xcx_box>div { width: 100%; height: 100%; } .xcx_active { background: #2d80d7 !important; /*按钮on状态*/ } @media (max-width: 767px){ .xcx_box { width: 100%; height: 60rem; } } .xcx_ysw .xcx_bigBox ul li h3{ font-size: 1.25rem; color: #252b3a; margin: auto; margin-bottom:auto; } .xcx_ysw .xcx_bigBox ul li:hover h3{color: #fff;} .xcx_bigBox ul li.xcx_active h3{color: #fff;} @media (max-width: 767px){ .shjz_yewu .container .xcx_box .row { display: block; margin: 0.2rem; margin-bottom: 0rem; } } .xcx_box .xcx_anlzs_ul{display: block; background-color: #fff;padding: 2rem;border-bottom: 0px solid #dfdfdf;height: 100% !important;} .xcx_box .xcx_anlzs_ul .xcx_anlzs_li{float: left; margin: 1rem 1rem;width: 22.6%;border: 1px solid #dfdfdf;transition: all 0.3s ease 0s; padding: 2rem; } .xcx_box .xcx_anlzs_ul .xcx_anlzs_li:hover{box-shadow: 0px 0px 18px rgba(0,0,0,.2); transition: all 0.3s ease 0s; background-color: #fff;} #a2{height: 100% !important;} .xcx_box .xcx_anlzs_ul .xcx_anlzs_li .xcx_anlzs_img{ max-width: 100%; max-height: 427px;} @media (max-width: 767px){ .xcx_ysw .container .row .xcx_yslm{height: 22rem !important;} .xcx_box .xcx_anlzs_ul{padding: 1rem;} .xcx_box .xcx_anlzs_ul .xcx_anlzs_li{float: left; margin: 1rem 0.2rem;width: 47.6%;border: 1px solid #dfdfdf;transition: all 0.3s ease 0s; padding: 1rem 0.5rem; } } .xcx_alzsbox { width: 100%; height: 100%; margin: 0 auto; box-sizing: border-box;margin-top: 30px;padding-top: 20px; } .xcx_alzsbox ul { height: 50px; display: block; justify-content: space-evenly; border-bottom: 0px solid #dfdfdf; } .xcx_alzsbox ul li { padding:0 28px;margin-right:19px;margin-bottom:20px;line-height:34px;border:1px solid #dcdcdc;border-radius:5px;font-size:16px;color:#333;display:inline-block; float:left;width: auto; } .xcx_alzsbox ul li:hover{ background:#256ffc;color:#fff;border:1px solid #256ffc; } .xcx_alzsbox ul .xcx_active { background:#256ffc !important;color:#fff;border:1px solid #256ffc;/*按钮on状态*/ } @media (max-width: 767px){ .xcx_alzsbox ul li { display: inline-block; width: 23%; margin-right: 2%; float: left; font-size: 14px; padding: 0px; text-align: center; margin-bottom: 6px; } #banner .xcx_banner_wap{background-image: url(../images/banner_xcx_wap.jpg) !important;} } .xcx_box2 { width: 100%; height: 18rem; margin: 0.8rem auto; overflow: hidden; }